:root { --primary: #2563eb; --primary-dark: #1d4ed8; --primary-light: #dbeafe; --secondary: #0f172a; --accent: #f59e0b; --neutral-100: #f1f5f9; --neutral-200: #e2e8f0; --neutral-300: #cbd5e1; --neutral-400: #94a3b8; --neutral-500: #64748b; --neutral-700: #334155; --neutral-900: #0f172a; --surface: #ffffff; --surface-alt: #f8fafc; --surface-dark: #0f172a; --text: #1e293b; --text-muted: #64748b; --text-inverse: #f8fafc; --border: #e2e8f0; --success: #16a34a; --error: #dc2626; --text-xs: clamp(1.2rem, 1.17rem + 0.09vw, 1.3rem); --text-s: clamp(1.4rem, 1.37rem + 0.09vw, 1.5rem); --text-m: clamp(1.6rem, 1.53rem + 0.19vw, 1.8rem); --text-l: clamp(1.8rem, 1.67rem + 0.37vw, 2.2rem); --text-xl: clamp(2.2rem, 2rem + 0.56vw, 2.8rem); --text-2xl: clamp(2.8rem, 2.53rem + 0.74vw, 3.6rem); --text-3xl: clamp(3.4rem, 2.93rem + 1.3vw, 4.8rem); --space-2xs: clamp(0.6rem, 0.53rem + 0.19vw, 0.8rem); --space-xs: clamp(0.8rem, 0.67rem + 0.37vw, 1.2rem); --space-s: clamp(1.2rem, 1.07rem + 0.37vw, 1.6rem); --space-m: clamp(1.6rem, 1.33rem + 0.74vw, 2.4rem); --space-l: clamp(2.4rem, 1.87rem + 1.48vw, 4rem); --space-xl: clamp(4rem, 3.2rem + 2.22vw, 6.4rem); --space-2xl: clamp(6.4rem, 5.33rem + 2.96vw, 9.6rem); --space-3xl: clamp(9.6rem, 8rem + 4.44vw, 14.4rem);}.bg-primary { background-color: var(--primary); }.text-primary { color: var(--primary); }.border-primary { border-color: var(--primary); }.bg-secondary { background-color: var(--secondary); }.text-secondary { color: var(--secondary); }.bg-accent { background-color: var(--accent); }.text-accent { color: var(--accent); }.bg-surface { background-color: var(--surface); }.bg-surface-alt { background-color: var(--surface-alt); }.bg-surface-dark { background-color: var(--surface-dark); }.text-text { color: var(--text); }.text-text-muted { color: var(--text-muted); }.text-text-inverse { color: var(--text-inverse); }.border-border { border-color: var(--border); }.text-xs { font-size: var(--text-xs); }.text-s { font-size: var(--text-s); }.text-m { font-size: var(--text-m); }.text-l { font-size: var(--text-l); }.text-xl { font-size: var(--text-xl); }.text-2xl { font-size: var(--text-2xl); }.text-3xl { font-size: var(--text-3xl); }.gap-2xs { gap: var(--space-2xs); }.gap-xs { gap: var(--space-xs); }.gap-s { gap: var(--space-s); }.gap-m { gap: var(--space-m); }.gap-l { gap: var(--space-l); }.gap-xl { gap: var(--space-xl); }.gap-2xl { gap: var(--space-2xl); }.gap-3xl { gap: var(--space-3xl); }