/* Design tokens shared by the entrance (home.html), the one page (one.html) and the world (index.html).
   Type is Geist and Geist Mono only: Geist talks, Geist Mono labels. Gold is the one accent;
   crimson at most once per page. */

@font-face{font-family:"Geist";font-style:normal;font-weight:300 700;font-display:swap;src:url(fonts/geist.woff2) format("woff2")}
@font-face{font-family:"Geist Mono";font-style:normal;font-weight:400 600;font-display:swap;src:url(fonts/geist-mono.woff2) format("woff2")}

:root{
  color-scheme:dark;

  /* colour */
  --c-ink:#0b0b0f;          /* ground, near-black with an indigo bias */
  --c-ink-2:#121218;        /* raised surface */
  --c-ink-3:#1a1a22;        /* hover surface */
  --c-ivory:#ece6da;        /* primary text, marble */
  --c-ivory-2:#aaa597;      /* secondary text */
  --c-ivory-3:#86827a;      /* captions, meta (4.9:1 on ink) */
  --c-gold:#c9a45c;         /* gold leaf */
  --c-gold-2:#e2c88f;       /* gold on hover */
  --c-crimson:#9b2f2a;      /* the traveller's cloak */
  --c-rule:rgba(236,230,218,.12);
  --c-rule-2:rgba(236,230,218,.22);
  --c-glass:rgba(14,14,20,.72);

  /* type */
  --f-display:"Geist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;  /* set at 500 with --tr-display */
  --f-sans:"Geist",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-mono:"Geist Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  /* scale: 1.25 for UI, display sizes fluid */
  --fs-xs:12px; --fs-sm:13.5px; --fs-md:16px; --fs-lg:18px; --fs-xl:22px;
  --fs-d1:clamp(30px,3.6vw,44px);
  --fs-d2:clamp(38px,5.4vw,72px);
  --fs-d3:clamp(48px,8.2vw,124px);
  --lh-tight:1; --lh-snug:1.15; --lh-body:1.6;
  --tr-caps:.16em; --tr-display:-.04em; --tr-title:-.025em;

  /* space (4px base) */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:144px;
  --gutter:max(20px,env(safe-area-inset-left,0px));
  --gutter-r:max(20px,env(safe-area-inset-right,0px));
  --measure:64ch;
  --page:1280px;

  /* shape */
  --r-sm:6px; --r-md:10px; --r-lg:14px; --r-pill:999px;
  --arch:50% 50% var(--r-md) var(--r-md) / 34% 34% var(--r-md) var(--r-md);

  /* motion */
  --ease-out:cubic-bezier(.16,1,.3,1);
  --ease-io:cubic-bezier(.65,0,.35,1);
  --ease-in:cubic-bezier(.7,0,.84,0);
  --t-micro:140ms; --t-ui:240ms; --t-layout:520ms; --t-cine:900ms; --t-world:1400ms;
  --stagger:70ms;

  /* depth */
  --z-hud:30; --z-menu:40; --z-dialog:50; --z-veil:60;
  --shadow-pop:0 30px 80px -24px rgba(0,0,0,.85),0 0 0 1px var(--c-rule);
}

@media (prefers-reduced-motion:reduce){
  :root{--t-micro:1ms;--t-ui:1ms;--t-layout:1ms;--t-cine:1ms;--t-world:1ms;--stagger:0ms}
}
