/* Atlas IQ design tokens — v1.0
   Dark-only system. Import once at the app root.
   Fonts: load Archivo (400/500/600/700/800) and JetBrains Mono (400/500), e.g.
   https://fonts.googleapis.com/css2?family=Archivo:wght@400;500;600;700;800&family=JetBrains+Mono:wght@400;500&display=swap
*/
:root {
  color-scheme: dark;

  /* Surfaces — ink navies from the app icon. Never use pure #000 next to imagery. */
  --aiq-bg-void: #080C18;      /* page background, icon tile */
  --aiq-bg-1: #0C1222;         /* level 0: sidebars, cards, inputs */
  --aiq-bg-2: #111A2E;         /* level 1: panels, chips */
  --aiq-bg-3: #18233B;         /* raised / selected rows, active nav */
  --aiq-line-1: #1A2540;       /* dividers, card borders */
  --aiq-line-2: #24314D;       /* panel borders */
  --aiq-line-3: #34446A;       /* control borders, overlay borders */
  --aiq-glass: rgba(17, 26, 46, 0.82);   /* overlays floating on imagery */

  /* Text — all pass 4.5:1 on --aiq-bg-2 */
  --aiq-fg-1: #E8EEF8;         /* primary */
  --aiq-fg-2: #9DAAC2;         /* secondary */
  --aiq-fg-3: #8190AB;         /* tertiary, captions */
  --aiq-fg-body: #C9D3E4;      /* long-form body */
  --aiq-fg-disabled: #56637E;
  --aiq-fg-on-accent: #FFFFFF;

  /* Accent — Atlas Blue (the icon globe). The single interactive colour. */
  --aiq-accent: #0A66C2;        /* fills, borders, focus, checkbox accent */
  --aiq-accent-text: #5AA2EE;   /* accent used AS TEXT/ICON on dark (links, ghost buttons, overlines) */
  --aiq-accent-hover: #8CC0F5;  /* link hover */
  --aiq-accent-wash: #0B2747;   /* focus ring, selected background */

  /* Beacon — AOIs and analyst annotations (from the icon's dot) */
  --aiq-annotate: #FFC93C;
  --aiq-annotate-text: #FFD873;
  --aiq-annotate-wash: #3A2E0B;
  --aiq-annotate-fill: rgba(255, 201, 60, 0.12);

  /* Status — always pair with an icon/glyph or label */
  --aiq-ok: #3DDC97;       --aiq-ok-bg: #0E2A1F;     --aiq-ok-line: #1F5A40;
  --aiq-warn: #F2C14E;     --aiq-warn-bg: #33290B;   --aiq-warn-line: #6B5518;
  --aiq-danger: #FF5A5F;   --aiq-danger-text: #FF8C8F; --aiq-danger-bg: #3A1214; --aiq-danger-line: #7A2A2E;
  --aiq-info: #6EA8FF;     --aiq-info-bg: #13233D;

  /* Access tiers — drive the top banner and export watermark */
  --aiq-tier-open-bg: #0E2A1F;        --aiq-tier-open-line: #1F5A40;        --aiq-tier-open-fg: #3DDC97;
  --aiq-tier-controlled-bg: #33290B;  --aiq-tier-controlled-line: #6B5518;  --aiq-tier-controlled-fg: #F2C14E;
  --aiq-tier-restricted-bg: #3A1214;  --aiq-tier-restricted-line: #7A2A2E;  --aiq-tier-restricted-fg: #FF8C8F;
  --aiq-tier-sealed-bg: #2A1640;      --aiq-tier-sealed-line: #5A3A86;      --aiq-tier-sealed-fg: #C9A8FF;

  /* Typography */
  --aiq-font-sans: 'Archivo', 'Segoe UI', system-ui, sans-serif;
  --aiq-font-mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', monospace;

  --aiq-text-display-xl: 800 64px/68px var(--aiq-font-sans);  /* letter-spacing -0.01em */
  --aiq-text-display-l: 700 40px/44px var(--aiq-font-sans);
  --aiq-text-heading: 700 24px/30px var(--aiq-font-sans);
  --aiq-text-title: 600 18px/26px var(--aiq-font-sans);
  --aiq-text-body: 400 15px/24px var(--aiq-font-sans);
  --aiq-text-label: 500 13px/18px var(--aiq-font-sans);
  --aiq-text-overline: 500 11px/16px var(--aiq-font-mono);   /* uppercase, letter-spacing 0.12em */
  --aiq-text-data: 400 13px/20px var(--aiq-font-mono);
  --aiq-text-data-s: 400 11px/16px var(--aiq-font-mono);

  /* Spacing — 4px base */
  --aiq-space-1: 4px;  --aiq-space-2: 8px;  --aiq-space-3: 12px; --aiq-space-4: 16px;
  --aiq-space-5: 24px; --aiq-space-6: 32px; --aiq-space-7: 48px; --aiq-space-8: 64px;

  /* Radius — tight */
  --aiq-radius-xs: 2px;    /* segmented items, tier tags */
  --aiq-radius-sm: 4px;    /* default: buttons, inputs, cards */
  --aiq-radius-md: 8px;    /* panels, dialogs, imagery frames */
  --aiq-radius-pill: 999px;/* status chips & session chip only */

  /* Elevation — borders first; shadow only for overlays on imagery & dialogs */
  --aiq-shadow-overlay: 0 12px 32px rgba(0, 0, 0, 0.55);
  --aiq-focus-ring: 0 0 0 3px var(--aiq-accent-wash);

  /* Controls */
  --aiq-control-h: 40px;  --aiq-control-h-sm: 32px;  --aiq-touch-min: 44px;

  /* Motion */
  --aiq-duration: 160ms;
  --aiq-ease: cubic-bezier(0.2, 0, 0.2, 1);
}

html, body { background: var(--aiq-bg-void); color: var(--aiq-fg-1); font-family: var(--aiq-font-sans); }
a { color: var(--aiq-accent-text); }
a:hover { color: var(--aiq-accent-hover); }
:focus-visible { outline: none; box-shadow: var(--aiq-focus-ring); border-color: var(--aiq-accent); }