/* GERADO por scripts/gerar_tokens_ds.py a partir de design/ds/tokens/. NÃO EDITE À MÃO. */

/* Paleta "bancada" — substrato, fósforo suave, cobre, osso.
   Fonte: renderer/theme.ts (const C) e renderer/graphVocab.ts (TYPE_INFO).
   Cor é SINAL, não decoração: phosphor marca apenas cognição acontecendo
   agora; copper marca apenas ação e evidência. Nenhuma cor preenche espaço. */
:root {
  /* base */
  --aur-bg: #0C1517;
  --aur-panel: #122023;
  --aur-panel-up: #18292D;
  --aur-line: #23393D;
  --aur-phosphor: #8FDDBE;
  --aur-copper: #C98B5F;
  --aur-bone: #E7E2D6;
  --aur-dim: #8FA3A0;
  --aur-danger: #D97B6C;
  /* texto sobre as duas cores de sinal (contraste, não decoração) */
  --aur-on-phosphor: #0C1517;
  --aur-on-copper: #1A120B;
  /* menisco: a frente do líquido no tubo — único branco do sistema */
  --aur-meniscus: #E7F7EF;

  /* aliases semânticos */
  --surface-page: var(--aur-bg);
  --surface-card: var(--aur-panel);
  --surface-raised: var(--aur-panel-up);
  --surface-glass: rgba(18, 32, 35, 0.66);
  --surface-glass-strong: rgba(12, 21, 23, 0.86);
  --border-hairline: var(--aur-line);
  --border-focus: rgba(143, 221, 190, 0.5);
  --text-body: var(--aur-bone);
  --text-meta: var(--aur-dim);
  --text-cognition: var(--aur-phosphor);
  --text-action: var(--aur-copper);
  --text-error: var(--aur-danger);

  /* estados derivados por transparência do sinal, nunca por cor nova */
  --tint-cognition-hover: rgba(143, 221, 190, 0.07);
  --tint-cognition-halo: rgba(143, 221, 190, 0.32);
  /* borda de superfície clicável acendendo — o app precisa repetir esta regra
     com !important (estilo inline vence CSS), e sem token seriam dois valores */
  --border-cognition-hover: rgba(143, 221, 190, 0.45);
  --ring-focus: 0 0 0 2px rgba(143, 221, 190, 0.55);
  --glow-phosphor: rgba(143, 221, 190, 0.10);
  --glow-copper: rgba(201, 139, 95, 0.07);

  /* tipos do grafo (renderer/graphVocab.ts) — cor identifica o tipo do nó */
  --node-goal: #8FDDBE;
  --node-habit: #6FBFA0;
  --node-project: #C98B5F;
  --node-skill: #B0764F;
  --node-value: #E7E2D6;
  --node-hypothesis: #9FB4D8;
  --node-identity: #D8C89F;
  --node-foundation: #8FA3A0;
  --node-decision: #7A8F98;
  --node-conflict: #D97B6C;
  --node-meta: #5F7376;
  --node-unknown: #5F7376;
}

/* Duas famílias, papéis fixos. Sora nunca carrega número; IBM Plex Mono
   nunca carrega prosa longa. Escala tirada dos tamanhos reais do renderer —
   valores em px, com meio-pixel onde o app usa meio-pixel. */
:root {
  --font-display: "Sora", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", ui-monospace, monospace;

  /* voz (Sora) */
  --type-brand: 700 26px/1.15 var(--font-display);
  --type-title: 700 19px/1.2 var(--font-display);
  --type-screen: 700 15px/1.25 var(--font-display);
  --type-section: 700 12.5px/1.3 var(--font-display);
  --type-card-title: 600 13.5px/1.3 var(--font-display);
  --type-nav: 600 12.5px/1 var(--font-display);
  --type-body: 400 14px/1.45 var(--font-display);
  --type-body-sm: 400 12.5px/1.45 var(--font-display);

  /* leitura à distância na Samsung TV: mesma voz e proporção do produto */
  --type-tv-hero: 600 52px/1.08 var(--font-display);
  --type-tv-section: 600 20px/1.3 var(--font-display);
  --type-tv-body: 400 18px/1.5 var(--font-display);
  --type-tv-meta: 400 14px/1.45 var(--font-mono);

  /* leitura (IBM Plex Mono) */
  --type-meta: 400 11px/1.45 var(--font-mono);
  --type-meta-sm: 400 10px/1.45 var(--font-mono);
  --type-stamp: 400 9.5px/1.4 var(--font-mono);
  --type-label: 500 10px/1.4 var(--font-mono);
  --type-control: 400 11px/1 var(--font-mono);

  /* tamanhos soltos, para quando o shorthand não serve */
  --size-9: 9px;
  --size-9-5: 9.5px;
  --size-10: 10px;
  --size-10-5: 10.5px;
  --size-11: 11px;
  --size-11-5: 11.5px;
  --size-12: 12px;
  --size-12-5: 12.5px;
  --size-13: 13px;
  --size-13-5: 13.5px;
  --size-14: 14px;
  --size-15: 15px;
  --size-16: 16px;
  --size-19: 19px;
  --size-20: 20px;
  --size-22: 22px;
  --size-24: 24px;
  --size-30: 30px;
  --size-32: 32px;
  --size-40: 40px;
  --size-48: 48px;
  --size-52: 52px;
  --size-26: 26px;

  --leading-tight: 1.3; /* @kind other */
  --leading-body: 1.45; /* @kind other */
  --leading-prose: 1.55; /* @kind other */
  --tracking-stamp: 0.05em; /* @kind other */
  --tracking-brand: 0.4px; /* @kind other */
}

/* Densidade: o app é denso e NADA é arredondado para grid de 8. Se a origem diz
   11px, o token é 11px — a guideline space-escala manda exatamente isso.

   O número do token É o valor em px, mesma convenção que --size-* usa para
   tipo. A numeração ordinal anterior (--space-4 valia 8px) era uma armadilha:
   quem precisava de 16px não achava o ordinal e escrevia 16 na mão, que é como
   o PWA acabou com uma escala própria.

   O comentário anterior dizia "os paddings reais são 6/10/11/12/13/14, não
   8/16/24" e estava errado em duas pontas, medido em 20/08 sobre as duas
   superfícies: 8px é o 4º valor mais usado do desktop (37 ocorrências) e já
   estava na escala; 16px e 24px são usados pelo PWA, e o DS é fonte das duas
   superfícies, não só do desktop. Pior: a escala não tinha 11 nem 13, os dois
   que a própria guideline manda respeitar — 81 ocorrências de valor ímpar sem
   token nenhum, com a régua de aderência proibindo px cru ao mesmo tempo.

   O conjunto abaixo é exatamente o que o produto usa hoje. Não é grade: é
   inventário. Valor novo entra aqui antes de entrar numa tela. */
:root {
  --space-2: 2px;
  --space-3: 3px;
  --space-4: 4px;
  --space-5: 5px;
  --space-6: 6px;
  --space-7: 7px;
  --space-8: 8px;
  --space-9: 9px;
  --space-10: 10px;
  --space-11: 11px;
  --space-12: 12px;
  --space-13: 13px;
  --space-14: 14px;
  --space-16: 16px;
  --space-18: 18px;
  --space-20: 20px;
  --space-24: 24px;
  --space-26: 26px;
  --space-32: 32px;
  --space-40: 40px;
  --space-48: 48px;
  --space-56: 56px;
  --space-160: 160px;
  --space-200: 200px;

  /* composição dedicada à distância de visualização da TV */
  --layout-tv-max: 1720px;
  --layout-tv-header: 80px;
  --layout-tv-chat-min: 680px;

  --pad-chip: 1px 6px;
  --pad-badge: 2px 7px;
  --pad-control: 6px 11px;
  --pad-button: 10px 14px;
  --pad-input: 10px 12px;
  --pad-card: 11px 12px;
  --pad-sheet: 12px 14px;
  --pad-bubble: 9px 12px;

  --gap-row: 8px;
  --gap-inline: 6px;
  --gap-actions: 6px;

  /* ALVO DE TOQUE. `--hit-min` é para controle denso de card no DESKTOP, onde
     o mouse tem precisão de pixel. `--hit-comfortable` é o mínimo da Apple HIG
     (o Material pede 48dp): a largura média útil da ponta do polegar.

     Em superfície TOCÁVEL, `--hit-comfortable` não é conforto — é o piso.
     Medido no PWA em 25/08: todo alvo interativo estava entre 32 e 43px, e o
     erro de toque abaixo de 44 cresce rápido em movimento, que é o contexto
     real de um app de celular. `aurora-mobile/ergonomia.test.mjs` cobra. */
  --hit-min: 30px;        /* controles densos de card — desktop, mouse */
  --hit-comfortable: 44px;/* piso de qualquer alvo tocável; linhas, perfis, abas */

  --col-read: 100%;       /* coluna legível fora do grafo (renderer/Col.tsx) — cresce por degrau abaixo */
  --panel-chain: 286px;   /* cadeia de ativação */
  --panel-legend: 226px;  /* legenda-filtro */
  --panel-inspect: 300px; /* inspetor de nó */
  --rail-chat: 420px;     /* conversa ao lado do mapa na Mente — cresce por degrau abaixo */
  --bp-cockpit: 1024px;   /* abaixo disso, painel vira sheet inferior — era 900, escolhido a olho (ADR-0066) */
  --input-max-h: 220px;   /* teto do composer: ~10 linhas */
}

/* ─────────────────────────────────────────────────────────────────────────────
   A COLUNA DE LEITURA RESPIRA COM A TELA (ADR-0066)

   `--col-read` era 760px fixo. Num monitor de 1920 — que junto com 1366 é
   metade do mercado — sobravam ~1160px de vazio dos lados, e a aba Conversa
   parecia um app quebrado dentro de uma janela grande.

   Cresce por degrau, e NÃO sem limite: linha longa demais cansa a leitura. Os
   pontos são os medidos em 2026 — 768 (tablet, 768×1024 lidera), 1024 (laptop),
   1366 e 1920 (metade do desktop). Abaixo de 768 é 100%: no telefone a margem
   quem dá é o padding da tela, não um teto.
   ───────────────────────────────────────────────────────────────────────────── */
@media (min-width: 768px)  { :root { --col-read: 720px; } }
@media (min-width: 1024px) { :root { --col-read: 780px; } }
@media (min-width: 1366px) { :root { --col-read: 880px; } }
@media (min-width: 1920px) { :root { --col-read: 980px; } }

/* ─────────────────────────────────────────────────────────────────────────────
   A CONVERSA AO LADO DO MAPA RESPIRA IGUAL (ADR-0249)

   `--rail-chat` existia desde sempre e o JSX escrevia `width: 420` na mão —
   token no DS e número na tela, que é a divergência que este arquivo existe
   para impedir (o verificador não pegava: não é cor nem fonte).

   Com a fusão da aba Conversa na Mente, essa coluna deixou de ser um extra do
   cockpit e virou O lugar onde se fala com ela. 420 fixo fazia num monitor de
   1920 a mesma coluna de um laptop de 1024, com o mapa comendo o resto —
   exatamente o defeito que o `--col-read` já tinha corrigido ao lado.

   Não cresce sem limite, pelo mesmo motivo do `--col-read`: linha longa demais
   cansa. Abaixo de 1024 o valor não é lido — ali a Mente mostra um de cada vez.
   ───────────────────────────────────────────────────────────────────────────── */
@media (min-width: 1366px) { :root { --rail-chat: 480px; } }
@media (min-width: 1920px) { :root { --rail-chat: 560px; } }

/* ─────────────────────────────────────────────────────────────────────────────
   A ALTURA DA CASCA ACOMPANHA O TECLADO VIRTUAL (ADR-0067)

   `100vh` no celular é a altura COM a barra de endereço e SEM descontar o
   teclado: a unidade mente exatamente quando mais importa — o composer some
   atrás do teclado e a pessoa digita às cegas.

   As duas linhas são DEGRAUS: quem não conhece `dvh` ignora a segunda e fica
   com `vh`, que é o comportamento de hoje. Nunca pior, às vezes certo.
   ───────────────────────────────────────────────────────────────────────────── */
:root {
  --aur-altura-casca: 100vh;
}
@supports (height: 100dvh) {
  :root { --aur-altura-casca: 100dvh; }
}

/* Raios pequenos e específicos. Bolha de conversa tem um canto de 3px que
   aponta para o autor — é a única assimetria do sistema. */
:root {
  --radius-tail: 3px;
  --radius-chip: 4px;
  --radius-badge: 5px;
  --radius-input-sm: 6px;
  --radius-inline: 7px;
  --radius-control: 8px;
  --radius-input: 10px;
  --radius-card: 12px;
  --radius-sheet: 14px;
  --radius-pill: 999px;

  --bubble-user: 12px 12px 3px 12px; /* @kind other */
  --bubble-aurora: 3px 12px 12px 12px; /* @kind other */

  --border-width-hair: 1px;
  --border-width-signal: 2px;  /* borda-esquerda de autoria/estado */
  --border-width-emerged: 3px; /* nó a que a Aurora chegou sozinha */
  --dash-emerged: 4px 3px; /* @kind other */
}

/* Três vozes, e nenhuma se substitui pela outra (renderer/estilos.ts).
   mecânica     — cromo (hover, foco, aba, painel). Até 120ms, sem overshoot.
   orgânica     — cognição (acender, revelar, pensar). 200-340ms, overshoot leve.
   circulatória — estado, não transição. linear e perpétua: enquanto o contexto
                  de recuperação estiver aberto, a corrente circula. */
:root {
  --dur-instant: 0ms; /* @kind other */
  --dur-quick: 120ms; /* @kind other */
  --dur-base: 200ms; /* @kind other */
  --dur-slow: 340ms; /* @kind other */
  --dur-pulse: 1400ms; /* @kind other */
  --dur-breath: 2600ms; /* @kind other */
  --dur-drift: 20000ms; /* @kind other */
  --dur-flow: 1500ms; /* @kind other */

  --ease-mechanical: cubic-bezier(0.2, 0, 0, 1); /* @kind other */
  --ease-organic: cubic-bezier(0.34, 1.2, 0.64, 1); /* @kind other */
  --ease-exit: cubic-bezier(0.4, 0, 1, 1); /* @kind other */
  --ease-circulatory: linear; /* @kind other */

  /* envelope da cognição (renderer/circuit.ts) — nunca degrau */
  --envelope-attack: 190ms; /* @kind other */
  --envelope-overshoot: 0.18; /* @kind other */
  --envelope-sustain: 0.62; /* @kind other */
  --envelope-breath: 0.07; /* @kind other */
  --envelope-decay: 1500ms; /* @kind other */
  --circuit-step: 210ms; /* @kind other */

  /* a câmera da Mente (ADR-0281): a atenção dela indo até onde a ação acontece.
     É deslocamento, não cognição acendendo — por isso sem overshoot (a tela não
     quica), e mais longa que a orgânica: atravessa o mapa, não um nó. */
  --dur-camera: 720ms; /* @kind other */
  --ease-camera: cubic-bezier(0.65, 0, 0.35, 1); /* @kind other */
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-quick: 0ms; /* @kind other */ --dur-base: 0ms; /* @kind other */ --dur-slow: 0ms; /* @kind other */ }
}

/* Vidro SÓ em superfície flutuante (overlay, sheet, barra, composer).
   Conteúdo — bolha, card, lista — é sólido: legibilidade primeiro.
   Sem cofre de blur no SO, o vidro degrada para sólido em vez de sumir. */
:root {
  --blur-glass: blur(18px) saturate(1.25); /* @kind other */
  --glass-surface: rgba(18, 32, 35, 0.66);
  --glass-strong: rgba(12, 21, 23, 0.86);
  /* brilho de fundo: phosphor para copper, opacidade máxima 8%, derivando em 20s */
  --aurora-glow: radial-gradient(60% 55% at 32% 30%, rgba(143, 221, 190, 0.10), transparent 70%),
                 radial-gradient(55% 50% at 70% 72%, rgba(201, 139, 95, 0.07), transparent 70%); /* @kind other */
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  :root { --glass-surface: #122023; --glass-strong: #0C1517; }
}
@media (prefers-reduced-transparency: reduce) {
  :root { --glass-surface: #122023; --glass-strong: #0C1517; }
}