:root,
html[data-theme="light"] {
  color-scheme: light;
  --bg: #edf1f7;
  --bg-2: #f8faff;
  --canvas: rgba(250, 250, 253, .78);
  --surface: #ffffff;
  --surface-raised: rgba(255,255,255,.84);
  --surface-soft: rgba(255,255,255,.64);
  --surface-inset: rgba(118,118,128,.09);
  --text: #151518;
  --text-secondary: #3a3a3c;
  --text-tertiary: #6e6e73;
  --text-quaternary: #8e8e93;
  --separator: rgba(60,60,67,.16);
  --separator-soft: rgba(60,60,67,.09);
  --accent: #007aff;
  --accent-soft: rgba(0,122,255,.12);
  --accent-strong: #006ee6;
  --blue: #007aff;
  --cyan: #32ade6;
  --indigo: #5856d6;
  --purple: #af52de;
  --pink: #ff2d55;
  --green: #34c759;
  --orange: #ff9500;
  --red: #ff3b30;
  --teal: #30b0c7;
  --mint: #00c7be;
  --brown: #a2845e;
  --gray: #8e8e93;
  --shadow-1: 0 1px 2px rgba(30,33,48,.04), 0 8px 24px rgba(30,33,48,.06);
  --shadow-2: 0 2px 6px rgba(30,33,48,.06), 0 20px 60px rgba(30,33,48,.12);
  --shadow-float: 0 8px 18px rgba(30,33,48,.08), 0 28px 80px rgba(30,33,48,.16);
  --glass-rgb: 255,255,255;
  --glass-alpha: .54;
  --glass-alpha-strong: .68;
  --glass-border: rgba(255,255,255,.66);
  --glass-rim: rgba(255,255,255,.92);
  --glass-rim-low: rgba(255,255,255,.10);
  --glass-occlusion: rgba(48,52,70,.10);
  --radius-window: 32px;
  --radius-xl: 24px;
  --radius-lg: 18px;
  --radius-md: 14px;
  --radius-sm: 11px;
  --sidebar-w: 286px;
  --content-w: 1040px;
  --ease-out: cubic-bezier(.16,1,.3,1);
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #090a0e;
  --bg-2: #111218;
  --canvas: rgba(18,19,25,.78);
  --surface: #1c1c1e;
  --surface-raised: rgba(35,35,39,.82);
  --surface-soft: rgba(29,29,34,.68);
  --surface-inset: rgba(118,118,128,.18);
  --text: #f5f5f7;
  --text-secondary: #d1d1d6;
  --text-tertiary: #98989d;
  --text-quaternary: #6f6f75;
  --separator: rgba(255,255,255,.13);
  --separator-soft: rgba(255,255,255,.075);
  --accent: #0a84ff;
  --accent-soft: rgba(10,132,255,.16);
  --accent-strong: #409cff;
  --blue: #0a84ff;
  --cyan: #64d2ff;
  --indigo: #5e5ce6;
  --purple: #bf5af2;
  --pink: #ff375f;
  --green: #30d158;
  --orange: #ff9f0a;
  --red: #ff453a;
  --teal: #40c8e0;
  --mint: #63e6e2;
  --brown: #ac8e68;
  --gray: #98989d;
  --shadow-1: 0 2px 10px rgba(0,0,0,.18), 0 10px 30px rgba(0,0,0,.18);
  --shadow-2: 0 4px 14px rgba(0,0,0,.22), 0 24px 70px rgba(0,0,0,.34);
  --shadow-float: 0 8px 26px rgba(0,0,0,.32), 0 34px 90px rgba(0,0,0,.46);
  --glass-rgb: 27,28,34;
  --glass-alpha: .56;
  --glass-alpha-strong: .70;
  --glass-border: rgba(255,255,255,.16);
  --glass-rim: rgba(255,255,255,.38);
  --glass-rim-low: rgba(255,255,255,.025);
  --glass-occlusion: rgba(0,0,0,.28);
}

@media (prefers-color-scheme: dark) {
  html[data-theme="auto"] {
    color-scheme: dark;
    --bg:#090a0e; --bg-2:#111218; --canvas:rgba(18,19,25,.78); --surface:#1c1c1e;
    --surface-raised:rgba(35,35,39,.82); --surface-soft:rgba(29,29,34,.68); --surface-inset:rgba(118,118,128,.18);
    --text:#f5f5f7; --text-secondary:#d1d1d6; --text-tertiary:#98989d; --text-quaternary:#6f6f75;
    --separator:rgba(255,255,255,.13); --separator-soft:rgba(255,255,255,.075);
    --accent:#0a84ff; --accent-soft:rgba(10,132,255,.16); --accent-strong:#409cff;
    --blue:#0a84ff; --cyan:#64d2ff; --indigo:#5e5ce6; --purple:#bf5af2; --pink:#ff375f; --green:#30d158; --orange:#ff9f0a; --red:#ff453a; --teal:#40c8e0; --mint:#63e6e2; --brown:#ac8e68; --gray:#98989d;
    --shadow-1:0 2px 10px rgba(0,0,0,.18),0 10px 30px rgba(0,0,0,.18); --shadow-2:0 4px 14px rgba(0,0,0,.22),0 24px 70px rgba(0,0,0,.34); --shadow-float:0 8px 26px rgba(0,0,0,.32),0 34px 90px rgba(0,0,0,.46);
    --glass-rgb:27,28,34; --glass-alpha:.56; --glass-alpha-strong:.70; --glass-border:rgba(255,255,255,.16); --glass-rim:rgba(255,255,255,.38); --glass-rim-low:rgba(255,255,255,.025); --glass-occlusion:rgba(0,0,0,.28);
  }
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html { background: var(--bg); scroll-behavior: smooth; font-family: var(--font-ui); text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; font-synthesis: none; }
body { margin: 0; min-height: 100vh; overflow-x: hidden; color: var(--text); font-family: var(--font-ui); font-size: 15px; line-height: 1.72; font-weight: 400; letter-spacing: -.004em; }
button, input, a, summary, select, textarea { font: inherit; color: inherit; }
button, input, summary { border: 0; }
button, a, summary { -webkit-appearance: none; appearance: none; outline: none; }
a { color: inherit; }
::selection { background: color-mix(in srgb, var(--accent) 22%, transparent); }

/* Variable type rendering: visible on Windows/Android when web fonts load. */
html, body, button, input, select, textarea, summary { font-family: var(--font-ui); }
body { font-optical-sizing: auto; font-kerning: normal; font-variant-ligatures: common-ligatures; }
h1, h2, h3, h4, strong, b { font-family: var(--font-ui); font-optical-sizing: auto; }