/* ============================================================
   Kind of Bar — Design Tokens
   Source: BRANDING.GUIDLINE.pdf (BIRD.AGENCY) — see docs/design-spec.md
   Raw palette + semantic tokens. Modes: night (default) / day
   via [data-theme="night"] / [data-theme="day"].
   ============================================================ */

:root {
  /* ---- Raw palette (guideline p13, pixel-verified) ---- */
  --kob-terracotta: #A15434;
  --kob-terracotta-deep: #7E3F26;
  --kob-terracotta-tint: #C08163;
  --kob-green: #377560;
  --kob-green-deep: #2A5A4A;
  --kob-green-soft: #47826C;
  --kob-cream: #EEE6DD;
  --kob-shell: #F5EAE0;
  --kob-offwhite: #F7F6F5;
  --kob-white: #FFFFFF;
  --kob-black: #000000;
  --kob-noir: #0B0A08;
  --kob-noir-2: #171412;

  /* ---- Type ---- */
  --kob-font-display: "Fraunces", "Georgia", serif;
  --kob-font-sans: "Montserrat", "Segoe UI", sans-serif;
  --kob-tracking-eyebrow: 0.22em;

  /* ---- Shape (arch motif) ---- */
  --kob-radius-arch: 999px 999px 0 0;
  --kob-radius-card: 1rem;
  --kob-radius-pill: 999px;
}

/* ---- Semantic: NIGHT (default — speakeasy) ---- */
:root,
[data-theme="night"] {
  --kob-bg: var(--kob-black);
  --kob-bg-elevated: var(--kob-noir);
  --kob-surface: var(--kob-noir-2);
  --kob-text: var(--kob-cream);
  --kob-text-muted: rgba(238, 230, 221, 0.64);
  --kob-heading: var(--kob-shell);
  --kob-primary: var(--kob-terracotta);
  --kob-primary-hover: var(--kob-terracotta-tint);
  --kob-on-primary: var(--kob-shell);
  --kob-secondary: var(--kob-green);
  --kob-secondary-hover: var(--kob-green-soft);
  --kob-on-secondary: var(--kob-shell);
  --kob-accent: var(--kob-terracotta-tint);
  --kob-line: rgba(238, 230, 221, 0.16);
  --kob-pattern: rgba(161, 84, 52, 0.35);
  color-scheme: dark;
}

/* ---- Semantic: DAY (café) ---- */
[data-theme="day"] {
  --kob-bg: var(--kob-cream);
  --kob-bg-elevated: var(--kob-shell);
  --kob-surface: var(--kob-offwhite);
  --kob-text: rgba(0, 0, 0, 0.82);
  --kob-text-muted: rgba(0, 0, 0, 0.56);
  --kob-heading: var(--kob-black);
  --kob-primary: var(--kob-terracotta);
  --kob-primary-hover: var(--kob-terracotta-deep);
  --kob-on-primary: var(--kob-shell);
  --kob-secondary: var(--kob-green);
  --kob-secondary-hover: var(--kob-green-deep);
  --kob-on-secondary: var(--kob-shell);
  --kob-accent: var(--kob-terracotta);
  --kob-line: rgba(0, 0, 0, 0.14);
  --kob-pattern: rgba(161, 84, 52, 0.22);
  color-scheme: light;
}

body { font-family: var(--kob-font-sans); }