/* ============================================================
   EstonIA Lab — Console · tokens
   Deriva do design system do Instituto: navy/ink + acento azure,
   neutros de papel quente. IBM Plex Mono em números e rótulos,
   Public Sans na interface. Sem emoji.
   Tema por tokens: default = claro; escuro via prefers-color-scheme
   e sobrescrito pelo data-theme do toggle (vence nos dois sentidos).
   ============================================================ */
@import url("https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,400&family=IBM+Plex+Mono:wght@400;500;600&display=swap");

:root {
  /* rampas base */
  --navy-950:#081525; --navy-900:#0C1B30; --navy-800:#102842; --navy-700:#143559;
  --navy-600:#1D4877; --navy-500:#2C5E92; --navy-400:#5B84AC; --navy-300:#93AEC9;
  --navy-200:#C4D3E1; --navy-100:#E4EBF2; --navy-50:#F2F5F9;
  --azure-700:#12659C; --azure-600:#167FC4; --azure-500:#1E9BE0; --azure-400:#4FB6EC;
  --azure-300:#8FD1F4; --azure-100:#DEF1FC; --azure-50:#EFF8FE;
  --paper:#FBFAF8; --paper-2:#F4F1EC; --ink:#0C1A2E;
  --gray-600:#525C6E; --gray-500:#697488; --gray-400:#98A1B0; --gray-300:#C8CED8;
  --gray-200:#E2E6EC; --gray-100:#EFF1F5;
  --success-600:#2E7D5B; --success-100:#DCEFE6;
  --warning-600:#B77A16; --warning-100:#F6EBD3;
  --danger-600:#B23B3B; --danger-100:#F4DEDE;

  --font-sans:'Public Sans','Helvetica Neue',Arial,sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,'SF Mono',Menlo,monospace;

  /* tipografia / espaçamento */
  --step-0:14px; --step-1:16px; --step-2:20px; --step-3:26px; --step-4:34px; --step-5:46px;
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:24px; --sp-6:32px; --sp-7:48px;
  --radius:12px; --radius-sm:8px; --radius-lg:18px;

  /* aliases semânticos — CLARO */
  --bg:var(--paper); --bg-2:var(--paper-2);
  --rail:var(--navy-900); --rail-ink:#EAF0F6; --rail-muted:var(--navy-300); --rail-line:rgba(255,255,255,.10);
  --surface:#FFFFFF; --surface-2:var(--gray-100);
  --text:var(--ink); --text-muted:var(--gray-500); --text-subtle:var(--gray-400);
  --border:var(--gray-200); --border-strong:var(--gray-300); --divider:var(--gray-200);
  --accent:var(--azure-600); --accent-bright:var(--azure-500); --accent-soft:var(--azure-50);
  --primary:var(--navy-700); --primary-ink:#fff;
  --ring:var(--azure-500);
  --pos:var(--success-600); --pos-soft:var(--success-100);
  --neg:var(--danger-600); --neg-soft:var(--danger-100);
  --warn:var(--warning-600); --warn-soft:var(--warning-100);
  --shadow:0 1px 2px rgba(12,26,46,.06), 0 8px 24px rgba(12,26,46,.06);
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg:var(--navy-950); --bg-2:var(--navy-900);
    --rail:#060F1C; --rail-ink:#EAF0F6; --rail-muted:var(--navy-300); --rail-line:rgba(255,255,255,.08);
    --surface:var(--navy-900); --surface-2:var(--navy-800);
    --text:#EAF0F6; --text-muted:var(--navy-300); --text-subtle:var(--navy-400);
    --border:rgba(255,255,255,.12); --border-strong:rgba(255,255,255,.20); --divider:rgba(255,255,255,.10);
    --accent:var(--azure-400); --accent-bright:var(--azure-400); --accent-soft:rgba(79,182,236,.12);
    --primary:var(--azure-600); --primary-ink:#fff;
    --pos:#5BB98B; --pos-soft:rgba(46,125,91,.18);
    --neg:#E07A7A; --neg-soft:rgba(178,59,59,.20);
    --warn:#D6A24A; --warn-soft:rgba(183,122,22,.18);
    --shadow:0 1px 2px rgba(0,0,0,.4), 0 8px 28px rgba(0,0,0,.35);
  }
}

/* toggle explícito vence a media query nos dois sentidos */
:root[data-theme="light"] {
  --bg:var(--paper); --bg-2:var(--paper-2);
  --rail:var(--navy-900); --rail-line:rgba(255,255,255,.10);
  --surface:#FFFFFF; --surface-2:var(--gray-100);
  --text:var(--ink); --text-muted:var(--gray-500); --text-subtle:var(--gray-400);
  --border:var(--gray-200); --border-strong:var(--gray-300); --divider:var(--gray-200);
  --accent:var(--azure-600); --accent-bright:var(--azure-500); --accent-soft:var(--azure-50);
  --primary:var(--navy-700);
  --pos:var(--success-600); --pos-soft:var(--success-100);
  --neg:var(--danger-600); --neg-soft:var(--danger-100);
  --warn:var(--warning-600); --warn-soft:var(--warning-100);
  --shadow:0 1px 2px rgba(12,26,46,.06), 0 8px 24px rgba(12,26,46,.06);
}
:root[data-theme="dark"] {
  --bg:var(--navy-950); --bg-2:var(--navy-900);
  --rail:#060F1C; --rail-line:rgba(255,255,255,.08);
  --surface:var(--navy-900); --surface-2:var(--navy-800);
  --text:#EAF0F6; --text-muted:var(--navy-300); --text-subtle:var(--navy-400);
  --border:rgba(255,255,255,.12); --border-strong:rgba(255,255,255,.20); --divider:rgba(255,255,255,.10);
  --accent:var(--azure-400); --accent-bright:var(--azure-400); --accent-soft:rgba(79,182,236,.12);
  --primary:var(--azure-600);
  --pos:#5BB98B; --pos-soft:rgba(46,125,91,.18);
  --neg:#E07A7A; --neg-soft:rgba(178,59,59,.20);
  --warn:#D6A24A; --warn-soft:rgba(183,122,22,.18);
  --shadow:0 1px 2px rgba(0,0,0,.4), 0 8px 28px rgba(0,0,0,.35);
}