/* Groundwork guide pages: the Annual Report world, calm reading layout */
:root{
  --paper:#F4EFE2;
  --paper-deep:#EAE2CD;
  --ink:#1E1B16;
  --ink-soft:#5C554A;
  --rule:#C9BFA8;
  --terra:#C7681D;
  --terra-deep:#A44E12;
  --mustard:#D9A419;
  --mustard-deep:#8F6D0C;
  --olive:#5A6B4A;
  --olive-deep:#49573C;
  --oxblood:#8A2F1F;
  /* legacy aliases so inline SVG var() references pick up the new world */
  --canvas:var(--paper);
  --panel:var(--paper-deep);
  --accent:var(--terra);
  --accent-hover:var(--terra-deep);
  --accent-muted:var(--rule);
  --text-secondary:var(--ink-soft);
  --text-primary:var(--ink);
  --btn-ink:var(--paper);
  --display:'Archivo',Arial,'Helvetica Neue',sans-serif;
  --slab:'Besley',Georgia,'Times New Roman',serif;
  --body:'Archivo',Arial,'Helvetica Neue',sans-serif;
  --mono:'Courier Prime','Courier New',ui-monospace,monospace;
  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-inout:cubic-bezier(.77,0,.175,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{overflow-x:hidden;overflow-x:clip}
body{background:var(--paper);color:var(--ink);font-family:var(--body);font-size:17px;line-height:1.7;font-weight:500;-webkit-font-smoothing:antialiased;caret-color:var(--terra-deep)}
img{max-width:100%;display:block}
a{color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px;text-decoration-color:var(--terra)}
a:hover{color:var(--terra-deep)}
::selection{background:var(--terra);color:var(--paper)}
html{scrollbar-color:var(--ink) var(--paper-deep)}
::-webkit-scrollbar{width:12px}
::-webkit-scrollbar-track{background:var(--paper-deep)}
::-webkit-scrollbar-thumb{background:var(--ink);border:3px solid var(--paper-deep)}
:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--paper);padding:.6em 1em;z-index:100;text-decoration:none}
.skip:focus{left:0}
h1,h2,h3{font-family:var(--display);line-height:1.12;letter-spacing:-.01em;color:var(--ink)}
h1{font-size:clamp(2rem,4.6vw,3rem);font-weight:900;text-transform:uppercase;letter-spacing:-.015em;line-height:1.04}
h2{font-size:clamp(1.4rem,2.8vw,1.9rem);font-weight:800;margin:2.6em 0 .6em;padding-top:1.2em;border-top:1px solid var(--ink)}
h3{font-size:1.18rem;font-weight:700;margin:1.8em 0 .45em}
p{margin:.85em 0;color:var(--ink-soft)}
p strong,li strong{color:var(--ink);font-weight:700}
.kicker{font-family:var(--display);font-weight:700;font-size:.7rem;letter-spacing:.24em;color:var(--terra-deep);text-transform:uppercase}
nav.top{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:1.4rem;padding:.75rem clamp(1rem,4vw,2.6rem);background:var(--paper);border-bottom:2px solid var(--ink)}
nav.top::after{content:"";position:absolute;left:0;right:0;bottom:-5px;height:1px;background:var(--ink)}
.brand{display:flex;align-items:center;gap:.6rem;color:var(--ink);text-decoration:none}
.brand svg{width:24px;height:24px}
.brand b{font-family:var(--display);font-weight:900;letter-spacing:.22em;font-size:.8rem}
nav.top .links{margin-left:auto;display:flex;align-items:baseline;gap:1.3rem;flex-wrap:wrap}
nav.top .links a{color:var(--ink);font-size:.85rem;font-weight:600;text-decoration:none}
nav.top .links a:hover,nav.top .links a[aria-current]{color:var(--terra-deep)}
nav.top .links a[aria-current]{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px;text-decoration-color:var(--terra-deep)}
.navtoggle{display:none;background:transparent;border:2px solid var(--ink);color:var(--ink);padding:.4em .9em;font-family:var(--display);font-weight:700;font-size:.72rem;letter-spacing:.1em;cursor:pointer;margin-left:auto}
@media (max-width:860px){
  nav.top .links{display:none}
  nav.top .navtoggle{display:inline-flex;align-items:center}
  nav.top .links.open{display:flex;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:flex-start;gap:.85rem;background:var(--paper);padding:1.1rem clamp(1rem,4vw,2.6rem) 1.3rem;border-bottom:2px solid var(--ink);margin-left:0}
}
.passiton{margin-bottom:1.1rem}
.passiton .pbtn{font-size:.78rem;padding:.4em 1em}
main{max-width:820px;margin:0 auto;padding:3.2rem clamp(1.2rem,5vw,2.5rem) 5rem}
header.page{margin-bottom:2.2rem}
header.page p.lede{font-family:var(--slab);font-style:italic;font-size:1.12rem;margin-top:.8em;color:var(--ink-soft)}
ul,ol{margin:.9em 0 .9em 1.4em;color:var(--ink-soft)}
li{margin:.45em 0}
li::marker{color:var(--terra-deep)}
.card{background:var(--paper-deep);border:1px solid var(--ink);padding:1.4rem 1.5rem;margin:1.3rem 0}
.card h3{margin-top:0}
.callout{border:2px solid var(--ink);background:var(--paper-deep);padding:1rem 1.3rem;margin:1.4rem 0}
.callout p{margin:.3em 0}
pre{background:var(--paper-deep);border:1px solid var(--ink);padding:1.1rem 1.3rem;overflow-x:auto;margin:1.2rem 0}
code{font-family:var(--mono);font-size:.84rem;color:var(--ink)}
p code,li code{background:var(--paper-deep);border:1px solid var(--rule);padding:.12em .45em}
table{width:100%;border-collapse:collapse;margin:1.3rem 0;font-size:.93rem;border-top:2px solid var(--ink)}
th{font-family:var(--display);font-weight:700;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);text-align:left}
th,td{padding:.65em .8em;border-bottom:1px solid var(--rule);vertical-align:top;color:var(--ink-soft)}
th{border-bottom:1px solid var(--ink)}
td:first-child{color:var(--ink);font-weight:600}
.tablewrap{overflow-x:auto}
details{border-bottom:1px solid var(--rule);margin:.8rem 0;background:transparent}
details:first-of-type{border-top:2px solid var(--ink)}
summary{cursor:pointer;list-style:none;padding:1rem .2rem;font-family:var(--slab);font-weight:600;font-size:1.08rem;color:var(--ink);display:flex;justify-content:space-between;gap:1rem}
summary:hover{color:var(--terra-deep)}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-family:var(--display);font-weight:700;color:var(--terra-deep)}
details[open] summary::after{content:"\2013"}
details .inner{padding:0 .2rem 1.2rem}
.check{list-style:none;margin-left:0}
.check li{padding-left:1.9em;position:relative}
.check li::before{content:"";position:absolute;left:0;top:.42em;width:1em;height:1em;border:1.5px solid var(--ink)}
.btn{display:inline-block;background:var(--ink);color:var(--paper);font-family:var(--display);font-weight:700;font-size:.92rem;letter-spacing:.04em;text-transform:uppercase;text-decoration:none;padding:.8em 1.6em;border:2px solid var(--ink);cursor:pointer;transition:background .18s var(--ease-out),border-color .18s var(--ease-out)}
.btn:hover{background:var(--terra-deep);border-color:var(--terra-deep);color:var(--paper)}
.btn-ghost{background:transparent;color:var(--ink);border:2px solid var(--ink)}
.btn-ghost:hover{background:var(--paper-deep);color:var(--ink);border-color:var(--ink)}
@media (pointer:coarse){.btn,nav.top a{min-height:44px;display:inline-flex;align-items:center;justify-content:center}}
.pnav{display:flex;justify-content:space-between;gap:1rem;margin-top:4rem;padding-top:1.6rem;border-top:2px solid var(--ink);font-size:.92rem}
.crumb{font-family:var(--display);font-weight:700;font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:1.6rem;display:block}
.crumb a{color:var(--ink-soft);text-decoration:none}
.crumb a:hover{color:var(--terra-deep)}
footer.site{border-top:2px solid var(--ink);position:relative;padding:2.2rem clamp(1.2rem,5vw,2.5rem);color:var(--ink-soft);font-size:.84rem;text-align:center}
footer.site::before{content:"";position:absolute;left:0;right:0;top:3px;height:1px;background:var(--ink)}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1.2rem;margin:1.4rem 0}
.tag{display:inline-block;font-family:var(--display);font-weight:700;font-size:.64rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);border:1px solid var(--ink);padding:.3em .9em;margin-right:.5em}
.exhibit{margin:1.8rem 0}
.exhibit .mat{background:var(--paper-deep);border:1px solid var(--ink);padding:clamp(.7rem,1.6vw,1.1rem)}
.exhibit img{width:100%;height:auto;border:1px solid var(--rule)}
.exhibit .cap{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.3rem 1rem;font-family:var(--display);font-weight:600;font-size:.72rem;letter-spacing:.06em;color:var(--ink-soft);padding-top:.65rem;text-transform:uppercase}
.exhibit .cap b{color:var(--ink)}
.workedcols{display:grid;grid-template-columns:1fr 1.7fr;gap:1rem;align-items:stretch}
.workedcols>div{display:flex;flex-direction:column}
.workedcols pre{margin:0;flex:1}
.workedcols .colhead{display:block;font-family:var(--display);font-weight:700;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.45rem}
@media (max-width:640px){.workedcols{grid-template-columns:1fr}}
@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}

/* Print: the guide as a paper document. Ink-friendly, nav stripped. */
@media print{
  :root{--canvas:#FFFFFF;--panel:#F6F3EA;--accent:#A44E12;--accent-hover:#A44E12;--accent-muted:#C9BFA8;--text-secondary:#4A443B;--text-primary:#1E1B16;--btn-ink:#FFFFFF}
  nav.top,.pnav,.skip,.btn,button,footer.site{display:none!important}
  body{background:#FFFFFF;font-size:10.5pt;line-height:1.55}
  main{max-width:100%;padding:0}
  h1{font-size:26pt}
  h2{font-size:16pt;break-after:avoid;border-top-color:#1E1B16}
  h3{break-after:avoid}
  .card,.callout,tr,li{break-inside:avoid}
  details{border:1px solid #C9BFA8;break-inside:auto}
  summary{color:#1E1B16}
  summary::after{display:none}
  pre{background:#F6F3EA;border:1px solid #C9BFA8;white-space:pre-wrap;word-break:break-word}
  code{color:#1E1B16}
  p code,li code{background:#F6F3EA;border-color:#C9BFA8}
  a{color:#A44E12}
  th{color:#A44E12}
  th,td{border-bottom-color:#C9BFA8}
  .tag{color:#A44E12;border-color:#C9BFA8}
  .kicker{color:#A44E12}
  .crumb{display:none}
}

/* ============ visual wave ============ */
.vw svg{display:block;width:100%;height:auto}
.vw svg text{font-family:var(--body);fill:var(--ink)}
.vw svg .mono{font-family:var(--display);font-weight:700}
.vw svg .sub{fill:var(--ink-soft)}
.vw svg .acc{fill:var(--terra-deep)}
.vw svg .slab{fill:var(--paper-deep);stroke:var(--ink);stroke-width:1.3}
.vw svg .slab-dim{fill:var(--paper-deep);stroke:var(--rule);stroke-width:1.2}
.vw svg .slab-danger{fill:none;stroke:var(--oxblood);stroke-width:1.2;stroke-dasharray:5 4}
.vw svg .danger{fill:var(--oxblood)}
.vw svg .dim{opacity:.6}
.vw svg .ln{stroke:var(--rule);fill:none}
.vw svg .ln-acc{stroke:var(--terra-deep);fill:none}
.vw svg .ground{stroke:var(--ink);stroke-width:2;opacity:.85;stroke-linecap:round}
.vw svg .star{fill:var(--terra-deep)}
.vw svg .star-halo{fill:none;stroke:var(--terra-deep);opacity:.45}
.vw svg .arrowline{stroke:var(--ink-soft);fill:none;stroke-width:1.2}
.vw svg .mk{fill:var(--ink-soft)}
.vw svg a{text-decoration:none}
.vw svg a:hover .star{fill:var(--terra)}
.journeystrip{margin:1.1rem 0 1.6rem;max-width:620px}
@media (max-width:680px){
  .vw.wide{overflow-x:auto;padding-bottom:.6rem}
  .vw.wide svg{min-width:840px}
  .vw.wide::before{content:"Continued across \2192 drag to read";display:block;font-family:var(--display);font-weight:700;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);margin-bottom:.6rem}
}
.journeystrip svg{display:block;width:100%;height:auto;overflow:visible}
@media print{.vw,.journeystrip{display:none!important}}

/* ---- curriculum reader: compiled repo content (curriculum/read/) ---- */
.reader .gopen{display:flex;gap:.9rem;align-items:flex-start;border-top:2px solid var(--ink);border-bottom:1px solid var(--rule);padding:.9rem 0;margin:0 0 1.2rem}
.reader .gopen svg{flex:none;display:block}
.reader .gopen h1{font-size:clamp(1.5rem,3vw,2.2rem)}
.reader .rnote{font-size:.85rem;color:var(--ink-soft);max-width:64ch;margin:0 0 2rem}
.reader article.doc{margin:0 0 2.4rem}
.reader article.doc+article.doc{border-top:1px solid var(--rule);padding-top:1.7rem}
.reader .fcrumb{font-family:var(--mono);font-size:.72rem;letter-spacing:.03em;color:var(--ink-soft);margin:0 0 .7rem;display:flex;align-items:center;gap:.45rem;overflow-wrap:anywhere}
.reader .fcrumb svg{display:block;flex:none}
.reader .doc h1{font-size:1.45rem;text-transform:uppercase;border-top:2px solid var(--ink);padding-top:.65rem;margin:0 0 .6rem}
.reader .doc h2{font-size:1.15rem;margin:1.4rem 0 .4rem}
.reader .doc h3{font-size:1rem;margin:1.1rem 0 .3rem}
.reader .doc img{max-width:100%;height:auto;border:1px solid var(--rule)}
.reader .trow{display:flex;gap:.8rem;align-items:center;padding:.55rem .1rem;border-bottom:1px solid var(--rule);font-size:.97rem}
.reader .trow a{flex:1}
.reader .tdev{flex:none;display:flex}
.reader .tcount{font-family:var(--display);font-weight:700;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft);white-space:nowrap}

/* ---- the Night Edition: owner-requested Aug 29. Same world, lamplight ink. ---- */
html[data-theme="night"]{
  --paper:#1B1813; --paper-deep:#26221B; --ink:#F4EFE2; --ink-soft:#BEB4A2;
  --rule:#4E463A; --terra:#C7681D; --terra-deep:#D2802F; --mustard:#D9A419;
  --mustard-deep:#CFA032; --olive:#7E8F6C; --olive-deep:#9AA989; --oxblood:#C96A55;
}
/* hex-drawn SVG plates route through the tokens so both themes re-ink them;
   in day these equal the raw hex, so nothing changes */
svg [fill="#C7681D"]{fill:var(--terra)} svg [fill="#A44E12"]{fill:var(--terra-deep)}
svg [fill="#D9A419"]{fill:var(--mustard)} svg [fill="#1E1B16"]{fill:var(--ink)}
svg [fill="#5C554A"]{fill:var(--ink-soft)} svg [fill="#EAE2CD"]{fill:var(--paper-deep)}
svg [fill="#F4EFE2"]{fill:var(--paper)} svg [fill="#49573C"]{fill:var(--olive-deep)}
svg [fill="#5A6B4A"]{fill:var(--olive)}
svg [stroke="#1E1B16"]{stroke:var(--ink)} svg [stroke="#A44E12"]{stroke:var(--terra-deep)}
svg [stroke="#C9BFA8"]{stroke:var(--rule)}
.modeswitch{background:transparent;border:2px solid var(--ink);color:var(--ink);padding:.35em .8em;font-family:var(--display);font-weight:700;font-size:.68rem;letter-spacing:.12em;cursor:pointer;text-transform:uppercase;margin-left:.6rem;flex:none}
.modeswitch:hover{background:var(--paper-deep)}
/* paper prints as paper: night never reaches the printed page */
@media print{html[data-theme="night"]{--paper:#F4EFE2;--paper-deep:#EAE2CD;--ink:#1E1B16;--ink-soft:#5C554A;--rule:#C9BFA8;--terra:#C7681D;--terra-deep:#A44E12;--mustard:#D9A419;--mustard-deep:#8F6D0C;--olive:#5A6B4A;--olive-deep:#49573C;--oxblood:#8A2F1F}}

/* ============ the motion layer (Sept 2, 2026): the homepage's figure system, shared by every article ============
   One physics: print registration. Plates draw their strokes (stroke-dashoffset on pathLength=1), fills settle,
   prose blocks raise 16px into register as they arrive. assets/motion.js adds .ink / .part / .in on scroll.
   Reduced motion, print, and no-JS all pin the final states, so nothing is ever missing from the page. */
.fig{margin:0;color:var(--terra-deep)}
.fig svg{display:block;width:100%;height:auto;overflow:visible}
.fig .bg{fill:var(--paper-deep);stroke:var(--rule);stroke-width:1}
.fig .pl{font-family:var(--display);font-weight:700;font-size:6.5px;letter-spacing:1.4px;text-transform:uppercase;fill:var(--ink-soft)}
.fig .s{fill:none;stroke:var(--ink);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset .7s var(--ease-inout);transition-delay:calc(var(--i,0)*90ms)}
.fig .s.lt{stroke:var(--ink-soft);stroke-width:1.2}
.fig .s.acc{stroke:currentColor;stroke-width:2.4}
.fig .s.thick{stroke-width:3}
.fig .s.ox{stroke:var(--oxblood)}
.fig .f{opacity:0;transform:scale(.9);transform-box:fill-box;transform-origin:center;transition:opacity .45s var(--ease-out),transform .45s var(--ease-out);transition-delay:calc(var(--i,0)*90ms + .3s)}
.fig .m{transform:translateX(-14px);transition:transform .7s var(--ease-inout);transition-delay:calc(var(--i,0)*90ms + .5s)}
.fig .n{fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;opacity:0;transform:rotate(-82deg);transform-origin:80px 96px;transition:transform .9s var(--ease-inout) .5s,opacity .3s var(--ease-out) .5s}
.fig .t{font-family:var(--display);font-weight:700;font-size:7px;letter-spacing:1.1px;fill:var(--ink-soft);opacity:0;transition:opacity .4s var(--ease-out);transition-delay:calc(var(--i,0)*90ms + .35s)}
.fig .t.onfill{fill:var(--paper)}
.fig .t.acc{fill:currentColor}
.fig .t.ox{fill:var(--oxblood)}
.fig .d{opacity:0;transform:translateY(-12px);transition:opacity .4s var(--ease-out),transform .5s var(--ease-out);transition-delay:calc(var(--i,0)*90ms + .15s)}
.fig.ink .s{stroke-dashoffset:0}
.fig.ink .f{opacity:1;transform:none}
.fig.ink .m{transform:none}
.fig.ink .n{opacity:1;transform:none}
.fig.ink .t{opacity:1}
.fig.ink .d{opacity:1;transform:none}
.fig.op{color:var(--mustard-deep)}
.fig.keep{color:var(--olive-deep)}
/* drawings already on the pages (journey strips, zone bands, the loop, the tree, the minute line, the consoles, the axis) */
.inkzone .s{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset var(--dur,.8s) var(--ease-out);transition-delay:calc(var(--i,0)*90ms)}
.inkzone.ink .s{stroke-dashoffset:0}
.inkzone .d{opacity:0;transform:translateY(-8px);transition:opacity .45s var(--ease-out),transform .55s var(--ease-out);transition-delay:calc(var(--i,0)*90ms)}
.inkzone.ink .d{opacity:1;transform:none}
/* the chapter plate sits in the page header, at the right of the title */
header.page.pagehead{display:grid;grid-template-columns:1fr 168px;column-gap:clamp(1.4rem,4vw,2.6rem);row-gap:0;align-items:start}
header.page.pagehead>:not(.fig){grid-column:1}
header.page.pagehead .fig{grid-column:2;grid-row:1/span 8;width:168px;cursor:pointer}
@media (max-width:600px){
  header.page.pagehead{grid-template-columns:1fr}
  header.page.pagehead .fig{grid-column:1;grid-row:1;width:116px;margin-bottom:1.1rem}
}
/* prose settles into register as it arrives; motion.js tags only blocks below the fold, so nothing flashes and no-JS pages stay whole */
.part{opacity:0;transform:translateY(16px)}
.part.in{opacity:1;transform:none;transition:opacity .6s var(--ease-out),transform .6s var(--ease-out);transition-delay:calc(var(--i,0)*80ms)}
/* final states pinned: paper, and readers who asked for less motion */
/* w2: article drawings (Sept 10, 2026). Glyphs at the cover ledger's size class inside headings, a stamp on each
   document card (placed before the h3 so the Field Guide extractor's regex is untouched), captioned plates in the prose.
   All on the shared .fig classes above; reduced motion, print, and no-JS pins apply unchanged. */
h2 .fig.ico,h3 .fig.ico{display:inline-block;vertical-align:middle;width:1.25em;margin:-.14em .5em 0 0;color:var(--terra-deep)}
h3 .fig.ico{width:1.5em}
.fig.ico svg{display:block;width:100%;height:auto;overflow:visible}
.fig.ico .s{stroke-width:1.9}.fig.ico .s.lt{stroke-width:1.3}.fig.ico .s.acc{stroke-width:2.6}
.fig.ico .t{font-size:11px;letter-spacing:0}
.card{position:relative}
.card .fig.stamp{position:absolute;top:1.2rem;right:1.4rem;width:40px;margin:0;cursor:pointer}
.card .fig.stamp+h3{padding-right:56px}
.fig.plate{max-width:600px;margin:1.6rem 0 1.9rem;cursor:pointer}
.fig.plate.sm{max-width:340px}
.fig.plate .t{font-size:8px}
.fig.plate .pl{font-size:7px}
@media (max-width:600px){.card .fig.stamp{width:32px;top:1rem;right:1rem}.card .fig.stamp+h3{padding-right:44px}}
@media print{h2 .fig.ico,h3 .fig.ico,.card .fig.stamp{display:none}}
/* /w2 */
@media print{.fig .s,.inkzone .s{stroke-dashoffset:0}.fig .f,.fig .t,.fig .n,.fig .d,.inkzone .d{opacity:1;transform:none}.fig .m{transform:none}.part{opacity:1!important;transform:none!important}header.page.pagehead .fig{display:none}}
@media (prefers-reduced-motion: reduce){.fig .s,.inkzone .s{stroke-dashoffset:0}.fig .f,.fig .t,.fig .n,.fig .d,.inkzone .d{opacity:1;transform:none}.fig .m{transform:none}.part{opacity:1;transform:none}}