.identity,.instruments,.action-rail,.orbit,.field-hint,.intro,.speed-panel{position:absolute}
.identity{top:var(--top);left:max(var(--edge),env(safe-area-inset-left));display:flex;align-items:center;gap:15px}.menu-key{width:45px;height:45px;border-radius:9px}.menu-key:hover,.speed-toggle:hover,.instruments:hover{border-color:#b7c9a97a}.menu-key .icon{width:20px;height:20px}
.call-sign{pointer-events:none;text-shadow:0 2px 6px #163124}.wordmark{font:italic 800 clamp(21px,2vw,30px)/1 'Barlow Condensed','Arial Narrow',sans-serif;letter-spacing:.45px;text-transform:uppercase;display:flex;align-items:center;gap:7px}.wordmark img{width:35px;height:24px}.mode{display:flex;align-items:center;gap:6px;font:500 9px/1 var(--mono);letter-spacing:.9px;text-transform:uppercase;color:#c4d4bf;margin-top:7px}.mode-separator{opacity:.45}#mode-led{height:5px;width:5px;border-radius:50%;background:var(--mint)}
.instruments{right:max(var(--edge),env(safe-area-inset-right));top:var(--top);padding:9px 4px;gap:0;border-radius:9px;text-align:left}.instrument{display:flex;align-items:center;gap:9px;padding:0 13px}.instrument+.instrument{border-left:1px solid #a6c19431}.instrument small,.speed-short small{display:block;color:#adbcab;font:500 8px/1.2 var(--mono);text-transform:uppercase;letter-spacing:.8px;margin-bottom:3px}.instrument b{font:500 14px/1 var(--mono);white-space:nowrap;display:block}.g-icon{color:#b4c6ab}.g-icon .icon{width:17px;height:17px}.coverage-icon{color:var(--mint)}#coverage{color:#d3ebb0}
.intro{pointer-events:none;left:50%;top:11%;transform:translateX(-50%);text-align:center;color:#fbf7df;text-shadow:0 3px 15px #172c1f;opacity:0;white-space:nowrap}.mission-eyebrow{display:flex;align-items:center;justify-content:center;gap:10px;font:500 10px var(--mono);color:var(--yellow);letter-spacing:2px;text-transform:uppercase}.mission-eyebrow i{width:26px;height:1px;background:#dbc57888}.intro h1{font:italic 800 clamp(32px,4vw,58px)/1.1 'Barlow Condensed',sans-serif;letter-spacing:1px;text-transform:uppercase;margin:4px 0}.intro.announce{animation:title-reveal 3.2s both}
@keyframes title-reveal{0%{opacity:0;translate:0 7px}12%,70%{opacity:1;translate:0 0}100%{opacity:0;translate:0 -5px}}
.orbit{right:var(--edge);top:calc(var(--top) + 69px);display:flex;align-items:center;gap:1px}.orbit-key{width:28px;height:38px;border-radius:7px;color:#b8cbb9}.orbit-key .icon{width:15px}.compass{flex-direction:column;position:relative;width:39px;height:38px;padding:0;gap:0}.compass span{font:500 9px var(--mono);color:#e6e9ce;position:absolute;top:-7px}.compass svg{width:36px;height:36px}.compass circle{stroke:#afbea987;stroke-width:1;fill:#182a20a8}
.action-rail{left:max(var(--edge),env(safe-area-inset-left));right:max(var(--edge),env(safe-area-inset-right));bottom:var(--bottom);display:flex;align-items:flex-end;justify-content:space-between;gap:10px;pointer-events:none}.action-rail>*{pointer-events:auto}.tools,.flight-actions,#edit-tools{display:flex;align-items:center;gap:3px}.tools{padding:5px}.tool{height:38px;padding:0 13px;border-radius:6px;font-weight:700;font-size:13px;color:#bccbb9}.tool .icon{width:15px;height:15px}.tool.selected{background:#c0d49c21;box-shadow:inset 0 0 0 1px #bfd7973a;color:#e4edcf}.tools i{width:1px;height:21px;background:#a8c39c3c;margin:0 4px}.flight-actions{gap:9px}.flight-actions .launch{height:49px;min-width:155px;font-size:15px;gap:11px}
.speed-toggle{height:49px;padding:0 13px;gap:10px;color:var(--mint);text-align:left}.speed-short b{font:500 13px var(--mono);color:#ecf2dc;display:block;white-space:nowrap}.speed-short em{font:500 9px var(--mono);color:#aebda5}.spark{width:42px;height:18px}.spark path{fill:none;stroke:#b7cf90;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
.field-hint{bottom:calc(var(--bottom) + 10px);left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;pointer-events:none;white-space:nowrap;font-size:12px;color:#e0ead7;text-shadow:0 1px 5px #0e1e14;background:#1c30253d;padding:6px 10px;border-radius:5px}.field-hint .icon{width:14px;height:14px}.field-hint:not([hidden]){animation:hint-in .2s ease-out}
.speed-panel{right:max(var(--edge),env(safe-area-inset-right));bottom:calc(var(--bottom) + 61px);width:min(440px,calc(100% - 24px));padding:15px 18px;transform-origin:bottom right;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(9px) scale(.98);transition:opacity .18s,transform .2s ease-out,visibility 0s .2s}
.speed-panel.open{opacity:1;visibility:visible;transform:none;pointer-events:auto;transition-delay:0s}.speed-heading,.panel-title,.profile-end{display:flex;align-items:center;gap:8px}.speed-heading{justify-content:space-between}.profile-end .icon-btn{width:26px;height:26px}.profile-end .icon-btn .icon{width:14px}.speed-heading #speed-readout{gap:4px}.speed-toggle[aria-expanded=true]{border-color:#b5cd91}
button{transition:background-color .15s,border-color .15s,color .15s,box-shadow .15s,transform .14s}button:active:enabled:not(.speed-knob){transform:scale(.96)}dialog[open]{animation:panel-in .20s ease-out}dialog[open]::backdrop{animation:shade-in .18s}dialog.dismissing{animation:panel-out .13s ease-in both}dialog.dismissing::backdrop{animation:shade-out .13s ease-in both}#edit-tools:not([hidden]){animation:hint-in .16s ease-out}.stage.is-flying .tools{opacity:.75}.tools{transition:opacity .18s}
@keyframes hint-in{from{opacity:0;translate:0 4px}to{opacity:1;translate:0 0}}@keyframes panel-in{from{opacity:0;transform:translateY(9px) scale(.985)}to{opacity:1;transform:none}}@keyframes panel-out{to{opacity:0;transform:translateY(5px) scale(.99)}}@keyframes shade-in{from{opacity:0}to{opacity:1}}@keyframes shade-out{to{opacity:0}}
@media(max-width:930px){.field-hint{bottom:calc(var(--bottom) + 62px)}.instrument{padding:0 9px;gap:6px}.field-hint:has(+.action-rail .speed-toggle[aria-expanded=true]){opacity:0}}
@media(max-width:650px){.stage{--edge:12px}.identity{gap:8px}.menu-key{width:40px;height:40px}.wordmark{font-size:20px;gap:5px}.wordmark img{width:23px;height:17px}.mode{font-size:8px;gap:4px;letter-spacing:.4px;margin-top:5px}.instrument{gap:3px;padding:0 7px}.instrument small{display:none}.instrument b{font-size:11px}.g-icon .icon{width:13px;height:13px}.instruments{height:38px;padding:0 2px}.orbit{top:calc(var(--top) + 52px)}.intro{top:16%}.tools{padding:3px}.tool{width:37px;height:38px;padding:0}.tool span{display:none}.tool .icon{width:17px;height:17px}.tools .icon-btn{width:31px;height:38px}.tools i{margin:0 1px}.flight-actions{gap:6px}.flight-actions .launch{min-width:0;height:46px;padding:0 13px;font-size:12px;gap:6px}.speed-toggle{padding:0 9px;height:46px;gap:5px}.speed-toggle .icon{width:15px}.speed-short b{font-size:11px}.spark{display:none}.speed-short small{font-size:7px}.action-rail{gap:5px}.field-hint{bottom:calc(var(--bottom) + 56px)}.speed-panel{bottom:calc(var(--bottom) + 57px)}}
@media(max-width:470px){.wordmark img{display:none}.instruments{gap:0}.instrument{flex-direction:column;gap:1px;min-width:39px}.g-icon .icon{width:12px;height:12px}.instrument b{font-size:10px}.identity{gap:7px}.wordmark{font-size:19px}.orbit-key{width:26px}.intro h1{font-size:37px}.field-hint{font-size:11px}.tools:has(#edit-tools:not([hidden])) #clear{display:none}.flight-actions .launch{padding:0 11px}}
@media(max-width:355px){.speed-toggle>span:first-child{display:none}.instrument{padding:0 4px;min-width:33px}.tool{width:33px}.tools .icon-btn{width:26px}.action-rail{gap:4px}}
@media(max-height:510px) and (orientation:landscape){.stage{--edge:8px}.intro{top:15%}.identity,.instruments,.tools,.flight-actions{scale:.88}.identity,.tools{transform-origin:left}.instruments,.flight-actions{transform-origin:right}.orbit{top:calc(var(--top) + 47px)}.field-hint{bottom:var(--bottom);font-size:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition:none!important;scroll-behavior:auto!important}dialog[open],dialog[open]::backdrop,.field-hint:not([hidden]),#edit-tools:not([hidden]){animation:none}.intro.announce{animation:quiet-title 3.2s both}@keyframes quiet-title{0%,88%{opacity:1}100%{opacity:0}}}
.anchor-position{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:11px 0 5px}
.anchor-position label{font:500 10px var(--mono);color:#ffb293}
.anchor-position label:nth-child(2){color:#c5e89d}.anchor-position label:nth-child(3){color:#93d7ed}
.anchor-position input{display:block;width:100%;min-width:0;margin-top:4px;padding:6px 8px;color:var(--text);border:1px solid var(--line);border-radius:4px;background:#16261c;font:500 14px var(--mono)}
.anchor-position input:disabled{opacity:.5}.anchor-position input:focus-visible{outline:2px solid var(--yellow)}
.route-key{position:absolute;left:var(--edge);top:calc(var(--top) + 56px);display:flex;gap:10px;pointer-events:none;color:#dae5d3;font:500 9px var(--mono);text-shadow:0 1px 3px #1b2c21}
.route-key span:before{content:'';display:inline-block;width:13px;border-top:2px solid #e9dd83;vertical-align:middle;margin-right:4px}.route-key span+span:before{border-top:2px dashed #94dace}
.flight-warning{position:absolute;top:calc(var(--top) + 62px);left:50%;transform:translateX(-50%);background:#542d21;color:#ffdfad;border:1px solid #e7a868;border-radius:5px;font:700 13px var(--mono);padding:6px 12px;text-transform:uppercase;pointer-events:none}
#extend[aria-pressed=true]{color:#203728;background:#c0df92}
@media(max-width:390px){.tools:has(#edit-tools:not([hidden])) .tool{width:30px}.flight-actions .launch{padding:0 7px}.route-key{top:calc(var(--top) + 45px)}}
@media(max-height:510px){.speed-panel{max-height:calc(100dvh - 76px);overflow:auto}.speed-panel .speed-body{margin-top:4px}.route-key{top:calc(var(--top) + 45px)}}

.map-editor-link{position:absolute;left:var(--edge);top:calc(var(--top) + 53px);display:flex;align-items:center;gap:7px;padding:7px 10px;font-size:12px;color:#dae5c9;text-decoration:none}.map-editor-link .icon{width:14px;height:14px}.is-flying .map-editor-link{display:none}
.menu-list a.menu-item{display:flex;align-items:center;text-decoration:none;color:var(--text)}

.route-tip{position:absolute;left:0;top:0;width:26px;height:23px;pointer-events:none;color:#ffdf84;filter:drop-shadow(0 1px 2px #15261b)}
.route-tip svg{width:100%;height:100%;overflow:visible;animation:tip-pulse 1.35s ease-in-out infinite}
.route-tip path{fill:none;stroke:#26362b;stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
.route-tip path+path{stroke:currentColor;stroke-width:3}
@keyframes tip-pulse{0%,100%{opacity:.76;transform:scale(.9)}50%{opacity:1;transform:scale(1.09)}}
@media(prefers-reduced-motion:reduce){.route-tip svg{animation:none}}
