/**
 * Atlas One — Design Tokens
 * ------------------------------------------------
 * Fonte única de verdade de cor, tipografia, espaçamento, grid,
 * radius, sombra e estados. Nenhuma tela deve declarar esses
 * valores soltos no próprio <style> — sempre var(--atlas-*).
 *
 * Origem: Especificação Oficial de Redesign — Atlas One, Seção 1.
 * Toda decisão de valor aqui cita um artigo da Constituição de
 * Experiência (ver documento) — não são escolhas soltas de gosto.
 *
 * Como usar numa página nova:
 *   <link rel="stylesheet" href="/design-system/tokens.css">
 */

:root{
  /* ---------- Escala neutra (Art. 5) ---------- */
  --atlas-tinta-900:#191B22;
  --atlas-tinta-800:#2B2E38;
  --atlas-tinta-700:#3F4350;
  --atlas-tinta-600:#565B62;
  --atlas-tinta-500:#6E7278;
  --atlas-tinta-400:#8F8D80;
  --atlas-tinta-300:#B7B4A5;
  --atlas-tinta-200:#DCD8C8;
  --atlas-tinta-100:#E9E6D8;
  --atlas-tinta-50:#F2EFE5;

  /* ---------- Cores semânticas (Art. 2, Art. 5) ---------- */
  --atlas-gold:#A97A34;          /* Ouro de rota — ação primária */
  --atlas-gold-hover:#8E652A;
  --atlas-gold-soft:#EEE0C4;
  --atlas-gold-deep:#7A5A26;

  --atlas-route:#233A5E;         /* Tinta de rota — dado, IA, link */
  --atlas-route-hover:#1B2D49;
  --atlas-route-soft:#DEE4EE;

  --atlas-olive:#57623F;         /* Território validado — sucesso */
  --atlas-olive-soft:#E5E7D6;

  --atlas-ocre:#9C5A2E;          /* Atenção */
  --atlas-ocre-soft:#F2E1CE;

  --atlas-danger:#8C3B33;        /* Rota bloqueada — erro (extensão, ver Especificação Seção 1) */
  --atlas-danger-soft:#F1DEDA;

  /* ---------- Papéis semânticos (mapeiam a neutra pra uso funcional) ---------- */
  --atlas-bg:var(--atlas-tinta-50);
  --atlas-surface:#FDFCF7;
  --atlas-surface-2:#F8F6EF;
  --atlas-text:var(--atlas-tinta-900);
  --atlas-text-soft:var(--atlas-tinta-600);
  --atlas-text-faint:var(--atlas-tinta-400);
  --atlas-border:var(--atlas-tinta-200);
  --atlas-border-soft:var(--atlas-tinta-100);

  /* ---------- Tipografia (Art. 5) — três papéis, nunca um só ---------- */
  --atlas-font-display:Georgia,'Iowan Old Style','Palatino Linotype','Book Antiqua',serif;
  --atlas-font-body:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  --atlas-font-mono:'SF Mono','JetBrains Mono',Consolas,'Courier New',monospace;

  --atlas-text-hero:48px;    --atlas-text-hero-lh:1.05;
  --atlas-text-h1:36px;      --atlas-text-h1-lh:1.1;
  --atlas-text-h2:27px;      --atlas-text-h2-lh:1.15;
  --atlas-text-h3:20px;      --atlas-text-h3-lh:1.2;
  --atlas-text-body-lg:17px; --atlas-text-body-lg-lh:1.6;
  --atlas-text-body:15px;    --atlas-text-body-lh:1.6;
  --atlas-text-body-sm:13.5px; --atlas-text-body-sm-lh:1.55;
  --atlas-text-caption:12px; --atlas-text-caption-lh:1.4;
  --atlas-text-mono-md:13px;
  --atlas-text-mono-sm:11px;

  /* ---------- Espaçamento (Art. 5) — base 4px ---------- */
  --atlas-space-1:4px;
  --atlas-space-2:8px;
  --atlas-space-3:12px;
  --atlas-space-4:16px;
  --atlas-space-5:24px;
  --atlas-space-6:32px;
  --atlas-space-7:48px;
  --atlas-space-8:64px;
  --atlas-space-9:96px;

  /* ---------- Grid (Art. 5) ---------- */
  --atlas-container:1160px;
  --atlas-reading-column:720px;
  --atlas-gutter:24px;
  --atlas-bp-sm:480px;
  --atlas-bp-md:768px;
  --atlas-bp-lg:1024px;
  --atlas-bp-xl:1280px;

  /* ---------- Radius (Art. 5) ---------- */
  --atlas-radius-sm:4px;
  --atlas-radius-md:8px;
  --atlas-radius-lg:14px;
  --atlas-radius-full:999px;

  /* ---------- Sombra / elevação (Art. 5) — tingida de tinta, nunca cinza-azulado genérico ---------- */
  --atlas-elevation-1:0 1px 2px rgba(25,27,34,0.07);
  --atlas-elevation-2:0 4px 14px rgba(25,27,34,0.10);
  --atlas-elevation-3:0 18px 44px rgba(25,27,34,0.18);

  /* ---------- Movimento (Seção 3 da Especificação) ---------- */
  --atlas-duration-micro:120ms;
  --atlas-duration-padrao:200ms;
  --atlas-duration-momento:500ms;
  --atlas-duration-cerimonia:800ms;
  --atlas-ease-instrumento:cubic-bezier(.22,1,.36,1);

  /* ---------- Foco (Art. 5) ---------- */
  --atlas-focus-ring:0 0 0 2px var(--atlas-surface), 0 0 0 4px var(--atlas-route);
}

/* ---------- Modo escuro — mesmo mapeamento semântico, valores invertidos ---------- */
@media (prefers-color-scheme: dark){
  :root{
    --atlas-tinta-900:#ECEAE0; --atlas-tinta-800:#D5D3C6; --atlas-tinta-700:#B7B6A9;
    --atlas-tinta-600:#9A9A8E; --atlas-tinta-500:#7C7B70; --atlas-tinta-400:#63645C;
    --atlas-tinta-300:#4B4C46; --atlas-tinta-200:#33342E; --atlas-tinta-100:#26261F;
    --atlas-tinta-50:#12141A;

    --atlas-gold:#D8A857; --atlas-gold-hover:#EFCB8C; --atlas-gold-soft:#3A2F1C; --atlas-gold-deep:#EFCB8C;
    --atlas-route:#7FA0D6; --atlas-route-hover:#A9C2E6; --atlas-route-soft:#1E2A3E;
    --atlas-olive:#9CB081; --atlas-olive-soft:#232819;
    --atlas-ocre:#D89A67; --atlas-ocre-soft:#2E2013;
    --atlas-danger:#D98A80; --atlas-danger-soft:#33201D;

    --atlas-bg:#12141A; --atlas-surface:#1A1D24; --atlas-surface-2:#20232A;
    --atlas-text:#ECEAE0; --atlas-text-soft:#B7B6A9; --atlas-text-faint:#7C7B70;
    --atlas-border:#31342E; --atlas-border-soft:#24261F;

    --atlas-elevation-1:0 1px 2px rgba(0,0,0,0.35);
    --atlas-elevation-2:0 4px 14px rgba(0,0,0,0.45);
    --atlas-elevation-3:0 18px 44px rgba(0,0,0,0.6);
  }
}
:root[data-theme="dark"]{
  --atlas-tinta-900:#ECEAE0; --atlas-tinta-800:#D5D3C6; --atlas-tinta-700:#B7B6A9;
  --atlas-tinta-600:#9A9A8E; --atlas-tinta-500:#7C7B70; --atlas-tinta-400:#63645C;
  --atlas-tinta-300:#4B4C46; --atlas-tinta-200:#33342E; --atlas-tinta-100:#26261F;
  --atlas-tinta-50:#12141A;
  --atlas-gold:#D8A857; --atlas-gold-hover:#EFCB8C; --atlas-gold-soft:#3A2F1C; --atlas-gold-deep:#EFCB8C;
  --atlas-route:#7FA0D6; --atlas-route-hover:#A9C2E6; --atlas-route-soft:#1E2A3E;
  --atlas-olive:#9CB081; --atlas-olive-soft:#232819;
  --atlas-ocre:#D89A67; --atlas-ocre-soft:#2E2013;
  --atlas-danger:#D98A80; --atlas-danger-soft:#33201D;
  --atlas-bg:#12141A; --atlas-surface:#1A1D24; --atlas-surface-2:#20232A;
  --atlas-text:#ECEAE0; --atlas-text-soft:#B7B6A9; --atlas-text-faint:#7C7B70;
  --atlas-border:#31342E; --atlas-border-soft:#24261F;
  --atlas-elevation-1:0 1px 2px rgba(0,0,0,0.35);
  --atlas-elevation-2:0 4px 14px rgba(0,0,0,0.45);
  --atlas-elevation-3:0 18px 44px rgba(0,0,0,0.6);
}
:root[data-theme="light"]{
  --atlas-tinta-900:#191B22; --atlas-tinta-800:#2B2E38; --atlas-tinta-700:#3F4350;
  --atlas-tinta-600:#565B62; --atlas-tinta-500:#6E7278; --atlas-tinta-400:#8F8D80;
  --atlas-tinta-300:#B7B4A5; --atlas-tinta-200:#DCD8C8; --atlas-tinta-100:#E9E6D8;
  --atlas-tinta-50:#F2EFE5;
  --atlas-gold:#A97A34; --atlas-gold-hover:#8E652A; --atlas-gold-soft:#EEE0C4; --atlas-gold-deep:#7A5A26;
  --atlas-route:#233A5E; --atlas-route-hover:#1B2D49; --atlas-route-soft:#DEE4EE;
  --atlas-olive:#57623F; --atlas-olive-soft:#E5E7D6;
  --atlas-ocre:#9C5A2E; --atlas-ocre-soft:#F2E1CE;
  --atlas-danger:#8C3B33; --atlas-danger-soft:#F1DEDA;
  --atlas-bg:var(--atlas-tinta-50); --atlas-surface:#FDFCF7; --atlas-surface-2:#F8F6EF;
  --atlas-text:var(--atlas-tinta-900); --atlas-text-soft:var(--atlas-tinta-600); --atlas-text-faint:var(--atlas-tinta-400);
  --atlas-border:var(--atlas-tinta-200); --atlas-border-soft:var(--atlas-tinta-100);
  --atlas-elevation-1:0 1px 2px rgba(25,27,34,0.07);
  --atlas-elevation-2:0 4px 14px rgba(25,27,34,0.10);
  --atlas-elevation-3:0 18px 44px rgba(25,27,34,0.18);
}

@media (prefers-reduced-motion: reduce){
  :root{ --atlas-duration-micro:0ms; --atlas-duration-padrao:0ms; --atlas-duration-momento:0ms; --atlas-duration-cerimonia:0ms; }
}
