:root, [data-theme="light"] {
  --bg-canvas: #f5f5f7;
  --bg-default: #ffffff;
  --bg-surface: #fafafa;
  --bg-inset: #f0f0f2;
  --bg-overlay: rgba(0,0,0,0.35);
  --bg-backdrop: rgba(255,255,255,0.88);
  --bg-backdrop-blur: rgba(250,250,250,0.82);

  --border-default: #d2d2d7;
  --border-muted: #e5e5e7;
  --border-subtle: rgba(0,0,0,0.06);

  --fg-default: #1d1d1f;
  --fg-secondary: #424245;
  --fg-muted: #6e6e73;
  --fg-subtle: #86868b;
  --fg-dimmed: #aeaeb2;
  --fg-heading: #1d1d1f;
  --fg-on-emphasis: #ffffff;

  --accent-fg: #0071e3;
  --accent-light: #0077ed;
  --accent-subtle: rgba(0,113,227,0.08);
  --accent-muted: rgba(0,113,227,0.14);

  --success-fg: #248a3d;
  --success-subtle: rgba(36,138,61,0.08);
  --danger-fg: #d70015;
  --danger-subtle: rgba(215,0,21,0.08);
  --warning-fg: #a05a00;
  --warning-subtle: rgba(160,90,0,0.08);
  --neutral-muted: rgba(174,174,178,0.18);
  --neutral-subtle: rgba(174,174,178,0.06);

  --shadow-sm: 0 1px 2px rgba(0,0,0,0.06);
  --shadow-md: 0 2px 12px rgba(0,0,0,0.08);
  --shadow-lg: 0 8px 30px rgba(0,0,0,0.12);
  --shadow-xl: 0 20px 60px rgba(0,0,0,0.15);

  --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px;
  --space-5: 24px; --space-6: 32px; --space-7: 48px; --space-8: 64px;

  --radius-sm: 8px; --radius-md: 12px; --radius-lg: 16px; --radius-xl: 20px;
  --ease-out: cubic-bezier(0.25,0.1,0.25,1);
  --ease-spring: cubic-bezier(0.22,1,0.36,1);

  color-scheme: light;
}

[data-theme="dark"] {
  --bg-canvas: #000000;
  --bg-default: #1c1c1e;
  --bg-surface: #2c2c2e;
  --bg-inset: #1c1c1e;
  --bg-overlay: rgba(0,0,0,0.7);
  --bg-backdrop: rgba(28,28,30,0.88);
  --bg-backdrop-blur: rgba(44,44,46,0.82);

  --border-default: #38383a;
  --border-muted: #2c2c2e;
  --border-subtle: rgba(255,255,255,0.08);

  --fg-default: #f5f5f7;
  --fg-secondary: #d1d1d6;
  --fg-muted: #98989d;
  --fg-subtle: #8e8e93;
  --fg-dimmed: #636366;
  --fg-heading: #f5f5f7;
  --fg-on-emphasis: #ffffff;

  --accent-fg: #64b5f6;
  --accent-light: #90caf9;
  --accent-subtle: rgba(100,181,246,0.1);
  --accent-muted: rgba(100,181,246,0.16);

  --success-fg: #30d158;
  --success-subtle: rgba(48,209,88,0.12);
  --danger-fg: #ff453a;
  --danger-subtle: rgba(255,69,58,0.12);
  --warning-fg: #ffd60a;
  --warning-subtle: rgba(255,214,10,0.12);
  --neutral-muted: rgba(142,142,147,0.14);
  --neutral-subtle: rgba(142,142,147,0.06);

  --shadow-sm: 0 1px 2px rgba(0,0,0,0.4);
  --shadow-md: 0 2px 12px rgba(0,0,0,0.5);
  --shadow-lg: 0 12px 40px rgba(0,0,0,0.6);
  --shadow-xl: 0 20px 60px rgba(0,0,0,0.7);

  color-scheme: dark;
}