/* Awesome Cause Labs — design tokens
   GENERATED by scripts/build-tokens.mjs from design-system/tokens.json. Do not edit by hand.
   Themes: "Paper" (light, default) and "Night watch" (dark).
   Dark applies when the OS prefers it unless <html data-theme="light"> forces Paper;
   <html data-theme="dark"> forces Night watch. */

:root {
  color-scheme: light;
  --brand-ink: #231f20;
  --brand-pink: #e7178d;
  --brand-navy: #323a66;
  --brand-seafoam: #dcefe2;
  --brand-black: #0a0909;
  --surface: #f7f4ec;
  --surface-raised: #ffffff;
  --surface-sunk: #ece7da;
  --grid: #dde1ee;
  --line: #d3cdbf;
  --border: #231f20;
  --ink: #231f20;
  --ink-muted: #5d5853;
  --accent: #d4127f;
  --on-accent: #ffffff;
  --accent-text: #b4106c;
  --accent-soft: #fde2f0;
  --deep: #323a66;
  --on-deep: #f7f4ec;
  --seafoam: #dcefe2;
  --on-seafoam: #323a66;
  --focus: #323a66;
  --tape: rgba(220, 239, 226, 0.78);
  --stage-napkin: #7a5200;
  --stage-napkin-soft: #f8e8bf;
  --stage-workbench: #323a66;
  --stage-workbench-soft: #e2e5f4;
  --stage-trial: #b4106c;
  --stage-trial-soft: #fde2f0;
  --stage-shipped: #1b5e48;
  --stage-shipped-soft: #dcefe2;
  --stage-scuttled: #5d5853;
  --stage-scuttled-soft: #e9e5dc;
  --shadow-sticker: 4px 4px 0 #231f20;
  --shadow-sticker-sm: 2px 2px 0 #231f20;
  --shadow-sticker-lift: 7px 7px 0 #231f20;
}

:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 72px;
  --space-9: 120px;
  --grid-pitch: 24px;
  --radius-sm: 4px;
  --radius-md: 10px;
  --radius-lg: 18px;
  --radius-pill: 999px;
  --stroke-hair: 1px;
  --stroke-rule: 2px;
  --stroke-heavy: 3px;
  --font-sans: "Archivo", "Helvetica Neue", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
  --font-hand: "Caveat", "Bradley Hand", "Segoe Print", cursive;
  --font-marker: "Permanent Marker", "Marker Felt", "Comic Sans MS", cursive;
  --font-wordmark: "Montserrat", "Archivo", "Helvetica Neue", Arial, sans-serif;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --brand-ink: #231f20;
    --brand-pink: #e7178d;
    --brand-navy: #323a66;
    --brand-seafoam: #dcefe2;
    --brand-black: #0a0909;
    --surface: #15172a;
    --surface-raised: #1e2140;
    --surface-sunk: #0e0f1e;
    --grid: #242846;
    --line: #343858;
    --border: #c9c8da;
    --ink: #f4f1e8;
    --ink-muted: #aeb0c6;
    --accent: #ff3d9e;
    --on-accent: #15172a;
    --accent-text: #ff7cbd;
    --accent-soft: #41132f;
    --deep: #3d4787;
    --on-deep: #f4f1e8;
    --seafoam: #dcefe2;
    --on-seafoam: #15172a;
    --focus: #a9b2ee;
    --tape: rgba(220, 239, 226, 0.38);
    --stage-napkin: #f2c35b;
    --stage-napkin-soft: #3a2c0a;
    --stage-workbench: #a9b2ee;
    --stage-workbench-soft: #262c55;
    --stage-trial: #ff7cbd;
    --stage-trial-soft: #41132f;
    --stage-shipped: #8fdcb6;
    --stage-shipped-soft: #163a2e;
    --stage-scuttled: #aeb0c6;
    --stage-scuttled-soft: #262838;
    --shadow-sticker: 4px 4px 0 #3d4787;
    --shadow-sticker-sm: 2px 2px 0 #3d4787;
    --shadow-sticker-lift: 7px 7px 0 #3d4787;
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --brand-ink: #231f20;
  --brand-pink: #e7178d;
  --brand-navy: #323a66;
  --brand-seafoam: #dcefe2;
  --brand-black: #0a0909;
  --surface: #15172a;
  --surface-raised: #1e2140;
  --surface-sunk: #0e0f1e;
  --grid: #242846;
  --line: #343858;
  --border: #c9c8da;
  --ink: #f4f1e8;
  --ink-muted: #aeb0c6;
  --accent: #ff3d9e;
  --on-accent: #15172a;
  --accent-text: #ff7cbd;
  --accent-soft: #41132f;
  --deep: #3d4787;
  --on-deep: #f4f1e8;
  --seafoam: #dcefe2;
  --on-seafoam: #15172a;
  --focus: #a9b2ee;
  --tape: rgba(220, 239, 226, 0.38);
  --stage-napkin: #f2c35b;
  --stage-napkin-soft: #3a2c0a;
  --stage-workbench: #a9b2ee;
  --stage-workbench-soft: #262c55;
  --stage-trial: #ff7cbd;
  --stage-trial-soft: #41132f;
  --stage-shipped: #8fdcb6;
  --stage-shipped-soft: #163a2e;
  --stage-scuttled: #aeb0c6;
  --stage-scuttled-soft: #262838;
  --shadow-sticker: 4px 4px 0 #3d4787;
  --shadow-sticker-sm: 2px 2px 0 #3d4787;
  --shadow-sticker-lift: 7px 7px 0 #3d4787;
}