:root {
  color-scheme: dark;
  --bg-base: #0d0d0f;
  --bg-page: var(--bg-base);
  --bg-shell: #0d0d0f;
  --bg-surface: #151719;
  --bg-panel: #151719;
  --bg-elevated: #181b1d;
  --bg-elevated-rgb: 24, 27, 29;
  --bg-inset: #101214;
  --bg-hover: #202527;
  --bg-active: #243129;
  --border-weak: #242a2c;
  --border-subtle: #2a3032;
  --border-default: #394044;
  --border-accent: #00ff88;
  --fg-body: #f3f5f2;
  --fg-muted: #aeb8b1;
  --fg-soft: #7e8983;
  --fg-dim: #5f6a64;
  --accent: #00ff88;
  --accent-rgb: 0, 255, 136;
  --accent-dim: #00d874;
  --accent-hover: #58ffac;
  --accent-muted: #183527;
  --accent-glow: none;
  --accent-cyan: #7be7ff;
  --accent-gold: #d9f99d;
  --success: #26d06e;
  --warning: #f3aa26;
  --error: #ff5a5f;
  --radius-xs: 8px;
  --radius-sm: 10px;
  --radius-md: 14px;
  --radius-lg: 18px;
  --shadow-panel: 0 0 0 1px rgba(255, 255, 255, 0.06);
  --shadow-tight: 0 0 0 1px rgba(255, 255, 255, 0.04);
  --shadow-glow: 0 0 26px rgba(45, 212, 191, 0.18);

  /* Motion tokens */
  --transition-fast: 140ms ease;
  --transition-base: 200ms ease;
  --transition-slow: 320ms ease;
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-spring: cubic-bezier(0.34, 1.2, 0.64, 1);

  --font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI",
    "Microsoft YaHei", sans-serif;

  /* Semantic aliases used by the layered stylesheet structure. */
  --surface-canvas: var(--bg-base);
  --surface-shell: var(--bg-shell);
  --surface-panel: var(--bg-panel);
  --surface-elevated: var(--bg-elevated);
  --surface-muted: var(--bg-inset);
  --surface-hover: var(--bg-hover);
  --text-primary: var(--fg-body);
  --text-muted: var(--fg-muted);
  --text-subtle: var(--fg-soft);
  --text-disabled: var(--fg-dim);
  --border-soft: var(--border-weak);
  --border-normal: var(--border-subtle);
  --border-strong: var(--border-default);
  --radius-control: var(--radius-sm);
  --radius-panel: var(--radius-lg);
  --shadow-surface: var(--shadow-tight);
  --shadow-elevated: var(--shadow-panel);
  --accent-primary: var(--accent);
  --accent-primary-rgb: var(--accent-rgb);

  /* Legacy aliases used by the first web preview. */
  --page-bg: var(--bg-base);
  --page-bg-soft: var(--bg-shell);
  --surface: var(--bg-panel);
  --surface-strong: var(--bg-elevated);
  --line: var(--border-subtle);
  --line-strong: var(--border-default);
  --text: var(--fg-body);
  --text-soft: var(--fg-soft);
  --cyan: var(--accent-cyan);
  --cyan-strong: #5eead4;
  --gold: var(--accent-gold);
  --green: var(--success);
  --danger: var(--error);
  --shadow-soft: var(--shadow-panel);
}
