/* ==========================================================================
   AWEBO theme — THE single source of truth for interface colour and type.
   Loaded by index.html (before the app bundle) and public/game-guide.html.

   EDIT ONLY the "--aw-*-hsl" channel lines below (format: H S% L%).
   Every colour token, every scoped palette (--wq-*, --nb-*, --a-*, journey,
   story, legacy :root names) and the Tailwind/shadcn aliases derive from
   them, so one edit propagates to every page. Hex in the comments is
   documentation only.

   Base: the approved quiet game dock / Log style (paper, teal, line).
   Artwork (renderer palettes, SVG art, wordmark, photographs, painted
   canvas) is outside this file on purpose — see docs/theme.md.
   ========================================================================== */
/* Loaded before the app bundle: the first paint and reload gaps are paper. */
html, body {
  background-color: var(--aw-paper);
}

:root {
  /* ---- Canonical colour channels (the only colour values in the app UI) ---- */
  --aw-paper-hsl: 46 35.1% 92.7%;   /* #f3f0e6 — panels, dock, toolbar pills */
  --aw-paper-2-hsl: 46 29.8% 88.8%; /* #ebe7da — solid back button, pressed, inputs */
  --aw-card-hsl: 44 47.8% 95.5%;    /* #f9f6ee — cards on paper; lightest surface */
  --aw-ground-hsl: 55 18.2% 87.1%;  /* #e4e3d8 — page ground */
  --aw-ground-deep-hsl: 60 14.3% 82.2%; /* #d8d8cb — page ground, lower edge */
  --aw-ink-hsl: 195 17.4% 18%;      /* #263236 — primary text */
  --aw-soft-hsl: 167 7.1% 38.4%;    /* #5b6966 — secondary text */
  --aw-faint-hsl: 147 4.9% 56.3%;   /* #8a958f — tertiary text / meta */
  --aw-line-hsl: 65 10.9% 76.7%;    /* #c9cabd — borders, hairlines */
  --aw-accent-hsl: 184 34.7% 28.2%; /* #2f5e61 — fjord teal: actions, selected, focus */
  --aw-accent-hover-hsl: 184 36.1% 23.3%; /* #264e51 — accent hover/pressed */
  --aw-accent-soft-hsl: 140 15.3% 88.4%; /* #dde6e0 — selected / hover wash */
  --aw-danger-hsl: 9 48.6% 41.2%;   /* #9c4636 — lingonberry: delete, error, kept stamp */
  --aw-danger-soft-hsl: 16 37.3% 90%; /* #efe1dc — danger wash */
  --aw-success-hsl: 142 25.9% 33.3%; /* #3f6b4f — success / confirmed */
  --aw-success-soft-hsl: 104 18.6% 88.4%; /* #dfe7dc — success wash */
  --aw-warning-hsl: 34 66.3% 32.5%; /* #8a5a1c — warning text, brass details */
  --aw-warning-soft-hsl: 40 66.7% 89.4%; /* #f6ead2 — warning wash */
  --aw-record-hsl: 15 63.3% 47.1%;  /* #c4532c — camera shutter core */
  --aw-night-hsl: 210 50% 11%;      /* #0e1c2a — dark surfaces (legacy shell, photo letterbox) */
  --aw-fjord-hsl: 207 47.7% 21.8%;  /* #1d3a52 — dark secondary surface */
  --aw-sun-hsl: 43 87.3% 66.1%;     /* #f4c95d — bright highlight on dark */
  --aw-sky-hsl: 199 37.3% 80%;      /* #b9d3df — pale cool highlight */
  --aw-shadow-hsl: 190 23.1% 10.2%; /* #141e20 — shadows, scrims, vignettes (use with alpha) */

  /* Derived colours — never edit; edit the channel above. */
  --aw-paper: hsl(var(--aw-paper-hsl));
  --aw-paper-2: hsl(var(--aw-paper-2-hsl));
  --aw-card: hsl(var(--aw-card-hsl));
  --aw-ground: hsl(var(--aw-ground-hsl));
  --aw-ground-deep: hsl(var(--aw-ground-deep-hsl));
  --aw-ink: hsl(var(--aw-ink-hsl));
  --aw-soft: hsl(var(--aw-soft-hsl));
  --aw-faint: hsl(var(--aw-faint-hsl));
  --aw-line: hsl(var(--aw-line-hsl));
  --aw-accent: hsl(var(--aw-accent-hsl));
  --aw-accent-hover: hsl(var(--aw-accent-hover-hsl));
  --aw-accent-soft: hsl(var(--aw-accent-soft-hsl));
  --aw-danger: hsl(var(--aw-danger-hsl));
  --aw-danger-soft: hsl(var(--aw-danger-soft-hsl));
  --aw-success: hsl(var(--aw-success-hsl));
  --aw-success-soft: hsl(var(--aw-success-soft-hsl));
  --aw-warning: hsl(var(--aw-warning-hsl));
  --aw-warning-soft: hsl(var(--aw-warning-soft-hsl));
  --aw-record: hsl(var(--aw-record-hsl));
  --aw-night: hsl(var(--aw-night-hsl));
  --aw-fjord: hsl(var(--aw-fjord-hsl));
  --aw-sun: hsl(var(--aw-sun-hsl));
  --aw-sky: hsl(var(--aw-sky-hsl));
  --aw-shadow: hsl(var(--aw-shadow-hsl));

  /* ---- Composite semantic colours ---- */
  --aw-glass: hsl(var(--aw-paper-hsl) / .88);
  --aw-line-soft: hsl(var(--aw-ink-hsl) / .16);
  --aw-on-accent: var(--aw-paper);
  --aw-on-image: var(--aw-paper);
  --aw-on-image-shadow: 0 1px 2px hsl(var(--aw-shadow-hsl) / .6);
  --aw-image-scrim: hsl(var(--aw-shadow-hsl) / .6);
  --aw-photo-bg: var(--aw-night);
  --aw-scrim: hsl(var(--aw-shadow-hsl) / .46);

  /* ---- Typography ---- */
  --aw-font-serif: "Source Serif 4", "Iowan Old Style", Georgia, serif;
  --aw-font-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --aw-font-mono: "Spline Sans Mono", ui-monospace, monospace;
  --aw-font-pixel: "Press Start 2P", ui-monospace, monospace;
  --aw-font-hand: "Patrick Hand", "Caveat", "Bradley Hand", cursive;

  /* ---- Shape, depth, focus, space ---- */
  --aw-radius-sm: 6px;
  --aw-radius: 10px;
  --aw-radius-lg: 14px;
  --aw-radius-pill: 999px;
  --aw-shadow-nav: 0 6px 18px -14px hsl(var(--aw-shadow-hsl) / .5);
  --aw-shadow-panel: 0 24px 60px -28px hsl(var(--aw-shadow-hsl) / .55);
  --aw-shadow-pop: 0 12px 30px -18px hsl(var(--aw-shadow-hsl) / .6);
  --aw-focus-color: var(--aw-accent);
  --aw-focus-ring: 0 0 0 3px hsl(var(--aw-accent-hsl) / .35);
  --aw-touch: 44px;
  --aw-space-1: 4px;
  --aw-space-2: 8px;
  --aw-space-3: 12px;
  --aw-space-4: 16px;
  --aw-space-5: 24px;
  --aw-space-6: 32px;

  /* ---- shadcn / Tailwind HSL channel aliases (derived, never edit) ---- */
  --background: var(--aw-paper-hsl);
  --foreground: var(--aw-ink-hsl);
  --card: var(--aw-card-hsl);
  --card-foreground: var(--aw-ink-hsl);
  --popover: var(--aw-paper-hsl);
  --popover-foreground: var(--aw-ink-hsl);
  --primary: var(--aw-accent-hsl);
  --primary-foreground: var(--aw-paper-hsl);
  --secondary: var(--aw-paper-2-hsl);
  --secondary-foreground: var(--aw-ink-hsl);
  --muted: var(--aw-paper-2-hsl);
  --muted-foreground: var(--aw-soft-hsl);
  --accent: var(--aw-accent-soft-hsl);
  --accent-foreground: var(--aw-accent-hsl);
  --destructive: var(--aw-danger-hsl);
  --destructive-foreground: var(--aw-paper-hsl);
  --border: var(--aw-line-hsl);
  --input: var(--aw-line-hsl);
  --ring: var(--aw-accent-hsl);
  --radius: 0.625rem;
}
