/* ============================================================
   Nutrion Max — Design Tokens
   Ported 1:1 from the Claude Design handoff design system.
   ============================================================ */

@import url("https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Instrument+Sans:ital,wght@0,400;0,500;0,600;0,700;1,400&family=IBM+Plex+Mono:wght@400;500;600&display=swap");

:root {
  /* base — evergreen scale */
  --green-950:#0C1512; --green-900:#12201A; --green-800:#1B3128; --green-700:#24443A; --green-600:#2F5A4B; --green-500:#3E7460; --green-400:#5D937E; --green-300:#8AB4A2; --green-200:#BDD6CB; --green-100:#E1EDE7;
  /* base — champagne gold scale */
  --gold-700:#8A6A28; --gold-600:#A98336; --gold-500:#C09A48; --gold-400:#D2B36C; --gold-300:#E2CD99; --gold-200:#EFE2C6; --gold-100:#F7F0E1;
  /* base — warm neutrals */
  --neutral-900:#1C1B17; --neutral-800:#33312B; --neutral-700:#4C4A42; --neutral-600:#6B685E; --neutral-500:#8A867A; --neutral-400:#ABA79A; --neutral-300:#CCC8BC; --neutral-200:#E2DFD5; --neutral-100:#EFEDE5; --neutral-50:#F8F6F0; --white:#FFFFFF;
  /* semantic status */
  --status-ok:#2E7D5B; --status-ok-soft:#DDEDE4; --status-warn:#B4761F; --status-warn-soft:#F4E8D2; --status-error:#A93B2A; --status-error-soft:#F3DDD8; --status-info:#31606F; --status-info-soft:#DCE9ED;
  /* data viz — macros & biomarkers */
  --data-protein:#2F5A4B; --data-carbs:#C09A48; --data-fat:#8A5A3B; --data-fiber:#5D937E; --data-micro:#31606F; --data-track:#E7E4DA;
  /* semantic aliases */
  --surface-page:#F8F6F0; --surface-card:#FFFFFF; --surface-raised:#FFFFFF; --surface-sunken:#EFEDE5; --surface-inverse:#12201A; --surface-accent-soft:#E1EDE7;
  --text-primary:#1C1B17; --text-secondary:#4C4A42; --text-muted:#8A867A; --text-on-dark:#F3F0E7; --text-on-accent:#F3F0E7; --text-accent:#24443A; --text-gold:#8A6A28;
  --accent:#1B3128; --accent-hover:#24443A; --accent-press:#12201A; --accent-gold:#C09A48; --accent-gold-hover:#A98336;
  --border-subtle:#E2DFD5; --border-strong:#CCC8BC; --border-accent:#24443A;
  --focus-ring:rgba(47,90,75,0.35);

  /* typography */
  --font-display:"Instrument Sans",-apple-system,"Segoe UI",sans-serif;
  --font-sans:"Instrument Sans",-apple-system,"Segoe UI",sans-serif;
  --font-mono:"IBM Plex Mono","SF Mono",monospace;
  --text-xs:0.75rem; --text-sm:0.8125rem; --text-base:0.9375rem; --text-md:1.0625rem; --text-lg:1.25rem; --text-xl:1.625rem; --text-2xl:2.125rem; --text-3xl:2.75rem; --text-display:3.5rem;
  --weight-regular:400; --weight-medium:500; --weight-semibold:600; --weight-bold:700;
  --leading-tight:1.1; --leading-snug:1.3; --leading-normal:1.5; --leading-relaxed:1.65;
  --tracking-tight:-0.01em; --tracking-normal:0; --tracking-wide:0.08em; --tracking-caps:0.14em;

  /* spacing — 4px base */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px; --space-8:32px; --space-10:40px; --space-12:48px; --space-16:64px; --space-20:80px; --space-24:96px;
  /* radii */
  --radius-xs:6px; --radius-sm:10px; --radius-md:14px; --radius-lg:20px; --radius-xl:28px; --radius-pill:999px;
  /* shadows */
  --shadow-card:0 1px 2px rgba(28,27,23,0.05),0 4px 16px rgba(28,27,23,0.06);
  --shadow-raised:0 2px 4px rgba(28,27,23,0.06),0 12px 32px rgba(28,27,23,0.10);
  --shadow-overlay:0 8px 24px rgba(12,21,18,0.18),0 24px 64px rgba(12,21,18,0.22);
  --shadow-inset:inset 0 1px 2px rgba(28,27,23,0.06);
  /* motion */
  --ease-out:cubic-bezier(0.22,1,0.36,1);
  --ease-in-out:cubic-bezier(0.65,0,0.35,1);
  --duration-fast:120ms; --duration-base:200ms; --duration-slow:360ms;
}

[data-theme="dark"] {
  --surface-page:#0C1512; --surface-card:#12201A; --surface-raised:#1B3128; --surface-sunken:#0C1512; --surface-inverse:#F8F6F0; --surface-accent-soft:#1B3128;
  --text-primary:#F3F0E7; --text-secondary:#BDD6CB; --text-muted:#7E9488; --text-on-dark:#F3F0E7; --text-accent:#8AB4A2; --text-gold:#D2B36C;
  --accent:#8AB4A2; --accent-hover:#BDD6CB; --accent-press:#5D937E; --accent-gold:#D2B36C; --accent-gold-hover:#E2CD99;
  --text-on-accent:#0C1512;
  --border-subtle:#24443A; --border-strong:#2F5A4B; --border-accent:#8AB4A2;
  --status-ok:#5FA986; --status-ok-soft:#1B3128; --status-warn:#D2A34E; --status-warn-soft:#2E2617; --status-error:#D06A57; --status-error-soft:#2E1B17; --status-info:#6FA3B4; --status-info-soft:#16262C;
  --data-protein:#8AB4A2; --data-carbs:#D2B36C; --data-fat:#C08D66; --data-fiber:#5D937E; --data-micro:#6FA3B4; --data-track:#24443A;
  --focus-ring:rgba(138,180,162,0.4);
}
