:root {
  /* === Colors — neutral light (no beige) === */
  --bg: #FFFFFF;
  --bg-elevated: #FFFFFF;
  --bg-section: #F2F3F3;
  --bg-dark: #15171A;

  --ink: #17181A;
  --ink-soft: #494B4E;
  --ink-mute: #898B8F;

  --line: #E7E8E8;
  --line-strong: #D2D3D3;

  --accent: #38513F;
  --accent-soft: #4C6553;
  --accent-ink: #FFFFFF;

  --on-dark: #F3F4F3;
  --on-dark-mute: #A6A9AB;

  /* === Type — Manrope only === */
  --font-sans: 'Manrope', -apple-system, BlinkMacSystemFont, 'Inter', sans-serif;

  --fs-xs: 11px;
  --fs-sm: 13px;
  --fs-md: 15px;
  --fs-lg: 18px;
  --fs-xl: 22px;
  --fs-2xl: 28px;
  --fs-3xl: 40px;
  --fs-4xl: 56px;
  --fs-5xl: 80px;
  --fs-6xl: 120px;

  --lh-tight: 1.05;
  --lh-snug: 1.2;
  --lh-normal: 1.5;
  --lh-loose: 1.7;

  --tracking-tight: -0.02em;
  --tracking-normal: 0;
  --tracking-wide: 0.08em;
  --tracking-wider: 0.16em;

  /* === Layout === */
  --container: 1440px;
  --container-narrow: 1200px;
  --gutter: 32px;
  --gutter-sm: 20px;

  /* === Radius === */
  --r-sm: 4px;
  --r-md: 10px;
  --r-lg: 16px;
  --r-xl: 24px;
  --r-pill: 999px;

  /* === Motion === */
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --dur-fast: 200ms;
  --dur-md: 400ms;
  --dur-slow: 700ms;

  /* === Shadow === */
  --shadow-soft: 0 1px 2px rgba(20,20,20,.04), 0 8px 24px rgba(20,20,20,.06);
  --shadow-lift: 0 2px 8px rgba(20,20,20,.06), 0 24px 48px rgba(20,20,20,.10);
}

[data-theme="dark"] {
  --bg: #101214;
  --bg-elevated: #191B1E;
  --bg-section: #17191C;
  --bg-dark: #0B0C0E;

  --ink: #ECEDEC;
  --ink-soft: #C2C4C4;
  --ink-mute: #8A8C8F;

  --line: #262A2E;
  --line-strong: #383C40;

  --accent: #8FB39B;
  --accent-soft: #7FA189;
  --accent-ink: #101214;

  --on-dark: #ECEDEC;
  --on-dark-mute: #8A8C8F;
}
