/*
 * RollWithIt design-system tokens — Phase 1.0
 *
 * IMPORTANT:
 * - These are presentation-only variables.
 * - No JavaScript may depend on these names or their values.
 * - Legacy style.css remains authoritative during Phase 1; these tokens are
 *   intentionally opt-in and therefore MUST NOT change the current rendering.
 * - Components/pages will be migrated to these tokens incrementally and tested
 *   in LAB before the legacy declarations are removed.
 */
:root {
    /* Color */
    --ui-color-bg: #0b1119;
    --ui-color-surface: #101925;
    --ui-color-surface-raised: #152131;
    --ui-color-text: #f4eee5;
    --ui-color-text-muted: #aeb8c7;
    --ui-color-border: #3a332c;
    --ui-color-accent: #c88748;
    --ui-color-accent-bright: #e2b06f;
    --ui-color-danger: #d8786c;

    /* Typography */
    --ui-font-sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --ui-font-display: Georgia, "Times New Roman", serif;

    /* Geometry */
    --ui-radius-control: 8px;
    --ui-radius-panel: 14px;
    --ui-radius-modal: 14px;
    --ui-control-height: 38px;

    /* Spacing */
    --ui-space-1: .25rem;
    --ui-space-2: .5rem;
    --ui-space-3: .75rem;
    --ui-space-4: 1rem;
    --ui-space-5: 1.5rem;
    --ui-space-6: 2rem;

    /* Motion */
    --ui-motion-fast: 160ms;
    --ui-motion-medium: 280ms;
    --ui-motion-slow: 520ms;
    --ui-motion-ease: cubic-bezier(.2,.8,.2,1);

    /* Elevation */
    --ui-shadow-panel: 0 10px 30px rgba(0,0,0,.08);
    --ui-shadow-modal: 0 24px 80px rgba(0,0,0,.45);
}

/* System scopes are intentionally separate even while values are inherited.
   Future PF2e/SWADE redesigns can override tokens here without touching JS. */
body[data-ui-system="pf2e"] {
    --ui-system-name: "pf2e";
}

body[data-ui-system="swade"] {
    --ui-system-name: "swade";
}