/* Design tokens and document defaults. Page sizes stay in page styles. */
:root {
  --paper:#302f2f; --surface:#242322; --ink:#e3e3e3; --muted:#bfbdb8; --acid:#7de0ce; --line:rgba(227,227,227,.16);
  --accent-border:rgba(125,224,206,.72); --accent-wash:rgba(125,224,206,.1);
  --font-body:Poppins,sans-serif; --font-heading:"Space Grotesk",sans-serif; --font-hand:Caveat,cursive;
  --page-width:1240px; --page-gutter:clamp(20px,4vw,48px);
  --space-2:8px; --space-3:12px; --space-4:16px; --space-6:24px;
  --type-display:clamp(56px,9vw,128px); --type-page-title:clamp(36px,5.4vw,72px);
  --type-section-title:clamp(28px,3.6vw,48px); --type-subtitle:clamp(22px,2.4vw,30px);
  --type-intro:clamp(19px,2.1vw,26px); --type-body:clamp(16px,1.3vw,18px); --type-label:11px;
  --leading-text:1.7; --leading-intro:1.5; --leading-heading:1.1;
  --measure-text:62ch; --measure-intro:54ch;
  --section-space:clamp(40px,6vw,80px); --paragraph-space:18px;
  --layer-decoration:0; --layer-visual:1; --layer-content:2; --layer-controls:3; --layer-header:10; --layer-menu:20; --layer-modal:100;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:var(--font-body); }
a { color:inherit; text-decoration:none; }
h1,h2,h3 { margin:0; font-family:var(--font-heading); font-weight:600; letter-spacing:-.06em; line-height:var(--leading-heading); }
h1 { font-size:var(--type-page-title); line-height:1; }
h2 { font-size:var(--type-section-title); }
h3 { font-size:var(--type-subtitle); }
h1 em,h2 em { color:var(--acid); font-family:var(--font-hand); font-size:1.12em; font-style:normal; font-weight:600; letter-spacing:-.04em; }
.page-container { max-width:var(--page-width); margin:auto; }

:focus-visible { outline:2px solid var(--acid); outline-offset:3px; }
#main-content { scroll-margin-top:var(--header-clearance); }
#main-content:focus { outline:none; }
.skip-link { position:fixed; top:8px; left:8px; z-index:var(--layer-modal); min-height:44px; padding:12px 16px; background:var(--surface); color:var(--ink); transform:translateY(-160%); }
.skip-link:focus { transform:none; }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
html:has(dialog[open]) { overflow:hidden; }