/* ===========================================================
   AiDisco — Light theme tokens.
   Linked as the default theme stylesheet; the theme toggle swaps
   this file's <link href> for styles-dark.css and back. Both
   files define the same custom-property names so the rest of
   the site's CSS/inline styles never need to change.
   =========================================================== */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=Space+Grotesk:wght@500;600;700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root {
  /* base / stage */
  --color-midnight:#0A0A0F;
  --color-indigo-deep:#121826;
  --color-soft-white:#F5F7FA;
  --color-white:#FFFFFF;

  /* neutrals */
  --color-slate-900:#0F1420;
  --color-slate-800:#1F2937;
  --color-slate-600:#475467;
  --color-slate-500:#667085;
  --color-gray-400:#9CA3AF;
  --color-gray-300:#C4C9D2;
  --color-gray-200:#E2E5EA;
  --color-gray-100:#EDEFF3;
  --color-gray-50:#F7F8FA;

  /* accent core — theme-invariant */
  --color-violet:#7B5CFF;
  --color-violet-600:#6A47F5;
  --color-violet-100:#EFEBFF;
  --color-cyan:#00E5FF;
  --color-cyan-600:#00B8CC;
  --color-cyan-100:#E0FBFF;
  --color-magenta:#FF2DA6;
  --color-magenta-600:#DB1E8C;
  --color-magenta-100:#FFE5F4;
  --gradient-brand: linear-gradient(90deg, #7B5CFF 0%, #4C7DFF 55%, #00E5FF 100%);
  --gradient-brand-soft: linear-gradient(90deg, rgba(123,92,255,0.12) 0%, rgba(76,125,255,0.12) 55%, rgba(0,229,255,0.12) 100%);

  /* semantic — surfaces (light stage) */
  --surface-page: var(--color-soft-white);
  --surface-canvas: var(--color-white);
  --surface-card: var(--color-white);
  --surface-sunken: var(--color-gray-50);
  --surface-inverse: var(--color-midnight);
  --surface-inverse-secondary: var(--color-indigo-deep);

  /* semantic — text */
  --text-primary: var(--color-slate-900);
  --text-secondary: var(--color-slate-600);
  --text-muted: var(--color-gray-400);
  --text-inverse: var(--color-soft-white);
  --text-inverse-muted: var(--color-gray-300);
  --text-brand: var(--color-violet-600);
  --text-link: var(--color-violet-600);
  --text-link-hover: var(--color-violet);

  /* semantic — borders */
  --border-subtle: var(--color-gray-200);
  --border-default: var(--color-gray-300);
  --border-strong: var(--color-slate-600);
  --border-inverse: rgba(245,247,250,0.16);
  --border-focus: var(--color-violet);

  /* semantic — status */
  --status-confirmed-bg: var(--color-magenta-100);
  --status-confirmed-fg: var(--color-magenta-600);
  --status-likely-bg: var(--color-gray-100);
  --status-likely-fg: var(--color-slate-600);
  --status-absent-bg: #FFF1F1;
  --status-absent-fg: #C4392B;

  /* data viz */
  --data-self: var(--color-violet);
  --data-rival: var(--color-gray-300);
  --data-track: var(--color-gray-100);

  /* typography */
  --font-display: 'Space Grotesk', ui-sans-serif, system-ui, sans-serif;
  --font-body: 'Inter', ui-sans-serif, system-ui, -apple-system, sans-serif;
  --font-mono: 'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;

  --text-display-xl-size:4rem; --text-display-xl-leading:1.02; --text-display-xl-weight:700;
  --text-display-lg-size:3rem; --text-display-lg-leading:1.05; --text-display-lg-weight:700;
  --text-display-md-size:2.125rem; --text-display-md-leading:1.1; --text-display-md-weight:600;
  --text-display-sm-size:1.5rem; --text-display-sm-leading:1.2; --text-display-sm-weight:600;
  --text-body-xl-size:1.25rem; --text-body-xl-leading:1.55;
  --text-body-lg-size:1.125rem; --text-body-lg-leading:1.6;
  --text-body-md-size:1rem; --text-body-md-leading:1.6;
  --text-body-sm-size:0.875rem; --text-body-sm-leading:1.55;
  --text-body-xs-size:0.75rem; --text-body-xs-leading:1.5;
  --text-label-md-size:0.875rem; --text-label-md-weight:600;
  --text-label-sm-size:0.75rem; --text-label-sm-weight:600;
  --text-button-size:0.9375rem; --text-button-weight:600;
  --tracking-eyebrow:0.14em; --tracking-section:0.22em; --tracking-display:-0.01em;

  /* spacing — 4px base scale */
  --space-1:4px; --space-2:8px; --space-3:12px; --space-4:16px; --space-5:20px; --space-6:24px;
  --space-8:32px; --space-10:40px; --space-12:48px; --space-16:64px; --space-20:80px; --space-24:96px; --space-32:128px;
  --container-max:1200px; --container-narrow:760px; --gutter: var(--space-6);

  /* effects */
  --radius-sm:6px; --radius-md:10px; --radius-lg:16px; --radius-xl:22px; --radius-pill:999px;
  --shadow-xs: 0 1px 2px rgba(15,20,32,0.06);
  --shadow-sm: 0 2px 8px rgba(15,20,32,0.06), 0 1px 2px rgba(15,20,32,0.04);
  --shadow-md: 0 8px 24px rgba(15,20,32,0.08), 0 2px 6px rgba(15,20,32,0.04);
  --shadow-lg: 0 20px 48px rgba(15,20,32,0.12), 0 4px 12px rgba(15,20,32,0.05);
  --glow-violet: 0 0 0 1px rgba(123,92,255,0.16), 0 8px 32px rgba(123,92,255,0.28);
  --glow-cyan: 0 0 0 1px rgba(0,229,255,0.18), 0 8px 28px rgba(0,229,255,0.24);
  --glow-magenta: 0 0 0 1px rgba(255,45,166,0.16), 0 8px 32px rgba(255,45,166,0.24);
  --ease-standard: cubic-bezier(0.2,0.8,0.2,1);
  --ease-out: cubic-bezier(0.16,1,0.3,1);
  --duration-fast:120ms; --duration-base:200ms; --duration-slow:360ms;
}
