/* ==========================================
UndefinedVerseOfficial
Design Tokens — Obsidian Architecture
========================================== */

:root {
/* Core palette */
--color-obsidian: #090A0C;
--color-graphite: #17191D;
--color-gunmetal: #777E87;
--color-chrome: #D8DCE2;
--color-white: #F4F5F6;
--color-steel: #343B43;

/* Semantic colors */
--color-background: var(--color-obsidian);
--color-surface: var(--color-graphite);
--color-surface-raised: #202328;
--color-text: var(--color-white);
--color-text-muted: #A5ABB3;
--color-border: rgba(216, 220, 226, 0.14);
--color-border-strong: rgba(216, 220, 226, 0.3);
--color-accent: var(--color-chrome);

/* Status colors */
--color-success: #91B7A0;
--color-warning: #D9B879;
--color-error: #D98A8A;
--color-info: #91AFCB;

/* Typography */
--font-heading: "Space Grotesk", "Inter", sans-serif;
--font-body: "Inter", system-ui, sans-serif;
--font-mono: "SFMono-Regular", Consolas, monospace;

--font-size-xs: 0.75rem;
--font-size-sm: 0.875rem;
--font-size-base: 1rem;
--font-size-lg: 1.125rem;
--font-size-xl: 1.375rem;
--font-size-2xl: 1.75rem;
--font-size-3xl: clamp(2rem, 5vw, 3.5rem);
--font-size-display: clamp(2.75rem, 8vw, 5.5rem);

--font-weight-regular: 400;
--font-weight-medium: 500;
--font-weight-semibold: 600;
--font-weight-bold: 700;

--line-height-tight: 1.1;
--line-height-heading: 1.25;
--line-height-body: 1.65;

/* Spacing scale */
--space-1: 0.25rem;
--space-2: 0.5rem;
--space-3: 0.75rem;
--space-4: 1rem;
--space-5: 1.25rem;
--space-6: 1.5rem;
--space-8: 2rem;
--space-10: 2.5rem;
--space-12: 3rem;
--space-16: 4rem;
--space-20: 5rem;
--space-24: 6rem;

/* Layout */
--container-width: 1200px;
--container-padding: clamp(1rem, 4vw, 2.5rem);
--header-height: 4.5rem;

/* Borders and shapes */
--border-width: 1px;
--radius-sm: 0.25rem;
--radius-md: 0.5rem;
--radius-lg: 0.875rem;
--radius-xl: 1.25rem;
--radius-full: 999px;

/* Shadows */
--shadow-soft: 0 8px 24px rgba(0, 0, 0, 0.18);
--shadow-raised: 0 16px 40px rgba(0, 0, 0, 0.3);

/* Motion */
--duration-fast: 140ms;
--duration-normal: 220ms;
--duration-slow: 360ms;

--ease-standard: cubic-bezier(0.2, 0, 0, 1);
--ease-emphasized: cubic-bezier(0.2, 0.8, 0.2, 1);

/* Layering */
--z-background: -1;
--z-content: 1;
--z-header: 10;
--z-overlay: 20;
--z-modal: 30;
--z-toast: 40;
}