/* ==========================================================================
   CRIT — design tokens.
   Monochrome by constitution. Silver is the only warmth allowed.
   ========================================================================== */

:root {
  /* -- surface ------------------------------------------------------- */
  --void: #050506;
  --ink: #08080a;
  --carbon: #0c0c0f;
  --charcoal: #121217;
  --graphite: #1a1a20;
  --steel: #26262f;
  --dim: #3d3d49;
  --silver-d: #5c5c69;
  --silver: #82828f;
  --ash: #a9a9b5;
  --bone: #dcdce2;
  --white: #fbfbfc;

  /* -- ink weights --------------------------------------------------- */
  --fg: #d9d9e0;
  --fg-soft: #a9a9b5;
  --fg-mute: #6f6f7d;
  --fg-faint: #4a4a56;
  --line: rgba(255, 255, 255, 0.09);
  --line-soft: rgba(255, 255, 255, 0.05);
  --line-strong: rgba(255, 255, 255, 0.16);

  /* -- type ---------------------------------------------------------- */
  --font-display: 'Archivo', 'Helvetica Neue', Arial, sans-serif;
  --font-body: 'Instrument Sans', 'Helvetica Neue', Arial, sans-serif;
  --font-meta: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  --type-giant: clamp(4rem, 15.5vw, 17rem);
  --type-xxl: clamp(3rem, 9.6vw, 10.5rem);
  --type-xl: clamp(2.1rem, 5.6vw, 6rem);
  --type-lg: clamp(1.5rem, 3.1vw, 3.4rem);
  /* Floor raised so every name is legible at a glance. The scale keeps its
     hierarchy (giant anchors down to quiet index entries) but nothing is
     allowed to render below a comfortable reading size. */
  --type-md: clamp(1.15rem, 1.7vw, 1.9rem);
  --type-sm: clamp(0.98rem, 1.18vw, 1.34rem);
  --type-xs: clamp(0.86rem, 0.94vw, 1.02rem);
  --type-meta: 0.8rem;

  --track-mega: -0.045em;
  --track-tight: -0.03em;
  --track-snug: -0.015em;
  --track-wide: 0.06em;
  --track-meta: 0.26em;
  --track-max: 0.52em;

  --leading-flat: 0.84;
  --leading-tight: 0.94;
  --leading-snug: 1.06;
  --leading-body: 1.62;

  /* -- rhythm -------------------------------------------------------- */
  --gap-xs: 0.5rem;
  --gap-sm: 0.9rem;
  --gap: 1.4rem;
  --gap-lg: 2.2rem;
  --gap-xl: 3.6rem;
  --gutter: clamp(1.1rem, 3.2vw, 3.4rem);
  --edge: clamp(1rem, 2.6vw, 2.6rem);

  /* -- depth layers (spec 48) ---------------------------------------- */
  --z-void: 0;
  --z-atmosphere: 10;
  --z-fragments: 12;
  --z-depth: 16;
  --z-light: 20;
  --z-micro: 24;
  --z-media: 30;
  --z-type: 40;
  --z-ui: 60;
  --z-chrome: 70;
  --z-preview: 80;
  --z-cursor: 92;
  --z-transition: 96;
  --z-entrance: 100;

  /* -- motion -------------------------------------------------------- */
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in-out-quart: cubic-bezier(0.76, 0, 0.24, 1);
  --ease-out-soft: cubic-bezier(0.22, 0.61, 0.36, 1);
  --ease-in-tight: cubic-bezier(0.55, 0, 0.85, 0.35);

  --t-micro: 160ms;
  --t-fast: 260ms;
  --t-base: 420ms;
  --t-slow: 720ms;
  --t-scene: 1100ms;

  /* -- live values written by the engines --------------------------- */
  --cursor-x: 50vw;
  --cursor-y: 50vh;
  --light-x: 50vw;
  --light-y: 42vh;
  --light-energy: 0.4;
  --audio-level: 0;
  --audio-band-low: 0;
  --audio-band-mid: 0;
  --grain-opacity: 0.05;
  --entrance-progress: 0;
  --portal-radius: 150%;
  --accent: transparent;
  --env-speed: 1;
  --env-dim: 1;

  color-scheme: dark;
}

/* Animation intensity scales every ambient movement without ever making the
   experience chaotic. MAXIMUM is still coherent — it is simply more alive. */
html[data-intensity='subtle'] { --env-speed: 0.55; --light-energy: 0.3; --grain-opacity: 0.038; }
html[data-intensity='normal'] { --env-speed: 0.78; --light-energy: 0.36; --grain-opacity: 0.045; }
html[data-intensity='cinematic'] { --env-speed: 1; --light-energy: 0.42; --grain-opacity: 0.05; }
html[data-intensity='maximum'] { --env-speed: 1.22; --light-energy: 0.5; --grain-opacity: 0.056; }