/* 도시 비행의 투명 계기판과 모든 화면 크기의 조작 단추를 정돈한다. */
.challenges{border:1px solid var(--line);border-radius:6px;margin:0 0 16px;padding:12px;display:grid;grid-template-columns:1fr 1fr;gap:12px 8px}.challenges legend{font-size:14px;color:var(--mint)}.challenges legend span{display:block;font-size:14px;color:var(--muted);padding:4px 0}.challenges label{display:flex;gap:7px;align-items:start;font-size:14px;cursor:pointer;min-height:38px}.challenges input{accent-color:var(--mint);width:16px;height:16px;margin:0;flex-shrink:0}.challenges small{display:block;font-size:14px;line-height:1.5;color:var(--muted);margin-top:4px}.mission-card{position:absolute;top:323px;left:36px;width:285px;background:var(--panel);border:1px solid var(--line);border-radius:9px;padding:15px 17px;pointer-events:none;backdrop-filter:blur(12px)}.mission-card small{display:block;font-size:14px;color:var(--mint);letter-spacing:1px;margin-bottom:8px}.mission-card strong{display:block;font-size:16px;margin-bottom:8px}.mission-card>span{font-size:14px;color:var(--mint)}.mission-card p{font-size:14px;line-height:1.7;color:#c3d8d0;margin:7px 0}.goal{display:flex;align-items:center;gap:12px;font-size:14px;color:#e9fff6}.goal b{display:inline-block;font-size:26px;width:24px;text-align:center;color:var(--mint)}#challenge-status{color:#ffdb9a;margin-bottom:0;min-height:17px}
@media(max-width:680px){.mission-card{top:330px;left:18px;width:calc(100% - 150px);max-width:285px;padding:11px 12px}.mission-card strong{font-size:14px;margin-bottom:5px}.mission-card>span,.mission-card p,.goal{font-size:14px}.mission-card small{font-size:14px;margin-bottom:5px}.mission-card p{margin:5px 0}.goal b{font-size:20px}.challenges{padding:10px;gap:8px}.challenges label{font-size:14px}}
@media(max-height:650px){.mission-card{top:315px;padding:10px 12px}.mission-card>p:not(#challenge-status){display:none}}
@media(max-height:500px){.mission-card{top:230px;left:18px;width:255px;padding:8px 12px}.mission-card small,.mission-card>p,#challenge-status{display:none}.mission-card strong{font-size:14px;margin-bottom:4px}.mission-card>span,.goal{font-size:14px}.goal b{font-size:18px}}
@media(max-height:600px) and (max-width:680px){.mission-card{top:327px;left:18px;right:18px;width:auto;max-width:none;padding:8px 12px}.mission-card small,.mission-card>p{display:none}.mission-card strong{font-size:14px}.mission-card .goal{position:absolute;right:12px;top:8px;max-width:46%}.mission-card .goal b{font-size:18px}.mission-card .goal span{font-size:14px}}
.steer .key-wide{font-size:14px;font-weight:700;letter-spacing:-.4px}
#track-race{pointer-events:auto;background:#153c43;color:var(--mint);border:1px solid var(--line);border-radius:4px;font-size:14px;min-height:32px;padding:6px 10px;margin-top:9px}
:root{color-scheme:dark;--mint:#8bffe0;--paper:#f0f7f3;--muted:#afc6c3;--ink:#07111c;--line:#aadfd22e;--panel:#081922a8;font-family:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Noto Sans KR",sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--ink);color:var(--paper)}button,a,input,select{-webkit-tap-highlight-color:transparent}button,a,select{touch-action:manipulation}button,select{font:inherit;color:inherit}button{cursor:pointer;border:0}button:disabled{cursor:default}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--mint);outline-offset:4px}a{color:inherit;text-decoration:none}[hidden]{display:none!important}
#game{height:100svh;position:relative;overflow:hidden}#world{width:100%;height:100%;display:block;touch-action:none}.vignette{position:absolute;inset:0;background:linear-gradient(90deg,#04101ef0,transparent 78%),linear-gradient(0deg,#04101eb3,transparent 40%);pointer-events:none;transition:opacity .7s}body.flying .vignette{opacity:.35}
.masthead{position:absolute;inset:0 0 auto;display:flex;justify-content:space-between;align-items:center;padding:max(24px,env(safe-area-inset-top)) max(36px,env(safe-area-inset-right)) 18px max(36px,env(safe-area-inset-left));z-index:6;gap:12px}.wordmark{font-size:17px;font-weight:700;letter-spacing:-.5px}.wordmark span{font-size:14px;letter-spacing:2px;color:var(--mint);margin-left:12px;font-weight:400}.tools{display:flex;gap:8px}.tools button{min-height:44px;border:1px solid var(--line);border-radius:30px;padding:10px 15px;background:#08131d85;color:#d2e2de;font-size:14px;backdrop-filter:blur(12px)}
.overlay{position:absolute;inset:0;z-index:4}#intro{overflow-y:auto;scrollbar-width:thin}.intro-copy{position:relative;left:clamp(28px,7vw,110px);margin-top:clamp(102px,14vh,145px);width:min(500px,calc(100% - 56px));padding-bottom:78px}.eyebrow{font-size:14px;letter-spacing:2px;color:var(--mint);margin:0 0 18px;font-weight:700}.eyebrow>span{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--mint);margin-right:9px;box-shadow:0 0 16px var(--mint)}h1{font-size:clamp(56px,6.5vw,88px);line-height:1.04;letter-spacing:-4.8px;font-weight:900;margin:0 0 22px}em{font-style:normal;color:var(--mint)}.lead{font-size:16px;line-height:1.7;color:#c0d0d2;margin:0 0 22px;letter-spacing:-.3px}
.mission{display:flex;gap:22px;list-style:none;padding:0;margin:0 0 25px;counter-reset:steps}.mission li{counter-increment:steps;border-top:1px solid var(--line);padding-top:10px;min-width:110px}.mission li:before{content:"0" counter(steps);font-size:14px;letter-spacing:2px;color:var(--mint);display:block;margin-bottom:6px}.mission b{font-size:14px;font-weight:700}.mission li>span{display:block;color:#a8bfba;font-size:14px;margin-top:5px}
.mode-picker{max-width:340px;margin-bottom:18px}.mode-picker label{display:block;font-size:14px;letter-spacing:1px;color:var(--muted);margin-bottom:7px}.mode-picker select{width:100%;min-height:45px;border:1px solid #9fd7c84d;border-radius:5px;background:#091d27e6;padding:10px 13px;font-size:14px;font-weight:700;cursor:pointer}.mode-picker p{font-size:14px;line-height:1.65;color:#afc6c3;margin:8px 0 0}
.primary{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:16px 21px;min-height:54px;border-radius:5px;background:var(--mint);color:#062522;font-size:15px;font-weight:700;min-width:280px;box-shadow:0 6px 36px #34d7b318;transition:background .2s,transform .2s}.launch-panel>.primary{width:340px;max-width:100%}.primary:hover:not(:disabled){background:#c6ffed;transform:translateY(-2px)}.primary:disabled{background:#849e9d;color:#132923}.primary span{font-size:23px;font-weight:400}.controls{font-size:14px;line-height:1.9;color:#b2c6c4;margin:16px 0 12px}kbd{font:inherit;font-size:14px;color:#ddf1e8;background:#c2fff00d;border:1px solid var(--line);border-radius:3px;padding:2px 4px}.motion{display:flex;align-items:center;flex-wrap:wrap;gap:8px;min-height:28px;font-size:14px;color:#cadad5;cursor:pointer}.motion input{accent-color:var(--mint);width:16px;height:16px;margin:0}.motion>span{font-size:14px;color:#a3bbb5}.intro-meta{position:absolute;left:36px;right:36px;bottom:22px;display:flex;justify-content:space-between;gap:15px;font-size:14px;letter-spacing:2px;color:#abc4bf;pointer-events:none}.intro-meta span:last-child{letter-spacing:0}
.stats,.route{position:absolute;background:var(--panel);border:1px solid var(--line);border-radius:9px;backdrop-filter:blur(14px)}.stats{top:96px;left:36px;display:flex;gap:32px;padding:18px 22px}.stats small,.result-stats small{font-size:14px;letter-spacing:1px;color:#b3cbc6;display:block;margin-bottom:8px}.stats strong{font-size:30px;line-height:1;font-variant-numeric:tabular-nums;letter-spacing:-1px}.stats strong span{font-size:14px;letter-spacing:1px;color:var(--mint);font-weight:400}.route{top:96px;right:36px;width:255px;padding:18px 20px}.route-label{display:flex;justify-content:space-between;gap:15px;font-size:14px;color:#d3e7df;margin-bottom:15px}.route-label span:last-child{font-variant-numeric:tabular-nums}.route-track{height:3px;background:#9cb7b52f;position:relative}.route-track i{display:block;width:0;height:100%;background:var(--mint);box-shadow:0 0 12px #79ffdd80}.route-track b{position:absolute;right:0;top:-3px;width:8px;height:8px;border:1px solid var(--mint);transform:rotate(45deg)}

.dialog-layer{display:grid;place-items:center;background:#07111b91;backdrop-filter:blur(8px);z-index:8;padding:28px max(18px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom));overflow:auto}.result-layer{background:linear-gradient(90deg,#05111ce6,#05111c50);backdrop-filter:blur(3px)}.card{width:min(440px,100%);padding:32px;background:#07151be0;border:1px solid #95d3c540;border-radius:12px;box-shadow:0 24px 80px #0004}.card .eyebrow{font-size:14px;margin-bottom:17px}h2{font-size:36px;line-height:1.2;letter-spacing:-1.6px;margin:0 0 18px}.card p:not(.eyebrow){color:#b7d0c7;font-size:14px;line-height:1.8}.card .primary{width:100%;min-width:0;margin-top:26px}.secondary{background:transparent;color:#bddad0;font-size:14px;text-align:center;padding:15px 0;width:100%;min-height:44px}.secondary:hover{text-decoration:underline;text-underline-offset:4px}.result-stats{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--line);padding-top:22px;margin-top:23px}.result-stats strong{font-size:26px;font-variant-numeric:tabular-nums}.prototype-note{font-size:14px!important;text-align:center;margin:3px 0 0}
dialog{background:#091a23;color:var(--paper);border:1px solid #79ffdd55;border-radius:12px;padding:40px;max-width:min(530px,calc(100vw - 28px));max-height:85svh;overflow:auto}dialog::backdrop{background:#02080dcc;backdrop-filter:blur(8px)}dialog h2{font-size:30px}dialog p{font-size:14px;line-height:1.9;color:#bed7cd}dialog strong{color:var(--paper)}dialog .primary{font-size:14px;min-width:0;margin-top:26px}.close{position:absolute;right:8px;top:7px;width:44px;height:44px;background:none;color:#c7e9da;font-size:28px}.no-script{position:absolute;inset:0;z-index:20;display:grid;place-items:center;background:#08131d;padding:30px}
@media(max-width:680px){.masthead{padding:max(16px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) 12px max(18px,env(safe-area-inset-left))}.wordmark{font-size:15px}.wordmark span{font-size:14px;margin-left:7px;letter-spacing:1px}.tools{gap:5px}.tools button{padding:8px 10px;font-size:14px}.intro-copy{left:25px;width:calc(100% - 50px);margin-top:96px;padding-bottom:65px}.eyebrow{font-size:14px;letter-spacing:1.5px;margin-bottom:17px}h1{font-size:62px;letter-spacing:-4px;margin-bottom:18px}.lead{font-size:14px;margin-bottom:19px}.mission{gap:16px;margin-bottom:20px}.mission li{min-width:0;flex:1;padding-top:9px}.mission b{font-size:14px}.mission li>span{font-size:14px}.mode-picker{margin-bottom:14px}.mode-picker p{font-size:14px}.primary{padding:14px 18px;font-size:14px;min-width:0}.controls{font-size:14px;margin-top:13px}.motion{font-size:14px;gap:7px}.motion>span{font-size:14px}.intro-meta{left:25px;right:25px;bottom:17px;font-size:14px;letter-spacing:1px}.intro-meta span:first-child{display:none}.stats{left:18px;top:82px;gap:24px;padding:14px 16px}.stats strong{font-size:27px}.route{top:167px;left:18px;right:18px;width:auto;padding:12px 16px}.route-label{font-size:14px;margin-bottom:10px}.card{padding:26px}h2{font-size:32px}.result-stats strong{font-size:23px}.result-stats small{font-size:14px}.card .primary{margin-top:22px}dialog{padding:34px 24px}}
@media(max-height:740px){.intro-copy{margin-top:90px}.intro-copy .eyebrow{margin-bottom:12px}h1{font-size:58px;margin-bottom:14px}.lead{font-size:14px;margin-bottom:16px}.mission{margin-bottom:15px}.mission li:before{margin-bottom:4px}.mode-picker{margin-bottom:12px}.controls{margin-top:12px}.intro-meta{display:none}.intro-copy{padding-bottom:28px}}
@media(max-height:500px) and (min-width:681px){.masthead{padding-top:max(12px,env(safe-area-inset-top));padding-bottom:10px}.intro-copy{margin-top:78px;left:max(28px,env(safe-area-inset-left));width:calc(100% - 56px);max-width:750px;display:grid;grid-template-columns:1.05fr 1fr;column-gap:30px;align-items:start}.intro-copy .eyebrow{grid-column:1;margin-bottom:9px}.launch-panel{grid-column:2;grid-row:1 / span 6}h1{grid-column:1;grid-row:2 / span 2;font-size:52px;margin-bottom:10px}.lead{grid-column:1;font-size:14px;margin:4px 0 12px}.mission{grid-column:1;gap:12px;margin-bottom:0}.mission li>span{font-size:14px}.mode-picker{grid-column:2;grid-row:1 / span 3;margin:0}.launch-panel>.primary{grid-column:2;grid-row:4;width:100%;margin-top:8px}.controls{grid-column:2;grid-row:5;font-size:14px;margin:10px 0 5px}.motion{grid-column:2;grid-row:6;font-size:14px}.motion>span{font-size:14px}.stats{top:75px;padding:12px 16px;gap:25px}.stats strong{font-size:24px}.route{top:75px;padding:14px 16px}.card{padding:22px}h2{font-size:27px;margin-bottom:12px}.card .eyebrow{margin-bottom:11px}.card .primary{margin-top:14px}.result-stats{padding-top:12px;margin-top:13px}.result-stats strong{font-size:22px}.card p:not(.eyebrow){font-size:14px}.dialog-layer{place-items:start center;padding-top:22px}}
@media(min-width:1000px) and (min-height:501px){.launch-panel{position:fixed;top:120px;max-height:calc(100svh - 145px);overflow-y:auto;scrollbar-width:thin;right:clamp(28px,7vw,110px);width:350px;padding:22px;background:#081922c4;border:1px solid var(--line);border-radius:12px;backdrop-filter:blur(16px)}.launch-panel .primary{width:100%}.launch-panel .motion>span{display:block;margin-left:24px}.intro-copy{padding-bottom:70px}}
@media(max-width:360px){h1{font-size:54px}.wordmark span{display:none}.mission{gap:12px}.motion>span{display:block;margin-left:23px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}}

/* 자유 비행의 읽기 쉬운 계기와 길게 누르는 직접 조작 단추를 배치한다. */
.mini-map{position:absolute;top:180px;right:36px;margin:0;padding:8px;border:1px solid var(--line);border-radius:9px;background:var(--panel);pointer-events:none}.mini-map canvas{display:block;width:160px;height:160px;border-radius:4px}.mini-map figcaption{font-size:14px;color:#bed7cd;text-align:center;margin-top:6px}
@media(max-width:680px){.mini-map{top:335px;right:18px;padding:5px}.mini-map canvas{width:96px;height:96px}.mini-map figcaption{font-size:14px;max-width:96px;line-height:1.5}}
@media(max-height:500px) and (min-width:681px){.mini-map{top:auto;right:auto;left:18px;bottom:18px;padding:5px}.mini-map canvas{width:96px;height:96px}.mini-map figcaption{font-size:14px}}
@media(max-height:600px) and (max-width:680px){.mini-map{display:none}}
.telemetry{position:absolute;top:195px;left:36px;display:flex;gap:25px;padding:13px 18px;background:var(--panel);border:1px solid var(--line);border-radius:9px;backdrop-filter:blur(14px)}.telemetry>div{min-width:65px}.telemetry small{display:block;font-size:14px;color:#bfd7ce;margin-bottom:6px}.telemetry strong{font-size:21px;font-variant-numeric:tabular-nums;line-height:1}.telemetry>div>span{font-size:14px;margin-left:4px;color:#acc8bc}.telemetry .health-stat{min-width:95px}.health-track{height:3px;margin-top:8px;background:#dc79972e;border-radius:3px;overflow:hidden}.health-track i{display:block;width:100%;height:100%;background:var(--mint);transition:width .15s}
#message{position:absolute;top:271px;left:20px;right:20px;text-align:center;font-size:14px;color:#e7fff5;text-shadow:0 2px 12px #000;pointer-events:none;line-height:1.7}
.flight-controls{position:absolute;bottom:max(49px,calc(env(safe-area-inset-bottom) + 22px));left:50%;transform:translateX(-50%);width:min(480px,calc(100% - 36px));display:grid;grid-template-columns:144px minmax(0,1fr) 48px;gap:18px;align-items:end}.move-pad{display:grid;grid-template-columns:repeat(3,44px);grid-template-rows:repeat(3,44px);gap:6px}.steer{height:44px;width:44px;border:1px solid #97e7d970;background:#07121bd6;border-radius:8px;backdrop-filter:blur(12px);user-select:none;touch-action:none;padding:3px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px}.steer span{font-size:19px;line-height:1}.steer small{font-size:14px;line-height:1.2;color:#cae0d5}.steer:active{background:#79ffdd55;border-color:var(--mint)}#forward{grid-column:2}#left{grid-column:1;grid-row:2}#back{grid-column:2;grid-row:2}#right{grid-column:3;grid-row:2}#turn-left{grid-column:1;grid-row:3}#turn-right{grid-column:3;grid-row:3}.pad-caption{grid-column:2;grid-row:3;align-self:center;text-align:center;font-size:14px;line-height:1.4;color:#b6d2c5;pointer-events:none}.height-pad{display:grid;gap:6px;padding-bottom:50px}.height-pad .steer{width:48px}.control-actions{display:flex;flex-direction:column;gap:9px;padding-bottom:6px}.view-toggle{min-height:44px;width:100%;border:1px solid #97e7d970;border-radius:8px;background:#07121bd6;color:#d5f2e4;font-size:14px;backdrop-filter:blur(12px)}.view-toggle[aria-pressed=true]{border-color:var(--mint);background:#104d46db}
#pulse{position:relative;overflow:hidden;width:100%;min-width:0;height:65px;background:#071b24e8;border:1px solid #79ffdd96;border-radius:9px;box-shadow:0 0 35px #79ffdd15;backdrop-filter:blur(12px);user-select:none;padding:7px}#pulse span,#pulse small{position:relative;z-index:1;display:block}#pulse span{color:var(--mint);font-size:15px;font-weight:700}#pulse small{font-size:14px;margin-top:4px;color:#c1ded4;line-height:1.5}#pulse i{position:absolute;inset:auto auto 0 0;height:100%;width:0;background:#5af3bb26;transition:width .2s}#pulse:disabled{border-color:#829e9d70;box-shadow:none}#pulse:disabled span{color:#a2bbb3}.keyboard-hint{position:absolute;bottom:max(13px,env(safe-area-inset-bottom));left:20px;right:20px;text-align:center;font-size:14px;color:#b9d6cc;letter-spacing:.5px;line-height:1.8}.keyboard-hint span{margin-left:15px}
@media(max-width:680px){.wordmark span{display:none}.stats{top:82px;left:18px;right:18px;justify-content:space-between;padding:12px 16px}.stats strong{font-size:24px}.route{top:158px;padding:10px 16px}.telemetry{top:215px;left:18px;right:18px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:12px 14px}.telemetry>div,.telemetry .health-stat{min-width:0}.telemetry strong{font-size:18px}.telemetry small{font-size:14px}.telemetry>div>span{font-size:14px;margin-left:2px}#message{top:287px;font-size:14px;left:18px;right:18px}.flight-controls{bottom:max(26px,calc(env(safe-area-inset-bottom) + 12px));width:calc(100% - 28px);grid-template-columns:138px minmax(0,1fr) 44px;gap:8px}.move-pad{gap:3px}.height-pad{gap:3px;padding-bottom:47px}.height-pad .steer{width:44px}.control-actions{gap:6px;padding-bottom:3px}.view-toggle{font-size:14px}#pulse{height:62px;padding:5px}#pulse span{font-size:14px}#pulse small{font-size:14px}.keyboard-hint{display:none}.controls{font-size:14px;line-height:1.95}.lead{font-size:14px}}
@media(max-height:500px) and (min-width:681px){.stats{top:72px;left:18px;padding:11px 14px;gap:24px}.stats strong{font-size:23px}.stats small{font-size:14px;margin-bottom:6px}.route{top:72px;right:18px;width:220px;padding:11px 14px}.route-label{font-size:14px;margin-bottom:11px}.telemetry{top:140px;left:18px;gap:20px;padding:10px 14px}.telemetry strong{font-size:17px}.telemetry small{font-size:14px;margin-bottom:4px}#message{top:196px;font-size:14px;margin-top:8px}.flight-controls{left:auto;right:max(18px,env(safe-area-inset-right));transform:none;width:360px;grid-template-columns:138px minmax(0,1fr) 44px;gap:10px;bottom:max(19px,env(safe-area-inset-bottom))}.move-pad{gap:3px}.height-pad{gap:3px;padding-bottom:47px}.height-pad .steer{width:44px}.control-actions{gap:6px;padding-bottom:3px}#pulse{height:62px}#pulse span{font-size:14px}#pulse small{font-size:14px}.keyboard-hint{display:none}.lead{line-height:1.55}.controls{font-size:14px;line-height:1.9}}
@media(max-width:360px){.flight-controls{width:calc(100% - 24px);gap:6px}.telemetry{gap:8px;padding:12px}.telemetry strong{font-size:16px}.telemetry small{letter-spacing:0}.lead{font-size:14px}#pulse small{font-size:14px}}
@media(max-height:500px) and (min-width:451px) and (max-width:680px){.masthead{padding-top:max(10px,env(safe-area-inset-top))}.stats{top:70px;right:auto;width:180px;gap:12px;padding:10px 12px}.stats strong{font-size:21px}.stats small{font-size:14px;margin-bottom:5px}.route{top:70px;left:auto;right:18px;width:220px;padding:11px 13px}.route-label{font-size:14px;margin-bottom:10px}.telemetry{top:135px;width:350px;right:auto;padding:10px 12px}.telemetry strong{font-size:16px}.telemetry small{font-size:14px;margin-bottom:4px}#message{top:192px;font-size:14px;margin-top:7px}.flight-controls{bottom:max(15px,env(safe-area-inset-bottom));width:min(400px,calc(100% - 28px))}}
/* 낮은 화면에서는 임무와 조작 단추가 겹치지 않도록 마지막 배치로 확정한다. */
@media(max-width:680px) and (max-height:600px) and (orientation:portrait){.route{display:none}.telemetry{top:154px}#message{top:221px;margin-top:4px}.mission-card{top:250px;left:18px;right:18px;width:auto;max-width:none;padding:8px 12px}.mission-card small,.mission-card>p{display:none}.mission-card strong{font-size:14px;margin:0 0 4px}.mission-card .goal{position:static;max-width:none;gap:8px}.mission-card .goal b{font-size:18px}.mission-card .goal span{font-size:14px}#track-race{position:absolute;right:8px;top:3px;min-height:24px;margin:0;padding:4px 6px;font-size:14px}}
@media(max-width:680px) and (max-height:500px) and (orientation:landscape){.mission-card{top:133px;left:auto;right:18px;width:180px;padding:8px 10px}.mission-card small,.mission-card>span,.mission-card>p{display:none}.mission-card strong{font-size:14px;margin:0 0 4px}.mission-card .goal{position:static;max-width:none;gap:5px;font-size:14px}.mission-card .goal b{font-size:18px}.mission-card .goal span{font-size:14px}#track-race{min-height:24px;margin-top:4px;padding:3px 6px;font-size:14px}#message{right:220px;left:18px;text-align:left;top:196px}}

/* 가속·제동은 방향판의 빈 칸을 쓰며, 목표 높이는 별도 줄로 읽는다. */
#boost{grid-column:1;grid-row:1}#brake{grid-column:3;grid-row:1;border-color:#ffd38b99}.steer[aria-pressed=true]{background:#79ffdd55;border-color:var(--mint)}#brake[aria-pressed=true]{background:#7b4b23da;border-color:#ffd38b}
#goal-distance,#goal-height{display:block;line-height:1.6}#goal-height{color:var(--mint)}#mission-action{color:#e7fff5;display:block;font-weight:700}.goal>span{min-width:0}#challenge-status{overflow-wrap:anywhere}
/* 작은 세로 화면에서는 중요한 안내를 넓게 모으고 지도와 부연을 접는다. */
@media(max-width:680px) and (max-height:780px) and (orientation:portrait){.stats{top:74px;padding:10px 14px}.stats strong{font-size:22px}.stats small{margin-bottom:5px}.route{top:141px;padding:9px 14px}.telemetry{top:193px;padding:10px 12px}#message{top:257px;font-size:14px;line-height:1.5;margin:4px 0}.mission-card{top:289px;left:18px;right:18px;width:auto;max-width:none;padding:10px 12px}.mini-map,.mission-card small,#mission-brief{display:none}.mission-card strong{font-size:14px}.mission-card>span{display:block;font-size:14px}.mission-card .goal{position:static;max-width:none;font-size:14px}.mission-card .goal b{font-size:20px}.mission-card .goal span{font-size:14px}#mission-action{display:block;font-size:14px;margin:4px 0}#challenge-status{display:block;font-size:14px;min-height:0;margin:4px 0 0}#track-race{position:static;min-height:28px;margin:5px 0 0;padding:4px 8px;font-size:14px}}
@media(max-width:680px) and (max-height:600px) and (orientation:portrait){.stats{top:74px;padding:8px 12px}.stats strong{font-size:20px}.stats small{margin-bottom:4px}.telemetry{top:135px;padding:8px 12px}.telemetry small{margin-bottom:3px}#message{top:193px;font-size:14px;line-height:1.5;margin:4px 0}.mission-card{top:222px;padding:8px 10px}.mission-card strong{font-size:14px;margin-bottom:3px}.mission-card .goal span,.mission-card>span,#mission-action{font-size:14px}.mission-card .goal{gap:5px}.flight-controls{bottom:max(10px,env(safe-area-inset-bottom))}#challenge-status{font-size:14px}}
/* 가로 화면에서는 임무 안내와 조작판을 서로 다른 열에 둔다. */
@media(max-height:500px) and (orientation:landscape){.mission-card{top:133px;left:auto;right:18px;width:220px;padding:8px 10px}.mission-card small,#mission-brief{display:none}.mission-card strong{font-size:14px;margin-bottom:4px}.mission-card>span,#mission-action{display:block;font-size:14px;margin:4px 0}.mission-card .goal{position:static;max-width:none;gap:5px}.mission-card .goal b{font-size:18px}.mission-card .goal span{font-size:14px}#challenge-status{display:block;font-size:14px;min-height:0;margin:3px 0}#track-race{position:static;min-height:25px;margin:4px 0 0;padding:3px 6px;font-size:14px}.flight-controls{left:18px;right:auto;transform:none;width:min(400px,calc(100% - 270px));bottom:max(12px,env(safe-area-inset-bottom))}.mini-map{display:none}#message{left:18px;right:260px;text-align:left;top:196px}}
/* 좁은 가로 화면에서도 조작판을 압축하지 않고 계기·목표를 위에 둔다. */
@media(max-width:680px) and (max-height:500px) and (orientation:landscape){.stats,.route,#message{display:none}.telemetry{top:72px;left:18px;right:auto;width:calc(50% - 27px);grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:8px}.telemetry strong{font-size:14px}.telemetry small{font-size:14px;margin-bottom:2px}.mission-card{top:72px;right:18px;width:calc(50% - 27px);padding:6px 8px}.mission-card strong{font-size:14px;margin:0 0 2px}.mission-card>span{display:none}#mission-action{font-size:14px;line-height:1.3;margin:2px 0}.mission-card .goal span{font-size:14px;line-height:1.4}#challenge-status{font-size:14px;line-height:1.25;margin:2px 0}#track-race{min-height:24px;padding:2px 5px;margin:2px 0;font-size:14px}.flight-controls{left:18px;width:min(400px,calc(100% - 36px));grid-template-columns:138px minmax(96px,1fr) 44px;gap:8px}}
@media(max-width:680px) and (max-height:350px) and (orientation:landscape){.mission-card strong,#mission-action{display:none}}

/* 다음 목표는 시야 가운데, 조작판은 필요할 때만 펼쳐 비행 공간을 확보한다. */
.flight-objective{position:absolute;top:104px;left:50%;transform:translateX(-50%);width:min(510px,calc(100% - 700px));min-width:280px;text-align:center;pointer-events:none;padding:12px 20px;border:1px solid #8bffe052;border-radius:10px;background:#061721b8;backdrop-filter:blur(12px)}.flight-objective strong{display:block;font-size:16px;line-height:1.5;color:#edfff7}.flight-objective strong[data-ready=true]{color:#ffd38b}.flight-objective>span{display:block;margin-top:4px;font-size:14px;line-height:1.5;color:#a1dfcf}#rescue-banner{margin:10px 0 0;padding-top:9px;border-top:1px solid #ffd38b70;color:#ffe4b1;font-size:14px;line-height:1.5}
.target-marker{position:absolute;transform:translate(-50%,-50%);display:flex;align-items:center;flex-direction:column;gap:5px;pointer-events:none;filter:drop-shadow(0 2px 5px #03131c);max-width:210px;color:#9dffe1}.target-marker>b{display:block;font-size:38px;line-height:1;font-weight:400}.target-marker>span{padding:5px 8px;background:#071822d6;border:1px solid #9dffe15c;border-radius:5px;font-size:14px;font-weight:700;white-space:nowrap}.target-marker>div{width:85px;height:4px;background:#163a45;border-radius:3px;overflow:hidden}.target-marker i{display:block;height:100%;width:0;background:#ffd38b}.target-marker[data-edge=true]>b{font-size:29px}.target-marker[data-ready=true]{color:#ffd38b}.target-marker[data-ready=true]>span{border-color:#ffd38b99}
.controls-toggle{position:absolute;bottom:max(36px,calc(env(safe-area-inset-bottom) + 22px));left:36px;min-height:44px;padding:10px 14px;border:1px solid #a6d8d74d;border-radius:8px;background:#071822d9;backdrop-filter:blur(10px);font-size:14px;z-index:2}.flight-controls:not(.controls-expanded){width:310px;grid-template-columns:1fr;bottom:max(38px,calc(env(safe-area-inset-bottom) + 22px))}.flight-controls:not(.controls-expanded) .move-pad,.flight-controls:not(.controls-expanded) .height-pad{display:none}.flight-controls:not(.controls-expanded) .control-actions{flex-direction:row;align-items:center;gap:8px}.flight-controls:not(.controls-expanded) .view-toggle{width:115px;flex-shrink:0}.flight-controls:not(.controls-expanded) #pulse{height:54px}.flight-controls:not(.controls-expanded) #pulse span{font-size:14px}body.flying .vignette{opacity:.2}#message{top:190px;left:355px;right:330px}
@media(max-width:1100px){.flight-objective{top:88px;width:390px;min-width:0}.stats{top:180px}.telemetry{top:276px}.mission-card{top:367px}.route{top:180px}.mini-map{top:270px}#message{top:165px;left:30px;right:30px;font-size:14px}}
@media(max-width:680px){.flight-objective{top:75px;left:18px;right:18px;transform:none;width:auto;padding:8px 12px}.flight-objective strong{font-size:14px}.flight-objective>span{font-size:14px;margin-top:2px}.stats{top:146px;padding:8px 12px}.stats strong{font-size:20px}.stats small{font-size:14px;margin-bottom:4px}.route{display:none}.telemetry{top:205px;padding:8px 12px}.telemetry small{margin-bottom:4px}.telemetry strong{font-size:16px}.mission-card{top:272px;left:18px;right:18px;width:auto;max-width:none;padding:9px 12px}.mission-card small,#mission-brief,#mission-progress,#mission-action{display:none}.mission-card strong{font-size:14px;margin:0 0 4px}.mission-card .goal{position:static;max-width:none}.mission-card .goal span{font-size:14px}#challenge-status{font-size:14px;margin-top:3px;min-height:0}.mini-map{display:none}#message{top:auto;bottom:185px;left:18px;right:18px;font-size:14px;line-height:1.5;margin:0}.controls-toggle{left:18px;bottom:max(12px,env(safe-area-inset-bottom));min-height:38px;font-size:14px;padding:8px 10px}.flight-controls{bottom:max(54px,calc(env(safe-area-inset-bottom) + 42px))}.flight-controls:not(.controls-expanded){width:270px;bottom:max(60px,calc(env(safe-area-inset-bottom) + 42px))}.flight-controls:not(.controls-expanded) .view-toggle{width:105px}#rescue-banner{font-size:14px;margin-top:6px;padding-top:6px}.target-marker>span{font-size:14px}.target-marker>b{font-size:30px}.target-marker>div{width:65px}}
@media(max-height:600px) and (min-width:681px){.flight-objective{top:76px;padding:8px 12px;width:390px;min-width:0}.flight-objective strong{font-size:14px}.flight-objective>span{font-size:14px}.stats{top:72px;left:18px}.telemetry{top:140px;left:18px}.route{top:72px;right:18px}.mission-card{top:142px;right:18px;left:auto;width:220px}.mini-map{display:none}#message{top:142px;left:340px;right:260px;font-size:14px}.controls-toggle{left:18px;bottom:12px}.flight-controls:not(.controls-expanded){left:50%;right:auto;transform:translateX(-50%);width:300px;bottom:22px}}
@media(max-height:500px) and (max-width:680px) and (orientation:landscape){.flight-objective{top:65px;left:18px;right:18px;padding:6px 10px}.flight-objective strong{font-size:14px}.flight-objective>span{font-size:14px}.stats,.route,.mission-card,#message{display:none}.telemetry{top:126px;left:auto;right:18px;width:180px;padding:8px;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}.telemetry strong{font-size:14px}.controls-toggle{left:auto;right:18px;bottom:12px}.flight-controls{bottom:12px;left:18px;right:auto;transform:none;width:min(370px,calc(100% - 230px));grid-template-columns:138px minmax(96px,1fr) 44px}.flight-controls:not(.controls-expanded){left:18px;right:auto;transform:none;width:260px;bottom:22px}.target-marker>span{font-size:14px}.target-marker>b{font-size:25px}#rescue-banner{font-size:14px;margin-top:3px;padding-top:3px}}
@media(max-height:600px) and (max-width:680px) and (orientation:portrait){.stats{display:none}.telemetry{top:142px}.mission-card{top:202px;padding:7px 10px}.mission-card strong,#challenge-status{display:none}#message{display:none}.flight-controls{bottom:54px}.flight-objective{top:72px}}
@media(max-height:600px) and (min-width:681px){.flight-objective{width:min(390px,calc(100% - 520px))}}
@media(max-width:680px) and (orientation:portrait){#message{bottom:215px}}
@media(max-width:680px) and (max-height:500px) and (orientation:landscape){.flight-controls.controls-expanded{width:calc(100% - 230px);grid-template-columns:138px minmax(0,1fr) 44px;gap:5px}.flight-controls.controls-expanded .control-actions{gap:5px}.flight-controls.controls-expanded .view-toggle{font-size:14px;padding:2px;overflow-wrap:anywhere}.flight-controls.controls-expanded #pulse{height:62px;padding:2px}.flight-controls.controls-expanded #pulse span{font-size:14px;line-height:1.4}.flight-controls.controls-expanded #pulse small{font-size:14px;overflow-wrap:anywhere}}
/* 홈페이지 사본의 바탕과 누름 영역을 맞추고, 좁은 세로 화면의 안내를 넓게 읽는다. */
html{background:var(--ink)}
.wordmark{display:inline-flex;align-items:center;min-width:44px;min-height:44px}
/* 게임을 시작하거나 멈춘 뒤에도 홈페이지로 나가는 길을 보인다. */
.masthead{z-index:10}
.game-exit{gap:8px;padding:8px 12px;border:1px solid #8bffe080;border-radius:8px;background:#071822e6;color:var(--paper);white-space:nowrap;flex-shrink:0}
.game-exit b{font-size:22px;line-height:1;font-weight:400}
.game-exit:hover{background:#153b40}
.game-exit:active{background:#205259}
.challenges input,.motion input{width:24px;height:24px;flex-shrink:0}
.primary:active:not(:disabled){background:var(--mint);transform:translateY(1px)}
.secondary:active{background:#8bffe014;text-decoration:underline;text-underline-offset:4px}
@media(max-width:680px) and (orientation:portrait){
  .lead{font-size:16px}
  .mode-picker select{font-size:16px}
  .flight-controls.controls-expanded{grid-template-columns:138px 1fr 44px;gap:8px}
  .flight-controls.controls-expanded .control-actions{grid-column:1 / -1;grid-row:1;flex-direction:row;align-items:center;padding:0}
  .flight-controls.controls-expanded .view-toggle{width:105px;flex-shrink:0}
  .flight-controls.controls-expanded #pulse{height:54px}
  .flight-controls.controls-expanded .move-pad{grid-column:1;grid-row:2}
  .flight-controls.controls-expanded .height-pad{grid-column:3;grid-row:2}
  #message{bottom:265px}
}
@media(min-width:681px) and (max-width:1100px) and (min-height:601px) and (max-height:800px){
  .flight-controls.controls-expanded{left:auto;right:18px;transform:none;width:min(480px,calc(100% - 360px))}
}

/* 홈페이지 안내의 글자 규격을 게임 입구에도 적용한다. */
#intro{background:linear-gradient(90deg,#07111c66,#07111c00 85%)}
input{font:inherit}
.wordmark span,.eyebrow,.mode-picker label,.intro-meta{letter-spacing:0}
h1{font-size:56px;line-height:1.2;letter-spacing:-.035em}
.lead{font-size:17px;line-height:1.75}
.controls{line-height:2}
.primary span{font-size:24px}
.wordmark span,.tools button,.eyebrow,.mission b,.mission li>span,
.mode-picker label,.mode-picker p,.challenges legend,.challenges legend span,
.challenges label,.challenges small,.controls,.motion,.motion>span,.intro-meta{font-size:15px}
.mode-picker select{font-size:17px}
@media(min-width:1000px) and (min-height:501px){
  .intro-meta{right:auto;flex-direction:column;gap:4px}
}
@media(min-width:681px) and (max-width:999px){
  .intro-meta{position:relative;left:auto;right:auto;bottom:auto;margin:0 54px 20px}
}
@media(max-width:680px){
  h1{font-size:46px}
  .wordmark span,.tools button,.eyebrow,.mission b,.mission li>span,
  .mode-picker label,.mode-picker p,.challenges legend,.challenges legend span,
  .challenges label,.challenges small,.controls,.motion,.motion>span,.intro-meta{font-size:14px}
  .intro-meta{position:relative;left:auto;right:auto;bottom:auto;margin:0 25px 20px}
}
