:root {
/* Surface */
--bg-base: #000000;
--bg-elevated: #0a0a0f;
/* Text */
--text: #ffffff;
--text-muted: rgba(255,255,255,0.7);
--text-soft: rgba(255,255,255,0.6);
--text-subtle: rgba(255,255,255,0.5);
--text-faint: rgba(255,255,255,0.4);
/* Glass */
--glass-bg: rgba(255,255,255,0.01);
--glass-bg-hover: rgba(255,255,255,0.05);
--glass-border-top: rgba(255,255,255,0.45);
--glass-border-mid: rgba(255,255,255,0.15);
--glass-shadow-inset: rgba(255,255,255,0.10);
--glass-divider: rgba(255,255,255,0.10);
/* Accent */
--accent: #a78bfa;
--accent-deep: #7c3aed;
/* Radius */
--r-pill: 9999px;
--r-card: 24px;
--r-soft: 16px;
--r-tight: 12px;
/* Spacing scale (px) */
--sp-1: 4px;
--sp-2: 8px;
--sp-3: 12px;
--sp-4: 16px;
--sp-6: 24px;
--sp-8: 32px;
--sp-12: 48px;
--sp-16: 64px;
/* Fonts */
--font-display: 'Instrument Serif', Georgia, serif;
--font-body: 'Inter', system-ui, sans-serif;
--font-mono: 'JetBrains Mono', monospace;
/* Motion */
--ease-out: cubic-bezier(.2, .6, .2, 1);
--dur-fast: 0.15s;
--dur-base: 0.3s;
--dur-slow: 0.6s;
}
/* Liquid glass utility class */
.glass {
background: var(--glass-bg);
backdrop-filter: blur(14px);
-webkit-backdrop-filter: blur(14px);
border: 1px solid var(--glass-border-mid);
box-shadow: inset 0 1px 1px var(--glass-shadow-inset);
}