:root{color-scheme:dark;--bg:#07121d;--panel:#102333;--panel2:#142c3e;--edge:#274252;--muted:#89a2b3;--white:#ebf5fa;--cyan:#69d6e4;--green:#9be3bc;--blue:#8baeff;--amber:#ffd08b;--red:#ffadb0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 5% 0%,#12394d 0%,transparent 34%),var(--bg);color:var(--white);font-size:14px}button,select,input{font:inherit}button{cursor:pointer}a{color:var(--cyan);text-decoration:none}button:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--cyan);outline-offset:3px} [hidden]{display:none!important}
.page{max-width:1780px;padding:20px 25px 18px;margin:0 auto}.header,.header-right,.identity,.view-switch,.intro,.intro-actions,.controls,.metrics,.section-heading,.movement-title,.movement-title>div,.status,.map-overlay,.legend-item,.flight-row,.flight-time,.footer{display:flex;align-items:center}.header,.intro,.section-heading,.status,.movement-title,.flight-row,.footer{justify-content:space-between}.header{gap:18px;padding-bottom:19px;border-bottom:1px solid #244052}.identity{gap:12px}.mark{display:grid;place-items:center;width:49px;height:49px;background:linear-gradient(140deg,#278b9d,#135166);border:1px solid #58b9ca;border-radius:14px;font-size:25px}.brand{font-weight:820;letter-spacing:.12em;font-size:15px}.brand b{color:var(--cyan)}.version{font-size:9px;color:#94d8df;border:1px solid #3d7385;padding:2px 4px;border-radius:3px;vertical-align:middle}.subbrand{font-size:10px;letter-spacing:.08em;color:var(--muted);margin-top:5px}.header-right{gap:24px}.clock{text-align:right}.clock strong{display:block;font-size:25px;line-height:1.1;letter-spacing:-.04em;font-variant-numeric:tabular-nums}.clock span{font-size:9px;color:var(--muted);letter-spacing:.06em}.view-switch{border:1px solid var(--edge);background:#0f2231;padding:4px;gap:3px;border-radius:12px}.view-switch a{font-size:12px;color:var(--muted);border-radius:8px;padding:8px 11px;white-space:nowrap}.view-switch a.active{color:#041824;background:#a5e4eb;font-weight:750}
.intro{gap:18px;padding:22px 0 18px}.eyebrow,.section-kicker{font-size:10px;letter-spacing:.16em;font-weight:750;color:var(--cyan)}.live-dot{display:inline-block;width:7px;height:7px;background:var(--cyan);border-radius:50%;margin-right:5px}.intro h1{font-size:clamp(26px,3vw,41px);margin:7px 0 5px;line-height:1.05;letter-spacing:-.04em}.intro h1 em{font-style:normal;font-size:.5em;vertical-align:middle;color:var(--cyan);border:1px solid #377286;background:#103442;padding:5px 8px;border-radius:7px;letter-spacing:.02em}.intro p{color:var(--muted);font-size:12px;margin:0;line-height:1.5}.intro-actions{gap:8px}.btn{border:1px solid var(--edge);color:var(--white);background:#163043;border-radius:10px;padding:10px 14px;white-space:nowrap}.icon-btn{font-size:22px;min-width:43px;padding:6px 12px}.btn-outline{background:transparent}.btn-primary{background:#9cdee6;color:#09212e;border-color:#9cdee6;font-weight:750}
.controls{background:rgba(17,38,54,.93);border:1px solid var(--edge);border-radius:15px;padding:13px;gap:13px;flex-wrap:wrap}.control{font-size:10px;text-transform:uppercase;letter-spacing:.07em;font-weight:700;color:var(--muted);display:flex;flex-direction:column;gap:6px;min-width:0}.control select,.control input,.custom-fields input,.custom-fields select{border:1px solid #39576b;border-radius:9px;color:#f1f9ff;background:#0a1a29;outline:0;padding:9px 11px;height:40px;min-width:0}.base-control{flex:2 1 240px}.radius-control{flex:0.75 1 95px}.search-control{flex:1.2 1 140px}.alert-control{flex:0 1 145px}.alert-group{display:flex;gap:5px}.btn-toggle,.btn-notify{height:40px;border-radius:9px;border:1px solid #39576b;color:#ddebf7;background:#0b1d2c;padding:8px 13px;font-size:12px}.btn-toggle.active{color:#082119;background:var(--green);border-color:var(--green);font-weight:800}.btn-notify{background:#1c384a}.custom-airport{margin-top:10px;background:#183246;border:1px solid #386d82;padding:15px;border-radius:13px}.custom-airport>strong{display:block}.custom-airport>span{color:var(--muted);font-size:12px}.custom-fields{display:flex;gap:8px;flex-wrap:wrap;align-items:end;margin-top:12px}.custom-fields label{font-size:11px;color:var(--muted);display:grid;gap:4px}.custom-fields input{width:135px}.custom-fields select{width:150px}.form-error{color:var(--red);font-size:12px;margin-top:8px}
.status{gap:12px;padding:11px 14px;border:1px solid #325166;border-radius:12px;background:#13283a;margin-top:13px;min-height:61px}.status-dot{flex-shrink:0;width:11px;height:11px;border-radius:50%;background:#bdc8cf;box-shadow:0 0 0 6px #ffffff10}.status.ok .status-dot{background:var(--green);box-shadow:0 0 0 6px #9be3bc20}.status.error .status-dot{background:var(--red);box-shadow:0 0 0 6px #ffadb020}.status.demo .status-dot{background:var(--amber)}.status>div{flex:1}.status strong{display:block;font-size:13px}.status span#statusSub{display:block;color:var(--muted);font-size:11px;margin-top:4px}.status-date{font-size:11px;color:var(--muted);white-space:nowrap}.demo-banner{background:#5e4527;border:1px solid #a8894d;color:#ffe6af;border-radius:8px;font-weight:780;letter-spacing:.07em;text-align:center;padding:12px;margin-top:16px;font-size:12px}.demo-banner a{margin-left:12px;color:#fff;text-decoration:underline}.approach-banner{margin-top:11px;background:#235445;border:1px solid #4bb897;color:#e4fff0;padding:13px 15px;display:flex;gap:9px;align-items:center;border-radius:12px;flex-wrap:wrap}.approach-banner span{flex:1;color:#d6f9ed;font-size:12px}.approach-banner button{background:transparent;border:0;color:white;font-size:21px}
.metrics{gap:12px;margin:14px 0 22px}.metric{flex:1;min-width:0;background:#12283a;border:1px solid var(--edge);padding:15px 17px;border-radius:15px}.metric span{display:block;font-size:10px;font-weight:780;letter-spacing:.10em;color:var(--muted)}.metric strong{display:block;font-size:35px;line-height:1.15;letter-spacing:-.04em;margin-top:7px;font-variant-numeric:tabular-nums}.metric small{display:block;color:var(--muted);font-size:10px;margin-top:4px}.metric.green strong{color:var(--green)}.metric.blue strong{color:var(--blue)}.metric.amber strong{color:var(--amber)}
.workspace{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(350px,1fr);gap:20px;align-items:start}.map-column,.board-column{min-width:0}.section-heading{align-items:flex-end;margin:0 2px 12px;gap:12px}.section-heading h2{font-size:20px;letter-spacing:-.02em;margin:4px 0 0}.map-counter{font-size:11px;color:var(--muted);white-space:nowrap}.map-frame{position:relative;border:1px solid #36556a;overflow:hidden;border-radius:17px;background:#102b3d}.live-map,.radar{width:100%;height:clamp(410px,55vh,700px);z-index:0}.radar{background:radial-gradient(ellipse at center,#15384b 0%,#071c2e 74%);display:grid;place-items:center}.radar-grid{position:relative;width:90%;height:90%}.radar-h{position:absolute;inset:4% 15%;border-left:1px solid #3b657f44;border-right:1px solid #3b657f44;border-top:1px solid #3b657f44;border-bottom:1px solid #3b657f44}.radar-h:before,.radar-h:after{content:"";position:absolute;background:#5f93a53d}.radar-h:before{top:50%;left:0;right:0;height:1px}.radar-h:after{left:50%;top:0;bottom:0;width:1px}.radar-ring{position:absolute;aspect-ratio:1;border:1px solid #6ba2b963;border-radius:50%;top:50%;left:50%;transform:translate(-50%,-50%)}.r1{width:32%}.r2{width:64%}.r3{width:95%}.radar-airport{position:absolute;z-index:2;background:#ffffff;border-radius:50%;width:8px;height:8px;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 5px #b9eff947}.radar-north,.radar-west,.radar-east,.radar-south{position:absolute;color:#8ebace;font-size:10px}.radar-north{top:0;left:51%}.radar-south{bottom:0;left:51%}.radar-west{left:0;top:51%}.radar-east{right:0;top:51%}.radar-plane{position:absolute;z-index:2;transform:translate(-50%,-50%);display:grid;justify-items:center;color:var(--white)}.radar-plane b{border-radius:50%;width:9px;height:9px;background:var(--amber);box-shadow:0 0 0 3px #051524}.radar-plane b.inbound{background:var(--green)}.radar-plane b.outbound{background:var(--blue)}.radar-plane small{background:#0b1f2fed;padding:1px 4px;margin-top:4px;border-radius:4px;white-space:nowrap;font-size:10px}.radar-note{position:absolute;top:13px;left:13px;z-index:3;font-size:11px;padding:7px 10px;border-radius:7px;background:#091926ea;color:#a8d0e5}.map-overlay{gap:14px;flex-wrap:wrap;position:absolute;bottom:13px;left:13px;right:13px;width:fit-content;background:#071a2af0;border:1px solid #3b5769;padding:8px 10px;border-radius:9px;z-index:400;font-size:11px}.legend-item{gap:6px}.legend-circle{width:9px;height:9px;border-radius:50%;background:var(--amber)}.legend-circle.inbound{background:var(--green)}.legend-circle.outbound{background:var(--blue)}.map-foot{font-size:11px;color:var(--muted);margin:9px 3px 0;line-height:1.5}.leaflet-container{background:#0b273b!important}.leaflet-control-attribution{font-size:10px!important;background:#eaf6fcdf!important}.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:#0b2233!important;color:#e7f9ff!important}.leaflet-control-zoom a{background:#112c3d!important;color:#c9f0f5!important;border-color:#416278!important}.plane-marker{display:flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;border:1px solid #213546;background:#1f3c4b;color:#ffd08b;font-size:20px;box-shadow:0 2px 8px #041018a8}.plane-marker.inbound{color:#9be3bc}.plane-marker.outbound{color:#8baeff}.plane-marker .rot{display:inline-block;transform-origin:center}
.board-top{margin-bottom:14px}.movement{background:#102333;border:1px solid var(--edge);border-radius:15px;overflow:hidden;margin-bottom:13px}.movement-title{padding:12px 14px;border-bottom:1px solid #244359}.movement-title>div{gap:10px}.movement-title h3{margin:0;font-size:14px}.move-icon{width:28px;height:28px;display:grid;place-items:center;border-radius:8px;background:#254b44;color:var(--green);font-weight:700;font-size:18px}.movement-out .move-icon{background:#273c64;color:var(--blue)}.movement-other .move-icon{background:#3a3940;color:var(--amber)}.count-bubble{border:1px solid #38536b;border-radius:9px;padding:4px 9px;font-size:12px;color:#cadee9;font-weight:780;min-width:29px;text-align:center}.flight-list{max-height:295px;overflow-y:auto}.flight-row{gap:10px;padding:12px 14px;border-bottom:1px solid #244052;align-items:center}.flight-row:last-child{border-bottom:0}.flight-row.selected{background:#244a5c}.flight-row button{background:transparent;border:0;color:inherit;padding:0;min-width:0;text-align:left;cursor:pointer;flex:1}.flight-ident{display:block;font-size:15px;font-weight:750;line-height:1.2}.flight-sub{display:block;color:var(--muted);font-size:11px;margin-top:4px}.flight-right{text-align:right;min-width:85px}.flight-distance{display:block;color:#d6f7ff;font-size:15px;font-weight:780;font-variant-numeric:tabular-nums}.flight-meta{display:block;color:var(--muted);margin-top:4px;font-size:10px}.flight-empty{padding:17px;text-align:center;color:var(--muted);font-size:12px;line-height:1.5}.flight-label{display:inline-block;margin-left:5px;padding:2px 6px;border-radius:5px;background:#2f4b53;color:#bde6eb;font-size:9px;font-weight:650}.footer{margin:20px 0 5px;border-top:1px solid #234051;padding-top:13px;color:var(--muted);font-size:11px;gap:14px;line-height:1.6;align-items:flex-start}.footer>div:first-child{max-width:630px}.footer>div:last-child{text-align:right}.footer span{padding:0 5px}
@media(max-width:980px){.workspace{grid-template-columns:minmax(0,1fr)}.board-column{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.board-top{grid-column:1/-1}.movement{margin:0}.movement-other{grid-column:1/-1}.live-map,.radar{height:440px}}@media(max-width:630px){.page{padding:15px 13px 65px}.header{align-items:flex-start;flex-wrap:wrap;gap:12px}.brand{font-size:13px}.subbrand{font-size:8px}.mark{width:43px;height:43px}.header-right{width:100%;justify-content:space-between;flex-direction:row-reverse;gap:8px}.view-switch a{padding:8px 10px;font-size:11px}.clock strong{font-size:20px}.intro{align-items:flex-start}.intro h1{font-size:29px}.intro p{font-size:11px}.intro-actions{gap:5px}.intro-actions .btn-outline{display:none}.control{flex:1 1 120px}.base-control{flex:1 1 100%}.search-control{flex:2 1 160px}.alert-control{flex:1 1 112px}.controls{gap:12px;padding:11px}.metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.metric{padding:13px}.metric strong{font-size:29px}.metric span{font-size:9px}.status{align-items:center}.status-date{display:none}.section-heading h2{font-size:18px}.map-counter{font-size:10px}.live-map,.radar{height:370px}.map-overlay{font-size:9px;gap:8px;left:7px;bottom:7px;padding:7px}.board-column{display:block}.movement{margin-bottom:11px}.footer{display:block}.footer>div:last-child{text-align:left;margin-top:10px}.custom-fields input{width:120px}}
body[data-view="tv"] .page{max-width:none;padding:18px 24px 12px}body[data-view="tv"] .header{padding-bottom:12px}body[data-view="tv"] .intro{padding:13px 0}body[data-view="tv"] .intro p{display:none}body[data-view="tv"] .controls{padding:10px}body[data-view="tv"] .metrics{margin:10px 0 16px}body[data-view="tv"] .metric{padding:13px 18px}body[data-view="tv"] .metric strong{font-size:37px}body[data-view="tv"] .workspace{grid-template-columns:minmax(0,1.25fr) minmax(370px,.85fr);gap:16px}body[data-view="tv"] .live-map,body[data-view="tv"] .radar{height:calc(100vh - 398px);min-height:330px}body[data-view="tv"] .movement{margin-bottom:10px}body[data-view="tv"] .flight-list{max-height:19vh}body[data-view="tv"] .flight-row{padding:10px 13px}body[data-view="tv"] .footer{font-size:10px;margin-top:10px}
body[data-view="map"] .workspace{grid-template-columns:1fr}body[data-view="map"] .board-column{display:none}body[data-view="map"] .live-map,body[data-view="map"] .radar{height:calc(100vh - 380px);min-height:440px}
@media(max-width:930px){body[data-view="tv"] .workspace{grid-template-columns:1fr}body[data-view="tv"] .live-map,body[data-view="tv"] .radar{height:470px}body[data-view="tv"] .flight-list{max-height:250px}}
/* Make the whole movement overview practical on a landscape engineering-office screen. */
@media(min-width:1250px){
 body[data-view="tv"] .board-column{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;align-content:start}
 body[data-view="tv"] .board-top,body[data-view="tv"] .movement-other{grid-column:1/-1}
 body[data-view="tv"] .movement{margin-bottom:0}
 body[data-view="tv"] .flight-list{max-height:230px}
 body[data-view="tv"] .flight-row{padding:8px 10px}
 body[data-view="tv"] .movement-title{padding:8px 10px}
 body[data-view="tv"] .flight-ident{font-size:13px}
 body[data-view="tv"] .flight-distance{font-size:13px}
 body[data-view="tv"] .movement-other .flight-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 body[data-view="tv"] .movement-other .flight-row:nth-child(odd){border-right:1px solid var(--edge)}
}

/* V3: arrival-time first, distance as secondary information. */
.flight-right{min-width:104px;max-width:155px}
.flight-eta{display:block;font-size:21px;line-height:1.12;font-weight:850;color:var(--green);font-variant-numeric:tabular-nums;white-space:nowrap}
.flight-estimate{display:block;font-size:11px;color:#a9ecce;margin-top:3px;font-weight:650;white-space:nowrap}
.flight-right .flight-meta{font-size:10px;margin-top:5px;white-space:normal;line-height:1.25}
.metric.amber strong{font-size:34px;color:var(--green)}
.flight-row .flight-distance.secondary{font-size:12px;font-weight:650;color:var(--muted)}
.eta-note{font-weight:650}
body[data-view="tv"] .flight-eta{font-size:22px}
body[data-view="tv"] .flight-right{min-width:100px}
body[data-view="tv"] .metric.amber strong{font-size:36px}
@media(max-width:630px){.flight-eta{font-size:22px}.flight-right{min-width:102px}.metric.amber strong{font-size:29px}}
@media(min-width:1250px){body[data-view="tv"] .flight-eta{font-size:18px}body[data-view="tv"] .flight-right{min-width:83px}body[data-view="tv"] .flight-estimate{font-size:10px}}

/* V4 -- fleet selection, status and global position lookup */
.search-control{flex:1.5 1 230px}.search-control select{width:100%;letter-spacing:0;text-transform:none;font-size:13px;font-weight:650}
.fleet-detail{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:12px;border:1px solid #397489;background:linear-gradient(115deg,#103448,#0c2233);border-radius:15px;padding:15px 18px}
.fleet-detail-left,.fleet-detail-right{display:flex;flex-direction:column;gap:5px;min-width:150px}.fleet-detail-left{flex:1.2}.fleet-detail-right{flex:1.3}
.fleet-detail-left strong{font-size:26px;letter-spacing:-.04em}.fleet-detail-right strong{font-size:17px;color:var(--green)}
.fleet-detail-left span:not(.section-kicker),.fleet-detail-right span{font-size:12px;color:#a9c4d3;line-height:1.3}
.fleet-recenter{font-size:12px;min-width:148px}.fleet-disclaimer{width:100%;font-size:10px;line-height:1.4;color:#86a5b5}
.fleet-detail[data-status="airborne"] #fleetStatus,.fleet-detail[data-status="ground"] #fleetStatus{color:var(--green)}
.fleet-detail[data-status="offline"] #fleetStatus{color:var(--red)}
.fleet-detail[data-status="last"] #fleetStatus{color:var(--amber)}
.plane-marker.selected{box-shadow:0 0 0 4px #73dcea88,0 2px 8px #041018a8;border:2px solid white}
.flight-row.selected{background:#1a4755}.flight-empty{line-height:1.5}
@media(max-width:650px){.fleet-detail{gap:11px;padding:13px}.fleet-detail-left strong{font-size:23px}.fleet-detail-right{order:2;flex:1 1 100%}.fleet-recenter{order:3;flex:1}}
body[data-view="tv"] .fleet-detail{padding:12px 17px}