@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;700&family=Space+Mono:wght@400;700&display=swap');

/* Yonder Sauna design tokens — shared with the P&L Calculator (sauna-calculator/css/tokens.css)
   so the two tools read as one cohesive suite. The block below the palette maps the
   Scanner's older variable names onto these tokens, so existing chart/calendar code keeps
   working unchanged. */
:root {
  /* palette */
  --snow:#F5F4ED;          /* Morning Snow  — page ground */
  --snow-hi:#FCFBF5;       /* lifted surface (cards) */
  --mist:#ECECDC;          /* Amazon Mist   — secondary surfaces */
  --aqua:#A0C9CB;          /* Aqua Mist     — cool / off-peak / ice */
  --aqua-ink:#34736F;      /* readable aqua for text */
  --orange:#FF6037;        /* Toxic Orange  — heat / peak / accent */
  --orange-ink:#D8431D;    /* readable orange for text */
  --clay:#9C8472;          /* warm taupe    — Scanner identity colour */
  --clay-ink:#6E5849;      /* readable clay for text */
  --ink:#2A1C15;           /* espresso      — primary text + strong lines */
  --ink-70:rgba(42,28,21,.70);
  --ink-55:rgba(42,28,21,.55);
  --ink-35:rgba(42,28,21,.34);
  --line:rgba(42,28,21,.18);
  --line-soft:rgba(42,28,21,.09);

  /* type */
  --sans:'Space Grotesk', system-ui, -apple-system, Segoe UI, sans-serif;
  --mono:'Space Mono', 'SFMono-Regular', ui-monospace, Menlo, monospace;

  /* geometry */
  --r-sm:8px; --r-md:12px; --r-lg:18px; --r-pill:999px;

  /* ---- Scanner compatibility aliases (older var names → shared tokens) ---- */
  --paper: var(--snow);
  --paper-2: var(--snow);
  --card: var(--snow-hi);
  --card-2:#FFFFFF;
  --ink-soft: var(--ink-70);
  --ink-faint: var(--ink-55);
  --grid: rgba(42,28,21,.05);
  --grid-major: rgba(42,28,21,.08);
  --orange-dim: rgba(255,96,55,.12);
  --teal: var(--aqua);
  --teal-ink: var(--aqua-ink);
  --teal-dim: rgba(160,201,203,.22);
  --garnet:#733635;
  --good: var(--aqua-ink);
  --bad: var(--orange-ink);
  --accent: var(--orange);       /* venue-swapped at runtime by main.js */
  --accent-ink: var(--orange-ink);
  --accent-dim: rgba(255,96,55,.12);
  --font-mono: var(--mono);
  --font-body: var(--sans);
  --pad: clamp(16px, 3vw, 36px);
  --radius: var(--r-lg);

  /* ---- tool identity — Scanner = warm clay sidebar ---- */
  --side-bg:#E8DDCE;
  --badge-line: var(--clay);
  --badge-ink: var(--clay-ink);
}