/* LUMA Explorer shared design tokens — Version 1.6
   Namespaced (--luma-*) so page-local variables stay isolated.
   Load before page CSS. Pages alias their own tokens one-way to these. */

:root {
    --luma-font-family: 'Inter', 'Segoe UI', system-ui, sans-serif;

    --luma-asset-brand-logo: none;
    --luma-asset-brand-mark: none;
    --luma-asset-map-icon: none;
    --luma-asset-panorama-icon: none;
    --luma-asset-tour-icon: none;

    --luma-color-accent: #00a3e0;
    --luma-color-accent-2: #5ce1ff;
    --luma-color-accent-soft: rgba(0, 163, 224, 0.14);
    --luma-color-success: #2ecc71;
    --luma-color-warning: #f59e0b;
    --luma-color-danger: #ef4444;

    --luma-surface-body: #0b1117;
    --luma-surface-card: #151d28;
    --luma-surface-input: #1f2a38;
    --luma-surface-header: #1a232f;
    --luma-surface-hover: #212c3b;

    /* Text ramp — 4 steps. Nothing dimmer than faint carries meaning. */
    --luma-text-heading: #ffffff;
    --luma-text-main: #e0e0e0;
    --luma-text-muted: #8b9bb4;
    --luma-text-faint: #6b7280;

    /* Border ramp — soft hairline, default, raised. Soft shares the input surface value. */
    --luma-border-soft: #1f2a38;
    --luma-border: #2e3d52;
    --luma-border-strong: #3d516d;
    --luma-border-focus: #00a3e0;

    /* Spacing — 4px base, 6 steps (6px is not on scale; snap in lab) */
    --luma-space-1: 4px;
    --luma-space-2: 8px;
    --luma-space-3: 12px;
    --luma-space-4: 16px;
    --luma-space-5: 24px;
    --luma-space-6: 32px;

    /* Type scale */
    --luma-font-xs: 10px;
    --luma-font-sm: 11px;
    --luma-font-md: 12px;
    --luma-font-lg: 13px;
    --luma-font-xl: 16px;

    --luma-weight-regular: 400;
    --luma-weight-medium: 500;
    --luma-weight-semibold: 600;
    --luma-weight-bold: 700;

    /* Layer stack (z-index) — values map existing surfaces; names frozen here */
    --luma-z-stage: 0;
    --luma-z-rail: 90;
    --luma-z-toolbar: 1000;
    --luma-z-overlay: 1200;
    --luma-z-sheet: 2100;
    --luma-z-dialog: 12500;
    --luma-z-toast: 13000;

    --luma-radius-2xs: 4px;
    --luma-radius-xs: 6px;
    --luma-radius-sm: 8px;
    --luma-radius-md: 12px;
    --luma-radius-lg: 18px;
    --luma-radius-pill: 999px;

    --luma-shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.25);
    --luma-shadow-md: 0 10px 28px -6px rgba(0, 0, 0, 0.4);
    --luma-shadow-lg: 0 24px 48px -12px rgba(0, 0, 0, 0.5);
    --luma-shadow-focus: 0 0 0 3px rgba(0, 163, 224, 0.28);

    --luma-ease-out: cubic-bezier(0.22, 0.61, 0.36, 1);
    --luma-ease-snap: cubic-bezier(0.16, 1, 0.3, 1);

    --luma-hit-min: 24px;
    --luma-touch-min: 44px;
    --luma-bp-mobile: 768px;
    --luma-bp-desktop: 1100px;
    --luma-rail-width: 360px;

    /* Vista editor palette — sky/orange CTAs; not LUMA platform cyan */
    --luma-vista-accent: #38bdf8;
    --luma-vista-accent-2: #7dd3fc;
    --luma-vista-accent-soft: rgba(56, 189, 248, 0.22);
    --luma-vista-accent-wash: rgba(56, 189, 248, 0.12);
    --luma-vista-cta-preview: #f97316;
    --luma-vista-cta-publish: #38bdf8;

    /* Control Panel role badge colours */
    --luma-role-exec: #9b59b6;
    --luma-role-exec-bg: rgba(155, 89, 182, 0.15);
    --luma-role-pm: #e74c3c;
    --luma-role-pm-bg: rgba(231, 76, 60, 0.15);
    --luma-role-org: #e67e22;
    --luma-role-org-bg: rgba(230, 126, 34, 0.15);
    --luma-role-con: #3498db;
    --luma-role-con-bg: rgba(52, 152, 219, 0.15);
    --luma-role-view: #95a5a6;
    --luma-role-view-bg: rgba(149, 165, 166, 0.15);
}
