/*
 * Design System Redbeard — tokens.css (derivado de tokens.json)
 * NÃO EDITAR À MÃO EM PARALELO — mudança de valor sempre entra por tokens.json
 * primeiro; este arquivo é regenerado a partir dele. Ver 03-tokens/tokens.json
 * e references/tokens.md da skill design-system para a arquitetura completa.
 *
 * Rumo à v1.0.0 — território T2 Instrumento (aprovado 2026-09-01).
 * Referência viva: ideias/execucao/site-provisorio/t2-instrumento.html
 *
 * CÓPIA VENDORIZADA (repo redbeard-site, sincronizada em 2026-09-02) — a fonte da
 * verdade é Redbeard/design-system/03-tokens/tokens.css, em repo separado (o DS
 * não é submódulo daqui). Ao mudar um token no DS que afete este site, copiar de
 * novo manualmente; não editar aqui achando que propaga para trás.
 */

:root {
  /* ---- primitivos (uso interno; componentes nunca referenciam direto) ---- */
  --rb-vermelho-vivo: #E00A24;
  --rb-vermelho-interacao: #C1041B;
  --rb-vermelho-toque: #B80A20;
  --rb-vermelho-profundo: #AA0707;
  --rb-vermelho-claro-dark: #FF4054;
  --rb-vinho: #63001D;
  --rb-vinho-claro-dark: #F0C9D4;

  /* ---- semântico: tema claro (padrão — light-first) ---- */
  --cor-marca: var(--rb-vermelho-vivo);            /* identidade/acentos, nunca texto pequeno (4.32:1) */
  --cor-marca-interacao: var(--rb-vermelho-interacao); /* texto/link vermelho pequeno sobre claro (AA) */
  --cor-marca-toque: var(--rb-vermelho-toque);     /* hover de botão sólido */
  --cor-marca-profunda: var(--rb-vermelho-profundo);

  --cor-fundo: #F1EFEE;            /* papel */
  --cor-superficie: #FFFFFF;
  --cor-superficie-alt: #EAE7E5;
  --cor-borda: #E0DAD9;
  --cor-borda-forte: #C6BCBB;
  --cor-texto: #191315;            /* tinta */
  --cor-texto-secundario: #6C6064;
  --cor-texto-terciario: #9A8E91;  /* DECORATIVO apenas — reprova contraste para texto */

  --cor-status-sucesso: #1B7A4E;
  --cor-status-sucesso-fundo: #E3F2EA;
  --cor-status-alerta: #8A5800;
  --cor-status-alerta-fundo: #F7EDDC;
  --cor-status-info: #175E8D;
  --cor-status-info-fundo: #E2EFF7;
  --cor-status-progresso: #63001D;
  --cor-status-progresso-fundo: #F3E4E9;
  --cor-status-neutro: #6E6468;
  --cor-status-neutro-fundo: #EFEAEB;

  /* ---- instrumento: superfícies técnicas escuras, INVARIANTES ao tema ---- */
  --painel: #15100F;
  --painel-2: #221A19;
  --painel-borda: #3A2C2B;
  --painel-borda-sutil: rgba(255, 255, 255, .055);
  --painel-tinta: #F0E9E7;
  --painel-tinta-2: #9E8F8C;
  --painel-negativo: #6E5654;      /* DECORATIVO apenas (marcador '×') */
  --painel-led-apagado: #4B3A38;
  --painel-ok: #3AA877;
  --painel-ok-halo: rgba(58, 168, 119, .2);
  --painel-ok-halo-suave: rgba(58, 168, 119, .18);
  --painel-sinal: var(--rb-vermelho-claro-dark);   /* o vermelho da marca dentro do painel */
  --painel-gradiente: linear-gradient(168deg, var(--painel-2) 0%, var(--painel) 62%);
  --painel-brilho: radial-gradient(120% 80% at 82% 0%, rgba(255, 64, 84, .11), transparent 62%);
  --painel-sombra: 0 30px 70px -34px rgba(25, 10, 12, .7),
                   0 0 0 1px rgba(255, 255, 255, .05) inset,
                   0 1px 0 rgba(255, 255, 255, .09) inset;

  /* ---- tipografia ---- */
  --fonte-titulo: 'Sora', system-ui, sans-serif;
  --fonte-corpo: 'Figtree', system-ui, sans-serif;
  --fonte-dado: 'JetBrains Mono', ui-monospace, monospace;

  --peso-titulo: 700;
  --peso-titulo-medio: 600;
  --peso-corpo: 400;
  --peso-corpo-forte: 600;
  --peso-dado: 500;

  /* rótulo/eyebrow técnico — papel-assinatura do T2 (mono, caixa alta, traço vermelho) */
  --rotulo-fonte: var(--fonte-dado);
  --rotulo-peso: 500;
  --rotulo-tamanho: 11px;
  --rotulo-tracking: .18em;
  --rotulo-traco-largura: 22px;
  --rotulo-traco-altura: 2px;

  /* ---- forma ---- */
  --raio-painel: 14px;
  --raio-card: 12px;
  --raio-controle: 7px;
  --raio-pilula: 999px;

  /* ---- elevação ---- */
  --sombra-elevacao-1: 0 1px 2px rgba(60, 10, 20, .05), 0 8px 24px rgba(60, 10, 20, .07);

  /* ---- espaçamento (base 4px, escala em múltiplos) ---- */
  --espaco-1: 4px;
  --espaco-2: 8px;
  --espaco-3: 12px;
  --espaco-4: 16px;
  --espaco-5: 20px;
  --espaco-6: 24px;
  --espaco-8: 32px;
  --espaco-12: 48px;

  /* ---- legado v0.1 (alias até demandas-redbeard migrar; não usar em peça nova) ---- */
  --cor-ancora: var(--rb-vinho);
}

/* ---- semântico: tema escuro — a interface inteira vira instrumento ---- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --cor-marca: var(--rb-vermelho-claro-dark); /* vermelho vivo puro reprova contraste no escuro */
    --cor-marca-interacao: var(--rb-vermelho-vivo);
    --cor-fundo: var(--painel);
    --cor-superficie: var(--painel-2);
    --cor-superficie-alt: #2B2220;
    --cor-borda: var(--painel-borda);
    --cor-borda-forte: var(--painel-borda);
    --cor-texto: var(--painel-tinta);
    --cor-texto-secundario: var(--painel-tinta-2);
    --cor-texto-terciario: var(--painel-negativo);
    --cor-status-sucesso: #5CC996;
    --cor-status-sucesso-fundo: #153428;
    --cor-status-alerta: #E3A94F;
    --cor-status-alerta-fundo: #38290F;
    --cor-status-info: #6FB4DE;
    --cor-status-info-fundo: #122B3C;
    --cor-status-progresso: #F0A9BD;
    --cor-status-progresso-fundo: #3C1F2A;
    --cor-status-neutro: #A79BA0;
    --cor-status-neutro-fundo: #322A2D;
    --sombra-elevacao-1: 0 1px 2px rgba(0, 0, 0, .4), 0 8px 24px rgba(0, 0, 0, .35);
    --cor-ancora: var(--rb-vinho-claro-dark);
  }
}

/* ---- toggle manual (sobrescreve a preferência do sistema nos dois sentidos) ---- */
:root[data-theme="dark"] {
  --cor-marca: var(--rb-vermelho-claro-dark);
  --cor-marca-interacao: var(--rb-vermelho-vivo);
  --cor-fundo: var(--painel);
  --cor-superficie: var(--painel-2);
  --cor-superficie-alt: #2B2220;
  --cor-borda: var(--painel-borda);
  --cor-borda-forte: var(--painel-borda);
  --cor-texto: var(--painel-tinta);
  --cor-texto-secundario: var(--painel-tinta-2);
  --cor-texto-terciario: var(--painel-negativo);
  --cor-status-sucesso: #5CC996;
  --cor-status-sucesso-fundo: #153428;
  --cor-status-alerta: #E3A94F;
  --cor-status-alerta-fundo: #38290F;
  --cor-status-info: #6FB4DE;
  --cor-status-info-fundo: #122B3C;
  --cor-status-progresso: #F0A9BD;
  --cor-status-progresso-fundo: #3C1F2A;
  --cor-status-neutro: #A79BA0;
  --cor-status-neutro-fundo: #322A2D;
  --sombra-elevacao-1: 0 1px 2px rgba(0, 0, 0, .4), 0 8px 24px rgba(0, 0, 0, .35);
  --cor-ancora: var(--rb-vinho-claro-dark);
}

/*
 * Assinaturas visuais do T2 Instrumento (specs completas em 04-componentes/):
 * — Rótulo técnico: mono 11px/.18em caixa alta precedido do traço vermelho
 *   22×2px (--cor-marca no claro, --painel-sinal sobre painel/faixa).
 * — Painel de operação: fundo --painel-gradiente, raio --raio-painel,
 *   sombra --painel-sombra, overlay ::after com --painel-brilho.
 * — Dado tabular: --fonte-dado + font-variant-numeric: tabular-nums.
 * (A assinatura "vinco da barba" do v0.1 foi aposentada com o território T2.)
 */