/* ============================================================================
   @tellwang/design-tokens  —  GENERATED, do not edit by hand.
   Source:  experience/design-tokens/src/tokens/*.json
   Rebuild: npm --prefix experience/design-tokens run build
   Theme:   Flame (ember #FF7A45 · amber #FFB454 · sprout #4FA86A · cream #FFF8F0)
   ========================================================================== */

:root {
  --font-display: 'Inter Tight', ui-sans-serif, system-ui, sans-serif;
  --font-body: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, 'SF Mono', Menlo, monospace;
  --fs-xs: 0.78rem;
  --fs-sm: 0.875rem;
  --fs-base: 1rem;
  --fs-md: 1.125rem;
  --fs-lg: 1.375rem;
  --fs-xl: 1.875rem;
  --fs-2xl: 2.6rem;
  --fs-3xl: clamp(2rem, 6vw, 4.75rem);
  --lh-tight: 1.08;
  --lh-snug: 1.3;
  --lh-body: 1.65;
  --tracking-tight: -0.02em;
  --tracking-wide: 0.16em;
  --s-1: 0.25rem;
  --s-2: 0.5rem;
  --s-3: 0.75rem;
  --s-4: 1rem;
  --s-5: 1.5rem;
  --s-6: 2rem;
  --s-8: 3rem;
  --s-10: 4.5rem;
  --s-12: 6.5rem;
  --r-sm: 8px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 28px;
  --r-pill: 999px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur: 260ms;
  --dur-fast: 140ms;
  --dur-slow: 600ms;
  --w-content: 46rem;
  --w-max: 78rem;
  --w-sidebar: 16.5rem;
  --w-toc: 14rem;
  --topbar-h: 4rem;
  --z-bg: 0;
  --z-base: 1;
  --z-nav: 50;
  --z-overlay: 100;
  --c-ink: #0a0b0e;
  --accent-fill: #FF7A45;
  --accent-glow: rgba(255,122,69,0.32);
  --accent-2-glow: rgba(79,168,106,0.28);
  --glass-blur: 16px;
  --ok: #5fd38a;
  --warn: #f2c14e;
  --err: #f2675a;
  --c-bg: #0a0d1a;
  --c-bg-2: #10142a;
  --glass-bg: rgba(255,255,255,0.045);
  --glass-bg-strong: rgba(255,255,255,0.07);
  --glass-border: rgba(255,255,255,0.10);
  --glass-hi: rgba(255,255,255,0.14);
  --glass-sheen: rgba(255,255,255,0.10);
  --glass-edge: rgba(0,0,0,0.28);
  --t-bright: #f4f6f8;
  --t-body: #c3c9d4;
  --t-dim: #8b93a3;
  --t-faint: #5b6373;
  --accent: #FF7A45;
  --accent-soft: #FFB454;
  --accent-2: #4FA86A;
  --accent-tint: rgba(255,122,69,0.12);
  --accent-tint-border: rgba(255,122,69,0.28);
  --topbar-bg: rgba(10,13,26,0.66);
  --sidebar-bg: rgba(10,13,26,0.93);
  --code-inline-bg: rgba(255,255,255,0.07);
  --grain-opacity: 0.04;
  --scroll-thumb: rgba(255,255,255,0.10);
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.4);
  --shadow: 0 18px 50px -12px rgba(0,0,0,0.6);
  --shadow-lg: 0 40px 90px -20px rgba(0,0,0,0.7);
  --mesh: radial-gradient(60rem 40rem at 12% -10%, rgba(255,122,69,0.12), transparent 60%), radial-gradient(50rem 40rem at 100% 0%, rgba(255,180,84,0.10), transparent 55%), radial-gradient(70rem 60rem at 50% 120%, rgba(79,168,106,0.07), transparent 60%);
}

[data-theme="light"] {
  --c-bg: #FFF8F0;
  --c-bg-2: #FFFFFF;
  --glass-bg: rgba(255,255,255,0.6);
  --glass-bg-strong: rgba(255,255,255,0.85);
  --glass-border: rgba(42,35,32,0.10);
  --glass-hi: rgba(255,255,255,0.92);
  --glass-sheen: rgba(255,255,255,0.65);
  --glass-edge: rgba(70,45,30,0.07);
  --t-bright: #2A2320;
  --t-body: #5c5048;
  --t-dim: #8a7d72;
  --t-faint: #b3a89e;
  --accent: #FF7A45;
  --accent-soft: #FFB454;
  --accent-2: #4FA86A;
  --accent-tint: rgba(255,122,69,0.10);
  --accent-tint-border: rgba(255,122,69,0.28);
  --topbar-bg: rgba(255,248,240,0.7);
  --sidebar-bg: rgba(255,248,240,0.96);
  --code-inline-bg: rgba(42,35,32,0.06);
  --grain-opacity: 0.025;
  --scroll-thumb: rgba(42,35,32,0.18);
  --shadow-sm: 0 1px 2px rgba(70,45,30,0.10);
  --shadow: 0 18px 50px -16px rgba(70,45,30,0.14);
  --shadow-lg: 0 40px 90px -28px rgba(70,45,30,0.18);
  --mesh: radial-gradient(60rem 40rem at 12% -10%, rgba(255,122,69,0.14), transparent 60%), radial-gradient(50rem 40rem at 100% 0%, rgba(255,180,84,0.12), transparent 55%), radial-gradient(70rem 60rem at 50% 120%, rgba(79,168,106,0.08), transparent 60%);
}