/* Shared light-first tokens — Apple-like surfaces, system type */
:root {
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "SF Pro Display", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --font-display: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  --black: #F5F5F7;
  --panel: #FFFFFF;
  --white: #FFFFFF;
  --cyan: #54d5f5;
  --gold: #E6B84A;

  --ink-1: #1D1D1F;
  --ink-2: rgba(29, 29, 31, 0.62);
  --ink-3: rgba(29, 29, 31, 0.42);
  --line: rgba(29, 29, 31, 0.06);
  --line-2: rgba(29, 29, 31, 0.10);

  --panel-hover: #EFEFF4;
  --sublist-bg: #F5F5F7;
  --ic-bg: rgba(29, 29, 31, 0.04);
  --surface-hover: rgba(29, 29, 31, 0.04);
  --chip-bg: rgba(29, 29, 31, 0.05);
  --glow-cyan: rgba(84, 213, 245, 0.16);
  --glow-gold: rgba(230, 184, 74, 0.14);
  --glow-cyan-b: rgba(84, 213, 245, 0.08);
  --grain-opacity: 0;
  --sheet-shadow: 0 -8px 32px rgba(0, 0, 0, 0.08);
  --backdrop: rgba(0, 0, 0, 0.28);
  --theme-meta: #F5F5F7;

  --glass-bg: #FFFFFF;
  --glass-bg-strong: #F5F5F7;
  --glass-border: rgba(0, 0, 0, 0.04);
  --glass-highlight: rgba(255, 255, 255, 1);
  --glass-shadow: 0 1px 2px rgba(0, 0, 0, 0.04), 0 10px 28px rgba(0, 0, 0, 0.05);
  --orb-cyan: rgba(84, 213, 245, 0.22);
  --orb-gold: rgba(230, 184, 74, 0.16);

  --green: #34C759;
  --red: #FF3B30;
  --radius: 16px;
  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  font-size: 16px;
  color-scheme: light;
}

[data-theme="dark"] {
  --black: #000000;
  --panel: #1C1C1E;
  --ink-1: #F5F5F7;
  --ink-2: rgba(245, 245, 247, 0.62);
  --ink-3: rgba(245, 245, 247, 0.38);
  --line: rgba(255, 255, 255, 0.08);
  --line-2: rgba(255, 255, 255, 0.14);
  --panel-hover: #2C2C2E;
  --sublist-bg: #1C1C1E;
  --ic-bg: rgba(255, 255, 255, 0.06);
  --surface-hover: rgba(255, 255, 255, 0.06);
  --chip-bg: rgba(255, 255, 255, 0.08);
  --glow-cyan: rgba(84, 213, 245, 0.16);
  --glow-gold: rgba(252, 207, 99, 0.12);
  --glow-cyan-b: rgba(84, 213, 245, 0.06);
  --grain-opacity: 0.28;
  --sheet-shadow: 0 -20px 60px rgba(0, 0, 0, 0.6);
  --backdrop: rgba(0, 0, 0, 0.55);
  --theme-meta: #1C1C1E;
  --gold: #fccf63;
  --glass-bg: rgba(28, 28, 30, 0.86);
  --glass-bg-strong: rgba(44, 44, 46, 0.92);
  --glass-border: rgba(255, 255, 255, 0.10);
  --glass-highlight: rgba(255, 255, 255, 0.08);
  --glass-shadow: 0 12px 40px rgba(0, 0, 0, 0.36);
  --orb-cyan: rgba(84, 213, 245, 0.18);
  --orb-gold: rgba(252, 207, 99, 0.12);
  --green: #30D158;
  --red: #FF453A;
  color-scheme: dark;
}