/* Claude Meter — design tokens (SPEC §1). Shared; owned by the architect. */

@font-face{font-family:"Anybody";src:url(/fonts/anybody.woff2) format("woff2");font-weight:100 900;font-stretch:50% 150%;font-display:swap}
@font-face{font-family:"Instrument Serif";src:url(/fonts/instrument-serif-italic.woff2) format("woff2");font-style:italic;font-weight:400;font-display:swap}
@font-face{font-family:"Geist Mono";src:url(/fonts/geist-mono.woff2) format("woff2");font-weight:100 900;font-display:swap}

@property --fill{syntax:"<percentage>";inherits:true;initial-value:0%}
@property --sq{syntax:"<number>";inherits:false;initial-value:0}
@property --mark{syntax:"<number>";inherits:false;initial-value:1}

:root{
  /* type families */
  --f-display:"Anybody","Arial Narrow",system-ui,sans-serif;
  --f-serif:"Instrument Serif",ui-serif,Georgia,serif;
  --f-mono:"Geist Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --f-ui:-apple-system,BlinkMacSystemFont,"SF Pro Text",system-ui,sans-serif;

  /* type scale (size / leading / tracking); wdth via font-stretch, wght via font-weight */
  --t-wall:clamp(112px,29vw,500px);    --lh-wall:.78;    --tr-wall:-.045em;
  --t-mark:clamp(72px,15.2vw,280px);   --lh-mark:.82;    --tr-mark:-.035em;
  --t-display:clamp(52px,8.6vw,148px); --lh-display:.86; --tr-display:-.035em;
  --t-h2:clamp(42px,6.4vw,112px);      --lh-h2:.9;       --tr-h2:-.03em;
  --t-h3:clamp(26px,2.7vw,42px);       --lh-h3:1.02;     --tr-h3:-.015em;
  --t-lede:clamp(18px,1.45vw,22px);    --lh-lede:1.42;
  --t-body:17px;                       --lh-body:1.55;
  --t-label:12px;
  --t-data:14px;

  /* day */
  --paper:#EDEEE9; --paper-2:#E1E3DC; --paper-3:#D3D6CD;
  --ink:#111311; --ink-2:#4D5149; --ink-3:#7C8077;          /* ink-3: decorative or ≥24px only */
  --rule:rgb(17 19 17 / .14);
  /* night / hardware */
  --black:#000; --night:#070708; --night-2:#121312;
  --fg:#ECEDE8; --fg-2:#A8A8A8; --fg-3:#999;
  --rule-night:rgb(236 237 232 / .12);
  /* the app — Theme.swift, exact */
  --teal:#5CC9A6; --lav:#B0A8ED; --amber:#FAC775; --red:#F26B6B;
  --track:rgb(255 255 255 / .13);
  --rim-top:rgb(255 255 255 / .04); --rim-bot:rgb(255 255 255 / .20);
  /* text-safe accents on paper (≥4.5:1 on --paper) */
  --teal-ink:#146A51; --lav-ink:#5548C2; --amber-ink:#875600; --red-ink:#B3302D;
  /* highlighter marks behind words on paper */
  --hl-teal:rgb(92 201 166 / .42); --hl-amber:rgb(250 199 117 / .55);

  /* contextual (swapped by html[data-night]) */
  --bg:var(--paper); --fg-text:var(--ink); --fg-text-2:var(--ink-2); --rule-c:var(--rule);

  /* layout */
  --maxw:1560px;
  --gutter:clamp(16px,4vw,64px);
  --col-gap:clamp(12px,1.6vw,24px);
  --section-pad:clamp(72px,10vh,150px);
  --band-h:40px;
  --frame:clamp(8px,1vw,14px);
  --r-screen:28px; --r-stage:28px; --r-pill:999px; --r-menu:10px; --r-banner:16px;

  /* depth (never animated) */
  --sh-float:0 24px 60px -20px rgb(10 12 10 / .35), 0 2px 8px rgb(10 12 10 / .12);
  --sh-island:0 18px 40px rgb(0 0 0 / .45);

  /* layers */
  --z-band:80; --z-nav:85; --z-grain:90; --z-cursor:95; --z-iris:100; --z-intro:110; --z-menu:120;

  /* easing */
  --ease-edit:cubic-bezier(.625,.05,0,1); --ease-settle:cubic-bezier(.2,.8,.2,1); --ease-in:cubic-bezier(.5,0,.75,0);
  /* SwiftUI .bouncy(0.4): island OPEN */
  --spring-open:linear(0, 0.017, 0.062, 0.127, 0.205, 0.29, 0.378, 0.466, 0.55, 0.629, 0.702, 0.766, 0.824, 0.873, 0.915, 0.949, 0.978, 1, 1.017, 1.029, 1.038, 1.043, 1.045, 1.046, 1.045, 1.043, 1.039, 1.036, 1.032, 1.028, 1.024, 1.02, 1.016, 1.013, 1.01, 1.008, 1.005, 1.004, 1.002, 1.001, 1, 0.999, 0.999, 0.998, 0.998, 0.998, 0.998, 0.998, 1); --spring-open-dur:590ms;
  /* SwiftUI .smooth(0.4): island CLOSE */
  --spring-close:linear(0, 0.014, 0.05, 0.099, 0.158, 0.222, 0.286, 0.351, 0.413, 0.472, 0.527, 0.579, 0.626, 0.669, 0.707, 0.742, 0.774, 0.801, 0.826, 0.848, 0.868, 0.885, 0.9, 0.913, 0.925, 0.935, 0.943, 0.951, 0.958, 0.964, 0.969, 0.973, 0.977, 0.98, 0.983, 0.985, 0.987, 0.989, 0.991, 0.992, 0.993, 0.994, 0.995, 0.996, 0.996, 0.997, 0.997, 0.998, 1); --spring-close-dur:540ms;
  /* PLAY: small tactile accents only */
  --spring-play:linear(0, 0.03, 0.108, 0.22, 0.352, 0.49, 0.627, 0.754, 0.867, 0.962, 1.037, 1.094, 1.132, 1.154, 1.163, 1.16, 1.149, 1.131, 1.11, 1.088, 1.065, 1.044, 1.025, 1.009, 0.996, 0.986, 0.98, 0.975, 0.974, 0.974, 0.975, 0.978, 0.981, 0.985, 0.989, 0.992, 0.995, 0.998, 1, 1.002, 1.003, 1.004, 1.004, 1.004, 1.004, 1.004, 1.003, 1.003, 1); --spring-play-dur:1170ms;
  --d-micro:180ms; --d-ui:320ms; --d-reveal:900ms;
}
@media (min-width:1024px){ :root{ --t-body:18px } }
@media (max-width:767px){ :root{ --band-h:44px } }

/* Night swaps the contextual tokens per section (lib/night.js adds .is-night to the sections on screen),
   never on :root: an inherited custom property changed at the root restyles every element. */
.is-night{
  --bg:var(--night); --fg-text:var(--fg); --fg-text-2:var(--fg-2); --rule-c:var(--rule-night);
  color:var(--fg-text);
}