/* Shared reset and article body. Layout, color and type live in theme-*.css. */
*,*::before,*::after{box-sizing:border-box}
html{overflow-x:clip;-webkit-text-size-adjust:100%}
body{margin:0;overflow-x:clip;background:var(--color-paper);color:var(--color-ink);font:400 1.0625rem/1.68 var(--font-body)}
.wrap{max-width:var(--max);margin:0 auto;padding:0 16px}
a{color:var(--color-link);text-underline-offset:3px}
a:hover{color:var(--color-ink)}
a:focus-visible,summary:focus-visible{outline:2px solid var(--color-focus);outline-offset:2px}
.skip{position:absolute;left:-999px}
.skip:focus{left:16px;top:8px;background:var(--color-paper);padding:8px;z-index:3}
h1,h2,h3{font-family:var(--font-display);font-style:normal;line-height:1.12;overflow-wrap:anywhere;min-width:0}
.crumbs{font-size:.875rem}
.crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:4px 8px;margin:0;padding:0}
.crumbs li:not(:last-child)::after{content:"/";margin-left:8px;opacity:.6}
.byline{font-size:.9rem;margin:10px 0 0}
.article{display:grid;grid-template-columns:minmax(0,1fr);gap:32px;padding:0 0 56px}
.answer{font-size:1.14rem;line-height:1.6}
.prose{max-width:72ch}
.prose h2,.faq h2,.sources h2{font-size:1.65rem;margin:40px 0 10px}
.prose li{margin:5px 0}
pre{background:var(--color-code);color:var(--color-code-ink);padding:16px;overflow-x:auto;font:400 .9rem/1.55 var(--font-mono);max-width:100%}
code{font-family:var(--font-mono);font-size:.92em;overflow-wrap:anywhere}
pre code{font-size:inherit;overflow-wrap:normal}
details{border-bottom:1px solid var(--color-rule);padding:10px 0}
summary{cursor:pointer;font-weight:600}
.sources ol{padding-left:20px;font-size:.95rem}
.side{font-size:.95rem;min-width:0}
.side h2{font:700 .8rem/1.3 var(--font-body);letter-spacing:.05em;text-transform:uppercase;margin:0 0 8px;color:var(--color-ink-2)}
.side ul{list-style:none;margin:0 0 24px;padding:0}
.side li{padding:4px 0}
.page{max-width:70ch;padding:32px 0 56px}
.page h1{font-size:2.4rem}
.foot ul{list-style:none;display:flex;flex-wrap:wrap;gap:4px 18px;margin:10px 0;padding:0}
.fine{font-size:.85rem;margin:8px 0 0}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}

.prose figure{margin:24px 0}.prose img{max-width:100%;height:auto;display:block}.trust{margin-top:36px;padding-top:16px;border-top:1px solid currentColor;font-size:.92rem}.trust h2{font-size:1.1rem;margin:0 0 6px}

/* Hallmark · macrostructure: Map Diagram (home) + Workbench docs (articles) · tone: technical · anchor hue: amber 85
 * theme: custom · vibe: "graphite terminal, node map, signal amber" · paper oklch(19% .015 250) · accent oklch(83% .16 85)
 * display/body/mono: Space Grotesk + IBM Plex Sans + JetBrains Mono · axes: dark / grotesk-sans / warm · nav: N3 side-rail · footer: Ft1 · enrichment: Tier B seeded SVG
 */
@font-face{font-family:"Space Grotesk";src:url(/assets/fonts/grotesk-700.woff2) format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url(/assets/fonts/plex-400.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"IBM Plex Sans";src:url(/assets/fonts/plex-600.woff2) format("woff2");font-weight:600;font-display:swap}
@font-face{font-family:"JetBrains Mono";src:url(/assets/fonts/mono-400.woff2) format("woff2");font-weight:400;font-display:swap}
:root{--color-paper:oklch(19% .015 250);--color-paper-2:oklch(23.5% .018 250);--color-paper-3:oklch(28% .02 250);--color-ink:oklch(95% .008 250);--color-ink-2:oklch(76% .015 250);--color-rule:oklch(34% .02 250);
--color-accent:oklch(83% .16 85);--color-link:oklch(84% .13 85);--color-focus:oklch(83% .16 85);--color-a:oklch(76% .12 240);--color-b:oklch(83% .16 85);--color-c:oklch(78% .13 165);
--color-code:oklch(14.5% .012 250);--color-code-ink:oklch(90% .03 165);--max:1240px;
--font-display:"Space Grotesk",system-ui,sans-serif;--font-body:"IBM Plex Sans",system-ui,sans-serif;--font-mono:"JetBrains Mono",ui-monospace,monospace}
h1,h2,h3{font-weight:700;letter-spacing:-.02em}
.head{border-bottom:1px solid var(--color-rule);background:var(--color-paper-2)}
.head .wrap{display:flex;flex-wrap:wrap;align-items:center;gap:8px 28px;padding-top:12px;padding-bottom:12px}
.brand{display:inline-flex;align-items:center;gap:10px;font:700 1.15rem/1 var(--font-display);color:var(--color-ink);text-decoration:none}
.brand span{background:var(--color-accent);color:var(--color-code);font:400 .8rem/1 var(--font-mono);padding:7px 6px}
.head nav{display:flex;flex-wrap:wrap;gap:4px 20px;font-size:.92rem}
.head nav a{color:var(--color-ink-2);text-decoration:none;white-space:nowrap}
.head nav a:hover{color:var(--color-accent)}
.hero{padding:44px 0 24px}
.hero h1{font-size:clamp(2.4rem,7vw,4.6rem);margin:0 0 12px}
.lede{font-size:1.15rem;color:var(--color-ink-2);max-width:60ch;margin:0}
.map{display:block;width:100%;height:auto;margin:20px 0 4px}
.map .spine{stroke:var(--color-rule);stroke-width:2;stroke-dasharray:4 7}
.map .edge{stroke-width:1;opacity:.35;transition:opacity .15s}
.map .node{transition:r .15s}
.map a:hover .node,.map a:focus .node{r:11}
.map a:hover .edge{opacity:1}
.map .hub{fill:var(--color-paper-2);stroke-width:2}
.map text{fill:var(--color-ink);font:700 15px var(--font-display)}
.map-note{font:400 .8rem var(--font-mono);color:var(--color-ink-2);margin:0}
.band{border-top:1px solid var(--color-rule);padding:36px 0}
.band h2{font-size:1.9rem;margin:0 0 6px}
.band h2 a{color:var(--g);text-decoration:none}
.cards{list-style:none;margin:20px 0 0;padding:0;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(min(100%,290px),1fr))}
.cards a{display:flex;flex-direction:column;gap:8px;height:100%;padding:16px;background:var(--color-paper-2);border:1px solid var(--color-rule);text-decoration:none;color:var(--color-ink);transition:border-color .15s}
.cards a:hover{border-color:var(--color-accent)}
.cards span{font-size:.92rem;color:var(--color-ink-2)}
.glyph{width:120px;height:72px;flex:none}
.glyph line{stroke:var(--g);stroke-width:1.2;opacity:.6}
.glyph circle{fill:var(--g)}
.doc-head{background:var(--color-paper-2);border-bottom:1px solid var(--color-rule);padding:20px 0 26px}
.doc-head a{color:var(--color-ink-2)}
.doc-head h1{font-size:clamp(1.9rem,4.6vw,3.1rem);margin:0}
.doc-title{display:flex;align-items:center;gap:20px;margin-top:16px}
.doc-title .glyph{width:160px;height:96px;display:none}
.doc-head .byline{color:var(--color-ink-2);font-family:var(--font-mono);font-size:.8rem}
.doc-head .lede{margin-top:10px}
.docs{display:grid;grid-template-columns:minmax(0,1fr);gap:0 32px;padding-top:28px}
.rail{display:none;font-size:.86rem}
.rail details{border:0;padding:0 0 10px}
.rail summary{color:var(--g);font-family:var(--font-display);font-weight:700}
.rail ul{list-style:none;margin:6px 0 0;padding:0 0 0 10px;border-left:1px solid var(--color-rule)}
.rail li{padding:3px 0}
.rail a{color:var(--color-ink-2);text-decoration:none}
.rail a:hover{color:var(--color-accent)}
.answer{border:1px solid var(--color-accent);padding:16px 18px;background:var(--color-paper-2)}
.answer::before{content:"$ answer";display:block;font:400 .78rem var(--font-mono);color:var(--color-accent);margin-bottom:6px}
.prose h2{border-top:1px solid var(--color-rule);padding-top:22px}
pre{border-left:3px solid var(--color-c)}
.foot{border-top:1px solid var(--color-rule);padding:26px 0;color:var(--color-ink-2);font-size:.92rem}
.foot a{color:var(--color-ink-2)}
@media (min-width:768px){.doc-title .glyph{display:block}}
@media (min-width:1080px){.docs{grid-template-columns:230px minmax(0,1fr)}.rail{display:block;position:sticky;top:16px;align-self:start;max-height:calc(100vh - 32px);overflow-y:auto}.article{grid-template-columns:minmax(0,1fr) 230px}.side{position:sticky;top:16px;align-self:start}}
