/* ============================================================ theme */
:root{
  --bg:#ffffff; --panel:#f8fafc; --panel2:#f1f5f9;
  --line:#e2e8f0; --line2:#cbd5e1; --line3:#94a3b8;
  --txt:#0f172a; --txt2:#334155; --dim:#64748b; --dim2:#94a3b8;
  --hi:#0369a1; --hi2:#0284c7; --hiSoft:#e0f2fe;
  --warm:#c2410c; --warmSoft:#ffedd5;
  --wall:#7c3aed;
  --ok:#15803d;
  --pad:26px; --panelW:430px;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%;overflow:hidden}
body{
  background:var(--bg); color:var(--txt);
  font:400 15px/1.5 "Inter","Segoe UI",system-ui,-apple-system,sans-serif;
  -webkit-font-smoothing:antialiased;
}
button{font:inherit;color:inherit;background:none;border:none;cursor:pointer}

*::-webkit-scrollbar{width:8px;height:8px}
*::-webkit-scrollbar-track{background:#f1f5f9;border-radius:4px}
*::-webkit-scrollbar-thumb{background:#cbd5e1;border-radius:4px}
*::-webkit-scrollbar-thumb:hover{background:#94a3b8}
*{scrollbar-width:thin;scrollbar-color:#cbd5e1 #f1f5f9}

/* ============================================================ loader */
#loader{position:fixed;inset:0;z-index:200;background:var(--bg);
  display:flex;align-items:center;justify-content:center;
  transition:opacity .7s ease,visibility .7s}
#loader.gone{opacity:0;visibility:hidden}
#loader svg{position:absolute;width:min(77vmin,645px);height:min(77vmin,645px);overflow:visible}
#ldTrack{fill:none;stroke:#e2e8f0;stroke-width:3;vector-effect:non-scaling-stroke}
#ldFill{fill:none;stroke:var(--hi2);stroke-width:3.6;stroke-linecap:round;
        vector-effect:non-scaling-stroke}
#ldTxt{position:relative;text-align:center;z-index:2;pointer-events:none}
/* the halo the ring fades under. Pulled in ~half a centimetre all round so the drawn ring
   runs closer to the lettering before it dissolves — closer, never touching. */
#ldTxt::before{content:'';position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:146%;height:264%;background:radial-gradient(ellipse at center,
  #fff 0%,#fff 34%,rgba(255,255,255,.9) 50%,transparent 72%);z-index:-1}
#ldTxt .t1{font-size:clamp(15px,2.3vmin,21px);font-weight:600;letter-spacing:.34em;
           color:var(--txt);text-indent:.34em}
#ldTxt .t2{font-size:clamp(10px,1.4vmin,12px);letter-spacing:.32em;color:var(--dim2);
           margin-top:13px;text-indent:.32em}
#ldTxt .t3{font-size:11px;letter-spacing:.2em;color:var(--hi2);margin-top:24px;
           font-variant-numeric:tabular-nums;text-indent:.2em}

/* ============================================================ map */
:root{--hudW:332px}
@media(max-width:1360px){:root{--hudW:296px}}
#stage{position:fixed;inset:0 0 0 calc(84px + var(--hudW));background:var(--bg)}
#map{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:crosshair}
/* Cased lines. A single grey stroke vanishes into aerial imagery — mid-grey over mid-grey
   roofs and grass reads as nothing. Every reach is drawn twice: a white casing to cut it
   out of the photograph, then the line itself on top. Standard cartographic treatment and
   the only thing that holds up over a busy basemap. */
#map .case{fill:none;stroke:#fff;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;
           transition:opacity .45s ease}
#map .base{fill:none;stroke:#1e293b;stroke-width:2.9;stroke-linecap:round;
           stroke-linejoin:round;transition:opacity .45s ease}
#map .base.wall{stroke:var(--wall)}
#map .hlGlow{fill:none;stroke:#fff;stroke-width:13;stroke-linecap:round;stroke-linejoin:round}
#map .hl{fill:none;stroke:var(--hi);stroke-width:5.4;stroke-linecap:round;stroke-linejoin:round}
#snap{fill:#fff;stroke:var(--hi);stroke-width:1.8;opacity:0;transition:opacity .18s}
#snapDot{fill:var(--hi);opacity:0;transition:opacity .18s}
#map.near #snap,#map.near #snapDot{opacity:1}
/* camera markers: dormant until their view is open */
.mk{cursor:pointer}
.mk .body{fill:#fff;stroke:var(--warm);stroke-width:1.5;transition:all .3s}
.mk.on .body{fill:var(--warm);stroke:#fff;stroke-width:2}
.mk:hover .body{fill:var(--warm)}
#fov{fill:var(--warm);opacity:0;transition:opacity .4s ease;pointer-events:none}
#fov.on{opacity:.19}
#fovEdge{fill:none;stroke:var(--warm);stroke-width:1.3;opacity:0;
         transition:opacity .4s ease;pointer-events:none;stroke-dasharray:5 4}
#fovEdge.on{opacity:.65}
.lbl{font-size:10.5px;letter-spacing:.07em;fill:var(--txt2);pointer-events:none;
     font-weight:500;transition:fill .4s,opacity .4s;
     paint-order:stroke;stroke:#fff;stroke-width:2.6px;stroke-linejoin:round}
.lbl.on{fill:var(--hi);font-size:11.5px;font-weight:650}
/* Directly above the brand block. The previous spot — under the nav buttons — collided
   with the fourth button and clipped to a floating "Image…" fragment. */
#attrib{position:fixed;top:8px;right:calc(var(--panelW) + 14px);z-index:35;
        font-size:8.5px;color:var(--dim2);letter-spacing:.05em;opacity:.7;
        white-space:nowrap;transition:right .45s cubic-bezier(.16,.9,.24,1)}

/* ═══ hud — a real column now, not an overlay. Stats left, map centre, views right: the
   map owes the text nothing and runs the full height of the window. ═══ */
#hud{position:fixed;top:0;bottom:0;left:84px;width:var(--hudW);z-index:40;
     background:#fff;border-right:1px solid var(--line);
     display:flex;flex-direction:column;padding:20px 20px 14px;
     overflow-y:auto;overflow-x:hidden}
#eyebrow{font-size:9.5px;letter-spacing:.24em;color:var(--dim2);text-transform:uppercase;
         margin-bottom:8px}
#title{font-size:clamp(22px,2vw,31px);font-weight:650;line-height:1.06;letter-spacing:-.02em}
#sub{margin-top:8px;font-size:11.5px;color:var(--dim);letter-spacing:.01em;line-height:1.55}
/* a measured data grid, tight */
#stats{margin-top:12px;display:grid;grid-template-columns:1fr 1fr;gap:9px 14px;
       border-top:1px solid var(--line);padding-top:12px}
.dat{display:flex;flex-direction:column;gap:2px;min-width:0}
.dat .k{font-size:8.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--dim2)}
.dat .v{font-size:12.5px;color:var(--txt);font-variant-numeric:tabular-nums;
        letter-spacing:-.005em}
.dat .v em{font-style:normal;color:var(--dim);font-size:10.5px}
#hudSpace{flex:1}
/* the reach's OWN drawings, slotted under the numbers: its typical section and its slice
   of the long section. The sheet pages answer "the whole scheme"; this answers "this
   reach" without leaving the map. Both click through to the full sheets. */
#hudSec{margin-top:12px;border-top:1px solid var(--line);padding-top:12px;
        display:flex;flex-direction:column;gap:13px}
.hsBlk{cursor:pointer}
.hsBlk .hk{display:flex;justify-content:space-between;align-items:baseline;
        font-size:8.5px;letter-spacing:.15em;text-transform:uppercase;color:var(--dim2)}
.hsBlk .hk em{font-style:normal;letter-spacing:.08em;opacity:0;transition:opacity .2s}
.hsBlk:hover .hk,.hsBlk:hover .hk em{color:var(--hi);opacity:1}
.hsBlk svg{width:100%;height:auto;display:block;margin-top:6px}
.hsMeta{font-size:10px;color:var(--dim);margin-top:4px;font-variant-numeric:tabular-nums}
#hudSec.go{animation:arriveUp .52s .18s ease both}
.dat.acc .v{color:var(--hi);font-weight:600}
.dat.warn .v{color:var(--warm);font-weight:600}
@keyframes arrive{
  0%{opacity:0;transform:translateY(12px);letter-spacing:.12em;filter:blur(4px)}
  55%{opacity:1;filter:blur(0)} 100%{opacity:1;transform:translateY(0);letter-spacing:-.022em}}
@keyframes arriveUp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
#title.go{animation:arrive .6s cubic-bezier(.16,.9,.24,1) both}
#eyebrow.go{animation:arriveUp .48s ease both}
#sub.go{animation:arriveUp .52s .07s ease both}
#stats.go{animation:arriveUp .52s .13s ease both}
#rule{height:2px;width:0;background:var(--hi);margin-top:13px}
#rule.go{animation:ruleIn .72s .1s cubic-bezier(.16,.9,.24,1) both}
@keyframes ruleIn{from{width:0;opacity:0}to{width:150px;opacity:1}}

/* ============================================================ bottom bar */
/* free-flowing under the map — no hairline, the white page is the divider */
#bottomBar{position:fixed;left:calc(84px + var(--hudW));right:var(--panelW);bottom:0;
     z-index:40;padding:4px 24px 8px;display:flex;align-items:flex-end;gap:18px;
     transition:right .45s cubic-bezier(.16,.9,.24,1)}
#strip{flex:1;min-width:0}
#stripBar{position:relative;height:74px;cursor:pointer}
#stripSegs{position:absolute;inset:auto 0 12px 0;height:5px;border-radius:3px;overflow:hidden;
           display:flex;gap:1px;background:var(--line2)}
#stripSegs div{height:100%;background:var(--line3);transition:background .35s ease}
#stripSegs div:hover{background:var(--txt2)}
#stripSegs div.on{background:var(--hi)}
#stripHead{position:absolute;bottom:8px;width:2px;height:13px;background:var(--hi);
           border-radius:1px;transition:left .5s cubic-bezier(.16,.9,.24,1)}
#stripMeta{display:flex;justify-content:space-between;font-size:10px;color:var(--dim2);
           letter-spacing:.15em;text-transform:uppercase;margin-top:4px}
#stripC{color:var(--txt2);font-weight:500}

/* ============================================================ about */
#aboutBtn{display:flex;align-items:center;gap:10px;font-size:10px;letter-spacing:.12em;
     text-transform:uppercase;color:var(--txt2);font-weight:650;padding:11px 12px;
     margin-top:10px;border-radius:9px;background:var(--panel);
     box-shadow:0 0 0 1px var(--line2);transition:all .2s;text-align:left;cursor:pointer}
#aboutBtn:hover{color:var(--hi);box-shadow:0 0 0 1px var(--hi);background:var(--hiSoft)}
#aboutBtn img{width:24px;height:auto}
#about{position:fixed;inset:0;z-index:196;background:rgba(15,23,42,.34);
     backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;
     opacity:0;visibility:hidden;transition:opacity .35s,visibility .35s}
#about.on{opacity:1;visibility:visible}
#aboutCard{background:#fff;border-radius:16px;max-width:600px;width:calc(100% - 60px);
     padding:34px 38px 30px;box-shadow:0 30px 80px rgba(15,23,42,.35);
     transform:translateY(8px);transition:transform .35s}
#about.on #aboutCard{transform:none}
.abHead{display:flex;align-items:center;gap:15px;margin-bottom:16px}
.abHead img{width:46px;height:auto;flex:0 0 auto}
.abHead h2{font-size:21px;font-weight:650;letter-spacing:-.02em;line-height:1.15}
.abSub{font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:var(--hi);
     font-weight:650;margin-top:3px}
#aboutCard .ab1{font-size:13px;color:var(--txt2);line-height:1.66}
#aboutCard .ab2{font-size:13px;color:var(--txt2);line-height:1.66;margin-top:11px}
#aboutCard .ab3{font-size:13px;color:var(--txt2);line-height:1.75;margin-top:13px;
     padding-top:13px;border-top:1px solid var(--line)}
#aboutCard a{color:var(--hi);font-weight:600;text-decoration:none}
#aboutCard a:hover{text-decoration:underline}
/* the landing keeps its welcome; the shortcuts appear only when asked for */
.abKeys{display:none;flex-wrap:wrap;gap:7px 18px;margin-top:14px;padding-top:13px;
     border-top:1px solid var(--line);font-size:10.5px;color:var(--dim)}
#about.full .abKeys{display:flex}
.abKeys span{display:flex;align-items:center;gap:5px}
.abFine{font-size:9.5px;color:var(--dim2);line-height:1.7;margin-top:14px}
#aboutGo{margin-top:18px;width:100%;font-size:11px;letter-spacing:.18em;
     text-transform:uppercase;font-weight:650;color:#fff;background:var(--hi);
     border-radius:9px;padding:13px 0;transition:background .2s}
#aboutGo:hover{background:var(--hi2)}
kbd{border:1px solid var(--line2);border-radius:4px;padding:2px 7px;font:inherit;font-size:10px;
    color:var(--dim);background:#fff}

/* ============================================================ right panel */
#panel{position:fixed;top:0;right:0;bottom:0;width:var(--panelW);z-index:60;
       background:var(--panel);border-left:1px solid var(--line);
       display:flex;flex-direction:column;
       transition:transform .45s cubic-bezier(.16,.9,.24,1)}
#panel.min{transform:translateX(calc(100% - 52px))}
#panel.min #panelBody,#panel.min #panelHead .ph{opacity:0;pointer-events:none}
#panelHead{display:flex;align-items:center;gap:12px;padding:18px 20px;
           border-bottom:1px solid var(--line);flex:0 0 auto;background:#fff}
#panelHead .ph{flex:1;min-width:0;transition:opacity .3s}
#panelHead h2{font-size:11.5px;letter-spacing:.19em;text-transform:uppercase;color:var(--txt2);
              font-weight:650}
#panelHead p{font-size:11px;color:var(--dim2);margin-top:3px}
/* Bigger, ringed, and set in from the edge. Collapsed, this button is the ONLY way back to
   the panel, and a 26 px chevron flush against the screen edge did not look like a control. */
#toggle{flex:0 0 auto;width:34px;height:34px;border-radius:8px;display:grid;place-items:center;
        color:var(--txt2);box-shadow:0 0 0 1px var(--line2);background:#fff;
        transition:all .25s;margin-left:2px}
#toggle:hover{color:var(--hi);box-shadow:0 0 0 1px var(--hi)}
#panel.min #panelHead{padding:18px 8px 18px 10px}
#panel.min #toggle{box-shadow:0 0 0 1px var(--hi);color:var(--hi)}
#toggle svg{transition:transform .45s cubic-bezier(.16,.9,.24,1)}
#panel.min #toggle svg{transform:rotate(180deg)}
#panelBody{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:4px 0 34px;
           transition:opacity .3s}
.grp{padding:15px 20px 6px;border-bottom:1px solid var(--line)}
.grp h3{font-size:13px;letter-spacing:-.005em;font-weight:650;color:var(--txt);
        display:flex;align-items:baseline;gap:9px;cursor:pointer;transition:color .25s}
.grp h3 .n{margin-left:auto;font-size:10px;color:var(--dim2);letter-spacing:.1em;
           font-weight:500;font-variant-numeric:tabular-nums}
.grp.on{background:var(--hiSoft)}
.grp.on h3{color:var(--hi)}
.grp .meta{font-size:10.5px;color:var(--dim);margin-top:3px;letter-spacing:.02em;
           font-variant-numeric:tabular-nums}
/* One column. Reaches carry between zero and six views, so a fixed two-up grid left half the
   reaches with a ragged hole beside them and shrank every image to fit the worst case. One
   per row means a single view fills the panel width, which is most of them. Only a very wide
   screen has the room to go multi-column without shrinking anything. */
.cards{display:grid;grid-template-columns:1fr;gap:10px;margin-top:12px;padding-bottom:6px}
@media(min-width:2100px){ .cards{grid-template-columns:1fr 1fr} }
.card{position:relative;border-radius:7px;overflow:hidden;cursor:pointer;background:#fff;
      box-shadow:0 0 0 1px var(--line);transition:box-shadow .22s,transform .22s}
.card:hover{box-shadow:0 8px 18px rgba(15,23,42,.18);outline:2px solid var(--hi);outline-offset:-2px;transform:translateY(-2px)}
.card img{width:100%;aspect-ratio:1.39;object-fit:cover;display:block}
.card .cap{position:absolute;left:0;right:0;bottom:0;padding:15px 8px 6px;font-size:9.5px;
           letter-spacing:.1em;color:#fff;text-transform:uppercase;
           background:linear-gradient(transparent,rgba(15,23,42,.82));
           display:flex;justify-content:space-between;align-items:baseline;gap:6px}
.card .cap span{color:#fdba74;font-size:9px;letter-spacing:.14em;flex:0 0 auto}
.empty{font-size:11.5px;color:var(--dim2);font-style:italic;padding:3px 0 6px}

/* ============================================================ lightbox */
#lb{position:fixed;inset:0 0 0 84px;z-index:120;background:#fff;
    opacity:0;visibility:hidden;transition:opacity .28s,visibility .28s;
    display:grid;grid-template-columns:1fr 316px}
#lb.on{opacity:1;visibility:visible}
/* Column layout with a FIXED tray at the bottom. The stage absorbs whatever height is
   left, so stepping between views of different aspect never moves the caption or the tray
   — and nothing ever scrolls or gets buried below the fold. */
#lbMain{position:relative;display:flex;flex-direction:column;align-items:stretch;
        padding:50px 58px 16px;min-width:0;min-height:0}
/* positioned, so the arrows centre on the STAGE — anchored to lbMain they sat at the
   midpoint of stage+caption+tray, visibly below the picture's centreline */
#lbStageBox{flex:1;min-height:0;position:relative;display:flex;align-items:center;
            justify-content:center}
#lbImg{max-width:100%;max-height:100%;border-radius:8px;display:block;
       box-shadow:0 14px 44px rgba(15,23,42,.17),0 0 0 1px var(--line)}
#lbSecBig{display:none;width:100%;height:100%;align-items:center;justify-content:center}
#lbSecBig.on{display:flex}
#lbSecBig svg{width:100%;height:100%;display:block}
#lbCap{width:100%;margin-top:12px;flex:0 0 auto;display:flex;justify-content:space-between;
       align-items:baseline;gap:26px}
#lbCap h3{font-size:20px;font-weight:650;letter-spacing:-.015em}
#lbCap h3 span{margin-left:12px;font-size:10px;font-weight:600;color:var(--warm);
               letter-spacing:.17em;text-transform:uppercase}
#lbNarr{font-size:13px;color:var(--dim);margin-top:7px;max-width:96ch;line-height:1.6}
#lbCount{font-size:10.5px;color:var(--dim2);letter-spacing:.17em;text-transform:uppercase;
         white-space:nowrap;font-variant-numeric:tabular-nums}
#lbStage{display:flex;gap:5px;margin-top:11px}
#lbStage button{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
                color:var(--dim);padding:5px 11px;border-radius:6px;background:var(--panel2);
                transition:all .2s}
#lbStage button:hover{color:var(--txt)}
#lbStage button.on{background:var(--hi);color:#fff}
/* right-anchored beside the close control — centred, it collided with "Back to the
   renders" on narrow windows */
#lbCrumb{position:absolute;top:22px;right:72px;z-index:4;
  font-size:9.5px;letter-spacing:.26em;text-transform:uppercase;color:var(--dim2)}
#lbImgWrap{position:relative;width:100%;height:100%;display:flex;align-items:center;justify-content:center}
#lbChip{position:absolute;font-size:9.5px;letter-spacing:.11em;
  text-transform:uppercase;color:#fff;background:rgba(15,23,42,.55);border-radius:6px;
  padding:5px 10px;pointer-events:none;backdrop-filter:blur(4px)}
#lbChip b{font-weight:650;letter-spacing:.09em}
#lbMax{position:absolute;width:32px;height:32px;border-radius:8px;
  display:grid;place-items:center;color:#fff;background:rgba(15,23,42,.5);
  backdrop-filter:blur(4px);transition:background .2s}
#lbMax:hover{background:rgba(2,132,199,.75)}
#lbMax svg{width:15px;height:15px}
/* enlarged: the picture takes the whole pane — rail stays, a bezel stays, Esc backs out */
#lb.max{grid-template-columns:1fr 0}
#lb.max #lbRail,#lb.max #lbCap,#lb.max #lbXs,#lb.max #lbCrumb{display:none}
#lb.max #lbMain{padding:26px 30px}

/* The tray under the picture. Normally it holds the reach's typical section — click it and
   the section SWAPS with the picture: the drawing takes the stage, and the tray becomes the
   three imagery frames, any of which brings the picture back. */
#lbXs{width:100%;height:104px;margin-top:10px;padding-top:10px;flex:0 0 auto;
      border-top:1px solid var(--line);display:flex;gap:18px;align-items:center}
/* with the section on the stage the tray is the picture browser, so it gets real size */
#lbXs.secMode{height:236px}
/* width-driven so three frames always fit the pane; aspect keeps them honest */
#lbXs.secMode .trayThumb{height:auto;max-height:100%;
  width:calc((100% - 170px)/3);aspect-ratio:1479/1064}
#lbXs.secMode .lxm{white-space:normal;max-width:96px;text-align:left}
#lbXs .lxh{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim2);
           white-space:nowrap}
#lbXs .lxm{font-size:11px;color:var(--dim);font-variant-numeric:tabular-nums;
           white-space:nowrap;text-align:right}
.trayHint{color:var(--hi);font-weight:600}
.traySec{flex:1;min-width:0;height:100%;display:flex;align-items:center;cursor:pointer;
         border-radius:7px;transition:background .2s;padding:0 8px}
.traySec:hover{background:var(--hiSoft)}
.traySec svg{width:100%;height:88px;display:block}
.trayDiv{width:1px;height:78%;background:var(--line);flex:0 0 auto}
.trayViews{display:flex;gap:8px;align-items:center;height:100%;min-width:0;
           overflow:hidden}
.trayView{flex:0 1 auto}
.trayThumb{height:84px;aspect-ratio:1479/1064;border-radius:6px;overflow:hidden;
           cursor:pointer;position:relative;box-shadow:0 0 0 1px var(--line);
           flex:0 0 auto;transition:box-shadow .2s}
.trayThumb:hover{box-shadow:0 0 0 2px var(--hi)}
.trayThumb img{width:100%;height:100%;object-fit:cover;display:block}
.trayThumb span{position:absolute;left:0;right:0;bottom:0;font-size:8.5px;
                letter-spacing:.1em;text-transform:uppercase;color:#fff;text-align:center;
                background:linear-gradient(transparent,rgba(15,23,42,.82));padding:12px 5px 4px}
/* nav: hit zone, not a button */
/* Small, vertically centred, and out of the way. Full-height hit zones reached under the
   close button, so hovering near the corner popped a "next view" tooltip on a control the
   reader was trying to leave. */
.lbArrow{position:absolute;top:50%;transform:translateY(-50%);width:34px;height:34px;
         border-radius:50%;display:grid;place-items:center;color:var(--dim);background:#fff;
         box-shadow:0 1px 6px rgba(15,23,42,.1),0 0 0 1px var(--line);
         transition:color .22s,box-shadow .22s;z-index:3}
.lbArrow:hover{color:var(--hi);box-shadow:0 5px 12px rgba(15,23,42,.16);outline:1px solid var(--hi);outline-offset:-1px}
/* the step viewer reuses .lbArrow, so it needs its own edge anchors — without them the
   buttons fall back to static flow and stack in the middle of the picture */
#lbPrev,#stepPrev{left:14px} #lbNextS,#stepNext{right:14px}
.lbArrow svg{width:16px;height:16px}
#lbX{position:absolute;top:22px;right:24px;z-index:4;width:34px;height:34px;border-radius:50%;
     display:grid;place-items:center;color:var(--dim);transition:all .25s}
#lbX:hover{background:var(--panel2);color:var(--txt)}
/* right rail: the ring, so you always know where you are */
#lbRail{border-left:1px solid var(--line);background:var(--panel);display:flex;
        flex-direction:column;overflow:hidden}
#lbRailHead{flex:0 0 auto;padding:18px 22px 12px;border-bottom:1px solid var(--line);background:#fff}
#lbRailHead .v{font-size:21px;font-weight:650;letter-spacing:-.022em;line-height:1.12}
#lbRailHead .m{font-size:10.5px;color:var(--dim);margin-top:5px;
               font-variant-numeric:tabular-nums}
#miniWrap{flex:1 1 0;min-height:56px;padding:8px 12px 20px;display:flex;align-items:center;
          justify-content:center;cursor:pointer;position:relative;
          transition:background .25s}
#miniWrap:hover{background:var(--hiSoft)}
#miniHint{position:absolute;left:0;right:0;bottom:6px;text-align:center;font-size:9px;
          letter-spacing:.18em;text-transform:uppercase;color:var(--dim2);opacity:0;
          transition:opacity .25s;pointer-events:none}
#miniWrap:hover #miniHint{opacity:1}
#railVol{flex:0 0 auto;padding:11px 22px;border-top:1px solid var(--line);background:#fff;
         display:grid;grid-template-columns:1fr 1fr;gap:9px 14px}
#railVol .rv{min-width:0}
#railVol .rk{font-size:9px;letter-spacing:.16em;text-transform:uppercase;color:var(--dim2)}
#railVol .rval{font-size:13px;font-weight:600;font-variant-numeric:tabular-nums;
               margin-top:2px;letter-spacing:-.01em}
#railVol .rval em{font-style:normal;font-weight:400;color:var(--dim);font-size:10.5px}
#railVol .rv.rock .rval{color:var(--warm)}
#mini{width:100%;height:100%;overflow:visible}
#mini .mcase{fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;
             opacity:.85}
#mini .mbase{fill:none;stroke:#475569;stroke-width:2;stroke-linecap:round;
             stroke-linejoin:round;opacity:.75}
#mini .mhl{fill:none;stroke:var(--hi);stroke-width:4.4;stroke-linecap:round;
           stroke-linejoin:round;transition:d .45s}
#mini .mdot{fill:var(--warm);stroke:#fff;stroke-width:1.6}
#mini .mghost{fill:var(--line3)}
#mini .mfov{fill:var(--warm);opacity:.34;stroke:var(--warm);stroke-width:1.1}
#lbGeo{flex:0 0 auto;padding:11px 22px 14px;border-top:1px solid var(--line);font-size:10.5px;
       color:var(--dim);line-height:1.85;font-variant-numeric:tabular-nums;background:#fff}
#lbGeo b{color:var(--txt2);font-weight:600}
#lbGeo .row{display:flex;justify-content:space-between;gap:10px}

/* ============================================ methodology step-through */
#steps{position:fixed;inset:0 0 0 84px;z-index:160;background:var(--bg);display:flex;
       flex-direction:column;opacity:0;visibility:hidden;
       transition:opacity .28s,visibility .28s}
#steps.on{opacity:1;visibility:visible}
#stepHead{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;
          padding:54px 74px 16px;border-bottom:1px solid var(--line)}
#stepHead .k{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:var(--dim2)}
#stepHead .v{font-size:27px;font-weight:650;letter-spacing:-.022em;margin-top:5px}
#stepDots{display:flex;gap:7px;padding-bottom:6px}
#stepDots button{width:34px;height:5px;border-radius:3px;background:var(--line2);
                 transition:background .25s}
#stepDots button.on{background:var(--hi)}
#stepDots button:hover{background:var(--line3)}
#stepBody{flex:1;min-height:0;position:relative;display:flex;align-items:center;
          justify-content:center;padding:24px 74px;overflow:hidden}
/* The frame is a FIXED box, aspect-locked to the source imagery. Letting the image size
   itself meant the drone frame, the massing and the render each came out a different size
   and the picture jumped on every step — which is exactly what you are trying to compare. */
#stepFrame{position:relative;height:100%;aspect-ratio:1479/1064;max-width:100%;
           border-radius:8px;overflow:hidden;
           box-shadow:0 12px 38px rgba(15,23,42,.16),0 0 0 1px var(--line);flex:0 0 auto}
#stepImg{width:100%;height:100%;object-fit:cover;display:block}
/* the next and previous sets, just off the edge — enough to say the carousel continues */
.stepPeek{position:absolute;top:50%;transform:translateY(-50%);height:62%;width:auto;
          opacity:.30;border-radius:8px;pointer-events:none;filter:saturate(.7)}
#stepPeekL{right:calc(50% + min(43vh,46%) + 26px)}
#stepPeekR{left:calc(50% + min(43vh,46%) + 26px)}
/* on a very wide screen there is room to show all three stages at once instead */
#stepTriple{display:none;gap:14px;width:100%;height:100%;align-items:center;
            justify-content:center}
#stepTriple figure{margin:0;height:100%;display:flex;flex-direction:column;
                   justify-content:center;gap:8px;min-width:0}
#stepTriple img{width:100%;border-radius:7px;box-shadow:0 0 0 1px var(--line);display:block;
                transition:box-shadow .2s;cursor:pointer}
#stepTriple figure.on img{box-shadow:0 8px 22px rgba(15,23,42,.18);outline:2px solid var(--hi);outline-offset:-2px}
#stepTriple figcaption{font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
                       color:var(--dim2);text-align:center}
#stepTriple figure.on figcaption{color:var(--hi)}
@media(min-width:2100px){
  #stepFrame,.stepPeek,#stepPrev,#stepNext{display:none}
  #stepTriple{display:flex}
}
#stepFoot{display:flex;justify-content:space-between;gap:24px;padding:16px 74px 26px;
          border-top:1px solid var(--line);font-size:12.5px;color:var(--txt2)}
#stepCount{color:var(--dim2);font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
           white-space:nowrap;font-variant-numeric:tabular-nums}
#stepX,#xsX,#lsX{position:absolute;top:22px;right:26px;z-index:6;width:34px;height:34px;
            border-radius:50%;display:grid;place-items:center;color:var(--dim);
            background:#fff;box-shadow:0 0 0 1px var(--line);transition:all .25s}
#stepX:hover,#xsX:hover,#lsX:hover{color:var(--txt);box-shadow:0 0 0 1px var(--line3)}
/* home is available from every overlay, at a fixed spot, so there is never a stack to unwind */
#homeBtn{position:fixed;top:12px;left:100px;z-index:180;font-size:10.5px;letter-spacing:.16em;
         text-transform:uppercase;color:var(--txt2);background:#fff;border-radius:7px;
         padding:9px 15px;font-weight:600;box-shadow:0 1px 8px rgba(15,23,42,.12);
         opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s,color .2s}
#homeBtn:hover{color:var(--hi)}
body.overlay #homeBtn{opacity:1;visibility:visible}

/* ============================================================ cross sections */
#xs{position:fixed;inset:0 0 0 84px;z-index:155;background:var(--bg);overflow-y:auto;
    opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
#xs.on{opacity:1;visibility:visible}
/* Grid on the left, a sticky map on the right. Hovering a section cuts the bank on the map
   so the reader never has to hold "which reach is Eastons B SBK" in their head. */
/* The map column is sized off VIEWPORT HEIGHT, not a fixed width: the ring is 3.0 x 5.6 km,
   so a floor-to-ceiling map is 0.55 as wide as it is tall. On a taller or larger monitor the
   map grows and the grid grows with it, instead of everything staying pinned at a laptop
   size and leaving the bottom two-thirds of the column empty. */
#xsWrap{display:grid;grid-template-columns:1fr clamp(280px, calc(100vh * 0.54), 640px);
        gap:40px;max-width:2400px;margin:0 auto;padding:64px 46px 80px;align-items:start}
/* the mega sheet: map off, every section at one scale across the full width */
#xsWrap.nomap{grid-template-columns:1fr;max-width:none}
#xsWrap.nomap #xsMapWrap{display:none}
#xsWrap.nomap #xsGrid{grid-template-columns:repeat(auto-fill,minmax(520px,1fr));gap:34px 30px}
#xsMapToggle{position:absolute;top:0;right:0;font-size:9.5px;letter-spacing:.16em;
        text-transform:uppercase;color:var(--txt2);background:#fff;border-radius:7px;
        padding:8px 14px;font-weight:600;box-shadow:0 0 0 1px var(--line2);
        transition:all .22s}
#xsMapToggle:hover{color:var(--hi);box-shadow:0 0 0 1px var(--hi)}
#xsGrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(420px,1fr));gap:30px 26px;
        align-content:start}
#xsMapWrap{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;
           justify-content:center;padding:22px 0 16px}
#xsMapWrap h5{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim2);
              margin-bottom:8px;flex:0 0 auto}
#xsMap{flex:1;min-height:0;width:100%;display:block}
#xsMapName{font-size:13.5px;font-weight:650;margin-top:10px;min-height:1.3em}
#xsMapMeta{font-size:11px;color:var(--dim);margin-top:2px;font-variant-numeric:tabular-nums;
           min-height:1.3em}
/* unscoped: the same ring map is rendered in the sheet rail and again in the section
   detail, and scoping these to #xsMap left the detail copy unstyled — SVG paths with no
   fill rule default to solid black, so the ring came out as ink blots */
.xmcase{fill:none;stroke:#fff;stroke-width:6.5;stroke-linecap:round;stroke-linejoin:round}
.xmbase{fill:none;stroke:#475569;stroke-width:2.7;stroke-linecap:round;
        stroke-linejoin:round;opacity:.8}
.xmhlc{fill:none;stroke:#fff;stroke-width:9;stroke-linecap:round;stroke-linejoin:round}
.xmhl{fill:none;stroke:var(--hi);stroke-width:5.2;stroke-linecap:round;stroke-linejoin:round}
.xmlbl{font-size:12px;fill:var(--hi);font-weight:650;letter-spacing:.02em;
       paint-order:stroke;stroke:#fff;stroke-width:4px;stroke-linejoin:round}
.xmcut{stroke:var(--warm);stroke-width:2.6;stroke-linecap:round}
.xmdot{fill:var(--warm);stroke:#fff;stroke-width:1.4}
@media(max-width:1240px){ #xsWrap{grid-template-columns:1fr} #xsMapWrap{display:none} }
#xsGrid .xh{grid-column:1/-1;margin-bottom:2px;position:relative}
#xsGrid .xh .kicker{font-size:10.5px;letter-spacing:.3em;color:var(--hi);
                    text-transform:uppercase}
#xsGrid .xh h1{font-size:clamp(28px,3.6vw,42px);font-weight:650;letter-spacing:-.026em;
               margin:14px 0 12px;line-height:1.08}
#xsGrid .xh p{font-size:14.5px;color:var(--txt2);line-height:1.7;max-width:78ch}
#xsGrid .xsub{grid-column:1/-1;font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;
              color:var(--dim2);margin:26px 0 -4px;border-top:1px solid var(--line);
              padding-top:16px}
/* No card. No border. The sections already read as separate objects because each one is a
   drawing on white with a title over it — a box round every one just adds 33 rectangles
   competing with the geometry. */
.xcard{cursor:pointer;transition:opacity .2s}
.xcard h4{font-size:13px;font-weight:650;letter-spacing:-.005em;transition:color .2s}
.xcard:hover h4{color:var(--hi)}
.xcard .xm{font-size:10.5px;color:var(--dim2);margin-top:2px;font-variant-numeric:tabular-nums}
/* Wide and short, because that is the shape the sections actually are: the set spans 27.5 m
   across against 4.8 m tall. Height is left to the viewBox rather than pinned, so on a wider
   column the drawing scales up with the card instead of sitting small in a taller white box. */
.xcard svg{width:100%;height:auto;display:block;margin-top:2px}
.xcard .xtags{display:flex;gap:14px;margin-top:2px;flex-wrap:wrap}
.xtag{font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim2)}
.xtag.rock{color:var(--warm)}
.xtag.off{color:var(--dim2);font-style:italic}
#xsGrid.dim .xcard{opacity:.42}
#xsGrid.dim .xcard.hot{opacity:1}
/* The detail is a SHEET, not a page: everything fits the viewport with no scrolling. The
   drawing takes the height that is left after the header and the three info blocks, and
   the map column runs floor to ceiling beside it. */
#xsDetail{display:none;height:100vh;overflow:hidden;max-width:2400px;margin:0 auto;
          padding:54px 46px 22px}
#xsDetail.on{display:flex;flex-direction:column}
#xsBack{font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--dim);
        transition:color .25s;margin-bottom:12px;flex:0 0 auto;align-self:flex-start}
#xsBack:hover{color:var(--hi)}
#xsDetailBody{flex:1;min-height:0;display:flex}
.xdWrap{flex:1;min-height:0;display:grid;
        grid-template-columns:1fr clamp(250px, calc(100vh * 0.36), 470px);
        gap:42px;align-items:stretch}
.xdMain{display:flex;flex-direction:column;min-height:0}
.xdHead{display:flex;align-items:center;gap:16px;flex:0 0 auto}
.xdHead h1{font-size:clamp(24px,3vw,36px);font-weight:650;letter-spacing:-.024em}
.xdArr{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
       color:var(--txt2);background:#fff;box-shadow:0 0 0 1px var(--line2);
       transition:all .22s;flex:0 0 auto}
.xdArr:hover{color:var(--hi);box-shadow:0 0 0 1px var(--hi)}
.xdArr svg{width:15px;height:15px}
.xdHead .xdArr:first-of-type{margin-left:auto}
.xdMain .xdm{font-size:12.5px;color:var(--dim);margin-top:5px;flex:0 0 auto;
             font-variant-numeric:tabular-nums}
.xdDraw{flex:1;min-height:0;margin-top:6px;display:flex;flex-direction:column}
.xdDraw svg{flex:1;min-height:0;width:100%;height:100%;display:block}
.xdRow{display:grid;grid-template-columns:1fr 1fr 1.15fr;gap:30px;margin-top:10px;
       flex:0 0 auto}
.xdDraw svg{width:100%;height:auto;display:block}
.xleg{display:flex;flex-wrap:wrap;gap:6px 20px;align-items:center;margin-top:2px;
      font-size:10.5px;color:var(--dim);flex:0 0 auto}
.xleg span{display:flex;align-items:center;gap:6px}
.xleg i{width:15px;height:9px;border-radius:2px;display:inline-block}
.xleg .lf{background:#dcedc8;box-shadow:inset 0 0 0 1px #1e293b}
.xleg .lr{background:#cbd5e1;box-shadow:inset 0 0 0 1px #475569}
.xleg .lb{background:#fde68a;box-shadow:inset 0 0 0 1px #b45309}
.xleg .lg{background:none;border-top:1.5px dashed #a8a29e;height:0;border-radius:0}
.xleg .lx{margin-left:auto;color:var(--dim2);font-size:10px}
.xdBlk h5{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim2);
          margin-bottom:7px;padding-bottom:6px;border-bottom:1px solid var(--line)}
.xdBlk .xr{display:flex;justify-content:space-between;gap:12px;font-size:12.5px;
           padding:4px 0;font-variant-numeric:tabular-nums}
.xdBlk .xr span{color:var(--dim)} .xdBlk .xr b{color:var(--txt);font-weight:600}
.xdBlk img{width:100%;max-height:158px;object-fit:cover;border-radius:6px;display:block}
.xdBlk .cap{font-size:10px;color:var(--dim2);letter-spacing:.1em;margin-top:6px;
            text-transform:uppercase}
.xdBlk.click{cursor:pointer}
.xdBlk.click:hover .cap{color:var(--hi)}
.xdSide{min-height:0;display:flex;flex-direction:column}
.xdSide .xdBlk{flex:1;min-height:0;display:flex;flex-direction:column}
svg.xdmap{flex:1;min-height:0;width:100%;height:100%;display:block}
/* section drawing */
.sgnd{fill:none;stroke:#a8a29e;stroke-width:1.4;stroke-dasharray:6 4}
.sfill{fill:#dcedc8;stroke:none}
.sbody{fill:none;stroke:#1e293b;stroke-width:2}
.srock{fill:#cbd5e1;stroke:#475569;stroke-width:1.2}
.sbed{fill:#fde68a;stroke:#b45309;stroke-width:.9}
.sgrid{stroke:#e2e8f0;stroke-width:1}
.saxis{stroke:var(--line3);stroke-width:1}
/* sized for the detail sheet, where the svg scales up to fill the viewport */
.stxt{font-size:12px;fill:var(--hi);font-variant-numeric:tabular-nums;font-weight:600}
.stxt2{font-size:10.5px;fill:var(--dim2);font-variant-numeric:tabular-nums}
.sptl{font-size:10px;fill:var(--dim)}

/* ============================================================ long section */
#ls{position:fixed;inset:0 0 0 84px;z-index:155;background:var(--bg);overflow:hidden;
    opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;
    display:flex;flex-direction:column}
#ls.on{opacity:1;visibility:visible}
/* header starts below the reserved top strip, clear of Back to the map */
#lsHead{padding:58px 44px 16px;border-bottom:1px solid var(--line);flex:0 0 auto}
#lsHead .kicker{font-size:10.5px;letter-spacing:.3em;color:var(--hi);text-transform:uppercase}
#lsHead h1{font-size:clamp(24px,3vw,34px);font-weight:650;letter-spacing:-.024em;margin-top:10px}
#lsHead p{font-size:13px;color:var(--txt2);margin-top:7px;max-width:90ch;line-height:1.6}
#lsScroll{flex:1;min-height:0;overflow-x:auto;overflow-y:hidden;padding:10px 44px 26px}
#lsSvg{display:block;height:100%}
#lsFoot{padding:12px 44px 22px;border-top:1px solid var(--line);display:flex;gap:26px;
        flex-wrap:wrap;font-size:11px;color:var(--dim);flex:0 0 auto}
#lsFoot span{display:flex;align-items:center;gap:7px}
#lsFoot i{width:16px;height:0;display:inline-block;border-top-width:2.5px;border-top-style:solid}
.lsCrest{fill:none;stroke:var(--hi);stroke-width:2}
.lsGnd{fill:none;stroke:#b45309;stroke-width:1.6}
.lsFill{fill:#dcedc8;opacity:.85}
.lsGrid{stroke:#eef2f6;stroke-width:1}
.lsBreak{stroke:var(--line2);stroke-width:1;stroke-dasharray:3 3}
.lsTxt{font-size:9.5px;fill:var(--dim2);font-variant-numeric:tabular-nums}
.lsName{font-size:9.5px;fill:var(--txt2);font-weight:600}
.lsHot{fill:rgba(2,132,199,.1)}

/* ============================================================ volumetrics */
#vol{position:fixed;inset:0 0 0 84px;z-index:155;background:var(--bg);overflow:auto;
     opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s}
#vol.on{opacity:1;visibility:visible}
#volX{position:absolute;top:22px;right:26px;z-index:6;width:34px;height:34px;
      border-radius:50%;display:grid;place-items:center;color:var(--dim);background:#fff;
      box-shadow:0 0 0 1px var(--line);transition:all .25s}
#volX:hover{color:var(--txt);box-shadow:0 0 0 1px var(--line3)}
#volWrap{max-width:1660px;margin:0 auto;padding:58px 46px 70px}
#volHead{display:flex;align-items:baseline;gap:16px;flex-wrap:wrap;margin-bottom:14px}
#volHead .vh{font-size:12px;letter-spacing:.24em;color:var(--hi);text-transform:uppercase;
             font-weight:650}
#volHead .vs{font-size:10.5px;color:var(--dim2);letter-spacing:.03em;max-width:100ch}
#volScen{display:flex;flex-wrap:wrap;gap:22px;align-items:flex-start;margin-bottom:10px}
#volScen .sgrp .k{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;
                  color:var(--dim2);margin-bottom:7px}
#volScen .pills{display:flex;flex-wrap:wrap;gap:6px}
#volScen .pills button{font-size:10.5px;letter-spacing:.05em;padding:7px 13px;
        border-radius:999px;background:var(--panel2);color:var(--txt2);font-weight:600;
        transition:all .2s}
#volScen .pills button:hover{background:var(--line)}
#volScen .pills button.on{background:var(--hi);color:#fff}
#volScen .pills button.cmp.on{background:var(--warm)}
#volNote{font-size:11.5px;color:var(--warm);margin-bottom:14px;min-height:1.2em}
#volRatesWrap{margin:2px 0 12px}
#volRatesWrap h5{font-size:9.5px;letter-spacing:.2em;text-transform:uppercase;
                 color:var(--dim2);margin-bottom:9px}
#volRatesWrap h5 em{font-style:normal;letter-spacing:.04em;text-transform:none;
                    color:var(--dim2);font-weight:400}
#volRates{display:flex;flex-wrap:wrap;gap:10px 22px}
#volRates label{display:flex;align-items:center;gap:8px;font-size:11.5px;color:var(--dim)}
#volRates input{width:86px;padding:6px 9px;border:1px solid var(--line2);border-radius:6px;
        font:inherit;font-size:12px;text-align:right;color:var(--txt);background:#fff;
        font-variant-numeric:tabular-nums}
#volRates input:focus{outline:none;border-color:var(--hi)}
#volTableWrap{overflow:visible;margin:0 -6px;padding:0 6px}
.vt{width:100%;border-collapse:collapse;font-size:12px;min-width:1160px}
.vt th{position:sticky;top:0;background:var(--bg);z-index:2;box-shadow:0 1px 0 var(--line2);text-align:right;
       font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim2);
       font-weight:650;padding:9px 10px;border-bottom:2px solid var(--line2);
       white-space:nowrap}
.vt th:first-child,.vt th.sec{text-align:left}
.vt td{padding:7px 10px;border-bottom:1px solid var(--line);
       font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.vt td:first-child{text-align:left;font-weight:600;color:var(--txt)}
.vt td.sec{text-align:left;padding:3px 10px}
.vt td.sec svg{display:block;width:150px;height:auto}
.vt tbody tr[data-i]{cursor:pointer}
.vt tbody tr[data-i]:hover td{background:var(--hiSoft)}
.vt .off{color:var(--dim2);font-weight:400;font-size:9px;letter-spacing:.12em;
         text-transform:uppercase;margin-left:8px}
.vt .bar{position:relative;z-index:1}
.vt .bar i{position:absolute;inset:2px 0;left:auto;z-index:-1;background:var(--hiSoft);
           border-radius:3px;font-style:normal}
.vt .dd{font-size:10px;font-weight:600;margin-top:1px}
.vt .dd.up{color:var(--warm)} .vt .dd.dn{color:var(--ok)} .vt .dd.z{color:var(--dim2)}
.vt tr.tot td{border-top:2px solid var(--line2);border-bottom:none;font-weight:650;
              color:var(--txt);background:var(--panel)}
.vt tr.tot2 td{border-bottom:none;font-weight:500;color:var(--dim);background:var(--panel);
               font-size:11px}
.volFoot{display:flex;gap:22px;align-items:center;margin-top:16px;font-size:10.5px;
         color:var(--dim2);flex-wrap:wrap}
#volCopy{font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:var(--txt2);
         background:#fff;border-radius:7px;padding:8px 15px;font-weight:600;
         box-shadow:0 0 0 1px var(--line2);transition:all .25s}
#volCopy:hover{color:var(--hi);box-shadow:0 0 0 1px var(--hi)}

/* the strip on the main page doubles as a miniature of the long section */
#stripProf{position:absolute;left:0;right:0;bottom:22px;height:50px;pointer-events:none}
#stripProf path.p{fill:rgba(2,132,199,.16);stroke:var(--hi2);stroke-width:1}
#stripProf path.g{fill:none;stroke:#c2884d;stroke-width:.9;opacity:.75}
@media(max-width:1100px){ .xdWrap{grid-template-columns:1fr} }

/* ══════════════════════════════════════════ renders gallery */
#gal{position:fixed;inset:0 0 0 84px;z-index:155;background:var(--bg);
     opacity:0;visibility:hidden;transition:opacity .3s,visibility .3s;
     display:flex;flex-direction:column}
#gal.on{opacity:1;visibility:visible}
/* A reserved strip across the top. Back to the map and the zoom presets live at this
   height and NOTHING else may enter it — the picture sheet is clipped below the strip, so
   the controls never sit over an image or a label at any zoom. */
#galTop{flex:0 0 54px;position:relative;z-index:6}
#galZoom{position:absolute;top:11px;right:22px;display:flex;gap:5px}
#galZoom button{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
     font-weight:600;color:var(--txt2);background:#fff;border-radius:7px;padding:8px 13px;
     box-shadow:0 0 0 1px var(--line2);transition:all .2s}
#galZoom button:hover{color:var(--hi);box-shadow:0 0 0 1px var(--hi)}
#galZoom button.on{color:#fff;background:var(--hi);box-shadow:0 0 0 1px var(--hi)}
#galStageArea{flex:1;min-height:0;position:relative;overflow:hidden}
/* ONE sheet at every zoom — 3 stage rows by 45 view columns, laid out around the active
   view with EVERY cell at the same size. Nothing changes size when you arrive on it and
   nothing overlaps; the wheel scales the whole sheet continuously from Fit to nearly
   full screen, and a step glides the assembly rather than swapping pictures. */
#galGrid{position:absolute;inset:0;overflow:hidden}
#galGrid.zoomed{cursor:grab}
#galGrid.panning{cursor:grabbing}
#galTrack{position:absolute;left:0;top:0;width:100%;height:100%;will-change:transform}
.gc{position:absolute;border-radius:9px;overflow:hidden;cursor:pointer;
     background:var(--panel);box-shadow:0 0 0 1px var(--line)}
.gc img{width:100%;height:100%;object-fit:cover;display:block}
.gc:hover{box-shadow:0 0 0 2px var(--hi)}
.gc.on{box-shadow:0 0 0 3px var(--hi),0 16px 48px rgba(15,23,42,.16)}
#galChip{position:absolute;z-index:3;font-size:9.5px;letter-spacing:.11em;
     text-transform:uppercase;color:#fff;background:rgba(15,23,42,.55);border-radius:6px;
     padding:5px 10px;backdrop-filter:blur(4px);pointer-events:none;white-space:nowrap}
#galChip b{font-weight:650}
#galOpen{position:absolute;z-index:3;font-size:9.5px;letter-spacing:.13em;
     text-transform:uppercase;color:#fff;background:rgba(15,23,42,.5);border-radius:7px;
     padding:7px 12px;font-weight:600;backdrop-filter:blur(4px);white-space:nowrap;
     transform:translate(-100%,-100%);transition:background .2s}
#galOpen:hover{background:rgba(2,132,199,.8)}
/* ── the fixed bottom band: reach labels that ride with their columns, then the chainage
   bar — the whole scheme as the scroller. No scrollbars, no dividers, no profile: the
   long section has its own page. ── */
#galFoot{flex:0 0 auto;padding:4px 30px 10px}
/* full bleed — the band shares the grid's coordinate origin, so a label computed in
   grid space lands exactly under its column */
#galCapBand{position:relative;height:36px;overflow:hidden;margin:0 -30px}
#galCapTrack{position:absolute;inset:0;will-change:transform}
.gcap{position:absolute;top:0;height:100%;line-height:36px;text-align:center;
     font-size:11px;letter-spacing:.14em;text-transform:uppercase;
     color:var(--dim);font-weight:650;pointer-events:none;white-space:nowrap;
     overflow:hidden;text-overflow:ellipsis}
.gcap b{font-weight:650;color:var(--txt2)}
.gcap i{font-style:normal;color:var(--dim2);font-weight:500;margin-left:9px}
.gcap.tight i{display:none}   /* narrow column: the reach name alone */
.gcap.on{color:var(--hi)} .gcap.on b{color:var(--hi)}
#gcBar{position:relative;height:30px;cursor:pointer}
#gcSegs{position:absolute;inset:auto 0 9px 0;height:6px;border-radius:3px;overflow:hidden;
     display:flex;gap:1px;background:var(--line2)}
#gcSegs div{height:100%;background:var(--line3);transition:background .3s}
#gcSegs div:hover{background:var(--txt2)}
#gcSegs div.on{background:var(--hi)}
#gcHead{position:absolute;bottom:5px;width:2px;height:16px;background:var(--hi);
     border-radius:1px;transition:left .38s cubic-bezier(.22,.9,.3,1);
     box-shadow:none}
#gcMeta{display:flex;justify-content:space-between;font-size:9.5px;color:var(--dim2);
     letter-spacing:.15em;text-transform:uppercase;margin-top:2px}

/* ============================================================ methodology */
#meth{position:fixed;inset:0 0 0 84px;z-index:150;background:var(--bg);overflow-y:auto;
      opacity:0;visibility:hidden;transition:opacity .32s,visibility .32s}
#meth.on{opacity:1;visibility:visible}
.mwrap{max-width:1060px;margin:0 auto;padding:74px 44px 120px}
#methX{position:fixed;top:24px;right:30px;z-index:151;width:34px;height:34px;border-radius:50%;
       display:grid;place-items:center;color:var(--dim);background:#fff;
       box-shadow:0 0 0 1px var(--line);transition:all .25s}
#methX:hover{color:var(--txt);box-shadow:0 0 0 1px var(--line3)}
.mwrap .kicker{font-size:10.5px;letter-spacing:.3em;color:var(--hi);text-transform:uppercase}
.mwrap h1{font-size:clamp(30px,4.2vw,48px);font-weight:650;letter-spacing:-.026em;
          margin:16px 0 22px;line-height:1.07}
.mwrap .lede{font-size:16.5px;color:var(--txt2);line-height:1.68;max-width:74ch}
.mwrap h2{font-size:11.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--hi);
          margin:58px 0 18px;font-weight:650;border-top:1px solid var(--line);padding-top:20px}
.mwrap p{font-size:14.5px;color:var(--txt2);line-height:1.75;max-width:80ch;margin-bottom:15px}
.mwrap p b,.mwrap li b{color:var(--txt);font-weight:650}
.mwrap ul{margin:0 0 15px 19px;max-width:80ch}
.mwrap li{font-size:14.5px;color:var(--txt2);line-height:1.75;margin-bottom:9px}
.figs{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:22px 0 10px}
.figs figure{margin:0}
.figs img{width:100%;border-radius:6px;box-shadow:0 0 0 1px var(--line);display:block}
.figs figcaption{font-size:10px;color:var(--dim2);letter-spacing:.12em;margin-top:9px;
                 text-transform:uppercase}
/* the exemplar grid, right under the lede — the reader should see what the claim looks
   like before being asked to read the argument for it */
.exgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px;
        margin:20px 0 12px}
.excard{background:#fff;border-radius:9px;box-shadow:0 0 0 1px var(--line);padding:12px 13px;
        cursor:pointer;transition:box-shadow .22s,transform .22s}
.excard:hover{box-shadow:0 0 0 2px var(--hi),0 8px 22px rgba(15,23,42,.16);
              transform:translateY(-2px)}
.excard .exh{font-size:12.5px;font-weight:650;margin-bottom:8px}
.exstrip{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.exstrip img{width:100%;aspect-ratio:1.39;object-fit:cover;border-radius:4px;display:block}
.exf{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--dim2);
     margin-top:8px}
.tbl{width:100%;border-collapse:collapse;font-size:12.5px;margin:6px 0 20px}
.tbl th{text-align:left;font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;
        color:var(--dim2);font-weight:650;padding:10px 12px;border-bottom:1px solid var(--line2)}
.tbl td{padding:10px 12px;border-bottom:1px solid var(--line);color:var(--txt2);
        font-variant-numeric:tabular-nums}
.tbl td:first-child{color:var(--txt);font-weight:500}
.tbl tr:hover td{background:var(--panel)}
.note{border:1px solid #fed7aa;background:var(--warmSoft);padding:13px 18px;
      margin:22px 0;font-size:13.5px;color:var(--txt2);line-height:1.7;max-width:80ch;
      border-radius:6px}
/* The left rail — fixed, above every overlay, below only the loader. Active view uses
   an integrated tonal background; labels are full words, and the browser's own tooltip is suppressed by
   simply not using title attributes. */
#rail{position:fixed;left:0;top:0;bottom:0;width:84px;z-index:190;background:#fff;
      border-right:1px solid var(--line);display:flex;flex-direction:column;
      align-items:stretch;padding-top:10px}
#railBrand{width:30px;height:30px;margin:6px auto 12px;background-size:contain;
      background-repeat:no-repeat;background-position:center;opacity:.9}
#rail button{position:relative;width:100%;padding:11px 0 9px;display:flex;
      flex-direction:column;align-items:center;gap:5px;color:var(--dim);
      transition:color .18s,background .18s}
#rail button svg{width:19px;height:19px}
#rail button span{font-size:7.5px;letter-spacing:.07em;text-transform:uppercase;
      font-weight:650;white-space:nowrap}
#rail button:hover{color:var(--hi);background:var(--panel)}
#rail button.on{color:var(--hi);background:var(--hiSoft)}

body.panel-min{--panelW:52px}

@media(max-width:1180px){
  :root{--panelW:330px}
  #lb{grid-template-columns:1fr 270px}
  #lbMain{padding:50px 46px 24px}
}
@media(max-width:720px){ .figs{grid-template-columns:1fr} }
/* ══════════════════════════════════════════════ fly-around (v8, merged) ══
   The landing view. Canvas left, a real column right — the same furniture as the map
   view's panel, so moving between the two feels like one application. Nothing floats
   over the 3D except the reach card, and that sits in the sky. */
#fly{position:fixed;inset:0 0 0 84px;z-index:150;background:var(--bg);
     opacity:0;visibility:hidden;transition:opacity .32s,visibility .32s;
     display:grid;grid-template-columns:1fr var(--flyW)}
#fly.on{opacity:1;visibility:visible}
:root{--flyW:420px}
@media(max-width:1400px){:root{--flyW:360px}}

#flyMain{position:relative;min-width:0;overflow:hidden;user-select:none;-webkit-user-select:none}
#flyGl{position:absolute;inset:0}
#flyGl canvas{display:block;cursor:grab}
#flyGlStatus{position:absolute;z-index:20;left:50%;top:50%;transform:translate(-50%,-50%);
     display:none;max-width:420px;padding:14px 18px;border-radius:10px;background:#fff;
     color:var(--txt);box-shadow:0 8px 28px rgba(15,23,42,.22);font-size:12px;text-align:center}
#flyGlStatus.on{display:block}

/* the reach card — plain lettering, up in the sky where the page is white */
#flyCard{position:absolute;top:64px;left:18px;z-index:6;pointer-events:none;
     width:min(350px,calc(100% - 36px));box-sizing:border-box;
     padding:12px 14px 13px;border-radius:10px;background:#fff;
     box-shadow:0 5px 20px rgba(15,23,42,.14)}
#flyKick{font-size:9px;letter-spacing:.22em;text-transform:uppercase;color:var(--dim2)}
#flyName{font-size:clamp(22px,1.8vw,27px);font-weight:650;letter-spacing:-.022em;
     line-height:1.06;margin-top:2px;overflow-wrap:anywhere}
#flyMeta{font-size:11px;color:var(--dim);margin-top:4px;font-variant-numeric:tabular-nums}
#flyStats{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:4px 16px;margin-top:10px;
     width:100%}
#flyStats .k{font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim2)}
#flyStats .v{font-size:12.5px;font-variant-numeric:tabular-nums;color:var(--txt);
     font-weight:600}
#flyStats .v.rock{color:var(--warm)}
#flyStats .v.wall{color:var(--wall)}
#flyStats .v.earth{color:#3f6212}

/* the selected render lives in the information rail, never over the spatial view */
#flyHero{display:none;grid-template-columns:30px minmax(0,1fr) 30px;align-items:center;
     gap:9px;padding:11px 14px 12px;background:#fff;border-bottom:1px solid var(--line)}
#flyHero.on{display:grid}
#flyHero .hArr{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;
     color:var(--dim);background:#fff;box-shadow:0 1px 5px rgba(15,23,42,.10),
     0 0 0 1px var(--line);transition:color .2s,box-shadow .2s;flex:0 0 auto}
#flyHero .hArr:hover{color:var(--hi);box-shadow:0 3px 9px rgba(15,23,42,.14),0 0 0 1px var(--hi)}
#flyHero .hArr svg{width:14px;height:14px}
#flyHeroIn{position:relative;cursor:pointer}
#flyHeroIn img{width:100%;aspect-ratio:1479/1064;max-height:190px;object-fit:cover;
     border-radius:8px;display:block;box-shadow:0 4px 14px rgba(15,23,42,.13)}
#flyHeroCap{margin-top:6px;font-size:9.5px;letter-spacing:.13em;text-transform:uppercase;
     color:var(--txt2);font-weight:650;text-align:left;white-space:nowrap;overflow:hidden;
     text-overflow:ellipsis}
#flyHeroCap i{font-style:normal;color:var(--dim2);font-weight:500;margin-left:7px}
#flyHeroOpen{position:absolute;top:8px;right:8px;padding:5px 7px;border-radius:5px;
     background:rgba(255,255,255,.94);color:var(--hi);box-shadow:0 1px 7px rgba(15,23,42,.15);
     font-size:8px;font-weight:700;letter-spacing:.10em;text-transform:uppercase}
#flyHeroIn:hover #flyHeroOpen{background:var(--hi);color:#fff}

/* the deck — play, speed, elevation. Chainage-bar language throughout. */
#flyDeck{position:absolute;left:0;right:0;bottom:140px;z-index:6;display:flex;
     justify-content:center;align-items:flex-end;gap:20px;pointer-events:none}
#flyDeck > *{pointer-events:auto}
#flyPlay{width:40px;height:40px;border-radius:50%;background:#fff;
     box-shadow:0 2px 12px rgba(15,23,42,.16),0 0 0 1px var(--line2);
     display:grid;place-items:center;color:var(--hi);transition:all .2s;margin-bottom:2px}
#flyPlay:hover{box-shadow:0 4px 14px rgba(15,23,42,.18);outline:1px solid var(--hi)}
#flyPlay svg{width:15px;height:15px}
.flySlide{width:180px}
.flySlide .sm{display:flex;justify-content:space-between;font-size:8.5px;color:var(--dim2);
     letter-spacing:.15em;text-transform:uppercase;margin-bottom:5px}
.flySlide .sm b{color:var(--txt2);font-weight:650;font-variant-numeric:tabular-nums}
.flySlide .sb{position:relative;height:14px;cursor:pointer}
.flySlide .sb::before{content:'';position:absolute;left:0;right:0;top:4px;height:6px;
     border-radius:3px;background:var(--line2)}
.flySlide .sf{position:absolute;left:0;top:4px;height:6px;border-radius:3px;
     background:var(--hi);opacity:.35}
.flySlide .sh{position:absolute;top:0;width:2px;height:14px;background:var(--hi);
     border-radius:1px}

/* the bottom margin: the true long section, then the chainage bar */
#flyFoot{position:absolute;left:0;right:0;bottom:0;z-index:6;padding:3px 26px 5px;
     background:linear-gradient(transparent,rgba(255,255,255,.88) 18%,#fff 52%)}
#flyLsRow{position:relative;height:56px;cursor:pointer}
#flyLsRow svg{position:absolute;inset:0;width:100%;height:100%}
#flyLsHead{position:absolute;top:0;bottom:0;width:2px;background:var(--hi);pointer-events:none}
#flyBar{position:relative;height:22px;cursor:pointer;margin-top:0}
#flySegs{position:absolute;inset:auto 0 8px 0;height:6px;border-radius:3px;overflow:hidden;
     display:flex;gap:1px;background:var(--line2)}
#flySegs div{height:100%;background:var(--line3);transition:background .3s}
#flySegs div:hover{background:var(--txt2)}
#flySegs div.on{background:var(--hi)}
#flyHead{position:absolute;bottom:4px;width:2px;height:15px;background:var(--hi);
     border-radius:1px;pointer-events:none}
#flyMetaRow{display:flex;justify-content:space-between;font-size:9.5px;color:var(--dim2);
     letter-spacing:.15em;text-transform:uppercase;margin-top:1px}
#flyWhere{color:var(--txt2);font-weight:650}
#flyTip{position:fixed;z-index:170;pointer-events:none;background:#fff;border-radius:8px;
     box-shadow:0 6px 20px rgba(15,23,42,.18),0 0 0 1px var(--line);padding:8px 12px;
     font-size:10.5px;color:var(--txt2);line-height:1.55;font-variant-numeric:tabular-nums;
     opacity:0;transition:opacity .15s;white-space:nowrap}
#flyTip b{color:var(--txt);font-weight:650}
#flyTip .src{font-size:8.5px;letter-spacing:.08em;text-transform:uppercase;
     color:var(--dim2);margin-top:3px}
/* the live section occupies the clear sky band. It is annotation, not a floating card. */
#flyXs{position:absolute;left:390px;top:78px;z-index:6;
     width:min(740px,calc(100% - 790px));min-width:500px;pointer-events:none}
#flyXsHead{display:grid;grid-template-columns:minmax(180px,1fr) auto auto;
     align-items:end;gap:24px;position:relative;isolation:isolate}
#flyXsHead::before{content:'';position:absolute;inset:-12px -24px -14px;z-index:-1;
     pointer-events:none;background:radial-gradient(ellipse at 50% 52%,rgba(255,255,255,.96),
     rgba(255,255,255,.72) 58%,transparent 84%);filter:blur(5px)}
#flyXsHead .k{font-size:9px;letter-spacing:.17em;text-transform:uppercase;color:var(--dim2);
     margin-bottom:3px}
#flyXsK{display:block;font-size:16px;line-height:1.15;color:var(--txt);font-weight:680}
#flyXsArea{text-align:right;flex:0 0 auto;font-variant-numeric:tabular-nums}
#flyXsArea span{display:block;font-size:8.5px;letter-spacing:.12em;text-transform:uppercase;
     color:var(--dim2);margin-bottom:1px}
#flyXsArea b{display:block;font-size:24px;line-height:1;color:var(--hi);font-weight:680}
#flyXs svg{display:block;width:100%;height:clamp(170px,20vh,230px);overflow:visible;margin-top:2px}
#flyXsMeta{display:flex;align-items:flex-end;gap:14px;padding:0 2px 1px;
     font-size:8.5px;color:var(--dim2);font-variant-numeric:tabular-nums}
#flyXsMeta span{display:grid;gap:2px;white-space:nowrap;text-transform:uppercase;
     letter-spacing:.08em}
#flyXsMeta b{color:var(--txt2);font-size:12px;font-weight:680;letter-spacing:0;
     text-transform:none}
#flyXs.empty #flyXsArea,#flyXs.empty #flyXsMeta{opacity:.38}
#flyXs.transition #flyXsArea b{color:#b45309}
.fxT{font-size:13.5px;fill:var(--txt2);font-weight:650;font-variant-numeric:tabular-nums}
.fxT2{font-size:12.5px;fill:var(--dim2);font-variant-numeric:tabular-nums}
.fxDim{font-size:12.5px;fill:var(--txt2);font-weight:680;font-variant-numeric:tabular-nums}
.fxDimN{font-size:14px;font-weight:740}
.fxWarn{font-size:10px;fill:#b45309;font-weight:700;letter-spacing:.08em}
#flyXs text{paint-order:stroke;stroke:#fff;stroke-width:5px;stroke-linejoin:round}

/* top-right controls, inside the canvas but clear of everything */
#flyCtl{position:absolute;top:16px;right:18px;z-index:7;display:flex;gap:5px}
#flyCtl button,#flyCtl .chip{font-size:9.5px;letter-spacing:.12em;text-transform:uppercase;
     font-weight:600;color:var(--txt2);background:#fff;border-radius:7px;padding:7px 11px;
     box-shadow:0 0 0 1px var(--line2);transition:all .2s;font-variant-numeric:tabular-nums}
#flyCtl button:hover{color:var(--hi);outline:1px solid var(--hi);outline-offset:-1px}
#flyCtl button.on{color:#fff;background:var(--hi);outline:1px solid var(--hi);outline-offset:-1px}
#flyArea{float:right;display:flex;border-radius:7px;overflow:hidden;box-shadow:0 0 0 1px var(--line2);margin:-2px 0 7px 10px}
#flyArea button{border-radius:0;box-shadow:none;padding:7px 10px}
#flyPanelHead{display:flow-root}
#flyImagery[data-state="online"]{color:#166534}
#flyImagery[data-state="offline"],#flyImagery[data-state="retry"]{color:#9a3412}
#flyLane{display:flex;border-radius:7px;overflow:hidden;box-shadow:0 0 0 1px var(--line2)}
#flyLane button{border-radius:0;box-shadow:none;padding:7px 10px}
#flyReset{display:none} #flyReset.show{display:block}

/* Scenario comparison is a first-order analytical control, held in the clear top band. */
#flyScenario{position:absolute;top:16px;left:50%;z-index:8;transform:translateX(-50%);
  display:flex;align-items:center;gap:6px;padding:5px 7px;border-radius:9px;background:#fff;
  box-shadow:0 3px 14px rgba(15,23,42,.12),0 0 0 1px var(--line2)}
#flyScenario label{display:flex;align-items:center;gap:6px}
#flyScenario label>span{font-size:8px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--dim2);font-weight:650}
#flyScenario select{height:29px;max-width:170px;padding:0 26px 0 9px;border:1px solid var(--line2);
  border-radius:6px;background:#fff;color:var(--txt2);font:650 9.5px/1 Inter,"Segoe UI",sans-serif;
  letter-spacing:.04em;cursor:pointer}
#flyScenario select:focus-visible{outline:2px solid var(--hi);outline-offset:1px}
#flyScenarioKey{display:flex;align-items:center;gap:5px;margin-left:7px;
  font-size:8px;color:var(--dim2);white-space:nowrap}
#flyScenarioKey i{display:block;width:18px;height:3px;border-radius:2px;background:#0284c7}
#flyScenarioKey i.compare{background:#ea580c}
#flyScenarioKeyB:empty,#flyScenarioKeyB:empty+*{display:none}
.flyAreaNote{margin:18px;border:1px solid var(--line2);border-radius:9px;padding:16px;background:#f8fafc;
  font-size:11px;color:var(--txt2);line-height:1.55}
.flyAreaNote b{display:block;color:var(--txt);font-size:12px;margin-bottom:5px}
.flyAreaNote button{margin:12px 7px 0 0;padding:7px 9px;border:1px solid var(--line2);border-radius:6px;
  background:#fff;color:var(--hi);font-size:9px;text-transform:uppercase;letter-spacing:.1em;font-weight:650}
#flyPanel.area-only #flyHero{display:none!important}
.fxCompare{stroke:#ea580c;fill:none;stroke-width:2.5px}
.fxPrimary{stroke:#0284c7;fill:none;stroke-width:2.8px}

/* Shared scenario spine in Volumes: a compact spatial explanation before the numbers. */
#volCoverage{margin:4px 0 18px;padding:13px 16px 11px;border:1px solid var(--line2);
  border-radius:9px;background:#fff}
#volCoverage svg{display:block;width:100%;height:72px;margin-top:5px}
.volCovHead,.volCovMeta{display:flex;align-items:baseline;justify-content:space-between;
  gap:18px;flex-wrap:wrap;font-variant-numeric:tabular-nums}
.volCovHead b{font-size:11.5px;color:var(--txt);font-weight:680}
.volCovHead span,.volCovMeta{font-size:9.5px;color:var(--dim2);letter-spacing:.035em}
.volCovMeta{justify-content:flex-start;margin-top:5px;gap:18px}
.volCovMeta span{display:flex;align-items:center;gap:6px}
.volCovMeta i{display:block;width:18px;height:3px;border-radius:2px;background:#0284c7}
.volCovMeta i.b{background:#ea580c}

/* ── the right column ── */
#flyPanel{background:var(--panel);box-shadow:inset 1px 0 var(--line);
     display:flex;flex-direction:column;min-height:0}
#flyPanelHead{padding:16px 20px 12px;border-bottom:1px solid var(--line);background:#fff;
     flex:0 0 auto}
#flyPanelHead h2{font-size:11.5px;letter-spacing:.19em;text-transform:uppercase;
     color:var(--txt2);font-weight:650}
#flyPanelHead p{font-size:11px;color:var(--dim2);margin-top:3px}
#flyTypeKey,#miniTypeKey{display:flex;align-items:center;gap:12px;margin-top:8px;
  font-size:8.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--dim2)}
#flyTypeKey span,#miniTypeKey span{display:flex;align-items:center;gap:5px;white-space:nowrap}
#flyTypeKey i,#miniTypeKey i{display:block;width:17px;height:3px;border-radius:2px;background:#3f6212}
#flyTypeKey i.wall,#miniTypeKey i.wall{background:var(--wall)}
#miniTypeKey i.view{height:8px;background:rgba(194,65,12,.28);outline:1px solid var(--warm)}
#miniTypeKey{position:absolute;top:6px;right:10px;z-index:2;margin:0;padding:4px 6px;
  border-radius:5px;background:rgba(255,255,255,.88);pointer-events:none}
/* the map is the hero here — bigger than the map view's rail copy */
#flyMapWrap{position:relative;flex:0 0 auto;padding:10px 12px 8px;background:#fff;
     border-bottom:1px solid var(--line);cursor:pointer}
#flyMap{display:block;width:100%;height:clamp(210px,28vh,310px)}
#flyMapCap{position:absolute;top:10px;right:43px;z-index:2;max-width:260px;
     padding:5px 8px;border-radius:5px;background:rgba(255,255,255,.90);
     font-size:8.5px;letter-spacing:.11em;text-transform:uppercase;color:var(--dim2);
     text-align:right;pointer-events:none}
#flyInfo{position:absolute;top:10px;right:12px;z-index:4;width:25px;height:25px;
     border-radius:50%;background:rgba(255,255,255,.94);color:var(--dim);
     box-shadow:0 0 0 1px var(--line2),0 2px 7px rgba(15,23,42,.10);
     display:grid;place-items:center;font:italic 650 12px Georgia,serif;cursor:pointer}
#flyInfo:hover,#flyInfo[aria-expanded="true"]{color:var(--hi);box-shadow:0 0 0 1px var(--hi)}
#flyInfoPop{position:absolute;top:43px;right:12px;z-index:5;width:min(280px,calc(100% - 24px));
     padding:10px 11px;border-radius:8px;background:#fff;color:var(--dim);font-size:9.5px;
     line-height:1.5;box-shadow:0 9px 26px rgba(15,23,42,.17),0 0 0 1px var(--line)}
#flyInfoPop[hidden]{display:none}
#flyList{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:10px 16px 26px}
#flyList{scrollbar-width:thin;scrollbar-color:var(--line3) transparent}
.flyItem{position:relative;border-radius:7px;overflow:hidden;cursor:pointer;background:#fff;
     box-shadow:0 0 0 1px var(--line);transition:box-shadow .22s,transform .22s;
     margin-bottom:9px}
.flyItem:hover{box-shadow:0 7px 18px rgba(15,23,42,.16);outline:2px solid var(--hi);
     transform:translateY(-2px)}
.flyItem.on{box-shadow:0 8px 20px rgba(15,23,42,.18);outline:2px solid var(--hi)}
.flyItem.current-hero{display:none}
.flyItem img{width:100%;aspect-ratio:1.39;object-fit:cover;display:block}
.flyItem .cap{position:absolute;left:0;right:0;bottom:0;padding:15px 8px 6px;font-size:9.5px;
     letter-spacing:.1em;color:#fff;text-transform:uppercase;
     background:linear-gradient(transparent,rgba(15,23,42,.82));
     display:flex;justify-content:space-between;align-items:baseline;gap:6px}
.flyItem .cap b{font:inherit;font-weight:650;min-width:0;overflow:hidden;text-overflow:ellipsis;
     white-space:nowrap}
.flyItem .cap b i{font-style:normal;color:#cbd5e1;font-weight:500;margin-left:6px}
.flyItem .cap span{color:#fff;background:rgba(2,132,199,.92);border-radius:4px;padding:4px 6px;
     font-size:8px;font-weight:700;letter-spacing:.12em;flex:0 0 auto}
.flyItem:hover .cap span{background:#fff;color:var(--hi)}

#fly button:focus-visible,.flyItem:focus-visible,#flyMap:focus-visible{
     outline:2px solid var(--hi);outline-offset:2px}

/* analytical sheets now carry the sampled ground rather than a toe-to-toe assumption */
.sgnd{stroke:#b45309;stroke-width:1.7;stroke-dasharray:none}

/* One cartographic selection language across the overview, reach rail and section maps:
   strong cyan reach, one named label, quiet context. */
#map .case,#map .base,#map .hlGlow,#map .hl{vector-effect:non-scaling-stroke}
#map .base{stroke-width:3.2}
#map .hlGlow{stroke-width:15}
#map .hl{stroke-width:6.8}
#map .lbl{opacity:0}
#map .lbl.on{opacity:1;font-size:15px;font-weight:700;letter-spacing:.025em;
  stroke-width:5px}
#mini .mcase{stroke-width:6.5;opacity:.94}
#mini .mbase{stroke-width:2.7;opacity:.78}
#mini .mbase.wall,.xmbase.wall{stroke:var(--wall)}
#mini .mhl{stroke-width:7.2}
#mini .mfov{opacity:.20;stroke-width:1.3}
#mini .mfov{pointer-events:none}
#mini .mlbl,.xmlbl{fill:var(--hi);font-size:16.5px;font-weight:700;letter-spacing:.025em;
  paint-order:stroke;stroke:#fff;stroke-width:6px;stroke-linejoin:round}
#mini .msel,.xmsel{fill:#fff;stroke:var(--hi);stroke-width:3}
.xmcase{stroke-width:8}
.xmbase{stroke-width:3.2;opacity:.82}
.xmhlc{stroke-width:13}
.xmhl{stroke-width:7.4}
.xmcut{stroke-width:3.2}
.xmdot{stroke-width:2}

@media(max-width:1500px){
  #flyCtl{max-width:470px;justify-content:flex-end;flex-wrap:wrap}
  #flyXs{left:370px;right:18px;width:auto;min-width:0;top:100px}
  #flyXsHead{gap:14px}
  #flyXsHead{grid-template-columns:minmax(180px,1fr) auto}
  #flyXsMeta{grid-column:1/-1;grid-row:2;justify-self:start}
  #flyScenario{left:390px;transform:none}
  #flyScenarioKey{display:none}
}
@media(max-width:1100px){
  :root{--flyW:300px}
  #flyCard{top:90px;max-width:300px}
  #flyCtl{top:16px;left:auto;right:18px;max-width:230px;justify-content:flex-end;flex-wrap:wrap}
  #flyCtl .chip{display:none}
  #flyScenario{left:18px;top:16px;transform:none;max-width:370px}
  #flyScenario label>span{display:none}
  #flyScenario select{max-width:145px}
  #flyXs{left:18px;right:18px;top:280px;width:auto}
  #flyXs svg{height:160px}
  #flyXsMeta{gap:10px}
  .flySlide{width:160px}
  #flyMapWrap{padding:10px 12px 8px}
}

/* ══ V9 command dock and chronological render rail ═══════════════════════ */
#flyCtl{position:absolute;top:14px;left:386px;right:18px;z-index:8;display:grid;
  gap:8px;max-width:none;padding:9px 11px 10px;border:1px solid var(--line2);
  border-radius:12px;background:rgba(255,255,255,.97);box-shadow:0 7px 24px rgba(15,23,42,.11);
  font-variant-numeric:tabular-nums;user-select:none;-webkit-user-select:none}
.flyCtlTop,.flyCtlBottom{display:flex;align-items:center;gap:8px;min-width:0}
.flyCtlTop{justify-content:space-between}.flyCtlBottom{justify-content:flex-end}
.flyCtlBottom .flySlide{flex:1 1 90px;width:auto;min-width:84px}
#flyCtl button{font-size:8.5px;letter-spacing:.1em;text-transform:uppercase;font-weight:650;
  color:var(--txt2);background:#fff;border-radius:6px;padding:7px 9px;border:1px solid var(--line2);
  box-shadow:none;transition:color .18s,border-color .18s,background .18s;white-space:nowrap}
#flyCtl button:hover{color:var(--hi);border-color:var(--hi);outline:0}
#flyCtl button.on{color:#fff;background:var(--hi);border-color:var(--hi);outline:0}
#flyPlay{width:32px;height:32px;padding:0!important;border-radius:50%!important;background:var(--hi)!important;
  border-color:var(--hi)!important;display:grid;place-items:center;color:#fff!important;flex:0 0 auto}
#flyPlay svg{width:13px;height:13px}
.flySlide{width:145px;min-width:112px}
.flySlide .sb{touch-action:none}
#flyScenario{position:static;transform:none;display:flex;align-items:center;gap:8px;min-width:0;
  padding:0;border-radius:0;background:transparent;box-shadow:none}
#flyScenarioKey{margin-left:3px}
#flyImagery{font-size:8.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:650;
  white-space:nowrap;color:var(--dim2);flex:0 0 auto}
#flyImagery::before{content:'';display:inline-block;width:6px;height:6px;border-radius:50%;
  margin-right:6px;background:currentColor;vertical-align:1px}
#flyLane{display:flex;border-radius:7px;overflow:hidden;box-shadow:0 0 0 1px var(--line2)}
#flyLane button{border:0;border-radius:0;padding:7px 9px}
#flyLane button+button{border-left:1px solid var(--line2)}
#flyXs{left:390px;right:18px;top:116px;width:auto;min-width:0}
#flyXsK{font-size:17px}#flyXs svg{height:clamp(190px,22vh,248px)}
#flyXsArea b{font-size:26px}

#flyPanelHead{display:flex;align-items:center;padding:10px 14px;border-bottom:1px solid var(--line);
  background:#fff;min-height:47px}
#flyArea{float:none;display:flex;border:1px solid var(--line2);border-radius:7px;overflow:hidden;
  box-shadow:none;margin:0 auto}
#flyArea button{border-radius:0;box-shadow:none;padding:8px 13px;color:var(--txt2);font-size:9px;
  letter-spacing:.1em;text-transform:uppercase;font-weight:650}
#flyArea button+button{border-left:1px solid var(--line2)}
#flyArea button.on{background:var(--hi);color:#fff}
#flyMapWrap{padding:8px 12px 7px;background:#fff}
#flyMap{height:clamp(190px,26vh,278px)}
#flyMap rect:first-of-type{fill:#fff}
#flyList{flex:1;min-height:0;overflow:hidden;padding:10px 14px 14px;display:grid;
  grid-template-rows:repeat(3,minmax(92px,1fr));gap:9px;background:#f8fafc}
.flyItem{min-height:0;margin:0}
.flyItem img{width:100%;height:100%;aspect-ratio:auto;object-fit:cover;display:block}
.flyItem.past,.flyItem.next{opacity:.78}.flyItem.past:hover,.flyItem.next:hover{opacity:1}
.flyItem.current{outline:2px solid var(--hi);box-shadow:0 8px 20px rgba(15,23,42,.18)}
.flyItem .phase{position:absolute;top:7px;left:7px;padding:4px 6px;border-radius:4px;
  background:rgba(255,255,255,.94);color:var(--txt2);font-size:7.5px;letter-spacing:.12em;
  text-transform:uppercase;font-weight:720;box-shadow:0 1px 5px rgba(15,23,42,.12)}
.flyItem.current .phase{background:var(--hi);color:#fff}
.flyAreaNote{grid-row:1/-1;align-self:start}

@media(max-width:1500px){
  #flyCtl{left:350px}
  #flyXs{left:350px;right:18px;top:138px}
  #flyScenarioKey{display:none}
  .flySlide{width:125px}
}
@media(max-width:1100px){
  #flyCard{top:132px;width:min(300px,calc(100% - 36px))}
  #flyCtl{top:12px;left:18px;right:18px;max-width:none}
  .flyCtlBottom{flex-wrap:wrap}
  #flyImagery{display:none}
  #flyScenario label>span{display:none}
  #flyScenario select{max-width:145px}
  #flyXs{left:18px;right:18px;top:300px;width:auto}
  .flySlide{width:120px}
}

/* ═══════════════════════════════════════════════ V10 analytical workspace ══ */
.v9Close{position:absolute;top:22px;right:26px;z-index:20;width:38px;height:38px;border-radius:50%;
  display:grid;place-items:center;background:#fff;color:var(--dim);font-size:24px;font-weight:300;
  line-height:1;padding:0;text-indent:0;box-shadow:0 0 0 1px var(--line),0 7px 22px rgba(15,23,42,.07);transition:.2s}
.v9Close:hover{color:var(--hi);box-shadow:0 0 0 1px var(--hi),0 7px 22px rgba(15,23,42,.1)}
.v9AreaSwitch{display:inline-flex;align-items:center;border:1px solid var(--line2);border-radius:9px;
  background:#f8fafc;padding:3px;gap:2px}
.v9AreaSwitch button{padding:8px 13px;border-radius:6px;color:var(--txt2);font-size:10px;
  letter-spacing:.1em;text-transform:uppercase;font-weight:650;white-space:nowrap}
.v9AreaSwitch button:hover:not(:disabled){background:#fff;color:var(--hi)}
.v9AreaSwitch button.on{background:#fff;color:var(--hi);box-shadow:0 1px 5px rgba(15,23,42,.12)}
.v9AreaSwitch button:disabled{opacity:.38;cursor:not-allowed}
.v9ToolRow{display:flex;align-items:center;gap:20px;padding:12px 44px;border-bottom:1px solid var(--line);
  background:#fbfcfd;flex:0 0 auto;min-height:62px}
.v9ToolLabel{min-width:150px;display:flex;flex-direction:column;gap:2px}
.v9ToolLabel b{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--txt)}
.v9ToolLabel span{font-size:10px;color:var(--dim)}
.v9LayerSet{display:flex;flex-wrap:wrap;gap:8px 15px;align-items:center}
.v9Layer{display:flex;align-items:center;gap:7px;color:var(--dim);font-size:11px;font-weight:600;
  padding:5px 0;transition:.18s}
.v9Layer i{width:18px;height:4px;border-radius:2px;background:#cbd5e1;transition:.18s}
.v9Layer:hover:not(:disabled){color:var(--txt)}
.v9Layer.on{color:var(--txt)} .v9Layer.on i{background:var(--line)}
.v9Layer:disabled{opacity:.28;cursor:not-allowed}
.v9CompareMode{display:inline-flex;align-items:center;margin-left:auto;border:1px solid var(--line2);
  border-radius:7px;padding:2px;background:#fff;white-space:nowrap}
.v9CompareMode button{padding:6px 10px;border-radius:5px;font-size:9px;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;color:var(--dim)}
.v9CompareMode button:hover{color:var(--hi)}.v9CompareMode button.on{background:#eaf5fb;color:var(--hi)}

/* Long section. The profile is a workspace, not an explanatory essay. */
#v9LsHead{padding:62px 44px 17px;display:flex;justify-content:space-between;gap:34px;
  align-items:flex-end;border-bottom:1px solid var(--line);flex:0 0 auto}
#v9LsHead .kicker,#v9XsHead .kicker,#v9VolTitle .kicker{font-size:10px;letter-spacing:.28em;
  text-transform:uppercase;color:var(--hi);font-weight:650}
#v9LsHead h1,#v9XsHead h1,#v9VolTitle h1{font-size:clamp(27px,3vw,40px);line-height:1.05;
  letter-spacing:-.03em;font-weight:680;margin-top:10px}
#v9LsHead p,#v9XsHead p,#v9VolTitle p{font-size:12.5px;color:var(--txt2);margin-top:7px;line-height:1.55}
#lsScroll{position:relative;padding:8px 26px 17px 38px;scrollbar-color:#94a3b8 #eef2f6;
  scrollbar-width:thin;background:linear-gradient(#fff,#fbfcfd)}
#lsSvg{min-height:330px}
.v9LsGround{fill:none;stroke:#b45309;stroke-width:1.6;vector-effect:non-scaling-stroke}
.v9LsHigh{fill:#bbd8aa;opacity:.48;stroke:none}
.v9LsScenario{fill:none;stroke-width:2.35;stroke-linejoin:round;stroke-linecap:round;
  vector-effect:non-scaling-stroke}
#v9LsCursor{stroke:#111827;stroke-width:1;stroke-dasharray:4 3;opacity:0;pointer-events:none}
#v9LsTip{position:absolute;z-index:8;width:min(720px,calc(100% - 28px));background:rgba(255,255,255,.985);
  border:1px solid var(--line2);border-radius:12px;padding:0;box-shadow:0 18px 48px rgba(15,23,42,.18);
  opacity:0;visibility:hidden;pointer-events:none;overflow:hidden;transition:opacity .1s ease-out}
#v9LsTip.on{opacity:1;visibility:visible}
#v9LsTip>header{display:flex;justify-content:space-between;gap:26px;padding:14px 18px 13px;
  border-bottom:1px solid var(--line);font-size:11px;background:#fbfcfd}
#v9LsTip>header>div{display:flex;flex-direction:column;gap:3px}
#v9LsTip>header>div:last-child{text-align:right}
#v9LsTip>header span{color:var(--dim);font-size:9px;letter-spacing:.08em;text-transform:uppercase}
#v9LsTip>header b{color:var(--txt);font-size:13px;font-variant-numeric:tabular-nums}
.v9TipRow{display:grid;grid-template-columns:9px minmax(100px,.75fr) 1.25fr;gap:7px 9px;
  align-items:center;padding:5px 0;font-size:10.5px}
.v9TipRow i{width:8px;height:8px;border-radius:50%}.v9TipRow b{font-weight:650}.v9TipRow span{color:var(--txt2)}
.v9TipRow em{grid-column:3;font-style:normal;color:var(--dim);font-size:9.5px}.v9TipRow.mute{opacity:.48}
.v10TipPlotHead{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:10px 18px 2px}
.v10TipPlotHead b{font-size:10.5px;color:var(--txt);letter-spacing:.02em}
.v10TipPlotHead span{font-size:8.5px;color:var(--hi);letter-spacing:.1em;text-transform:uppercase;font-weight:700}
.v10TipPlot{display:block;width:100%;height:auto;max-height:176px;background:#fff}
.v10TipGrid{stroke:#e7edf3;stroke-width:1}.v10TipGridX{stroke:#f0f3f7}
.v10TipAxisText{fill:#8190a6;font-size:8.5px;font-variant-numeric:tabular-nums}
.v10TipFill{opacity:.1;stroke:none}.v10TipGround{fill:none;stroke:#b45309;stroke-width:1.7;
  stroke-linecap:round;stroke-linejoin:round}.v10TipDesign{fill:none;stroke-width:2.5;
  stroke-linecap:round;stroke-linejoin:round}
.v10TipPlotEmpty{min-height:112px;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:5px;margin:4px 18px 9px;background:#f8fafc;border:1px solid var(--line);border-radius:8px;color:var(--dim)}
.v10TipPlotEmpty b{font-size:11px;color:var(--txt2)}.v10TipPlotEmpty span{font-size:9.5px}
.v10TipScenarios{border-top:1px solid var(--line);background:#fbfcfd}
.v10TipScenario{min-height:88px;box-sizing:border-box;padding:11px 18px 12px}.v10TipScenario+.v10TipScenario{border-top:1px solid var(--line)}
.v10TipScenario>header{display:grid;grid-template-columns:22px minmax(110px,1fr) auto;align-items:center;
  gap:8px;margin-bottom:9px}.v10TipScenario>header i{width:21px;height:4px;border-radius:2px;background:var(--scenario)}
.v10TipScenario>header b{font-size:10.5px;color:var(--txt)}
.v10TipDelta{font-size:9px;color:var(--dim);font-variant-numeric:tabular-nums}
.v10TipScenario dl{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0}
.v10TipScenario dl div{display:flex;flex-direction:column;gap:3px}
.v10TipScenario dt{font-size:8px;color:var(--dim);letter-spacing:.08em;text-transform:uppercase}
.v10TipScenario dd{margin:0;color:var(--txt);font-size:11.5px;font-weight:650;font-variant-numeric:tabular-nums}
.v10TipScenario.mute{opacity:.58}.v10TipScenario.mute>header{margin-bottom:4px}
.v10TipScenario.mute p{margin:0 0 0 30px;color:var(--dim);font-size:9.5px}
#lsFoot{padding:11px 44px 16px;align-items:center}
#lsFoot>span,#v9LsLegend{display:flex;flex-wrap:wrap;gap:10px 20px}
#lsFoot i.v9HighKey{height:8px;width:16px;border:0;background:#bbd8aa;border-radius:2px}
#lsFoot details{margin-left:auto;position:relative}
#lsFoot summary{cursor:pointer;color:var(--hi);font-weight:650}
#lsFoot details p{position:absolute;right:0;bottom:25px;width:370px;padding:13px 15px;background:#fff;
  border:1px solid var(--line2);border-radius:8px;box-shadow:0 12px 30px rgba(15,23,42,.13);line-height:1.55}

/* Animated cross-section explorer */
#v9XsShell{height:100%;display:flex;flex-direction:column;overflow:hidden}
#v9XsHead{padding:60px 44px 15px;display:flex;align-items:flex-end;justify-content:space-between;
  gap:34px;border-bottom:1px solid var(--line);flex:0 0 auto}
#v9XsMain{display:grid;grid-template-columns:minmax(0,1fr) clamp(320px,31vw,520px);
  flex:1;min-height:0;overflow:hidden}
#v9XsPlot{display:flex;flex-direction:column;min-width:0;min-height:0;padding:18px 28px 10px 42px}
#v9XsSvg{flex:1;min-height:250px;display:flex;align-items:center}
#v9XsSvg>svg{width:100%;height:100%;display:block}
.v9XsSplit{width:100%;height:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:26px}
.v9XsSplitPanel{min-width:0;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr)}
.v9XsSplitPanel header{display:flex;align-items:center;gap:8px;min-height:30px;font-size:10.5px;color:var(--txt)}
.v9XsSplitPanel header i{width:20px;height:4px;border-radius:2px;background:var(--line)}
.v9XsSplitPanel header span{margin-left:auto;color:var(--dim);font-size:9.5px;font-variant-numeric:tabular-nums}
.v9XsSplitPanel>svg{width:100%;height:100%;display:block}.v9XsSplitPanel.empty{opacity:.52}
.v9XsSplitPanel:only-child{grid-column:1/-1}
.v9XsGrid{stroke:#e7edf3;stroke-width:1}.v9XsAxis{stroke:#94a3b8;stroke-width:1}
.v9XsTick{stroke:#94a3b8;stroke-width:1}.v9XsTickLabel{fill:#718096;font-size:10px}
.v9XsGround{fill:none;stroke:#b45309;stroke-width:2}.v9XsDesign{fill:none;stroke-width:3;
  stroke-linecap:round;stroke-linejoin:round}.v9XsFill{opacity:.15;stroke:none}
.v9XsAxisLabel,#v9XsSvg text{fill:#7c8ca3;font-size:11px;font-variant-numeric:tabular-nums}
#v9XsMetrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:8px;margin-top:4px}
.v9Metric{border:1px solid var(--line);border-radius:8px;padding:11px 13px;background:#fff}
.v9Metric header{display:flex;align-items:center;gap:7px;font-size:10.5px;margin-bottom:8px}
.v9Metric header i{width:17px;height:4px;border-radius:2px;background:var(--line)}
.v9Metric dl{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:0}
.v9Metric dl div{display:flex;flex-direction:column}.v9Metric dt{font-size:8.5px;text-transform:uppercase;
  letter-spacing:.1em;color:var(--dim2)}.v9Metric dd{font-size:12px;font-weight:650;margin-top:3px;font-variant-numeric:tabular-nums}
.v9Metric.empty{opacity:.5}.v9Metric.empty p{font-size:10px;color:var(--dim)}
#v9XsMapPanel{border-left:1px solid var(--line);background:#f7fafb;display:flex;flex-direction:column;min-height:0}
.v9PanelHead{padding:18px 20px 10px;display:flex;align-items:flex-start;justify-content:space-between;gap:14px}
.v9PanelHead>div{display:flex;flex-direction:column;gap:4px}.v9PanelHead b{font-size:10px;text-transform:uppercase;letter-spacing:.18em}.v9PanelHead span{font-size:9.5px;color:var(--dim);line-height:1.4}
.v9MapScaleCtl{display:flex;flex-direction:column;gap:4px;font-size:8px;text-transform:uppercase;letter-spacing:.1em;color:var(--dim);white-space:nowrap}
.v9MapScaleCtl select{border:1px solid var(--line2);border-radius:6px;padding:6px 7px;background:#fff;color:var(--txt);font:inherit;letter-spacing:.04em}
#v9XsMapStage{position:relative;flex:1;min-height:0;overflow:hidden;background:#eef2ed}
#v9XsMap{position:absolute;inset:0;display:block;width:100%;height:100%;cursor:crosshair;user-select:none}
#v9XsMapCutTag{position:absolute;z-index:3;transform:translate(-50%,calc(-100% - 15px));pointer-events:none;
  padding:5px 8px;border-radius:5px;background:rgba(255,255,255,.96);outline:1px solid rgba(234,88,12,.35);
  box-shadow:0 5px 14px rgba(15,23,42,.12);color:#c2410c;font-size:9px;font-weight:750;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
#v9XsMapScaleBar{position:absolute;left:16px;bottom:14px;z-index:3;display:flex;flex-direction:column;gap:4px;
  color:#334155;font-size:8.5px;font-weight:650;text-shadow:0 1px 2px #fff;pointer-events:none}
#v9XsMapScaleBar i{display:block;height:5px;border:solid #334155;border-width:0 1px 1px}
#v9XsMapMeta{padding:9px 20px 13px;border-top:1px solid var(--line);font-size:9.5px;color:var(--dim)}
.v9MapContext,.v9MapPossible,.v9MapScenario,.v9MapBuilt,.v9MapBeamHalo,.v9MapBeam,.v9MapPreviewHalo,.v9MapPreview,.v9MapCutEnd,.v9MapStation{vector-effect:non-scaling-stroke}
.v9MapContext{fill:none;stroke:#475569;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;opacity:.72}
.v9MapPossible{fill:none;stroke:#aab5c4;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.v9MapScenario{fill:none;stroke-width:5;stroke-linecap:round;stroke-linejoin:round}
.v9MapBuilt{fill:none;stroke:#111827;stroke-width:4;stroke-dasharray:3 3;stroke-linecap:round}
.v9MapBeamHalo{stroke:#fff;stroke-width:12;stroke-linecap:round;opacity:.96}.v9MapBeam{stroke:#ea580c;
  stroke-width:5;stroke-linecap:round}.v9MapCutEnd{fill:#fff;stroke:#ea580c;stroke-width:2}.v9MapStation{fill:#ea580c;stroke:#fff;stroke-width:2.5}
.v9MapPreviewHalo{stroke:#fff;stroke-width:8;stroke-linecap:round;stroke-dasharray:5 5;opacity:0;pointer-events:none}
.v9MapPreview{stroke:#075985;stroke-width:3;stroke-linecap:round;stroke-dasharray:5 5;opacity:0;pointer-events:none}
#v9XsTransport{display:flex;align-items:center;gap:8px;padding:10px 24px 12px 42px;border-top:1px solid var(--line);
  background:#fff;box-shadow:0 -8px 22px rgba(15,23,42,.035);flex:0 0 auto}
#v9XsTransport>button{width:34px;height:34px;border:1px solid var(--line2);border-radius:50%;display:grid;
  place-items:center;color:var(--txt2);font-weight:650;background:#fff}
#v9XsTransport>button:hover{border-color:var(--hi);color:var(--hi)}#v9XsPlay{background:var(--hi)!important;color:#fff!important;border-color:var(--hi)!important}
#v9XsTransport label{display:flex;align-items:center;gap:9px;font-size:9px;text-transform:uppercase;
  letter-spacing:.12em;color:var(--dim);margin-left:10px}#v9XsRange{width:min(28vw,430px);accent-color:var(--hi)}
#v9XsTransport output{font-size:11px;font-weight:650;min-width:86px;font-variant-numeric:tabular-nums}
#v9XsTransport select{border:1px solid var(--line2);border-radius:6px;padding:6px;background:#fff;font:inherit;color:var(--txt)}
.v9Keys{margin-left:auto;font-size:9px;color:var(--dim2)}

/* Volume comparison */
#volWrap{max-width:none;padding:60px 44px 70px}
#v9VolTitle{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:18px}
#v9VolTitle>div:first-child{max-width:800px}
#v9VolSticky{display:flex;gap:8px 18px;flex-wrap:wrap;align-items:center;justify-content:flex-end;
  font-size:10px;color:var(--dim)}
#v9VolSticky b{display:flex;align-items:center;gap:6px;color:var(--txt)}#v9VolSticky i{width:16px;height:4px;border-radius:2px}
#v9VolConfig{display:grid;grid-template-columns:1fr 1fr minmax(260px,.75fr);gap:12px;margin-bottom:12px}
#v9VolConfig section{border:1px solid var(--line);border-radius:9px;padding:15px 17px;background:#fff;min-height:94px}
#v9VolConfig h2{font-size:9px;text-transform:uppercase;letter-spacing:.18em;color:var(--dim2);margin-bottom:11px}
#v9VolConfig label{display:flex;align-items:center;gap:12px;color:var(--txt2);font-size:11px}
#v9VolConfig select{flex:1;min-width:0;padding:9px 10px;border:1px solid var(--line2);border-radius:7px;background:#fff;
  font:inherit;color:var(--txt)}#v9RatesToggle{font-size:11px;font-weight:650;color:var(--hi);padding:8px 10px;
  border:1px solid var(--line2);border-radius:7px;background:#fff}#v9RateState{font-size:10px;color:var(--dim);margin-left:9px}
#v9RatesPanel{display:none;border:1px solid var(--line);border-radius:9px;padding:14px 16px;margin-bottom:12px;background:#fbfcfd}
#v9RatesPanel.on{display:block}
#v9VolScope{border:1px solid var(--line);border-radius:9px;margin-bottom:14px;background:#fff;overflow:hidden}
.v9ScopeHead{display:flex;align-items:center;gap:18px;padding:12px 16px;background:#f8fafc;border-bottom:1px solid var(--line)}
.v9ScopeHead>div:first-child{margin-right:auto;display:flex;flex-direction:column}.v9ScopeHead b{font-size:11px}.v9ScopeHead span{font-size:9.5px;color:var(--dim)}
.v9AreaCheck{display:flex;align-items:center;gap:7px;font-size:10.5px;font-weight:600}.v9AreaCheck input{accent-color:var(--hi)}
.v9AreaCheck.unavailable{opacity:.42}
.v9ReachPicker{display:grid;grid-template-columns:repeat(auto-fit,minmax(420px,1fr));gap:1px;background:var(--line)}
.v9ReachPicker section{background:#fff;padding:13px 16px}.v9ReachPicker header{display:flex;gap:12px;align-items:center;margin-bottom:9px}
.v9ReachPicker header b{margin-right:auto;font-size:11px}.v9ReachPicker button{font-size:9.5px;color:var(--hi)}
.v9ReachPicker section>div{display:flex;flex-wrap:wrap;gap:7px 15px}.v9ReachPicker label{display:flex;align-items:center;gap:6px;
  font-size:9.5px;color:var(--txt2)}.v9ReachPicker input{accent-color:var(--hi)}
#v9VolTablePane{height:min(64vh,720px);min-height:370px;display:flex;flex-direction:column;margin:0}
#v9VolContextBar{flex:0 0 auto;min-height:44px;display:flex;align-items:center;gap:10px 18px;flex-wrap:wrap;
  padding:9px 14px;border:1px solid var(--line);border-bottom:0;border-radius:9px 9px 0 0;background:#eef6fb;
  color:var(--dim);font-size:10px;box-shadow:0 7px 18px rgba(15,23,42,.045);z-index:6}
#v9VolContextBar .v9ContextLabel{text-transform:uppercase;letter-spacing:.14em;font-size:8px;color:var(--hi);font-weight:700}
#v9VolContextBar b{display:flex;align-items:center;gap:7px;color:var(--txt)}#v9VolContextBar b i{width:18px;height:4px;border-radius:2px}
#v9VolContextBar>span:last-child{margin-left:auto;font-variant-numeric:tabular-nums}
#volTableWrap{flex:1;min-height:0;overflow:auto;border:1px solid var(--line);border-radius:0 0 9px 9px;margin:0;padding:0}
#volTable{border-collapse:collapse;width:100%;min-width:1280px;font-size:11px;background:#fff}
#volTable th,#volTable td{padding:10px 11px;border-bottom:1px solid var(--line);vertical-align:middle;text-align:right;
  font-variant-numeric:tabular-nums}#volTable thead th{position:sticky;top:0;z-index:3;background:#f8fafc;
  color:var(--dim2);font-size:8.5px;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
#volTable th:first-child,#volTable td:first-child{text-align:left}#volTable tbody tr{cursor:pointer;transition:background .15s}
#volTable tbody tr:hover{background:#f4f9fc}#volTable tbody th{font-size:11px;min-width:145px}
#volTable tbody th small{display:block;font-size:8px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim2);margin-bottom:3px}
#volTable th:first-child,#volTable td:first-child{position:sticky;left:0;min-width:172px;background:#fff;z-index:2}
#volTable th:nth-child(2),#volTable td:nth-child(2){position:sticky;left:172px;background:#fff;z-index:2}
#volTable thead th:first-child,#volTable thead th:nth-child(2){background:#f8fafc;z-index:5}
#volTable tbody tr:hover th:first-child,#volTable tbody tr:hover td:nth-child(2){background:#f4f9fc}
#volTable td.sec{width:205px;min-width:205px;padding:4px 8px}.v9VolMini{width:190px;height:72px;display:block}
.v9VolMini .v9XsGrid,.v9VolMini text,.v9VolMini .v9XsAxis{display:none}.v9VolMini .v9XsDesign{stroke-width:1.9}
.v9VolMini .v9XsGround{stroke-width:1.25}.v9VolMini .v9XsFill{opacity:.18}.v9VolEmpty{fill:none;stroke:#cbd5e1;stroke-width:1.2;stroke-dasharray:4 4}
.v9ValuePair{display:flex;justify-content:flex-end;gap:8px}.v9ValuePair .cmp{color:#c2410c}
.v9DualBar{height:5px;background:#eef2f6;border-radius:3px;overflow:hidden;margin-top:5px;position:relative;min-width:65px}
.v9DualBar i{display:block;position:absolute;left:0;top:0;height:2px;background:#0369a1}.v9DualBar i.cmp{top:3px;background:#ea580c}
#volTable td small{display:block;color:var(--dim2);font-size:8.5px;margin-top:3px}

@media(max-width:1180px){
  #v9XsMain{grid-template-columns:1fr 330px}.v9Keys{display:none}.v9Metric dl{grid-template-columns:repeat(2,1fr)}
  #v9VolConfig{grid-template-columns:1fr 1fr}#v9VolConfig section:last-child{grid-column:1/-1}
}
@media(max-width:900px){
  #v9LsHead,#v9XsHead,#v9VolTitle{align-items:flex-start;flex-direction:column;padding-left:24px;padding-right:24px}
  .v9ToolRow{padding-left:24px;padding-right:24px;align-items:flex-start;flex-direction:column;gap:8px}
  #v9LsTip{width:min(620px,calc(100% - 20px))}.v10TipScenario dl{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:9px}
  .v10TipPlot{max-height:154px}.v10TipPlotHead{padding-left:14px;padding-right:14px}
  #v9XsMain{grid-template-columns:1fr}#v9XsMapPanel{display:none}#v9XsPlot{padding-left:24px}
  #v9XsTransport{padding-left:24px;flex-wrap:wrap}#v9XsRange{width:36vw}
  #v9VolConfig{grid-template-columns:1fr}#v9VolConfig section:last-child{grid-column:auto}
  .v9ScopeHead{align-items:flex-start;flex-wrap:wrap}.v9ScopeHead>div:first-child{width:100%}
}

/* Synchronized station cue on the top-down reach view. */
#v10ReachScenarioTools{display:flex;flex-direction:column;gap:8px;padding:10px;border:1px solid var(--line2);border-radius:9px;background:#f8fbfd}
.v10ReachToolHead{display:flex;align-items:baseline;justify-content:space-between;gap:9px}.v10ReachToolHead b{font-size:9px;text-transform:uppercase;letter-spacing:.13em}.v10ReachToolHead span{font-size:8px;color:var(--dim);text-align:right}
.v10ReachScenarioGrid{display:grid;grid-template-columns:1fr 1fr;gap:7px}.v10ReachScenarioGrid label{display:flex;flex-direction:column;gap:3px;color:var(--dim);font-size:7.5px;font-weight:650;letter-spacing:.1em;text-transform:uppercase}
.v10ReachScenarioGrid label:last-child{grid-column:1/-1}.v10ReachScenarioGrid select{width:100%;min-width:0;padding:6px 7px;border:1px solid var(--line2);border-radius:6px;background:#fff;color:var(--txt);font-size:9px;text-transform:none;letter-spacing:0}
.v10ReachLegend{display:flex;flex-wrap:wrap;gap:5px 10px;color:var(--dim);font-size:8px}.v10ReachLegend span{display:flex;align-items:center;gap:5px}.v10ReachLegend i{width:15px;height:3px;border-radius:2px;background:#0369a1}.v10ReachLegend i.compare{background:#ea580c}.v10ReachLegend i.ground{height:1px;background:#b45309}
#v9ReachScan{display:grid;grid-template-columns:32px minmax(0,1fr);gap:8px;align-items:center;margin:0 0 2px;padding:8px 9px;border:1px solid var(--line2);border-radius:8px;background:#f8fbfd}
#v9ReachScan button{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--hi);color:#fff;font-size:11px}
#v9ReachScan label{grid-column:2;display:grid;grid-template-columns:auto minmax(70px,1fr) auto;gap:7px;align-items:center;font-size:8px;text-transform:uppercase;letter-spacing:.1em;color:var(--dim)}
#v9ReachScan input{width:100%;appearance:none;height:14px;background:transparent}#v9ReachScan input::-webkit-slider-runnable-track{height:3px;border-radius:2px;background:linear-gradient(to right,var(--hi) 0 var(--reach-pct),#cbd5e1 var(--reach-pct) 100%)}
#v9ReachScan input::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:50%;margin-top:-4.5px;background:#fff;border:2px solid var(--hi)}
#v9ReachScan output{min-width:62px;color:var(--txt);font-size:9px;font-weight:700;font-variant-numeric:tabular-nums}
#v9ReachScan .reach-travel{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:6px;align-items:center}
#v9ReachScan .reach-travel button{width:auto;height:29px;padding:0 8px;border:1px solid var(--line2);border-radius:6px;background:#fff;color:var(--txt2);font-size:7.5px;font-weight:700;letter-spacing:.055em;text-transform:uppercase;white-space:nowrap}
#v9ReachScan .reach-travel button.direction{min-width:68px;height:25px;padding:0 7px;color:var(--dim)}
#v9ReachScan .reach-travel button:hover{border-color:#7bc6e7;color:var(--hi);background:#eef8fc}
#v9ReachScan [hidden]{display:none!important}
#hsLs{position:relative}.v9ReachLsCursor{position:absolute;top:24px;bottom:21px;width:0;border-left:1px dashed #075985;pointer-events:none;transform:translateX(-50%)}
#v9ReachStripCursor{position:absolute;z-index:4;top:-8px;bottom:-6px;width:0;border-left:2px dashed #075985;pointer-events:none;transform:translateX(-50%)}
.v9ReachCutHalo,.v9ReachCut{pointer-events:none;vector-effect:non-scaling-stroke}.v9ReachCutHalo{stroke:#fff;stroke-width:9;stroke-linecap:round}.v9ReachCut{stroke:#075985;stroke-width:3.5;stroke-dasharray:6 5;stroke-linecap:round}

@media(min-width:1650px){:root{--hudW:410px}#hud{padding-left:24px;padding-right:24px}.v10ReachScenarioGrid{grid-template-columns:1fr 1fr 1fr}.v10ReachScenarioGrid label:last-child{grid-column:auto}}
@media(min-width:2200px){:root{--hudW:470px}}

/* ══ V9 workspace-density pass ═══════════════════════════════════════════ */
#v9LsHead{padding:18px 44px 12px 200px;align-items:center}
#v9LsHead h1{font-size:27px;margin-top:3px}
#v9LsHead p{margin-top:3px;line-height:1.35}
#v9LsHead .kicker{font-size:8.5px}
#v9LsTools{min-height:48px;padding-top:7px;padding-bottom:7px}
#lsFoot{padding-top:8px;padding-bottom:10px}

#v9XsShell{height:100%;display:grid;grid-template-columns:minmax(0,2fr) minmax(360px,1fr);
  grid-template-rows:auto auto minmax(0,1fr) auto;overflow:hidden}
#v9XsHead{grid-column:1;grid-row:1;padding:18px 28px 10px 200px;align-items:center;gap:16px}
#v9XsHead h1{font-size:27px;margin-top:3px}
#v9XsHead p{margin-top:3px;line-height:1.35}
#v9XsHead .kicker{font-size:8.5px}
#v9XsLayers{grid-column:1;grid-row:2;min-height:48px;padding:7px 28px 7px 44px;gap:14px}
#v9XsMain{display:contents}
#v9XsPlot{grid-column:1;grid-row:3;padding:8px 26px 5px 42px;min-height:0;overflow:hidden}
#v9XsSvg{min-height:0;align-items:stretch}
#v9XsMapPanel{grid-column:2;grid-row:1/-1;min-height:0;border-left:1px solid var(--line)}
.v9PanelHead{padding:18px 58px 10px 20px;align-items:flex-start}.v9PanelHead>div span{max-width:180px}
#v9XsMetrics{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin:0 4px 3px}
.v9Metric{border:0;border-top:1px solid var(--line);border-radius:0;padding:9px 0 3px;background:transparent}
.v9Metric header{margin-bottom:7px}.v9Metric dl{gap:12px}
#v9XsTransport{grid-column:1;grid-row:4;display:grid;
  grid-template-columns:auto 38px auto minmax(210px,1fr) auto auto auto;
  gap:8px;padding:10px 26px 12px 42px;box-shadow:none}
#v9XsTransport>button{width:34px;height:34px}
#v9XsTransport>button.reach{width:auto;min-width:105px;padding:0 11px;border-radius:7px;font-size:9px;
  letter-spacing:.08em;text-transform:uppercase}
#v9XsTransport label{margin-left:0}
.v9XsScrub{display:grid!important;grid-template-columns:auto minmax(120px,1fr) auto;gap:10px!important;
  min-width:0;margin:0 4px!important}
#v9XsRange{width:100%;appearance:none;height:16px;background:transparent;cursor:pointer}
#v9XsRange::-webkit-slider-runnable-track{height:3px;background:linear-gradient(to right,var(--hi) 0 var(--station-pct),#cbd5e1 var(--station-pct) 100%);border-radius:2px}
#v9XsRange::-webkit-slider-thumb{appearance:none;width:14px;height:14px;border-radius:50%;background:var(--hi);
  margin-top:-5.5px;border:2px solid #fff;box-shadow:0 0 0 1px var(--hi)}
#v9XsTransport output{min-width:78px;color:var(--txt);font-size:10.5px}
.v9Keys{grid-column:1/-1;margin:0;text-align:right;font-size:8.5px}

@media(max-width:1180px){
  #v9XsShell{grid-template-columns:minmax(0,2fr) minmax(330px,1fr)}
  .v9XsSplit{gap:14px}.v9XsSplitPanel header span{display:none}.v9CompareMode{margin-left:0}
  #v9XsTransport{grid-template-columns:auto 38px auto minmax(150px,1fr)}
  #v9XsTransport>.v9XsSelect{display:flex}
}
@media(max-width:1500px){
  .v9AreaSwitch button:disabled{display:none}
  #v9XsTransport{grid-template-columns:auto 38px auto minmax(150px,1fr);grid-template-rows:auto auto}
  #v9XsTransport>.v9XsSelect{grid-row:2;justify-self:start;margin-top:1px}
  #v9XsTransport>.v9XsSelect:nth-of-type(2){grid-column:1/3}
  #v9XsTransport>.v9XsSelect:nth-of-type(3){grid-column:3/5}
  #v9XsTransport>.v9XsSelect:nth-of-type(4){grid-column:5}
  #v9XsTransport>.v9Keys{display:none}
}
@media(max-width:900px){
  #v9XsShell{display:flex}
  #v9XsHead{padding:72px 24px 9px}
  #v9XsMapPanel{display:none}
  #v9XsTransport{display:flex;padding-left:24px;flex-wrap:wrap}
  .v9XsScrub{flex:1 1 100%}
}

/* Detached Carters map stays inside the shared viewer shell. */
#v9AreaMap{position:fixed;inset:0 0 0 84px;z-index:145;background:#fff;display:none;overflow:hidden;color:var(--txt)}
#v9AreaMap.on{display:grid;grid-template-rows:auto minmax(0,1fr)}
body.v9-area-map-open #homeBtn{display:none}
#v9AmHead{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:17px 36px 13px 44px;border-bottom:1px solid var(--line);background:#fff}
#v9AmHead h1{font-size:28px;line-height:1.05;margin:2px 0 3px}#v9AmHead p{font-size:11px;color:var(--dim);margin:0}
#v9AmBody{display:grid;grid-template-columns:280px minmax(0,1fr) 300px;min-height:0;background:#f6f8fa}
#v9AmSummary,#v9AmActions{padding:30px 26px;background:#fff;overflow:auto}
#v9AmSummary{border-right:1px solid var(--line)}#v9AmActions{border-left:1px solid var(--line)}
#v9AmSummary h2,#v9AmActions h2{font-size:22px;line-height:1.12;margin:5px 0 20px}
#v9AmSummary dl{margin:0}#v9AmSummary dl div{display:grid;gap:4px;padding:13px 0;border-bottom:1px solid var(--line)}
#v9AmSummary dt{font-size:8.5px;text-transform:uppercase;letter-spacing:.14em;color:var(--dim2)}
#v9AmSummary dd{font-size:13px;font-weight:650;margin:0}#v9AmSummary p,#v9AmActions p{font-size:10px;line-height:1.55;color:var(--dim);margin:20px 0}
#v9AmMapWrap{position:relative;min-width:0;min-height:0;overflow:hidden;background:#e9efeb}
#v9AmMap{width:100%;height:100%;display:block;cursor:crosshair}
.v9AmRouteHalo{fill:none;stroke:#fff;stroke-width:14;stroke-linecap:round;stroke-linejoin:round;opacity:.9}
.v9AmRoute{fill:none;stroke:#64748b;stroke-width:7;stroke-linecap:round;stroke-linejoin:round}
.v9AmPossible{fill:none;stroke:#94a3b8;stroke-width:4;stroke-linecap:round;stroke-dasharray:8 7;opacity:.8}
.v9AmPrimary{fill:none;stroke:#0369a1;stroke-width:9;stroke-linecap:round;stroke-linejoin:round}
.v9AmCompare{fill:none;stroke:#ea580c;stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
#v9AmDot{fill:#ea580c;stroke:#fff;stroke-width:3;opacity:0;pointer-events:none}
.v9AmLabel{fill:#075985;font-size:19px;font-weight:750;paint-order:stroke;stroke:#fff;stroke-width:6px;stroke-linejoin:round}
#v9AmHover{position:absolute;left:50%;bottom:20px;transform:translateX(-50%);min-width:390px;padding:10px 15px;border:1px solid rgba(148,163,184,.55);border-radius:7px;background:rgba(255,255,255,.94);box-shadow:0 8px 28px rgba(15,23,42,.13);text-align:center;font-size:10px;color:var(--txt2);pointer-events:none}
#v9AmActions button{display:block;width:100%;padding:12px 14px;margin:8px 0;border:1px solid var(--line2);border-radius:7px;background:#fff;color:var(--txt);font-size:10px;font-weight:700;letter-spacing:.08em;text-align:left;text-transform:uppercase}
#v9AmActions button:hover{border-color:var(--hi);color:var(--hi);background:#f4fafe}
@media(max-width:1100px){#v9AmBody{grid-template-columns:230px minmax(0,1fr)}#v9AmActions{display:none}}
@media(max-width:760px){#v9AreaMap{left:66px}#v9AmHead{padding-left:24px;align-items:flex-start;flex-direction:column}#v9AmBody{grid-template-columns:1fr}#v9AmSummary{display:none}#v9AmHover{min-width:0;width:calc(100% - 32px)}}

/* Reach-view imagery has the same spatial browsing grammar as the full gallery, but
   remains contained inside the reach stage. */
#v9LbGrid{display:none;position:absolute;inset:0;z-index:5;overflow:hidden;border:1px solid var(--line2);
  border-radius:8px;background:#e9eef2;cursor:grab;touch-action:none}
#lb.v9-lbgrid #v9LbGrid{display:block}
#lb.v9-lbgrid #lbImg,#lb.v9-lbgrid #lbChip,#lb.v9-lbgrid #lbMax,#lb.v9-lbgrid .lbArrow{visibility:hidden}
#v9LbGrid.panning{cursor:grabbing}
#v9LbTrack{position:absolute;display:grid;will-change:transform;transition:none;contain:layout paint}
#v9LbTrack.recentering{transition:transform .38s cubic-bezier(.22,.82,.28,1)}
#v9LbGrid.panning #v9LbTrack{transition:none}
.v9LbCell{position:relative;min-width:0;min-height:0;overflow:hidden;border-radius:7px;background:#dce3e8;
  opacity:.52;filter:saturate(.78) brightness(.91);box-shadow:0 0 0 1px rgba(148,163,184,.48);
  transition:opacity .2s,filter .2s,box-shadow .2s,transform .2s;text-align:left}
.v9LbCell:hover{opacity:.82;filter:saturate(.94) brightness(.97);box-shadow:0 0 0 2px #38a3d1;transform:translateY(-1px)}
.v9LbCell.on{z-index:2;opacity:1;filter:none;box-shadow:0 0 0 2px var(--hi),0 10px 28px rgba(15,23,42,.20)}
.v9LbCell img{width:100%;height:100%;display:block;object-fit:cover;pointer-events:none;user-select:none}
.v9LbCell span{position:absolute;left:0;right:0;bottom:0;padding:22px 9px 7px;color:#fff;font-size:9px;
  font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:linear-gradient(transparent,rgba(15,23,42,.88));pointer-events:none}
.v9LbCell span i{display:block;margin-top:2px;color:#cbd5e1;font-size:7.5px;font-style:normal;font-weight:550}
#v9LbZoom{position:absolute;top:10px;right:10px;z-index:8;display:flex;gap:3px;padding:3px;border:1px solid rgba(255,255,255,.65);
  border-radius:7px;background:rgba(15,23,42,.66);backdrop-filter:blur(7px);box-shadow:0 5px 16px rgba(15,23,42,.18)}
#v9LbZoom button{padding:5px 8px;border-radius:5px;color:#e2e8f0;font-size:8px;font-weight:700;letter-spacing:.1em;text-transform:uppercase}
#v9LbZoom button:hover{background:rgba(255,255,255,.12);color:#fff}#v9LbZoom button.on{background:#fff;color:#075985}
#v9LbHelp{position:absolute;right:10px;bottom:10px;z-index:8;padding:5px 8px;border-radius:5px;background:rgba(15,23,42,.58);
  color:#fff;font-size:7.5px;letter-spacing:.1em;text-transform:uppercase;pointer-events:none;backdrop-filter:blur(5px)}

/* Persistent promotion entry: integrated outlined/tonal hierarchy, never an edge accent. */
#rail #v9RailAbout{width:calc(100% - 12px);margin:auto 6px 9px;padding:10px 0 8px;border:1px solid #a8d8ef;
  border-radius:9px;background:#e7f5fc;color:#075985;box-shadow:0 5px 13px rgba(15,23,42,.09)}
#rail #v9RailAbout:hover{background:#d9f0fb;color:#034e73;border-color:#67bce2}
#rail #v9RailAbout img{width:25px;height:25px;object-fit:contain}#rail #v9RailAbout span{font-size:7.5px;font-weight:750}#rail #v9RailAbout .v9AboutCredit{max-width:60px;font-size:6.25px;line-height:1.25;letter-spacing:.025em;text-transform:none;white-space:normal;color:#4b6b7c;font-weight:600}
/* The rail is the single About destination; suppress the older duplicate inside the reach panel. */
#aboutBtn{display:none!important}

/* Portrait visualisation library: locations run down the page, the three evidence stages
   remain fixed as columns, and a selected cell expands inside the same workspace. */
#v10PortraitGallery{position:fixed;inset:0 0 0 84px;z-index:176;display:none;background:#fff;color:var(--txt);overflow:hidden;--gallery-row:245px;--v10-gallery-width:calc(100% - 36px)}
#v10PortraitGallery.on{display:grid;grid-template-rows:auto minmax(0,1fr)}
.v10GalleryHead{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:22px;padding:16px 24px;border-bottom:1px solid var(--line);background:#fff}
#v10GalleryBack{padding:9px 12px;border:1px solid var(--line2);border-radius:7px;background:#fff;font-size:9px;font-weight:700;letter-spacing:.11em;text-transform:uppercase}
#v10GalleryBack:hover{border-color:#7bc6e7;color:var(--hi);background:#eef8fc}
.v10GalleryHead>div:nth-child(2){min-width:0}.v10GalleryHead>div:nth-child(2)>span{display:block;color:var(--hi);font-size:8px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.v10GalleryHead h1{font-size:23px;line-height:1.1;letter-spacing:-.02em;margin-top:3px}.v10GalleryHead p{max-width:72ch;margin-top:4px;color:var(--dim);font-size:9.5px}
.v10GalleryZoom{display:flex;gap:3px;padding:3px;border:1px solid var(--line2);border-radius:7px;background:#f8fafc}
.v10GalleryZoom button{min-width:38px;padding:6px 8px;border-radius:5px;color:var(--dim);font-size:8px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}
.v10GalleryZoom button:hover{color:var(--hi)}.v10GalleryZoom button.on{background:#fff;color:var(--hi);box-shadow:0 2px 7px rgba(15,23,42,.1)}
#v10GalleryClose{width:38px;height:38px;border:1px solid var(--line2);border-radius:50%;display:grid;place-items:center;color:var(--dim);font-size:22px;line-height:1}
#v10GalleryClose:hover{color:var(--txt);background:#f3f7fa}
#v10GalleryScroll{min-height:0;overflow:auto;overscroll-behavior:contain;padding:0 18px 34px;background:#f6f8fa;scrollbar-gutter:stable}
.v10GalleryColumns,.v10GalleryRow{display:grid;grid-template-columns:160px repeat(3,minmax(0,1fr));gap:12px}
.v10GalleryColumns,#v10GalleryGrid{width:var(--v10-gallery-width);min-width:var(--v10-gallery-width);margin-inline:auto}
.v10GalleryColumns{position:sticky;top:0;z-index:7;padding:10px 12px;background:rgba(246,248,250,.97);box-shadow:0 1px 0 var(--line);color:var(--dim);font-size:8px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
.v10GalleryColumns b{color:var(--txt2)}
#v10GalleryGrid{display:flex;flex-direction:column;gap:1px;background:var(--line)}
.v10GalleryRow{height:var(--gallery-row);min-height:var(--gallery-row);padding:12px;background:#fff;align-items:stretch;scroll-margin-top:48px}
.v10GalleryRow header{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;min-width:0;padding:8px 10px}
.v10GalleryRow header span{color:var(--dim2);font-size:8px;font-variant-numeric:tabular-nums;letter-spacing:.09em;text-transform:uppercase}
.v10GalleryRow header b{margin-top:5px;font-size:14px;line-height:1.2}.v10GalleryRow header em{margin-top:4px;color:var(--dim);font-size:9px;font-style:normal;text-transform:uppercase;letter-spacing:.1em}
.v10GalleryCell{position:relative;min-width:0;min-height:0;overflow:hidden;border-radius:9px;background:#e9eef2;outline:1px solid rgba(148,163,184,.42);outline-offset:-1px}
.v10GalleryCell img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .28s cubic-bezier(.16,.9,.24,1);user-select:none;pointer-events:none}
.v10GalleryCell span{position:absolute;inset:auto 0 0;padding:25px 10px 8px;color:#fff;background:linear-gradient(transparent,rgba(15,23,42,.84));font-size:8px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;text-align:left}
.v10GalleryCell:hover img{transform:scale(1.018)}.v10GalleryCell:hover{outline-color:#0ea5e9}
#v10PortraitGallery[data-column="0"] .v10GalleryRow.column-on .v10GalleryCell[data-stage="0"],#v10PortraitGallery[data-column="1"] .v10GalleryRow.column-on .v10GalleryCell[data-stage="1"],#v10PortraitGallery[data-column="2"] .v10GalleryRow.column-on .v10GalleryCell[data-stage="2"]{outline:3px solid var(--hi);outline-offset:-3px}
#v10GalleryFocus{display:none;position:absolute;inset:0;background:#fff;z-index:12;grid-template-rows:auto minmax(0,1fr) auto}
#v10PortraitGallery.focus #v10GalleryFocus{display:grid}#v10GalleryFocus>header{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:18px;align-items:center;padding:15px 24px;border-bottom:1px solid var(--line)}
#v10GalleryAll,#v10GalleryReach,#v10GalleryFocus footer>button{padding:8px 11px;border:1px solid var(--line2);border-radius:7px;background:#fff;color:var(--txt2);font-size:9px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
#v10GalleryReach{color:var(--hi);border-color:#7bc6e7}#v10GalleryAll:hover,#v10GalleryReach:hover,#v10GalleryFocus footer>button:hover{background:#eef8fc;color:var(--hi)}
#v10GalleryFocus h2{font-size:22px;line-height:1.08}#v10GalleryFocus p{margin-top:3px;color:var(--dim);font-size:9.5px}
#v10GalleryFocusViewport{min-height:0;overflow:auto;display:grid;place-items:center;background:#f2f5f7;padding:18px;cursor:zoom-in}
#v10GalleryFocusImg{max-width:100%;max-height:100%;display:block;object-fit:contain;transform-origin:center;transition:transform .12s ease-out;box-shadow:0 16px 40px rgba(15,23,42,.16)}
#v10GalleryFocus footer{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;gap:12px;align-items:center;padding:11px 24px;border-top:1px solid var(--line);background:#fff}
#v10GalleryFocusStage{display:flex;justify-content:center;gap:5px}#v10GalleryFocusStage button{padding:7px 10px;border-radius:6px;color:var(--dim);font-size:8px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
#v10GalleryFocusStage button.on{background:#e0f2fe;color:#075985}#v10GalleryZoomRead{min-width:42px;color:var(--dim);font-size:9px;font-weight:700;text-align:center}
#v10PortraitGallery button:focus-visible{outline:2px solid #0284c7;outline-offset:2px}

@media(min-width:1800px){.v10GalleryColumns,.v10GalleryRow{grid-template-columns:180px repeat(3,minmax(0,1fr))}.v10GalleryHead{padding-left:34px;padding-right:34px}}
@media(max-width:1050px){.v10GalleryHead{grid-template-columns:auto minmax(0,1fr) auto}.v10GalleryZoom{display:none}#v10GalleryClose{grid-column:3;grid-row:1}.v10GalleryColumns,.v10GalleryRow{grid-template-columns:repeat(3,minmax(0,1fr))}.v10GalleryColumns>span,.v10GalleryRow header{display:none}#v10GalleryFocus>header{grid-template-columns:auto 1fr}#v10GalleryReach{grid-column:1/-1;justify-self:end}}

/* Method exemplars read as a comparison table, with the stage labels stated once. */
.v9MethWorkflow{margin:24px 0 10px;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:#fff}
.v9MethWorkflowHead,.v9MethWorkflow .excard{display:grid;grid-template-columns:minmax(150px,.72fr) repeat(3,minmax(0,1fr));gap:12px;align-items:center}
.v9MethWorkflowHead{padding:10px 14px;background:#f4f7fa;border-bottom:1px solid var(--line);font-size:9px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);font-weight:700}
.v9MethWorkflow .excard{padding:14px;border:0;border-radius:0;box-shadow:none;margin:0;background:#fff}
.v9MethWorkflow .excard+.excard{border-top:1px solid var(--line)}
.v9MethWorkflow .excard:hover{background:#f7fbfd;transform:none;box-shadow:none}
.v9MethWorkflow .exh{display:flex;flex-direction:column;align-items:flex-start;gap:5px;padding:0;font-size:14px}
.v9MethWorkflow .exh b{color:var(--txt)}.v9MethWorkflow .exh span{font-size:9px;color:var(--hi);letter-spacing:.06em;text-transform:uppercase}
.v9MethWorkflow .exstrip{grid-column:2/-1;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.v9MethWorkflow .exstrip img{width:100%;aspect-ratio:1.39/1;object-fit:cover;border-radius:7px;display:block;box-shadow:0 0 0 1px rgba(148,163,184,.45)}
.v9MethAll{display:flex;align-items:center;gap:14px;justify-content:flex-end;padding:13px 14px;border-top:1px solid var(--line);background:#f8fafc}
.v9MethAll button{padding:9px 13px;border:1px solid #7bc6e7;border-radius:7px;background:#fff;color:#075985;font-size:10px;font-weight:750;letter-spacing:.08em;text-transform:uppercase}
.v9MethAll button:hover{background:#eaf6fc;border-color:#2b9dce}.v9MethAll span{font-size:9.5px;color:var(--dim)}

/* The volume page is a fixed analytical shell; only its quantity table scrolls. */
#vol.on{overflow:hidden}
#volWrap{height:100%;box-sizing:border-box;display:grid;grid-template-rows:auto auto auto minmax(250px,1fr) auto;gap:8px;padding:20px 44px 12px;overflow:hidden}
#v9VolTitle{margin:0;padding-right:55px;align-items:center}#v9VolTitle h1{font-size:27px;margin-top:3px}#v9VolTitle p{margin-top:3px;line-height:1.35}
#v9VolConfig{grid-template-columns:1fr 1fr minmax(240px,.72fr);gap:8px;margin:0}
#v9VolConfig section{min-height:0;padding:9px 12px;display:flex;align-items:center;gap:10px}#v9VolConfig h2{margin:0;min-width:92px}
#v9VolScope{margin:0}.v9ScopeHead{padding:8px 12px}.v9ReachPicker{display:none}
#v9VolScope.open .v9ReachPicker{display:grid;max-height:190px;overflow:auto}
#v9ScopeToggle{padding:6px 9px;border:1px solid var(--line2);border-radius:6px;background:#fff;color:var(--hi);font-size:9px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
#v9VolTablePane{height:auto;min-height:0}#v9VolContextBar{min-height:36px;padding:6px 12px}.volFoot{margin:0;min-height:34px}

@media(max-width:900px){
  .v9MethWorkflowHead{display:none}.v9MethWorkflow .excard{grid-template-columns:1fr}.v9MethWorkflow .exstrip{grid-column:1}.v9MethWorkflow .exh{padding-bottom:2px}
  #volWrap{padding:66px 22px 12px;overflow:auto;display:block}#v9VolConfig{grid-template-columns:1fr}.v9ReachPicker{display:grid}#v9VolTablePane{height:62vh;margin-top:10px}
}

/* V10 opening statement: the V8 visual model remains the authority. One freestanding
   narrative surface sits over the still-visible viewer; hierarchy comes from type,
   proximity and two quiet dividers rather than a stack of outlined subsections. */
#about{background:rgba(15,23,42,.34);backdrop-filter:blur(3px)}
#aboutCard[data-v10-ready="1"]{width:min(720px,calc(100% - 32px));max-width:none;height:auto;max-height:calc(100vh - 28px);padding:0;display:block;overflow:auto;overscroll-behavior:contain;border:0;border-radius:16px;background:#fff;box-shadow:0 30px 80px rgba(15,23,42,.35)}
#aboutCard[data-v10-ready="1"] .abHead{margin:0;padding:30px 36px 18px;border:0;background:#fff;gap:16px}
#aboutCard[data-v10-ready="1"] .abHead img{width:52px}
#aboutCard[data-v10-ready="1"] .abHead h2{font-size:24px;line-height:1.12}
#aboutCard[data-v10-ready="1"] .abSub{margin-top:4px;font-size:9px;letter-spacing:.22em}
.v10AboutVersion{margin-top:4px;color:var(--dim);font-size:9.5px;font-variant-numeric:tabular-nums}
.v10AboutScroll{padding:0 36px;background:#fff}
.v10AboutNarrative{width:100%}
#aboutCard[data-v10-ready="1"] .v10AboutNarrative .ab1,#aboutCard[data-v10-ready="1"] .v10AboutNarrative .ab2{margin:0;color:var(--txt2);font-size:13px;line-height:1.62}
#aboutCard[data-v10-ready="1"] .v10AboutNarrative .ab2{margin-top:12px}
.v10AboutCredit{margin-top:17px;padding-top:15px;border-top:1px solid var(--line);color:var(--txt2)}
.v10AboutCredit p{margin:0;font-size:12.5px;line-height:1.55}.v10AboutCredit p+p{margin-top:3px}.v10AboutCredit b{color:var(--txt)}
.v10AboutCredit .v10AboutAttribution{margin-top:9px;color:var(--dim2);font-size:9px;line-height:1.45}
.v10AboutAction{margin:18px 36px 27px;padding-top:17px;border-top:1px solid var(--line);background:transparent}
#aboutCard #aboutGo{background:#cbd5e1;color:#64748b}
#aboutCard[data-v10-ready="1"] #aboutGo{width:100%;min-height:46px;margin:0;padding:12px 16px;border-radius:8px;font-size:10px;letter-spacing:.14em;transition:background-color .75s cubic-bezier(.16,1,.3,1),color .75s cubic-bezier(.16,1,.3,1),box-shadow .75s cubic-bezier(.16,1,.3,1)}
#aboutCard[data-v10-ready="1"] #aboutGo:disabled{background:#cbd5e1;color:#64748b;cursor:wait}
#aboutCard[data-v10-ready="1"] #aboutGo.ready:not(:disabled){background:var(--hi);color:#fff;box-shadow:0 7px 18px rgba(2,132,199,.18)}
#aboutCard[data-v10-ready="1"] #aboutGo.ready:not(:disabled):hover{background:var(--hi2);box-shadow:0 9px 22px rgba(2,132,199,.24)}
#aboutCard[data-v10-ready="1"] a:focus-visible,#aboutCard[data-v10-ready="1"] button:focus-visible,#aboutCard[data-v10-ready="1"] input:focus-visible{outline:2px solid #0284c7;outline-offset:3px}
@media(max-width:680px){#aboutCard[data-v10-ready="1"]{width:calc(100% - 18px);max-height:calc(100vh - 18px);border-radius:12px}#aboutCard[data-v10-ready="1"] .abHead{padding:23px 22px 16px}.v10AboutScroll{padding:0 22px}.v10AboutAction{margin:17px 22px 22px}}
@media(max-height:720px){#aboutCard[data-v10-ready="1"] .abHead{padding-top:22px;padding-bottom:14px}#aboutCard[data-v10-ready="1"] .v10AboutNarrative .ab1,#aboutCard[data-v10-ready="1"] .v10AboutNarrative .ab2{font-size:12px;line-height:1.5}.v10AboutAction{margin-bottom:21px}}
@media(prefers-reduced-motion:reduce){#aboutCard[data-v10-ready="1"] #aboutGo{transition:none}}


/* ═══════════════════════════════════════════════════════════ release review fixes ══ */
.v12GateHint{display:block;max-width:48ch;margin:0 auto 9px;text-align:center;color:#64748b;
  font-size:10px;line-height:1.45;letter-spacing:.02em}

#v12Hints{position:absolute;left:18px;bottom:142px;z-index:11;display:flex;flex-direction:column;
  align-items:flex-start;gap:7px;max-width:min(330px,calc(100vw - 36px));pointer-events:none}
.v12Hint{display:flex;align-items:center;gap:9px;min-height:36px;padding:7px 7px 7px 11px;
  border:1px solid rgba(148,163,184,.62);border-radius:11px;background:rgba(255,255,255,.94);
  box-shadow:0 5px 18px rgba(15,23,42,.13);color:#334155;font-size:10px;line-height:1.35;
  pointer-events:auto;animation:v12HintIn .42s cubic-bezier(.16,.9,.24,1) both}
.v12Hint:nth-child(2){animation-delay:.08s}.v12Hint:nth-child(3){animation-delay:.16s}
.v12Hint kbd{min-width:22px;padding:3px 5px;border:1px solid #cbd5e1;border-radius:5px;
  background:#f8fafc;color:#0f172a;font:700 9px/1 Inter,"Segoe UI",sans-serif;text-align:center}
.v12Hint b{color:#0f172a;font-weight:700}.v12Hint button{display:grid;place-items:center;width:24px;height:24px;
  margin-left:2px;border:0;border-radius:6px;background:transparent;color:#64748b;font-size:16px;
  line-height:1;cursor:pointer}.v12Hint button:hover{background:#eef2f6;color:#0f172a}
.v12Hint button:focus-visible{outline:2px solid var(--hi);outline-offset:1px}
@keyframes v12HintIn{from{opacity:0;transform:translateY(8px);filter:blur(2px)}to{opacity:1;transform:none;filter:none}}

#v12GlossaryBtn{height:29px;padding:0 9px;border:1px solid var(--line2);border-radius:6px;
  background:#f8fafc;color:#475569;font:700 9px/1 Inter,"Segoe UI",sans-serif;cursor:pointer;
  white-space:nowrap}#v12GlossaryBtn:hover{border-color:var(--hi);background:var(--hiSoft);color:var(--hi)}
#v12GlossaryBtn:focus-visible{outline:2px solid var(--hi);outline-offset:1px}
#v12Glossary{position:absolute;top:calc(100% + 8px);right:0;width:min(410px,calc(100vw - 120px));
  padding:13px 14px;border:1px solid #cbd5e1;border-radius:12px;background:#fff;
  box-shadow:0 13px 34px rgba(15,23,42,.18);color:#334155}
#v12Glossary[hidden]{display:none}#v12Glossary header{display:flex;align-items:center;
  justify-content:space-between;gap:14px;margin-bottom:9px}#v12Glossary header b{font-size:11px;color:#0f172a}
#v12Glossary header span{font-size:8px;color:#64748b;letter-spacing:.1em;text-transform:uppercase}
#v12Glossary dl{display:grid;grid-template-columns:max-content 1fr;gap:7px 12px;margin:0}
#v12Glossary dt{font-size:9px;font-weight:750;color:#0f172a;white-space:nowrap}
#v12Glossary dd{margin:0;font-size:9px;line-height:1.42;color:#475569}

.v12CoveragePlan{display:block;margin-top:5px;color:#475569;font-weight:600}

/* The analytical strip owns a clean white landing zone, even when the map is zoomed. */
#bottomBar{isolation:isolate}
#bottomBar::before{content:'';position:absolute;inset:-118px 0 0;z-index:-1;pointer-events:none;
  background:linear-gradient(to bottom,rgba(255,255,255,0) 0%,rgba(255,255,255,.76) 34%,
    rgba(255,255,255,.97) 59%,#fff 76%)}

/* Profile, reach intervals and live station share one edge-to-edge physical-chainage axis. */
#stripSegs{display:block;gap:0}
#stripSegs div{position:absolute;top:0;bottom:0;height:auto;box-shadow:inset -1px 0 rgba(255,255,255,.72)}
#stripHead{top:0;bottom:7px;width:2px;height:auto;border-radius:0;background:#075985;
  transform:translateX(-1px);transition:none;pointer-events:none;z-index:5}
#v9ReachStripCursor{display:none}

/* Map scale belongs to the map. The scenario card now contains scenario choices only. */
.v10ReachScenarioGrid{grid-template-columns:repeat(2,minmax(0,1fr))}
.v10ReachScenarioGrid label:last-child{grid-column:auto}
#v12MapScaleDock{position:absolute;top:18px;left:18px;z-index:45;display:flex;align-items:center;
  gap:9px;padding:7px 8px 7px 10px;border:1px solid rgba(148,163,184,.72);border-radius:9px;
  background:rgba(255,255,255,.96);box-shadow:0 5px 16px rgba(15,23,42,.14);color:#475569}
#v12MapScaleDock label{display:flex;align-items:center;gap:8px}
#v12MapScaleDock span{font-size:8px;font-weight:700;letter-spacing:.11em;text-transform:uppercase;
  white-space:nowrap}
#v12MapScaleDock select{min-width:112px;padding:6px 24px 6px 8px;border:1px solid var(--line2);
  border-radius:6px;background:#fff;color:var(--txt);font:600 9px/1.2 Inter,"Segoe UI",sans-serif}
#v12MapScaleDock select:focus-visible{outline:2px solid var(--hi);outline-offset:2px}

/* Reach names remain annotations at every scale rather than becoming the subject. */
#map .lbl.on{font-size:14.5px;stroke-width:3.2px;letter-spacing:.018em}
#mini .mlbl,.xmlbl{font-size:13px;stroke-width:4px;letter-spacing:.018em}

@media(max-width:1050px){#v12Hints{bottom:150px}.v12Hint{font-size:9px}#v12Glossary{right:auto;left:0}}
@media(max-width:760px){#v12Hints{left:10px;bottom:126px}.v12Hint{max-width:270px}
  #v12GlossaryBtn{padding:0 7px}#v12Glossary{position:fixed;top:72px;left:12px;right:12px;
  width:auto}#v12Glossary dl{grid-template-columns:1fr;gap:2px}#v12Glossary dd{margin-bottom:5px}
  #v12MapScaleDock{top:10px;left:10px;padding:6px 7px}#v12MapScaleDock span{display:none}}
@media(prefers-reduced-motion:reduce){.v12Hint{animation:none}}

/* ═══════════════════════════════════════════════════════════════ V13 ══ */
:root{
  --v13-a:#176a67;--v13-b:#b84c38;--v13-a-alpha:.92;--v13-b-alpha:.72;
  --v13-ink:#14232b;--v13-muted:#60717a;--v13-line:#d3dde2;--v13-soft:#f4f7f8;
}

/* Comparison state is shared, but controls live inside each workspace. */
#v13CompareDock{display:none!important}
#fly.on #flyScenario{display:flex!important}
#fly.on #flyCtl{top:14px}

.v13SpatialTools{position:absolute;z-index:52;display:flex;align-items:center;gap:5px;padding:4px;
  border-radius:9px;background:rgba(255,255,255,.9);box-shadow:0 4px 16px rgba(15,23,42,.12);
  color:var(--v13-ink);backdrop-filter:blur(8px)}
.v13SpatialTools[hidden]{display:none}.v13SpatialTools>div{display:flex;align-items:center}
.v13SpatialTools button,.v13LocalActions button,.v13InlineStyleButton,#v13StylePopover button,
#v13SelectionSheet button,#v13VolTopActions button,.v13Tabs button,.v13VolToolbar button,
.v13VolToolbar select,#v9VolConfig button{min-height:30px;padding:0 9px;border:0;border-radius:6px;
  background:transparent;color:#31434d;font:750 8.5px/1 "Segoe UI Variable","Segoe UI",sans-serif;cursor:pointer}
.v13SpatialTools button:hover,.v13LocalActions button:hover,.v13InlineStyleButton:hover,
#v13VolTopActions button:hover,.v13Tabs button:hover,#v9VolConfig button:hover{background:#edf3f5;color:#075985}
.v13SpatialTools button:focus-visible,.v13LocalActions button:focus-visible,.v13InlineStyleButton:focus-visible,
#v13StylePopover :focus-visible,#v13SelectionSheet button:focus-visible,#v13VolTopActions button:focus-visible,
.v13Tabs button:focus-visible,.v13VolToolbar :focus-visible,#v9VolConfig :focus-visible,.v13ChartBar:focus-visible{
  outline:2px solid #087ea4;outline-offset:2px}
.v13SpatialTools button.on{background:#087ea4;color:#fff}.v13SpatialCount{padding:0 6px;color:var(--v13-muted);
  white-space:nowrap;font:700 8.5px/1 "Segoe UI Variable","Segoe UI",sans-serif}
#v13StageTools{top:14px;right:calc(var(--panelW) + 14px)}
#v13FlyTools{right:18px;bottom:72px}

/* A temporary style popover is the one deliberately contained control surface. */
#v13StylePopover{position:fixed;z-index:185;width:320px;padding:12px;border:1px solid #b9c8cf;
  border-radius:10px;background:#fff;box-shadow:0 12px 32px rgba(15,23,42,.18);color:var(--v13-ink)}
#v13StylePopover[hidden]{display:none}#v13StylePopover header{display:flex;align-items:center;justify-content:space-between;
  gap:12px;padding-bottom:9px;border-bottom:1px solid #e1e8eb}
#v13StylePopover header b{font-size:10px}#v13StylePopover header button{width:28px;padding:0;font-size:18px}
.v13StyleRows{display:grid;gap:10px;padding-top:10px}.v13StyleRows label{display:grid;
  grid-template-columns:minmax(90px,1fr) 32px 92px;align-items:center;gap:8px;color:#445861;font-size:9px}
.v13StyleRows input[type=color]{width:30px;height:28px;padding:2px;border:1px solid #c9d4d9;border-radius:6px;background:#fff}
.v13StyleRows input[type=range]{width:92px;accent-color:var(--slot-color)}
.v13StyleRows label[data-slot=a]{--slot-color:var(--v13-a)}.v13StyleRows label[data-slot=b]{--slot-color:var(--v13-b)}
.v13LocalActions{display:flex;justify-content:flex-end;padding-top:2px}.v13LocalActions button,.v13InlineStyleButton{color:#075985}

/* Selected-volume readout belongs to the map/scene and has no card around it. */
#v13SelectionSheet{position:absolute;left:22px;bottom:74px;z-index:54;width:min(660px,calc(100% - 44px));
  color:#12232c;pointer-events:none;font-family:"Segoe UI Variable","Segoe UI",sans-serif}
#v13SelectionSheet[hidden]{display:none}.v13ReadoutHead{margin-bottom:5px;text-transform:uppercase;letter-spacing:.14em;
  font-size:9px;font-weight:850}.v13ReadoutValues{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;
  font-size:13px;font-weight:750}.v13ReadoutValues b{font-size:20px;font-variant-numeric:tabular-nums}
.v13ReadoutValues .a b{color:var(--v13-a)}.v13ReadoutValues .b b{color:var(--v13-b)}
.v13ReadoutVersus{color:#50636c;font-size:9px;text-transform:uppercase;letter-spacing:.1em}
.v13ReadoutDelta{margin-top:4px;font-size:12px;font-weight:750}.v13ReadoutDelta b{font-size:17px}
.v13ReadoutDelta small{margin-left:8px;color:#50636c;font-weight:650}
.v13ReadoutHead,.v13ReadoutValues,.v13ReadoutDelta{-webkit-text-stroke:.15px rgba(255,255,255,.9);
  text-shadow:-2px -2px 0 rgba(255,255,255,.96),2px -2px 0 rgba(255,255,255,.96),
  -2px 2px 0 rgba(255,255,255,.96),2px 2px 0 rgba(255,255,255,.96),0 2px 7px rgba(255,255,255,.98)}
.v13SelectionActions{display:flex;gap:5px;margin-top:7px;pointer-events:auto}.v13SelectionActions button{background:rgba(255,255,255,.94);
  box-shadow:0 2px 10px rgba(15,23,42,.13)}

#map .base.v13-selected{opacity:1!important;stroke:#087ea4!important;stroke-width:6.5!important;filter:drop-shadow(0 2px 2px rgba(15,23,42,.28))}
#map .case.v13-selected{opacity:1!important;stroke:#fff!important;stroke-width:11!important}
#v13MainBox,#v13FlyBox{fill:rgba(8,126,164,.11);stroke:#087ea4;stroke-width:1.8;stroke-dasharray:6 4;pointer-events:none}
#v13FlySelected path{fill:none;stroke:#087ea4;stroke-width:9;stroke-linecap:round;stroke-linejoin:round;paint-order:stroke;filter:drop-shadow(0 1px 1px #fff)}
#fmScenarioA{stroke:var(--v13-a)!important;opacity:var(--v13-a-alpha)!important}
#fmScenarioB{stroke:var(--v13-b)!important;opacity:var(--v13-b-alpha)!important}
.v9AmPrimary{stroke:var(--v13-a)!important;opacity:var(--v13-a-alpha)!important}
.v9AmCompare{stroke:var(--v13-b)!important;opacity:var(--v13-b-alpha)!important}

/* Reach quantities are an extension of the HUD, separated by one quiet divider. */
#v13ReachCompare{margin-top:10px;padding-top:11px;border-top:1px solid var(--v13-line)}
#v13ReachCompare header{display:flex;align-items:flex-start;justify-content:space-between;gap:9px;margin-bottom:8px}
#v13ReachCompare header div{min-width:0}#v13ReachCompare header b{display:block;font-size:10px}
#v13ReachCompare header span{display:block;margin-top:2px;color:var(--v13-muted);font-size:7.5px;line-height:1.3}
#v13ReachCompare header>span{max-width:44%;text-align:right}
.v13ReachGrid{display:grid;grid-template-columns:.8fr repeat(3,minmax(62px,1fr));font-variant-numeric:tabular-nums}
.v13ReachGrid>*{min-width:0;padding:6px 5px;border-bottom:1px solid #e4eaed;font-size:7.8px;overflow-wrap:anywhere}
.v13ReachGrid .head{font-weight:800;color:#435761;background:#f5f8f9}.v13ReachGrid .delta{font-weight:800;color:#0f5f78}
.v13ReachGrid .na{color:#82919a;font-style:italic}#v13ReachCompare>button{margin-top:8px;min-height:30px;padding:0;
  border:0;background:transparent;color:#075985;font:750 8.5px/1 "Segoe UI Variable","Segoe UI",sans-serif;cursor:pointer}

/* Volumetrics is a fixed analytical shell. Only the data viewport scrolls. */
#vol.on{overflow:hidden}#volWrap{box-sizing:border-box;display:flex!important;flex-direction:column;gap:0;
  width:100%;max-width:none;height:100%;padding:14px 24px 12px;overflow:hidden!important;color:var(--v13-ink)}
body.v13-vol-open #homeBtn{display:none!important}
#v9VolTitle{display:flex;flex:0 0 auto;align-items:center;justify-content:space-between;gap:24px;
  min-height:64px;margin:0;padding:0 48px 9px 0;border-bottom:1px solid #dce4e8}
#v9VolTitle .kicker{font-size:7.5px}#v9VolTitle h1{margin:2px 0 3px;font-size:23px;line-height:1.05}
#v13VolComparisonLine{display:flex;align-items:baseline;gap:5px;flex-wrap:wrap;margin:0;color:#53666f;font-size:10px;line-height:1.35}
#v13VolComparisonLine b{color:var(--v13-ink)}#v13VolComparisonLine span{color:#829199}
#v13VolComparisonLine strong{margin-left:5px;color:#075985;font-size:10px}
#v13VolTopActions{display:flex;align-items:center;gap:4px;white-space:nowrap}
#v13VolTopActions button{min-height:34px;color:#075985}#v13VolTopActions button[aria-expanded=true],
#v13VolTopActions button[aria-pressed=true]{background:#e8f2f5}

#v13VolSetup{flex:0 0 auto;max-height:39vh;overflow:auto;padding:10px 0 9px;border-bottom:1px solid #dce4e8;background:#f8fafb}
#v13VolSetup[hidden]{display:none!important}#v9VolConfig{display:grid!important;grid-template-columns:1.45fr 1.35fr .75fr!important;
  gap:16px!important;width:100%;min-width:0!important;margin:0!important;padding:0 12px 9px}
.v13ConfigGroup{display:flex;align-items:center;gap:9px;min-width:0}.v13ConfigGroup>span{flex:0 0 auto;color:#71828a;
  font-size:7.5px;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.v13ConfigGroup label{display:flex!important;
  align-items:center!important;gap:6px!important;min-width:0;color:#435760!important;font-size:8px!important}
.v13ConfigGroup select{height:32px;min-width:128px!important;padding:0 27px 0 8px!important;border:1px solid #c8d4da!important;
  border-radius:6px!important;background:#fff!important;font-size:9px!important}.v13ConfigStyles label{flex:1}.v13ConfigStyles input[type=color]{
  width:28px;height:28px;padding:2px;border:1px solid #c8d4da;border-radius:5px;background:#fff}.v13ConfigStyles input[type=range]{
  min-width:60px;width:100%;accent-color:#087ea4}.v13Costing{justify-content:flex-end}.v13Costing small{color:#71828a;font-size:8px}
#v9RatesPanel{display:none;margin:0 12px 9px!important;padding:9px 0!important;border:0!important;border-top:1px solid #e0e7ea!important;
  border-bottom:1px solid #e0e7ea!important;border-radius:0!important;background:transparent!important}#v9RatesPanel.on{display:block}
#v9VolScope{margin:0!important;border:0!important;border-radius:0!important;background:transparent!important;overflow:visible!important}
.v9ScopeHead{padding:7px 12px!important;border:0!important;background:transparent!important}.v9ReachPicker{display:none!important;
  grid-template-columns:repeat(auto-fit,minmax(360px,1fr))!important;gap:1px!important;max-height:170px;overflow:auto;background:#dce4e8!important}
#v9VolScope.open .v9ReachPicker{display:grid!important}.v9ReachPicker section{padding:10px 12px!important}

.v13Tabs{position:relative;display:flex;flex:0 0 auto;align-items:stretch;gap:14px;min-height:43px;margin:0;
  padding-right:8px;border-bottom:1px solid #dce4e8}.v13TabSet{display:flex;align-items:stretch;gap:18px;min-width:max-content}
.v13Tabs button{position:relative;height:42px!important;min-height:42px!important;padding:0 2px;border-radius:0;background:transparent;
  color:#60717a;font-size:9px}.v13Tabs #volX.v13BackToMap{position:relative!important;inset:auto!important;z-index:auto!important;
  display:block!important;flex:0 0 auto;width:auto!important;height:42px!important;margin:0!important;padding:0 15px 0 2px!important;
  border:0!important;border-right:1px solid #dce4e8!important;border-radius:0!important;box-shadow:none!important;background:transparent!important;
  color:#1f485b;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.v13Tabs button[aria-selected=true]{color:#075985}
.v13Tabs button[aria-selected=true]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:#087ea4}
#v9VolContextBar{display:flex;align-items:center;margin-left:auto;color:#6d7f88;font-size:8.5px;font-variant-numeric:tabular-nums}
#v9VolTablePane{display:flex!important;flex:1 1 auto!important;min-height:0!important;height:auto!important;margin:0!important;overflow:hidden}
#volTableWrap{flex:1;min-width:0;min-height:0;overflow:auto!important;margin:0!important;padding:0!important;
  border:0!important;border-radius:0!important;background:#fff}

#volTable{width:100%;min-width:1120px!important;border-collapse:collapse;background:#fff;font-size:9.5px}
#volTable .v13ReachCol{width:170px}#volTable th,#volTable td{padding:8px 9px!important;border-bottom:1px solid #e2e8eb!important;
  vertical-align:top!important;text-align:right;font-variant-numeric:tabular-nums}
#volTable thead th{position:sticky;top:0;z-index:4;background:#f6f8f9!important;color:#62747d;font-size:7.8px;
  letter-spacing:.09em;text-transform:uppercase;white-space:nowrap}#volTable tbody tr{cursor:pointer}
#volTable tbody tr:hover>*{background:#f3f8fa!important}#volTable tbody tr:focus-visible{outline:2px solid #087ea4;outline-offset:-2px}
#volTable th:first-child,#volTable td:first-child{position:sticky;left:0;z-index:3;min-width:170px;background:#fff;text-align:left}
#volTable th:nth-child(2),#volTable td:nth-child(2){position:static!important;left:auto!important;z-index:auto!important;background:inherit!important}
#volTable thead th:first-child{z-index:6;background:#f6f8f9!important}#volTable tbody th small{display:block;margin-bottom:3px;
  color:#839199;font-size:7px;letter-spacing:.12em;text-transform:uppercase}
#volTable tfoot{position:static}#volTable tfoot th,#volTable tfoot td{position:static!important;background:#edf3f5!important;
  border-top:2px solid #83969f!important;font-weight:800}#volTable tfoot th:first-child{position:sticky!important;left:0;z-index:3;
  background:#edf3f5!important}.v13TotalLabel small{display:block;margin-top:4px;
  color:#61737c;font-weight:600;line-height:1.3}
.v13Metric{display:grid;gap:3px;min-width:126px;text-align:left}.v13Metric>span{display:grid;grid-template-columns:6px 1fr auto;
  align-items:center;gap:4px;color:#62747d;font-size:7.5px}.v13Metric>span i{width:5px;height:5px;border-radius:50%;background:currentColor}
.v13Metric>span b{color:#263b45;font-size:8.5px;white-space:nowrap}.v13Metric .a{color:var(--v13-a)}.v13Metric .b{color:var(--v13-b)}
.v13Metric .d{display:flex;justify-content:space-between;gap:6px;padding-top:3px;border-top:1px solid #e5ebee;color:#34505d;font-size:7.5px}
.v13Metric .d b{color:#075985}.v13Metric .d small{display:block;color:#7a8991;font-size:6.8px}
.v13MetricTotal{min-width:112px}.v13MetricTotal>span{grid-template-columns:6px minmax(42px,1fr);gap:3px}.v13MetricTotal>span b{
  grid-column:1/-1;padding-left:9px}.v13MetricTotal .d{display:grid;grid-template-columns:1fr;justify-content:start}.v13MetricTotal .d b{white-space:normal}

.v13ChartIntro{display:flex;align-items:baseline;justify-content:space-between;gap:16px;padding:15px 12px 11px;border-bottom:1px solid #e1e7ea}
.v13ChartIntro b{font-size:12px}.v13ChartIntro span{color:#6b7d86;font-size:9px}.v13ChartGrid{display:grid;
  grid-template-columns:repeat(2,minmax(300px,1fr));gap:0 24px;padding:0 12px 18px}
.v13MetricChart{padding:17px 0 18px;border-bottom:1px solid #e1e7ea}.v13MetricChart header{display:flex;align-items:baseline;
  justify-content:space-between;gap:12px;margin-bottom:10px}.v13MetricChart header b{font-size:10px}.v13MetricChart header small{margin-left:5px;
  color:#7d8c93;font-size:7.5px}.v13MetricChart header strong{color:#075985;font-size:8.5px}.v13CompareBars{display:grid;gap:8px}
.v13CompareBars>div,.v13OverviewBar{display:grid;grid-template-columns:minmax(82px,130px) minmax(120px,1fr) 105px;align-items:center;
  gap:8px}.v13CompareBars span,.v13OverviewBar>span{overflow:hidden;color:#4f626b;font-size:8px;font-weight:700;text-overflow:ellipsis;white-space:nowrap}
.v13CompareBars>div>b,.v13OverviewBar>b{text-align:right;color:#233943;font-size:8.5px;font-variant-numeric:tabular-nums}
.v13ChartBar{position:relative;display:block;width:100%;height:15px;padding:0;border:0;border-radius:3px;background:#e8eef1;overflow:hidden;cursor:help}
.v13ChartBar i{position:absolute;inset:0 auto 0 0;width:var(--value);background:var(--bar,#718892)}.v13ChartBar.a i{background:var(--v13-a)}
.v13ChartBar.b i{background:var(--v13-b)}.v13ChartTip{position:fixed;z-index:260;display:grid;gap:4px;width:max-content;max-width:280px;
  padding:10px 11px;border:1px solid #aebdc5;border-radius:8px;background:#fff;box-shadow:0 10px 28px rgba(15,23,42,.2);
  color:#1e333d;pointer-events:none}.v13ChartTip[hidden]{display:none}.v13ChartTip b{font-size:9px}.v13ChartTip strong{font-size:14px}
.v13ChartTip span{color:#647680;font-size:8px;line-height:1.4}

.v13VolToolbar{position:sticky;top:0;z-index:7;display:flex;align-items:center;justify-content:space-between;gap:12px;
  min-height:44px;padding:6px 12px;border-bottom:1px solid #dce4e8;background:#f7f9fa}.v13VolToolbar>div{display:flex;align-items:center;gap:10px}
.v13VolToolbar label{display:flex;align-items:center;gap:6px;color:#687a83;font-size:8px}.v13VolToolbar select{height:30px;border:1px solid #c9d5da;
  background:#fff}.v13VolToolbar>span{color:#75868e;font-size:8px}.v13ScopeSwitch{display:flex;align-items:center;gap:2px;padding:2px;
  border-radius:6px;background:#e8eef1}.v13ScopeSwitch button{height:28px!important;min-height:28px!important;padding:0 9px!important;border-radius:4px!important;
  color:#5f727c}.v13ScopeSwitch button[aria-pressed=true]{background:#fff;color:#075985;box-shadow:0 1px 4px rgba(15,23,42,.12)}
.v13Overview{padding:0 12px 24px}.v13AnalysisIntro{display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  padding:15px 0;color:#657780}.v13AnalysisIntro b{color:#213943;font-size:12px}.v13AnalysisIntro span{font-size:8.5px}
.v13AnalysisSection{padding:18px 0 20px;border-top:1px solid #dce4e8}.v13AnalysisSection>header{display:flex;align-items:flex-start;
  justify-content:space-between;gap:24px;margin-bottom:12px}.v13AnalysisSection h2{margin:0 0 4px;font-size:12px}.v13AnalysisSection p{margin:0;
  color:#6d7e86;font-size:8.5px;line-height:1.45}.v13ChartLegend{display:flex;align-items:center;justify-content:flex-end;gap:6px 12px;flex-wrap:wrap}
.v13ChartLegend span{display:flex;align-items:center;gap:5px;color:#5d7079;font-size:7.5px;white-space:nowrap}.v13ChartLegend i{width:8px;
  height:8px;border-radius:2px;background:var(--legend)}.v13SvgChart{display:block;width:100%;max-height:360px;overflow:visible}.v13SvgChart .track{fill:#e9eef1}
.v13SvgChart .label{fill:#435761;font:700 12px "Segoe UI Variable","Segoe UI",sans-serif}.v13SvgChart .value{fill:#233943;
  font:700 11px "Segoe UI Variable","Segoe UI",sans-serif}.v13SvgChart .axis{fill:#6b7d86;font:650 10px "Segoe UI Variable","Segoe UI",sans-serif}
.v13SvgChart .grid{stroke:#dce4e8;stroke-width:1}.v13SvgChart .zero{stroke:#71848d;stroke-width:1.5}.v13SvgChart [data-tip-title]{cursor:help;outline:none}
.v13SvgChart [data-tip-title]:focus{stroke:#0b3344;stroke-width:3}.v13OverviewTableWrap{max-width:100%;overflow-x:auto;overflow-y:visible}
.v13OverviewTable{width:100%;
  min-width:1260px;border-collapse:collapse}.v13OverviewTable th,.v13OverviewTable td{padding:9px 8px;border-bottom:1px solid #e1e7ea;
  text-align:right;font-size:8px;vertical-align:top;font-variant-numeric:tabular-nums}.v13OverviewTable th{position:static;
  background:#f7f9fa;color:#6c7d85;font-size:7.5px;text-transform:uppercase;letter-spacing:.08em}.v13OverviewTable th:first-child,
.v13OverviewTable td:first-child{text-align:left}.v13OverviewTable td small{display:block;margin-top:3px;color:#87949a;font-size:6.8px}
.v13Status{display:inline-flex;margin-top:4px;padding:3px 6px;border-radius:5px;background:#eef3f5;color:#536771;font-size:6.5px;font-weight:750}
.v13Status.partial{background:#fff2d8;color:#845616}.v13OverviewEmpty{padding:42px 16px;text-align:center;color:var(--v13-muted);line-height:1.7}

.v13RateEditor{padding:16px 0 18px}.v13RateEditor>header{display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  margin-bottom:11px}.v13RateEditor>header div{display:grid;gap:2px}.v13RateEditor>header b{font-size:12px}.v13RateEditor>header span,
.v13RateEditor>header strong{color:#687a83;font-size:8px}.v13RateGrid{display:grid;grid-template-columns:repeat(6,minmax(110px,1fr));gap:10px}
.v13RateGrid label{display:grid;grid-template-columns:1fr auto;gap:3px 6px;align-items:baseline}.v13RateGrid label span{font-size:8.5px;font-weight:750}
.v13RateGrid label small{color:#778890;font-size:7px}.v13RateGrid input{grid-column:1/-1;width:100%;height:34px;padding:0 8px;border:1px solid #c7d3d9;
  border-radius:5px;background:#fff;color:#213943;font-variant-numeric:tabular-nums}.v13RateEditor>p{margin:9px 0 0;color:#73848c;font-size:7.5px}
.v13RateEditor.compact{padding:0}.v13RateEditor.compact>header,.v13RateEditor.compact>p{display:none}.v13CostTable td:last-child b{font-size:10px}

.volFoot{display:flex;flex:0 0 auto;align-items:center;gap:18px;min-height:39px!important;margin:0!important;padding-top:7px!important}
.volFoot button{min-height:31px;padding:0 10px;border:1px solid #c7d3d9;border-radius:6px;background:#fff;color:#075985;
  font-size:8px;font-weight:750;letter-spacing:.08em;text-transform:uppercase}.volFoot span{color:#809097;font-size:8px}
.v13DataFocus #v9VolTitle,.v13DataFocus #v13VolSetup,.v13DataFocus .volFoot{display:none!important}

.v13Dimensions{pointer-events:none}.v13Dimensions line,.v13Dimensions path{stroke:currentColor;stroke-width:1.3;vector-effect:non-scaling-stroke}
.v13Dimensions text{fill:currentColor;font:700 10px/1 "Segoe UI Variable","Segoe UI",sans-serif;paint-order:stroke;stroke:#fff;stroke-width:3px;
  stroke-linejoin:round}.v13MetricMeta{display:block;margin-top:6px;color:#657780;font-size:8px;line-height:1.4}

@media(max-width:1180px){
  #v13StageTools{right:66px}.v13ChartGrid{gap:0 16px}.v13CompareBars>div{grid-template-columns:82px minmax(100px,1fr) 92px}
  #v9VolConfig{grid-template-columns:1fr 1fr!important}.v13Costing{grid-column:1/-1;justify-content:flex-start}
  .v13RateGrid{grid-template-columns:repeat(3,minmax(120px,1fr))}
}
@media(max-width:900px){
  #volWrap{padding:10px 12px 9px;overflow:hidden!important}#v9VolTitle{align-items:flex-start;flex-direction:column;gap:6px;
    min-height:0;padding:0 48px 9px 0}#v9VolTitle h1{font-size:20px}#v13VolTopActions{position:absolute;top:10px;right:55px}
  #v13VolTopActions button:first-child{display:none}#v9VolConfig{grid-template-columns:1fr!important}.v13ConfigGroup{flex-wrap:wrap}
  .v9ReachPicker{grid-template-columns:1fr!important}.v13Tabs{gap:10px;overflow-x:auto}.v13TabSet{gap:12px}.v13Tabs button{font-size:8px}#v9VolContextBar{display:none}
  .v13ChartGrid{grid-template-columns:1fr}.v13ChartIntro{align-items:flex-start;flex-direction:column;gap:3px}
  .v13AnalysisSection>header,.v13AnalysisIntro{align-items:flex-start;flex-direction:column;gap:8px}.v13ChartLegend{justify-content:flex-start}
  .v13RateGrid{grid-template-columns:repeat(2,minmax(120px,1fr))}.v13SvgChart{min-width:760px}.v13AnalysisSection{overflow-x:auto}
  #v13StageTools{top:10px;right:62px;max-width:210px;flex-wrap:wrap;justify-content:flex-end}.v13SpatialCount{order:3}
  #v13SelectionSheet{left:14px;bottom:68px;width:calc(100% - 28px)}.v13ReadoutValues b{font-size:17px}
}
@media(max-width:620px){
  .v13SpatialTools{gap:2px}.v13SpatialTools button{padding:0 6px}.v13SpatialCount{display:none}#v13FlyTools{bottom:64px}
  .v13ReadoutValues{display:grid;grid-template-columns:1fr}.v13ReadoutVersus{display:none}.v13ReadoutDelta small{display:block;margin:3px 0 0}
  .v13CompareBars>div,.v13OverviewBar{grid-template-columns:72px minmax(90px,1fr) 84px}.v13OverviewBar{grid-template-columns:90px minmax(110px,1fr) 92px}
  #v13VolComparisonLine{font-size:8.5px}#v13VolComparisonLine strong{width:100%;margin-left:0}.volFoot span{display:none}
  .v13RateGrid{grid-template-columns:1fr}.v13VolToolbar{align-items:flex-start;flex-direction:column}.v13ScopeSwitch{width:100%}.v13ScopeSwitch button{flex:1}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}