:root{--blue:#004899;--cyan:#00ace9;--ink:#132c4b;--line:#c9dbea;--paper:#eff5fb;--orange:#ae4800;--teal:#00664f}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.45 system-ui,sans-serif}header{padding:12px max(20px,calc((100vw - 1440px)/2));display:flex;align-items:center;gap:24px;background:white;border-bottom:4px solid var(--cyan)}header img{width:104px;height:auto;flex:none}h1{margin:0;color:var(--blue);font-size:clamp(1.5rem,3vw,2.55rem);line-height:1.12}.eyebrow{margin:0 0 5px;letter-spacing:.09em;font-weight:800;font-size:.76rem;color:var(--blue)}.badge{margin-left:auto;border:1px solid var(--line);border-radius:99px;padding:5px 12px;color:var(--blue);font-size:.84rem;white-space:nowrap}main{max-width:1480px;margin:auto;padding:14px 20px;background:var(--paper)}.toolbar,.panelhead,.legend,nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.toolbar,.panelhead{justify-content:space-between}button,select{font:inherit;color:var(--blue);background:white;border:1px solid #98b4d1;border-radius:7px;padding:7px 11px}button{cursor:pointer;font-weight:650}button[aria-pressed=true],#present{background:var(--blue);color:white;border-color:var(--blue)}:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0}.metrics div{background:#e2f0ff;border-left:5px solid var(--blue);padding:8px 13px}.metrics div:first-child{border-color:#ef7d00}.metrics div:last-child{border-color:#0aa0dc}.metrics span,.metrics strong{display:block}.metrics strong{font-size:clamp(1.2rem,2.5vw,1.7rem);color:var(--blue);line-height:1.12}.layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(240px,23%);gap:12px}.panel{background:white;border:1px solid var(--line);border-radius:10px;overflow:hidden}.panelhead{padding:9px 13px;color:var(--blue);border-bottom:1px solid var(--line)}.panelhead label{font-size:.88rem}.viewport{height:clamp(390px,calc(100vh - 290px),670px);position:relative;overflow:hidden;background:#f7fbff;touch-action:none;cursor:grab}.viewport svg,#source,#source img{display:block;width:100%;height:100%}#source img{object-fit:contain;pointer-events:none}.zoom{position:absolute;bottom:8px;right:8px;display:flex;gap:4px}.zoom button{min-width:40px;min-height:40px}.legend{padding:8px 12px;border-top:1px solid var(--line);gap:14px;font-size:.82rem}.key::before{content:"";display:inline-block;width:18px;border-top:3px solid;margin-right:5px;vertical-align:middle}.imports{color:#934500}.imports::before{border-color:#ef7d00}.exports{color:var(--blue)}.exports::before{border-color:#0aa0dc}.local{color:var(--teal)}.local::before{border-top-style:dashed}aside{padding:17px}h2{color:var(--blue);font-size:clamp(1.3rem,2vw,1.65rem);line-height:1.15;margin:6px 0}aside p{margin:10px 0}dl{margin:13px 0}dl div{padding:7px 0;border-top:1px solid var(--line)}dd{margin:0;font-weight:800;font-size:1.3rem}dt,.note,footer{font-size:.87rem}.gain{color:var(--teal)}output{font-weight:800;color:var(--blue);margin-left:5px}input[type=range]{width:100%;accent-color:var(--blue)}footer{padding:9px 0;color:#425d79}.hit{cursor:pointer}.hit:focus rect,.hit:hover rect{stroke:#004899;stroke-width:3}.hit text{pointer-events:none}.dim{opacity:.21}.flow-line{fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.flow-hit{fill:none;stroke:transparent;stroke-width:22}.flow-group:hover .flow-line,.flow-group:focus-visible .flow-line{stroke-width:3;filter:drop-shadow(0 1px 2px #00489935)}.scenario-line{stroke-dasharray:6 4}.scenario-line.active{animation:travel 2s linear infinite}@keyframes travel{to{stroke-dashoffset:-20}}@media(prefers-reduced-motion:reduce){.scenario-line.active{animation:none}}main:fullscreen{max-width:none;overflow:auto;padding:15px 22px}main:fullscreen .viewport{height:calc(100vh - 210px);min-height:380px}main:fullscreen aside{font-size:clamp(16px,1.4vw,24px)}@media(max-width:720px){header{gap:10px;padding:10px}header img{width:65px}.badge{display:none}main{padding:10px}.layout{grid-template-columns:1fr}.viewport{height:340px;overflow:auto}.viewport svg{min-width:630px}.metrics div{padding:6px}.metrics span{font-size:.8rem}}
main.projecting{position:fixed;inset:0;z-index:10;max-width:none;overflow:auto;padding:15px 22px}main.projecting .viewport{height:calc(100vh - 210px);min-height:380px}main.projecting aside{font-size:clamp(16px,1.4vw,24px)}
@media(max-width:720px){.viewport svg{min-width:0}.viewport{height:300px}.zoom button{min-height:36px}}

/* Scenario controls and comparison, using the departmental palette. */
.panel{box-shadow:0 4px 18px #0048990b}
.panelhead{background:#edf5ff}
nav{padding:4px;border:1px solid var(--line);border-radius:10px;background:white}
nav button{border-color:transparent}
#scenarioTab[aria-pressed=false]{background:#e2f3fc}
.presets{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:14px 0}
.presets button{padding:7px 4px}
.comparison{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.comparison div{border:0;border-radius:7px;background:#edf5ff;padding:8px}
.comparison .gain{grid-column:1/-1;background:#e3f5ec;border-left:4px solid var(--teal)}
.comparison .gain dd{font-size:clamp(1.35rem,2vw,1.85rem)}
#conditions{border:1px solid var(--line);border-radius:7px;padding:8px 10px;font-size:.88rem}
#conditions summary{cursor:pointer;color:var(--blue);font-weight:700}
#conditions ul{padding-left:18px;margin:8px 0 0}
#conditions li+li{margin-top:4px}
#scenario .note{color:#425d79}
