*{box-sizing:border-box}
/* Direct manipulation keeps the aircraft and its controls in one visual space. */
.track{min-width:178px!important;padding:7px 8px!important}.track-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:4px}.track-top .kind{margin:0}.label-controls{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:4px;margin:1px -3px 4px}.label-field{padding:5px 3px!important;border:1px solid #8aa9bb25!important;border-radius:2px;background:#14232d66!important;min-width:0;color:inherit!important;font:11px Consolas,monospace!important;cursor:ns-resize}.label-field[data-control=heading]{cursor:crosshair}.label-field small{font:7px monospace;opacity:.65;display:block;margin-bottom:2px;letter-spacing:1px}.label-field:hover,.label-field.editing{border-color:#b8d4e7a6!important;background:#37506499!important}.label-field .trend{font-size:9px}.label-flow{font:8px/1.5 Consolas,monospace;color:#93aab8;letter-spacing:.1px;display:flex;justify-content:space-between;gap:8px;margin:4px 0}.transfer-action{padding:4px 5px!important;width:100%;text-align:left;color:#a7c6d9!important;font:8px/1.2 monospace!important;letter-spacing:.4px;background:transparent!important;border-color:#54748655!important}.transfer-action:disabled{opacity:.55}.transfer-action.ready{background:#294c3d99!important;color:#caf3d6!important;border-color:#96c8a688!important}.transfer-action.request{color:#d6c89d!important;border-color:#d6c89d66!important}.track .track-route{font-size:8px}.micro-control{position:absolute;z-index:33;width:142px;padding:12px;background:linear-gradient(135deg,#263b4af5,#172733f7);border:1px solid #88aabcaa;border-radius:5px;box-shadow:0 14px 35px #0006;backdrop-filter:blur(10px);pointer-events:auto}.micro-control header{display:flex;align-items:flex-start;justify-content:space-between;gap:6px;border-bottom:1px solid #8da9ba33;padding-bottom:8px;margin-bottom:10px}.micro-control header b{font:11px monospace;letter-spacing:.4px}.micro-control header small{display:block;font:6px monospace;letter-spacing:.8px;color:#9fb5c3;margin-top:5px}.micro-control header button{padding:0 4px;border:0;background:transparent;font-size:16px;color:#92afc3}.micro-control output{display:block;float:none;text-align:center;font:21px Consolas,monospace;color:#d6eaff;letter-spacing:.5px}.micro-control small{font:7px monospace;display:block;text-align:center;color:#8ca6b8;letter-spacing:.2px}.micro-control #levelFeet{margin-top:4px}.level-column{position:relative;height:180px;margin:13px 0 10px}.level-column input[type=range]{position:absolute;width:22px;height:164px;left:29px;top:8px;margin:0;writing-mode:vertical-lr;direction:rtl;appearance:none;-webkit-appearance:none;background:transparent;accent-color:#b8d4ef;cursor:ns-resize;touch-action:none}.level-column input::-webkit-slider-runnable-track{width:5px;border-radius:3px;background:linear-gradient(to top,#a9c8e1 var(--fill),#12232f var(--fill));border:1px solid #7599af66}.level-column input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:23px;height:10px;border:1px solid #d2e9f7;border-radius:2px;background:#a6c9e1;box-shadow:0 1px 8px #0006;margin-left:-10px}.level-ticks{position:absolute;left:66px;top:22px;bottom:16px;display:flex;flex-direction:column;justify-content:space-between;font:8px monospace;color:#8fa8b8;pointer-events:none}.level-ticks span:before{content:'—';margin-right:6px;color:#56758a}.level-limit{position:absolute;left:31px;font:7px monospace;color:#94acbc;pointer-events:none}.level-limit.top{top:-3px}.level-limit.bottom{bottom:-3px}.micro-control #controlHint{font-size:6px;line-height:1.6;margin-top:9px;color:#a0b9cb;letter-spacing:.5px}.micro-control.speed-panel{width:232px}.speed-throttle{display:flex;align-items:center;gap:9px;margin:15px 0 3px}.speed-throttle button{font-size:16px;padding:0;width:22px;height:23px;color:#e0c696;border-color:#8b775f66;background:#3c372d77}.speed-throttle input[type=range]{appearance:none;-webkit-appearance:none;width:100%;height:5px;margin:0;cursor:ew-resize;background:linear-gradient(to right,#d5b579 var(--fill),#14212b var(--fill));border:1px solid #a18d7055;border-radius:3px;touch-action:none}.speed-throttle input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;height:20px;width:10px;background:#dfc393;border:1px solid #fae2bb;border-radius:2px;box-shadow:0 2px 8px #0005}.speed-limits{display:flex;justify-content:space-between;padding:0 31px;margin:8px 0 12px;font:7px monospace;color:#b5a78e}.micro-control.speed-panel output{color:#eed5ac}.heading-dial{position:absolute;width:160px;height:160px;z-index:18;touch-action:none;user-select:none;cursor:crosshair;border-radius:50%;pointer-events:auto;filter:drop-shadow(0 2px 8px #0005)}.heading-dial svg{width:160px;height:160px;overflow:visible}.dial-background{fill:#1c2b36c9}.dial-outline{fill:none;stroke:#95b8ce99;stroke-width:1}.dial-ticks line{stroke:#7d9caf99;stroke-width:1}.heading-dial text{text-anchor:middle;font:8px Consolas,monospace;fill:#aac6d8}.heading-dial text.dial-north{fill:#e0c899}.actual-needle{stroke:#d0d9de77;stroke-width:3}.target-needle{stroke:#c0e1f9;stroke-width:2}.dial-knob{fill:#c7e5f6;stroke:#f0faff;stroke-width:1;cursor:grab}.heading-dial.adjusting .dial-knob{fill:#f7d38f;stroke:#fff0c9}.heading-dial.adjusting .target-needle{stroke:#f7d38f}.dial-readout{position:absolute;top:49px;left:34px;right:34px;text-align:center;pointer-events:none}.dial-readout small{display:block;font:7px monospace;letter-spacing:2px;color:#8eafc5}.dial-readout output{display:block;float:none;font:22px Consolas,monospace;color:#e3f0fa;margin-top:4px;letter-spacing:.5px}.dial-readout button{pointer-events:auto;display:block;margin:6px auto 0;font:7px monospace;padding:4px 7px;letter-spacing:.5px;background:#1c3445;border-color:#5d879c77}.dial-readout button.on{color:#a3d6b2;border-color:#85ad8a66}.heading-dial>span{position:absolute;top:135px;left:0;right:0;text-align:center;font:6px monospace;color:#a5bfcf;letter-spacing:.6px;pointer-events:none}.fir-context{position:absolute;right:28px;top:154px;width:285px;background:#15232bc7;border:1px solid #698c9f33;border-radius:4px;z-index:2;pointer-events:none;overflow:hidden}.fir-context header{height:30px;padding:9px 10px;display:flex;justify-content:space-between;gap:5px;font:7px monospace;letter-spacing:.7px;color:#98b6c9;border-bottom:1px solid #698c9f22}.fir-context header span{color:#b3cbdc}.fir-context canvas{position:static;display:block;height:165px;width:100%;cursor:default}.fir-context p{font:6px/1.6 monospace;color:#7895a7;margin:0;padding:3px 9px 7px;letter-spacing:.4px}.fir-context.hidden{display:none!important}@media(max-width:900px){.fir-context{top:147px;right:15px;width:245px;background:#14232bf2;z-index:16}.fir-context canvas{height:150px}.fir-context:not(.mobile-open){display:none}.micro-control{padding:10px;width:132px}.micro-control.speed-panel{width:220px}.heading-dial{z-index:18}.map-tools{gap:4px}.map-tools button{padding-inline:7px}}@media(max-height:650px){.level-column{height:145px}.level-column input[type=range]{height:129px}.fir-context canvas{height:125px}.micro-control{padding:9px}.micro-control header{margin-bottom:6px}}
:root{color-scheme:dark;--bg:#1b2229;--panel:#16232eef;--line:#39505e;--text:#d8e5ea;--muted:#94a8b5;--blue:#86bfe7;--arr:#f2b3cd;--dep:#91d6a0;--ovr:#ebdf87;--danger:#ff807a}
body{margin:0;background:var(--bg);color:var(--text);font:12px 'Segoe UI',Arial,sans-serif;overflow:hidden}button,input,select{font:inherit}button{color:#b3d5ec;background:#1c3040;border:1px solid #466174;border-radius:3px;cursor:pointer;padding:8px 10px;transition:background .15s,border-color .15s}button:hover{background:#304b60;border-color:#91bfdc}button:disabled{opacity:.38;cursor:default}button:focus-visible,input:focus-visible,select:focus-visible,.track:focus-visible{outline:2px solid #b8dbf5;outline-offset:3px}
#radar{position:relative;width:100vw;height:100dvh;min-height:530px;overflow:hidden;background:var(--bg)}canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair}#labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.hud{position:absolute;top:0;left:0;right:0;height:78px;display:flex;align-items:center;gap:25px;padding:0 28px;background:linear-gradient(#121c26ed,#121c26a6);border-bottom:1px solid #6b879b2d;pointer-events:none}.brand{display:flex;align-items:center;gap:13px;min-width:285px}.brand-icon{color:var(--blue);font-size:35px}.brand h1{font-size:17px;letter-spacing:3.5px;font-weight:400;margin:0 0 7px}.brand h1 b{font-weight:650}.brand small{font:8px monospace;letter-spacing:1.7px;color:var(--muted)}.brand i{display:inline-block;width:4px;height:4px;background:#92dba5;border-radius:50%;margin:0 8px 1px}.shift-stats{margin-left:auto;display:flex;gap:36px}.shift-stats>div{text-align:right;min-width:74px}.shift-stats b{font:22px 'Consolas',monospace;letter-spacing:.5px}.shift-stats small{display:block;color:var(--muted);font-size:8px;letter-spacing:1.5px;margin-top:5px}#clock{color:var(--blue)}.icon-button{width:29px;height:29px;padding:0;display:grid;place-items:center;pointer-events:auto;font-size:16px;border-color:#57718466;background:#263b4c77}
.sector-note{position:absolute;top:104px;left:29px;max-width:280px;pointer-events:none}.eyebrow{font:10px monospace;color:var(--blue);letter-spacing:1.7px}.eyebrow span{color:#9cabb5}.sector-note h2{font-size:19px;font-weight:400;margin:12px 0 7px;letter-spacing:-.3px}.sector-note p{font-size:10px;line-height:1.7;color:var(--muted);max-width:235px}.legend{display:flex;gap:14px;margin-top:18px;font:9px 'Consolas',monospace;letter-spacing:1px}.legend b{font-weight:400;margin-left:3px}.arr{color:var(--arr)}.dep{color:var(--dep)}.ovr{color:var(--ovr)}.map-caption{position:absolute;right:29px;top:107px;text-align:right;font:10px monospace;letter-spacing:1.5px;color:#adbdc8;pointer-events:none}.map-caption span{display:inline-block;margin-left:15px;color:var(--blue)}.map-caption small{display:block;font:8px monospace;letter-spacing:1px;color:#718793;margin-top:8px}
.track{position:absolute;pointer-events:auto;cursor:grab;touch-action:none;user-select:none;color:var(--track-color);padding:5px 7px 6px;background:#1b2229db;border:1px solid transparent;border-radius:2px;min-width:122px;font:11px/1.45 'Consolas','Courier New',monospace;box-shadow:0 0 8px #1b222955}.track:hover{border-color:#7b97ac88;background:#22313cf2}.track.dragging{cursor:grabbing;border-color:#b8d4e7aa;z-index:25!important}.track.selected{border-color:#9bbbc8b3;background:#263844ee;box-shadow:0 3px 18px #0004}.track b{font-weight:700;letter-spacing:.4px}.track .kind{font-size:8px;opacity:.8;float:right;margin:2px 0 0 12px}.track .track-level{margin-right:8px}.track .cleared{opacity:.7;font-size:10px}.track .track-route{font-size:9px;opacity:.75;display:flex;justify-content:space-between;gap:15px}.track.warning{border-left:2px solid #efad6e}.track.danger{color:var(--danger)!important;border-color:#ff807a99;background:#3b252bdd}.track .alert{display:block;font:9px monospace;letter-spacing:1px;color:#ffc096}.track .gate-ready{color:#c8edf9;font-size:8px;letter-spacing:1px}
.clearance{position:absolute;z-index:30;width:279px;background:linear-gradient(135deg,#213442f5,#172632f8);border:1px solid #688a9e;border-radius:5px;box-shadow:0 18px 50px #0006;padding:16px;backdrop-filter:blur(12px)}.card-head{display:flex;justify-content:space-between;align-items:center}.card-head small{font:8px monospace;letter-spacing:1.5px;color:var(--muted)}.card-head h3{font:21px monospace;margin:5px 0 9px;color:#e7f2f8;letter-spacing:.5px}.route-detail{font:9px/1.65 monospace;color:#a3bac8;padding-bottom:10px;border-bottom:1px solid #50708644}.flight-goal{font:10px/1.5 monospace;padding:10px 0;color:#d2e0ae}.clearance-fields{margin:3px 0 12px}label{font:8px monospace;letter-spacing:1px;color:#9cb3c4}output{float:right;font:13px monospace;letter-spacing:1px;color:#def0ff}input[type=range]{display:block;width:100%;margin:12px 0 16px;accent-color:#a2cbea;height:4px}select{display:block;width:100%;margin-top:6px;border:1px solid #557388;background:#152836;color:#d5e8f4;padding:7px;font:12px monospace;border-radius:2px}.two-col{display:grid;grid-template-columns:1fr 1fr;gap:8px}.primary{width:100%;padding:12px 14px;background:#a6cfe9;color:#132b3c;border:0;font-size:10px;font-weight:700;letter-spacing:1px}.primary:hover{background:#d0eaff}.primary span{float:right}.actions{margin-top:8px}.actions button{font:8px monospace;padding:9px 3px;letter-spacing:.2px}.handover{width:100%;margin-top:8px;font:9px monospace;letter-spacing:.7px;background:#294939;border-color:#618875;color:#c5e4ce}.handover:hover:not(:disabled){background:#3b6650}#commandHint{font:9px/1.6 monospace;color:#8da9bb;margin:10px 0 0;min-height:14px}
.radio{position:absolute;left:27px;bottom:84px;width:min(490px,calc(100% - 54px));z-index:15;pointer-events:none}.radio button{display:flex;align-items:center;gap:10px;padding:10px 12px;width:100%;font:9px monospace;text-align:left;color:#c0ced7;background:#14212bec;border-color:#405c6a66;pointer-events:auto}.radio button>b{margin-left:auto}.radio-dot{width:4px;height:4px;background:#96c8ad;box-shadow:0 0 7px #96c8ad;border-radius:50%;flex-shrink:0}#latestMessage{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#8fa6b4;font-size:9px}#messages{background:#14212bf5;border:1px solid #405c6a66;border-bottom:0;position:absolute;bottom:33px;left:0;right:0;max-height:190px;overflow:auto;padding:14px;pointer-events:auto;font:10px/1.6 monospace;color:#a5b9c6}#messages p{margin:0 0 9px}#messages p:first-child{color:#d0e7d4}
.map-tools{position:absolute;bottom:25px;left:50%;transform:translateX(-50%);display:flex;gap:13px;z-index:20;white-space:nowrap}.tool-group{display:flex;padding:4px;gap:3px;border:1px solid #4e6e8466;background:#14232def;border-radius:4px;box-shadow:0 4px 20px #0004}.map-tools button{font:9px monospace;letter-spacing:.5px;background:transparent;border-color:transparent;padding:8px 10px;min-height:31px}.map-tools button:hover{background:#314b5e}.map-tools button.on{background:#2c4a5d;border-color:#729ab570;color:#d5e9f9}.map-scale{position:absolute;right:29px;bottom:94px;display:flex;align-items:center;gap:20px;color:#8fa8b9;font:9px monospace;pointer-events:none}.map-scale>span{font-size:14px;color:#c3d4df}.map-scale div{text-align:center}#scaleLine{display:block;border:1px solid #91a9b9;border-top:0;width:60px;height:5px;margin-bottom:5px}.map-scale small{font-size:8px}#mapHint{position:absolute;bottom:8px;left:0;right:0;text-align:center;color:#6d8494;font:7px monospace;letter-spacing:1.2px;pointer-events:none}
#toast{position:absolute;top:95px;left:50%;transform:translateX(-50%);z-index:35;background:#273d4eef;border:1px solid #89b3cf88;padding:10px 18px;color:#d5ebfa;font:11px monospace;max-width:470px;text-align:center;opacity:0;transition:opacity .2s;pointer-events:none}#toast.visible{opacity:1}.traffic-drawer{position:absolute;left:27px;bottom:130px;width:300px;max-height:50vh;z-index:28;background:#172731f5;border:1px solid #5c7c8f;border-radius:4px;overflow:auto;padding:13px;box-shadow:0 10px 30px #0005}.drawer-title{font:10px monospace;letter-spacing:1px;display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}.drawer-title button{padding:1px 7px;background:transparent;border:0;font-size:18px}#flights{display:grid;gap:5px}.strip{padding:9px;text-align:left;font:10px monospace;display:flex;justify-content:space-between;border-color:#345366;background:#203744}.strip.active{border-color:#b2cddf}.strip small{color:#98acb6;font-size:8px}
.overlay{position:absolute;inset:0;z-index:50;display:flex;align-items:center;justify-content:center;background:#101a237a;backdrop-filter:blur(3px);padding:20px}.welcome{width:450px;max-width:100%;max-height:calc(100dvh - 40px);overflow:auto;padding:34px 37px;background:linear-gradient(135deg,#263949f7,#14242ff7);border:1px solid #91aec060;box-shadow:0 22px 100px #0007;border-radius:6px}.welcome h2{font-size:58px;font-weight:350;line-height:1.02;letter-spacing:-2.5px;margin:24px 0 18px;color:#f0f4f4}.welcome h2 em{color:#abd3ed;font-style:normal}.welcome>p{color:#aabecb;font-size:12px;line-height:1.8}.briefing-steps{margin:24px 0}.briefing-steps>div{border-left:1px solid #607f91;padding-left:15px;margin-bottom:16px}.briefing-steps b{font:9px monospace;letter-spacing:1px;color:#d5e9f7}.briefing-steps p{font-size:11px;line-height:1.7;color:#99b0bf;margin:6px 0}.briefing-foot{display:block;margin-top:15px;color:#9bb0bd;font:8px monospace;letter-spacing:.7px;text-align:center}.welcome .fine{font-size:9px;color:#6f8a9a;margin:18px 0 0;line-height:1.6}.result-card h2{font-size:46px}.result-card .primary{margin-top:20px}#resultBreakdown{display:flex;gap:24px;margin:25px 0 10px}#resultBreakdown b{font:26px monospace;display:block;color:#c9e2f3}#resultBreakdown small{display:block;color:#8fa8b7;font:8px monospace;letter-spacing:1px;margin-top:5px}.hidden{display:none!important}
@media(max-height:740px){.welcome{padding:24px 30px}.welcome h2{font-size:43px;margin:16px 0}.briefing-steps{margin:16px 0}.briefing-steps>div{margin-bottom:10px}.sector-note{top:94px}.clearance{padding:12px}.flight-goal{padding:6px 0}}
@media(max-width:760px){.hud{padding:0 15px;gap:10px;height:68px}.brand{min-width:0}.brand h1{font-size:12px;letter-spacing:2px}.brand small{font-size:6px;letter-spacing:.5px}.brand-icon{display:none}.shift-stats{gap:13px}.shift-stats>div{min-width:49px}.shift-stats b{font-size:17px}.shift-stats small{font-size:6px;letter-spacing:.5px}.sector-note{top:90px;left:17px;max-width:220px}.sector-note h2{font-size:15px}.sector-note p{max-width:180px;font-size:9px}.map-caption{display:none}.map-tools{gap:5px;bottom:22px}.tool-group{padding:2px;gap:0}.map-tools button{font-size:8px;padding:7px;letter-spacing:0}.map-tools button span{display:none}.map-scale{right:15px;bottom:117px;gap:10px}.radio{left:15px;bottom:77px;width:calc(100% - 30px)}.clearance{width:250px}.track{font-size:10px;min-width:112px}#toast{font-size:9px;top:78px;max-width:70%;width:max-content}#mapHint{font-size:6px;letter-spacing:.3px}.traffic-drawer{left:15px;width:270px}}
