/* Design system adopted from Gasballoon Cockpit */
:root{
  --bg:#0d1117; --panel:#141a21; --panel2:#1b232c; --border:#2a3540;
  --text:#e6edf3; --muted:#8b98a5; --accent:#3fd0c9; --accent2:#ffb454;
  --good:#3fd06b; --warn:#e0b400; --bad:#e0483f;
  --violet:#b78cff; --grid-line:#2a3540;
  --mono:'SF Mono','Consolas','Menlo',monospace;
  --sans:-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --drawer-w:clamp(220px,18vw,620px);
}
body.day{
  --bg:#eef1f3; --panel:#ffffff; --panel2:#f4f6f8; --border:#d3dae0;
  --text:#16202a; --muted:#5c6b78; --accent:#0f8f86; --accent2:#c97a12;
  --good:#1c8a49; --warn:#a87400; --bad:#b8342b;
  --violet:#7a4fd1; --grid-line:#d3dae0;
}

*{box-sizing:border-box;}
html,body{margin:0;padding:0;height:100%;height:-webkit-fill-available;width:100%;overflow:hidden;overscroll-behavior:none;touch-action:pan-x pan-y;background:var(--bg);color:var(--text);font-family:var(--sans);position:fixed;inset:0;}
#app{display:flex;flex-direction:column;height:100vh;height:-webkit-fill-available;height:100dvh;width:100vw;overscroll-behavior:none;padding-top:env(safe-area-inset-top,0px);}

/* ---- topbar ---- */
#topbar{display:flex;align-items:center;gap:8px;padding:6px 10px;background:var(--panel);border-bottom:1px solid var(--border);font-size:12px;flex-shrink:0;flex-wrap:nowrap;position:sticky;top:0;z-index:1000;min-height:44px;overflow:visible;}
#topbar::-webkit-scrollbar{display:none;}
#topbar .title{font-weight:700;letter-spacing:.5px;color:var(--accent);font-size:13px;white-space:nowrap;}
#topbar .sep{width:1px;height:20px;background:var(--border);flex-shrink:0;}
#topbar .spacer{flex:1;}
.wx-chip{display:flex;flex-direction:column;line-height:1.2;gap:1px;flex-shrink:0;}
.wx-chip{max-width:150px;min-width:0;}
.wx-chip b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px;color:var(--text);font-size:12px;font-weight:600;white-space:nowrap;}
.wx-chip span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:150px;color:var(--muted);font-size:9.5px;white-space:nowrap;}
.wx-chip.status{text-align:right;align-items:flex-end;max-width:34ch;overflow:hidden;}
.wx-chip-line{display:flex;align-items:center;gap:4px;}
#wxModelChip{cursor:pointer;align-items:flex-start;}
#wxModelChip:active{opacity:.7;}
.iconbtn{background:var(--panel2);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:8px 10px;font-size:16px;cursor:pointer;display:flex;align-items:center;gap:6px;flex-shrink:0;}
.iconbtn:active{transform:scale(0.95);}
.logo-chip{background:#fff;border-radius:6px;padding:3px 7px;margin-left:2px;display:inline-flex;align-items:center;flex-shrink:0;}
.logo-chip img{height:28px;width:auto;display:block;}

#wxModelPopover{display:none;position:fixed;background:var(--panel2);border:1px solid var(--border);border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,.4);padding:6px 0;z-index:5000;flex-direction:column;min-width:230px;max-height:70vh;overflow-y:auto;-webkit-overflow-scrolling:touch;}
#wxModelPopover.open{display:flex;}
#wxModelPopover button{background:none;border:none;border-bottom:1px solid var(--border);color:var(--text);text-align:left;padding:9px 14px;font-size:12px;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;}
#wxModelPopover button:last-child{border-bottom:none;}
#wxModelPopover button:active{background:var(--panel);}
#wxModelPopover button.active{color:var(--accent);font-weight:700;}
#wxModelPopover button.active::after{content:'✓';}

.mode-toggle{display:flex;gap:6px;flex-shrink:0;}
.mode-toggle label{position:relative;}
.mode-toggle input{position:absolute;opacity:0;width:0;height:0;}
.mcard{display:flex;align-items:center;gap:6px;padding:3px 8px 4px;border:1px solid var(--border);border-radius:9px;background:var(--panel2);cursor:pointer;user-select:none;color:var(--muted);transition:border-color .15s,background .15s,color .15s;}
.micon{flex-shrink:0;}
.mtxt{display:flex;flex-direction:column;line-height:1.2;}
.mname{font-size:11.5px;font-weight:600;white-space:nowrap;}
.msub{font-size:9px;color:var(--muted);white-space:nowrap;}
.mode-toggle input:checked + .mcard.fwd{border:2px solid #4169e1;background:rgba(65,105,225,0.16);color:#7fa3ef;padding:2px 7px 3px;}
.mode-toggle input:checked + .mcard.fwd .mname,.mode-toggle input:checked + .mcard.fwd .msub{color:#7fa3ef;}
body.day .mode-toggle input:checked + .mcard.fwd{color:#2a4fb8;}
body.day .mode-toggle input:checked + .mcard.fwd .mname,body.day .mode-toggle input:checked + .mcard.fwd .msub{color:#2a4fb8;}
.mode-toggle input:checked + .mcard.bwd{border:2px solid #e0483f;background:rgba(224,72,63,0.16);color:#ef8d87;padding:2px 7px 3px;}
.mode-toggle input:checked + .mcard.bwd .mname,.mode-toggle input:checked + .mcard.bwd .msub{color:#ef8d87;}
body.day .mode-toggle input:checked + .mcard.bwd{color:#b0362e;}
body.day .mode-toggle input:checked + .mcard.bwd .mname,body.day .mode-toggle input:checked + .mcard.bwd .msub{color:#b0362e;}
.mcard:active{transform:scale(0.97);}

.legend-chips{display:flex;gap:12px;font-size:10.5px;color:var(--muted);white-space:nowrap;flex-shrink:0;align-items:center;}
.legend-chips span{display:inline-flex;align-items:center;gap:4px;}

/* ---- main / map ---- */
#main{flex:1;position:relative;min-height:0;overflow:hidden;}
#mapwrap{position:absolute;inset:0;}
#map{width:100%;height:100%;background:#0a0d10;}
body.day #map{background:#dfe6ea;}

/* version badge, bottom-left on map (cockpit idiom) */
.version-badge{position:absolute;left:6px;bottom:2px;z-index:900;pointer-events:none;background:rgba(255,255,255,0.8);color:#1a1a1a;padding:2px 6px;border-radius:4px;font-size:9px;font-family:sans-serif;line-height:1.4;}

/* strong signatures */
.sig-icon{filter:drop-shadow(0 1px 2px rgba(0,0,0,.8));}
.sig-icon svg{display:block;}

/* base layer radio control, top-right on map (cockpit idiom) */
.base-layer-radio{background:var(--panel2);border:1px solid var(--border);border-radius:8px;padding:5px 8px;display:flex;flex-direction:column;align-items:flex-start;gap:3px;box-shadow:0 2px 8px rgba(0,0,0,.3);text-align:left;}
.base-layer-radio label{display:flex;align-items:center;justify-content:flex-start;gap:5px;font-size:11px;color:var(--text);cursor:pointer;white-space:nowrap;width:100%;}
.base-layer-radio input[type="radio"]{margin:0;accent-color:var(--accent);cursor:pointer;}

/* Leaflet zoom + scale bottom-right (cockpit idiom) */
.leaflet-bottom.leaflet-right .leaflet-control-zoom{margin-bottom:34px;margin-right:10px;border:1px solid var(--border);box-shadow:0 2px 8px rgba(0,0,0,.3);}
.leaflet-control-zoom a{background:var(--panel2) !important;color:var(--text) !important;border-color:var(--border) !important;width:34px;height:34px;line-height:34px;font-size:16px;}
.leaflet-control-zoom a:active{background:var(--accent) !important;color:#00201d !important;}
.leaflet-bottom.leaflet-right .leaflet-control-scale{margin-bottom:10px;margin-right:10px;background:rgba(255,255,255,0.85);padding:3px 6px;border-radius:4px;box-shadow:0 1px 4px rgba(0,0,0,.25);}
.leaflet-control-scale-line{border:1px solid #1a1a1a;border-top:none;color:#1a1a1a;background:transparent;font-size:9px;}

/* ---- settings drawer (right, with handle) ---- */
#menuDrawer{position:absolute;top:0;left:0;height:100%;width:var(--drawer-w);background:var(--panel);border-right:1px solid var(--border);z-index:950;display:flex;flex-direction:column;transform:translateX(0);transition:transform .25s ease;box-shadow:4px 0 18px rgba(0,0,0,.35);}
#menuDrawer.collapsed{transform:translateX(-102%);box-shadow:none;}

.drawer-head{display:flex;align-items:center;justify-content:space-between;padding:4px 10px;border-bottom:1px solid var(--border);flex-shrink:0;}
.drawer-head span{font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);font-weight:700;}
.drawer-head .overlay-close{position:static;}
.drawer-grid{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:4px;display:grid;grid-template-columns:1fr;gap:3px;align-content:start;scrollbar-width:none;}
.drawer-grid::-webkit-scrollbar{display:none;}
.card.wide2,.calc-card{grid-column:1/-1;}
@media (max-width:560px){.drawer-grid{grid-template-columns:1fr;}.card.wide2{grid-column:1;}}
.calc-card{background:transparent;border:none;padding:2px 0 0;}

/* ---- cards ---- */
.card{background:var(--panel2);border:1px solid var(--border);border-radius:8px;padding:4px 5px;overflow:hidden;}
.card h3{margin:0 0 2px 0;font-size:10px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted);display:flex;align-items:center;justify-content:space-between;cursor:pointer;user-select:none;}
.card h3 .chev{transition:transform .15s;color:var(--muted);}
.card.collapsed .chev{transform:rotate(-90deg);}
.card.collapsed .cardbody{display:none;}

/* label-above-value cells (cockpit datacell idiom, editable) */
.cellgrid{display:grid;grid-template-columns:1fr 1fr;gap:3px 4px;}
.cellgrid.cols4{grid-template-columns:1fr 1fr;}
@media (max-width:560px){.cellgrid.cols4{grid-template-columns:1fr 1fr;}}
.fcell{background:var(--panel);border-radius:5px;padding:2px 5px 3px;overflow:hidden;min-width:0;}
.fcell > label{display:block;font-size:8px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.fcell.wide{grid-column:1/-1;}
.fcell.span2{grid-column:span 2;}
.fcell.hintcell .hint{margin:0;}
.fcell.statuscell{padding:0;background:transparent;}
.fcell.statuscell:has(.status-box:empty){display:none;}

input,select{width:100%;background:transparent;border:none;border-bottom:1px solid var(--border);color:var(--text);border-radius:0;padding:1px 0 2px;font-size:12.5px;font-weight:400;font-family:var(--mono);}
select{font-family:var(--sans);font-weight:400;}
input:focus,select:focus{outline:none;border-bottom-color:var(--accent);}
button:focus-visible{outline:2px solid var(--accent);outline-offset:1px;}
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0;}
input[type=number]{-moz-appearance:textfield;appearance:textfield;}
input::placeholder{color:var(--muted);font-weight:400;}

.pair{display:grid;grid-template-columns:1fr 1fr;gap:5px;}
.btn-row{display:flex;gap:5px;align-items:center;}
.btn-row input{flex:1;min-width:0;}

.hint{font-size:9px;color:var(--muted);margin:2px 0 0;line-height:1.3;}
.hint.err{color:var(--bad);min-height:1em;}
.hint.disclaimer{margin-top:4px;font-size:8.5px;}

.status-box{font-size:11px;font-family:var(--mono);border-radius:6px;}
.status-box:empty{display:none;}
.status-box.ok{padding:6px 8px;background:rgba(63,208,107,0.12);color:var(--good);border:1px solid rgba(63,208,107,0.35);}
.status-box.err{padding:6px 8px;background:rgba(224,72,63,0.12);color:var(--bad);border:1px solid rgba(224,72,63,0.35);}

button.primary{background:var(--accent);color:#00201d;border:none;border-radius:8px;padding:9px;font-weight:700;font-size:13px;width:100%;cursor:pointer;}
button.primary:active{transform:scale(0.99);}
.ghost{background:transparent;border:1px solid var(--border);color:var(--text);border-radius:6px;padding:3px 6px;font-size:10.5px;cursor:pointer;white-space:nowrap;}
.ghost:active{background:var(--panel2);}

/* ---- results overlay ---- */
.overlay{position:fixed;inset:0;background:rgba(0,0,0,.72);z-index:5000;display:flex;align-items:center;justify-content:center;padding:18px;}
.overlay[hidden]{display:none;}
.overlay-box{background:var(--panel2);border:1px solid var(--border);border-radius:12px;padding:14px;padding-top:34px;width:min(96vw,1020px);max-height:calc(100dvh - 40px);overflow-y:auto;position:relative;-webkit-overflow-scrolling:touch;}
.overlay-close{position:absolute;top:8px;right:8px;background:var(--bad);color:#fff;border:2px solid var(--panel2);border-radius:50%;width:30px;height:30px;font-size:15px;line-height:1;cursor:pointer;z-index:2;flex-shrink:0;}

.results-header{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:10px;}
.results-header h2{margin:0;font-size:11px;text-transform:uppercase;letter-spacing:.8px;color:var(--muted);}
.export-actions{display:flex;gap:6px;flex-wrap:wrap;}

.results-body{display:grid;grid-template-columns:1fr 390px;gap:12px;align-items:start;}
@media (max-width:940px){.results-body{grid-template-columns:1fr;}}

.datagrid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:5px 7px;}
@media (max-width:640px){.datagrid{grid-template-columns:1fr 1fr;}}
.datacell{background:var(--panel);border-radius:5px;padding:2px 5px 3px;overflow:hidden;min-width:0;}
.datacell label{display:block;font-size:8px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.datacell .val{font-family:var(--mono);font-size:12.5px;font-weight:400;color:var(--text);display:block;line-height:1.35;white-space:normal;word-break:break-word;border-bottom:1px solid var(--border);padding:1px 0 2px;}
.datacell .val.small{font-size:10.5px;white-space:normal;}
.datacell.wide{grid-column:1/-1;}

.profile-box{background:var(--panel);border-radius:5px;padding:5px 6px;}
.profile-box label{display:block;font-size:9px;color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:5px;}
#profileSvg{width:100%;height:auto;display:block;}

/* Leaflet theming */
.leaflet-popup-content-wrapper,.leaflet-popup-tip{background:var(--panel2);color:var(--text);}
.leaflet-control-attribution{font-size:9px !important;}

/* ---- print: results only ---- */
@media print{
  #topbar,#menuDrawer,#drawerHandle,#resultsHandle,#mapwrap,.export-actions,.overlay-close{display:none !important;}
  #app,#main{display:block;position:static;height:auto;overflow:visible;}
  #resultsDrawer{position:static;transform:none !important;width:100%;height:auto;border:none;box-shadow:none;display:block;}
  #resultsDrawer.collapsed{transform:none !important;}
  .results-scroll{overflow:visible;display:block;}
  body{background:#fff;color:#000;position:static;overflow:visible;}
  html{position:static;overflow:visible;}
}
}

.preset-editor{border:1px solid var(--warn);}
.preset-editor #presetMsg{white-space:normal;}

/* ---- results drawer (left, with handle) ---- */
:root{--results-w:clamp(230px,18vw,440px);--vsl-h:clamp(80px,calc(100dvh - 562px),172px);}
#resultsDrawer{position:absolute;top:0;right:0;height:100%;width:var(--results-w);background:var(--panel);border-left:1px solid var(--border);z-index:940;display:flex;flex-direction:column;transform:translateX(0);transition:transform .25s ease;box-shadow:-4px 0 18px rgba(0,0,0,.35);}
#resultsDrawer.collapsed{transform:translateX(102%);box-shadow:none;}
.results-scroll{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;padding:5px;display:flex;flex-direction:column;gap:4px;scrollbar-width:none;}
.results-scroll::-webkit-scrollbar{display:none;}
#resultsDrawer .datagrid{grid-template-columns:1fr 1fr;}
#resultsDrawer .export-actions{display:flex;gap:6px;flex-wrap:wrap;}

.wx-group{font-size:9.5px;text-transform:uppercase;letter-spacing:.7px;color:var(--muted);padding:8px 14px 3px;border-bottom:1px solid var(--border);background:var(--panel);position:sticky;top:0;}

/* ---- labeled side handles ---- */
.side-handle{position:absolute;top:150px;z-index:960;width:42px;min-height:260px;padding:12px 0;display:flex;flex-direction:column;align-items:center;gap:12px;cursor:pointer;user-select:none;box-shadow:0 2px 10px rgba(0,0,0,.35);transition:left .25s ease,right .25s ease;}
.side-handle .hbadge{width:26px;height:26px;border-radius:50%;background:#fff;color:#16202a;font-size:14px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.side-handle .hlbl{writing-mode:vertical-rl;text-orientation:mixed;font-size:14px;font-weight:700;letter-spacing:.8px;white-space:nowrap;}
.side-handle:active{filter:brightness(1.12);}
#drawerHandle{left:var(--drawer-w);border-radius:0 11px 11px 0;background:#1c8a49;color:#fff;border:1px solid rgba(255,255,255,0.25);border-left:none;}
#drawerHandle.closed{left:0;}
#resultsHandle{right:var(--results-w);border-radius:11px 0 0 11px;background:#c97a12;color:#fff;border:1px solid rgba(255,255,255,0.25);border-right:none;transform:none;}
#resultsHandle .hlbl{writing-mode:vertical-rl;}
#resultsHandle.closed{right:0;}

/* ---- map layer radio: force stacked, left-aligned entries ---- */
.base-layer-radio input[type="radio"]{width:auto;flex:0 0 auto;}
.base-layer-radio label{width:100%;justify-content:flex-start;text-align:left;}

/* ---- shift right-side map controls left when results drawer is open ---- */
#mapwrap{--mro:0px;}
#mapwrap.results-open{--mro:var(--results-w);}
#mapwrap .leaflet-right{right:var(--mro);transition:right .25s ease;}

/* ---- cockpit-style scale bar (bottom right, left of zoom) ---- */
.map-scale-bar{position:absolute;right:calc(76px + var(--mro));bottom:12px;background:rgba(255,255,255,0.85);border-radius:4px;padding:3px 6px 4px;pointer-events:none;font-size:10px;color:#1a1a1a;display:flex;flex-direction:column;align-items:stretch;gap:2px;box-shadow:0 1px 4px rgba(0,0,0,.25);z-index:900;transition:right .25s ease;font-family:sans-serif;}
.map-scale-ruler-wrap{position:relative;padding-bottom:11px;}
.map-scale-ruler{position:relative;height:7px;display:flex;border:1px solid #1a1a1a;box-sizing:border-box;}
.map-scale-tick-label{position:absolute;top:9px;font-size:8.5px;color:#1a1a1a;line-height:1;}
.map-scale-ruler > div{flex:1;border-right:1px solid #1a1a1a;}
.map-scale-ruler > div:last-child{border-right:none;}
.map-scale-ruler > div:nth-child(odd){background:#1a1a1a;}
.map-scale-ruler > div:nth-child(even){background:#fff;}
.map-scale-text{font-weight:700;white-space:nowrap;text-align:center;}
.map-scale-ratio{font-weight:400;}

.datacell .val .unit{font-size:9px;font-weight:400;color:var(--muted);margin-left:4px;letter-spacing:.2px;}
.datacell .val.small{font-size:10px;font-weight:400;}
#resultsDrawer .datagrid{gap:3px 4px;}

/* ---- hamburger dropdown ---- */
.top-popover{display:none;position:fixed;top:52px;left:8px;background:var(--panel2);border:1px solid var(--border);border-radius:10px;box-shadow:0 6px 18px rgba(0,0,0,.4);padding:6px 0;z-index:5000;flex-direction:column;min-width:220px;overflow:hidden;}
.top-popover.open{display:flex;}
.top-popover button{background:none;border:none;border-bottom:1px solid var(--border);color:var(--text);text-align:left;padding:11px 14px;font-size:12.5px;cursor:pointer;}
.top-popover button:last-child{border-bottom:none;}
.top-popover button:active{background:var(--panel);}
.mbadge{display:inline-flex;width:17px;height:17px;border-radius:50%;color:#fff;font-size:10px;font-weight:700;align-items:center;justify-content:center;margin-right:6px;vertical-align:middle;}
.mbadge.green{background:#1c8a49;}
.mbadge.amber{background:#c97a12;}

/* status chip now sits left of the spacer: left-aligned */
.wx-chip.status{text-align:left;align-items:flex-start;flex:1 1 auto;min-width:0;overflow:hidden;}
.wx-chip.status b,.wx-chip.status span{display:block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.logo-chip{flex-shrink:0;}

[hidden]{display:none !important;}
.top-popover[hidden]{display:none !important;}

/* ---- inline units next to values (non-bold) ---- */
.iwrap{display:flex;align-items:baseline;gap:4px;}
.iwrap input{flex:1;min-width:0;}
.iunit{font-size:9px;color:var(--muted);font-weight:400;white-space:nowrap;flex-shrink:0;}

/* ---- release target group + pulsing first-open hint ---- */
.fcell-pair{display:grid;grid-template-columns:1fr 1fr;gap:3px 4px;grid-column:span 2;border-radius:7px;}
.fcell-pair > .fcell{margin:0;}
.release-pulse{outline:2px solid var(--bad);outline-offset:2px;animation:relPulse 1.5s ease-in-out infinite;}
@keyframes relPulse{
  0%,100%{outline-color:rgba(224,72,63,1);box-shadow:0 0 0 0 rgba(224,72,63,0.45);}
  50%{outline-color:rgba(224,72,63,0.35);box-shadow:0 0 12px 4px rgba(224,72,63,0.25);}
}

/* ---- release-altitude slider below the green handle (cockpit slider idiom) ---- */
#quickControls{position:absolute;top:424px;left:var(--drawer-w);z-index:955;display:flex;align-items:stretch;transition:left .25s ease;}
#quickControls.closed{left:0;}
#launchTimeBox{width:95px;background:var(--panel2);border:1px solid var(--border);border-left:none;border-right:none;border-radius:0;padding:8px 8px;box-shadow:2px 2px 10px rgba(0,0,0,.3);display:flex;flex-direction:column;align-items:center;gap:5px;}
#launchTimeBox input{font-size:9.5px;padding:2px 0;text-align:center;}
#launchTimeBox .ghost{width:100%;padding:3px 4px;font-size:10px;color:var(--accent);}
#releaseSliderBox{width:64px;background:var(--panel2);border:1px solid var(--border);border-left:1px solid var(--border);border-radius:0 12px 12px 0;padding:8px 4px 8px;box-shadow:2px 2px 10px rgba(0,0,0,.3);display:flex;flex-direction:column;align-items:center;gap:5px;}

input[type=range]{width:100%;height:28px;-webkit-appearance:none;appearance:none;background:transparent;border:none;padding:0;}
input[type=range]:focus{outline:none;}
input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:3px;background:var(--border);}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:var(--accent);border:3px solid var(--panel2);margin-top:-10px;box-shadow:0 1px 3px rgba(0,0,0,.4);cursor:pointer;}
input[type=range]::-moz-range-track{height:6px;border-radius:3px;background:var(--border);}
input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:var(--accent);border:3px solid var(--panel2);box-shadow:0 1px 3px rgba(0,0,0,.4);cursor:pointer;}

/* vertical release slider */
.rs-head{display:flex;flex-direction:column;align-items:center;gap:0;line-height:1.25;}
.rs-lbl{font-size:8.5px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);}
#lblReleaseAlt{font-family:var(--mono);font-size:13.5px;color:var(--text);font-weight:400;}
.rs-unit{font-size:8px;color:var(--muted);}
.rs-scale{display:flex;flex-direction:column;align-items:center;gap:3px;}
.rs-tick{font-size:8px;color:var(--muted);font-family:var(--mono);}
.vslider-wrap{position:relative;width:30px;height:var(--vsl-h,172px);}
.vslider-wrap input[type=range]{position:absolute;width:var(--vsl-h,172px);height:30px;left:50%;top:50%;transform:translate(-50%,-50%) rotate(-90deg);margin:0;}

/* ---- airspace menu + warning ---- */
.as-menu{min-width:250px;left:8px;top:52px;padding:0 0 6px;}
.as-head{display:flex;align-items:center;justify-content:space-between;padding:9px 12px;border-bottom:1px solid var(--border);font-size:11px;text-transform:uppercase;letter-spacing:.7px;color:var(--muted);font-weight:700;}
.as-head .overlay-close{position:static;width:24px;height:24px;font-size:12px;}
.as-rows{display:flex;flex-direction:column;padding:4px 0;}
.as-row{display:flex;align-items:center;gap:9px;padding:7px 14px;font-size:12px;cursor:pointer;user-select:none;border:none;background:none;color:var(--text);text-align:left;}
.as-row:active{background:var(--panel);}
.as-row input{width:auto;accent-color:var(--accent);margin:0;}
.as-swatch{width:11px;height:11px;border-radius:3px;flex-shrink:0;border:1px solid rgba(255,255,255,.35);}
.as-note{padding:4px 14px 2px;max-width:250px;}
.as-warn{border-radius:6px;padding:7px 9px;font-size:11px;line-height:1.45;color:var(--text);}
.as-warn.conflict{background:rgba(224,72,63,0.14);border:1px solid var(--bad);}
.as-warn.clear{background:rgba(63,208,107,0.12);border:1px solid var(--good);}
.as-warn b{color:var(--bad);}
.as-warn ul{margin:4px 0 0;padding-left:16px;}
.as-warn li{margin:1px 0;}

/* S4d time zone segment + conversion line */
.tz-seg{display:flex;border:1px solid var(--border);border-radius:999px;overflow:hidden;}
.tz-seg .tz-opt{border:none;background:none;color:var(--muted);font-size:8px;font-weight:600;padding:2px 8px;cursor:pointer;letter-spacing:.4px;}
.tz-seg .tz-opt.active{background:var(--accent);color:#00201d;}
.tz-alt{font-size:8px;color:var(--muted);font-family:var(--mono);white-space:nowrap;min-height:10px;}
.gmaps-link{color:var(--accent);font-weight:600;text-decoration:none;}
.gmaps-link:active{opacity:.7;}

/* Option D: airspace overlay toggle in the top bar */
.as-toggle{display:flex;align-items:center;gap:7px;padding:6px 10px;background:var(--panel2);border:1px solid var(--border);border-radius:9px;color:var(--muted);font-size:11.5px;cursor:pointer;flex-shrink:0;font-family:var(--sans);}
.as-toggle .as-hex{flex-shrink:0;}
.as-toggle.on{color:var(--text);}
.as-toggle.on .as-hex{fill:var(--accent);stroke:var(--accent);}
.as-seg{display:inline-flex;border:1px solid var(--border);border-radius:999px;overflow:hidden;font-size:8.5px;font-weight:600;}
.as-seg span{padding:2px 7px;color:var(--muted);}
.as-toggle:not(.on) .as-off{background:var(--panel);color:var(--text);}
.as-toggle.on .as-on{background:var(--accent);color:#00201d;}

/* Speed legend bar at the map foot (cockpit legend-bar idiom) */
.legend-bar{position:static;align-self:flex-end;margin-left:8px;background:rgba(20,26,33,0.88);color:#fff;padding:5px 12px 6px;border-radius:8px;font-size:10.5px;font-weight:600;display:none;z-index:600;box-shadow:0 2px 8px rgba(0,0,0,.3);flex-direction:column;align-items:stretch;gap:4px;white-space:nowrap;}
.lb-row{display:flex;align-items:center;gap:9px;}
.lb-icons{gap:4px;justify-content:center;padding-bottom:2px;border-bottom:1px solid rgba(255,255,255,0.14);}
.lb-icons span{font-size:8.5px;color:#aab4c0;font-weight:400;margin-right:7px;}
body.day .lb-icons{border-bottom-color:rgba(0,0,0,0.12);}
.legend-bar.show{display:flex;}
.legend-bar .gwl-title{color:#aab4c0;font-weight:600;flex-shrink:0;}
.gwl-grad{display:inline-block;width:130px;height:8px;border-radius:4px;background:linear-gradient(90deg,hsl(215,82%,55%),hsl(161,82%,55%),hsl(108,82%,55%),hsl(54,82%,55%),hsl(0,82%,55%));}
.gwl-col{display:flex;flex-direction:column;gap:2px;}
.gwl-ticks{display:flex;justify-content:space-between;width:130px;}
.gwl-ticks span{font-size:8.5px;color:#aab4c0;font-weight:400;font-family:var(--mono);}
.gwl-ticks span:nth-child(2){text-align:center;}
.gwl-ticks span:last-child{text-align:right;}
body.day .legend-bar{background:rgba(255,255,255,0.92);color:#16202a;box-shadow:0 2px 8px rgba(0,0,0,.18);}
body.day .legend-bar .gwl-title,body.day .gwl-ticks span{color:#5c6b78;}

/* prominent device-position marker */
.device-marker{position:relative;width:34px;height:34px;}
.device-marker .dm-ring{position:absolute;left:50%;top:50%;width:34px;height:34px;margin:-17px 0 0 -17px;border-radius:50%;border:2px solid #3fd0c9;opacity:0.9;animation:devPulse 1.8s ease-out infinite;}
.device-marker .dm-dot{position:absolute;left:50%;top:50%;width:15px;height:15px;margin:-7.5px 0 0 -7.5px;border-radius:50%;background:#3fd0c9;border:3px solid #ffffff;box-shadow:0 0 6px rgba(0,0,0,.55);}
@keyframes devPulse{0%{transform:scale(0.45);opacity:0.95;}75%{transform:scale(1.25);opacity:0;}100%{transform:scale(1.25);opacity:0;}}
.wx-refresh{background:none;border:none;border-bottom:1px solid var(--border);color:var(--accent);text-align:left;padding:10px 14px;font-size:12px;font-weight:700;cursor:pointer;width:100%;}
.wx-refresh:active{background:var(--panel);}

/* G2: trajectory -> Google Maps with QR popover */
.gm-btn span{white-space:nowrap;}
.gm-btn #gmapsQrIcon{color:var(--muted);}
.gm-btn:active #gmapsQrIcon{color:var(--accent);}
.gm-pop{right:8px;left:auto;top:52px;min-width:0;width:200px;}
.gm-qr{display:flex;justify-content:center;padding:10px 10px 4px;}
.gm-qr svg{width:160px;height:160px;background:#fff;border-radius:6px;padding:6px;box-sizing:border-box;}
.gm-hint{padding:2px 12px 8px;max-width:200px;}
/* popup-blocked helper */
.popup-help-card{position:relative;background:var(--panel2);border:1px solid var(--border);border-radius:12px;padding:18px 20px;max-width:340px;color:var(--text);font-size:12.5px;line-height:1.5;box-shadow:0 8px 28px rgba(0,0,0,.5);}
.popup-help-card h3{margin:0 0 6px;font-size:14px;color:var(--bad);}
.popup-help-card ol{margin:6px 0 4px;padding-left:18px;}
.popup-help-card li{margin:3px 0;}
.popup-open-link{display:block;margin-top:10px;text-align:center;background:var(--accent);color:#00201d;border-radius:8px;padding:9px 10px;font-weight:700;text-decoration:none;}

/* E1 ensemble chip: gray -> armed (violet) -> active (filled) */
.ens-btn{color:#a06fe0;border-color:#8a4fd0;}
.ens-btn svg{color:#a06fe0;}
.ens-btn.dis{color:var(--muted);border-color:var(--border);opacity:0.5;cursor:default;pointer-events:none;background:var(--panel2);}
.ens-btn.dis svg{color:var(--muted);}
.ens-btn.active{background:#8a4fd0;color:#fff;border-color:#8a4fd0;}
.ens-btn.active svg{color:#fff;}
body.day .ens-btn{color:#6a3fb5;}
body.day .ens-btn svg{color:#6a3fb5;}
body.day .ens-btn.active{color:#fff;}
body.day .ens-btn.active svg{color:#fff;}
.ens-lbl{white-space:nowrap;}

/* ensemble member number badges + map-foot legend */
.ens-num{width:17px;height:17px;border-radius:50%;color:#fff;font:700 10px/17px var(--sans);text-align:center;border:1.5px solid #fff;box-shadow:0 1px 3px rgba(0,0,0,.5);}
#ensembleLegend{position:absolute;left:50%;transform:translateX(-50%);bottom:8px;z-index:650;background:rgba(20,26,33,0.9);color:#fff;border-radius:8px;padding:6px 10px;font-size:10px;box-shadow:0 2px 8px rgba(0,0,0,.35);max-width:min(92vw,560px);display:flex;flex-wrap:wrap;gap:3px 14px;align-items:center;}
#ensembleLegend .el-head{flex-basis:100%;font-weight:700;color:#c9b3ec;font-size:10px;letter-spacing:.4px;margin-bottom:1px;}
#ensembleLegend .el-row{display:flex;align-items:center;gap:5px;white-space:nowrap;}
#ensembleLegend .el-num{width:14px;height:14px;border-radius:50%;color:#fff;font:700 8.5px/14px var(--sans);text-align:center;flex-shrink:0;}
#ensembleLegend .el-line{width:16px;height:3px;border-radius:2px;flex-shrink:0;}
#ensembleLegend .el-lbl{color:#dfe5ea;font-size:9.5px;}
body.day #ensembleLegend{background:rgba(255,255,255,0.94);color:#16202a;box-shadow:0 2px 8px rgba(0,0,0,.18);}
body.day #ensembleLegend .el-head{color:#6a3fb5;}
body.day #ensembleLegend .el-lbl{color:#3a4148;}

/* ensemble legend checkboxes + adopt button */
#ensembleLegend .el-row input[type=checkbox]{width:12px;height:12px;accent-color:#8a4fd0;margin:0;cursor:pointer;}
#ensembleLegend label.el-row{cursor:pointer;}
#ensembleLegend .el-row.off .el-lbl{opacity:0.45;text-decoration:line-through;}
.ens-adopt{margin-top:6px;background:#8a4fd0;color:#fff;border:none;border-radius:7px;padding:6px 10px;font-size:11px;font-weight:700;cursor:pointer;}
.ens-adopt:active{background:#6a3fb5;}

/* ICAO coordinate cells: coords line + "near place" line */
.coordcell .pt-coord{display:block;font-size:10.5px;letter-spacing:-0.2px;white-space:nowrap;}
.coordcell .pt-place{display:block;font-size:9px;color:var(--muted);font-family:var(--sans);margin-top:1px;}