/* What: Con Sal "Flores" design tokens — the challenge web app's single token source (2026-09-22).
 * Called by: both challenge app shells (ingles/reto/app, spanish/challenge/app) via <link>, before every other stylesheet.
 * Depends on: Google Fonts (Newsreader + Instrument Sans). Marketing/blog pages still use tokens-living-ritual.css.
 *
 * Source of truth: the "Con Sal" Design System artifact (Flores theme),
 * https://claude.ai/artifact/ECM4S8xAGNkG8TJjmdC9qa — names and values copied 1:1.
 * Rule from that system: screens never type a hex; add or reuse a semantic token here.
 * Replaces tokens-living-ritual.css + tokens-ios-dashboard.css inside the app.
 */
@import url('https://fonts.googleapis.com/css2?family=Newsreader:opsz,wght@6..72,400;6..72,500;6..72,600&family=Instrument+Sans:wght@400;500;600;700&display=swap');
:root {
  /* ── Colour (design system, Flores) ── */
  --bg: #F6F3EC;
  --surface: #FFFFFF;
  --surface-muted: #ECE7DC;
  --border: #E6E1D6;
  --text: #1F2420;
  --text-muted: #5C5A52;
  --hero-bg: #2F4538;
  --hero-text: #F6F3EC;
  --hero-text-muted: #CFE0D2;
  --hero-track: rgba(246,243,236,0.22);
  --button-primary-bg: #F6F3EC;
  --button-primary-text: #2F4538;
  --accent: #C2622F;
  --accent-text: #9A4520;
  --accent-soft: #F6E3D6;
  --progress-done: #F6F3EC;
  --progress-today: #E3A27C;
  --tip-bg: #F6E3D6;
  --tip-border: #EBCDB8;
  --tile-sage-bg: #E4EBE3;
  --tile-sage-ink: #3C5646;
  --tile-blue-bg: #E3E9EE;
  --tile-blue-ink: #3E5566;
  --tile-clay-bg: #F3E6DC;
  --tile-clay-ink: #8C4A25;
  --botanical-petal: #F6F3EC;
  --botanical-petal-alt: #F3D9C8;
  --botanical-center: #E3A27C;
  --botanical-leaf: #8FAF95;
  --botanical-leaf-dark: #6F9577;
  --botanical-lavender: #B9A6D6;
  --focus-ring: #2F4538;

  /* ── Type ── */
  --font-display: "Newsreader", Georgia, serif;
  --font-body: "Instrument Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

  /* ── Spacing / radius / size / shadow ── */
  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px;
  --space-6: 24px; --space-7: 28px; --space-8: 32px; --space-10: 40px; --space-16: 64px;
  --radius-sm: 10px; --radius-md: 14px; --radius-lg: 20px; --radius-xl: 28px; --radius-pill: 999px;
  --size-touch-min: 44px; --size-mic-button: 112px; --size-button-h: 56px;
  --size-icon-tile: 40px; --size-progress-bar: 8px;
  --shadow-mic-halo: 0 0 0 10px rgba(246,243,236,0.14);

  /* ── App-level semantic tokens (not yet in the design system — candidates to add) ── */
  --action-bg: var(--hero-bg);          /* primary button on light surfaces (session screens) */
  --action-text: var(--hero-text);
  --positive-bg: var(--tile-sage-bg);   /* wins, commitments, "done" panels */
  --positive-text: var(--tile-sage-ink);
  --rating-low: var(--tile-sage-ink);   /* nerves 0-3 / confidence 7-10 */
  --rating-mid: var(--tile-blue-ink);
  --rating-high: var(--accent-text);    /* nerves 7-10 / confidence 0-3 — never alarm red */
  --warning-bg: var(--tip-bg);
  --warning-border: var(--tip-border);
  --pressure-wash: #F3E4D8;             /* Day-6 pressure page tint, between bg and accent-soft */
  --orb-halo: rgba(143,175,149,0.22);   /* botanical-leaf @ 22% */
  --orb-halo-pressure: rgba(194,98,47,0.16); /* accent @ 16% */
  --shadow-card: 0 12px 28px -22px rgba(31,36,32,0.45);
  --scrim: rgba(31,36,32,0.38);

  /* ── Legacy aliases: old variable names still read by account.js, journal.js, results.js canvas ── */
  --ink: var(--text);
  --muted: var(--text-muted);
  --card-bg: var(--surface);
  --line: var(--border);
  --serif: var(--font-display);
  --accent-2: var(--hero-bg);
  --accent-2-soft: var(--positive-bg);
  --warm: var(--accent-text);
}
