/* GERADO por scripts/gerar-tokens-vitrine.mjs a partir do padrão BCM 25.0.0. Não edite à mão.
   Só os tokens e as fontes; o tema vale por data-tema="claro|escuro" no <html>. */
@font-face{font-family:'Bebas Neue';src:url('/assets/fontes/BebasNeue-Regular.woff') format('woff');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Mulish';src:url('/assets/fontes/Mulish-Variable.woff') format('woff');font-weight:200 1000;font-style:normal;font-display:swap}
/* ---------- tokens do padrão ---------- */
:root {
  /* As cinco cores da identidade, mais o fundo do ícone. Estas NÃO mudam
     com o tema — são a marca; o uso em tela passa pelos tokens de cor. */
  --bcm-azul:#006EA5;--bcm-azul-claro:#80B6E3;--bcm-preto:#3C3C3B;--bcm-cinza:#686969;
  --bcm-gelo:#EBEBEA;--bcm-icone-fundo:#2B2B2B;
  /* Bebas Neue só em título, Mulish em todo o resto. Nenhuma terceira
     família. Bebas nunca recebe negrito: o navegador simula o peso e
     engorda o traço. Para hierarquia, varie o tamanho. */
  --familia-titulo:Bebas Neue;--familia-texto:Mulish;--peso-apoio:400;--peso-padrao:600;
  --peso-enfase:700;--peso-numeros:800;--txt-xs:11.5px;--txt-sm:12.5px;--txt-md:13.5px;
  --txt-lg:15px;--txt-grupo:9.5px;--tit-sm:16px;--tit-md:19px;--tit-lg:23px;--tit-xl:26px;
  --tit-2xl:30px;--tit-3xl:46px;
  /* escala de 4 */
  --esp-1:4px;--esp-2:8px;--esp-3:12px;--esp-4:16px;--esp-5:22px;--esp-6:32px;
  --esp-7:48px;
  --raio-0:4px;--raio-1:6px;--raio-2:8px;--raio-3:10px;--raio-4:12px;--raio-5:14px;
  --raio-pill:20px;
  /* Um inventário só, para o sistema inteiro. Não existe segunda tabela
     de tempos em lugar nenhum. */
  --dur-1:.15s;--dur-2:.22s;--dur-3:.3s;--dur-4:.45s;--dur-pref:400ms;--dur-traco:.9s;
  --dur-passo:.045s;--ciclo-respira:1.4s;--ciclo-giro:.7s;--salvo-visto:600ms;
  --salvo-tempo:1400ms;--ease:cubic-bezier(.2,.8,.2,1);
  --ease-saida:cubic-bezier(.4,0,.7,.2);
  /* medidas fixas do shell */
  --alt-ctrl:38px;--alt-ctrl-sm:32px;--alvo-toque:44px;--calha:22px;--sidebar:242px;
  --sidebar-rail:68px;--topo:56px;--conteudo-max:1600px;--item-menu-alt:40px;
  --traco-menu:1.7;--item-menu-icone:17px;--item-menu-caixa:26px;--topo-tit-respiro:.12em;
  --quadro-alt:calc(var(--vp-h) - var(--topo) - var(--esp-7));
  /* A distância entre o conteúdo e a sidebar, e entre o conteúdo e a
     borda da tela, é UMA medida. Escrever o valor direto no `main` é como
     os dois lados se soltam um do outro no primeiro projeto novo. */
  --main-padding:20px var(--calha) 36px;
  /* Fixa nos dois temas: quando a tela de carregamento aparece, o tema
     pode nem ter sido lido ainda. Sob prefers-reduced-motion o tempo
     mínimo cai para zero — ver o fim deste arquivo. */
  --carr-fundo-1:#14303F;--carr-fundo-2:#0D1319;--carr-esfera:#2E90D9;
  --carr-ponto:#FFFFFF;--carr-txt:#EDF2F6;--carr-txt2:#9BAAB7;--tempo-minimo:1150ms;
  --tempo-minimo-reduzido:0ms;--saida:420ms;--carr-pronto:450ms;--carr-limite:10000ms;
  --carga-linha:2px;--carr-acento:#8CC8F2;--carr-ok:#3FD0BF;--carr-ok-txt:#062019;
  --carr-luz-1:#2E90D9;--carr-luz-2:#13756C;--carr-traco:rgba(255,255,255,.1);
  --carr-contorno:rgba(255,255,255,.22);--carr-cortina:900ms;--carr-lado:300px;
  --carr-num:clamp(72px,10vw,150px);--carr-num-cel:64px;--carr-pre:.4em;
  --carr-num-unid:.38em;
  /* Estado ativo do menu: MESMOS valores nos dois temas. Nunca --prim
     aqui — ele muda com o tema e o item selecionado passaria a ter dois
     desenhos. Estado ativo é informação, e informação não muda com a luz. */
  --nav-ativo:#006EA5;--nav-ativo-txt:#FFFFFF;--nav-ativo-qtd:rgba(0,0,0,.18);
  /* tamanho da interface — Minha conta › Preferências › Tamanho */
  --esc-pequeno:.92;--esc-padrao:1;--esc-grande:1.08;--esc-maior:1.18;
  /* Calha reservada no fluxo × largura desenhada: são medidas
     independentes, e é isso que deixa a barra sobrepor sem empurrar a tela. */
  --sb-larg:242px;--sb-larg-rail:68px;--sb-reserva-oculta:0px;--sb-borda:14px;
  --sb-atraso-saida:200ms;
  /* Sempre redondo. Sem foto, iniciais em branco sobre uma cor da
     paleta fechada, escolhida pela pessoa. */
  --av-shell:32px;--av-topo:34px;--av-perfil:96px;--av-limite-foto:2097152;
  --av-amostra:40px;--av-amostra-p:30px;--av-amostra-selo:18px;--av-cartao:24px;
  /* Três papéis, três desenhos: tópico › aba › subaba. Nunca um quarto. */
  --nav-topico-txt:10.5px;--nav-topico-cima:26px;--nav-topico-lados:14px;
  --nav-topico-baixo:6px;--nav-sub-alt:34px;--nav-sub-icone:15px;--nav-sub-caixa:22px;
  --nav-sub-recuo:16px;--nav-rail-item:42px;--nav-rail-entre:6px;--nav-entre-abas:2px;
  --nav-chevron:13px;--nav-acao:30px;
  /* Tamanhos fixos. Nunca estique: se a caixa não bate, mude a caixa. */
  --logo-sidebar-l:176px;--logo-sidebar-a:47px;--logo-rail-l:34px;--logo-rail-a:34px;
  --logo-login-l:190px;--logo-login-a:84px;--logo-impressao-l:110px;
  --logo-impressao-a:30px;--logo-respiro:12px;
  --modal-x:32px;--modal-x-topo:14px;--modal-x-lado:14px;--modal-x-icone:15px;
  --modal-tit-pad:38px;--modal-larg:520px;--modal-margem:32px;--gav-max-l:1100px;
  /* A tela de login é IGUAL em todo sistema BCM — só os textos mudam. */
  --login-marca-l:42%;--login-marca-pad:48px 56px;--login-pad-mobile-x:22px;
  --login-faixa-cima:26px;--login-faixa-baixo:28px;--login-cartao-l:380px;
  --login-cartao-pad:36px;--login-cartao-gap:20px;--login-btn-alt:42px;--login-olho:32px;
  --login-tema:32px;--login-quebra:860px;--login-g1:#0B2C3E;--login-g2:#0D3E58;
  --login-g3:#00456A;--login-brilho:rgba(79,169,238,.12);--login-txt:#EDF2F6;
  --login-txt2:#CBDCEA;--login-txt3:#AFC8DE;
  /* A linguagem de degradê do padrão, escolhida olhando quatro tratamentos
     lado a lado. É a MESMA do painel de marca do login, e por isso não traz
     cor nova. Obrigatória nos cinco lugares do grupo; fora deles, entra
     quando agrega e não polui — nunca inventada. */
  --deg-angulo:158deg;--deg-brilho-pos:78% 18%;--deg-brilho-raio:58%;
  --deg-marca-fundo:radial-gradient(circle at var(--deg-brilho-pos),var(--login-brilho),transparent var(--deg-brilho-raio)),linear-gradient(var(--deg-angulo),var(--login-g1) 0%,var(--login-g2) 48%,var(--login-g3) 100%);
  --deg-faixa-1:#0D3E58;--deg-faixa-2:#0B2C3E;--deg-faixa-txt:#EAF3F9;
  --deg-faixa-txt2:#DCEAF4;--deg-veu-alt:46px;--guia-vidro-l:34ch;--guia-veu-alt:180px;
  /* O material translúcido do padrão. NÃO é só desfoque: desfoque não muda
     o quanto o fundo é claro ou escuro, e é a luminância de baixo que decide
     se o texto de cima se lê. O material leva contraste e brilho na mesma
     passada de filtro, e é isso que permite transmitir o dobro sem perder os
     4,5:1. Dois graus, escolhidos pelo TEMPO que a peça fica na tela, e uma
     lista fechada de seis lugares — o resto do sistema é chapado. */
  --vid-desf:24px;--vid-veu-desf:10px;--vid-sat:1.7;
  --vid-material:contrast(var(--vid-contraste)) brightness(var(--vid-brilho)) saturate(var(--vid-sat));
  /* A tela cheia das notificações. Os cartões do topo são filtros que se
     clicam, e saem dos tipos que aquele sistema realmente emite. */
  --inbox-cartao-alt:84px;--inbox-cartao-min:210px;--inbox-item-alt:72px;
  --inbox-faixa:3px;--inbox-icone:38px;
  /* A aba Backups: a faixa da rotina, que diz numa frase quando o backup
     roda e onde cada destino guarda o arquivo (R-0157, 21.2.0). */
  --bk-rotina-txt:18rem;
  /* A versão de celular não é uma segunda interface: é a mesma tela. Abaixo
     de --quebra-mobile a sidebar sai do fluxo e vira a barra de abas de
     baixo, que flutua sobre o conteúdo e some ao rolar para baixo. */
  --quebra-mobile:900px;--tab-alt:58px;--tab-icone:23px;--tab-rotulo:10.5px;
  --tab-raio:29px;--tab-marca-l:26px;--tab-marca-a:3px;--tab-marca-topo:5px;
  --tab-margem:12px;--folha-raio:20px;--folha-punho:36px;--topo-mobile:50px;
  /* A barra de rolagem do sistema é UMA só, e é a desenhada aqui, com as
     setas nas duas pontas. A nativa é três barras diferentes em três
     navegadores. As cores dela estão no grupo `cor`; o comportamento (as
     setas, o polegar, o arrasto) vem do rolagem() do assets/sistema.html. */
  --rol-larg:12px;--rol-seta:15px;--rol-polegar-min:28px;--rol-raio:6px;--rol-passo:48px;
  --rol-espera:320ms;--rol-repete:60ms;--rol-arrasto-faixa:64px;
  /* As duas buscas: a GERAL, no topo, que é a paleta de comandos e existe
     em toda aba; e a DA TELA, dentro da aba, que filtra a tabela enquanto
     se digita. Nenhuma das duas tem botão de buscar. */
  --busca-topo-l:340px;--busca-topo-alt:34px;--busca-painel-l:560px;--busca-tela-l:360px;
  --busca-espera:220ms;
  /* Minha conta › Dicas e manuais: a terceira subaba obrigatória, onde o
     sistema explica a si mesmo — instalação, atalhos e o que for entrando. */
  --manual-figura-l:440px;--manual-passo:26px;--manual-cartao-min:240px;
  /* A tela Início, obrigatória: as colunas, o cartão de módulo nos três
     desenhos, os números, as barras por dia e a gaveta de preferências. As
     cores de estado sobre o degradê são fixas nos dois temas. */
  --ini-avatar:52px;--ini-hoje-max:280px;--ini-relatorio-min:360px;
  --ini-lateral-min:280px;--ini-lateral-l:340px;--ini-mod-min:232px;
  --ini-mod-min-compacto:210px;--ini-mod-max:460px;--ini-mod-icone:44px;
  --ini-mod-icone-compacto:34px;--ini-mosaico-min:150px;--ini-mosaico-icone:48px;
  --ini-kpi-min:150px;--ini-situacao-min:300px;--ini-barras-alt:132px;
  --ini-barras-alt-larga:210px;--ini-rosca:104px;--ini-grupo-rot:104px;
  --ini-coluna-min:210px;--ini-linha-q:72px;--ini-pend-min:190px;--ini-opcao-min:112px;
  --ini-miniatura-alt:66px;--ini-veu-marca:rgba(4,18,30,.35);--ini-ok-sobre-marca:#46D39A;
  --ini-al-sobre-marca:#F0B357;--ini-err-sobre-marca:#FF9A93;
  /* O componente de gráfico (padrao-bcm/graficos.js): a caixa do desenho,
     a altura do vazio e a espessura do arco da rosca. A COR das séries está
     no grupo cor (--graf-1 a --graf-6), porque muda com o tema. */
  --graf-larg:480px;--graf-alt:260px;--graf-vazio-alt:180px;--graf-rosca-arco:18px;
  /* O visor de anexo: um componente só para imagem, PDF e planilha. Os
     limites de linha e de coluna são token porque a grade é desenhada em
     tela, e planilha de cem mil linhas montada de uma vez trava a aba antes
     de mostrar a primeira célula. */
  --visor-larg:1060px;--visor-palco-min:300px;--visor-pdf-alt:640px;--visor-zoom-min:.25;
  --visor-zoom-max:4;--visor-zoom-passo:.25;--visor-cel-min:108px;--visor-cel-max:320px;
  --visor-canto:54px;--visor-aba-alt:30px;--visor-limite-linhas:2000;
  --visor-limite-colunas:64;
  /* ---- derivadas: variável viva, valor sempre vindo de um token ---- */
  --pilha-titulo:var(--familia-titulo),Oswald,Impact,sans-serif;
  --pilha-texto:var(--familia-texto),system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
  --escala:var(--esc-padrao);
  /* viewport corrigida pela escala: com html{zoom}, a medida da JANELA deixa
     de ser a medida da INTERFACE. Quem precisa de viewport lê --vp-h/--vp-w,
     que já dividem pela escala; unidade de viewport solta não entra em regra. */
  --vp-h:calc(100vh / var(--escala));--vp-w:calc(100vw / var(--escala));
  --sb-reserva:var(--sb-larg);
  --av-cor:var(--av-1);
}

/* tamanho da interface: um controle escala texto e controles juntos */
:root[data-escala="pequeno"] { --escala: var(--esc-pequeno) }
:root[data-escala="grande"]  { --escala: var(--esc-grande) }
:root[data-escala="maior"]   { --escala: var(--esc-maior) }

/* ---------- cor: modo claro ---------- */
:root, [data-tema="claro"] {
  color-scheme: light;
  --fundo:#EBEBEA;--sup:#FFFFFF;--sup2:#F4F4F3;--campo-fundo:#FFFFFF;--borda:#DEDEDC;
  --borda-ctrl:#838380;--ag-filete:#ECECEB;--txt:#3C3C3B;--txt2:#686969;--txt3:#5C5D5D;
  --desab:#8A8B8A;--prim:#006EA5;--prim-txt:#FFFFFF;--prim-suave:#E1EDF4;--ok:#1F6B4A;
  --ok-bg:#E1EFE8;--err:#9E2B21;--err-bg:#F6E4E2;--al:#8A5510;--al-bg:#F4EAD8;
  --hover:#F0F0EF;--sombra:0 1px 3px rgba(60,60,59,.08);
  --sombra-2:0 16px 40px rgba(60,60,59,.16);--sombra-h:0 6px 16px rgba(60,60,59,.12);
  --tdp:12px 14px;--area-op:.12;--graf-1:#006EA5;--graf-2:#C2570C;--graf-3:#0E8A7E;
  --graf-4:#6B4FBF;--graf-5:#A97A0F;--graf-6:#B42318;--av-txt:#FFFFFF;--av-1:#0B6CA9;
  --av-2:#0C7379;--av-3:#227645;--av-4:#557115;--av-5:#905D04;--av-6:#B6411E;
  --av-7:#BB2F70;--av-8:#7F4EC1;--sup-flut:#FFFFFF;--sup-flut-rgb:255,255,255;
  --vid-alto:.82;--vid-baixo:.90;--vid-contraste:.35;--vid-brilho:1.75;--sw-bola:#FFFFFF;
  --tt-sup:#262D33;--tt-borda:#3A434B;--tt-txt:#EDF2F6;--tt-link:#80B6E3;
  --tt-txt2:#9FB0BE;--tt-ok:#46D39A;--tt-err:#FF7B72;--err-txt:#FFFFFF;
  --neutro-bg:#F0F0EF;--neutro-txt:#686969;--nota-1:#C3DEF1;--nota-2:#C3F1DC;
  --nota-3:#F1E5C3;--nota-4:#F1D7C3;--nota-5:#F1C7C3;--nota-6:#D8C3F1;--nota-7:#F1C3DE;
  --nota-8:#E4E8EC;--nota-txt2:#51575C;--rol-trilho:#EDEDEC;--rol-polegar:#7C7C79;
  --rol-polegar-forte:#5A5A58;--rol-seta-cor:#686969;--brilho:none;--anel-cor:#006EA5;
  --anel:0 0 0 2px var(--anel-cor);--veu:rgba(255,255,255,0);
}

/* ---------- cor: modo escuro ----------
   Derivado do preto fosco da marca. A primária vira o AZUL CLARO: o azul da
   marca sobre fundo escuro reprovaria em contraste. O canvas é azul-ardósia,
   não cinza neutro — cinza deixa o escuro apagado —, e as superfícies sobem
   de luz em degraus visíveis para os cards se destacarem. */
[data-tema="escuro"] {
  color-scheme: dark;
  --fundo:#0D1319;--sup:#18212A;--sup2:#212C36;--campo-fundo:#0F161C;--borda:#2E3C48;
  --borda-ctrl:#627888;--ag-filete:#26313D;--txt:#EDF2F6;--txt2:#9FB0BE;--txt3:#9FB0BE;
  --desab:#7C8B98;--prim:#4FA9EE;--prim-txt:#04121E;--prim-suave:#16324A;--ok:#46D39A;
  --ok-bg:#12332A;--err:#FF7B72;--err-bg:#3B1E1E;--al:#F0B357;--al-bg:#3A2C14;
  --hover:#202B35;--sombra:0 2px 10px rgba(0,0,0,.5);
  --sombra-2:0 22px 50px rgba(0,0,0,.62);--sombra-h:0 8px 22px rgba(0,0,0,.5);
  --tdp:12px 14px;--area-op:.22;--graf-1:#4FA9EE;--graf-2:#FF9B57;--graf-3:#3FD0BF;
  --graf-4:#B49BF5;--graf-5:#F0C04A;--graf-6:#FF8A80;--av-txt:#0D1319;--av-1:#54ACE3;
  --av-2:#1FB6BD;--av-3:#36BA6D;--av-4:#87B222;--av-5:#DA9723;--av-6:#E88C70;
  --av-7:#E189B2;--av-8:#B598DB;--sup-flut:#26333F;--sup-flut-rgb:38,51,63;--vid-alto:.52;
  --vid-baixo:.68;--vid-contraste:1;--vid-brilho:.22;--sw-bola:#EDF2F6;--tt-sup:#2A3742;
  --tt-borda:#41525F;--tt-txt:#EDF2F6;--tt-link:#7CC0F5;--tt-txt2:#9FB0BE;--tt-ok:#46D39A;
  --tt-err:#FF7B72;--err-txt:#2A0A08;--neutro-bg:#2C3946;--neutro-txt:#BFD0DC;
  --nota-1:#204157;--nota-2:#20573E;--nota-3:#574A20;--nota-4:#573820;--nota-5:#572520;
  --nota-6:#3A2057;--nota-7:#572041;--nota-8:#373E46;--nota-txt2:#BBBFC3;
  --rol-trilho:#151D25;--rol-polegar:#5C7183;--rol-polegar-forte:#8399AC;
  --rol-seta-cor:#9FB0BE;--brilho:inset 0 1px 0 rgba(255,255,255,.05);--anel-cor:#6FBEFA;
  --anel:0 0 0 2px var(--anel-cor);--veu:rgba(255,255,255,.03);
}