: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); }