/**
 * NEBO Design Tokens — single source of truth
 * Load before all other Nebo stylesheets.
 *
 * Layers:
 * 1. --token-*     Raw immutable values
 * 2. --nebo-*      Semantic aliases (default = platform dark identity)
 * 3. Context scopes override semantics per surface (player light shell, public, console, auth)
 */

:root {
  /* ─── Brand ─────────────────────────────────────────────── */
  --token-brand-primary: #10b981;
  --token-brand-primary-hover: #059669;
  --token-brand-primary-active: #047857;
  --token-brand-primary-light: #34d399;
  --token-brand-primary-muted: rgba(16, 185, 129, 0.14);
  --token-brand-primary-border: rgba(16, 185, 129, 0.28);
  --token-brand-rgb: 16, 185, 129;

  /* ─── Surfaces (dark platform identity) ─────────────────── */
  --token-bg: #020617;
  --token-surface: #0f172a;
  --token-surface-elevated: #1e293b;
  --token-surface-overlay: rgba(15, 23, 42, 0.88);

  /* Phase 5 spec aliases (map to existing dark tokens) */
  --token-bg-canvas: var(--token-bg);
  --token-bg-surface: var(--token-surface);
  --token-bg-elevated: var(--token-surface-elevated);
  --token-border-subtle: var(--token-border);

  /* Light shells (Dreams POS player / public / console — transitional) */
  --token-surface-light: #f8fafc;
  --token-surface-light-elevated: #ffffff;
  --token-surface-light-muted: #f1f5f9;

  /* ─── Text ──────────────────────────────────────────────── */
  --token-text-primary: #f8fafc;
  --token-text-secondary: #94a3b8;
  --token-text-muted: #64748b;
  --token-text-subtle: #475569;

  --token-text-on-light-primary: #0f172a;
  --token-text-on-light-secondary: #334155;
  --token-text-on-light-muted: #64748b;

  /* ─── Borders ───────────────────────────────────────────── */
  --token-border: rgba(255, 255, 255, 0.08);
  --token-border-strong: rgba(148, 163, 184, 0.18);
  --token-border-light: #e2e8f0;
  --token-border-light-strong: #cbd5e1;
  --token-input-border: #e2e8f0;

  /* ─── Status (green cyber palette — no orange/yellow theme leaks) ─ */
  --token-status-success: var(--token-brand-primary);
  --token-status-success-muted: var(--token-brand-primary-muted);
  --token-status-warning: var(--token-brand-primary-light);
  --token-status-warning-muted: rgba(52, 211, 153, 0.14);
  --token-status-caution: var(--token-brand-primary-hover);
  --token-status-caution-muted: rgba(5, 150, 105, 0.14);
  --token-status-danger: #ef4444;
  --token-status-danger-muted: rgba(239, 68, 68, 0.14);
  --token-status-info: #3b82f6;
  --token-status-info-muted: rgba(59, 130, 246, 0.14);

  /* Rank / highlight accents (emerald instead of gold/bronze) */
  --token-rank-highlight: var(--token-brand-primary-light);
  --token-rank-secondary: #94a3b8;
  --token-rank-tertiary: var(--token-brand-primary-hover);

  /* Console ops accent (neutral ops, not player brand) */
  --token-console-accent: #475569;
  --token-console-accent-strong: #1e293b;
  --token-console-ops: #0f766e;
  --token-console-attention: var(--token-brand-primary-active);
  --token-console-attention-bg: #ecfdf5;

  /* Bootstrap palette remap — loaded before bootstrap.min.css consumers */
  --bs-primary: var(--token-brand-primary);
  --bs-primary-rgb: var(--token-brand-rgb);
  --bs-success: var(--token-brand-primary);
  --bs-success-rgb: var(--token-brand-rgb);
  --bs-warning: var(--token-brand-primary-light);
  --bs-warning-rgb: 52, 211, 153;
  --bs-orange: var(--token-brand-primary);
  --bs-yellow: var(--token-brand-primary-light);

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

  /* Fluid marketing spacing */
  --token-space-xs: clamp(0.5rem, 2vw, 0.75rem);
  --token-space-sm: clamp(1rem, 3vw, 1.25rem);
  --token-space-md: clamp(1.5rem, 4vw, 2.5rem);
  --token-space-lg: clamp(2.5rem, 6vw, 4rem);
  --token-space-xl: clamp(4rem, 8vw, 6.5rem);

  /* Layout */
  --token-page-padding: clamp(1rem, 2.4vw, 1.75rem);
  --token-sidebar-width: 260px;
  --token-sidebar-width-compact: 252px;
  --token-topbar-height: 64px;
  --token-page-max-width: 1280px;
  --token-page-max-width-wide: 1400px;
  --token-dashboard-max-width: 1200px;
  --token-dashboard-max-width-wide: 1400px;
  --token-dashboard-padding-x: clamp(1rem, 2.5vw, 1.5rem);
  --token-dashboard-header-gap: clamp(1.25rem, 2vw, 1.75rem);
  --token-dashboard-section-gap: clamp(1.5rem, 2.6vw, 2rem);

  /* ─── Radius ────────────────────────────────────────────── */
  --token-radius-xs: 0.375rem;
  --token-radius-sm: 0.5rem;
  --token-radius-md: 0.75rem;
  --token-radius-lg: 1rem;
  --token-radius-xl: 1.25rem;
  --token-radius-pill: 999px;

  /* ─── Shadow ────────────────────────────────────────────── */
  --token-shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.06);
  --token-shadow-sm: 0 4px 12px rgba(0, 0, 0, 0.25);
  --token-shadow-md: 0 8px 24px rgba(0, 0, 0, 0.35);
  --token-shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.4);
  --token-shadow-light-sm: 0 1px 3px rgba(15, 23, 42, 0.06), 0 8px 24px rgba(15, 23, 42, 0.06);
  --token-shadow-light-lg: 0 4px 6px rgba(15, 23, 42, 0.04), 0 20px 48px rgba(15, 23, 42, 0.08);

  /* ─── Motion ────────────────────────────────────────────── */
  --token-duration-fast: 120ms;
  --token-duration-normal: 200ms;
  --token-duration-slow: 320ms;
  --token-ease-standard: cubic-bezier(0.4, 0, 0.2, 1);
  --token-ease-emphasized: cubic-bezier(0.2, 0, 0, 1);

  /* ─── Typography ────────────────────────────────────────── */
  --token-font-sans: 'Poppins', sans-serif;
  --token-font-mono: 'JetBrains Mono', 'Courier New', ui-monospace, monospace;
  --token-font-size-base: 0.875rem;
  --token-line-height: 1.5;
  --token-line-height-tight: 1.25;
  --token-line-height-relaxed: 1.65;
  --token-measure-prose: 42rem;
  --token-measure-narrow: 32rem;

  /* Phase 7 — Type scale (fluid where noted) */
  --token-type-display-size: clamp(1.75rem, 3.5vw, 2.25rem);
  --token-type-display-weight: 700;
  --token-type-display-line: 1.15;

  --token-type-h1-size: clamp(1.5rem, 3vw, 1.75rem);
  --token-type-h1-weight: 700;
  --token-type-h1-line: 1.2;

  --token-type-h2-size: clamp(1.0625rem, 2vw, 1.25rem);
  --token-type-h2-weight: 700;
  --token-type-h2-line: 1.3;

  --token-type-h3-size: 1.0625rem;
  --token-type-h3-weight: 600;
  --token-type-h3-line: 1.35;

  --token-type-h4-size: 1rem;
  --token-type-h4-weight: 600;
  --token-type-h4-line: 1.35;

  --token-type-body-lg-size: 0.9375rem;
  --token-type-body-lg-line: 1.65;

  --token-type-body-size: 0.875rem;
  --token-type-body-line: 1.5;

  --token-type-caption-size: 0.8125rem;
  --token-type-caption-line: 1.45;

  --token-type-label-size: 0.75rem;
  --token-type-label-weight: 600;
  --token-type-label-line: 1.3;
  --token-type-label-tracking: 0.04em;

  --token-type-mono-size: 0.8125rem;
  --token-type-mono-line: 1.55;

  /* Phase 7 — Technical surfaces */
  --token-terminal-bg: var(--token-surface);
  --token-terminal-border: var(--token-border);
  --token-terminal-text: var(--token-text-secondary);
  --token-terminal-prompt: var(--token-brand-primary);
  --token-terminal-accent-border: var(--token-brand-primary);

  --token-code-bg: var(--token-surface);
  --token-code-bg-light: var(--token-surface-light-muted);
  --token-code-text: var(--token-text-secondary);
  --token-code-text-light: var(--token-text-on-light-secondary);
  --token-code-border: var(--token-border-strong);
  --token-code-border-light: var(--token-border-light);

  /* ─── Semantic aliases (platform dark default) ──────────── */
  --nebo-brand: var(--token-brand-primary);
  --nebo-brand-hover: var(--token-brand-primary-hover);
  --nebo-brand-active: var(--token-brand-primary-active);
  --nebo-brand-light: var(--token-brand-primary-light);
  --nebo-brand-muted: var(--token-brand-primary-muted);
  --nebo-brand-border: var(--token-brand-primary-border);
  --nebo-brand-dark: var(--token-brand-primary-hover);
  --nebo-brand-rgb: var(--token-brand-rgb);

  --green: var(--nebo-brand);
  --green-dark: var(--nebo-brand-hover);
  --green-darker: var(--nebo-brand-active);

  --nebo-bg: var(--token-bg);
  --nebo-bg-elevated: var(--token-surface);
  --nebo-bg-card: var(--token-surface-overlay);
  --nebo-border: var(--token-border);
  --nebo-border-strong: var(--token-border-strong);

  --nebo-text: var(--token-text-primary);
  --nebo-text-secondary: var(--token-text-secondary);
  --nebo-text-muted: var(--token-text-muted);
  --nebo-text-subtle: var(--token-text-subtle);

  --nebo-success: var(--token-status-success);
  --nebo-warning: var(--token-status-warning);
  --nebo-danger: var(--token-status-danger);
  --nebo-info: var(--token-status-info);

  --nebo-sidebar-width: var(--token-sidebar-width);
  --nebo-topbar-height: var(--token-topbar-height);
  --nebo-page-max-width: var(--token-page-max-width);
  --nebo-page-max-width-wide: var(--token-page-max-width-wide);
  --nebo-page-padding: var(--token-page-padding);
  --nebo-toast-top: 1rem;

  --dashboard-page-max-width: var(--token-dashboard-max-width);
  --dashboard-page-max-width-wide: var(--token-dashboard-max-width-wide);
  --dashboard-page-padding-x: var(--token-dashboard-padding-x);
  --dashboard-page-header-gap: var(--token-dashboard-header-gap);
  --dashboard-page-section-gap: var(--token-dashboard-section-gap);

  --space-xs: var(--token-space-xs);
  --space-sm: var(--token-space-sm);
  --space-md: var(--token-space-md);
  --space-lg: var(--token-space-lg);
  --space-xl: var(--token-space-xl);

  --nebo-radius-sm: var(--token-radius-sm);
  --nebo-radius-md: var(--token-radius-md);
  --nebo-radius-lg: var(--token-radius-lg);
  --nebo-radius-xl: var(--token-radius-xl);
  --nebo-radius-pill: var(--token-radius-pill);
  --radius-md: 0.875rem;
  --radius-lg: var(--token-radius-xl);

  --nebo-shadow-sm: var(--token-shadow-sm);
  --nebo-shadow-md: var(--token-shadow-md);
  --nebo-shadow-lg: var(--token-shadow-lg);

  --nebo-font-sans: var(--token-font-sans);
  --nebo-font-mono: var(--token-font-mono);
  --nebo-font-size-base: var(--token-font-size-base);
  --nebo-line-height: var(--token-line-height);

  /* Phase 7 semantic type aliases */
  --nebo-type-display-size: var(--token-type-display-size);
  --nebo-type-h1-size: var(--token-type-h1-size);
  --nebo-type-h2-size: var(--token-type-h2-size);
  --nebo-type-h3-size: var(--token-type-h3-size);
  --nebo-type-h4-size: var(--token-type-h4-size);
  --nebo-type-body-lg-size: var(--token-type-body-lg-size);
  --nebo-type-body-size: var(--token-type-body-size);
  --nebo-type-caption-size: var(--token-type-caption-size);
  --nebo-type-label-size: var(--token-type-label-size);
  --nebo-type-mono-size: var(--token-type-mono-size);
  --nebo-measure-prose: var(--token-measure-prose);
  --nebo-measure-narrow: var(--token-measure-narrow);

  --nebo-input-border: var(--token-input-border);

  /* ─── Phase 6 — Component system (canonical primitives) ─── */
  --nebo-component-card-bg: var(--token-surface-light-elevated);
  --nebo-component-card-border: var(--token-border-light);
  --nebo-component-card-radius: var(--token-radius-sm);
  --nebo-component-card-shadow: none;
  --nebo-component-card-shadow-hover: var(--token-shadow-light-sm);
  --nebo-component-card-padding: var(--token-space-4);
  --nebo-component-card-header-gap: var(--token-space-3);

  --nebo-component-btn-radius: var(--token-radius-xs);
  --nebo-component-btn-gap: 0.35rem;
  --nebo-component-btn-padding-y: 0.5rem;
  --nebo-component-btn-padding-x: 1rem;

  --nebo-component-badge-radius: var(--token-radius-pill);
  --nebo-component-badge-padding-y: 0.2rem;
  --nebo-component-badge-padding-x: 0.55rem;
  --nebo-component-badge-font-size: 0.6875rem;

  --nebo-component-table-border: var(--token-border-light);
  --nebo-component-table-row-hover: var(--token-surface-light-muted);

  --nebo-component-empty-icon-opacity: 0.5;
  --nebo-component-empty-padding: var(--token-space-5);

  --nebo-component-skeleton-base: var(--token-surface-light-muted);
  --nebo-component-skeleton-highlight: var(--token-surface-light-elevated);

  --nebo-component-alert-radius: var(--token-radius-sm);
  --nebo-component-form-radius: var(--token-radius-xs);
  --nebo-component-form-border: var(--token-input-border);
  --nebo-component-form-focus-ring: rgba(var(--token-brand-rgb), 0.85);
}

body.nebo-app {
  --nebo-toast-top: calc(var(--nebo-topbar-height) + 0.75rem);
}

/* ─── Player portal (Dreams POS light shell — brand unified) ─ */
body.nebo-dreams-app.nebo-app {
  --nebo-app-surface: var(--token-surface-light);
  --nebo-app-text: var(--token-text-on-light-primary);
  --nebo-app-text-muted: var(--token-text-on-light-muted);
  --nebo-sidebar-width: var(--token-sidebar-width-compact);

  /* Phase 5 — hybrid player atmosphere (dark heroes, readable content) */
  --nebo-atmosphere-canvas: var(--token-bg-canvas);
  --nebo-atmosphere-surface: var(--token-bg-surface);
  --nebo-atmosphere-elevated: var(--token-bg-elevated);
  --nebo-atmosphere-border: var(--token-border-subtle);
  --nebo-atmosphere-hero-text: var(--token-text-primary);
  --nebo-atmosphere-hero-muted: var(--token-text-secondary);
  --nebo-atmosphere-card-bg: var(--token-surface-light-elevated);
  --nebo-atmosphere-card-border: var(--token-border-light);
  --nebo-atmosphere-card-text: var(--token-text-on-light-primary);
  --nebo-atmosphere-card-muted: var(--token-text-subtle);
  --nebo-atmosphere-brand: var(--token-brand-primary);
  --nebo-atmosphere-brand-soft: var(--token-brand-primary-muted);
  --nebo-atmosphere-grid-opacity: 0.03;
  --nebo-atmosphere-glow-opacity: 0.025;
}

/* ─── Public marketing (light surface, emerald brand) ─────── */
body.nebo-dreams-public {
  --nebo-brand: var(--token-brand-primary);
  --nebo-brand-dark: var(--token-brand-primary-hover);
  --nebo-brand-light: var(--token-brand-primary-light);
  --nebo-brand-hover: var(--token-brand-primary-hover);
  --nebo-ink: var(--token-text-on-light-primary);
  --nebo-muted: var(--token-text-on-light-muted);
  --nebo-surface: var(--token-surface-light);
  --nebo-surface-elevated: var(--token-surface-light-elevated);
  --nebo-border: var(--token-border-light);
  --nebo-radius: var(--token-radius-md);
  --nebo-radius-lg: var(--token-radius-lg);
  --nebo-shadow: var(--token-shadow-light-sm);
  --nebo-shadow-lg: var(--token-shadow-light-lg);
}

/* ─── Nebo Console (ops light shell, shared brand for actions) ─ */
body.nebo-dreams-app.nebo-console {
  --nebo-console-sidebar-width: var(--token-sidebar-width-compact);
  --nebo-console-surface: var(--token-surface-light-muted);
  --nebo-console-panel: var(--token-surface-light-elevated);
  --nebo-console-border: var(--token-border-light);
  --nebo-console-text: var(--token-text-on-light-primary);
  --nebo-console-muted: var(--token-text-on-light-muted);
  --nebo-console-accent: var(--token-console-accent);
  --nebo-console-accent-strong: var(--token-console-accent-strong);
  --nebo-console-ops: var(--token-console-ops);
  --nebo-console-attention: var(--token-console-attention);
  --nebo-console-attention-bg: var(--token-console-attention-bg);
}

/* ─── Auth (light isolated surface) ───────────────────────── */
body.nebo-dreams-auth.account-page {
  --nebo-auth-bg: var(--token-surface-light-elevated);
}