[hidden]{display:none!important}
:root{--bg:#f7f4ec;--ink:#1c2420;--muted:#5c665e;--card:#fffdf7;--line:#d9d2c0;--line-soft:#e6e0cd;--accent:#0e6e6e;--gas:#e8a13a;--sea:#1d7a8c;--bad:#b3402a;--tank:#7fb3c8;--topbar-h:52px}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#141a18;--ink:#ece7d9;--muted:#a9b2a4;--card:#1d2421;--line:#3a443c;--line-soft:#2c352e;--accent:#5fc4c4;--tank:#3d7d96}}
:root[data-theme=dark]{--bg:#141a18;--ink:#ece7d9;--muted:#a9b2a4;--card:#1d2421;--line:#3a443c;--line-soft:#2c352e;--accent:#5fc4c4;--tank:#3d7d96}
*{box-sizing:border-box}html{scroll-behavior:smooth}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.55 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
a{color:var(--accent)}h1{font-size:clamp(28px,5vw,44px);line-height:1.12;margin:.2em 0 .3em}h2{font-size:clamp(22px,3.4vw,30px);line-height:1.2;margin:0 0 .5em}
.topbar{position:sticky;top:0;z-index:50;height:var(--topbar-h);display:flex;align-items:center;gap:14px;padding:0 14px;padding-top:var(--browser-safe-top,env(safe-area-inset-top));background:var(--bg);border-bottom:1px solid var(--line)}
.topbar .home{font-weight:700;color:var(--ink);text-decoration:none;white-space:nowrap}.topnav{display:flex;gap:12px;overflow-x:auto;scrollbar-width:none;white-space:nowrap}.topnav a{color:var(--ink);text-decoration:none;font-size:14px}.spacer{flex:1}@media(max-width:640px){.topnav{display:none}}
.chip{border:1px solid var(--line);border-radius:999px;padding:4px 10px;text-decoration:none;color:var(--ink);font-size:14px}
.icon-btn{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:transparent;color:var(--ink);display:grid;place-items:center;cursor:pointer}
main{max-width:1060px;margin:0 auto;padding:0 16px 40px}.narrow{max-width:42rem}
section{scroll-margin-top:calc(var(--topbar-h) + 14px);padding:28px 0 8px}
.kicker{text-transform:uppercase;letter-spacing:.08em;font-size:13px;color:var(--accent);font-weight:700;margin:22px 0 0}
.deck{font-size:19px;max-width:46rem}.stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:16px 0}
.stat{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:12px}.stat b{display:block;font-size:24px}.stat span{color:var(--muted);font-size:14px}
.figure{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:14px;margin:14px 0}
.controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:10px 0}
.controls label{font-weight:650}input[type=range]{flex:1;min-width:170px;accent-color:var(--accent)}
button.btn{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:8px 14px;cursor:pointer;font:inherit;font-size:15px}
button.btn[data-on=true]{background:var(--accent);color:#fff;border-color:var(--accent)}
.seg{display:flex;flex-wrap:wrap;gap:6px}.seg button{border:1px solid var(--line);background:transparent;color:var(--ink);border-radius:999px;padding:7px 12px;cursor:pointer;font:inherit;font-size:14px}
.seg button[aria-pressed=true]{background:var(--ink);color:var(--bg)}
.flows{display:grid;gap:7px;margin:10px 0}.flow{display:grid;grid-template-columns:minmax(128px,190px) 1fr 92px;gap:8px;align-items:center;font-size:15px}
.bar{height:16px;background:var(--line-soft);border-radius:4px;overflow:hidden}.bar i{display:block;height:100%;border-radius:4px}
.tankwrap{display:grid;grid-template-columns:120px 1fr;gap:16px;align-items:center}
.tank{width:110px;height:150px;border:2px solid var(--ink);border-radius:10px;position:relative;overflow:hidden;background:var(--bg)}
.tank i{position:absolute;left:0;right:0;bottom:0;background:var(--tank)}
.tank b{position:absolute;inset:auto 0 6px;text-align:center;font-size:14px}
table{border-collapse:collapse;width:100%;font-size:15px}th,td{border-bottom:1px solid var(--line-soft);padding:7px 6px;text-align:right}th:first-child,td:first-child{text-align:left}
.note{color:var(--muted);font-size:15px}.modelbox{border:2px dashed var(--accent);border-radius:14px;padding:14px;background:var(--card)}
.share-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:12px 0}.share-row .lb{color:var(--muted);font-size:14px}
.share-row a,.share-row button{width:40px;height:40px;border-radius:50%;border:1px solid var(--line-soft);display:grid;place-items:center;color:var(--ink);background:transparent;cursor:pointer;text-decoration:none}
@media(pointer:coarse){.share-row a,.share-row button{width:44px;height:44px}}
.rail{position:fixed;right:10px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:10px;z-index:40}
.rail a{width:12px;height:12px;border-radius:50%;border:1.5px solid var(--muted);position:relative;display:block}
.rail a[aria-current=true]{background:var(--accent);border-color:var(--accent)}
.rail a span{position:absolute;right:20px;top:50%;transform:translateY(-50%);background:var(--card);border:1px solid var(--line);padding:2px 8px;border-radius:999px;font-size:13px;white-space:nowrap;opacity:0;pointer-events:none;color:var(--ink)}
.rail a:hover span,.rail a:focus span{opacity:1}
@media(max-width:1240px){.rail{display:none}}
footer{border-top:1px solid var(--line);margin-top:30px;padding:18px 16px;display:flex;flex-wrap:wrap;gap:8px 20px;justify-content:center;color:var(--muted);font-size:15px}
svg text{font-family:inherit}.legend{display:flex;flex-wrap:wrap;gap:14px;font-size:14px;color:var(--muted);margin:6px 0}
.legend i{display:inline-block;width:14px;height:4px;border-radius:2px;vertical-align:middle;margin-right:5px}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px}
.result{font-size:18px;background:var(--line-soft);border-radius:12px;padding:12px 14px}
@media(max-width:560px){.flow{grid-template-columns:104px 1fr 76px;font-size:13.5px}.tankwrap{grid-template-columns:96px 1fr}.tank{width:88px}}

.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ---- the day scene ---- */
:root{--pipe-case:#3d3a33;--pipe-bore:#f3ecd9;--gas:#e39b2d;--gas-hi:#ffe3a3;--imp:#7d6aa8;--stuck:#c2412b;--net:#6f6656;--ink-soft:#2b2a26;--halo:#f6f1e3;--tank-bg:#f4efe2;--tank-rim:#3d3a33;--lb:#2b2a26;--sea-lb:#e9f3f3}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--pipe-case:#d7cdb5;--pipe-bore:#1c2421;--gas:#f0a73a;--gas-hi:#ffe6ad;--imp:#a493d6;--stuck:#ff6a4d;--net:#b8ad94;--halo:#141a18;--tank-bg:#1b2220;--tank-rim:#d7cdb5;--lb:#ece7d9;--sea-lb:#9fc6cf}}
:root[data-theme=dark]{--pipe-case:#d7cdb5;--pipe-bore:#1c2421;--gas:#f0a73a;--gas-hi:#ffe6ad;--imp:#a493d6;--stuck:#ff6a4d;--net:#b8ad94;--halo:#141a18;--tank-bg:#1b2220;--tank-rim:#d7cdb5;--lb:#ece7d9;--sea-lb:#9fc6cf}
.stage{position:relative;margin:10px -14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#e9e3d2;overflow:hidden}
.scene{display:block;width:100%;height:auto;--u:1}
.plate-d{display:none}
@media(prefers-color-scheme:dark){:root:not([data-theme=light]) .plate-d{display:inline}:root:not([data-theme=light]) .plate-l{display:none}:root:not([data-theme=light]) .stage{background:#1a201e}}
:root[data-theme=dark] .plate-d{display:inline}:root[data-theme=dark] .plate-l{display:none}:root[data-theme=dark] .stage{background:#1a201e}
.stamp{position:absolute;left:14px;top:10px;margin:0;display:flex;flex-direction:column;line-height:1.15;pointer-events:none;text-shadow:0 0 6px var(--halo),0 0 2px var(--halo)}
.stamp b{font:600 clamp(20px,3.4vw,30px)/1.1 Georgia,"Times New Roman",serif;color:var(--ink)}.stamp span{font-size:13px;color:var(--muted);letter-spacing:.02em}
.scene .border{fill:none;stroke:var(--ink-soft);stroke-width:1.1;stroke-opacity:.55;stroke-linejoin:round}
.scene .river{fill:none;stroke:#6e9fae;stroke-width:.9;stroke-opacity:.75;stroke-linecap:round}.scene .river.danube{stroke-width:1.8}
.scene .net{fill:none;stroke:var(--net);stroke-width:1.4;stroke-opacity:.55;stroke-dasharray:5 3;stroke-linecap:round}
.scene .ch path{fill:none;stroke-linecap:butt;stroke-linejoin:round}
.scene .casing{stroke:var(--pipe-case);stroke-opacity:.85}.scene .bore{stroke:var(--pipe-bore)}
.scene .nocap{stroke:var(--pipe-case);stroke-width:1.2;stroke-dasharray:2 3}
.scene .gas{stroke:var(--gas);transition:stroke-width .25s ease}
.scene .sheen{stroke:var(--gas-hi);stroke-dasharray:3 9;stroke-opacity:.9;animation:flow 1.1s linear infinite;transition:stroke-width .25s ease}
.scene .ch.in .gas{stroke:var(--imp)}.scene .ch.in .sheen{stroke:#e4dcf7;animation-direction:reverse}


.scene .stuckrim{stroke:var(--stuck);transition:stroke-width .25s ease}
.scene .pool0{stop-color:var(--stuck);stop-opacity:.75}.scene .pool1{stop-color:var(--stuck);stop-opacity:0}
.scene #pool{transition:rx .25s ease,ry .25s ease}
@keyframes flow{to{stroke-dashoffset:-24}}
@media(prefers-reduced-motion:reduce){.scene .sheen{animation:none}}
.scene .tk-bg{fill:var(--tank-bg);fill-opacity:.9}.scene .tk-rim{fill:none;stroke:var(--tank-rim);stroke-width:1.3}
.scene .gf0{stop-color:#f7c25e}.scene .gf1{stop-color:#c9791d}
.scene .tk-gas{transition:y .25s ease,height .25s ease}
.scene .town{fill:var(--ink-soft)}.scene .node{fill:var(--halo);stroke:var(--ink-soft);stroke-width:1.4}
.scene .rig path{fill:none;stroke:var(--ink-soft);stroke-width:1.4;stroke-linecap:round}.scene .well{fill:none;stroke:var(--ink-soft);stroke-width:1.2}
.scene .lb{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;font-size:calc(var(--u)*12px);fill:var(--lb);paint-order:stroke;stroke:var(--halo);stroke-width:calc(var(--u)*3px);stroke-linejoin:round}
.scene .lb.ctry{font-size:calc(var(--u)*11px);letter-spacing:.18em;fill:var(--muted);stroke:none;opacity:.8}
.scene .lb.sea{font:italic calc(var(--u)*17px) Georgia,serif;fill:var(--sea-lb);stroke:none;letter-spacing:.06em}
.scene .lb.town.strong,.scene .lb.neplb{font-weight:700}
.scene .lb.ex .exn{font-weight:650}.scene .lb.ex .exv{font-variant-numeric:tabular-nums}
.scene .lb.stuck{fill:var(--stuck);font-weight:700;font-size:calc(var(--u)*13px)}
.scene .lb.tk{font-size:calc(var(--u)*11px)}
.scene .net-lb{font-size:calc(var(--u)*11px);fill:var(--muted)}
.scene.narrow .minor{display:none}
.key{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13.5px;color:var(--muted);margin:8px 0 2px}
.key span{display:inline-flex;align-items:center;gap:6px}.key i{display:inline-block;flex:none}
.key .k-bar i{width:26px;height:10px;background:var(--gas);border-radius:1px}
.key .k-cap{width:22px;height:9px;border:2px solid var(--pipe-case);background:var(--pipe-bore)}
.key .k-gas{width:22px;height:6px;background:var(--gas)}.key .k-imp{width:22px;height:6px;background:var(--imp)}.key .k-stuck{width:22px;height:6px;background:var(--stuck)}
.key .k-tank{width:12px;height:12px;border-radius:50%;border:1.5px solid var(--tank-rim);background:linear-gradient(to top,#d98b25 55%,var(--tank-bg) 55%)}
.stockline{font-weight:600;margin:6px 0}
@media(max-width:560px){.stage{margin:10px -14px 0}.stamp{left:10px;top:6px}.stamp span{font-size:12px}.key{font-size:12.5px;gap:4px 12px}}
.scene .shadow{fill:none;stroke:#000;stroke-opacity:.16;stroke-linecap:butt;stroke-linejoin:round}.scene .tk-shadow{fill:#000;fill-opacity:.18}
#yearsvg{--uy:1}#yearsvg .yl{font-size:calc(var(--uy)*12px)}
.exitstrip{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:14px;margin:8px 0 0;font-variant-numeric:tabular-nums}
.exitstrip b{font-weight:650}.exitstrip .in{color:var(--imp)}
.scene.narrow .ex,.scene.narrow .tk,.scene.narrow .town:not(.strong),.scene.narrow .neplb,.scene.narrow .stuck,.scene.narrow .net-lb{display:none}
.scene.narrow .lb.ctry{font-size:calc(var(--u)*9.5px);letter-spacing:.12em}
.scene.narrow .lb.sea{font-size:calc(var(--u)*12px)}
@media(max-width:620px){.stamp{position:static;padding:8px 14px 6px;text-shadow:none}.stamp b{font-size:20px}}
.scene .ch.full .casing{stroke:var(--stuck);stroke-opacity:1}
.scene .nep .casing.ghost{stroke-opacity:.5}.scene .nep .bore{stroke-opacity:1}
.scene .nocap{stroke-width:2.2}
.scene .tk-lvl{stroke:#fff3cf;stroke-width:1.2;stroke-opacity:.9}.scene .tank.full .tk-lvl{stroke-opacity:0}
.scene .tank.full .tk-rim{stroke:#9b5a12;stroke-width:2}
.doors{margin:10px 0 2px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:var(--bg)}
.doors-h{margin:0 0 6px;font-size:13.5px;color:var(--muted)}
.exitstrip{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:6px 18px;margin:0;font-size:14px}
.door{display:grid;grid-template-columns:minmax(92px,auto) 120px 1fr;align-items:center;gap:8px;font-variant-numeric:tabular-nums}
.door b{font-weight:650}.door.in span{color:var(--imp)}.door.nep b{color:var(--stuck)}
.mp-c{fill:var(--pipe-case)}.mp-b{fill:var(--pipe-bore)}.mp-g{fill:var(--gas)}.mp-g.imp{fill:var(--imp)}.mp-s{fill:var(--stuck)}.mp-n{stroke:var(--pipe-case);stroke-dasharray:2 3;stroke-width:1.2}
@media(max-width:560px){.door{grid-template-columns:86px 110px 1fr;font-size:13px}.door svg{width:110px}.seg button{font-size:13px;padding:6px 10px}}
.scene .leader{stroke:var(--pipe-case);stroke-width:1;stroke-opacity:.55;stroke-dasharray:1.5 2.5}
.scene .fl-shadow{fill:#000;fill-opacity:.2}.scene .fl-ring{fill:#8d8576;stroke:var(--pipe-case);stroke-width:1.2}
.scene .bolt{fill:#e9e2cf;stroke:#3d3a33;stroke-width:.5}
.scene .fl-bore{fill:#26231f}.scene .fl-cap{fill:#6d665a;stroke:var(--pipe-case);stroke-width:1}
.scene .fl-gas{fill:var(--gas);transition:r .25s ease}.scene .door.in .fl-gas{fill:var(--imp)}
.scene .fl-stuck{fill:var(--stuck)}
.scene .fl-hi{fill:url(#glass);fill-opacity:.55;pointer-events:none}
.scene .door.full .fl-ring,.scene .door.blocked .fl-ring{fill:var(--stuck)}
.scene .door.off{opacity:.45}
.scene .tank.full .tk-rim{stroke:#fff3cf;stroke-width:1.6}.scene .tank.full .tk-bg{fill:#c9791d}
.scene .tank.full{filter:drop-shadow(0 0 3px rgba(240,170,60,.75))}
.key .k-door{width:14px;height:14px;border-radius:50%;border:3px solid #8d8576;background:radial-gradient(circle,var(--gas) 0 45%,#26231f 46%)}
.scene.narrow .lb.sea{display:none}
.scene .fl-bore{stroke:#cfc5ad;stroke-width:1;stroke-opacity:.8}
.scene .co-arc,.scene .co-head{fill:none;stroke:var(--ink-soft);stroke-width:1.4;stroke-dasharray:4 3;stroke-linecap:round}.scene .co-head{stroke-dasharray:none}
.scene .lb.callout-t{font-style:italic;font-size:calc(var(--u)*12px)}
.scene.narrow .callout,.scene.narrow .callout-t{display:none}
