/* v06-pixel — token overrides. Orange on warm black with a yellow that only
   ever appears as a solid shadow or a rule. Everything is chunky: three-pixel
   lines, forty-four-pixel notches, eight-pixel shadows. */

:root {
  --bg: #0c0906;
  --surface: #161009;
  --surface-2: #1d150c;
  --surface-3: #251b10;
  --border: #2a1e12;
  --border-2: #6b4a22;
  --text: #fff3e2;
  --text-dim: #c9ae8d;
  --text-faint: #a68c6d;

  --accent: #ff7a18;
  --accent-hi: #ffa85c;
  --accent-2: #ffd400;
  --accent-2-hi: #ffe873;
  --on-accent: #1a0d00;

  --font-display: var(--font-brand);
  --display-1: clamp(2rem, 4.4vw, 3.75rem);
  --display-2: clamp(1.5rem, 3vw, 2.5rem);

  --notch: 44px;
  --notch-sm: 16px;
  --line-w: 3px;
  --line: var(--border-2);
  --shadow-x: 12px;
  --shadow-y: 12px;
  --shadow-hover-x: 17px;
  --shadow-hover-y: 17px;

  --dot-color: color-mix(in srgb, var(--accent) 20%, transparent);
  --dot-gap: 32px;
  --dot-size: 2px;
  --dot-parallax: 0.2;

  --dither-cell: 8px;
  --dither-tint: color-mix(in srgb, var(--accent) 50%, transparent);
  --dither-band-height: clamp(180px, 22vw, 320px);

  --crt-opacity: 0.1;
  --crt-line: 4px;
  --crt-vignette: 0.45;

  --arrow-color: var(--accent-2);
  --arrow-width: 8px;
  --arrow-dash: 14 14;
  --arrow-glow: color-mix(in srgb, var(--accent-2) 35%, transparent);
  --arrow-head: 28px;
}