/* Static SEO pages (public/*-visualizer/). Same look as /guide/, no JS, no build step. */
:root { --ink:#EAE6DD; --dim:#8C867C; --bg:#0C0B0B; --line:#221F1D; --gold:#E5A93C; color-scheme: dark; }
* { box-sizing:border-box; }
body { margin:0 auto; background:var(--bg); color:var(--ink);
  font:400 16px/1.7 'IBM Plex Mono', ui-monospace, monospace;
  padding:8vmin 6vw; max-width:760px; }
h1,h2 { font-family:'Syne', system-ui, sans-serif; line-height:1.15; letter-spacing:-0.01em; text-wrap:balance; }
h1 { font-size:clamp(28px,5vw,44px); font-weight:800; margin:0 0 .4em; }
h2 { font-size:clamp(19px,2.6vw,25px); font-weight:600; margin:2.6em 0 .7em; }
p, li { color:#C9C3B8; }
a { color:var(--gold); }
code, kbd { background:#181614; border:1px solid var(--line); border-radius:5px; padding:1px 6px; font-size:.88em; color:var(--ink); word-break:break-all; }
table { border-collapse:collapse; width:100%; margin:1.2em 0; font-size:.92em; }
th, td { text-align:left; padding:.55em .7em; border-bottom:1px solid var(--line); vertical-align:top; }
th { color:var(--dim); font-weight:500; }
.lede { font-size:1.06em; color:var(--ink); }
.cta { display:inline-block; margin:1.4em 0 0; padding:.75em 1.5em; background:var(--ink); color:#111; text-decoration:none; border-radius:99px; font-weight:500; }
.cta:focus-visible, a:focus-visible { outline:2px solid var(--gold); outline-offset:3px; }
details { border-bottom:1px solid var(--line); padding:.8em 0; }
summary { cursor:pointer; color:var(--ink); }
footer { margin-top:5em; padding-top:1.4em; border-top:1px solid var(--line); color:var(--dim); font-size:.86em; }
footer nav { display:flex; flex-wrap:wrap; gap:.4em 1.2em; margin-bottom:1em; }