/* tokens do tema do app: shared/ui/theme/tokens.css (cópia literal) */
/*
 * TOKENS DE TEMA — o ÚNICO arquivo CSS com seletor de tema (ordem do dono, 10/10/2026:
 * «O CSS precisa ser único e determinístico»). `npm run gate:tema-unico` reprova
 * `[data-theme` ou `prefers-color-scheme` em qualquer outro .css do repositório
 * (exceção declarada: `modules/config/`, módulo portável — ver o cabeçalho do gate).
 *
 * Semântica, igual à de antes da mudança:
 *   <html data-theme="light">  força claro
 *   <html data-theme="dark">   força escuro
 *   <html> sem `data-theme`    segue `prefers-color-scheme` (modo sistema)
 *
 * Aqui só se declaram custom properties em `:root`. Quem pinta é o arquivo do
 * componente, sempre por `var(--x)`; nenhum componente decide tema. Token de módulo
 * leva o prefixo do módulo (`--gpu-*`, `--mail-*`, `--panel-*`, `--consumo-*`).
 * `--ds-*` é o Design System universal (preset «superadmin», 23/10/2026, canônico em
 * docs/DESIGN-SYSTEM-CANONICO.md); `--panel-*` é alias dele — uma origem só.
 * Os valores vieram LITERAIS dos blocos de tema que existiam em cada arquivo — trocar
 * um deles exige medir o contraste de novo (validadores citados em cada seção).
 *
 * Importado no topo de `app/globals.css`.
 */

/* ── Escuro: padrão sem preferência clara, e o forçado por data-theme="dark" ── */
:root,
:root[data-theme="dark"] {
  color-scheme: dark;

  /* Véu atrás do carregamento do hard reload. */
  --session-loading-veu: rgba(2, 6, 12, .82);
  /* Wordmark: `cons` é #ffffff no escuro (skill `logo`). */
  --logo-cons: #ffffff;


  /* /gpus — modules/gpus/ui/GpuDashboard.module.css. */
  --gpu-background: #0b111b;
  --gpu-surface: #0f1724;
  --gpu-elevated: #162235;
  --gpu-foreground: #f8fafc;
  --gpu-muted: #b6c3d1;
  --gpu-subtle: #91a3b8;
  --gpu-accent: #22d3ee;
  --gpu-accent-foreground: #051016;
  --gpu-border: #64748b;
  --gpu-border-soft: #334155;
  --gpu-focus: #facc15;
  --gpu-success: #6ee7b7;
  --gpu-warning: #fbbf24;
  --gpu-danger: #fca5a5;
  --gpu-series-memory: #a78bfa;
  --gpu-series-power: #fbbf24;
  /* Placa TEXT: acento laranja no lugar do ciano. */
  --gpu-text-accent: #fb923c;
  --gpu-text-accent-foreground: #1a0b02;

  /* E-mail — modules/mailbox/ui/Email.module.css (aparência do iCloud no escuro). */
  /* literal = --access-panel escuro de modules/config/design_system/tokens.css: test:email-contraste só resolve var() no próprio bloco */
  --mail-background: #0b0f17;
  --mail-surface: #1d222c;
  --mail-surface-elevated: #282f3b;
  --mail-foreground: #f3f5f9;
  --mail-foreground-muted: #b7c1d0;
  --mail-foreground-subtle: #aab6c8;
  --mail-primary: #7ac7f5;
  --mail-primary-foreground: #101c28;
  --mail-secondary: #303b4c;
  --mail-secondary-foreground: #f3f5f9;
  --mail-border: #748296;
  --mail-divider: #3c4656;
  --mail-focus: #91d3fa;
  --mail-success: #9be4b4;
  --mail-warning: #f4d295;
  --mail-error: #ffb6be;
  --mail-info: #a4cfff;
  --mail-selected: #34475d;
  /* Correio: leitura, contas e janelas compartilham o tema da sessão. */
  --mail-sidebar:#202022;--mail-list:#1c1c1e;--mail-paper:#1c1c1e;
  --mail-line:#3d3d42;--mail-search:#333337;--mail-topbar:#242426;
  --mail-ink:#f5f5f7;--mail-muted:#b1b1ba;--mail-blue:#70b5ff;
  --mail-selection:#075fce;--mail-selected-ink:#fff;--mail-control-border:#80808a;
  --mail-action-bg:#233349;--mail-danger:#ffb1ad;--mail-danger-bg:#392728;
  --mail-positive:#a0ddbb;--mail-positive-bg:#203b30;
  --mail-caution:#f4d295;--mail-caution-bg:#3b3221;


  /* ── Design System universal `--ds-*`, preset «superadmin» (ordem do dono, 23/10/2026;
     canônico em docs/DESIGN-SYSTEM-CANONICO.md, achado 1 «dois design systems»).
     `--ds-*` é a ÚNICA origem; `--panel-*` abaixo é ALIAS (var(--ds-*)). Valores idênticos
     aos que `--panel-*` tinha — paleta teal/areia medida, nenhuma cor trocada. Nomes seguem
     financeiro/modules/design_system/design/gerar_tokens.py (`_`→`-`: brand-soft, on-brand,
     tab-area, tab-border). tab-area/tab-border já coincidem com o universal nos dois temas. ── */
  --ds-paper: var(--access-panel);
  --ds-hero: #07172e;          /* regra nova 2 (dono, 23/10/2026): hero sempre da mesma cor, nos dois temas */
  --ds-on-hero: #f8f9fe;
  --ds-surface: #0b0f17;
  --ds-brand-soft: #0d2630;
  --ds-surface-elevated: #141c29;
  --ds-ink: #edf2fa;
  --ds-muted: #a3b1c6;
  --ds-subtle: #8f9eb4;
  --ds-brand: #67dced;
  --ds-on-brand: #05070d;
  --ds-secondary: #a3b1c6;
  --ds-on-secondary: #05070d;
  --ds-line: #65758b;
  --ds-focus-ring: #67dced;
  --ds-positive: #8de5c3;
  --ds-on-positive: #05070d;
  --ds-warning: #ffbb83;
  --ds-on-warning: #05070d;
  --ds-danger: #ff9e9e;
  --ds-on-danger: #05070d;
  --ds-info: #67dced;
  --ds-on-info: #05070d;
  --ds-tab-background: #0b1721;
  --ds-tab-area: #0b1019;
  --ds-tab-border: #24414c;
  /* Medidas, sem tema (declaradas uma vez: `:root` casa em todo tema). */
  /* divergência registrada: universal 16px (tokens.json forma.raio.cartao); decisão do dono pendente. */
  --ds-radius-cartao: 12px;
  --ds-radius-botao: 12px; /* aba, Voltar, LabelButton (REQUISITOS); igual ao universal */
  --ds-radius-area: 14px; /* área de conteúdo das abas (REQUISITOS) */
  --ds-target-min: 40px; /* altura mínima de controle (REQUISITOS, contrato.ts) */
  /* Escala de espaço (canônico, item 5: «precisam virar space-1…8»). Premissa desta frente:
     grade de 4 px inferida dos valores literais do REQUISITOS (8/12/16/20/24); sem consumidor
     ainda; o dono pode trocar sem efeito em tela. */
  --ds-space-1: 4px;
  --ds-space-2: 8px;
  --ds-space-3: 12px;
  --ds-space-4: 16px;
  --ds-space-5: 20px;
  --ds-space-6: 24px;
  --ds-space-7: 32px;
  --ds-space-8: 40px;
  /* Modal canônico (ordem do dono, 23/10/2026: abre no centro, move e redimensiona; componente
     único do DS = modules/design_system/ui/SystemDialog). Sem tema: medidas e véus pretos translúcidos. */
  --ds-modal-radius: 16px;
  --ds-modal-shadow: 0 8px 24px rgba(13,15,34,.06);
  --ds-modal-backdrop: rgba(13, 15, 34, 0.56);
  --ds-modal-z: 400;
  --ds-modal-sm: 480px;
  --ds-modal-md: 720px;
  --ds-modal-lg: 960px;
  --ds-modal-xl: min(1200px, calc(100vw - 48px));
  --ds-modal-min-w: 360px;
  --ds-modal-min-h: 240px;
  --ds-modal-margin: 16px;
  --ds-modal-margin-xl: 48px;
  --ds-modal-mobile: 600px;
  --ds-modal-step: 16px;
  --ds-modal-step-shift: 64px;
  --ds-modal-handle: 8px;

  /* Painéis de catálogo — mesma paleta em Ecossistema, Aplicativos do sistema,
     Módulos reutilizáveis e Clone da estação. Cada `.root` mapeia `--surface` etc.
     para estes. Desde 23/10/2026 são ALIASES de `--ds-*` (acima); valor computado
     inalterado. `--panel-universal-surface` = caixa de destaque dos módulos universais
     (14/10/2026); `--panel-tab-*` = área de conteúdo das abas (17/10/2026). */
  --panel-background: var(--ds-paper);
  --panel-surface: var(--ds-surface);
  --panel-universal-surface: var(--ds-brand-soft);
  --panel-surface-elevated: var(--ds-surface-elevated);
  --panel-foreground: var(--ds-ink);
  --panel-foreground-muted: var(--ds-muted);
  --panel-foreground-subtle: var(--ds-subtle);
  --panel-primary: var(--ds-brand);
  --panel-primary-foreground: var(--ds-on-brand);
  --panel-secondary: var(--ds-secondary);
  --panel-secondary-foreground: var(--ds-on-secondary);
  --panel-border: var(--ds-line);
  --panel-focus: var(--ds-focus-ring);
  --panel-success: var(--ds-positive);
  --panel-success-foreground: var(--ds-on-positive);
  --panel-warning: var(--ds-warning);
  --panel-warning-foreground: var(--ds-on-warning);
  --panel-error: var(--ds-danger);
  --panel-error-foreground: var(--ds-on-danger);
  --panel-info: var(--ds-info);
  --panel-info-foreground: var(--ds-on-info);
  --panel-tab-background: var(--ds-tab-background);
  --panel-tab-area-background: var(--ds-tab-area);
  --panel-tab-area-border: var(--ds-tab-border);

  /* /consumo — faixas de governança (RegrasDeConsumo) e atividade do CLI (Consumo). */
  --consumo-faixa-verde: #4ade80;
  --consumo-faixa-amarelo: #facc15;
  --consumo-faixa-vermelho: #f87171;
  --consumo-activity-active: #4ade80;
  --consumo-activity-inactive: #f87171;
  --consumo-activity-unknown: #94a3b8;

  /* /token › Regras de consumo (K6–K10, 31/10/2026): séries do gráfico, badge Code/Codex e estados da máquina. */
  --serie-code: #f0a36b;
  --serie-codex: #4fd1a1;
  --ia-code-fundo: #24180f;
  --ia-code-borda: #5c3b22;
  --ia-code-badge: #3b2616;
  --ia-code-texto: #fdd2b0;
  --ia-codex-fundo: #1b1d21;
  --ia-codex-borda: #41464e;
  --ia-codex-badge: #2b2f35;
  --ia-codex-texto: #d6d9de;
  --consumo-estado-ok: #34d399;
  --consumo-estado-warn: #fdba74;
  --consumo-estado-action: #c2410c;
  --consumo-estado-bad: #fca5a5;
  --consumo-estado-muted: #94a3b8;
}

/* ── Claro. O MESMO conteúdo vale para os dois gatilhos abaixo: `data-theme="light"`
   e o sistema claro sem `data-theme="dark"`. Mudou um, muda o outro. ── */
:root[data-theme="light"] {
  color-scheme: light;

  --session-loading-veu: rgba(244, 241, 234, .88);
  --logo-cons: #111111;


  --gpu-background: #f4f1ea;
  --gpu-surface: #fbf9f4;
  --gpu-elevated: #ffffff;
  --gpu-foreground: #14171a;
  --gpu-muted: #4a4d52;
  --gpu-subtle: #5c5f64;
  --gpu-accent: #0e7490;
  --gpu-accent-foreground: #ffffff;
  --gpu-border: #857f73;
  --gpu-border-soft: #d6d1c6;
  --gpu-focus: #1d4ed8;
  --gpu-success: #047857;
  --gpu-warning: #b45309;
  --gpu-danger: #b91c1c;
  --gpu-series-memory: #6d28d9;
  --gpu-series-power: #b45309;
  --gpu-text-accent: #c2410c;
  --gpu-text-accent-foreground: #ffffff;

  --mail-background: #f4f1ea;
  --mail-surface: #fbf9f4;
  --mail-surface-elevated: #ffffff;
  --mail-foreground: #14171a;
  --mail-foreground-muted: #4a4d52;
  --mail-foreground-subtle: #5c5f64;
  --mail-primary: #0e718c;
  --mail-primary-foreground: #ffffff;
  --mail-secondary: #ede9e0;
  --mail-secondary-foreground: #14171a;
  --mail-border: #8f897d;
  --mail-divider: #d6d1c6;
  --mail-focus: #0e718c;
  --mail-success: #047857;
  --mail-warning: #b83e0b;
  --mail-error: #b91c1c;
  --mail-info: #0e718c;
  --mail-selected: #ede9e0;
  /* Correio: leitura, contas e janelas compartilham o tema da sessão. */
  --mail-sidebar:#f5f5f7;--mail-list:#fff;--mail-paper:#fff;
  --mail-line:#dedee3;--mail-search:#e8e8ed;--mail-topbar:#f7f7f8;
  --mail-ink:#202024;--mail-muted:#62626b;--mail-blue:#005bc8;
  --mail-selection:#0063d9;--mail-selected-ink:#fff;--mail-control-border:#85858d;
  --mail-action-bg:#f0f5fc;--mail-danger:#a92b27;--mail-danger-bg:#fff4f3;
  --mail-positive:#246345;--mail-positive-bg:#eef8f2;
  --mail-caution:#674a12;--mail-caution-bg:#fff8e7;


  /* ── Design System universal `--ds-*`, preset «superadmin» (ordem do dono, 23/10/2026;
     canônico em docs/DESIGN-SYSTEM-CANONICO.md, achado 1 «dois design systems»).
     `--ds-*` é a ÚNICA origem; `--panel-*` abaixo é ALIAS (var(--ds-*)). Valores idênticos
     aos que `--panel-*` tinha — paleta teal/areia medida, nenhuma cor trocada. Nomes seguem
     financeiro/modules/design_system/design/gerar_tokens.py (`_`→`-`: brand-soft, on-brand,
     tab-area, tab-border). tab-area/tab-border já coincidem com o universal nos dois temas. ── */
  --ds-paper: #f4f1ea;
  --ds-hero: #07172e;          /* regra nova 2 (dono, 23/10/2026): hero sempre da mesma cor, nos dois temas */
  --ds-on-hero: #f8f9fe;
  --ds-surface: #fbf9f4;
  --ds-brand-soft: #ecf6f8;
  --ds-surface-elevated: #ffffff;
  --ds-ink: #14171a;
  --ds-muted: #4a4d52;
  --ds-subtle: #5c5f64;
  --ds-brand: #0e7490;
  --ds-on-brand: #ffffff;
  --ds-secondary: #334155;
  --ds-on-secondary: #ffffff;
  --ds-line: #8f897d;
  --ds-focus-ring: #0e7490;
  --ds-positive: #047857;
  --ds-on-positive: #ffffff;
  --ds-warning: #c2410c;
  --ds-on-warning: #ffffff;
  --ds-danger: #b91c1c;
  --ds-on-danger: #ffffff;
  --ds-info: #0e7490;
  --ds-on-info: #ffffff;
  --ds-tab-background: #e8eeec;
  --ds-tab-area: #fdfcf9;
  --ds-tab-border: #cfe1e7;

  /* Painéis de catálogo: aliases de `--ds-*` (23/10/2026). */
  --panel-background: var(--ds-paper);
  --panel-surface: var(--ds-surface);
  --panel-universal-surface: var(--ds-brand-soft);
  --panel-surface-elevated: var(--ds-surface-elevated);
  --panel-foreground: var(--ds-ink);
  --panel-foreground-muted: var(--ds-muted);
  --panel-foreground-subtle: var(--ds-subtle);
  --panel-primary: var(--ds-brand);
  --panel-primary-foreground: var(--ds-on-brand);
  --panel-secondary: var(--ds-secondary);
  --panel-secondary-foreground: var(--ds-on-secondary);
  --panel-border: var(--ds-line);
  --panel-focus: var(--ds-focus-ring);
  --panel-success: var(--ds-positive);
  --panel-success-foreground: var(--ds-on-positive);
  --panel-warning: var(--ds-warning);
  --panel-warning-foreground: var(--ds-on-warning);
  --panel-error: var(--ds-danger);
  --panel-error-foreground: var(--ds-on-danger);
  --panel-info: var(--ds-info);
  --panel-info-foreground: var(--ds-on-info);
  --panel-tab-background: var(--ds-tab-background);
  --panel-tab-area-background: var(--ds-tab-area);
  --panel-tab-area-border: var(--ds-tab-border);

  --consumo-faixa-verde: #047857;
  --consumo-faixa-amarelo: #8a5a00;
  --consumo-faixa-vermelho: #b91c1c;
  --consumo-activity-active: #047857;
  --consumo-activity-inactive: #b91c1c;
  --consumo-activity-unknown: #475569;

  /* /token › Regras de consumo (K6–K10, 31/10/2026). */
  --serie-code: #c2410c;
  --serie-codex: #047857;
  --ia-code-fundo: #fbefe6;
  --ia-code-borda: #e9c4a6;
  --ia-code-badge: #f6dcc8;
  --ia-code-texto: #7c2d12;
  --ia-codex-fundo: #f2f3f5;
  --ia-codex-borda: #d0d4da;
  --ia-codex-badge: #e4e7eb;
  --ia-codex-texto: #374151;
  --consumo-estado-ok: #047857;
  --consumo-estado-warn: #c2410c;
  --consumo-estado-action: #9a3412;
  --consumo-estado-bad: #b91c1c;
  --consumo-estado-muted: #4a4d52;
}

/* ── Sistema claro, sem tema forçado. Cópia exata do bloco claro acima. ── */
@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    color-scheme: light;

    --session-loading-veu: rgba(244, 241, 234, .88);
    --logo-cons: #111111;


    --gpu-background: #f4f1ea;
    --gpu-surface: #fbf9f4;
    --gpu-elevated: #ffffff;
    --gpu-foreground: #14171a;
    --gpu-muted: #4a4d52;
    --gpu-subtle: #5c5f64;
    --gpu-accent: #0e7490;
    --gpu-accent-foreground: #ffffff;
    --gpu-border: #857f73;
    --gpu-border-soft: #d6d1c6;
    --gpu-focus: #1d4ed8;
    --gpu-success: #047857;
    --gpu-warning: #b45309;
    --gpu-danger: #b91c1c;
    --gpu-series-memory: #6d28d9;
    --gpu-series-power: #b45309;
    --gpu-text-accent: #c2410c;
    --gpu-text-accent-foreground: #ffffff;

    --mail-background: #f4f1ea;
    --mail-surface: #fbf9f4;
    --mail-surface-elevated: #ffffff;
    --mail-foreground: #14171a;
    --mail-foreground-muted: #4a4d52;
    --mail-foreground-subtle: #5c5f64;
    --mail-primary: #0e718c;
    --mail-primary-foreground: #ffffff;
    --mail-secondary: #ede9e0;
    --mail-secondary-foreground: #14171a;
    --mail-border: #8f897d;
    --mail-divider: #d6d1c6;
    --mail-focus: #0e718c;
    --mail-success: #047857;
    --mail-warning: #b83e0b;
    --mail-error: #b91c1c;
    --mail-info: #0e718c;
    --mail-selected: #ede9e0;
  /* Correio: leitura, contas e janelas compartilham o tema da sessão. */
  --mail-sidebar:#f5f5f7;--mail-list:#fff;--mail-paper:#fff;
  --mail-line:#dedee3;--mail-search:#e8e8ed;--mail-topbar:#f7f7f8;
  --mail-ink:#202024;--mail-muted:#62626b;--mail-blue:#005bc8;
  --mail-selection:#0063d9;--mail-selected-ink:#fff;--mail-control-border:#85858d;
  --mail-action-bg:#f0f5fc;--mail-danger:#a92b27;--mail-danger-bg:#fff4f3;
  --mail-positive:#246345;--mail-positive-bg:#eef8f2;
  --mail-caution:#674a12;--mail-caution-bg:#fff8e7;


    /* ── Design System universal `--ds-*`, preset «superadmin» (ordem do dono, 23/10/2026;
       canônico em docs/DESIGN-SYSTEM-CANONICO.md, achado 1 «dois design systems»).
       `--ds-*` é a ÚNICA origem; `--panel-*` abaixo é ALIAS (var(--ds-*)). Valores idênticos
       aos que `--panel-*` tinha — paleta teal/areia medida, nenhuma cor trocada. Nomes seguem
       financeiro/modules/design_system/design/gerar_tokens.py (`_`→`-`: brand-soft, on-brand,
       tab-area, tab-border). tab-area/tab-border já coincidem com o universal nos dois temas. ── */
    --ds-paper: #f4f1ea;
    --ds-hero: #07172e;          /* regra nova 2 (dono, 23/10/2026): hero sempre da mesma cor, nos dois temas */
    --ds-on-hero: #f8f9fe;
    --ds-surface: #fbf9f4;
    --ds-brand-soft: #ecf6f8;
    --ds-surface-elevated: #ffffff;
    --ds-ink: #14171a;
    --ds-muted: #4a4d52;
    --ds-subtle: #5c5f64;
    --ds-brand: #0e7490;
    --ds-on-brand: #ffffff;
    --ds-secondary: #334155;
    --ds-on-secondary: #ffffff;
    --ds-line: #8f897d;
    --ds-focus-ring: #0e7490;
    --ds-positive: #047857;
    --ds-on-positive: #ffffff;
    --ds-warning: #c2410c;
    --ds-on-warning: #ffffff;
    --ds-danger: #b91c1c;
    --ds-on-danger: #ffffff;
    --ds-info: #0e7490;
    --ds-on-info: #ffffff;
    --ds-tab-background: #e8eeec;
    --ds-tab-area: #fdfcf9;
    --ds-tab-border: #cfe1e7;

    /* Painéis de catálogo: aliases de `--ds-*` (23/10/2026). */
    --panel-background: var(--ds-paper);
    --panel-surface: var(--ds-surface);
    --panel-universal-surface: var(--ds-brand-soft);
    --panel-surface-elevated: var(--ds-surface-elevated);
    --panel-foreground: var(--ds-ink);
    --panel-foreground-muted: var(--ds-muted);
    --panel-foreground-subtle: var(--ds-subtle);
    --panel-primary: var(--ds-brand);
    --panel-primary-foreground: var(--ds-on-brand);
    --panel-secondary: var(--ds-secondary);
    --panel-secondary-foreground: var(--ds-on-secondary);
    --panel-border: var(--ds-line);
    --panel-focus: var(--ds-focus-ring);
    --panel-success: var(--ds-positive);
    --panel-success-foreground: var(--ds-on-positive);
    --panel-warning: var(--ds-warning);
    --panel-warning-foreground: var(--ds-on-warning);
    --panel-error: var(--ds-danger);
    --panel-error-foreground: var(--ds-on-danger);
    --panel-info: var(--ds-info);
    --panel-info-foreground: var(--ds-on-info);
    --panel-tab-background: var(--ds-tab-background);
    --panel-tab-area-background: var(--ds-tab-area);
    --panel-tab-area-border: var(--ds-tab-border);

    --consumo-faixa-verde: #047857;
    --consumo-faixa-amarelo: #8a5a00;
    --consumo-faixa-vermelho: #b91c1c;
    --consumo-activity-active: #047857;
    --consumo-activity-inactive: #b91c1c;
    --consumo-activity-unknown: #475569;

    /* /token › Regras de consumo (K6–K10, 31/10/2026). */
    --serie-code: #c2410c;
    --serie-codex: #047857;
    --ia-code-fundo: #fbefe6;
    --ia-code-borda: #e9c4a6;
    --ia-code-badge: #f6dcc8;
    --ia-code-texto: #7c2d12;
    --ia-codex-fundo: #f2f3f5;
    --ia-codex-borda: #d0d4da;
    --ia-codex-badge: #e4e7eb;
    --ia-codex-texto: #374151;
    --consumo-estado-ok: #047857;
    --consumo-estado-warn: #c2410c;
    --consumo-estado-action: #9a3412;
    --consumo-estado-bad: #b91c1c;
    --consumo-estado-muted: #4a4d52;
  }
}

/* ══════ CORES DO GESTOR DE SESSÃO · INÍCIO ══════ */
/* Ativo da skill `session-toggle`. NÃO EDITE AQUI.
   reimplantar: node ~/.claude/skills/session-toggle/scripts/harness.mjs --implanta . */
/* Cores do gestor de sessão canônico 3.3.0 — as MESMAS medidas nos dois temas.
   Implantado no arquivo de tokens de tema do app (o único com seletor de tema).
   Sem `data-theme`, vale o modo do sistema; com ele, o modo escolhido.
   Contraste medido: texto ≥ 4,5:1, contorno ≥ 3:1. */
:root{
  --session-accent:#22d3ee;--session-fg:#e2e8f0;--session-muted:#9ca3af;
  --session-surface:#0c1018;--session-border:#526278;--session-countdown:#67e8f9;
  --session-danger:#7f1d1d;--session-danger-fg:#ffffff;--session-hover:#111827;
}
:root[data-theme="light"]{
  --session-accent:#0e7490;--session-fg:#0f172a;--session-muted:#475569;
  --session-surface:#ffffff;--session-border:#7c8ba3;--session-countdown:#0e7490;
  --session-danger:#b91c1c;--session-danger-fg:#ffffff;--session-hover:#e2e8f0;
}
@media(prefers-color-scheme:light){
  :root:not([data-theme="dark"]){
    --session-accent:#0e7490;--session-fg:#0f172a;--session-muted:#475569;
    --session-surface:#ffffff;--session-border:#7c8ba3;--session-countdown:#0e7490;
    --session-danger:#b91c1c;--session-danger-fg:#ffffff;--session-hover:#e2e8f0;
  }
}
/* ══════ CORES DO GESTOR DE SESSÃO · FIM ══════ */

/* tokens do módulo global de UI: modules/config/design_system/tokens.css (cópia literal; importado por app/globals.css) */
/* GERADO por gerar_tokens.py de tokens.json v1.0.0 — não editar à mão. */
/* Porta canônica IconsAI — tokens --access-* dos dois temas e derivados da marca (CDS-01, CDS-04). */

/* Derivados do bloco `marca` (iguais nos dois temas). */
:root {
  --access-action: #c2410c;
  --access-context: #0e7490;
  --access-on-action: #ffffff;
  --access-on-context: #ffffff;
  --access-action-wash: rgba(194, 65, 12, 0.09);
  --access-context-wash: rgba(14, 116, 144, 0.14);
  --access-focus-ring: rgba(14, 116, 144, 0.30);
  --access-hover-brightness: 1.1;
}

/* Escuro: padrão sem preferência clara, e o forçado por data-theme="dark". */
:root,
:root[data-theme="dark"] {
  --access-bg: #05070d;
  --access-surface: rgba(12, 16, 24, 0.88);
  --access-input: #080b12;
  --access-panel: #0b0f17;
  --access-border: #1e293b;
  --access-field-border: #334155;
  --access-text: #eef2ff;
  --access-muted: #94a3b8;
  --access-dim: #7c8ba3;
  --access-danger: #ef4444;
  --access-header: #080b12;
  --access-accent: #67e8f9;
  --access-warn: #fdba74;
  --access-bad: #fca5a5;
  --access-ok: #34d399;
  --access-wait: #f0abfc;
  --access-kicker-context: #22d3ee;
  --access-card-shadow: 0 28px 70px rgba(0, 0, 0, 0.55);
}

/* Claro. O MESMO conteúdo vale para data-theme="light" e para o sistema claro sem data-theme="dark". */
:root[data-theme="light"] {
  --access-bg: #f4f1ea;
  --access-surface: rgba(255, 255, 255, 0.92);
  --access-input: #ffffff;
  --access-panel: #fbf9f4;
  --access-border: #d6d1c6;
  --access-field-border: #8f897d;
  --access-text: #14171a;
  --access-muted: #4a4d52;
  --access-dim: #5c5f64;
  --access-danger: #b91c1c;
  --access-header: #f9f9f7;
  --access-accent: #0e7490;
  --access-warn: #c2410c;
  --access-bad: #b91c1c;
  --access-ok: #047857;
  --access-wait: #7e22ce;
  --access-kicker-context: #094c5b;
  --access-card-shadow: 0 18px 44px rgba(62, 48, 28, 0.10);
}

@media (prefers-color-scheme: light) {
  :root:not([data-theme="dark"]) {
    --access-bg: #f4f1ea;
    --access-surface: rgba(255, 255, 255, 0.92);
    --access-input: #ffffff;
    --access-panel: #fbf9f4;
    --access-border: #d6d1c6;
    --access-field-border: #8f897d;
    --access-text: #14171a;
    --access-muted: #4a4d52;
    --access-dim: #5c5f64;
    --access-danger: #b91c1c;
    --access-header: #f9f9f7;
    --access-accent: #0e7490;
    --access-warn: #c2410c;
    --access-bad: #b91c1c;
    --access-ok: #047857;
    --access-wait: #7e22ce;
    --access-kicker-context: #094c5b;
    --access-card-shadow: 0 18px 44px rgba(62, 48, 28, 0.10);
  }
}

:root{--font-inter:'Inter';--font-mono-jb:'JetBrains Mono';--font-ui: var(--font-inter, Inter), system-ui, sans-serif;  --font-mono: var(--font-mono-jb, "JetBrains Mono"), ui-monospace, monospace;}
*{box-sizing:border-box}html,body{margin:0;padding:0;max-width:100%;overflow-x:clip}body{background:var(--access-bg);color:var(--access-text);font-family:var(--font-ui);-webkit-font-smoothing:antialiased}
/* modules/design_system/ui/Tabs.module.css (classes com prefixo tb-, como o CSS Modules) */
/* Abas canônicas do Design System (ordem do dono, 17/10/2026).
   Toda régua de abas do painel usa estas três classes:
   - `.tb-regua`  — a fileira de abas;
   - `.tb-aba`    — cada aba, no formato e comportamento do botão «Voltar»
                 (modules/person/ui/CartoesAplicativos.tb-module.tb-css, `.tb-voltar`);
   - `.tb-area`   — o painel do conteúdo da aba: separado da régua, fundo um tom
                 mais claro que o do sistema e borda clara de cor própria.
   Aba selecionada: `aria-current="page"` (navegação por URL) ou
   `aria-selected="true"` (role="tab"). Tokens em shared/ui/theme/tokens.tb-css. */

.tb-regua {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.tb-aba {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 40px;
  padding: 9px 14px;
  border: 1px solid var(--access-border);
  border-radius: 12px;
  background: var(--panel-tab-background);
  color: var(--access-text);
  font: 600 14px/1.2 var(--font-sans);
  text-decoration: none;
  white-space: nowrap;
  cursor: pointer;
  box-shadow: 0 2px 0 color-mix(in srgb, var(--access-border) 78%, transparent);
  transition: transform 160ms ease, border-color 160ms ease, box-shadow 160ms ease,
    background-color 160ms ease, color 160ms ease;
}
.tb-aba:hover {
  border-color: color-mix(in srgb, var(--access-context) 55%, var(--access-border));
  transform: translateY(-1px);
  box-shadow: 0 3px 0 color-mix(in srgb, var(--access-context) 14%, transparent);
}
.tb-aba:active {
  transform: translateY(1px);
  box-shadow: 0 1px 0 color-mix(in srgb, var(--access-border) 78%, transparent);
}
.tb-aba:focus-visible {
  outline: 2px solid var(--access-context);
  outline-offset: 2px;
}
.tb-aba[aria-current="page"],
.tb-aba[aria-selected="true"] {
  background: var(--panel-primary);
  border-color: var(--panel-primary);
  color: var(--panel-primary-foreground);
  box-shadow: 0 2px 0 color-mix(in srgb, var(--panel-primary) 45%, transparent);
}
.tb-aba:disabled,
.tb-aba[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.55;
  transform: none;
}

.tb-area {
  display: grid;
  gap: 20px;
  min-width: 0;
  margin-top: 16px;
  padding: clamp(16px, 2.5vw, 24px);
  border: 1px solid var(--panel-tab-area-border);
  border-radius: 14px;
  background: var(--panel-tab-area-background);
}

@media (prefers-reduced-motion: reduce) {
  .tb-aba {
    transition: none;
  }
  .tb-aba:hover,
  .tb-aba:active {
    transform: none;
  }
}

/* modules/design_system/ui/HelpButton.module.css (classes com prefixo hb-, como o CSS Modules) */
/* Botão de ajuda: «?» em círculo; cor e negrito só em hover/foco (DESIGN-SYSTEM-SUPERADMIN §5). */
.hb-raiz {
  position: relative;
  display: inline-flex;
  align-items: center;
}

.hb-botao {
  display: inline-grid;
  place-items: center;
  width: 24px;
  height: 24px;
  padding: 0;
  border: 1px solid var(--access-border);
  border-radius: 50%;
  background: transparent;
  color: var(--access-muted);
  font: 400 13px/1 var(--font-mono);
  cursor: help;
}

.hb-botao:hover,
.hb-botao:focus-visible,
.hb-botao[aria-expanded="true"] {
  border-width: 2px;
  border-color: var(--access-context);
  color: var(--access-context);
  font-weight: 800;
  outline: none;
}

.hb-painel {
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 20;
  width: max-content;
  max-width: min(360px, 80vw);
  padding: 10px 12px;
  border: 1px solid var(--access-border);
  border-radius: 8px;
  background: var(--access-panel);
  color: var(--access-text);
  font-size: 13px;
  line-height: 1.55;
  box-shadow: 0 8px 24px rgb(0 0 0 / 0.18);
}

.hb-painel[hidden] {
  display: none;
}

/* modules/infra_health/ui/InfraHealth.module.css (classes com prefixo ih-, como o CSS Modules) */
.ih-secao { display: flex; flex-direction: column; gap: 16px; }
.ih-aviso { margin: 0; padding: 10px 14px; border-radius: 10px; border: 1px solid var(--panel-border); background: var(--panel-surface); font-size: .875rem; }
.ih-aviso[data-tone="warning"] { border-color: var(--panel-warning); }
.ih-aviso[data-tone="error"] { border-color: var(--panel-error); }
.ih-cartao { border: 1px solid var(--panel-border); border-radius: 12px; background: var(--panel-surface); padding: 18px; display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.ih-cabecalho { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 8px; }
.ih-nome { margin: 0; font: 700 1rem/1.3 var(--font-inter), sans-serif; }
.ih-sub { font-size: .8rem; color: var(--panel-foreground-muted); }
.ih-barra { display: flex; align-items: center; gap: 10px; }
.ih-trilho { flex: 1; height: 8px; border-radius: 4px; background: var(--panel-surface-elevated); overflow: hidden; }
.ih-preenchido { height: 8px; background: var(--panel-success); }
.ih-preenchido[data-tone="warning"] { background: var(--panel-warning); }
.ih-preenchido[data-tone="error"] { background: var(--panel-error); }
.ih-pct { min-width: 44px; text-align: right; font: 700 .85rem/1 var(--font-mono), monospace; font-variant-numeric: tabular-nums; }
.ih-alertas { margin: 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 6px; font-size: .875rem; }
.ih-alertas li { display: flex; gap: 8px; align-items: baseline; }
.ih-marca { font-weight: 700; }
.ih-marca[data-tone="error"] { color: var(--panel-error); }
.ih-marca[data-tone="warning"] { color: var(--panel-warning); }
.ih-tabelaBox { overflow-x: auto; border: 1px solid var(--panel-border); border-radius: 12px; }
.ih-tabela { width: 100%; min-width: 560px; border-collapse: collapse; font-size: .875rem; }
.ih-tabela th { text-align: left; padding: 10px 12px; font-weight: 600; color: var(--panel-foreground-muted); background: var(--panel-surface-elevated); }
.ih-tabela td { padding: 10px 12px; border-top: 1px solid var(--panel-border); }
.ih-mono { font-family: var(--font-mono), monospace; font-size: .8rem; overflow-wrap: anywhere; }
.ih-num { text-align: right; font-variant-numeric: tabular-nums; }
.ih-lista { margin: 0; display: grid; grid-template-columns: auto 1fr; gap: 8px 16px; font-size: .875rem; }
.ih-lista dt { color: var(--panel-foreground-muted); }
.ih-lista dd { margin: 0; font-weight: 600; }

/* modules/infra_health/mini_graficos/MiniGraficos.module.css (classes com prefixo mg-, como o CSS Modules) */
/* Resumo com mini gráficos: grade do DESIGN-SYSTEM-SUPERADMIN §3 (260px, gap 12), modelo do resumo da aba «Tokens de IA». */
.mg-grade { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; margin: 0; padding: 0; list-style: none; }
.mg-cartao { display: grid; gap: 10px; min-width: 0; padding: 14px; border: 1px solid var(--panel-border); border-radius: 12px; background: var(--panel-surface); }
.mg-cartao[data-tone="warning"] { border-color: var(--panel-warning); }
.mg-cartao[data-tone="error"] { border-color: var(--panel-error); }
.mg-cabeca { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.mg-rotulo { color: var(--panel-foreground-muted); font-size: .8rem; font-weight: 600; }
.mg-corpo { display: flex; gap: 12px; align-items: center; min-width: 0; }
.mg-grafico { flex: none; display: flex; align-items: center; }
.mg-numeros { display: grid; gap: 2px; min-width: 0; }
.mg-valor { color: var(--panel-foreground); font: 800 1.15rem/1.2 var(--font-mono), monospace; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.mg-nota { color: var(--panel-foreground-muted); font-size: .78rem; line-height: 1.4; }

.mg-anel { display: block; width: 64px; height: 64px; }
.mg-anelFundo { fill: none; stroke: var(--panel-surface-elevated); stroke-width: 6; }
.mg-anelValor { fill: none; stroke: var(--panel-primary); stroke-width: 6; stroke-linecap: round; }
.mg-anel[data-tone="success"] .mg-anelValor { stroke: var(--panel-success); }
.mg-anel[data-tone="warning"] .mg-anelValor { stroke: var(--panel-warning); }
.mg-anel[data-tone="error"] .mg-anelValor { stroke: var(--panel-error); }
.mg-anelTexto { fill: var(--panel-foreground); font: 800 13px var(--font-mono), monospace; }

.mg-barras { display: block; width: 96px; height: 40px; }
.mg-barra { fill: var(--panel-primary); }
.mg-barra[data-tone="success"] { fill: var(--panel-success); }
.mg-barra[data-tone="warning"] { fill: var(--panel-warning); }
.mg-barra[data-tone="error"] { fill: var(--panel-error); }
.mg-barraAusente { fill: var(--panel-border); }
.mg-semGrafico { color: var(--panel-foreground-muted); font-size: .85rem; min-width: 64px; text-align: center; }

@media (max-width: 480px) {
  .mg-grade { grid-template-columns: 1fr; }
}

/* modules/deploy_runs/passos/Passos.module.css (classes com prefixo ps-, como o CSS Modules) */
.ps-secao { display: flex; flex-direction: column; gap: 14px; margin-top: 24px; }
.ps-titulo { margin: 0; font: 700 1.05rem/1.3 var(--font-inter), sans-serif; }
.ps-sub { margin: 0; font-size: .8rem; color: var(--panel-foreground-muted); }
.ps-aviso { margin: 0; padding: 10px 14px; border-radius: 10px; border: 1px solid var(--panel-border); background: var(--panel-surface); font-size: .875rem; }
.ps-aviso[data-tone="warning"] { border-color: var(--panel-warning); }
.ps-aviso[data-tone="error"] { border-color: var(--panel-error); }
.ps-escolha { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: .85rem; }
.ps-escolha span { color: var(--panel-foreground-muted); font-weight: 600; }
.ps-escolha select { max-width: 100%; padding: 6px 10px; border: 1px solid var(--panel-border); border-radius: 8px; background: var(--panel-surface); color: var(--panel-foreground); font: inherit; }
.ps-tabelaBox { overflow-x: auto; border: 1px solid var(--panel-border); border-radius: 12px; }
.ps-tabela { width: 100%; min-width: 560px; border-collapse: collapse; font-size: .875rem; }
.ps-tabela th { text-align: left; padding: 10px 12px; font-weight: 600; color: var(--panel-foreground-muted); background: var(--panel-surface-elevated); }
.ps-tabela td { padding: 10px 12px; border-top: 1px solid var(--panel-border); }
.ps-mono { font-family: var(--font-mono), monospace; font-size: .8rem; overflow-wrap: anywhere; }
.ps-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.ps-estado { display: inline-block; padding: 2px 8px; border-radius: 999px; border: 1px solid var(--panel-border); font-size: .78rem; font-weight: 600; }
.ps-estado[data-tone="success"] { border-color: var(--panel-success); color: var(--panel-success-foreground); background: var(--panel-success); }
.ps-estado[data-tone="error"] { border-color: var(--panel-error); color: var(--panel-error-foreground); background: var(--panel-error); }
.ps-trilho { min-width: 120px; height: 8px; border-radius: 4px; background: var(--panel-surface-elevated); overflow: hidden; }
.ps-preenchido { height: 8px; background: var(--panel-primary); }
.ps-preenchido[data-tone="error"] { background: var(--panel-error); }

.pg{max-width:1200px;margin:0 auto;padding:24px 16px 64px}.pg h1{margin:0 0 4px;font:700 1.35rem/1.3 var(--font-ui)}
.pg .sub{margin:0 0 18px;color:var(--panel-foreground-muted);font-size:.85rem}
.bloco{margin:0 0 40px;padding-top:8px}.bloco>h2{margin:0 0 4px;font:700 1.15rem/1.3 var(--font-ui)}.bloco>.rota{margin:0 0 14px;color:var(--panel-foreground-muted);font:.8rem var(--font-mono)}
.painel{display:flex}
.nota-demo{margin:0 0 14px;padding:10px 14px;border:1px dashed var(--panel-border);border-radius:10px;color:var(--panel-foreground-muted);font-size:.82rem}
.hb-painel{white-space:normal}