/* MealCave design tokens — "Light in the cave" */
:root {
  /* Stone (warm blacks) */
  --stone-950: #0E0D0B;
  --stone-900: #171512;
  --stone-800: #23201B;
  --stone-700: #2F2B25;
  --stone-600: #4A443B;
  /* Bone (text on dark) */
  --bone-100: #F2EDE4;
  --bone-400: #B8AE9E;
  /* Accents */
  --lid-500: #3DD15F;      /* MealCave brand green: CTAs, selection, success, in-cooler */
  --lid-600: #2FB04E;      /* pressed / hover on light */
  --lid-ink: #06210F;      /* text on green */
  --ember-500: #E8742C;    /* heat only: spicy, chef's fire */
  --frost-200: #CFE6EE;    /* cold chain / delivery moments only */

  /* Strata (macro bands) */
  --strata-protein: #E9DFCC;
  --strata-carbs: #9C8F7A;
  --strata-fat: #B8622C;

  /* Semantic */
  --bg: var(--stone-950);
  --surface: var(--stone-900);
  --raised: var(--stone-800);
  --line: var(--stone-600);
  --text: var(--bone-100);
  --text-2: var(--bone-400);
  --focus: var(--lid-500);

  /* Type */
  --font-ui: "Outfit", "Helvetica Neue", Arial, sans-serif;
  --font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --font-mono: "JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;
  --fs-display: clamp(56px, 8.4vw, 120px);
  --fs-h2: clamp(36px, 4.6vw, 64px);
  --fs-h3: clamp(22px, 2.2vw, 28px);
  --fs-body: clamp(16px, 1.15vw, 18px);
  --fs-small: 14px;
  --fs-mono: clamp(12px, .9vw, 14px);
  --track-mono: .04em;

  /* Space (8px base) */
  --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 32px;
  --s-7: 48px; --s-8: 64px; --s-9: 96px; --s-10: 128px; --s-11: 160px;
  --section: clamp(96px, 10vw, 160px);
  --bleed: clamp(20px, 6vw, 120px);
  --max: 1440px;

  /* Shape */
  --r-ui: 4px;
  --r-card: 28px;
  --r-pill: 999px;
  --shadow-light: 0 30px 60px -20px rgba(0, 0, 0, .6);

  /* Motion: slow heat */
  --ease: cubic-bezier(.2, .8, .2, 1);
  --t-fast: 400ms;
  --t-mid: 650ms;
  --t-slow: 900ms;
}

/* Daylight Pantry (light mode) */
[data-theme="light"] {
  --bg: #F2EDE4;
  --surface: #E9E2D5;
  --raised: #FFFFFF;
  --line: #CFC5B4;
  --text: #171512;
  --text-2: #5E554B;
}

@media (prefers-reduced-motion: reduce) {
  :root { --t-fast: 1ms; --t-mid: 1ms; --t-slow: 1ms; }
}
