:root {
    /* Dimension N design tokens: fuente unica para diseño y codigo. */
    --dn-color-canvas: #020609;
    --dn-color-surface-1: #050b0f;
    --dn-color-surface-2: #081317;
    --dn-color-surface-glass: rgba(5, 14, 18, .76);
    --dn-color-text: #f4f7f8;
    --dn-color-text-muted: #9daab0;
    --dn-color-border: rgba(143, 222, 235, .17);
    --dn-color-border-strong: rgba(143, 222, 235, .34);
    --dn-color-accent: #00e5ff;
    --dn-color-accent-2: #a769ff;
    --dn-color-accent-3: #ff3ac8;
    --dn-gradient-spectrum: linear-gradient(110deg, var(--dn-color-accent), var(--dn-color-accent-2) 52%, var(--dn-color-accent-3));

    --dn-font-display: Sora, Inter, sans-serif;
    --dn-font-body: Inter, Arial, sans-serif;
    --dn-radius-sm: 2px;
    --dn-radius-md: 8px;
    --dn-radius-pill: 999px;
    --dn-space-1: .25rem;
    --dn-space-2: .5rem;
    --dn-space-3: .75rem;
    --dn-space-4: 1rem;
    --dn-space-6: 1.5rem;
    --dn-space-8: 2rem;
    --dn-shadow-focus: 0 0 0 2px var(--dn-color-canvas), 0 0 0 4px var(--dn-color-accent);
    --dn-shadow-panel: 0 24px 80px rgba(0, 0, 0, .28);
    --dn-motion-fast: 160ms;
    --dn-motion-standard: 280ms;
    --dn-ease-out: cubic-bezier(.22, 1, .36, 1);
}