/* Maplytics UI tokens
   Shared primitives for the App Shell V2 visual system.
   Keep these tokens stable and scoped so legacy UI remains untouched. */

body.app-shell-v2-enabled {
    --ui-color-surface: #ffffff;
    --ui-color-surface-muted: #f8fafc;
    --ui-color-surface-strong: #eef2ff;
    --ui-color-surface-inverse: #0f172a;
    --ui-color-border: #dbe4f0;
    --ui-color-border-strong: #bfdbfe;
    --ui-color-text: #0f172a;
    --ui-color-text-muted: #64748b;
    --ui-color-primary: #2563eb;
    --ui-color-primary-strong: #1d4ed8;
    --ui-color-primary-soft: #dbeafe;
    --ui-color-accent: #f59e0b;
    --ui-color-accent-soft: #fef3c7;
    --ui-color-success: #059669;
    --ui-color-success-soft: #d1fae5;
    --ui-color-warning: #d97706;
    --ui-color-warning-soft: #ffedd5;
    --ui-color-danger: #dc2626;
    --ui-color-danger-soft: #fee2e2;
    --ui-space-2xs: 0.25rem;
    --ui-space-xs: 0.5rem;
    --ui-space-sm: 0.75rem;
    --ui-space-md: 1rem;
    --ui-space-lg: 1.5rem;
    --ui-space-xl: 2rem;
    --ui-radius-xs: 8px;
    --ui-radius-sm: 12px;
    --ui-radius-md: 16px;
    --ui-radius-lg: 22px;
    --ui-radius-pill: 999px;
    --ui-shadow-panel: 0 18px 50px rgba(15, 23, 42, 0.14);
    --ui-shadow-subtle: 0 8px 24px rgba(15, 23, 42, 0.08);
    --ui-focus-ring: 0 0 0 3px rgba(37, 99, 235, 0.22);
    --ui-control-height: 44px;
    --ui-control-height-sm: 36px;
    --ui-page-max: 1180px;
    --ui-readable-max: 760px;
    --ui-z-header: 700;
    --ui-panel-z: 900;
    --ui-overlay-z: 1100;
    --ui-sheet-z: 1500;
    --ui-modal-z: 1800;
}
