/* 줄이기 착륙선 (/grammar/participle/lander.jsp, 2026-10-19). 틀(.pa-*)은 css/ps2-participle-arcade.css, 여기는 색 · 로비 그림 · 원래 문장(.pla-*) */
#main .gi .pa--lander { --pa-bg1: #070a1f; --pa-bg2: #1c1f52; --pa-glow: #93c5fd; --pa-halo: rgba(147, 197, 253, .26); --pa-win: #1e40af; --pa-accent: #2563eb; }

/* 로비 그림: 별이 뜬 하늘 아래 달 표면, 높이가 다른 착륙장 둘. 착륙선이 불꽃을 뿜으며 내려와 맞는 말(Not knowing)의 착륙장에 사뿐히 선다 */
#main .gi .pa--lander .pa-hero__art { height: 250px; background: radial-gradient(120% 90% at 30% 0%, #23285e 0%, #0a0d26 55%, #02040f 100%); box-shadow: inset 0 0 0 1.5px rgba(147, 197, 253, .3); }
#main .gi .pa--lander .pla-hero__stars { position: absolute; inset: 0; background-image: radial-gradient(1.2px 1.2px at 12% 18%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 28% 40%, #fff 50%, transparent 51%),
    radial-gradient(1.4px 1.4px at 46% 12%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 64% 30%, #fff 50%, transparent 51%), radial-gradient(1.2px 1.2px at 78% 52%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 90% 22%, #fff 50%, transparent 51%), radial-gradient(1px 1px at 8% 56%, #fff 50%, transparent 51%), radial-gradient(1.3px 1.3px at 38% 62%, #fff 50%, transparent 51%);
    opacity: .85; animation: pla-twinkle 3.2s ease-in-out infinite alternate; }
#main .gi .pa--lander .pla-hero__planet { position: absolute; right: 10%; top: 10%; width: 44px; height: 44px; border-radius: 50%;
    background: radial-gradient(circle at 35% 35%, #bfdbfe 0, #3b82f6 45%, #1e3a8a 100%); box-shadow: 0 0 22px rgba(147, 197, 253, .7), inset -10px -6px 0 rgba(2, 6, 23, .45); }
#main .gi .pa--lander .pla-hero__ground { position: absolute; left: 0; right: 0; bottom: 0; height: 34%;
    background: linear-gradient(180deg, #a8b0bd 0%, #1f2937 100%); clip-path: polygon(0 34%, 10% 22%, 18% 30%, 22% 18%, 40% 18%, 46% 34%, 54% 26%, 60% 44%, 64% 46%, 84% 46%, 90% 30%, 100% 38%, 100% 100%, 0 100%); }
#main .gi .pa--lander .pla-hero__pad { position: absolute; height: 6px; border-radius: 2px; background: linear-gradient(180deg, #e2e8f0, #475569); }
#main .gi .pa--lander .pla-hero__pad::before, #main .gi .pa--lander .pla-hero__pad::after { content: ""; position: absolute; top: -6px; width: 6px; height: 6px; border-radius: 50%; background: #22d3ee; box-shadow: 0 0 8px #22d3ee;
    animation: pla-blink 1s ease-in-out infinite alternate; }
#main .gi .pa--lander .pla-hero__pad::before { left: -3px; }
#main .gi .pa--lander .pla-hero__pad::after { right: -3px; }
#main .gi .pa--lander .pla-hero__pad--1 { left: 22%; width: 18%; top: calc(66% + 6%); }
#main .gi .pa--lander .pla-hero__pad--2 { left: 64%; width: 20%; top: calc(66% + 15.6%); }
#main .gi .pa--lander .pla-hero__pad b { position: absolute; left: 50%; top: 12px; transform: translateX(-50%); white-space: nowrap; padding: 3px 9px; border-radius: 8px;
    font-size: 12px; font-weight: 900; color: #fff; background: rgba(6, 10, 26, .9); box-shadow: 0 0 0 1.5px rgba(147, 197, 253, .8); }
#main .gi .pa--lander .pla-hero__pad--1 b { animation: pla-label 4.6s ease-out infinite; }
#main .gi .pa--lander .pla-hero__ship { position: absolute; z-index: 2; left: 31%; top: 72%; width: 26px; height: 30px; margin: -30px 0 0 -13px; animation: pla-descend 4.6s cubic-bezier(.3, .1, .3, 1) infinite; }
#main .gi .pa--lander .pla-hero__ship::before { content: ""; position: absolute; left: 4px; top: 0; width: 18px; height: 14px; border-radius: 6px; background: linear-gradient(135deg, #fff, #94a3b8);
    box-shadow: inset 0 0 0 4px transparent; }
#main .gi .pa--lander .pla-hero__ship::after { content: ""; position: absolute; left: 3px; top: 13px; width: 20px; height: 9px; background: linear-gradient(90deg, #92400e, #fbbf24 45%, #b45309);
    clip-path: polygon(0 0, 100% 0, 90% 100%, 10% 100%); }
#main .gi .pa--lander .pla-hero__ship i { position: absolute; left: 9px; top: 22px; width: 8px; height: 20px; border-radius: 0 0 50% 50%;
    background: linear-gradient(180deg, #fff 0%, #fde047 35%, rgba(249, 115, 22, 0) 100%); transform-origin: 50% 0; animation: pla-flame 4.6s linear infinite; }
#main .gi .pa--lander .pla-hero__pop { position: absolute; z-index: 3; left: 31%; top: 46%; transform: translateX(-50%); white-space: nowrap; font-weight: 900; font-size: 19px; color: #fde68a;
    text-shadow: 0 2px 10px rgba(2, 6, 23, .9); opacity: 0; animation: pla-pop 4.6s ease-out infinite; }
@keyframes pla-twinkle { from { opacity: .55; } to { opacity: .95; } }
@keyframes pla-blink { from { opacity: .35; } to { opacity: 1; } }
@keyframes pla-descend { 0% { top: 6%; left: 60%; transform: rotate(-14deg); opacity: 0; } 8% { opacity: 1; } 40% { top: 42%; left: 38%; transform: rotate(10deg); }
    62%, 86% { top: 72%; left: 31%; transform: rotate(0); opacity: 1; } 94%, 100% { top: 72%; left: 31%; transform: rotate(0); opacity: 0; } }
@keyframes pla-flame { 0%, 54% { transform: scaleY(1); opacity: 1; } 60%, 100% { transform: scaleY(0); opacity: 0; } }
@keyframes pla-label { 0%, 60% { box-shadow: 0 0 0 1.5px rgba(147, 197, 253, .8); color: #fff; } 64%, 88% { box-shadow: 0 0 0 2px #fde68a, 0 0 18px rgba(253, 230, 138, .7); color: #fde68a; } 94%, 100% { box-shadow: 0 0 0 1.5px rgba(147, 197, 253, .8); color: #fff; } }
@keyframes pla-pop { 0%, 62% { opacity: 0; transform: translate(-50%, 10px); } 66%, 86% { opacity: 1; transform: translate(-50%, 0); } 94%, 100% { opacity: 0; transform: translate(-50%, -14px); } }

/* 한 판: 원래 문장 · 줄인 문장 */
#main .gi .pa--lander .pa-side { display: none; }
#main .gi .pa--lander .pla-cv { touch-action: none; -webkit-touch-callout: none; }
#main .gi .pa--lander .pa-q { gap: 5px; }
#main .gi .pa--lander .pla-src { margin: 0; font-size: 13.5px; line-height: 1.55; color: rgba(255, 255, 255, .7); font-weight: 600; }
#main .gi .pa--lander .pla-src__tag { display: inline-block; margin-right: 7px; padding: 0 8px; border-radius: 999px; background: rgba(147, 197, 253, .18); color: #bfdbfe; font-size: 11.5px; font-weight: 800; vertical-align: 1px; }
#main .gi .pa--lander .pa-q .pla-ask.pa-sent { color: #fff; text-align: center; font-size: clamp(16px, 2.2vw, 20px); }
#main .gi .pa--lander .pa-q .pla-ask.pa-sent mark { background: rgba(253, 230, 138, .2); color: #fde68a; }
#main .gi .pa--lander .pla-pad--main { min-width: 96px; }
#main .gi .pa--lander .pa-pad { user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }

/* 카드 · 결과: 원래 문장을 위에 작게 */
#main .gi .pa--lander .pla-full { display: grid; gap: 4px; }
#main .gi .pa--lander .pla-full__src { margin: 0; font-size: 13.5px; line-height: 1.5; color: #64748b; }
#main .gi .pa--lander .pla-full__src span { display: inline-block; margin-right: 6px; padding: 0 7px; border-radius: 999px; background: #e0e7ff; color: #3730a3; font-size: 11.5px; font-weight: 800; }

/* '왜' 카드: 고른 말만 붉게, '다음' 줄은 카드 아래에 붙여 늘 보이게 (휴대폰에서 카드가 길어도) */
#main .gi .pa--lander .pla-mine mark { padding: 1px 7px; border-radius: 6px; background: #fee2e2; color: #991b1b; font-weight: 800; font-size: 15px; }
#main .gi .pa--lander .pa-card__row { position: sticky; bottom: 0; margin: 12px -18px -16px; padding: 10px 18px 14px; background: #fff; border-top: 1px solid #f1f5f9; }

@media (max-width: 760px) {
    #main .gi .pa--lander .pa-card { padding: 13px 14px 16px; }
    #main .gi .pa--lander .pa-card__row { margin: 10px -14px -16px; padding: 9px 14px 13px; }
    #main .gi .pa--lander .pa-card .pa-sent { font-size: 16px; }
    #main .gi .pa--lander .pa-card__why { font-size: 14px; padding: 8px 10px; }
    #main .gi .pa--lander .pla-full__src { font-size: 12.5px; }
    #main .gi .pa--lander .pa-hero__art { height: 210px; }
    #main .gi .pa--lander .pla-hero__pad b { font-size: 11px; }
    #main .gi .pa--lander .pla-src { font-size: 12.5px; }
    #main .gi .pa--lander .pa-q { padding: 9px 12px; }
}
@media (prefers-reduced-motion: reduce) {
    #main .gi .pa--lander .pla-hero__ship { animation: none; top: 72%; left: 31%; }
    #main .gi .pa--lander .pla-hero__ship i { display: none; }
    #main .gi .pa--lander .pla-hero__pop { animation: none; opacity: 1; }
}