/* Atlas Cockpit Design System V1 — Tokens
   Source: Design System V1 contracts validated by Davide.
   Mobile first. Premium, sober, modern, dark glass. */

:root {
  color-scheme: dark;

  --atlas-bg: #050814;
  --atlas-bg-2: #091121;
  --atlas-bg-3: #060a16;
  --atlas-surface: rgba(13, 20, 35, .45);
  --atlas-surface-strong: rgba(8, 15, 30, .86);
  --atlas-surface-soft: rgba(255, 255, 255, .035);
  --atlas-glass: linear-gradient(145deg, rgba(18, 31, 54, .88), rgba(8, 15, 30, .92));
  --atlas-glass-soft: linear-gradient(180deg, rgba(18, 31, 51, .86), rgba(11, 18, 33, .80));

  --atlas-primary: #0d6efd;
  --atlas-primary-2: #0b5ed7;
  --atlas-primary-hover: #094db3;
  --atlas-primary-soft: rgba(13, 110, 253, .13);
  --atlas-success: #22c55e;
  --atlas-success-soft: rgba(34, 197, 94, .12);
  --atlas-warning: #f59e0b;
  --atlas-warning-soft: rgba(245, 158, 11, .12);
  --atlas-danger: #dc2626;
  --atlas-danger-soft: rgba(220, 38, 38, .12);
  --atlas-info: #3b82f6;
  --atlas-violet: #9b7cff;
  --atlas-teal: #25e0b0;

  --atlas-text: #f8fafc;
  --atlas-text-2: #eaf1ff;
  --atlas-muted: #cbd5e1;
  --atlas-soft: #94a3b8;
  --atlas-faint: #64748b;

  --atlas-border: rgba(255, 255, 255, .08);
  --atlas-border-2: rgba(143, 178, 230, .20);
  --atlas-border-strong: rgba(157, 196, 255, .28);

  --atlas-radius-xs: 8px;
  --atlas-radius-sm: 12px;
  --atlas-radius-md: 16px;
  --atlas-radius-lg: 20px;
  --atlas-radius-xl: 28px;
  --atlas-radius-pill: 999px;

  --atlas-space-1: 4px;
  --atlas-space-2: 8px;
  --atlas-space-3: 12px;
  --atlas-space-4: 16px;
  --atlas-space-5: 20px;
  --atlas-space-6: 24px;
  --atlas-space-8: 32px;
  --atlas-space-10: 40px;

  --atlas-shadow-sm: 0 10px 28px rgba(0, 0, 0, .18);
  --atlas-shadow-md: 0 18px 55px rgba(0, 0, 0, .24);
  --atlas-shadow-lg: 0 32px 96px rgba(0, 0, 0, .54);
  --atlas-shadow-primary: 0 16px 38px rgba(13, 110, 253, .26);

  --atlas-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --atlas-leading: 1.5;
  --atlas-transition: .16s ease;
  --atlas-focus: 0 0 0 3px rgba(13, 110, 253, .18);

  --atlas-container: min(1180px, calc(100% - 32px));
  --atlas-topbar-h: 68px;

  --atlas-z-nav: 50;
  --atlas-z-overlay: 1000;
  --atlas-z-toast: 1200;
}

@media (min-width: 768px) {
  :root { --atlas-container: min(1220px, calc(100% - 48px)); }
}

@media (min-width: 1280px) {
  :root { --atlas-container: min(1380px, calc(100% - 72px)); }
}