/* FutiaSpace — tokens.css */
:root{
  /* Brand */
  --c-green:#2D7D32;--c-green-light:#3da543;--c-green-bright:#57bb61;
  --c-orange:#E87722;--c-sea:#006994;--c-brown:#4A2511;
  /* Surfaces: base (page) < surface (cards) < elevated (inset/hover) < raised (popovers) */
  --bg-base:#0a0a10;--bg-surface:#14141c;--bg-elevated:#1c1c26;--bg-raised:#252534;--bg-input:#1a1a24;
  --text-primary:#f5f5f7;--text-secondary:#b0b0bc;--text-muted:#7d7d8b;
  /* Accent colours safe for TEXT on the current theme */
  --accent-text:#57bb61;--orange-text:#f08a3e;--sea-text:#3bb8e8;
  --border-subtle:rgba(255,255,255,.07);--border-strong:rgba(255,255,255,.15);--border-input:rgba(255,255,255,.12);
  --danger:#ef4444;--success:#10b981;--warning:#f59e0b;
  --danger-tint:rgba(239,68,68,.12);--danger-text:#f87171;
  --green-tint:rgba(61,165,67,.14);--orange-tint:rgba(232,119,34,.14);--sea-tint:rgba(0,105,148,.22);
  --scrim:rgba(4,4,8,.68);--glass:rgba(10,10,16,.82);--glass-nav:rgba(20,20,28,.86);
  /* Gradients (use sparingly: hero, + button, avatar rings, key CTAs) */
  --gradient-brand:linear-gradient(135deg,#2D7D32,#57bb61);
  --gradient-story:linear-gradient(135deg,#3da543,#E87722);
  /* Radii */
  --radius-xs:6px;--radius-sm:10px;--radius-md:14px;--radius-lg:18px;--radius-xl:24px;--radius-pill:999px;
  /* Elevation */
  --highlight:inset 0 1px 0 rgba(255,255,255,.045);
  --shadow-xs:0 1px 2px rgba(0,0,0,.35);--shadow-sm:0 2px 8px rgba(0,0,0,.35);
  --shadow-md:0 8px 24px rgba(0,0,0,.42);--shadow-lg:0 20px 50px rgba(0,0,0,.6);
  --shadow-card:0 1px 2px rgba(0,0,0,.4);
  --shadow-glow:0 0 0 1px rgba(87,187,97,.28),0 6px 22px rgba(61,165,67,.3);
  /* Motion */
  --ease:cubic-bezier(.2,.8,.2,1);--spring:cubic-bezier(.34,1.56,.64,1);
  --t-fast:120ms;--t-base:200ms;--t-slow:320ms;
  /* Type */
  --font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Inter","Helvetica Neue",Arial,sans-serif;
  --fs-2xs:.6875rem;--fs-xs:.75rem;--fs-sm:.875rem;--fs-md:1rem;--fs-lg:1.15rem;--fs-xl:1.4rem;--fs-2xl:1.8rem;--fs-3xl:2.4rem;
  --tracking-tight:-.025em;--lh-body:1.55;
  /* Spacing scale */
  --sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:20px;--sp-6:24px;--sp-8:32px;--sp-10:40px;
  --card-pad:16px;--card-gap:12px;--section-gap:24px;
  /* Layout */
  --header-h:56px;--nav-h:68px;--max-w:600px;--sidebar-w:240px;
  --safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px);
  /* Pro / premium */
  --gold:#f5b301;--gold-light:#ffd54a;--gold-text:#f7c948;--gold-tint:rgba(245,179,1,.14);
  --gradient-gold:linear-gradient(135deg,#f5b301,#ffd54a 52%,#e89a00);
  --shadow-gold:0 0 0 1px rgba(245,179,1,.35),0 10px 30px -8px rgba(245,179,1,.4);
  --warning-tint:rgba(245,158,11,.14);--success-tint:rgba(16,185,129,.14);
  color-scheme:dark;
}

/* Light: layered surfaces (tinted page, white cards, soft shadows) — not an inversion */
body.light-mode{
  --bg-base:#edf1ed;--bg-surface:#ffffff;--bg-elevated:#f3f6f3;--bg-raised:#ffffff;--bg-input:#f3f6f3;
  --text-primary:#121a14;--text-secondary:#444f48;--text-muted:#66726b;
  --accent-text:#1e6a24;--orange-text:#b4540a;--sea-text:#00587c;
  --border-subtle:rgba(18,40,22,.09);--border-strong:rgba(18,40,22,.2);--border-input:rgba(18,40,22,.22);
  --danger-text:#b91c1c;--danger-tint:rgba(239,68,68,.1);
  --green-tint:rgba(45,125,50,.1);--orange-tint:rgba(232,119,34,.13);--sea-tint:rgba(0,105,148,.1);
  --scrim:rgba(14,26,16,.46);--glass:rgba(255,255,255,.86);--glass-nav:rgba(255,255,255,.9);
  --highlight:inset 0 1px 0 rgba(255,255,255,.9);
  --shadow-xs:0 1px 2px rgba(18,40,22,.07);--shadow-sm:0 2px 8px rgba(18,40,22,.08);
  --shadow-md:0 8px 24px rgba(18,40,22,.12);--shadow-lg:0 20px 50px rgba(18,40,22,.2);
  --shadow-card:0 1px 2px rgba(18,40,22,.06),0 4px 14px rgba(18,40,22,.04);
  --shadow-glow:0 0 0 1px rgba(45,125,50,.25),0 6px 20px rgba(45,125,50,.22);
  --gold-text:#8a5d00;--gold-tint:rgba(245,179,1,.18);
  --shadow-gold:0 0 0 1px rgba(200,140,0,.35),0 10px 26px -8px rgba(200,140,0,.35);
  color-scheme:light;
}