/* South Swell runtime tokens. Reference: materials/DESIGN-TOKENS.md */
:root {
  /* Existing paper-and-ink palette; terrain and generated artwork keep their colors. */
  --paper: #f3edda;
  --ink: #203e4b;
  --sun: #f2d55c;
  --orange: #d45d39;
  --sea: #0b374a;

  /* Compact sea-glass utilities, separate from the matte paper stickers. */
  --field-surface: #efdfc67d;
  --field-ink: #0e2a32;
  --field-muted: var(--ink);
  --field-line: #173b432e;
  --field-highlight: #fff8e659;
  --field-filter: blur(26px) saturate(1.3) brightness(1.05);
  --field-grain-opacity: .5;

  --font-display: 'Dela Gothic One', 'Arial Black', sans-serif;
  --font-sans: 'Google Sans', 'Helvetica Neue', Arial, sans-serif;
  --font-body: 'Space Mono', 'Courier New', monospace;
  --font-data: 'Space Mono', ui-monospace, monospace;
  --text-micro: .5rem;
  --text-meta: .5625rem;
  --text-small: .625rem;
  --text-label: .6875rem;
  --text-body: .75rem;
  --text-place: 1rem;
  --text-reading: .875rem;
  --text-title: 1.4375rem;
  --weight-regular: 400;
  --weight-semibold: 700;

  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --control-size: 44px;
  --radius-sticker: 2px;
  --radius-pill: 999px;
  --shadow-paper: 2px 5px 0 #001e2f33;
  --shadow-label: 0 2px 3px #001f2c22;

  /* Coastal paper boards: shared material values, extracted from films.css. */
  --surface-sand: #dcd0c2;
  --paper-stock-cream: #f5edda;
  --paper-stock-coral: #e7b4a4;
  --paper-stock-blue: #b6ccca;
  --paper-stock-rust: #ad472b;
  --texture-paper: url('assets/field-grain.svg');
  --texture-tape: url('assets/runtime/sticker-tape-fragments.webp');
  --paper-grain-opacity: .18;
  --paper-note-grain-opacity: .3;
  --shadow-paper-card: 0 1px 2px #203e4b40, 3px 10px 14px -7px #203e4b66;
  --shadow-paper-note: 2px 4px 3px #203e4b25;
  /* Filter shadows are argument lists for drop-shadow(), not box-shadow. */
  --shadow-paper-cutout: 1px 4px 2px #203e4b33;
  --shadow-paper-sticker: 1px 3px 2px #203e4b35;
  --paper-card-padding: 12px 12px 18px;
  --paper-card-padding-compact: 10px 10px 17px;
  --paper-note-padding: 30px 24px 35px;
  --paper-note-padding-compact: 26px 22px 30px;
  --tape-width: 128px;
  --tape-width-compact: 100px;
  --tape-aspect-ratio: 880 / 230;

  /* Single film-grain layer above every surface; alpha-channel noise tile. */
  --grain-opacity: .2;

  --layer-wash: 1;
  --layer-marker: 2;
  --layer-chrome: 4;
  --layer-note: 5;
  --layer-status: 6;
  --layer-skip: 30;
  --layer-grain: 90;
}
