/* =====================================================================
   Flash · design tokens
   The tattoo studio. Light is "Parchment" (aged flash paper, ink black);
   dark is "Back room". --flash is the one accent (buttons, links, the lit
   phrase, open books). The flash sheet itself is paper in both modes,
   so its colours (--sheet-*) don't change at night. --fill-* are the
   traditional colours packed into the designs: decoration, never text.
   ===================================================================== */
:root {
  color-scheme: light;
  --paper: #efe5ce;
  --card: #f9f3e4;
  --well: #e5d8bb;
  --line: #d3c29f;
  --ink: #17120e;
  --ink-2: #3d3329;
  --muted: #64584a;
  --flash: #a3231b;
  --flash-2: #821a13;
  --on-flash: #ffffff;
  --flash-soft: #f2d6c9;
  --green: #2f6b3f;                   /* open books, healed */
  --amber: #8a5a00;                   /* waitlist */
  --focus: #17120e;
  --shadow-card: 0 1px 0 rgba(23, 18, 14, 0.06), 0 18px 34px -24px rgba(23, 18, 14, 0.55);
  --shadow-lift: 0 34px 60px -30px rgba(23, 18, 14, 0.6);

  /* the sheet: paper in both modes */
  --sheet: #f4e9cf;
  --sheet-ink: #17120e;
  --sheet-muted: #5e5244;
  --fill-red: #c2301f;
  --fill-green: #3f8a4c;
  --fill-yellow: #e8b230;
  --fill-black: #1e1915;
  --fill-skin: #f1d9b8;
  --fill-steel: #c9cdd0;
  --fill-blue: #2d5b8c;

  --display: "Pirata One", "UnifrakturMaguntia", Georgia, serif;
  --body: "Chivo", system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "Chivo Mono", ui-monospace, "SFMono-Regular", Menlo, monospace;

  --fs-h1: clamp(50px, 7vw, 108px);
  --fs-h2: clamp(38px, 4.6vw, 68px);
  --fs-h3: 24px;
  --fs-lead: clamp(17.5px, 1.35vw, 20.5px);
  --fs-body: 17px;
  --fs-small: 15px;
  --fs-label: 12px;

  --wrap: 1220px;
  --gutter: max(20px, 4vw);
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 40px; --s-7: 64px; --s-8: 104px;

  --r-s: 4px;
  --r-m: 10px;
  --r-l: 16px;
  --r-pill: 999px;

  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
  --snap: cubic-bezier(0.5, 1.6, 0.4, 1);
  --d-fast: 150ms;
  --d: 300ms;
  --d-slow: 900ms;
}

/* ---------- Back room ---------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --paper: #110e0c;
    --card: #1b1612;
    --well: #16120f;
    --line: #362c24;
    --ink: #f2e8d6;
    --ink-2: #d5c7b1;
    --muted: #a99a88;
    --flash: #ff7a5c;
    --flash-2: #ff9a82;
    --on-flash: #2b0a05;
    --flash-soft: #3a1b13;
    --green: #7fcf8e;
    --amber: #f2b553;
    --focus: #f2e8d6;
    --shadow-card: 0 1px 0 rgba(255, 255, 255, 0.03) inset, 0 18px 34px -22px rgba(0, 0, 0, 0.85);
    --shadow-lift: 0 34px 60px -28px rgba(0, 0, 0, 0.9);
  }
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --paper: #110e0c;
  --card: #1b1612;
  --well: #16120f;
  --line: #362c24;
  --ink: #f2e8d6;
  --ink-2: #d5c7b1;
  --muted: #a99a88;
  --flash: #ff7a5c;
  --flash-2: #ff9a82;
  --on-flash: #2b0a05;
  --flash-soft: #3a1b13;
  --green: #7fcf8e;
  --amber: #f2b553;
  --focus: #f2e8d6;
  --shadow-card: 0 1px 0 rgba(255, 255, 255, 0.03) inset, 0 18px 34px -22px rgba(0, 0, 0, 0.85);
  --shadow-lift: 0 34px 60px -28px rgba(0, 0, 0, 0.9);
}