/* Extracted from the landing page: existing pigments, fonts, ticket radii and shadows. */
:root {
  --paper: #fffafd;
  --surface: #ffffff;
  --ink: #24153e;
  --purple: #39215f;
  --brand-ink: #39215f;
  --yellow: #ffdd48;
  --pink: #ef93b7;
  --teal: #08756b;
  --muted: #655971;
  --line: #c6bdce;
  --error: #9c1740;
  --dark-paper: #19132c;
  --font-body: "Trebuchet MS", "Arial Rounded MT Bold", sans-serif;
  --font-display: "Arial Black", sans-serif;
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-6: 24px; --space-8: 32px; --space-12: 48px;
  --text-xs: .75rem; --text-sm: .875rem; --text-base: 1rem;
  --text-lg: 1.25rem; --text-xl: 1.5rem; --text-2xl: 2rem; --text-3xl: 3rem;
  --radius-sm: 8px; --radius-control: 10px; --radius-panel: 12px; --radius-ticket: 22px;
  --border-thin: 1px; --border-control: 2px; --border-ticket: 3px;
  --shadow-ticket: 7px 7px 0 var(--purple);
  --shadow-ticket-mobile: 5px 5px 0 var(--purple);
  --shadow-tile: 0 5px 0 var(--brand-ink);
  --shadow-control: 0 3px 0 var(--purple);
  --tap-size: 56px; --page-max: 1280px; --gutter: var(--space-4);
  --focus-ring: var(--border-ticket) solid var(--teal);
  --scrim: color-mix(in srgb, var(--dark-paper) 74%, transparent);
  --stamp-tint: color-mix(in srgb, var(--brand-ink) 8%, transparent);
  --turn-tint: color-mix(in srgb, var(--yellow) 16%, var(--surface));
  --motion-fast: 140ms; --motion-stamp: 240ms; --motion-turn: 220ms;
  --ease-out: cubic-bezier(.2,.8,.2,1);
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root {
    --paper: #19132c; --surface: #281e3b; --ink: #fff7e9; --purple: #c4a5ef;
    --muted: #c6bcd1; --line: #6b5a80; --teal: #72decd; --error: #ffadc3;
    color-scheme: dark;
  }
}
@media (min-width: 768px) { :root { --gutter: var(--space-6); } }
@media (min-width: 1440px) { :root { --gutter: var(--space-8); } }