/* PoemMetaVis · shared CSS (loaded by all pages)
   Contains: theme vars, resets, container, ::selection, .reveal, focus-visible */

:root{
  --bg:#F5F0E8; --bg-2:#FAF6EF; --bg-3:#EEE8DC;
  --ink:#14110F; --ink-2:#4A453E; --ink-3:#8A8278;
  --rule:#DCD4C5;
  --east:#B23A2F; --west:#2D4A5E; --gold:#C9A35B;
  --serif:"Cormorant Garamond","EB Garamond",Georgia,"Times New Roman",serif;
  --sans:"Inter",system-ui,-apple-system,Segoe UI,Roboto,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
  --han:"Noto Serif SC",serif;
  --max:1440px; --pad:clamp(18px,8vw,120px);
  --ease:cubic-bezier(.22,.61,.36,1);
  --shadow:0 1px 2px rgba(20,17,15,.04),0 8px 24px -8px rgba(20,17,15,.10);
}
:root.dark{
  --bg:#262119; --bg-2:#2E2820; --bg-3:#383128;
  --ink:#F2EADC; --ink-2:#CFC6B6; --ink-3:#9A9082; --rule:#423B30;
  --east:#D45A4E; --west:#6A93AD; --gold:#E0BC78;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 8px 24px -8px rgba(0,0,0,.6);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
html{scroll-behavior:smooth}
::selection{background:var(--gold);color:var(--ink)}
.container{max-width:var(--max);margin:0 auto;padding-inline:var(--pad)}
a{color:inherit;text-decoration:none}

/* shared reveal animation */
.reveal{opacity:0;transform:translateY(18px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}}

/* keyboard focus ring (accessibility) */
*:focus-visible{outline:2px solid var(--west);outline-offset:2px;border-radius:3px}

/* utility classes (replacing repeated inline styles) */
.head-row{display:grid;grid-template-columns:1fr 2fr;gap:32px;align-items:end}
.head-row.with-margin{margin-bottom:36px}
.tight-top{padding-top:clamp(12px,1.4vw,20px) !important}

/* paper noise + tint (shared, was duplicated inline in each page) */
body{
  font-family:var(--sans);background:var(--bg);color:var(--ink);
  font-size:16px;line-height:1.6;
  -webkit-font-smoothing:antialiased;
  background-image:
    radial-gradient(1100px 600px at 85% -5%, rgba(178,58,47,.04), transparent 60%),
    radial-gradient(1000px 700px at -5% 30%, rgba(45,74,94,.05), transparent 60%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='240' height='240'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .08  0 0 0 0 .07  0 0 0 0 .05  0 0 0 .03 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}