*{box-sizing:border-box}body{margin:0;font:14px/1.4 system-ui,sans-serif;color:#1d2733;overflow:hidden}
:root{--pw:38%;--red:#b30000}
header{position:absolute;top:0;left:0;right:var(--pw);z-index:2;padding:10px 16px;background:linear-gradient(#fffffff2,#fff0);pointer-events:none}header h1{margin:0;font-size:22px}header span{color:#556}
#map{position:absolute;top:0;bottom:0;left:0;right:var(--pw)}
#panel{position:absolute;right:0;top:0;bottom:0;width:var(--pw);min-width:360px;overflow:auto;background:#fbfcfd;border-left:1px solid #dde;scroll-behavior:auto}
@media(max-width:1100px) and (min-width:769px){:root{--pw:360px}}
section{padding:12px 16px;border-bottom:1px solid #e3e7ec;scroll-margin-top:70px}h2{font-size:16px;margin:0 0 6px}h3{font-size:15px;margin:0 0 6px}h4{font-size:13px;margin:10px 0 4px}h5{font-size:12px;margin:8px 0 3px}small{color:#778;font-weight:normal}
.note{font-size:11px;color:#667}.small{font-size:12px;color:#334;margin:6px 0}.red{color:var(--red)}
/* sticky strip + mini-nav (A4, D17) */
#sticky{position:sticky;top:0;z-index:5;background:#fbfcfdf5;backdrop-filter:blur(4px);border-bottom:1px solid #e3e7ec}
.strip{font-size:11px;color:#445;padding:5px 16px;background:#f1f4f7;border-bottom:1px solid #e3e7ec}
#mininav{display:flex;gap:2px;padding:2px 10px}#mininav a{flex:1;text-align:center;font-size:12px;font-weight:600;color:#556;text-decoration:none;padding:7px 4px;border-bottom:2px solid transparent}#mininav a:hover{color:#1d2733}#mininav a.on{color:var(--red);border-bottom-color:var(--red)}
/* hero (A1) */
.hero{margin:0 0 10px;padding:10px 12px;border-radius:10px;background:#fff;border:1px solid #f0d4d4;box-shadow:inset 4px 0 0 var(--red)}.hero p{margin:0;font-size:19px;line-height:1.3;font-weight:700}.hero[data-kind=none]{box-shadow:inset 4px 0 0 #2a9d55;border-color:#cfe9d8}.hero small{display:block;margin-top:4px;font-size:11px}
/* badges (A4) */
.bdg{display:inline-block;vertical-align:middle;font-size:9px;font-weight:700;letter-spacing:.05em;padding:1px 5px;border-radius:4px;margin-left:4px;background:#eef2f6;color:#445}
.bdg.live{background:#fde8e8;color:#a11}.bdg.fc{background:#fff3d6;color:#8a5a00}.bdg.st{background:#e6eefb;color:#1f4f99}.bdg.fy{background:#ece8f8;color:#4b3b8f}.bdg.hist{background:#eee;color:#555;letter-spacing:0;font-weight:600}
.info{border:0;background:none;color:#778;cursor:pointer;font-size:14px;padding:0 4px;margin-left:2px;vertical-align:middle;min-width:24px;min-height:24px}.info[aria-expanded=true]{color:var(--red)}
.more{border-left:2px solid #e3e7ec;padding-left:8px;margin:4px 0}
.hd{display:flex;justify-content:space-between;align-items:center;gap:6px}.badge{font-size:11px;background:#eef2f6;border-radius:10px;padding:2px 8px;color:#445;white-space:nowrap}.badge.ok{background:#e3f5ea;color:#1d6b3a}.badge.err{background:#fde8e8;color:#a11}
.big{display:flex;gap:8px;margin:8px 0}.big div{flex:1;background:#fff;border:1px solid #e3e7ec;border-radius:8px;padding:6px 8px}.big b{font-size:22px;display:block;font-variant-numeric:tabular-nums}.big span{font-size:11px;color:#667}
.kpis{display:flex;gap:10px}.kpis div{flex:1;background:#fff;border:1px solid #e3e7ec;border-radius:8px;padding:8px}.kpis b{font-size:24px;display:block;color:var(--red);font-variant-numeric:tabular-nums}.kpis span{color:#556;font-size:12px}
.fb{display:grid;grid-template-columns:110px 1fr 70px;align-items:center;gap:6px;font-size:12px;margin:3px 0}.fb .bar{height:14px;background:#eef1f4;border-radius:4px;overflow:hidden}.fb .bar i{display:block;height:100%}.fb .v{text-align:right;font-variant-numeric:tabular-nums}
/* overshoot bars (A2) */
.g{margin:8px 0;border-radius:6px;transition:background .3s}.g .lbl{display:flex;justify-content:space-between;font-size:12px;gap:6px}
.g .bar{height:14px;background:#e7ebf0;border-radius:6px;position:relative;margin-top:2px}.g .fill{height:100%;border-radius:6px;background:#2a9d55}.g .fill.near{background:#e6a100}.g .fill.over{background:linear-gradient(90deg,#d77 0,#d77 var(--m,62.5%),var(--red) var(--m,62.5%))}
.g .fill.over{background:var(--red)}
.g .mk{position:absolute;top:-3px;bottom:-3px;width:2px;background:#1d2733;margin-left:-1px}.g .mk span{position:absolute;top:-12px;left:-12px;font-size:8px;color:#445;width:26px;text-align:center}
.g .clip{position:absolute;right:-2px;top:-3px;font-size:14px;color:var(--red)}.g .ov{font-size:12px;margin-top:2px;color:#2a7a45}.g .ov.over{color:var(--red);font-weight:700}.g .ov.near{color:#8a5a00}
.flash{animation:flash 1.6s ease-out 1}@keyframes flash{0%,40%{background:#ffe3e3;box-shadow:0 0 0 6px #ffe3e3}100%{background:transparent;box-shadow:none}}
.grp{display:flex;justify-content:space-between;padding:3px 0;border-bottom:1px dotted #ccd}
table{width:100%;border-collapse:collapse;font-size:12px}td,th{padding:3px 4px;border-bottom:1px solid #eef}td:nth-child(n+2),th:nth-child(n+2){text-align:right;font-variant-numeric:tabular-nums}
tr.low td:first-child::after{content:" ≈";color:#c60}#top tbody tr{cursor:pointer}#top tbody tr:hover,#top tbody tr:focus{background:#fff0f0;outline:none}
abbr.neg{text-decoration:none;cursor:help;color:#778;font-size:11px}
/* chart (D15) */
.chart{margin:8px 0 2px}.chart svg{width:100%;height:auto;max-height:190px;display:block}.chart rect.b.on{fill:#ff2a2a}.chart .hit{cursor:crosshair}.chax{font-size:10px;color:#667;margin-top:-2px}.rd{font-size:12px;min-height:18px;margin-top:2px}
.clickable{cursor:pointer;transition:background .15s}.clickable:hover{background:#fff6f6}.clickable[aria-pressed=true]{background:#fff0f0;box-shadow:inset 4px 0 0 var(--red)}.cta{font-size:12px;color:var(--red);font-weight:600;white-space:nowrap}
/* road (D19) */
.rb{margin:8px 0}.rb .lbl{display:flex;justify-content:space-between;font-size:12px}.rb .bar{position:relative;display:flex;height:14px;background:#eef1f4;border-radius:4px;margin:2px 0;overflow:visible}.rb .bar i{display:block;height:100%}.rb .bar i:first-child{border-radius:4px 0 0 4px}
.rb .tgt{position:absolute;top:-3px;bottom:-3px;width:2px;background:#1d2733}.rb .sub2{font-size:10.5px;color:#667}
.rkey{display:flex;flex-wrap:wrap;gap:8px;font-size:10.5px;color:#556;margin:6px 0}.rkey i{display:inline-block;width:12px;height:8px;background:#2b8cbe;margin-right:3px;vertical-align:middle}.rkey i.t{width:2px;height:12px;background:#1d2733}
.cap{font-size:11px;color:#445;background:#fff8e6;padding:6px 8px;border-radius:6px}
details summary{cursor:pointer;list-style:none}details summary::-webkit-details-marker{display:none}details summary::before{content:"▸ ";color:#889}details[open] summary::before{content:"▾ "}
#anm{margin-top:14px;border-top:1px dashed #ccd;padding-top:4px}#anm table td{padding:2px 4px}
.about li{font-size:11px;margin-bottom:5px}.about .upd{display:block;color:#1f4f99}
/* legend = primary toggles (C14) */
#ctrl{position:absolute;left:10px;bottom:44px;z-index:3;display:flex;flex-direction:column;gap:6px;max-height:calc(100% - 110px);width:250px}
#legend{background:#fffe;padding:8px 10px;border-radius:8px;font-size:12px;box-shadow:0 1px 4px #0003;overflow:auto;min-height:0}
#legend b{display:block;margin:6px 0 2px;font-size:11px;text-transform:uppercase;letter-spacing:.04em;color:#556}#legend b:first-child{margin-top:0}
#legend .li{display:flex;align-items:center;gap:6px;padding:2px 4px;border-radius:4px;cursor:pointer;user-select:none}#legend .li:hover{background:#eef3f8}#legend .li.off>span,#legend .li.off>i{opacity:.45}
#legend .li input{margin:0;accent-color:#1d2733;width:14px;height:14px;flex:none}#legend .li span small{display:block;font-size:10px;line-height:1.2}
#legend i{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none}#legend i.ln{height:3px;width:16px;border-radius:0}#legend i.dash{border-top:2px dashed #c0392b;background:none;height:0}#legend i.ring{border:2px solid var(--red);background:#b3000033}
#legend i.glow{background:linear-gradient(90deg,#c51b8a 0 30%,#fff 30% 55%,#c51b8a 55% 100%);height:4px;box-shadow:0 0 3px #ff2a2a}#legend i.donut-sw{border:3px solid #2b8cbe;border-right-color:#31a354;border-bottom-color:#e6550d;background:#fff;width:12px;height:12px}
#layersBtn{align-self:flex-start;padding:7px 12px;border:0;border-radius:8px;background:#fff;box-shadow:0 1px 4px #0003;font-weight:600;cursor:pointer;font-size:12px}
#layers{background:#fff;border-radius:10px;padding:8px 12px;box-shadow:0 2px 10px #0003;font-size:13px;overflow:auto;min-height:0;flex:none;max-height:45vh}
#layers h3{margin:8px 0 4px;font-size:12px;text-transform:uppercase;color:#667;letter-spacing:.04em}#layers label{display:block;margin:5px 0;cursor:pointer}#layers small{display:block;color:#667;margin-left:22px;font-size:11px}#layers input[type=range]{width:100%}
#pipeF{margin:2px 0 6px 22px;font-size:12px}#pipeF b{display:block;margin-top:4px;color:#556}#pipeF label{display:inline-block;margin:1px 6px 1px 0}
.mob{display:none}
/* donuts (C10) */
.donut{border:0;padding:0;background:none;cursor:pointer;filter:drop-shadow(0 1px 2px #0004);line-height:0}.donut text{font-family:system-ui,sans-serif;fill:#1d2733}.curmode .donut{opacity:.15}
#flowTag{position:absolute;left:calc((100% - var(--pw))/2);transform:translateX(-50%);top:114px;background:#fffd;padding:3px 10px;border-radius:12px;font-size:11px;color:#445;box-shadow:0 1px 3px #0002;z-index:2}
#curBanner{position:absolute;top:94px;left:calc((100% - var(--pw))/2);transform:translateX(-50%);z-index:4;background:var(--red);color:#fff;padding:6px 10px 6px 14px;border-radius:18px;font-size:13px;box-shadow:0 2px 8px #0004;max-width:90%}#curBanner button{margin-left:10px;background:#fff3;border:0;color:#fff;border-radius:50%;width:24px;height:24px;cursor:pointer}
.maplibregl-popup-content{font-size:12px}.maplibregl-popup-content .def{display:block;color:#556;margin:2px 0 4px}.tipf{margin:4px 0;padding:4px 6px;background:#f5f7fa;border-radius:4px}
/* station view (C13, B7) */
#station .sthd{position:sticky;top:64px;z-index:4;background:#fbfcfd;padding:6px 12px;border-bottom:1px solid #e3e7ec}
.back{border:1px solid #cfd6de;background:#fff;border-radius:8px;padding:8px 12px;font-weight:600;cursor:pointer;font-size:13px;min-height:36px}
#station .ph{position:relative;background:#dde3ea}#station .ph img{width:100%;height:180px;object-fit:cover;display:block}
#station .cr{position:absolute;bottom:0;left:0;right:0;background:#0009;color:#fff;font-size:10px;padding:2px 6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#station .cr a{color:#fff}
#station .bd{padding:10px 16px}#station h2{font-size:19px;margin:0}#station .tg{color:#667;font-size:12px;margin-bottom:8px}
#station dl{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;margin:0 0 8px;font-size:13px}#station dt{color:#667}#station dd{margin:0}
#station .cu{margin:8px 0;padding:8px 10px;background:#fff3f3;border-radius:8px;font-size:13px}#station .cu.none{background:#f3f4f6}#station .cu p{margin:3px 0}#station .cu small{display:block;color:#667;font-size:11px}
#station .spk{width:100%;height:30px;display:block;margin:4px 0}#station .lowc{color:#c60}#station .zn p{margin:2px 0;font-size:13px}#station details{margin-top:8px;font-size:11px}#station details a{word-break:break-all}
/* E21 mobile */
@media(max-width:768px){
 :root{--pw:100%}body{overflow:hidden}
 #map{top:0;left:0;right:0;bottom:auto;height:var(--mh);transition:height .2s ease}
 header{right:0;padding:6px 10px;background:linear-gradient(#ffffffee,#fff0)}header h1{font-size:17px}header span{font-size:11px;display:block;max-width:70%}
 #panel{top:var(--mh);transition:top .2s ease;padding-bottom:env(safe-area-inset-bottom);left:0;right:0;width:100%;min-width:0;border-left:0;border-top:1px solid #dde;box-shadow:0 -2px 8px #0002}
 #flowTag{display:none}#curBanner{top:auto;bottom:calc(100% - var(--mh) + 8px);left:50%;font-size:12px}
 .mob{display:block}
 #sheetBtn{position:absolute;top:calc(var(--mh) - 56px);left:10px;z-index:3;min-height:44px;padding:0 16px;border:0;border-radius:22px;background:#fff;box-shadow:0 1px 6px #0004;font-weight:700;font-size:14px}
 #ctrl{display:none;position:fixed;left:0;right:0;bottom:0;width:auto;max-height:75vh;z-index:20;background:#fff;border-radius:14px 14px 0 0;box-shadow:0 -4px 16px #0004;padding:8px 12px 16px;overflow:auto;gap:8px}
 body.sheet #ctrl{display:flex}
 .sheetHd{display:flex!important;justify-content:space-between;align-items:center;font-size:16px}.sheetHd button{min-width:44px;min-height:44px;border:0;background:#eef2f6;border-radius:22px;font-size:16px}
 #legend{box-shadow:none;padding:0;overflow:visible;font-size:14px;flex:none}#legend .li{min-height:44px}#legend .li input{width:20px;height:20px}
 #layersBtn{min-height:44px;width:100%;box-shadow:none;border:1px solid #dde}#layers{box-shadow:none;border:1px solid #eef;max-height:none}#layers label{min-height:44px;padding:6px 0}#layers input[type=checkbox]{width:20px;height:20px}
 #mininav a{padding:13px 2px;min-height:44px;font-size:12.5px}
 .hero p{font-size:17px}
 .hd{flex-wrap:wrap}.hd h2,.hd h3{display:flex;align-items:center;flex-wrap:wrap}
 #top tbody tr td{padding:12px 4px}.info{min-width:44px;min-height:44px}.back{min-height:44px}
 body.st-open #panel{top:0;z-index:30;box-shadow:none}body.st-open #sticky{display:none}body.st-open #station .sthd{top:0}
 .donut{min-width:30px;min-height:30px}
}
body.st-open #mininav button.on{color:#556;border-bottom-color:transparent}
/* seabed waterfall + subsidies */
.wf{display:grid;grid-template-columns:130px 1fr 62px;gap:6px;align-items:center;font-size:11.5px;margin:3px 0}.wf .wb{position:relative;height:14px;background:#f1f4f7;border-radius:3px}.wf .wb i{position:absolute;top:0;bottom:0;border-radius:3px}
.wf i.in{background:#08519c}.wf i.out{background:#e6a100}.wf i.held{background:#1d2733}.wf .wv{text-align:right;font-variant-numeric:tabular-nums}.wf .wv.out{color:#8a5a00}.wf.tot{font-weight:700;border-top:1px solid #dde;padding-top:3px}
.cb{background:#eef7f1;border:1px solid #cfe9d8;border-radius:8px;padding:6px 10px;font-size:12px;margin-top:8px}.cb p{margin:3px 0 0}
#cfdTop tbody tr{cursor:pointer}#cfdTop tbody tr:hover{background:#eef3fb}td.grn{color:#1d6b3a;font-weight:700}
#station .cfd{margin:8px 0;padding:8px 10px;background:#eef3fb;border-radius:8px;font-size:13px}#station .cfd p{margin:3px 0}#station .cfd small{display:block;color:#667;font-size:11px}
#mininav a{font-size:11.5px;padding-left:2px;padding-right:2px}
@media(max-width:768px){.wf{grid-template-columns:110px 1fr 58px}#mininav{overflow-x:auto}#mininav a{flex:none;padding:13px 8px}}

.bill3{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:6px 0}
.bill3 .bx{border:1px solid #e3e7ec;border-radius:6px;padding:6px;font-size:11px;display:flex;flex-direction:column;gap:3px}
.bill3 .bt{font-weight:600;font-size:11px;margin:0}.bill3 .bv{font-size:17px;font-weight:700;color:#08519c}.bill3 .bs{color:#667;font-size:10px}.bill3 .jmp{margin-top:auto;font-size:11px}
@media(max-width:420px){.bill3{grid-template-columns:1fr}}
.askex{display:flex;flex-wrap:wrap;gap:4px;margin:4px 0}.askex button{font:inherit;font-size:11px;border:1px solid #c9d3de;background:#f5f8fb;border-radius:12px;padding:3px 8px;cursor:pointer;text-align:left}
#askLog{display:flex;flex-direction:column;gap:6px;margin:6px 0}.am{font-size:12px;line-height:1.4;padding:6px 8px;border-radius:8px;white-space:pre-wrap}
.am.q{align-self:flex-end;background:#08519c;color:#fff;max-width:85%}.am.a{background:#f1f4f7}.am.e{background:#fdecea;color:#8a1c12}
.am .src{display:block;margin-top:4px;font-size:10.5px;color:#556}.am.pending i{display:inline-block;width:6px;height:6px;margin:0 2px;border-radius:50%;background:#99a;animation:askp 1s infinite alternate}.am.pending i:nth-child(2){animation-delay:.3s}.am.pending i:nth-child(3){animation-delay:.6s}
@keyframes askp{to{opacity:.2}}.askf{display:flex;gap:4px}.askf input{flex:1;min-width:0;font-size:16px;padding:6px 8px;border:1px solid #c9d3de;border-radius:6px}.askf button{font:inherit;padding:6px 12px;border:0;border-radius:6px;background:#08519c;color:#fff}.askf button:disabled{opacity:.5}

/* UX2 */
#chip{position:absolute;top:78px;left:calc((100% - var(--pw,400px))/2);transform:translateX(-50%);z-index:5;background:rgba(255,255,255,.94);border:1px solid #f0d4d4;box-shadow:0 1px 6px rgba(0,0,0,.15);border-radius:18px;padding:5px 6px 5px 14px;font-size:13px;font-weight:700;color:#8a0000;display:flex;align-items:center;gap:6px;white-space:nowrap}
#chip[hidden]{display:none}#chip button{border:0;background:none;cursor:pointer;color:#778;font-size:13px;min-width:28px;min-height:28px}
.bpop .maplibregl-popup-content{padding:6px 10px;font-size:12px;line-height:1.4}
.bdet{font-size:12px;background:#fff7f7;border:1px solid #f0d4d4;border-radius:8px;padding:8px 10px;margin:6px 0}
.inf{color:#99a;font-size:11px;cursor:help}
@media(max-width:768px){#chip{left:50%;top:auto;bottom:calc(100% - var(--mh) + 10px);font-size:12px;white-space:normal;max-width:90vw}#chip button{min-width:44px;min-height:44px}}
/* item 18: title block on a subtle translucent card */
header{right:auto;max-width:calc(100% - var(--pw) - 32px);margin:8px;padding:8px 14px;border-radius:10px;background:rgba(255,255,255,.86);box-shadow:0 1px 6px rgba(0,0,0,.08);backdrop-filter:blur(3px)}
@media(max-width:768px){header{margin:0;border-radius:0 0 10px 0;max-width:80%}}
/* item 8: each nav section is its own card */
/* two-tier sidebar: views replace each other in the panel; each card is a .card */
.card{padding:12px 16px;scroll-margin-top:110px;background:#fff;border:1px solid #e3e7ec;border-radius:10px;margin:10px;box-shadow:0 1px 2px rgba(0,0,0,.04)}
.view{padding:0 0 6px;border:0}.view[hidden]{display:none}.view>h2{font-size:18px;margin:14px 16px 4px}.so{margin:0 16px 4px;font-size:14px;font-weight:700;line-height:1.35;color:#1d2733}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
#mininav button{flex:1;font:inherit;font-size:11.5px;font-weight:600;color:#556;background:none;border:0;border-bottom:2px solid transparent;padding:7px 2px;cursor:pointer;white-space:nowrap}
#mininav button:hover{color:#1d2733}#mininav button.on{color:var(--red);border-bottom-color:var(--red);font-weight:700}#mininav button:focus-visible{outline:2px solid #c51b8a;outline-offset:-2px}
#vbar{display:flex;align-items:center;gap:10px;padding:4px 12px 6px;font-size:12px;color:#556}#vbar[hidden]{display:none}
.toNow{font:inherit;font-weight:700;font-size:13px;color:#8a1063;background:#fff;border:1px solid #e5b5d2;border-radius:16px;padding:4px 12px;min-height:32px;cursor:pointer}
#mininav a[aria-current]{font-weight:700}

.askact{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.askact button{font:inherit;font-size:12px;border:1px solid #c51b8a;color:#8a1063;background:#fff;border-radius:14px;padding:4px 10px;cursor:pointer;min-height:32px}
.askfb{display:flex;align-items:center;gap:6px;margin-top:6px;font-size:11px;color:#667}.askfb button{border:1px solid #dde;background:#fff;border-radius:12px;cursor:pointer;min-width:32px;min-height:28px}.askfb input{flex:1;font:inherit;font-size:12px;padding:3px 6px;border:1px solid #ccd;border-radius:6px}
.am.pending .el{font-size:11px;color:#778;margin-left:6px}
@media(max-width:768px){.askact button,.askfb button{min-height:44px;min-width:44px}}
/* item 20: mobile chip clear of the Layers button; 44 px tap targets */
@media(max-width:768px){#chip{left:auto;right:8px;transform:none;max-width:calc(100vw - 130px);font-size:11px;padding:3px 4px 3px 10px}
 #mininav a{min-height:44px;min-width:44px;justify-content:center;display:inline-flex;align-items:center}
 .maplibregl-ctrl-group button{width:44px!important;height:44px!important}}

button.cta{font:inherit;border:0;background:none;cursor:pointer;padding:4px 0}button.cta:focus-visible,#mininav a:focus-visible,.askact button:focus-visible{outline:2px solid #c51b8a;outline-offset:2px}

/* mobile map minimise (Hugh, 14 Oct): map collapses to a sticky bar; dvh + safe-area aware */
#mapHide,#mapBar{display:none}
@media(max-width:768px){
 :root{--mh:45vh;--mh:45dvh;--bar:calc(48px + env(safe-area-inset-top))}
 body.mapmin{--mh:var(--bar)}
 body.mapmin #map{visibility:hidden}
 body.mapmin #sheetBtn,body.mapmin #mapHide,body.mapmin #chip,body.mapmin header,body.mapmin #curBanner{display:none!important}
 #mapHide{display:block;position:absolute;top:calc(var(--mh) - 56px);left:auto;right:56px;z-index:3;min-height:44px;padding:0 14px;border:0;border-radius:22px;background:#fff;box-shadow:0 1px 6px #0004;font-weight:700;font-size:13px;color:#1d2733}
 #mapBar{position:fixed;top:0;left:0;right:0;z-index:25;min-height:var(--bar);padding:env(safe-area-inset-top) 12px 0;border:0;border-bottom:1px solid #f0d4d4;background:rgba(255,255,255,.97);box-shadow:0 1px 6px #0002;display:flex;align-items:center;gap:10px;font:inherit;font-size:13px;text-align:left;cursor:pointer}
 #mapBar[hidden]{display:none}
 #mapBar .mbL{font-weight:700;color:#8a1063;white-space:nowrap;min-height:44px;display:flex;align-items:center}
 #mapBarTxt{color:#8a0000;font-weight:600;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 /* compact title on phones; headline chip docked under it */
 header{padding:calc(6px + env(safe-area-inset-top)) 10px 6px;max-width:none;border-radius:0 0 10px 0}header span{display:none}header h1{font-size:16px}
 #chip{top:calc(36px + env(safe-area-inset-top));bottom:auto!important;left:8px!important;right:auto!important;transform:none!important;max-width:calc(100vw - 70px);font-size:11px;padding:2px 2px 2px 10px;box-shadow:0 1px 4px #0002}
 #chip button{min-width:36px;min-height:36px}
}
@media(prefers-reduced-motion:reduce){#map,#panel{transition:none!important}}
/* History & Outlook */
.hcals{margin:6px 0}.hcal{display:flex;align-items:center;gap:6px;margin:1px 0}.hcal .hy{font-size:10px;color:#667;width:28px;flex:none;font-variant-numeric:tabular-nums}.hcal svg{flex:1;min-width:0;height:auto;display:block}
.hleg i{display:inline-block;width:9px;height:9px;border-radius:2px;margin:0 2px 0 6px;vertical-align:-1px}
.htab{width:100%;border-collapse:collapse;font-size:11.5px;margin:6px 0;font-variant-numeric:tabular-nums}.htab th,.htab td{padding:3px 4px;border-bottom:1px solid #eef1f4;text-align:right}.htab th:first-child,.htab td:first-child{text-align:left}.htab th{font-weight:600;color:#556;font-size:10.5px}
.lk{white-space:nowrap;margin-right:6px}.lk i{display:inline-block;width:14px;border-top:3px solid;vertical-align:middle;margin-right:3px}
.tl{list-style:none;padding:0;margin:6px 0;border-left:2px solid #f27eb0}.tl li{font-size:12px;padding:3px 0 5px 10px;position:relative}.tl li:before{content:'';position:absolute;left:-5px;top:8px;width:8px;height:8px;border-radius:50%;background:#d6247a}.tl small{display:block;color:#667}
.pw{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}.pw button{min-height:44px;padding:0 12px;border:1px solid #d6247a;background:#fff;color:#a01860;border-radius:22px;font:inherit;font-size:12px;cursor:pointer}.pw button[aria-pressed=true]{background:#d6247a;color:#fff}
@media(max-width:400px){.htab{font-size:10.5px}.htab th,.htab td{padding:3px 2px}}
.calc{background:#fdf2f8;border:1px solid #f6c9de;border-radius:8px;padding:8px 10px;margin:8px 0}.calc .kpis{margin:6px 0}.calc .kpis b{font-size:20px}
.cin{display:inline-flex;align-items:center;gap:4px;font-size:12px;min-height:44px}.cin input{width:62px;min-height:36px;font:inherit;border:1px solid #d6247a;border-radius:6px;padding:0 6px}.cin select{min-height:40px;font:inherit;border:1px solid #d6247a;border-radius:6px;background:#fff}
#ctR{width:100%;accent-color:#d6247a;min-height:32px}.hcal rect.q{stroke:#111;stroke-width:.9}
.np{color:#8a6d00;font-size:11px}.tw{overflow-x:auto}.pst td{vertical-align:top;text-align:left}.pst th{text-align:left}.pst small{color:#667}.pumpnow{margin-top:6px}
#mininav a{white-space:nowrap}
#mininav{overflow-x:auto;scrollbar-width:none}
#legend small.src{display:block;font-size:10px;line-height:1.25;color:#667;margin:2px 0 4px 20px}#legend small.src a{color:#08519c}

.kpis.held{margin:4px 0 8px}.kpis.held b{color:#1d2733}
/* item 5: hero and chip share one state */
.hero[data-state=green]{box-shadow:inset 4px 0 0 #2a9d55;border-color:#cfe9d8}.hero[data-state=amber]{box-shadow:inset 4px 0 0 #e6a100;border-color:#f3dfae}.hero[data-state=red]{box-shadow:inset 4px 0 0 var(--red);border-color:#f0d4d4}
#chip[data-state=green]{color:#1d6b3a;border-color:#cfe9d8}#chip[data-state=amber]{color:#8a5a00;border-color:#f3dfae}#chip[data-state=red]{color:#8a0000;border-color:#f0d4d4}
.hcal.now .hy{font-weight:700;color:#1d2733}
/* item 13: title block and map chip share one top-left column (title, then chip), so they never overlap */
#tl{position:absolute;top:8px;left:8px;z-index:5;display:flex;flex-direction:column;align-items:flex-start;gap:6px;max-width:min(560px,calc(100% - var(--pw) - 70px));pointer-events:none}
#tl header{position:static;margin:0;max-width:100%;right:auto}
#tl #chip{position:static;transform:none;max-width:100%;white-space:normal;line-height:1.3;pointer-events:auto}
#tl #chip[hidden]{display:none}
#flowTag{top:auto;bottom:12px}
@media(max-width:768px){#tl{top:0;left:0;max-width:calc(100vw - 60px);gap:4px}
 #tl header{border-radius:0 0 10px 0}
 #tl #chip{position:static!important;margin-left:8px;max-width:calc(100vw - 76px)!important}}
/* item 16: phones and small tablets (<= 768 px) */
@media(max-width:768px){
 #mininav{display:flex;gap:6px;padding:6px 10px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x proximity}
 #mininav::-webkit-scrollbar{display:none}
 #mininav button{flex:none;min-height:44px;min-width:44px;padding:0 14px;border:1px solid #d9dfe6;border-radius:22px;background:#fff;font-size:13px;scroll-snap-align:center}
 #mininav button.on{background:var(--red);border-color:var(--red);color:#fff}
 #vbar{padding:4px 10px 6px}.toNow{min-height:44px;padding:0 16px}
 .askex button{min-height:44px;font-size:13px;padding:6px 12px}.askf input,.askf button{min-height:44px}
 button.cta{min-height:44px;padding:0 4px}.jump{display:inline-block;padding:10px 0}
 #tl #chip button{min-width:44px;min-height:44px}
 .card{margin:8px;padding:12px}.view>h2{margin:12px 12px 4px}.so{margin:0 12px 4px}
 .htab{display:block;overflow-x:auto;max-width:100%}.chart svg{max-width:100%}#panel{overflow-x:hidden}
 .kpis b{font-size:21px}
 .bill3 .jmp{display:flex;align-items:center;min-height:44px}.cin input,.cin select{min-height:44px}#ctR{min-height:44px}
}
@media(max-width:768px){body.st-open #tl,body.st-open #sheetBtn,body.st-open #mapHide{visibility:hidden}}
/* fix3 item 2: the overshoot bar gets its own lane for the "capacity" marker label, so it never sits on the label row text */
.g .lbl{flex-wrap:wrap;row-gap:0}.g .lbl span:last-child{text-align:right;margin-left:auto}
.g .bar{margin:3px 0 17px}.g .mk span{top:calc(100% + 1px);left:-20px;width:42px;line-height:10px;height:10px;white-space:nowrap}
/* fix3 item 3: collapsible legend (desktop) */
#legendTgl{align-self:flex-start;padding:7px 12px;border:0;border-radius:8px;background:#fff;box-shadow:0 1px 4px #0003;font:inherit;font-weight:700;font-size:12px;cursor:pointer;min-height:32px}
#legendTgl:focus-visible{outline:2px solid #c51b8a;outline-offset:2px}
@media(min-width:769px){#ctrl.lgc #legend{display:none}}
@media(max-width:768px){#legendTgl{display:none}}