/* POV Field Guide — page shell (screen + print fallback). Field Kit look.
   tokens.css (fonts, palette, --cds-* diagram map) is linked first by index.html. Zero content here. */
:root{
  --amber-bg:#FBF2DE; --amber-line:#D7B26A; --amber-ink:#6E4E10;
  --top-h:64px; --rail-w:260px; --col:720px; --toc-w:220px;
  --radius:10px; --focus:0 0 0 2px var(--paper),0 0 0 4px var(--navy);
  --ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:calc(var(--top-h) + 16px)}
html,body{margin:0;padding:0;background:var(--paper);color:var(--ink)}
body{font:400 15.5px/1.55 var(--sans);font-feature-settings:"cv11","ss01";-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;min-height:100vh;overflow-x:hidden}
[hidden]{display:none !important}
img,svg{max-width:100%}
button{font:inherit;color:inherit}
a{color:inherit}
:focus{outline:none}
:focus-visible{outline:none;box-shadow:var(--focus);border-radius:6px}
[tabindex="-1"]:focus,[tabindex="-1"]:focus-visible{box-shadow:none}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:12px;top:-60px;z-index:100;background:var(--navy);color:#fff;padding:8px 14px;border-radius:999px;font:600 13px/1 var(--sans);text-decoration:none}
.skip:focus{top:12px}
.kick{font:600 11px/1.2 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--sec)}
.noscript{max-width:560px;margin:80px auto;padding:0 16px;font:500 16px/1.5 var(--sans)}

/* ── chips + buttons ─────────────────────────────────────────────────────── */
.chip{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 13px;border-radius:999px;border:1px solid var(--hair);background:var(--card);
  font:600 13px/1 var(--sans);color:var(--ink);white-space:nowrap;text-decoration:none;cursor:pointer;flex:none}
.chip svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex:none}
.chip:hover{border-color:var(--ink)}
.chip.ver{cursor:default;background:transparent;font:600 11px/1 var(--mono);letter-spacing:.06em;color:var(--sec);height:26px;padding:0 10px;gap:6px}
.chip.ver:hover{border-color:var(--hair)}
.chip.ver b{font-weight:700;color:var(--ink)}
/* download: a charcoal chip on paper (header, rail); the POV lime chip only on the charcoal opener — one lime element per view */
.chip.dl{background:var(--navy);border-color:var(--navy);color:var(--cream)}
.chip.dl:hover{background:var(--navy-hi);border-color:var(--navy-hi)}
.chip.dl .sz{font:600 11px/1 var(--mono);letter-spacing:.04em;color:var(--cream2)}
.ch-head .chip.dl{background:var(--orange);border-color:var(--orange);color:var(--navy)}
.ch-head .chip.dl:hover{background:var(--orange);border-color:var(--cream)}
.ch-head .chip.dl .sz{color:var(--navy-ink)}
.chip.dl[aria-disabled="true"]{background:var(--well);border-color:var(--hair);color:var(--mut);cursor:not-allowed}
.chip.dl[aria-busy="true"]{cursor:progress;opacity:.75}
/* Field Kit card (header): outlined charcoal on paper, secondary to the filled whole-guide chip beside it (lime never as text on light) */
.top .chip.dl-card{background:transparent;border-color:var(--navy);color:var(--navy);margin-right:-6px}
.top .chip.dl-card:hover{background:var(--well);border-color:var(--navy)}
.top .chip.dl-card .sz{color:var(--sec)}
.top .chip.dl-card[aria-disabled="true"]{background:var(--well);border-color:var(--hair);color:var(--mut)}
/* a PDF link inside a chapter ([Field Kit card (PDF)](#pdf-card)) — the same charcoal chip; .pdfref is the no-JS fallback */
.ch-body .chip.dl-inline{margin:2px 0;vertical-align:middle}
.ch-body .pdfref{font-weight:600}
.btn{display:inline-flex;align-items:center;justify-content:center;height:42px;padding:0 20px;border-radius:999px;border:1.5px solid var(--navy);background:var(--navy);color:var(--cream);
  font:650 14.5px/1 var(--sans);text-decoration:none;cursor:pointer}
.btn:hover{background:var(--navy-hi)}
.icon-btn{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;border:1px solid var(--hair);background:var(--card);cursor:pointer;padding:0}
.icon-btn svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}

/* ── top bar ─────────────────────────────────────────────────────────────── */
.top{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:14px;height:var(--top-h);padding:0 24px;
  background:rgba(251,248,241,.94);-webkit-backdrop-filter:saturate(1.2) blur(8px);backdrop-filter:saturate(1.2) blur(8px);border-bottom:1.5px solid var(--navy)}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none;flex:none;border-radius:6px}
.brand img{height:19px;width:auto;display:block}
.brand-kick{display:inline-flex;align-items:center;gap:7px;padding-left:12px;border-left:1.5px solid var(--navy);color:var(--navy);white-space:nowrap}
.brand-kick::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--lime);box-shadow:0 0 0 1.5px var(--navy)}   /* the POV lime, as a small brand mark */
.sp{flex:1 1 auto}
.rail-btn{display:none}

.search{position:relative;flex:0 1 340px;min-width:200px}
.search-ic{position:absolute;left:12px;top:50%;width:17px;height:17px;margin-top:-8.5px;fill:none;stroke:var(--sec);stroke-width:1.7;stroke-linecap:round;pointer-events:none}
.search input{width:100%;height:36px;padding:0 34px 0 36px;border-radius:999px;border:1px solid var(--hair);background:var(--card);font:500 14px/1 var(--sans);color:var(--ink);-webkit-appearance:none;appearance:none}
.search input::placeholder{color:var(--mut)}
.search input::-webkit-search-cancel-button{-webkit-appearance:none;appearance:none}
.search input:focus{border-color:var(--navy);box-shadow:0 0 0 3px rgba(20,23,26,.10)}
.search-key{position:absolute;right:10px;top:50%;transform:translateY(-50%);font:600 11px/1 var(--mono);color:var(--mut);border:1px solid var(--hair);border-radius:5px;padding:3px 6px;background:var(--paper);pointer-events:none}
.search input:focus ~ .search-key{display:none}

.results{position:absolute;right:0;top:calc(100% + 8px);width:min(560px,calc(100vw - 32px));max-height:min(70vh,640px);overflow:auto;overscroll-behavior:contain;
  background:var(--card);border:1px solid var(--hair);border-radius:12px;box-shadow:0 18px 50px -18px rgba(16,18,20,.28),0 2px 6px rgba(16,18,20,.06);padding:6px}
.results .r-head{display:flex;justify-content:space-between;gap:10px;padding:8px 10px 6px}
.results .r-head .kick{font-size:10.5px}
.res{display:block;padding:10px 12px;border-radius:8px;text-decoration:none;cursor:pointer}
.res + .res{border-top:1px solid var(--hair2)}
.res[aria-selected="true"],.res:hover{background:var(--well);border-top-color:transparent}
.res[aria-selected="true"] + .res,.res:hover + .res{border-top-color:transparent}
.res .r-ch{display:flex;align-items:center;gap:7px;font:600 10.5px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
.res .r-ch::before{content:"";flex:none;width:8px;height:8px;border-radius:2px;background:var(--ac-m)}
.res .r-h{display:block;font:650 14.5px/1.3 var(--sans);color:var(--ink);margin-top:3px}
.res .r-s{display:block;font:400 13px/1.45 var(--sans);color:var(--ink2);margin-top:3px;overflow-wrap:anywhere}
.res mark,.ch-body mark.hit{background:var(--orange-t);color:var(--ink);box-shadow:inset 0 -2px 0 var(--orange-d);border-radius:3px;padding:0 2px}
.results .r-empty{padding:16px 12px;font:500 13.5px/1.45 var(--sans);color:var(--sec)}
.results .r-empty + .r-ask{border-top:0;margin-top:0}
/* ASK FRIDAY (18 Oct 2026): under an empty / weak search — charcoal button, Friday's lime mark, the privacy line under it */
.r-ask{position:sticky;bottom:-6px;margin:6px -6px -6px;padding:10px 12px 10px;border-top:1px solid var(--hair);background:var(--card);border-radius:0 0 12px 12px}
.r-askb{display:flex;align-items:center;gap:12px;width:100%;min-height:52px;padding:10px 14px;border-radius:10px;border:1.5px solid var(--navy);
  background:var(--navy);color:var(--cream);text-align:left;cursor:pointer;font:inherit;transition:background .15s,transform .15s}
.r-askb:hover{background:var(--navy-hi)}
.r-askb:active{transform:translateY(1px)}
.r-askb:focus-visible{outline:2px solid var(--orange-d);outline-offset:2px}
.r-ask-ic{flex:none;display:inline-grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--lime);color:var(--lime-ink)}
.r-ask-ic svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.r-ask-tx{display:flex;flex-direction:column;gap:2px;min-width:0}
.r-ask-tx b{font:700 14.5px/1.25 var(--sans)}
.r-ask-q{font:400 13px/1.35 var(--sans);color:var(--cream2);overflow-wrap:anywhere}
.r-ask-note{margin:8px 4px 2px;font:400 12px/1.45 var(--sans);color:var(--sec)}
/* Friday's panel on this page (friday.css is pov.sg's): the guide's global focus ring is a box-shadow — keep it off the
   panel, whose own focus styles are outlines (the composer box shows focus with its border) */
#friday-panel :focus-visible{box-shadow:none}

.av{flex:none;display:inline-grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--navy);color:var(--cream);
  font:800 12px/1 var(--display);letter-spacing:.02em;overflow:hidden;border:1.5px solid var(--navy);user-select:none}
.av img{width:100%;height:100%;object-fit:cover;display:block}

/* ── layout ──────────────────────────────────────────────────────────────── */
.layout{display:grid;grid-template-columns:var(--rail-w) minmax(0,1fr);gap:0 48px;max-width:1440px;margin:0 auto;padding:0 24px}
@media (min-width:1200px){.layout{grid-template-columns:var(--rail-w) minmax(0,var(--col)) var(--toc-w);justify-content:space-between}}
body[data-state="gate"] .layout,body[data-state="error"] .layout,body[data-state="loading"] .layout{grid-template-columns:minmax(0,1fr)}
body:not([data-state="ready"]) .rail,body:not([data-state="ready"]) .toc{display:none}

/* rail */
.rail{position:sticky;top:var(--top-h);align-self:start;height:calc(100vh - var(--top-h));display:flex;flex-direction:column;padding:22px 0 18px;overflow:hidden}
.rail-head{display:flex;align-items:center;justify-content:space-between;padding:0 10px 10px;border-bottom:1px solid var(--hair)}
.rail-close{display:none}
.rail-list{list-style:none;margin:0;padding:8px 0;overflow:auto;flex:1 1 auto;overscroll-behavior:contain;scrollbar-width:thin}
.rail-list li{position:relative}
.ri{position:relative;display:grid;grid-template-columns:34px minmax(0,1fr) auto;align-items:baseline;gap:6px;padding:8px 10px;border-radius:8px;text-decoration:none;color:var(--ink)}
.ri .n{display:inline-flex;align-items:center;gap:7px;font:600 11px/1 var(--mono);letter-spacing:.06em;color:var(--mut)}
.ri .n::before{content:"";flex:none;width:8px;height:8px;border-radius:2.5px;background:var(--ac-m);transition:transform .2s var(--ease)}
.ri:hover .n::before{transform:scale(1.3) rotate(45deg)}
.ri .t{font:550 14px/1.3 var(--sans);overflow-wrap:anywhere}
.ri .w{font:500 11px/1 var(--mono);color:var(--mut);white-space:nowrap}
.ri:hover{background:var(--well)}
.ri[aria-current="page"]{background:var(--ac-t);color:var(--ink)}
.ri[aria-current="page"]::after{content:"";position:absolute;left:0;top:7px;bottom:7px;width:3px;border-radius:2px;background:var(--ac-d)}
.ri[aria-current="page"] .n,.ri[aria-current="page"] .w{color:var(--ac-d)}
.ri[aria-current="page"] .t{font-weight:700}
.rail-list li.start{margin-bottom:6px;padding-bottom:6px;border-bottom:1px solid var(--hair2)}
/* groups (regroup, 21 Oct 2026): a small mono label per group, same type as "Contents"; rows inside are unchanged */
.rail-list ol.g-list{list-style:none;margin:0;padding:0}
.rail-list .g-h{display:block;padding:14px 10px 5px;font-size:10.5px;color:var(--mut)}
.rail-list li.grp:first-child .g-h{padding-top:4px}
.rail-list.grouped li.start{margin-bottom:0;padding-bottom:0;border-bottom:0}
.rail-foot{display:grid;gap:10px;padding:14px 10px 0;border-top:1px solid var(--hair)}
.rail-foot .kick{font-size:10.5px;color:var(--mut);text-transform:none;letter-spacing:.04em}
.rail-note{margin:0;font:500 12px/1.4 var(--sans);color:var(--mut)}
.dl-all-rail{display:none;justify-self:start}

/* main column */
main{min-width:0;padding:36px 0 96px}
main:focus{box-shadow:none}

.loading{display:grid;gap:14px;max-width:var(--col);padding-top:10px}
.sk{height:14px;border-radius:7px;background:linear-gradient(90deg,var(--well),var(--hair),var(--well));background-size:200% 100%;animation:sk 1.4s ease-in-out infinite}
.sk-t{height:40px;width:60%;margin:6px 0 10px}
.sk-s{width:40%}
@keyframes sk{0%{background-position:100% 0}100%{background-position:-100% 0}}
@media (prefers-reduced-motion:reduce){.sk{animation:none}}

/* gate / error panel */
.panel{max-width:560px;margin:8vh auto 0;padding:32px 34px 34px;background:var(--card);border:1px solid var(--hair);border-radius:14px}
.panel{position:relative;overflow:hidden}
.panel > .kick{display:flex;align-items:center;gap:8px;padding-bottom:12px;border-bottom:1.5px solid var(--navy);color:var(--navy)}
.panel > .kick::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--orange-d)}
.panel-art{position:absolute;right:22px;top:16px;width:92px;pointer-events:none}
.panel .panel-art + .kick{margin-right:112px}
.panel h1,.panel-lede{position:relative}
.panel h1{font:800 34px/1.05 var(--display);letter-spacing:-.02em;margin:20px 0 14px}
.panel-lede{font:400 19px/1.4 var(--serif);color:var(--ink);margin:0 0 10px}
.panel-note{font:500 13.5px/1.45 var(--sans);color:var(--sec);margin:0 0 22px}
#err .panel-lede{margin-bottom:22px}

/* chapter opener — charcoal field-guide card, faint street plan, the chapter's own illustration (art.js) */
.ch-head{position:relative;overflow:hidden;isolation:isolate;margin:0 0 10px;padding:26px 30px 22px;border-radius:20px;color:var(--cream);
  background:var(--navy) url("assets/streets.svg") 50% 40%/1100px auto no-repeat}
.ch-head::after{content:"";position:absolute;inset:auto 0 0 0;height:5px;background:var(--ac);z-index:-1}
.ch-hero-in{display:grid;grid-template-columns:minmax(0,1fr) 236px;gap:6px 22px;align-items:end}
.ch-text{min-width:0}
.ch-meta{display:flex;align-items:center;gap:10px 16px;flex-wrap:wrap}
.ch-meta .kick:first-child{display:inline-flex;align-items:center;gap:8px;color:var(--ac)}
.ch-meta .kick:first-child::before{content:"";width:10px;height:10px;border-radius:3px;background:var(--ac);transform:rotate(45deg)}
.ch-stats{color:var(--cream2)}
.ch-stats b{font-weight:600;color:var(--cream)}
.ch-head h1{font:800 44px/1.03 var(--display);letter-spacing:-.025em;margin:14px 0 12px;color:var(--cream);overflow-wrap:anywhere}
.ch-kicker{font:400 19px/1.42 var(--serif);color:var(--cream2);margin:0 0 4px;max-width:58ch}
.ch-art{align-self:center;justify-self:end;width:236px;margin:-6px -8px -4px 0}
.ch-actions{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-top:18px;padding-top:14px;border-top:1px solid rgba(185,189,194,.22)}
.ch-note{font:500 12.5px/1.3 var(--sans);color:var(--cream2)}
.ch-mark{display:none}
/* art on charcoal: lime fills and lime lines are fine here */
.ch-head .fg-art,.pg .fg-art{--art-ln:var(--cream);--art-ac:var(--ac);--art-fo:var(--navy-hi);--art-ac2:var(--orange);--art-la:var(--orange)}
/* chapter 00 is the guide's cover */
.ch-head.is-cover{padding:30px 34px 24px;background-size:1300px auto;background-position:30% 30%}
.ch-head.is-cover .ch-hero-in{grid-template-columns:minmax(0,1fr) 300px;align-items:center}
.ch-head.is-cover .ch-art{width:300px;margin:0 -10px 0 0}
.ch-head.is-cover .ch-mark{display:block;margin:18px 0 2px;font:800 92px/.86 var(--display);letter-spacing:-.01em;text-transform:uppercase;color:var(--orange)}
.ch-head.is-cover .ch-mark span{display:block}
.ch-mark .m-pass{display:block;width:116px;margin:16px 0 0 -13px}
.ch-head.is-cover h1{font-size:30px;margin:18px 0 8px}
.ch-head.is-cover .ch-meta .kick:first-child{color:var(--cream)}
.ch-head.is-cover .ch-meta .kick:first-child::before{background:var(--cream)}
/* 00's accent IS the lime, so the cover keeps it to the FIELD GUIDE mark, the PDF chip and the art's small accents
   (pin, SOLD board, route): the map panels go a lifted grey and the bottom edge stays charcoal — lime never floods */
.ch-head.is-cover::after{content:none}
.ch-head.is-cover .fg-art{--art-ac:#3E444B}

/* art (shared): one drawing, two grounds — custom properties pick the colours. On paper the lime stays a fill
   (always next to a charcoal line); accent-2 LINES (.la, the dashed route .d) take the deep olive --art-la. */
.fg-art{display:block;width:100%;height:auto;overflow:visible;--art-ln:var(--navy);--art-ac:var(--ac-g);--art-fo:var(--card);--art-ac2:var(--orange);--art-la:var(--orange-d)}
.fg-art .l,.fg-art .l2,.fg-art .lw,.fg-art .la{fill:none;stroke:var(--art-ln);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.fg-art .l2{stroke-width:1.5}
.fg-art .lw{stroke-width:6}
.fg-art .la{stroke:var(--art-la)}
.fg-art .f{fill:var(--art-ac)}
.fg-art .fo{fill:var(--art-fo)}
.fg-art .f2{fill:var(--art-ac2)}
.fg-art .s{fill:var(--art-ln)}
.fg-art .d{fill:none;stroke:var(--art-la);stroke-width:2.6;stroke-dasharray:.1 7;stroke-linecap:round}
.fg-art .g{fill:none;stroke:var(--art-ln);stroke-width:1.1;stroke-opacity:.36;stroke-linecap:round}
.fg-art .tx{font-family:var(--display);font-weight:800;letter-spacing:.03em;fill:var(--navy)}
.fg-art .tm{font-family:var(--mono);font-weight:600;letter-spacing:.14em;fill:var(--art-ln)}

/* chapter body — vocabulary emitted by the build */
.ch-body{overflow-wrap:break-word}
.ch-body > :first-child{margin-top:28px}
.ch-body p{margin:0 0 14px}
.ch-body h2{font:800 25px/1.15 var(--display);letter-spacing:-.015em;margin:52px 0 16px;padding-bottom:12px;border-bottom:1.5px solid var(--navy);scroll-margin-top:calc(var(--top-h) + 16px);
  background:linear-gradient(var(--ac-m),var(--ac-m)) 0 100%/64px 5px no-repeat}
.ch-body h3{font:700 17.5px/1.3 var(--sans);letter-spacing:-.005em;margin:34px 0 10px;scroll-margin-top:calc(var(--top-h) + 16px)}
.ch-body h3::before{content:"";display:inline-block;width:.5em;height:.5em;margin:0 .5em .08em 0;border-radius:2px;background:var(--ac-m);transform:rotate(45deg)}
.ch-body h4{font:600 11.5px/1.3 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--sec);margin:26px 0 8px}
.ch-body h2 + h3{margin-top:22px}
.ch-body .hl{margin-left:8px;font:500 .7em/1 var(--mono);color:var(--mut);text-decoration:none;opacity:0;transition:opacity .15s}
.ch-body h2:hover .hl,.ch-body h3:hover .hl,.ch-body .hl:focus-visible{opacity:1}
.ch-body .flash{animation:flash 1.6s ease-out}
@keyframes flash{0%,30%{background-color:var(--ac-t)}100%{background-color:transparent}}
.ch-body strong,.ch-body b{font-weight:650}
.ch-body a{text-decoration:underline;text-decoration-color:var(--ac-l);text-decoration-thickness:1.5px;text-underline-offset:3px}
.ch-body a:hover{text-decoration-color:var(--ac-d)}
.ch-body ul,.ch-body ol{margin:0 0 16px;padding-left:22px}
.ch-body li{margin:0 0 6px;padding-left:4px}
.ch-body li > ul,.ch-body li > ol{margin:6px 0 4px}
.ch-body ul > li::marker{color:var(--ac-d);content:"–  ";font-weight:700}
.ch-body ol > li::marker{font:700 14.5px/1 var(--sans);color:var(--ac-d)}
.ch-body hr{border:0;border-top:1px solid var(--hair);margin:32px 0}
.ch-body code{font:500 .86em/1 var(--mono);background:var(--well);border:1px solid var(--hair2);border-radius:5px;padding:2px 5px}
.ch-body pre{font:500 13px/1.55 var(--mono);background:var(--well);border:1px solid var(--hair);border-radius:var(--radius);padding:14px 16px;overflow-x:auto;margin:0 0 18px;-webkit-overflow-scrolling:touch}
.ch-body pre code{background:none;border:0;padding:0;font-size:inherit;line-height:inherit;white-space:pre}
.ch-body img{height:auto}

/* "say this" lines */
.ch-body blockquote{margin:18px 0 20px;padding:4px 0 4px 18px;border-left:3px solid var(--ac-m)}
.ch-body blockquote p{font:italic 400 19px/1.42 var(--serif);color:var(--ink);margin:0 0 8px}
.ch-body blockquote p:last-child{margin-bottom:0}

/* tables */
.tbl{margin:18px 0 22px;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--hair);border-radius:var(--radius);background:var(--card)}
.tbl table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.45}
.tbl th{background:var(--ac-t);text-align:left;vertical-align:bottom;font:600 11px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--sec);padding:10px 12px;border-bottom:1px solid var(--ac-g)}
.tbl td{vertical-align:top;padding:10px 12px;border-top:1px solid var(--hair2)}
.tbl tbody tr:first-child td{border-top:0}
.tbl td:first-child{font-weight:600;color:var(--ink)}
.tbl th + th,.tbl td + td{border-left:1px solid var(--hair2)}
.tbl td p{margin:0}

/* diagrams */
.dg{margin:24px 0 28px;padding:18px 18px 14px;background:var(--card);border:1px solid var(--hair);border-radius:14px}
.dg-svg{overflow-x:auto;-webkit-overflow-scrolling:touch}
.dg figcaption{display:block;margin-top:12px;padding-top:10px;border-top:1px solid var(--hair2);font:600 13.5px/1.4 var(--sans);color:var(--ink)}
.dg figcaption .kick,.chart-t .kick{display:inline-block;margin-right:10px;padding:3px 7px 2px;border-radius:5px;background:var(--ac-t);font-size:10px;color:var(--ac-d);vertical-align:1px}
.dg-missing{display:block;margin:20px 0;padding:14px 16px;border:1px dashed var(--hair);border-radius:var(--radius);font:500 13px/1.4 var(--mono);color:var(--mut)}

/* data charts (built from the chapter tables; .c-w desktop/PDF, .c-n phones) */
.chart{margin:16px 0 30px;padding:18px 20px 14px;background:var(--card);border:1px solid var(--hair);border-radius:14px}
.chart-t{display:block;margin:0 0 14px;font:800 17px/1.3 var(--display);letter-spacing:-.01em;color:var(--ink)}
.chart-svg svg{display:block;width:100%;height:auto;font-family:var(--sans);overflow:visible}
.chart-svg .c-n{display:none}
.chart-note{margin:10px 0 0;padding-top:10px;border-top:1px solid var(--hair2);font:500 12.5px/1.45 var(--sans);color:var(--sec)}

@media (max-width:560px){.chart-svg .c-w{display:none}.chart-svg .c-n{display:block;max-width:440px}}

/* illustrations (build/viz.mjs: road · cutaway · isobars · tiles). Each figure holds two drawings with real text: .vz-w (680
   wide) and .vz-n (340 wide); the figure's OWN width picks one (container query), so the rail/tablet layouts work too.
   Text is ≥12px at 1:1, so ≥11px on screen. Colours come from the chapter accent via var(--ac-*) inside the SVG. */
.viz{container-type:inline-size;margin:24px 0 30px;padding:18px 20px 16px;background:var(--card);border:1px solid var(--hair);border-radius:14px}
.viz .vz-t{display:block;margin:0 0 16px;font:800 17px/1.3 var(--display);letter-spacing:-.01em;color:var(--ink)}
.viz .vz-t .kick{display:inline-block;margin-right:10px;padding:3px 7px 2px;border-radius:5px;background:var(--ac-t);font-size:10px;color:var(--ac-d);vertical-align:2px}
.vz-svg svg{display:block;width:100%;height:auto;overflow:visible}
.vz-svg .vz-n{display:none;max-width:460px;margin:0 auto}
@container (max-width:639px){.vz-svg .vz-w{display:none}.vz-svg .vz-n{display:block}}
.viz .vz-cap{margin:14px 0 0;font:400 14.5px/1.5 var(--sans);color:var(--ink2)}
.viz .vz-note{margin:12px 0 0;padding-top:10px;border-top:1px solid var(--hair2);font:500 12.5px/1.45 var(--sans);color:var(--sec)}
@media (max-width:760px){.viz{padding:14px 12px 12px;margin-left:-4px;margin-right:-4px}.viz .vz-t{font-size:15.5px}}

/* motion (web only): added by guide.js as html.motion, never under prefers-reduced-motion, never in print */
.motion .rv{opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.motion .rv.in{opacity:1;transform:none}
.motion .ch-body h2.rv{background-size:0 5px;transition:opacity .6s var(--ease),transform .6s var(--ease),background-size .8s var(--ease) .15s}
.motion .ch-body h2.rv.in{background-size:64px 5px}
.chart .gx,.chart .gy{transform-box:fill-box}
.chart .gx{transform-origin:0 50%}
.chart .gy{transform-origin:50% 100%}
.motion .chart.rv .gx,.motion .chart.rv .gy{transition:transform .75s var(--ease)}
.motion .chart.rv:not(.in) .gx{transform:scaleX(0)}
.motion .chart.rv:not(.in) .gy{transform:scaleY(0)}
/* illustrations: lines draw on, labels fade in, iso blocks grow (all only after the figure scrolls in) */
.viz .vz-g{transform-box:fill-box;transform-origin:50% 100%}
.viz .vz-gx{transform-box:fill-box;transform-origin:0 50%}
.motion .viz.rv .vz-l{stroke-dasharray:1 1;stroke-dashoffset:0;transition:stroke-dashoffset 1.4s var(--ease) .1s}
.motion .viz.rv:not(.in) .vz-l{stroke-dashoffset:1}
.motion .viz.rv .vz-p{transition:opacity .7s var(--ease) .55s}
.motion .viz.rv:not(.in) .vz-p{opacity:0}
.motion .viz.rv .vz-g,.motion .viz.rv .vz-gx{transition:transform .9s var(--ease) .25s}
.motion .viz.rv:not(.in) .vz-g{transform:scaleY(0)}
.motion .viz.rv:not(.in) .vz-gx{transform:scaleX(0)}
.motion .fg-art.draw .l,.motion .fg-art.draw .l2,.motion .fg-art.draw .lw,.motion .fg-art.draw .la{stroke-dasharray:1 1;stroke-dashoffset:1;animation:fgDraw 1.25s var(--ease) forwards}
.motion .fg-art.draw .l2{animation-delay:.25s}
.motion .fg-art.draw .la{animation-delay:.45s}
.motion .fg-art.draw .f,.motion .fg-art.draw .fo,.motion .fg-art.draw .f2,.motion .fg-art.draw .s,.motion .fg-art.draw .d,.motion .fg-art.draw .g,.motion .fg-art.draw text{opacity:0;transform:translate(-5px,-4px);animation:fgPop .7s var(--ease) .55s forwards}
.motion .fg-art.draw .f2,.motion .fg-art.draw .d,.motion .fg-art.draw text{animation-delay:.8s}
.motion .fg-art.draw .g{animation-delay:.2s}
@keyframes fgDraw{to{stroke-dashoffset:0}}
@keyframes fgPop{to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  .motion .rv,.motion .chart.rv .gx,.motion .chart.rv .gy{opacity:1 !important;transform:none !important;transition:none !important}
  .motion .fg-art.draw *{animation:none !important;opacity:1 !important;transform:none !important;stroke-dasharray:none !important}
  .motion .viz .vz-l{stroke-dasharray:none !important;transition:none !important}
  .motion .viz .vz-p,.motion .viz .vz-g,.motion .viz .vz-gx{opacity:1 !important;transform:none !important;transition:none !important}
}

/* checklists */
.ch-body ul.tasks{list-style:none;padding-left:0;margin:6px 0 18px;border-top:1px solid var(--hair2)}
.ch-body ul.tasks > li::marker{content:none}
.ch-body li.task{position:relative;padding:9px 0 9px 32px;margin:0;border-bottom:1px solid var(--hair2)}
.ch-body li.task .box{position:absolute;left:0;top:calc(9px + .78em - 8px);width:16px;height:16px;border:1.5px solid var(--ac-d);border-radius:4px;background:var(--card);box-shadow:2px 2px 0 var(--ac-g)}

/* POV way + verify */
.ch-body strong.pov{font-weight:700;color:var(--lime);background:var(--navy);border-radius:999px;padding:1px 9px 2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;white-space:normal}
.ch-body p.pov-way{padding:12px 16px 13px;background:var(--card);border:1px solid var(--hair);border-left:4px solid var(--navy);border-radius:0 var(--radius) var(--radius) 0;margin:18px 0 20px;box-shadow:4px 4px 0 var(--ac-t)}
.ch-body span.verify{font:500 .86em/1.5 var(--sans);color:var(--amber-ink);background:var(--amber-bg);border:1px dashed var(--amber-line);border-radius:5px;padding:1px 6px;-webkit-box-decoration-break:clone;box-decoration-break:clone}

/* sources */
.ch-body .sources{margin-top:48px;font-size:13.5px;line-height:1.5;color:var(--ink2)}
.ch-body .sources h2{font-size:19px}
.ch-body .sources ul{padding-left:18px}
.ch-body .sources li{margin-bottom:4px}
.ch-body .sources a,.ch-body a.url{overflow-wrap:anywhere;word-break:break-word}
.ch-body a.url{font:500 .86em/1.5 var(--mono)}

/* chapter errors + pager */
.ch-err{margin:28px 0;padding:18px 20px;background:var(--card);border:1px solid var(--hair);border-left:3px solid var(--red);border-radius:0 var(--radius) var(--radius) 0;font:500 14.5px/1.45 var(--sans)}
.ch-err p{margin:0 0 12px}
.pager{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:56px;padding-top:0}
.trail-end{grid-column:1/-1;display:flex;align-items:flex-end;gap:12px;margin:0 0 10px}
.trail-end::before,.trail-end::after{content:"";flex:1 1 0;height:1.5px;margin-bottom:2.1px;border-radius:1px;background:var(--hair)}
.trail-end .m-skyline{flex:none;width:200px;height:auto}
.pg{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 84px;align-items:center;gap:12px;padding:14px 14px 14px 16px;border:1px solid var(--hair);border-top:4px solid var(--ac-m);border-radius:var(--radius);background:var(--card);text-decoration:none;color:var(--ink);transition:transform .2s var(--ease),box-shadow .2s var(--ease)}
.pg:hover{transform:translateY(-2px);box-shadow:0 10px 24px -14px rgba(20,23,26,.45)}
.pg .pg-art{width:84px;padding:6px;border-radius:10px;background:var(--navy) url("assets/streets.svg") 50%/320px auto}
.pg-x{display:block;min-width:0}
.pg.prev{grid-template-columns:84px minmax(0,1fr)}
.pg.prev .pg-art{order:-1}
.pg .kick{font-size:10.5px;color:var(--mut)}
.pg .pg-t{display:block;font:800 17px/1.2 var(--display);letter-spacing:-.01em;margin-top:6px}
.pg.next{text-align:right;grid-column:2}
.print-foot{display:none}

/* mini-TOC (≥1200px) */
.toc{position:sticky;top:var(--top-h);align-self:start;max-height:calc(100vh - var(--top-h));overflow:auto;padding:40px 0 24px;scrollbar-width:thin;display:none}
@media (min-width:1200px){body[data-state="ready"] .toc:not([hidden]){display:block}}
.toc .kick{display:block;padding:0 0 10px;border-bottom:1px solid var(--hair);font-size:10.5px}
.toc ol{list-style:none;margin:0;padding:8px 0 0}
.toc a{display:block;padding:5px 0 5px 12px;border-left:1.5px solid transparent;font:500 13px/1.35 var(--sans);color:var(--sec);text-decoration:none}
.toc a:hover{color:var(--ink)}
.toc a[aria-current="location"]{color:var(--ink);font-weight:650;border-left:3px solid var(--ac-d);padding-left:10.5px}

/* toast */
.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,20px);z-index:60;max-width:min(520px,calc(100vw - 32px));padding:12px 18px;border-radius:12px;background:var(--navy);color:var(--cream);
  font:500 14px/1.4 var(--sans);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s}
.toast.on{opacity:1;transform:translate(-50%,0)}

/* ── VIZFIND (21 Oct 2026): visual discovery ─────────────────────────────────
   "Charts & visuals" gallery (#visuals) · a visuals count on each contents row · figures under their section in
   "On this page" · "Visuals only" on each chapter (screen only: print + PDFs keep the text). Lime only on charcoal. */
/* contents: visuals count beside the word count; the gallery row first, charcoal */
.ri{grid-template-columns:34px minmax(0,1fr) auto auto}
.ri .vc{display:inline-flex;align-items:center;gap:3px;font:500 11px/1 var(--mono);color:var(--mut);white-space:nowrap}
.ri .vc svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;transform:translateY(1px)}
.ri[aria-current="page"] .vc{color:var(--ac-d)}
.ri .vc{min-width:24px;justify-content:flex-end}
.ri .w{min-width:28px;text-align:right}
.rail-list li.vis{margin:0 0 6px}
.ri.ri-vis{grid-template-columns:34px minmax(0,1fr) auto;align-items:center;padding:10px 10px;background:var(--navy);color:var(--cream)}
.ri.ri-vis .n::before{content:none}
.ri.ri-vis .n svg{width:17px;height:17px;fill:none;stroke:var(--lime);stroke-width:1.7;stroke-linejoin:round}
.ri.ri-vis .t{font-weight:700}
.ri.ri-vis .w{color:var(--cream2)}
.ri.ri-vis:hover{background:var(--navy-hi)}
.ri.ri-vis[aria-current="page"]{background:var(--navy);color:var(--cream)}
.ri.ri-vis[aria-current="page"]::after{background:var(--lime)}
.ri.ri-vis[aria-current="page"] .t{font-weight:800}
.ri.ri-vis[aria-current="page"] .w{color:var(--cream)}
/* On this page: a section's figures, indented, one line each */
.toc ol.toc-figs{padding:0 0 4px}
.toc a.tf{display:flex;align-items:center;gap:6px;padding:3px 0 3px 24px;font:500 12px/1.35 var(--sans);color:var(--mut)}
.toc a.tf svg{flex:none;width:11px;height:11px;fill:none;stroke:var(--ac-d);stroke-width:1.9;stroke-linecap:round}
.toc a.tf .tf-t{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.toc a.tf:hover{color:var(--ink)}
.toc li.toc-pre{padding-bottom:2px}
/* landing on a figure from a link: a short accent ring */
.ch-body figure.flash{animation:vzflash 2.4s ease-out}
@keyframes vzflash{0%,45%{border-color:var(--ac-d);box-shadow:0 0 0 3px var(--ac-d),0 0 0 10px var(--ac-t)}100%{box-shadow:0 0 0 0 rgba(0,0,0,0),0 0 0 0 rgba(0,0,0,0)}}
/* Visuals only: outlined cream chip on the charcoal opener (the PDF chip keeps the one lime) */
.ch-head .chip:focus-visible{box-shadow:0 0 0 2px var(--navy),0 0 0 4px var(--cream)}
.ch-head .chip.vo-btn{background:transparent;border-color:rgba(245,243,238,.45);color:var(--cream)}
.ch-head .chip.vo-btn:hover{border-color:var(--cream)}
.ch-head .chip.vo-btn[aria-pressed="true"]{background:var(--cream);border-color:var(--cream);color:var(--navy)}
@media screen{
  body.vis-only .ch-body > :not(h2):not(h3.vo-has):not(figure){display:none !important}
  body.vis-only .ch-body > h2{margin-top:40px}
  body.vis-only .ch-body > h2.vo-empty{margin:20px 0 0;padding-bottom:8px;font-size:18px;color:var(--mut);border-bottom-color:var(--hair);background-size:36px 3px}
  body.vis-only .ch-body > h2.vo-empty::after{content:"No visuals";margin-left:10px;font:600 10px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mut);vertical-align:2px}
  body.vis-only .ch-body > h2.vo-empty + h2{margin-top:20px}
  body.vis-only .ch-body > h3.vo-has{margin-top:22px}
}
.vo-bar{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:40;display:flex;align-items:center;gap:12px;
  padding:5px 5px 5px 16px;border-radius:999px;background:var(--navy);color:var(--cream);box-shadow:0 14px 34px -14px rgba(16,18,20,.5);white-space:nowrap}
.vo-bar .kick{color:var(--cream2);font-size:10.5px}
.vo-bar .chip{height:30px;background:var(--cream);border-color:var(--cream);color:var(--navy)}
.vo-bar .chip:focus-visible{box-shadow:0 0 0 2px var(--navy),0 0 0 4px var(--cream)}
/* the gallery: main spans the "On this page" column (hidden here) on wide screens */
@media (min-width:1200px){body[data-view="visuals"] main{grid-column:2 / -1}}
.gallery{min-width:0}
.gal-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:18px 28px;align-items:end;margin:0;padding:26px 30px 26px}
.gal-head::after{content:none}
.gal-head h1{margin:14px 0 10px}
.gal-head .ch-kicker{max-width:46ch}
.gal-mos{display:grid;grid-template-columns:repeat(2,minmax(104px,auto));gap:8px}
.gm{display:flex;flex-direction:column;gap:6px;padding:11px 13px 10px;border-radius:10px;background:var(--navy-hi);border:1px solid rgba(185,189,194,.16)}
.gm b{font:800 26px/1 var(--display);color:var(--cream)}
.gm span{font:600 10px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--cream2)}
.vk-dot{flex:none;width:8px;height:8px;border-radius:2px;background:var(--mut)}
.vk-dot.vk-road{background:#6B7F00}
.vk-dot.vk-cutaway{background:#2f5d8a}
.vk-dot.vk-isobars{background:#7a5a1e}
.vk-dot.vk-tiles{background:#5a4a7a}
.vg-bar{position:sticky;top:var(--top-h);z-index:5;display:flex;flex-wrap:wrap;align-items:center;gap:10px 14px;margin:0 -8px;padding:16px 8px 10px;
  background:rgba(251,248,241,.96);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border-bottom:1px solid var(--hair)}
.vg-kinds{display:flex;flex-wrap:wrap;gap:6px}
.chip.vg-k{height:31px;padding:0 12px;gap:6px;font-size:13px}
.chip.vg-k .sz{font:600 10.5px/1 var(--mono);letter-spacing:.04em;color:var(--mut)}
.chip.vg-k[aria-pressed="true"]{background:var(--navy);border-color:var(--navy);color:var(--cream)}
.chip.vg-k[aria-pressed="true"] .sz{color:var(--cream2)}
.vg-find{position:relative;flex:1 1 220px;min-width:180px;max-width:320px;margin-left:auto}
.vg-find input{width:100%;height:34px;padding:0 12px 0 35px;border-radius:999px;border:1px solid var(--hair);background:var(--card);font:500 14px/1 var(--sans);color:var(--ink);-webkit-appearance:none;appearance:none}
.vg-find input::placeholder{color:var(--mut)}
.vg-find input:focus{border-color:var(--navy);box-shadow:0 0 0 3px rgba(20,23,26,.10)}
.vg-count{flex:1 0 100%;margin:0;font:600 10.5px/1.3 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--mut)}
.vg-list{padding-bottom:8px}
.vg-grp{margin-top:30px}
.vg-gh{display:block;margin:0;padding-bottom:9px;border-bottom:1.5px solid var(--navy);font-size:11px;color:var(--navy)}
.vg-ch{margin:18px 0 8px}
.vg-chh{display:flex;align-items:baseline;gap:10px;margin:0 0 10px;font:700 15.5px/1.3 var(--sans)}
.vg-chh a{display:inline-flex;align-items:baseline;gap:9px;min-width:0;color:var(--ink);text-decoration:none;border-radius:4px}
.vg-chh a:hover .vg-ct{text-decoration:underline;text-decoration-color:var(--ac-d);text-decoration-thickness:1.5px;text-underline-offset:3px}
.vg-n{display:inline-flex;align-items:center;gap:7px;font:600 11px/1 var(--mono);letter-spacing:.06em;color:var(--mut);white-space:nowrap}
.vg-n::before{content:"";width:8px;height:8px;border-radius:2.5px;background:var(--ac-m)}
.vg-cn{margin-left:auto;display:inline-flex;align-items:center;gap:4px;font:500 11px/1 var(--mono);color:var(--mut);white-space:nowrap}
.vg-cn svg{width:11px;height:11px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round}
.vg-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(212px,1fr));gap:12px}
.vg-grid > li{min-width:0}
.vf{position:relative;display:flex;flex-direction:column;height:100%;border:1px solid var(--hair);border-radius:12px;background:var(--card);color:var(--ink);text-decoration:none;
  overflow:hidden;transition:border-color .15s,transform .15s var(--ease),box-shadow .15s}
.vf::before{content:"";position:absolute;left:0;right:0;top:0;height:3px;background:var(--ac-m)}
.vf:hover{border-color:var(--navy);transform:translateY(-2px);box-shadow:0 12px 26px -16px rgba(16,18,20,.4)}
.vf:focus-visible{border-radius:12px;border-color:var(--navy)}
.vf-th{display:block;aspect-ratio:16/10;padding:14px 12px 8px;border-bottom:1px solid var(--hair2);overflow:hidden}
.vf-svg{display:block;width:100%;height:100%;overflow:hidden}
.vf-th.is-loading{background:linear-gradient(90deg,var(--well),var(--hair2),var(--well));background-size:200% 100%;animation:sk 1.4s ease-in-out infinite}
.vf-th.is-none{display:grid;place-items:center;background:var(--well)}
.vf-th.is-none::after{content:"Preview unavailable";font:600 10px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
.vf-b{display:flex;flex-direction:column;gap:6px;flex:1 1 auto;padding:10px 12px 12px}
.vf-k{align-self:flex-start;display:inline-flex;align-items:center;gap:6px;padding:3px 7px 2px;border-radius:5px;background:var(--well);font:600 10px/1.2 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--sec)}
.vf-t{font:650 14px/1.35 var(--sans);color:var(--ink);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.vf-c{margin-top:auto;padding-top:2px;font:500 11.5px/1.35 var(--sans);color:var(--mut);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vg-empty{padding:34px 0 10px}
.vg-empty p{margin:0 0 12px;font:500 15px/1.45 var(--sans);color:var(--sec)}
@media (prefers-reduced-motion:reduce){.vf-th.is-loading{animation:none}.vf,.vf:hover{transition:none;transform:none}}

/* ── tablet ──────────────────────────────────────────────────────────────── */
@media (max-width:1100px){
  :root{--rail-w:232px}
  .layout{gap:0 36px}
  .brand-kick{display:none}
}

/* header fit, 761–1360px (Field Kit card beside the whole-guide chip): drop the card's size label, then the version chip
   (the rail foot still shows it), then go icon-only — the size stays in the title + aria-label */
@media (min-width:761px) and (max-width:1360px){.top .chip.dl-card .sz{display:none}}
@media (min-width:761px) and (max-width:1080px){.top .chip.ver{display:none}}
@media (min-width:761px) and (max-width:900px){
  .top .chip.dl-card{width:32px;padding:0;justify-content:center}
  .top .chip.dl-card .lb,.top .chip.dl-all .sz{display:none}
}

/* ── phone (≤760px): rail becomes a sheet ────────────────────────────────── */
@media (max-width:760px){
  :root{--top-h:108px}
  body{font-size:16px}
  .top{display:grid;grid-template-columns:auto minmax(0,1fr) auto;grid-template-areas:"brand brand av" "rail search search";
    height:auto;min-height:var(--top-h);padding:10px 16px;gap:10px 10px;align-content:center;align-items:center}
  .brand{grid-area:brand;min-width:0}
  .brand img{height:17px}
  .brand-kick{display:inline-flex;font-size:10px;padding-left:10px;gap:6px}
  .sp,.chip.ver,.dl-all{display:none}
  .top{grid-template-columns:auto minmax(0,1fr) auto auto;grid-template-areas:"brand brand kit av" "rail search search search"}
  .top .chip.dl-card{grid-area:kit;margin:0;width:32px;height:32px;padding:0;justify-content:center}   /* icon only; aria-label names it */
  .top .chip.dl-card .lb,.top .chip.dl-card .sz{display:none}
  .av{grid-area:av;width:32px;height:32px}
  .rail-btn{display:inline-flex;grid-area:rail;height:38px}
  .search{grid-area:search;flex:none;min-width:0}
  .search input{height:38px;font-size:16px}
  .search-key{display:none}
  body:not([data-state="ready"]) .top{grid-template-areas:"brand brand brand av";min-height:58px}
  .results{position:fixed;left:16px;right:16px;width:auto;top:calc(var(--top-h) + 6px);max-height:calc(100vh - var(--top-h) - 24px)}

  .layout{display:block;padding:0 16px}
  .rail{position:fixed;z-index:50;top:0;left:0;bottom:0;width:min(86vw,340px);height:auto;padding:16px 12px calc(16px + env(safe-area-inset-bottom));background:var(--paper);border-right:1.5px solid var(--ink);
    transform:translateX(-102%);visibility:hidden;transition:transform .25s ease,visibility 0s linear .25s}
  body.rail-open .rail{transform:none;visibility:visible;transition:transform .25s ease}
  body:not([data-state="ready"]) .rail{display:none}
  .rail-close{display:inline-grid}
  .dl-all-rail:not([hidden]){display:inline-flex}
  .scrim{position:fixed;inset:0;z-index:45;background:rgba(16,18,20,.36)}
  body.rail-open{overflow:hidden}
  .ri{padding:10px 10px}
  main{padding:24px 0 72px}
  .ch-head{padding:20px 18px 16px;border-radius:16px;margin:0 -4px 10px;background-size:760px auto}
  .ch-hero-in,.ch-head.is-cover .ch-hero-in{grid-template-columns:minmax(0,1fr)}
  .ch-art,.ch-head.is-cover .ch-art{order:-1;width:160px;justify-self:end;margin:-8px -6px 2px 0}
  .ch-head.is-cover .ch-art{width:188px}
  .ch-head h1{font-size:31px;margin-top:10px}
  .ch-head.is-cover .ch-mark{font-size:60px;margin-top:4px}
  .ch-mark .m-pass{width:84px;margin:10px 0 0 -9px}
  .ch-head.is-cover h1{font-size:24px}
  .ch-kicker{font-size:17px}
  .ch-actions{margin-top:14px}
  .chart{padding:14px 12px 12px;margin-left:-4px;margin-right:-4px}
  .chart-t{font-size:15.5px}
  .pg,.pg.prev{grid-template-columns:minmax(0,1fr) 64px}
  .pg .pg-art{width:64px}
  .pg.prev .pg-art{order:2}
  .pg.prev{text-align:left}
  .ch-body h2{font-size:21px;margin-top:40px}
  .ch-body h3{font-size:16.5px}
  .ch-body blockquote p{font-size:18px}
  .tbl{margin-left:-4px;margin-right:-4px}
  .tbl table{font-size:13.5px}
  .tbl th,.tbl td{min-width:8.5em}
  .tbl th:first-child,.tbl td:first-child{min-width:7em}
  .dg{padding:12px 10px 10px;margin-left:-4px;margin-right:-4px}
  .dg-svg svg{min-width:560px}
  .dg-svg{position:relative}
  .dg figcaption::before{content:"Swipe →";float:right;margin:3px 0 0 12px;font:600 10px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
  .panel{margin-top:5vh;padding:26px 22px 28px}
  .panel h1{font-size:28px}
  .pager{grid-template-columns:1fr}
  .pg.next{grid-column:1}
}
@media (max-width:480px){.brand-kick{display:none}}   /* was 380px; the Field Kit icon now shares the brand row */

/* ── print fallback: the open chapter, Field Kit print style ─────────────── */
@media print{
  @page{size:A4;margin:14mm 14mm 16mm}
  html,body{background:#fff}
  body{font:400 9.5pt/1.42 var(--sans);-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .top,.rail,.toc,.scrim,.toast,.skip,.pager,.ch-actions .chip,.loading,.ch-body .hl,#gate,#err{display:none !important}
  .layout{display:block;padding:0;max-width:none}
  main{padding:0}
  .ch-head{padding:6mm 7mm 5mm;border-radius:4mm}
  .ch-head h1{font-size:25pt;margin:3mm 0}
  .ch-kicker{font-size:12pt}
  .ch-art{width:46mm}
  .ch-body h2{font-size:13pt;margin:7mm 0 3mm;padding-bottom:1.6mm;break-after:avoid}
  .ch-body h3{font-size:10.6pt;margin:5mm 0 2mm;break-after:avoid}
  .ch-body blockquote p{font-size:10.5pt}
  .tbl{overflow:visible;border-radius:0;break-inside:avoid}
  .tbl table{font-size:8.6pt}
  .tbl th{font-size:6.8pt}
  .tbl th,.tbl td{min-width:0;padding:1.6mm 2mm}
  .dg{break-inside:avoid;border-radius:0}
  .dg-svg{overflow:visible}
  .dg-svg svg{min-width:0}
  .rv{opacity:1 !important;transform:none !important}
  .ch-head{break-inside:avoid;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  .chart{break-inside:avoid;border-radius:0}
  .chart-svg .c-w{display:block !important}
  .chart-svg .c-n{display:none !important}
  .chart .gx,.chart .gy{transform:none !important}
  .viz{break-inside:avoid;border-radius:0;padding:3mm 4mm}
  .vz-svg .vz-w{display:block !important}
  .vz-svg .vz-n{display:none !important}
  .viz .vz-l{stroke-dasharray:none !important}
  .viz .vz-p,.viz .vz-g,.viz .vz-gx{opacity:1 !important;transform:none !important}
  .fg-art *{animation:none !important;opacity:1 !important;transform:none !important}
  .fg-art .l,.fg-art .l2,.fg-art .lw,.fg-art .la{stroke-dasharray:none !important}
  .trail-end{display:none}
  li,.ch-body li.task{break-inside:avoid}
  .ch-body .sources{font-size:8pt}
  .ch-body .sources a::after{content:" " attr(href);font:400 7pt/1.3 var(--mono);color:var(--sec);overflow-wrap:anywhere}
  .print-foot{display:block;margin-top:8mm;padding-top:2.6mm;border-top:1px solid var(--hair);font:600 7pt/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mut)}
}

/* VIZFIND · phone + print */
@media (max-width:760px){
  .gal-head{grid-template-columns:minmax(0,1fr);padding:20px 18px 18px;margin:0 -4px;border-radius:16px}
  .gal-head h1{font-size:31px;margin-top:10px}
  .gal-mos{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
  .gm{padding:9px 8px 8px;gap:5px}
  .gm b{font-size:20px}
  .gm span{font-size:9px;letter-spacing:.06em;overflow-wrap:anywhere}
  .vg-bar{position:static;margin:0;padding:14px 0 10px}
  .vg-kinds{flex-wrap:nowrap;overflow-x:auto;margin:0 -16px;padding:0 16px 2px;scrollbar-width:none;max-width:calc(100% + 32px)}
  .vg-kinds::-webkit-scrollbar{display:none}
  .vg-find{flex:1 1 100%;max-width:none;margin-left:0}
  .vg-find input{height:38px;font-size:16px}
  .vg-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .vf-th{padding:10px 8px 6px}
  .vf-b{padding:8px 10px 10px;gap:5px}
  .vf-t{font-size:13px}
  .vf-c{font-size:11px}
  .vg-chh{font-size:15px}
  .vo-bar{max-width:calc(100vw - 32px)}
}
@media print{.vo-bar,.vg-bar{display:none !important}.gal-head{break-inside:avoid}}