/* ============================================================================
   Sistema visual — entrega de design de 29/08/2026 (design/README.md §Sistema visual).
   ESCURO É O PADRÃO: o :root nu carrega a paleta escura; a clara é redefinição de
   token sob prefers-color-scheme:light e sob [data-theme="light"].
   Os nomes dos tokens são os de antes de propósito — as telas legadas adotam o
   visual novo sem uma linha de mudança.
   ============================================================================ */
:root{
  /* --- paleta escura (padrão) --- */
  --tinta:#0E0A12; --tinta-ui:#17111C; --osso:#F3EEEA;
  --ground:#0E0A12;
  --ink:#F3EEEA; --ink-2:#B9AEC0; --muted:#8A7F93;

  /* superfície de vidro */
  --surface:rgba(255,255,255,.07);
  --surface-2:rgba(255,255,255,.04);
  --line:rgba(255,255,255,.15);
  --line-strong:rgba(255,255,255,.26);
  --vidro-blur:blur(30px) saturate(175%);
  --vidro-brilho:inset 0 1px 0 rgba(255,255,255,.42);
  --shadow:var(--vidro-brilho), 0 26px 60px -30px rgba(0,0,0,.8);
  --raio:24px; --raio-sm:14px;

  /* acentos */
  --berry:#FF4D8D;          /* rosa: ação primária, agora, seleção */
  --berry-deep:#FF9EC4;     /* rosa claro: rótulo de destaque, atraso */
  --berry-wash:rgba(255,77,141,.14);
  --brass:#FFAE1A;          /* âmbar: atenção, pendente, aguardando */
  --brass-2:#FFC257;
  --brass-wash:rgba(255,174,26,.14);
  --violeta:#8B6BFF;        /* deslocamento, contratado, estado-alvo */
  --violeta-2:#C7B4FF;
  --violeta-wash:rgba(139,107,255,.14);

  /* semânticas */
  --good:#8FE3A6; --good-wash:rgba(143,227,166,.14);
  --warn:#FFC257; --warn-wash:rgba(255,174,26,.14);
  --crit:#FF6B81; --crit-wash:rgba(255,107,129,.15);

  /* superfície OPACA para peças que precisam cobrir o que está atrás
     (balão, tooltip, rótulo sobre o gráfico). O vidro do canvas é translúcido
     de propósito; estas não podem ser. */
  --solido:rgba(14,10,18,.92);
  --solido-fraco:rgba(14,10,18,.72);
  --alvo-miolo:#0E0A12;

  /* fundo de campo. NUNCA deixar o controle nativo decidir: o invólucro que a
     publicação põe em volta da página força `color-scheme:light`, e aí o campo
     nasce branco enquanto a nossa tinta é branca. Campo ilegível nos Ajustes. */
  --campo-bg:rgba(255,255,255,.06);
  --campo-placeholder:rgba(255,255,255,.34);

  --nav-h:64px;

  /* tipografia */
  --fonte-display:"Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;
  --fonte-texto:"Manrope","Helvetica Neue",Arial,sans-serif;
  --fonte-mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;
}

/* --- paleta clara: véu branco, tinta invertida, sombra de contato no lugar do brilho --- */
/* ============================================================================
   QUEM MANDA NO TEMA (corrigido em 30/08/2026)

   O runtime do artifact escreve `data-theme` na PRÓPRIA raiz, seguindo o tema do
   claude.ai, e reescreve a cada mensagem do host. Eu escrevia no mesmo atributo:
   dois donos, e a última escrita vencia. Com o sistema no escuro, "Escuro" e
   "Sistema" davam telas diferentes — porque "Sistema" caía no carimbo do host e
   "Escuro" era sobrescrito por ele.

   Agora a escolha da Central mora em `data-tema` (nosso), e o claro vale em três
   situações, nesta ordem de autoridade:
     1. a pessoa escolheu claro                    :root[data-tema="claro"]
     2. não escolheu e o HOST diz claro            [data-theme="light"] sem data-tema
     3. não escolheu, host não disse, e o SO diz    media query, sem os dois atributos
   Escolher "escuro" não precisa de regra: escuro é a base, e nenhuma das três
   casa quando `data-tema="escuro"` está lá.
   ============================================================================ */
@media (prefers-color-scheme: light){
  :root:not([data-tema]):not([data-theme]){
    --campo-bg:rgba(255,255,255,.82);
    --campo-placeholder:rgba(23,17,28,.38);
    --solido:rgba(255,255,255,.96);
    --solido-fraco:rgba(255,255,255,.86);
    --alvo-miolo:#FFFFFF;
    --ground:#F3EEEA;
    --ink:#17111C; --ink-2:#5B5064; --muted:#867B8F;
    --surface:rgba(255,255,255,.62);
    --surface-2:rgba(255,255,255,.38);
    --line:rgba(23,17,28,.10);
    --line-strong:rgba(23,17,28,.20);
    --vidro-brilho:inset 0 1px 0 rgba(255,255,255,.9);
    --shadow:var(--vidro-brilho), 0 18px 40px -26px rgba(23,17,28,.45);
    --berry:#E0326F; --berry-deep:#B31E52;
    --berry-wash:rgba(224,50,111,.10);
    --brass:#B87400; --brass-2:#8A5600; --brass-wash:rgba(184,116,0,.12);
    --violeta:#6242D6; --violeta-2:#4A2FB0; --violeta-wash:rgba(98,66,214,.10);
    --good:#1F7A46; --good-wash:rgba(31,122,70,.12);
    --warn:#9A6200; --warn-wash:rgba(184,116,0,.12);
    --crit:#C22A45; --crit-wash:rgba(194,42,69,.10);
  }
}
:root[data-tema="claro"],
:root[data-theme="light"]:not([data-tema]){
    --campo-bg:rgba(255,255,255,.82);
    --campo-placeholder:rgba(23,17,28,.38);
    --solido:rgba(255,255,255,.96);
    --solido-fraco:rgba(255,255,255,.86);
    --alvo-miolo:#FFFFFF;
  --ground:#F3EEEA;
  --ink:#17111C; --ink-2:#5B5064; --muted:#867B8F;
  --surface:rgba(255,255,255,.62);
  --surface-2:rgba(255,255,255,.38);
  --line:rgba(23,17,28,.10);
  --line-strong:rgba(23,17,28,.20);
  --vidro-brilho:inset 0 1px 0 rgba(255,255,255,.9);
  --shadow:var(--vidro-brilho), 0 18px 40px -26px rgba(23,17,28,.45);
  --berry:#E0326F; --berry-deep:#B31E52;
  --berry-wash:rgba(224,50,111,.10);
  --brass:#B87400; --brass-2:#8A5600; --brass-wash:rgba(184,116,0,.12);
  --violeta:#6242D6; --violeta-2:#4A2FB0; --violeta-wash:rgba(98,66,214,.10);
  --good:#1F7A46; --good-wash:rgba(31,122,70,.12);
  --warn:#9A6200; --warn-wash:rgba(184,116,0,.12);
  --crit:#C22A45; --crit-wash:rgba(194,42,69,.10);
}

/* O host também escreve `style.colorScheme` inline na raiz — controles de
   formulário e barras de rolagem seguem ele. Escolha explícita da Central tem de
   ganhar de estilo inline, e só `!important` faz isso. */
:root[data-tema="escuro"]{ color-scheme:dark !important }
:root[data-tema="claro"]{ color-scheme:light !important }
/* Fundo animado em três camadas (design/README.md §Fundo animado).
   Movimento discreto: 2–3% de translação, 2° de rotação, opacidade respirando.
   prefers-reduced-motion desliga tudo — fica só o gradiente estático. */
.atmosfera{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;
  background:var(--ground)}
.atmosfera i{position:absolute;inset:-25%;display:block;will-change:transform,opacity}
.atmosfera .a1{
  background:
    radial-gradient(42% 38% at 22% 26%, rgba(255,77,141,.34), transparent 70%),
    radial-gradient(38% 34% at 78% 18%, rgba(139,107,255,.28), transparent 72%);}
.atmosfera .a2{
  background:
    radial-gradient(46% 40% at 68% 82%, rgba(255,174,26,.20), transparent 74%),
    radial-gradient(40% 36% at 12% 74%, rgba(143,227,166,.16), transparent 70%);}
.atmosfera .a3{
  mix-blend-mode:screen;opacity:.26;
  background:conic-gradient(from 210deg at 50% 50%,
    rgba(255,77,141,.16), rgba(139,107,255,.14), rgba(255,174,26,.10),
    rgba(255,77,141,.16));}
.atmosfera .a4{
  background:radial-gradient(120% 90% at 50% 0%, transparent 40%, rgba(0,0,0,.55) 100%)}

:root[data-theme="light"] .atmosfera .a4,
:root:not([data-theme="dark"]) .atmosfera .a4{
  background:radial-gradient(120% 90% at 50% 0%, transparent 45%, rgba(23,17,28,.10) 100%)}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]) .atmosfera i{opacity:.55}
  :root:not([data-theme="dark"]) .atmosfera .a3{mix-blend-mode:multiply;opacity:.14}
}
:root[data-theme="light"] .atmosfera i{opacity:.55}
:root[data-theme="light"] .atmosfera .a3{mix-blend-mode:multiply;opacity:.14}

@media (prefers-reduced-motion: reduce){
  .atmosfera i{animation:none}
}
*{box-sizing:border-box;margin:0}
html{
  -webkit-text-size-adjust:100%;          /* iOS não reescala o texto ao girar */
  overscroll-behavior-y:none;             /* mata o rubber-band que "descola" a página */
}
/* iOS: sem espera de 300ms no toque, sem seleção acidental ao arrastar */
button,.chip,.cartao,.nav button{
  touch-action:manipulation;
  -webkit-user-select:none;user-select:none;
}
/* rolagem com inércia dentro de contêineres */
.chips.rolagem,.matriz,.tabwrap{-webkit-overflow-scrolling:touch}
body{
  background:var(--ground); color:var(--ink);
  /* --teclado: altura ocupada pelo teclado do iOS (30-ui.js escreve via visualViewport) */
  font-family:var(--fonte-texto);
  font-size:16px; line-height:1.5; -webkit-font-smoothing:antialiased;
}
/* O espaco para a barra de baixo e SO do celular. No desktop o trilho e vertical,
   e essa folga fazia a pagina inteira rolar 24px em toda tela — a janela nunca
   ficava cheia, e a rolagem do documento competia com a das colunas. */
@media (max-width:759.98px){
  body{ padding-bottom:calc(var(--nav-h) + env(safe-area-inset-bottom, 0px) + 16px) }
}
/* No desktop quem rola sao as colunas de dentro, nunca o documento. */
@media (min-width:760px){
  html,body{ height:100%; overflow:hidden }
}
.tela{max-width:640px;margin:0 auto;padding:18px clamp(14px,4vw,24px) 28px}
h1,h2,h3{font-family:var(--fonte-display);text-wrap:balance;font-weight:800;letter-spacing:-.035em}
h1{font-size:clamp(26px,6.4vw,34px);line-height:1.08}
h2{font-size:19px;margin:22px 0 10px}
.eyebrow{font-family:var(--fonte-mono);font-size:11px;font-weight:700;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted);font-weight:500;display:block;margin-bottom:6px}
.sub{color:var(--ink-2);font-size:14.5px}
.num{font-variant-numeric:tabular-nums}
.mono{font-family:var(--fonte-mono)}
a{color:var(--berry)}
button{font:inherit;color:inherit;background:none;border:none;padding:0;cursor:pointer;-webkit-tap-highlight-color:transparent}
input,select,textarea{font:inherit;font-size:16px;color:var(--ink)}
:focus-visible{outline:2px solid var(--berry);outline-offset:2px;border-radius:3px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
/* ------------------------------------------------------------------
   DESKTOP É O PADRÃO (design: 1440×900, trilho de 78px). O celular
   (< 760px) é que redesenha — não o contrário. O painel do artifact
   costuma ficar entre 700 e 1000px, então o corte é baixo de propósito.
   ------------------------------------------------------------------ */
/* O trilho é IN-FLOW dentro do quadro desde que o design entrou: ele não é mais
   um `position:fixed` que precisa de espaço reservado no body. O padding que
   sobrou daquela época comia 78px da esquerda e 24px de baixo de TODA tela — o
   quadro ficava com 1362px numa janela de 1440, e o rodapé de cada tela era
   cortado. Some inteiro no desktop.

   `--trilho` continua existindo porque o toast se posiciona por ele; agora
   segue a largura de verdade do menu (30-ui.js carimba data-menu na raiz). */
body{padding:0}
.tela{max-width:none;padding:26px clamp(20px,3vw,40px) 40px}
:root{--trilho:var(--trilho-aberto,216px)}
:root[data-menu="recolhido"]{--trilho:var(--trilho-fechado,78px)}

/* uma coluna larga, com o conteúdo respirando */
.tela.painel,.tela.tela-form{max-width:1180px;margin:0 auto}

@media (max-width:759.98px){
  :root{--trilho:0px}
  body{padding:0 0 calc(var(--nav-h) + env(safe-area-inset-bottom,0px) + 16px)}
  .tela{max-width:640px;margin:0 auto;padding:18px clamp(14px,4vw,24px) 28px}
  .tela.painel,.tela.tela-form{max-width:640px}
}
/* A navegação mora em 98-trilho.css. O bloco `.nav` que ficava aqui era a barra
   fixa de ANTES do design: nenhuma tela emite mais `class="nav"` (conferido
   renderizando as 14 telas). Saiu em 29/08 junto com a revisão do menu. */

/* ---- chips ---- */
.chips{display:flex;flex-wrap:wrap;gap:7px}
.chips.rolagem{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:none}
.chip{display:inline-flex;align-items:center;gap:5px;min-height:38px;padding:6px 13px;border-radius:99px;
  border:1px solid var(--line-strong);background:var(--surface);color:var(--ink);font-size:14.5px;white-space:nowrap}
.chip.sel{background:var(--berry);border-color:var(--berry);color:#fff;font-weight:600}
.chip:disabled{opacity:.45}
.chip-status{font-family:var(--fonte-mono);font-size:10px;letter-spacing:.09em;text-transform:uppercase;
  font-weight:600;padding:2px 8px;border-radius:99px;border:1px solid currentColor}
.st-confirmado{color:var(--brass);background:var(--brass-wash)}
.st-realizado{color:var(--good);background:var(--good-wash)}
.st-cancelado,.st-noshow{color:var(--muted);background:var(--surface-2)}
.st-rascunho{color:var(--warn);background:var(--warn-wash)}
.st-bloqueio{color:var(--ink-2);background:var(--surface-2)}
/* ---- cartões ---- */
.cartao{background:var(--surface);border:1px solid var(--line);border-left:3px solid var(--line-strong);
  border-radius:var(--raio-sm);padding:13px 15px;display:flex;gap:11px;align-items:flex-start;
  width:100%;text-align:left;-webkit-backdrop-filter:var(--vidro-blur);backdrop-filter:var(--vidro-blur);
  box-shadow:var(--vidro-brilho)}
.cartao.b-confirmado{border-left-color:var(--brass)}
.cartao.b-realizado{border-left-color:var(--good)}
.cartao.b-cancelado,.cartao.b-noshow{border-left-color:var(--line-strong);opacity:.72}
.cartao.b-rascunho{border-left-color:var(--warn)}
.cartao.b-bloqueio{border-left:1px solid var(--line);background:var(--surface-2)}
.cartao .hora{font-family:var(--fonte-mono);font-size:15px;font-weight:600;line-height:1.25;flex:0 0 46px}
.cartao .hora small{display:block;font-size:11px;color:var(--muted);font-weight:400}
.cartao .meio{flex:1;min-width:0}
.cartao .nome{display:block;font-weight:700;font-size:15.5px;line-height:1.3;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cartao .det{display:block;font-size:13px;color:var(--ink-2);margin-top:1px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cartao .end{display:block;font-size:12.5px;color:var(--muted);margin-top:2px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cartao .dir{flex:0 0 auto;text-align:right;display:flex;flex-direction:column;gap:5px;align-items:flex-end}
.cartao .falta{font-family:var(--fonte-mono);font-size:13px;font-weight:600}
.cartao .pago{color:var(--good);font-size:12.5px}
.grupo-bloco{border:1px solid var(--line);border-left:3px solid var(--berry);border-radius:7px;overflow:hidden}
.grupo-bloco .grupo-cab{display:flex;justify-content:space-between;align-items:center;gap:8px;
  padding:7px 13px;background:var(--berry-wash);font-size:12.5px;color:var(--berry-deep);font-weight:600}
.grupo-bloco .cartao{border:none;border-top:1px solid var(--line);border-radius:0;border-left:none}
.acoes-rapidas{display:flex;flex-wrap:wrap;gap:7px;padding:10px 2px 2px}
.acoes-rapidas .chip{min-height:40px}
/* ---- faixas, toast, vazio ---- */
.faixa{display:flex;gap:9px;align-items:flex-start;border:1px solid;border-radius:7px;
  padding:10px 13px;font-size:13.5px;line-height:1.45;margin:10px 0}
.faixa.amb{border-color:var(--warn);background:var(--warn-wash);color:var(--warn)}
.faixa.verm{border-color:var(--crit);background:var(--crit-wash);color:var(--crit)}
.faixa.cinza{border-color:var(--line-strong);background:var(--surface-2);color:var(--ink-2)}
.faixa.verde{border-color:var(--good);background:var(--good-wash);color:var(--good)}
.faixa .faixa-acoes{margin-left:auto;display:flex;gap:10px;flex:0 0 auto}
.faixa .faixa-acoes button{font-weight:700;text-decoration:underline;color:inherit}
.conflito{margin:2px 0 2px 46px;font-size:12.5px;border-radius:6px;padding:6px 10px;border:1px dashed}
.conflito.impossivel{color:var(--crit);border-color:var(--crit);background:var(--crit-wash)}
.conflito.apertado{color:var(--warn);border-color:var(--warn);background:var(--warn-wash)}
.conflito.verificar{color:var(--muted);border-color:var(--line-strong);background:var(--surface-2)}
.toast{position:fixed;left:12px;right:12px;z-index:92;
  bottom:calc(var(--nav-h) + 14px + var(--teclado,0px));
  background:var(--good-wash);border:1px solid var(--good);color:var(--good);
  border-radius:9px;padding:12px 15px;font-size:14px;box-shadow:var(--shadow);display:flex;gap:10px;align-items:center}
.toast.amb{background:var(--warn-wash);border-color:var(--warn);color:var(--warn)}
.toast button{font-weight:700;text-decoration:underline;color:inherit;margin-left:auto}
.toast{left:calc(var(--trilho) + 24px);right:auto;bottom:24px;max-width:420px}
@media (max-width:759.98px){.toast{left:12px;right:12px;
  bottom:calc(var(--nav-h) + 14px + var(--teclado,0px));max-width:none}}
.vazio{padding:26px 4px;text-align:left}
.vazio h2{font-size:22px;color:var(--ink-2);margin:0 0 4px}
/* ---- formulários ---- */
.campo{margin:13px 0}
.campo label{display:block;font-size:12.5px;font-weight:700;color:var(--ink-2);margin-bottom:5px}
.campo input[type=text],.campo input[type=tel],.campo input[type=date],.campo input[type=time],
.campo input[type=number],.campo select{
  width:100%;background:var(--ground);border:1px solid var(--line-strong);border-radius:7px;
  padding:11px 12px;min-height:46px;font-size:16px;   /* <16px faz o iOS dar zoom ao focar */
  -webkit-appearance:none;appearance:none}
.campo .ajuda{font-size:12px;color:var(--muted);margin-top:4px}
.campo.erro input{border-color:var(--crit)}
.campo.erro .ajuda{color:var(--crit)}
.linha2{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.dinheiro{position:relative}
.dinheiro span{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--muted);font-size:14px}
.dinheiro input{padding-left:38px !important;text-align:right;font-family:var(--fonte-mono)}
.interruptor{display:flex;align-items:center;gap:10px;min-height:44px}
.interruptor .tri{width:46px;height:27px;border-radius:99px;background:var(--line-strong);position:relative;flex:0 0 auto;transition:background .15s}
.interruptor .tri::after{content:"";position:absolute;top:3px;left:3px;width:21px;height:21px;border-radius:99px;background:#fff;transition:left .15s}
.interruptor.on .tri{background:var(--good)}
.interruptor.on .tri::after{left:22px}
/* ---- botões ---- */
.botao{display:flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:12px 18px;
  border-radius:9px;background:var(--berry);color:#fff;font-weight:700;font-size:16.5px;width:100%}
.botao:disabled{opacity:.5}
.botao.fantasma{background:none;border:1px solid var(--line-strong);color:var(--ink)}
.botao.perigo{background:none;border:none;color:var(--crit);font-weight:600;min-height:44px}
.botao.mini{width:auto;min-height:40px;padding:8px 14px;font-size:14px;border-radius:8px}
.rodape-fixo{position:fixed;left:0;right:0;z-index:45;background:var(--surface);
  bottom:var(--teclado,0px);              /* iOS: sobe com o teclado, não fica escondido */
  border-top:1px solid var(--line);padding:10px clamp(14px,4vw,24px) calc(10px + env(safe-area-inset-bottom,0px));
  display:flex;gap:14px;align-items:center;transition:bottom .18s ease-out}
@media (prefers-reduced-motion:reduce){.rodape-fixo{transition:none}}
.rodape-fixo .total{flex:0 0 auto}
.rodape-fixo .total small{display:block;font-size:11px;color:var(--muted)}
.rodape-fixo .total b{font-family:var(--fonte-display);font-size:22px;font-weight:600}
.rodape-fixo{left:var(--trilho)}
/* ---- folha inferior ---- */
/* ---- a pilha, de baixo para cima (a janela mudou tudo em 30/08) ----
   A janela de tela cheia (`.janela-tela`, z-index 76) nasceu depois destes
   números e passou por cima de dois avisos que existiam para ser lidos:

     folha (75)  o "Guardar rascunho / Descartar" do Esc aparecia LAVADO atrás
                 do formulário, com os botões inalcançáveis;
     toast (60)  a explicação de por que a aba não avança nunca era vista, o
                 que fazia a aba parecer morta.

   Ordem agora: janela 76 · véu do perfil 78 · balão 80 · véu da folha 84 ·
   folha 86 · toast 92. O toast é o último a falar, sempre. */
.veu{position:fixed;inset:0;background:rgba(20,12,18,.45);z-index:84}
/* o véu da janela é o mesmo pano, do outro lado dela */
.veu.veu-janela{z-index:74}
.folha{position:fixed;left:0;right:0;bottom:var(--teclado,0px);z-index:86;background:var(--surface);
  border-radius:16px 16px 0 0;padding:16px 18px calc(18px + env(safe-area-inset-bottom,0px));
  box-shadow:var(--shadow);max-height:82vh;overflow-y:auto;-webkit-overflow-scrolling:touch}
.folha h3{font-size:17px;margin-bottom:12px}
/* O CAMPO DE UMA FOLHA. Ele estava no markup desde a folha de texto ("editar à
   mão o valor do trajeto") e NÃO TINHA CSS NENHUM: input cru, sem borda, sem
   fundo e sem os 16px que impedem o iOS de dar zoom ao focar. Passou anos porque
   nenhuma folha com campo estava na auditoria — a do tempo real (F0.27) entrou e
   a primeira coisa que o auditor disse foi "classe sem CSS: .campo-folha".
   Mesma forma do `.campo input` dos formulários: dois campos com a mesma função
   e desenhos diferentes é a tela dizendo que são coisas diferentes. */
.folha .campo-folha{width:100%;background:var(--ground);border:1px solid var(--line-strong);
  border-radius:7px;padding:11px 12px;min-height:46px;font-size:16px;margin:5px 0 11px;
  -webkit-appearance:none;appearance:none}
.folha .opcoes{display:flex;flex-direction:column;gap:8px}
.folha .opcoes button{display:flex;gap:12px;align-items:center;min-height:52px;padding:10px 12px;
  border:1px solid var(--line);border-radius:9px;background:var(--ground);font-size:16px;font-weight:600;text-align:left}
.folha{left:50%;right:auto;bottom:50%;transform:translate(-50%,50%);width:420px;
  border-radius:var(--raio);max-height:78vh}
@media (max-width:759.98px){.folha{left:0;right:0;bottom:var(--teclado,0px);
  transform:none;width:auto;border-radius:16px 16px 0 0;max-height:82vh}}
/* ---- cartões de número ---- */
.numeros{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:1px;
  background:var(--line);border:1px solid var(--line);border-radius:7px;overflow:hidden;margin:14px 0}
.numeros .nc{background:var(--surface);padding:13px 14px}
.numeros .nc b{font-family:var(--fonte-display);font-size:22px;font-weight:600;display:block;line-height:1.15}
.numeros .nc span{font-size:12px;color:var(--ink-2);display:block;margin-top:3px;line-height:1.35}
.rodape-info{margin-top:26px;padding-top:12px;border-top:1px solid var(--line);
  font-family:var(--fonte-mono);font-size:11px;color:var(--muted);line-height:1.6}
.folha .opcoes .badge{font-style:normal;font-family:var(--fonte-mono);font-size:11px;
  font-weight:700;background:var(--berry);color:#fff;padding:2px 8px;border-radius:99px;margin-left:auto}
.acoes-min{display:flex;gap:6px;flex:0 0 auto}
/* ---- o véu desfoca o fundo ----
   Era um preto a 45% e nada mais: a tela atrás continuava nítida e competia com
   a janela pela leitura. O desfoque separa os dois planos sem escurecer mais. */
.veu{-webkit-backdrop-filter:blur(9px) saturate(80%);backdrop-filter:blur(9px) saturate(80%)}
/* ---- janela (ficha de rascunho) ---- */
/* A folha padrão é vidro de 7% — dentro de um véu desfocado ela some, e a grade
   do calendário atravessa a janela. Janela é janela: fundo próprio. */
.folha.janela{width:440px;padding:0;overflow:hidden;
  background:var(--tinta-ui);border:1px solid var(--line-strong)}
.folha.janela .ficha-topo{padding:20px 22px 16px;border-bottom:1px solid var(--line)}
.folha.janela .ficha-topo h3{margin:0 0 5px;font-size:20px}
.folha.janela .ficha-topo small{font:600 11px/1 var(--fonte-mono);letter-spacing:.08em;
  text-transform:uppercase;color:var(--brass)}
.folha.janela .ficha-linhas{padding:6px 22px 12px}
.folha.janela .ficha-linhas > div{display:flex;align-items:baseline;gap:14px;
  padding:9px 0;border-bottom:1px solid var(--line)}
.folha.janela .ficha-linhas > div:last-child{border-bottom:none}
.folha.janela .ficha-linhas span{flex:0 0 96px;font:600 11px/1.2 var(--fonte-mono);
  letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.folha.janela .ficha-linhas b{flex:1;min-width:0;font-size:14.5px;font-weight:700;color:var(--ink)}
.folha.janela .ficha-linhas .vazio b{color:var(--warn);font-weight:600}
.folha.janela .ficha-falta,.folha.janela .ficha-ok{margin:0 22px 16px;padding:11px 13px;
  border-radius:10px;font-size:13px;line-height:1.45}
.folha.janela .ficha-falta{background:var(--warn-wash);border:1px solid var(--warn);color:var(--warn)}
.folha.janela .ficha-ok{background:var(--good-wash);border:1px solid var(--good);color:var(--good)}
.folha.janela .opcoes{padding:0 22px 20px}
/* Tintas derivadas da tinta do tema — funcionam no escuro E no claro,
   porque --ink já é trocado pelo tema. Nunca usar rgba(255,255,255,...) direto. */
:root{
  --ink-78:color-mix(in srgb,var(--ink) 78%,transparent);
  --ink-70:color-mix(in srgb,var(--ink) 70%,transparent);
  --ink-55:color-mix(in srgb,var(--ink) 55%,transparent);
  --ink-50:color-mix(in srgb,var(--ink) 50%,transparent);
  --ink-45:color-mix(in srgb,var(--ink) 45%,transparent);
  --ink-42:color-mix(in srgb,var(--ink) 42%,transparent);
  --ink-40:color-mix(in srgb,var(--ink) 40%,transparent);
  --ink-35:color-mix(in srgb,var(--ink) 35%,transparent);
  --ink-30:color-mix(in srgb,var(--ink) 30%,transparent);
}
/* ============================================================================
   Desktop exatamente como o canvas de alta fidelidade (design/#1b).
   Medidas, raios, sombras e tipos vieram do arquivo, não de estimativa.
   ============================================================================ */
:root{
  --vidro-bg:rgba(255,255,255,.07);
  --vidro-borda:rgba(255,255,255,.15);
  --vidro-sombra:inset 0 1px 0 rgba(255,255,255,.42),
                 inset 0 -1px 0 rgba(255,255,255,.06),
                 0 26px 60px -30px rgba(0,0,0,.8);
}
@media (prefers-color-scheme: light){
  :root:not([data-tema]):not([data-theme]){
    --vidro-bg:rgba(255,255,255,.62); --vidro-borda:rgba(23,17,28,.10);
    --vidro-sombra:inset 0 1px 0 rgba(255,255,255,.9), 0 18px 40px -26px rgba(23,17,28,.45);
  }
}
:root[data-tema="claro"],
:root[data-theme="light"]:not([data-tema]){
  --vidro-bg:rgba(255,255,255,.62); --vidro-borda:rgba(23,17,28,.10);
  --vidro-sombra:inset 0 1px 0 rgba(255,255,255,.9), 0 18px 40px -26px rgba(23,17,28,.45);
}
/* ---- conteúdo ---- */
.tela{padding:26px 32px 30px 6px;max-width:none}
.tela.painel,.tela.tela-form{max-width:1360px}
/* ---- cabeçalho com seletor segmentado ---- */
.painel-topo{display:flex;align-items:flex-end;gap:20px}
.painel-topo .eyebrow{font:700 10.5px/1 var(--fonte-mono);letter-spacing:.18em;
  text-transform:uppercase;color:var(--muted);margin-bottom:9px}
.segmentado button.sel{background:var(--ink);color:var(--ground);font-weight:800;
  box-shadow:0 6px 18px -6px rgba(0,0,0,.6)}
/* ---- cartões de vidro ---- */
.cartao-vidro{background:var(--vidro-bg);border:1px solid var(--vidro-borda);
  border-radius:26px;padding:26px 28px;box-shadow:var(--vidro-sombra);margin:0}
/* ---- KPI ---- */
.kpi-topo{display:flex;align-items:flex-start;gap:26px}
/* ---- série: área com linha, contratado tracejado ---- */
.serie-area{margin-top:22px}
/* ---- serviços com barra de proporção ---- */
.servicos{display:flex;flex-direction:column;gap:14px}
/* ============ Painel · cartão do KPI (canvas 1b) ============ */
.painel-grade .col-b{flex:0 0 352px;display:flex;flex-direction:column;gap:18px}
.kpi-valor .eyebrow{font:700 10.5px/1 var(--fonte-mono);letter-spacing:.18em;
  text-transform:uppercase;color:var(--ink-45)}
/* ---- série de 13 meses ---- */
.serie-area{margin-top:22px}
/* ---- serviços com barra de proporção ---- */
.servicos{display:flex;flex-direction:column;gap:14px;margin-top:14px}
/* ---- meta do mês ---- */
.cartao-vidro.meta .rotulo-secao.alerta{color:var(--brass-2)}
/* ---- a receber: anel de composição ---- */
.cartao-vidro.receber{padding:24px}
/* ---- hoje em campo ---- */
.cartao-vidro.campo b.num{display:block;font-family:var(--fonte-display);font-weight:800;
  font-size:30px;line-height:1;letter-spacing:-.03em;margin:10px 0 14px}
.cartao-vidro.campo .linhas{display:flex;flex-direction:column;gap:9px}
.cartao-vidro.campo .linhas>div{display:flex;align-items:baseline;gap:11px}
.cartao-vidro.campo .linhas span{flex:1;font:600 12.5px/1.3 var(--fonte-texto);color:var(--ink-70)}
.cartao-vidro.campo .linhas b{font:700 13.5px/1 var(--fonte-mono);color:var(--ink)}
.cartao-vidro.campo .btn-fantasma{width:100%;margin-top:16px}
@media (max-width:759.98px){
  .tela{padding:18px clamp(14px,4vw,24px) 28px}
  /* cabeçalho da série empilha em vez de espremer três blocos numa linha */
  .serie-area .cab{display:block}
}
/* GERADO por scripts/extrair-design.py - nao editar a mao.
   Uma classe por declaracao do canvas de alta fidelidade, e SO para as
   pranchetas em uso (lista EM_USO no script).
   Trocar um valor aqui muda a tela; o certo e mudar o canvas e rodar de novo. */
.ai-baseline{align-items:baseline}
.ai-center{align-items:center}
.ai-flex-end{align-items:flex-end}
.ai-flex-start{align-items:flex-start}
.ai-stretch{align-items:stretch}
.align-self-center{align-self:center}
.align-self-flex-end{align-self:flex-end}
.align-self-flex-start{align-self:flex-start}
.bd-011b69{border:1px solid rgba(255,255,255,.24)}
.bd-01e59a{border:1.5px dashed rgba(255,174,26,.5)}
.bd-03ee34{border:1px solid rgba(255,255,255,.2)}
.bd-05a5bf{border:1px dashed rgba(255,174,26,.5)}
.bd-0709ea{border:1px dashed rgba(255,174,26,.45)}
.bd-1-5px-solid-ff4d8d{border:1.5px solid #FF4D8D}
.bd-1-5px-solid-ffae1a{border:1.5px solid #FFAE1A}
.bd-14068c{border:1px solid rgba(143,227,166,.4)}
.bd-1e5dc4{border:1px dashed rgba(255,174,26,.4)}
.bd-1f094d{border:1px solid rgba(255,255,255,.14)}
.bd-1px-dashed-ff4d8d{border:1px dashed #FF4D8D}
.bd-1px-solid-0-217-163-35{border:1px solid rgba(0,217,163,.35)}
.bd-1px-solid-0-217-163-4{border:1px solid rgba(0,217,163,.4)}
.bd-1px-solid-255-174-26-3{border:1px solid rgba(255,174,26,.3)}
.bd-1px-solid-255-174-26-4{border:1px solid rgba(255,174,26,.4)}
.bd-1px-solid-255-174-26-5{border:1px solid rgba(255,174,26,.5)}
.bd-1px-solid-255-174-26-6{border:1px solid rgba(255,174,26,.6)}
.bd-1px-solid-255-77-141-4{border:1px solid rgba(255,77,141,.4)}
.bd-1px-solid-255-77-141-5{border:1px solid rgba(255,77,141,.5)}
.bd-1px-solid-ff4d8d{border:1px solid #FF4D8D}
.bd-20eac9{border:2px solid rgba(255,255,255,.3)}
.bd-2138a0{border:1.5px solid rgba(139,107,255,.45)}
.bd-2715f8{border:1.5px solid rgba(255,77,141,.5)}
.bd-39e5ef{border:1px dashed rgba(255,255,255,.24)}
.bd-3eddf0{border:1px solid rgba(255,255,255,.22)}
.bd-40666c{border:1px solid rgba(255,255,255,.1)}
.bd-470cf3{border:1px dashed rgba(255,255,255,.18)}
.bd-4f9517{border:1px solid rgba(255,174,26,.38)}
.bd-58486f{border:1px solid rgba(255,255,255,.15)}
.bd-5acc6c{border:1px solid rgba(255,174,26,.42)}
.bd-5b0d4f{border:1px solid rgba(255,255,255,.06)}
.bd-5bf476{border:2px solid rgba(255,255,255,.42)}
.bd-5d9354{border:1px solid rgba(255,255,255,.18)}
.bd-5fbcab{border:1px solid rgba(255,255,255,.13)}
.bd-61e2e0{border:1px solid rgba(255,174,26,.32)}
.bd-628670{border:1.5px solid rgba(255,77,141,.45)}
.bd-6501d6{border:1px dashed rgba(255,255,255,.26)}
.bd-77c7d8{border:1px solid rgba(255,174,26,.55)}
.bd-7a461d{border:1px solid rgba(255,255,255,.17)}
.bd-7c740a{border:1px solid rgba(255,77,141,.45)}
.bd-7d8cf7{border:1.5px solid rgba(143,227,166,.45)}
.bd-8b69c0{border:1px dashed rgba(255,255,255,.3)}
.bd-92104c{border:1px solid rgba(255,174,26,.36)}
.bd-94c98b{border:1px solid rgba(255,255,255,.09)}
.bd-9a2f7a{border:1.5px solid rgba(143,227,166,.42)}
.bd-adcf4d{border:1.5px solid rgba(255,174,26,.5)}
.bd-b1c3e0{border:1px dashed rgba(255,255,255,.2)}
.bd-b2c18b{border:1.5px solid rgba(255,174,26,.42)}
.bd-c1aa86{border:1px dashed rgba(255,255,255,.16)}
.bd-c6dea5{border:1.5px solid rgba(255,174,26,.45)}
.bd-cb40cf{border:1px dashed rgba(255,174,26,.42)}
.bd-cbf034{border:1px solid rgba(255,174,26,.34)}
.bd-cdf567{border:1px solid rgba(255,77,141,.55)}
.bd-cefdca{border:1px solid rgba(255,255,255,.11)}
.bd-cf6fb3{border:1px dashed rgba(255,255,255,.22)}
.bd-d2ebd1{border:1.5px dashed rgba(198,180,255,.5)}
.bd-d4908c{border:1px solid rgba(255,255,255,.12)}
.bd-dd5d0b{border:1px solid rgba(255,255,255,.16)}
.bd-de5b9a{border:1px solid rgba(139,107,255,.4)}
.bd-e20b34{border:1px solid rgba(143,227,166,.36)}
.bd-eec3ba{border:1px solid rgba(139,107,255,.36)}
.bd-fc130f{border:1px solid rgba(255,77,141,.42)}
.bf-blur-20px{backdrop-filter:blur(20px)}
.bf-blur-24px{backdrop-filter:blur(24px)}
.bf-blur-26px{backdrop-filter:blur(26px)}
.bf-blur-26px-saturate-170{backdrop-filter:blur(26px) saturate(170%)}
.bf-blur-30px-saturate-175{backdrop-filter:blur(30px) saturate(175%)}
.bf-blur-32px-saturate-180{backdrop-filter:blur(32px) saturate(180%)}
.bf-blur-34px-saturate-180{backdrop-filter:blur(34px) saturate(180%)}
.bg-0-217-163-14{background:rgba(0,217,163,.14)}
.bg-00d9a3{background:#00D9A3}
.bg-02856f{background:linear-gradient(100deg, rgba(255,174,26,.14), transparent 60%)}
.bg-0e0a12{background:#0E0A12}
.bg-0f46d7{background:linear-gradient(180deg,#C7B4FF,rgba(198,180,255,.3))}
.bg-139-107-255-13{background:rgba(139,107,255,.13)}
.bg-139-107-255-14{background:rgba(139,107,255,.14)}
.bg-14-10-18-42{background:rgba(14,10,18,.42)}
.bg-14-10-18-5{background:rgba(14,10,18,.5)}
.bg-14-10-18-55{background:rgba(14,10,18,.55)}
.bg-14-10-18-62{background:rgba(14,10,18,.62)}
.bg-143-227-166-1{background:rgba(143,227,166,.1)}
.bg-143-227-166-13{background:rgba(143,227,166,.13)}
.bg-143-227-166-14{background:rgba(143,227,166,.14)}
.bg-156e1f{background:linear-gradient(150deg,rgba(198,180,255,.45),rgba(255,158,196,.35))}
.bg-255-174-26-08{background:rgba(255,174,26,.08)}
.bg-255-174-26-09{background:rgba(255,174,26,.09)}
.bg-255-174-26-1{background:rgba(255,174,26,.1)}
.bg-255-174-26-13{background:rgba(255,174,26,.13)}
.bg-255-174-26-14{background:rgba(255,174,26,.14)}
.bg-255-174-26-15{background:rgba(255,174,26,.15)}
.bg-255-174-26-16{background:rgba(255,174,26,.16)}
.bg-255-174-26-4{background:rgba(255,174,26,.4)}
.bg-255-174-26-6{background:rgba(255,174,26,.6)}
.bg-255-255-255-04{background:rgba(255,255,255,.04)}
.bg-255-255-255-05{background:rgba(255,255,255,.05)}
.bg-255-255-255-06{background:rgba(255,255,255,.06)}
.bg-255-255-255-07{background:rgba(255,255,255,.07)}
.bg-255-255-255-08{background:rgba(255,255,255,.08)}
.bg-255-255-255-09{background:rgba(255,255,255,.09)}
.bg-255-255-255-1{background:rgba(255,255,255,.1)}
.bg-255-255-255-13{background:rgba(255,255,255,.13)}
.bg-255-255-255-14{background:rgba(255,255,255,.14)}
.bg-255-255-255-16{background:rgba(255,255,255,.16)}
.bg-255-255-255-22{background:rgba(255,255,255,.22)}
.bg-255-255-255-26{background:rgba(255,255,255,.26)}
.bg-255-255-255-34{background:rgba(255,255,255,.34)}
.bg-255-255-255-4{background:rgba(255,255,255,.4)}
.bg-255-255-255-45{background:rgba(255,255,255,.45)}
.bg-255-255-255-6{background:rgba(255,255,255,.6)}
.bg-255-77-141-1{background:rgba(255,77,141,.1)}
.bg-255-77-141-12{background:rgba(255,77,141,.12)}
.bg-255-77-141-14{background:rgba(255,77,141,.14)}
.bg-255-77-141-16{background:rgba(255,77,141,.16)}
.bg-255-77-141-2{background:rgba(255,77,141,.2)}
.bg-255-77-141-55{background:rgba(255,77,141,.55)}
.bg-255-77-141-7{background:rgba(255,77,141,.7)}
.bg-259e9f{background:radial-gradient(120% 90% at 50% 0%, transparent 34%, rgba(14,10,18,.82) 100%)}
.bg-285272{background:radial-gradient(120% 90% at 50% 0%, transparent 40%, rgba(14,10,18,.84) 100%)}
.bg-3146e1{background:linear-gradient(90deg,#8B6BFF,#C7B4FF)}
.bg-3364ba{background:linear-gradient(160deg, rgba(255,77,141,.6), rgba(139,107,255,.3))}
.bg-36aabb{background:linear-gradient(100deg, rgba(255,77,141,.26), rgba(255,77,141,.1))}
.bg-40957f{background:linear-gradient(120deg, rgba(255,77,141,.3), rgba(255,77,141,.1))}
.bg-48c902{background:linear-gradient(150deg,rgba(255,158,196,.5),rgba(139,107,255,.4))}
.bg-4a6d30{background:linear-gradient(150deg, rgba(255,77,141,.5), rgba(255,77,141,.24))}
.bg-51f725{background:radial-gradient(120% 90% at 50% 0%, transparent 38%, rgba(14,10,18,.82) 100%)}
.bg-5d5034{background:linear-gradient(90deg,#FF4D8D,#FF8AB4)}
.bg-603bde{background:linear-gradient(100deg, rgba(255,77,141,.2), transparent 70%)}
.bg-651ee2{background:linear-gradient(100deg, rgba(255,174,26,.16), transparent 70%)}
.bg-671d10{background:radial-gradient(120% 90% at 50% 0%, transparent 36%, rgba(14,10,18,.78) 100%)}
.bg-7a2509{background:radial-gradient(120% 90% at 50% 0%, transparent 38%, rgba(14,10,18,.76) 100%)}
.bg-7b8ed4{background:linear-gradient(155deg, rgba(0,217,163,.2), rgba(139,107,255,.12))}
.bg-8b6bff{background:#8B6BFF}
.bg-8ba868{background:linear-gradient(150deg,rgba(139,107,255,.45),rgba(255,174,26,.3))}
.bg-8fe3a6{background:#8FE3A6}
.bg-933b8e{background:linear-gradient(180deg,#8B6BFF,rgba(139,107,255,.35))}
.bg-936d27{background:linear-gradient(155deg, rgba(255,77,141,.2), rgba(139,107,255,.14))}
.bg-a0c938{background:linear-gradient(120deg, rgba(255,77,141,.28), rgba(255,77,141,.1))}
.bg-a792c6{background:linear-gradient(100deg, rgba(255,77,141,.14), transparent 70%)}
.bg-b6ca2b{background:radial-gradient(120% 90% at 50% 0%, transparent 40%, rgba(14,10,18,.72) 100%)}
.bg-b6ea16{background:linear-gradient(180deg,#FF4D8D,rgba(255,77,141,.35))}
.bg-b8c21e{background:radial-gradient(120% 100% at 50% 0%, transparent 34%, rgba(14,10,18,.8) 100%)}
.bg-b9b7b8{background:linear-gradient(150deg,rgba(255,174,26,.45),rgba(255,77,141,.35))}
.bg-bce091{background:radial-gradient(120% 90% at 50% 0%, transparent 34%, rgba(14,10,18,.8) 100%)}
.bg-c1785c{background:linear-gradient(100deg, rgba(255,77,141,.3), rgba(255,77,141,.12))}
.bg-c7a0e8{background:#C7A0E8}
.bg-c7b4ff{background:#C7B4FF}
.bg-cdd63a{background:linear-gradient(155deg, rgba(255,77,141,.22), rgba(139,107,255,.14))}
.bg-ce5012{background:linear-gradient(90deg,#00D9A3,#6BE8C6)}
.bg-d14d2c{background:radial-gradient(120% 90% at 50% 0%, transparent 38%, rgba(14,10,18,.8) 100%)}
.bg-d91092{background:linear-gradient(150deg, rgba(255,77,141,.32), rgba(139,107,255,.2))}
.bg-dd7d0b{background:linear-gradient(150deg,#FF4D8D,#8B6BFF)}
.bg-e377b9{background:radial-gradient(110% 80% at 50% 10%, transparent 24%, rgba(14,10,18,.86) 100%)}
.bg-e7cd12{background:linear-gradient(90deg,#8B6BFF,#B6A0FF)}
.bg-eae919{background:linear-gradient(100deg, rgba(255,77,141,.28), rgba(255,77,141,.08))}
.bg-f14772{background:radial-gradient(120% 90% at 50% 0%, transparent 34%, rgba(14,10,18,.78) 100%)}
.bg-f3eeea{background:#F3EEEA}
.bg-ff4d8d{background:#FF4D8D}
.bg-ffae1a{background:#FFAE1A}
.bg-fff{background:#fff}
.border-bottom-1e3365{border-bottom:1px solid rgba(255,255,255,.07)}
.border-bottom-39ace8{border-bottom:1px solid rgba(255,255,255,.14)}
.border-bottom-5271a9{border-bottom:1px solid rgba(255,255,255,.06)}
.border-bottom-7017b9{border-bottom:1px solid rgba(255,255,255,.1)}
.border-bottom-800b0f{border-bottom:1px solid rgba(255,255,255,.08)}
.border-bottom-8e5161{border-bottom:1px solid rgba(255,255,255,.09)}
.border-bottom-bc5581{border-bottom:1px solid rgba(255,255,255,.12)}
.border-left-0f273e{border-left:3px solid rgba(255,255,255,.34)}
.border-left-3px-solid-ff4d8d{border-left:3px solid #FF4D8D}
.border-left-a1a4fd{border-left:3px solid rgba(255,255,255,.24)}
.border-left-e770a0{border-left:3px solid rgba(255,255,255,.3)}
.border-top-0e39f6{border-top:1px solid rgba(255,255,255,.12)}
.border-top-457116{border-top:1px solid rgba(255,255,255,.16)}
.border-top-4b4632{border-top:1px solid rgba(255,255,255,.14)}
.border-top-69333e{border-top:1px solid rgba(255,255,255,.1)}
.border-top-a1d66c{border-top:1px solid rgba(255,255,255,.08)}
.border-top-color-fff{border-top-color:#fff}
.border-top-ffefac{border-top:1px solid rgba(255,255,255,.13)}
.border-top-none{border-top:none}
.bottom-6px{bottom:-6px}
.c-00d9a3{color:#00D9A3}
.c-0e0a12{color:#0E0A12}
.c-17111c{color:#17111C}
.c-23-17-28-55{color:rgba(23,17,28,.55)}
.c-255-255-255-2{color:rgba(255,255,255,.2)}
.c-255-255-255-3{color:rgba(255,255,255,.3)}
.c-255-255-255-32{color:rgba(255,255,255,.32)}
.c-255-255-255-34{color:rgba(255,255,255,.34)}
.c-255-255-255-35{color:rgba(255,255,255,.35)}
.c-255-255-255-38{color:rgba(255,255,255,.38)}
.c-255-255-255-4{color:rgba(255,255,255,.4)}
.c-255-255-255-42{color:rgba(255,255,255,.42)}
.c-255-255-255-44{color:rgba(255,255,255,.44)}
.c-255-255-255-45{color:rgba(255,255,255,.45)}
.c-255-255-255-48{color:rgba(255,255,255,.48)}
.c-255-255-255-5{color:rgba(255,255,255,.5)}
.c-255-255-255-55{color:rgba(255,255,255,.55)}
.c-255-255-255-58{color:rgba(255,255,255,.58)}
.c-255-255-255-6{color:rgba(255,255,255,.6)}
.c-255-255-255-62{color:rgba(255,255,255,.62)}
.c-255-255-255-65{color:rgba(255,255,255,.65)}
.c-255-255-255-7{color:rgba(255,255,255,.7)}
.c-255-255-255-72{color:rgba(255,255,255,.72)}
.c-255-255-255-75{color:rgba(255,255,255,.75)}
.c-255-255-255-78{color:rgba(255,255,255,.78)}
.c-255-255-255-8{color:rgba(255,255,255,.8)}
.c-255-255-255-82{color:rgba(255,255,255,.82)}
.c-255-255-255-85{color:rgba(255,255,255,.85)}
.c-255-255-255-9{color:rgba(255,255,255,.9)}
.c-7df0ce{color:#7DF0CE}
.c-8fe3a6{color:#8FE3A6}
.c-c7b4ff{color:#C7B4FF}
.c-ff4d8d{color:#FF4D8D}
.c-ff9ec4{color:#FF9EC4}
.c-ffc257{color:#FFC257}
.c-fff{color:#fff}
.cursor-pointer{cursor:pointer}
.d-block{display:block}
.d-flex{display:flex}
.d-grid{display:grid}
.d-inline-block{display:inline-block}
.d-inline-flex{display:inline-flex}
.f-002067{font:600 11.5px/1.3 Manrope,sans-serif}
.f-008541{font:700 16px/1 Manrope,sans-serif}
.f-017ff5{font:800 13px/1.2 Manrope,sans-serif}
.f-023230{font:600 10.5px/1.4 'JetBrains Mono',monospace}
.f-03c360{font:800 15px/1 'JetBrains Mono',monospace}
.f-045398{font:800 14px/1 'JetBrains Mono',monospace}
.f-097310{font:600 11px/1 'JetBrains Mono',monospace}
.f-09fb19{font:500 11px/1.45 Manrope,sans-serif}
.f-0d6da9{font:700 13.5px/1.4 Manrope,sans-serif}
.f-0db3a2{font:700 11.5px/1.4 Manrope,sans-serif}
.f-0e45e2{font:500 11.5px/1.45 Manrope,sans-serif}
.f-0ff6d6{font:800 12.5px/1 'JetBrains Mono',monospace}
.f-11a315{font:500 11.5px/1.55 Manrope,sans-serif}
.f-130967{font:700 11px/1 Manrope,sans-serif}
.f-133f42{font:400 10.5px/1.5 'JetBrains Mono',monospace}
.f-1b8af1{font:600 13px/1 'JetBrains Mono',monospace}
.f-1bb6b0{font:700 10px/1 'JetBrains Mono',monospace}
.f-1e8cbe{font:800 17px/1 'JetBrains Mono',monospace}
.f-1f0322{font:800 18px/1.2 Manrope,sans-serif}
.f-1f1bfe{font:600 10px/1 'JetBrains Mono',monospace}
.f-1f8d82{font:800 11.5px/1 Manrope,sans-serif}
.f-213050{font:800 11px/1.25 Manrope,sans-serif}
.f-21688e{font:800 19px/1 Manrope,sans-serif}
.f-22813d{font:500 12.5px/1.55 Manrope,sans-serif}
.f-237e1a{font:600 12px/1 Manrope,sans-serif}
.f-249997{font:700 13px/1.3 'JetBrains Mono',monospace}
.f-24c0a0{font:600 12.5px/1.3 Manrope,sans-serif}
.f-260ea2{font:700 12.5px/1.3 Manrope,sans-serif}
.f-26cbe6{font:700 9px/1 'JetBrains Mono',monospace}
.f-28457b{font:700 13px/1 Manrope,sans-serif}
.f-29aa3d{font:700 11.5px/1.3 Manrope,sans-serif}
.f-29b78e{font:600 13.5px/1.5 Manrope,sans-serif}
.f-2a3da3{font:800 10.5px/1 Manrope,sans-serif}
.f-2a4070{font:500 10.5px/1.2 Manrope,sans-serif}
.f-2c10fb{font:600 13px/1.45 Manrope,sans-serif}
.f-2d22ba{font:800 14px/1.2 Manrope,sans-serif}
.f-2f2465{font:800 12.5px/1.35 Manrope,sans-serif}
.f-3075d9{font:600 11px/1.3 'JetBrains Mono',monospace}
.f-314b22{font:600 11px/1.4 Manrope,sans-serif}
.f-31510f{font:800 22px/1 'JetBrains Mono',monospace}
.f-383f0c{font:800 12px/1 'JetBrains Mono',monospace}
.f-3ae5cc{font:600 12.5px/1 'JetBrains Mono',monospace}
.f-3c0ad7{font:600 10.5px/1 'JetBrains Mono',monospace}
.f-3c2ca3{font:500 11.5px/1 Manrope,sans-serif}
.f-3d2ffd{font:600 12.5px/1.35 Manrope,sans-serif}
.f-3d9bea{font:500 10.5px/1 Manrope,sans-serif}
.f-3dd350{font:800 15px/1.2 Manrope,sans-serif}
.f-3e8e2b{font:600 12.5px/1.6 Manrope,sans-serif}
.f-3eba6d{font:500 12px/1.45 Manrope,sans-serif}
.f-432beb{font:500 11.5px/1.4 Manrope,sans-serif}
.f-435c5e{font:700 13.5px/1 'JetBrains Mono',monospace}
.f-441aee{font:800 12px/1.2 Manrope,sans-serif}
.f-448a5c{font:700 12.5px/1.2 Manrope,sans-serif}
.f-454ce5{font:700 12.5px/1 Manrope,sans-serif}
.f-4b348c{font:700 10.5px/1.4 'JetBrains Mono',monospace}
.f-4b6156{font:500 12.5px/1.5 Manrope,sans-serif}
.f-4d076c{font:800 13.5px/1 'JetBrains Mono',monospace}
.f-4d65dc{font:500 13px/1.55 Manrope,sans-serif}
.f-4e32f4{font:600 9.5px/1.3 'JetBrains Mono',monospace}
.f-4e9703{font:800 13px/1 Manrope,sans-serif}
.f-51fc30{font:700 11.5px/1 'JetBrains Mono',monospace}
.f-53f6b6{font:800 10.5px/1 'JetBrains Mono',monospace}
.f-55d6c4{font:600 12px/1.4 Manrope,sans-serif}
.f-569b66{font:800 9px/1 'JetBrains Mono',monospace}
.f-56e770{font:500 11.5px/1.5 Manrope,sans-serif}
.f-579dc2{font:800 22px/1 Manrope,sans-serif}
.f-581a6d{font:700 10.5px/1.3 'JetBrains Mono',monospace}
.f-586b46{font:800 18px/1.25 Manrope,sans-serif}
.f-59bf71{font:700 22px/1 'JetBrains Mono',monospace}
.f-6205e9{font:700 15px/1 'JetBrains Mono',monospace}
.f-6205ea{font:600 12.5px/1.4 Manrope,sans-serif}
.f-6252d2{font:800 16px/1 'JetBrains Mono',monospace}
.f-626a03{font:600 11.5px/1 'JetBrains Mono',monospace}
.f-647eeb{font:800 14px/1 Manrope,sans-serif}
.f-665783{font:800 15px/1.35 Manrope,sans-serif}
.f-6682cf{font:800 21px/1 'JetBrains Mono',monospace}
.f-6854ef{font:700 12.5px/1.5 Manrope,sans-serif}
.f-73e8a0{font:700 12.5px/1.35 Manrope,sans-serif}
.f-74a313{font:800 8.5px/1 'JetBrains Mono',monospace}
.f-762082{font:600 15px/1 Manrope,sans-serif}
.f-7dd1b3{font:600 12px/1.45 Manrope,sans-serif}
.f-7f9bb4{font:800 12px/1 Manrope,sans-serif}
.f-823117{font:700 10px/1.2 Manrope,sans-serif}
.f-834be8{font:700 17px/1 Manrope,sans-serif}
.f-8378dd{font:800 24px/1 Manrope,sans-serif}
.f-852a52{font:500 11.5px/1.6 Manrope,sans-serif}
.f-86131a{font:600 12px/1.3 Manrope,sans-serif}
.f-866560{font:500 11px/1 Manrope,sans-serif}
.f-86877d{font:800 13px/1.3 'JetBrains Mono',monospace}
.f-877956{font:700 14.5px/1.2 Manrope,sans-serif}
.f-8926b2{font:600 12px/1 'JetBrains Mono',monospace}
.f-894036{font:600 12.5px/1 Manrope,sans-serif}
.f-8990a0{font:800 13px/1.3 Manrope,sans-serif}
.f-89f49f{font:500 11.5px/1.3 Manrope,sans-serif}
.f-8b43f9{font:500 11px/1.3 Manrope,sans-serif}
.f-8ba13a{font:800 16px/1.3 Manrope,sans-serif}
.f-8d5daf{font:800 15px/1 Manrope,sans-serif}
.f-901922{font:700 14px/1 'JetBrains Mono',monospace}
.f-916e82{font:800 19px/1 'JetBrains Mono',monospace}
.f-92c018{font:700 9.5px/1.2 Manrope,sans-serif}
.f-934c3a{font:600 16px/1 Manrope,sans-serif}
.f-946264{font:800 12.5px/1 Manrope,sans-serif}
.f-94b02a{font:700 14px/1.2 Manrope,sans-serif}
.f-985c66{font:700 12.5px/1 'JetBrains Mono',monospace}
.f-9b1369{font:800 10px/1 'JetBrains Mono',monospace}
.f-9b9515{font:700 13px/1 'JetBrains Mono',monospace}
.f-9d0852{font:500 12px/1 Manrope,sans-serif}
.f-9d2407{font:700 10.5px/1 'JetBrains Mono',monospace}
.f-9d5010{font:800 17px/1.2 Manrope,sans-serif}
.f-9e5827{font:700 13px/1.3 Manrope,sans-serif}
.f-a1503d{font:700 9.5px/1 'JetBrains Mono',monospace}
.f-a165fd{font:600 10.5px/1 Manrope,sans-serif}
.f-a34132{font:600 12px/1.6 Manrope,sans-serif}
.f-a3b95f{font:800 11.5px/1 'JetBrains Mono',monospace}
.f-a4d648{font:300 27px/1 Manrope,sans-serif}
.f-a517bb{font:800 22px/1.2 Manrope,sans-serif}
.f-a5bcf3{font:600 13px/1.3 Manrope,sans-serif}
.f-a6a9e3{font:600 11.5px/1.5 Manrope,sans-serif}
.f-a76845{font:700 12px/1 Manrope,sans-serif}
.f-a8fd47{font:700 13px/1.35 Manrope,sans-serif}
.f-a8ffc9{font:800 13.5px/1.2 Manrope,sans-serif}
.f-aa0c04{font:700 14px/1 Manrope,sans-serif}
.f-ae5bdc{font:800 18px/1 Manrope,sans-serif}
.f-b06bea{font:700 11px/1.4 'JetBrains Mono',monospace}
.f-b0fcc9{font:600 12.5px/1.5 Manrope,sans-serif}
.f-b6358c{font:400 20px/1 Manrope,sans-serif}
.f-b8c764{font:600 13px/1.5 Manrope,sans-serif}
.f-b8f6fb{font:600 13px/1.4 Manrope,sans-serif}
.f-b95dbe{font:700 16px/1 'JetBrains Mono',monospace}
.f-b9608f{font:600 12px/1.5 Manrope,sans-serif}
.f-b9f5cc{font:800 18px/1 'JetBrains Mono',monospace}
.f-baa562{font:500 12px/1.4 Manrope,sans-serif}
.f-bb81af{font:800 11px/1 Manrope,sans-serif}
.f-bc52a2{font:800 20px/1 'JetBrains Mono',monospace}
.f-be3615{font:500 13px/1.65 Manrope,sans-serif}
.f-bf0d82{font:600 11.5px/1.4 'JetBrains Mono',monospace}
.f-bf4409{font:500 12.5px/1.3 Manrope,sans-serif}
.f-c00401{font:800 18px/1.2 'JetBrains Mono',monospace}
.f-c0d3dd{font:600 11.5px/1.4 Manrope,sans-serif}
.f-c2d7ee{font:700 12px/1 'JetBrains Mono',monospace}
.f-c5b72c{font:800 14px/1.45 Manrope,sans-serif}
.f-c843dc{font:500 11.5px/1.35 Manrope,sans-serif}
.f-caf333{font:800 13px/1 'JetBrains Mono',monospace}
.f-cb45da{font:700 11px/1 'JetBrains Mono',monospace}
.f-cc1052{font:700 15px/1.5 Manrope,sans-serif}
.f-cd4eac{font:800 16px/1 Manrope,sans-serif}
.f-cda9a3{font:500 13.5px/1 Manrope,sans-serif}
.f-cdafac{font:700 13.5px/1 Manrope,sans-serif}
.f-cddec2{font:500 13px/1 Manrope,sans-serif}
.f-cdf146{font:500 11px/1.4 Manrope,sans-serif}
.f-cea319{font:600 11.5px/1 Manrope,sans-serif}
.f-d03238{font:600 12px/1.35 Manrope,sans-serif}
.f-d0de89{font:500 11px/1.5 Manrope,sans-serif}
.f-d0f156{font:600 12px/1.55 Manrope,sans-serif}
.f-d104b0{font:700 11.5px/1 Manrope,sans-serif}
.f-d3004e{font:800 24px/1 'JetBrains Mono',monospace}
.f-d37cba{font:600 11px/1 Manrope,sans-serif}
.f-d46818{font:700 11px/1.4 Manrope,sans-serif}
.f-d4c089{font:800 19px/1.1 Manrope,sans-serif}
.f-d56af0{font:500 12.5px/1.4 Manrope,sans-serif}
.f-d91bd3{font:800 12.5px/1.4 Manrope,sans-serif}
.f-d9461d{font:600 9.5px/1 'JetBrains Mono',monospace}
.f-dc972a{font:600 13px/1 Manrope,sans-serif}
.f-dd5655{font:500 10.5px/1 'JetBrains Mono',monospace}
.f-ddff7e{font:800 11px/1.4 'JetBrains Mono',monospace}
.f-e072c6{font:700 14.5px/1.3 Manrope,sans-serif}
.f-e0c9f9{font:600 11.5px/1.55 Manrope,sans-serif}
.f-e269d2{font:500 10.5px/1.3 Manrope,sans-serif}
.f-e4ea6f{font:500 13.5px/1.5 Manrope,sans-serif}
.f-e72619{font:800 13.5px/1 Manrope,sans-serif}
.f-e8de04{font:800 16px/1.2 Manrope,sans-serif}
.f-e92e8f{font:600 13.5px/1.45 Manrope,sans-serif}
.f-ebad86{font:600 14.5px/1 Manrope,sans-serif}
.f-ebecdc{font:500 12.5px/1 Manrope,sans-serif}
.f-ee5358{font:800 12px/1.45 Manrope,sans-serif}
.f-ee6b29{font:600 11.5px/1.45 Manrope,sans-serif}
.f-f07854{font:800 9.5px/1 'JetBrains Mono',monospace}
.f-f1630f{font:500 14.5px/1.5 Manrope,sans-serif}
.f-f58faa{font:700 15px/1.3 Manrope,sans-serif}
.f-f89f29{font:800 26px/1 'JetBrains Mono',monospace}
.f-f8abd5{font:800 11px/1 'JetBrains Mono',monospace}
.f-fad3a9{font:700 13px/1.4 Manrope,sans-serif}
.f-fe3e91{font:800 20px/1 Manrope,sans-serif}
.f-ff7021{font:500 12px/1.5 Manrope,sans-serif}
.fd-column{flex-direction:column}
.ff-483e42{font-family:'Bricolage Grotesque',Manrope,sans-serif}
.flex-wrap-wrap{flex-wrap:wrap}
.float-right{float:right}
.fs-10-5px{font-size:10.5px}
.fs-11-5px{font-size:11.5px}
.fs-13px{font-size:13px}
.fs-15px{font-size:15px}
.fs-26px{font-size:26px}
.fs-28px{font-size:28px}
.fs-30px{font-size:30px}
.fs-32px{font-size:32px}
.fs-34px{font-size:34px}
.fs-36px{font-size:36px}
.fs-38px{font-size:38px}
.fs-40px{font-size:40px}
.fs-42px{font-size:42px}
.fs-44px{font-size:44px}
.fs-46px{font-size:46px}
.fs-76px{font-size:76px}
.fst-normal{font-style:normal}
.fw-400{font-weight:400}
.fw-500{font-weight:500}
.fw-700{font-weight:700}
.fw-800{font-weight:800}
.fx-1{flex:1}
.fx-200{flex:200}
.fx-223{flex:223}
.fx-300{flex:300}
.fx-323{flex:323}
.fx-363{flex:363}
.fx-410{flex:410}
.fx-none{flex:none}
.g-0{gap:0}
.g-10px{gap:10px}
.g-11px{gap:11px}
.g-12px{gap:12px}
.g-13px{gap:13px}
.g-14px{gap:14px}
.g-15px{gap:15px}
.g-16px{gap:16px}
.g-18px{gap:18px}
.g-20px{gap:20px}
.g-22px{gap:22px}
.g-24px{gap:24px}
.g-26px{gap:26px}
.g-2px{gap:2px}
.g-30px{gap:30px}
.g-34px{gap:34px}
.g-3px{gap:3px}
.g-4px{gap:4px}
.g-5px{gap:5px}
.g-6px{gap:6px}
.g-7px{gap:7px}
.g-8px{gap:8px}
.g-9px{gap:9px}
.grid-auto-rows-1fr{grid-auto-rows:1fr}
.grid-column-span-2{grid-column:span 2}
.grid-template-rows-repeat-7-1fr{grid-template-rows:repeat(7,1fr)}
.gtc-1fr-1fr{grid-template-columns:1fr 1fr}
.gtc-1fr-1fr-1fr{grid-template-columns:1fr 1fr 1fr}
.gtc-2ad435{grid-template-columns:1.6fr 80px 130px 110px 80px}
.gtc-3d26b4{grid-template-columns:74px 2fr 1fr 110px 92px}
.gtc-4ae68e{grid-template-columns:1.5fr .8fr .8fr 1fr .9fr .9fr 1fr}
.gtc-ae7652{grid-template-columns:74px 1.4fr 1.6fr 108px 118px 160px}
.gtc-b1c774{grid-template-columns:88px 1.15fr 1.5fr 1.5fr 76px 150px}
.gtc-repeat-7-1fr{grid-template-columns:repeat(7,1fr)}
.h-100{height:100%}
.h-104px{height:104px}
.h-10px{height:10px}
.h-11{height:11%}
.h-11px{height:11px}
.h-12px{height:12px}
.h-14{height:14%}
.h-15px{height:15px}
.h-16{height:16%}
.h-16px{height:16px}
.h-172px{height:172px}
.h-18px{height:18px}
.h-1px{height:1px}
.h-200px{height:200px}
.h-20px{height:20px}
.h-22px{height:22px}
.h-24px{height:24px}
.h-26{height:26%}
.h-26px{height:26px}
.h-30{height:30%}
.h-30px{height:30px}
.h-32px{height:32px}
.h-34px{height:34px}
.h-35{height:35%}
.h-38px{height:38px}
.h-3px{height:3px}
.h-40{height:40%}
.h-43{height:43%}
.h-44{height:44%}
.h-44px{height:44px}
.h-46{height:46%}
.h-47{height:47%}
.h-48{height:48%}
.h-48px{height:48px}
.h-50{height:50%}
.h-52{height:52%}
.h-52px{height:52px}
.h-56{height:56%}
.h-56px{height:56px}
.h-58px{height:58px}
.h-5px{height:5px}
.h-62{height:62%}
.h-72{height:72%}
.h-74{height:74%}
.h-7px{height:7px}
.h-8{height:8%}
.h-8px{height:8px}
.h-96px{height:96px}
.h-9px{height:9px}
.inset-0{inset:0}
.inset-4px{inset:-4px}
.jc-center{justify-content:center}
.jc-flex-end{justify-content:flex-end}
.jc-space-between{justify-content:space-between}
.left-0{left:0}
.left-2px{left:2px}
.lh-1{line-height:1}
.lh-1-02{line-height:1.02}
.lh-1-04{line-height:1.04}
.lh-1-05{line-height:1.05}
.lh-1-1{line-height:1.1}
.lh-1-15{line-height:1.15}
.lh-94{line-height:.94}
.ls-0{letter-spacing:0}
.ls-02em{letter-spacing:-.02em}
.ls-035em{letter-spacing:-.035em}
.ls-03em{letter-spacing:-.03em}
.ls-06em{letter-spacing:.06em}
.ls-11em{letter-spacing:.11em}
.ls-12em{letter-spacing:.12em}
.ls-13em{letter-spacing:.13em}
.ls-14em{letter-spacing:.14em}
.ls-16em{letter-spacing:.16em}
.ls-18em{letter-spacing:.18em}
.ls-1em{letter-spacing:.1em}
.m-0-8px{margin:0 -8px}
.m-0-auto{margin:0 auto}
.max-height-hdark{max-height:{{ hDark }}}
.maxw-20ch{max-width:20ch}
.maxw-32ch{max-width:32ch}
.maxw-36ch{max-width:36ch}
.maxw-38ch{max-width:38ch}
.maxw-46ch{max-width:46ch}
.mb-10px{margin-bottom:10px}
.mb-11px{margin-bottom:11px}
.mb-12px{margin-bottom:12px}
.mb-13px{margin-bottom:13px}
.mb-14px{margin-bottom:14px}
.mb-15px{margin-bottom:15px}
.mb-16px{margin-bottom:16px}
.mb-18px{margin-bottom:18px}
.mb-4px{margin-bottom:4px}
.mb-5px{margin-bottom:5px}
.mb-6px{margin-bottom:6px}
.mb-8px{margin-bottom:8px}
.mb-9px{margin-bottom:9px}
.minh-0{min-height:0}
.minw-0{min-width:0}
.ml-34px{margin-left:34px}
.ml-auto{margin-left:auto}
.mr-10px{margin-right:10px}
.mt-10px{margin-top:10px}
.mt-11px{margin-top:11px}
.mt-12px{margin-top:12px}
.mt-13px{margin-top:13px}
.mt-14px{margin-top:14px}
.mt-15px{margin-top:15px}
.mt-16px{margin-top:16px}
.mt-18px{margin-top:18px}
.mt-20px{margin-top:20px}
.mt-22px{margin-top:22px}
.mt-24px{margin-top:24px}
.mt-26px{margin-top:26px}
.mt-2px{margin-top:2px}
.mt-30px{margin-top:30px}
.mt-3px{margin-top:3px}
.mt-4px{margin-top:4px}
.mt-5px{margin-top:5px}
.mt-6px{margin-top:6px}
.mt-7px{margin-top:7px}
.mt-8px{margin-top:8px}
.mt-9px{margin-top:9px}
.mt-auto{margin-top:auto}
.o-45{opacity:.45}
.o-5{opacity:.5}
.o-55{opacity:.55}
.o-6{opacity:.6}
.o-62{opacity:.62}
.o-7{opacity:.7}
.o-odark{opacity:{{ oDark }}}
.ov-hidden{overflow:hidden}
.ov-visible{overflow:visible}
.p-0-15px{padding:0 15px}
.p-0-6px-2px{padding:0 6px 2px}
.p-10px-0{padding:10px 0}
.p-10px-12px{padding:10px 12px}
.p-10px-13px{padding:10px 13px}
.p-10px-14px{padding:10px 14px}
.p-10px-16px{padding:10px 16px}
.p-10px-17px{padding:10px 17px}
.p-10px-18px{padding:10px 18px}
.p-10px-20px{padding:10px 20px}
.p-11px{padding:11px}
.p-11px-0{padding:11px 0}
.p-11px-14px{padding:11px 14px}
.p-11px-15px{padding:11px 15px}
.p-11px-16px{padding:11px 16px}
.p-11px-17px{padding:11px 17px}
.p-11px-18px{padding:11px 18px}
.p-11px-19px{padding:11px 19px}
.p-11px-20px{padding:11px 20px}
.p-12px{padding:12px}
.p-12px-14px{padding:12px 14px}
.p-12px-15px{padding:12px 15px}
.p-12px-18px{padding:12px 18px}
.p-12px-20px{padding:12px 20px}
.p-12px-22px{padding:12px 22px}
.p-13px{padding:13px}
.p-13px-0{padding:13px 0}
.p-13px-0-6px{padding:13px 0 6px}
.p-13px-15px{padding:13px 15px}
.p-13px-16px{padding:13px 16px}
.p-13px-17px{padding:13px 17px}
.p-13px-18px{padding:13px 18px}
.p-13px-20px{padding:13px 20px}
.p-13px-22px{padding:13px 22px}
.p-13px-24px{padding:13px 24px}
.p-13px-26px{padding:13px 26px}
.p-14px{padding:14px}
.p-14px-0{padding:14px 0}
.p-14px-15px-6px{padding:14px 15px 6px}
.p-14px-16px{padding:14px 16px}
.p-14px-17px{padding:14px 17px}
.p-14px-18px{padding:14px 18px}
.p-14px-20px{padding:14px 20px}
.p-14px-22px{padding:14px 22px}
.p-14px-24px{padding:14px 24px}
.p-14px-30px{padding:14px 30px}
.p-15px-0{padding:15px 0}
.p-15px-16px{padding:15px 16px}
.p-15px-17px{padding:15px 17px}
.p-15px-18px{padding:15px 18px}
.p-15px-20px{padding:15px 20px}
.p-15px-22px{padding:15px 22px}
.p-15px-26px{padding:15px 26px}
.p-16px-0{padding:16px 0}
.p-16px-18px{padding:16px 18px}
.p-16px-40px{padding:16px 40px}
.p-17px-20px{padding:17px 20px}
.p-18px{padding:18px}
.p-18px-20px{padding:18px 20px}
.p-18px-22px{padding:18px 22px}
.p-19px{padding:19px}
.p-20px{padding:20px}
.p-20px-22px{padding:20px 22px}
.p-22px{padding:22px}
.p-22px-0{padding:22px 0}
.p-22px-24px{padding:22px 24px}
.p-24px{padding:24px}
.p-24px-26px{padding:24px 26px}
.p-24px-32px-26px-6px{padding:24px 32px 26px 6px}
.p-26px-28px{padding:26px 28px}
.p-26px-32px-26px-6px{padding:26px 32px 26px 6px}
.p-26px-32px-30px-6px{padding:26px 32px 30px 6px}
.p-26px-6px-0{padding:26px 6px 0}
.p-2px{padding:2px}
.p-30px-32px{padding:30px 32px}
.p-30px-36px{padding:30px 36px}
.p-32px{padding:32px}
.p-32px-36px{padding:32px 36px}
.p-34px-36px{padding:34px 36px}
.p-3px-6px{padding:3px 6px}
.p-42px-44px{padding:42px 44px}
.p-46px-48px{padding:46px 48px}
.p-48px{padding:48px}
.p-4px-10px{padding:4px 10px}
.p-4px-11px{padding:4px 11px}
.p-4px-14px{padding:4px 14px}
.p-4px-7px{padding:4px 7px}
.p-4px-8px-0-0{padding:4px 8px 0 0}
.p-4px-9px{padding:4px 9px}
.p-5px{padding:5px}
.p-5px-10px{padding:5px 10px}
.p-5px-11px{padding:5px 11px}
.p-5px-12px{padding:5px 12px}
.p-5px-7px{padding:5px 7px}
.p-60px{padding:60px}
.p-6px{padding:6px}
.p-6px-0{padding:6px 0}
.p-6px-11px{padding:6px 11px}
.p-6px-12px{padding:6px 12px}
.p-6px-9px{padding:6px 9px}
.p-7px-0{padding:7px 0}
.p-7px-12px{padding:7px 12px}
.p-7px-13px{padding:7px 13px}
.p-7px-14px{padding:7px 14px}
.p-7px-8px{padding:7px 8px}
.p-7px-8px-7px-14px{padding:7px 8px 7px 14px}
.p-8px-0{padding:8px 0}
.p-8px-12px{padding:8px 12px}
.p-8px-13px{padding:8px 13px}
.p-8px-14px{padding:8px 14px}
.p-8px-15px{padding:8px 15px}
.p-8px-16px{padding:8px 16px}
.p-8px-9px{padding:8px 9px}
.p-9px{padding:9px}
.p-9px-0{padding:9px 0}
.p-9px-11px{padding:9px 11px}
.p-9px-14px{padding:9px 14px}
.p-9px-15px{padding:9px 15px}
.p-9px-16px{padding:9px 16px}
.p-9px-17px{padding:9px 17px}
.p-9px-18px{padding:9px 18px}
.p-9px-20px-9px-10px{padding:9px 20px 9px 10px}
.padding-bottom-10px{padding-bottom:10px}
.padding-bottom-11px{padding-bottom:11px}
.padding-bottom-12px{padding-bottom:12px}
.padding-bottom-14px{padding-bottom:14px}
.padding-bottom-34px{padding-bottom:34px}
.padding-bottom-9px{padding-bottom:9px}
.padding-left-52px{padding-left:52px}
.padding-left-8px{padding-left:8px}
.padding-right-8px{padding-right:8px}
.padding-top-10px{padding-top:10px}
.padding-top-11px{padding-top:11px}
.padding-top-12px{padding-top:12px}
.padding-top-13px{padding-top:13px}
.padding-top-14px{padding-top:14px}
.padding-top-15px{padding-top:15px}
.padding-top-16px{padding-top:16px}
.padding-top-18px{padding-top:18px}
.padding-top-20px{padding-top:20px}
.padding-top-22px{padding-top:22px}
.padding-top-24px{padding-top:24px}
.padding-top-6px{padding-top:6px}
.pos-absolute{position:absolute}
.pos-relative{position:relative}
.r-0-0-16px-16px{border-radius:0 0 16px 16px}
.r-10px{border-radius:10px}
.r-11px{border-radius:11px}
.r-12px{border-radius:12px}
.r-12px-12px-6px-6px{border-radius:12px 12px 6px 6px}
.r-13px{border-radius:13px}
.r-14px{border-radius:14px}
.r-14px-14px-6px-6px{border-radius:14px 14px 6px 6px}
.r-15px{border-radius:15px}
.r-16px{border-radius:16px}
.r-16px-16px-0-0{border-radius:16px 16px 0 0}
.r-16px-16px-6px-6px{border-radius:16px 16px 6px 6px}
.r-18px{border-radius:18px}
.r-19px{border-radius:19px}
.r-20px{border-radius:20px}
.r-22px{border-radius:22px}
.r-24px{border-radius:24px}
.r-26px{border-radius:26px}
.r-2px{border-radius:2px}
.r-30px{border-radius:30px}
.r-32px{border-radius:32px}
.r-3px{border-radius:3px}
.r-4px{border-radius:4px}
.r-5px{border-radius:5px}
.r-6px{border-radius:6px}
.r-7px{border-radius:7px}
.r-8px{border-radius:8px}
.r-999px{border-radius:999px}
.r-99px{border-radius:99px}
.r-9px{border-radius:9px}
.right-0{right:0}
.right-2px{right:2px}
.right-3px{right:3px}
.right-6px{right:6px}
.sh-0-6px-18px-6px-0-0-0-6{box-shadow:0 6px 18px -6px rgba(0,0,0,.6)}
.sh-0-8px-20px-8px-0-0-0-6{box-shadow:0 8px 20px -8px rgba(0,0,0,.6)}
.sh-037ed9{box-shadow:0 12px 28px -10px rgba(143,227,166,.7)}
.sh-09e8f1{box-shadow:0 10px 26px -8px rgba(255,77,141,.8)}
.sh-12b263{box-shadow:0 8px 22px -6px rgba(255,77,141,.9)}
.sh-1c6aec{box-shadow:inset 0 1px 0 rgba(255,255,255,.48), 0 26px 60px -30px rgba(0,0,0,.8)}
.sh-20249a{box-shadow:0 8px 20px -8px rgba(255,77,141,.9)}
.sh-252689{box-shadow:0 10px 24px -8px rgba(139,107,255,.8)}
.sh-27796a{box-shadow:0 0 0 2px rgba(255,255,255,.9), 0 8px 20px -8px rgba(255,77,141,.9)}
.sh-321b51{box-shadow:inset 0 1px 0 rgba(255,255,255,.46), 0 30px 70px -32px rgba(0,0,0,.85)}
.sh-33cdb6{box-shadow:inset 0 1px 0 rgba(255,255,255,.34), 0 26px 60px -30px rgba(0,0,0,.8)}
.sh-372d96{box-shadow:inset 0 1px 0 rgba(255,255,255,.38)}
.sh-38611f{box-shadow:inset 0 1px 0 rgba(255,255,255,.42), 0 26px 60px -30px rgba(0,0,0,.8)}
.sh-397541{box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}
.sh-41024c{box-shadow:0 12px 30px -8px rgba(255,77,141,.9)}
.sh-48f1ce{box-shadow:inset 0 1px 0 rgba(255,255,255,.36)}
.sh-4ccb72{box-shadow:0 6px 16px -4px rgba(0,217,163,.8)}
.sh-59cf2a{box-shadow:0 12px 28px -10px rgba(255,174,26,.8)}
.sh-62d6e6{box-shadow:0 16px 36px -10px rgba(255,77,141,.9)}
.sh-677c18{box-shadow:0 10px 26px -8px rgba(255,77,141,.9)}
.sh-796021{box-shadow:0 14px 32px -10px rgba(0,0,0,.7)}
.sh-7d02db{box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 10px 26px -8px rgba(255,77,141,.6)}
.sh-7d2328{box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 26px 60px -30px rgba(0,0,0,.85), 0 0 0 4px rgba(255,77,141,.1)}
.sh-7d8e80{box-shadow:inset 0 1px 0 rgba(255,255,255,.34)}
.sh-82b82d{box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}
.sh-8378b0{box-shadow:0 14px 34px -10px rgba(255,77,141,.9), inset 0 1px 0 rgba(255,255,255,.5)}
.sh-88185f{box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 12px 30px -10px rgba(255,77,141,.7)}
.sh-8b7fe3{box-shadow:0 14px 32px -10px rgba(255,77,141,.9)}
.sh-8ff78d{box-shadow:inset 0 1px 0 rgba(255,255,255,.42), inset 0 -1px 0 rgba(255,255,255,.06), 0 26px 60px -30px rgba(0,0,0,.8)}
.sh-9261fe{box-shadow:0 0 0 4px rgba(255,174,26,.25)}
.sh-964bc2{box-shadow:0 0 0 3px rgba(255,174,26,.28)}
.sh-a17cdd{box-shadow:inset 0 1px 0 rgba(255,255,255,.45)}
.sh-a1962d{box-shadow:0 20px 40px -18px rgba(255,77,141,.7)}
.sh-a5481a{box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 40px 90px -40px rgba(0,0,0,.9)}
.sh-a5a689{box-shadow:0 4px 14px -4px rgba(255,77,141,.9)}
.sh-b08d5f{box-shadow:0 8px 22px -8px rgba(255,174,26,.8)}
.sh-b135a9{box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 26px 60px -30px rgba(0,0,0,.85), 0 0 0 4px rgba(255,174,26,.08)}
.sh-b9832b{box-shadow:0 12px 30px -8px rgba(0,0,0,.8)}
.sh-c38c05{box-shadow:0 10px 24px -8px rgba(255,174,26,.8)}
.sh-d464a0{box-shadow:0 12px 28px -10px rgba(255,77,141,.9)}
.sh-e4d22c{box-shadow:0 8px 20px -6px rgba(255,77,141,.9)}
.sh-e7e4c0{box-shadow:0 20px 44px -16px rgba(0,0,0,.7)}
.sh-e8d197{box-shadow:0 14px 32px -12px rgba(143,227,166,.7)}
.sh-ea101b{box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 26px 60px -30px rgba(0,0,0,.8)}
.sh-eb9d6a{box-shadow:inset 0 1px 0 rgba(255,255,255,.42)}
.sh-f301d7{box-shadow:inset 0 1px 0 rgba(255,255,255,.5), 0 40px 90px -34px rgba(0,0,0,.9)}
.sh-f7c834{box-shadow:0 16px 36px -12px rgba(255,77,141,.9)}
.sh-fbf67f{box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 26px 60px -30px rgba(0,0,0,.85)}
.ta-center{text-align:center}
.ta-right{text-align:right}
.td-line-through{text-decoration:line-through}
.td-underline{text-decoration:underline}
.text-decoration-color-255-255-255-2{text-decoration-color:rgba(255,255,255,.2)}
.top-23{top:23%}
.top-36{top:36%}
.top-3px{top:3px}
.top-4{top:4%}
.top-4px{top:-4px}
.top-64{top:64%}
.top-6px{top:6px}
.top-71{top:71%}
.transform-chevrondark{transform:{{ chevronDark }}}
.transform-rotate-90deg{transform:rotate(-90deg)}
.transition-e0b88d{transition:transform .42s cubic-bezier(.2,.9,.2,1)}
.transition-e9292a{transition:max-height .42s cubic-bezier(.2,.9,.2,1), opacity .3s ease .09s}
.tt-uppercase{text-transform:uppercase}
.w-1-4{width:1.4%}
.w-100{width:100%}
.w-104px{width:104px}
.w-106px{width:106px}
.w-10px{width:10px}
.w-112px{width:112px}
.w-11px{width:11px}
.w-12{width:12%}
.w-130px{width:130px}
.w-140px{width:140px}
.w-150px{width:150px}
.w-15px{width:15px}
.w-160px{width:160px}
.w-16px{width:16px}
.w-180px{width:180px}
.w-186px{width:186px}
.w-18px{width:18px}
.w-2{width:2%}
.w-200px{width:200px}
.w-20px{width:20px}
.w-210px{width:210px}
.w-220px{width:220px}
.w-230px{width:230px}
.w-24{width:24%}
.w-24px{width:24px}
.w-25{width:25%}
.w-250px{width:250px}
.w-26px{width:26px}
.w-300px{width:300px}
.w-30px{width:30px}
.w-32px{width:32px}
.w-330px{width:330px}
.w-340px{width:340px}
.w-34px{width:34px}
.w-352px{width:352px}
.w-360px{width:360px}
.w-372px{width:372px}
.w-38px{width:38px}
.w-390px{width:390px}
.w-400px{width:400px}
.w-40px{width:40px}
.w-420px{width:420px}
.w-43{width:43%}
.w-430px{width:430px}
.w-440px{width:440px}
.w-44px{width:44px}
.w-46px{width:46px}
.w-470px{width:470px}
.w-48px{width:48px}
.w-520px{width:520px}
.w-52px{width:52px}
.w-560px{width:560px}
.w-56px{width:56px}
.w-58px{width:58px}
.w-600px{width:600px}
.w-60px{width:60px}
.w-62{width:62%}
.w-62px{width:62px}
.w-640px{width:640px}
.w-64px{width:64px}
.w-66px{width:66px}
.w-70px{width:70px}
.w-72px{width:72px}
.w-75{width:75%}
.w-76px{width:76px}
.w-78px{width:78px}
.w-7px{width:7px}
.w-800px{width:800px}
.w-820px{width:820px}
.w-82px{width:82px}
.w-86px{width:86px}
.w-880px{width:880px}
.w-8px{width:8px}
.w-90px{width:90px}
.w-94{width:94%}
.w-96{width:96%}
.w-9px{width:9px}
.wbf-blur-20px{-webkit-backdrop-filter:blur(20px)}
.wbf-blur-24px{-webkit-backdrop-filter:blur(24px)}
.wbf-blur-26px{-webkit-backdrop-filter:blur(26px)}
.wbf-blur-26px-saturate-170{-webkit-backdrop-filter:blur(26px) saturate(170%)}
.wbf-blur-30px-saturate-175{-webkit-backdrop-filter:blur(30px) saturate(175%)}
.wbf-blur-32px-saturate-180{-webkit-backdrop-filter:blur(32px) saturate(180%)}
.wbf-blur-34px-saturate-180{-webkit-backdrop-filter:blur(34px) saturate(180%)}
.word-break-break-all{word-break:break-all}
/* ============================================================================
   TEMA CLARO DO CANVAS — GERADO. Não editar à mão.
     python3 scripts/tema-claro.py

   O canvas foi desenhado no escuro e as classes atômicas assam a tinta literal,
   então trocar os tokens do 00-tokens.css não alcança nada aqui. Este arquivo
   traduz cada valor do 95-canvas.css para o claro, mantendo a INTENÇÃO: véu de
   contraste continua sendo véu de contraste, só troca de lado.

   Quem manda no tema: o runtime do artifact escreve `data-theme` na raiz
   seguindo o claude.ai. A escolha da Central mora em `data-tema`, que é nosso.
   Por isso cada bloco aparece três vezes — escolha da pessoa, carimbo do host,
   preferência do sistema (ver 00-tokens.css).
   ============================================================================ */
@media (prefers-color-scheme: light){
  :root:not([data-tema]):not([data-theme]) .bd-011b69{border:1px solid rgba(23,17,28,0.192)}
  :root:not([data-tema]):not([data-theme]) .bd-03ee34{border:1px solid rgba(23,17,28,0.16)}
  :root:not([data-tema]):not([data-theme]) .bd-1f094d{border:1px solid rgba(23,17,28,0.112)}
  :root:not([data-tema]):not([data-theme]) .bd-20eac9{border:2px solid rgba(23,17,28,0.24)}
  :root:not([data-tema]):not([data-theme]) .bd-39e5ef{border:1px dashed rgba(23,17,28,0.192)}
  :root:not([data-tema]):not([data-theme]) .bd-3eddf0{border:1px solid rgba(23,17,28,0.176)}
  :root:not([data-tema]):not([data-theme]) .bd-40666c{border:1px solid rgba(23,17,28,0.08)}
  :root:not([data-tema]):not([data-theme]) .bd-470cf3{border:1px dashed rgba(23,17,28,0.144)}
  :root:not([data-tema]):not([data-theme]) .bd-58486f{border:1px solid rgba(23,17,28,0.12)}
  :root:not([data-tema]):not([data-theme]) .bd-5b0d4f{border:1px solid rgba(23,17,28,0.048)}
  :root:not([data-tema]):not([data-theme]) .bd-5bf476{border:2px solid rgba(23,17,28,0.336)}
  :root:not([data-tema]):not([data-theme]) .bd-5d9354{border:1px solid rgba(23,17,28,0.144)}
  :root:not([data-tema]):not([data-theme]) .bd-5fbcab{border:1px solid rgba(23,17,28,0.104)}
  :root:not([data-tema]):not([data-theme]) .bd-6501d6{border:1px dashed rgba(23,17,28,0.208)}
  :root:not([data-tema]):not([data-theme]) .bd-7a461d{border:1px solid rgba(23,17,28,0.136)}
  :root:not([data-tema]):not([data-theme]) .bd-8b69c0{border:1px dashed rgba(23,17,28,0.24)}
  :root:not([data-tema]):not([data-theme]) .bd-94c98b{border:1px solid rgba(23,17,28,0.072)}
  :root:not([data-tema]):not([data-theme]) .bd-b1c3e0{border:1px dashed rgba(23,17,28,0.16)}
  :root:not([data-tema]):not([data-theme]) .bd-c1aa86{border:1px dashed rgba(23,17,28,0.128)}
  :root:not([data-tema]):not([data-theme]) .bd-cefdca{border:1px solid rgba(23,17,28,0.088)}
  :root:not([data-tema]):not([data-theme]) .bd-cf6fb3{border:1px dashed rgba(23,17,28,0.176)}
  :root:not([data-tema]):not([data-theme]) .bd-d4908c{border:1px solid rgba(23,17,28,0.096)}
  :root:not([data-tema]):not([data-theme]) .bd-dd5d0b{border:1px solid rgba(23,17,28,0.128)}
  :root:not([data-tema]):not([data-theme]) .bg-02856f{background:linear-gradient(100deg, rgba(255,174,26,.14), transparent 60%)}
  :root:not([data-tema]):not([data-theme]) .bg-0f46d7{background:linear-gradient(180deg,#C7B4FF,rgba(198,180,255,.3))}
  :root:not([data-tema]):not([data-theme]) .bg-156e1f{background:linear-gradient(150deg,rgba(198,180,255,.45),rgba(255,158,196,.35))}
  :root:not([data-tema]):not([data-theme]) .bg-255-255-255-04{background:rgba(23,17,28,0.038)}
  :root:not([data-tema]):not([data-theme]) .bg-255-255-255-05{background:rgba(23,17,28,0.048)}
  :root:not([data-tema]):not([data-theme]) .bg-255-255-255-06{background:rgba(23,17,28,0.057)}
  :root:not([data-tema]):not([data-theme]) .bg-255-255-255-07{background:rgba(23,17,28,0.067)}
  :root:not([data-tema]):not([data-theme]) .bg-255-255-255-08{background:rgba(23,17,28,0.076)}
  :root:not([data-tema]):not([data-theme]) .bg-255-255-255-09{background:rgba(23,17,28,0.085)}
  :root:not([data-tema]):not([data-theme]) .bg-255-255-255-1{background:rgba(23,17,28,0.095)}
  :root:not([data-tema]):not([data-theme]) .bg-255-255-255-13{background:rgba(23,17,28,0.123)}
  :root:not([data-tema]):not([data-theme]) .bg-255-255-255-14{background:rgba(23,17,28,0.133)}
  :root:not([data-tema]):not([data-theme]) .bg-255-255-255-16{background:rgba(23,17,28,0.152)}
  :root:not([data-tema]):not([data-theme]) .bg-255-255-255-22{background:rgba(23,17,28,0.209)}
  :root:not([data-tema]):not([data-theme]) .bg-255-255-255-26{background:rgba(23,17,28,0.247)}
  :root:not([data-tema]):not([data-theme]) .bg-255-255-255-34{background:rgba(23,17,28,0.323)}
  :root:not([data-tema]):not([data-theme]) .bg-255-255-255-4{background:rgba(23,17,28,0.38)}
  :root:not([data-tema]):not([data-theme]) .bg-255-255-255-45{background:rgba(23,17,28,0.427)}
  :root:not([data-tema]):not([data-theme]) .bg-255-255-255-6{background:rgba(23,17,28,0.57)}
  :root:not([data-tema]):not([data-theme]) .bg-259e9f{background:radial-gradient(120% 90% at 50% 0%, transparent 34%, rgba(23,17,28,0.074) 100%)}
  :root:not([data-tema]):not([data-theme]) .bg-285272{background:radial-gradient(120% 90% at 50% 0%, transparent 40%, rgba(23,17,28,0.076) 100%)}
  :root:not([data-tema]):not([data-theme]) .bg-3146e1{background:linear-gradient(90deg,#8B6BFF,#C7B4FF)}
  :root:not([data-tema]):not([data-theme]) .bg-3364ba{background:linear-gradient(160deg, rgba(255,77,141,.6), rgba(139,107,255,.3))}
  :root:not([data-tema]):not([data-theme]) .bg-36aabb{background:linear-gradient(100deg, rgba(255,77,141,.26), rgba(255,77,141,.1))}
  :root:not([data-tema]):not([data-theme]) .bg-40957f{background:linear-gradient(120deg, rgba(255,77,141,.3), rgba(255,77,141,.1))}
  :root:not([data-tema]):not([data-theme]) .bg-48c902{background:linear-gradient(150deg,rgba(255,158,196,.5),rgba(139,107,255,.4))}
  :root:not([data-tema]):not([data-theme]) .bg-4a6d30{background:linear-gradient(150deg, rgba(255,77,141,.5), rgba(255,77,141,.24))}
  :root:not([data-tema]):not([data-theme]) .bg-51f725{background:radial-gradient(120% 90% at 50% 0%, transparent 38%, rgba(23,17,28,0.074) 100%)}
  :root:not([data-tema]):not([data-theme]) .bg-5d5034{background:linear-gradient(90deg,#FF4D8D,#FF8AB4)}
  :root:not([data-tema]):not([data-theme]) .bg-603bde{background:linear-gradient(100deg, rgba(255,77,141,.2), transparent 70%)}
  :root:not([data-tema]):not([data-theme]) .bg-651ee2{background:linear-gradient(100deg, rgba(255,174,26,.16), transparent 70%)}
  :root:not([data-tema]):not([data-theme]) .bg-671d10{background:radial-gradient(120% 90% at 50% 0%, transparent 36%, rgba(23,17,28,0.07) 100%)}
  :root:not([data-tema]):not([data-theme]) .bg-7a2509{background:radial-gradient(120% 90% at 50% 0%, transparent 38%, rgba(23,17,28,0.068) 100%)}
  :root:not([data-tema]):not([data-theme]) .bg-7b8ed4{background:linear-gradient(155deg, rgba(0,217,163,.2), rgba(139,107,255,.12))}
  :root:not([data-tema]):not([data-theme]) .bg-8ba868{background:linear-gradient(150deg,rgba(139,107,255,.45),rgba(255,174,26,.3))}
  :root:not([data-tema]):not([data-theme]) .bg-933b8e{background:linear-gradient(180deg,#8B6BFF,rgba(139,107,255,.35))}
  :root:not([data-tema]):not([data-theme]) .bg-936d27{background:linear-gradient(155deg, rgba(255,77,141,.2), rgba(139,107,255,.14))}
  :root:not([data-tema]):not([data-theme]) .bg-a0c938{background:linear-gradient(120deg, rgba(255,77,141,.28), rgba(255,77,141,.1))}
  :root:not([data-tema]):not([data-theme]) .bg-a792c6{background:linear-gradient(100deg, rgba(255,77,141,.14), transparent 70%)}
  :root:not([data-tema]):not([data-theme]) .bg-b6ca2b{background:radial-gradient(120% 90% at 50% 0%, transparent 40%, rgba(23,17,28,0.065) 100%)}
  :root:not([data-tema]):not([data-theme]) .bg-b6ea16{background:linear-gradient(180deg,#FF4D8D,rgba(255,77,141,.35))}
  :root:not([data-tema]):not([data-theme]) .bg-b8c21e{background:radial-gradient(120% 100% at 50% 0%, transparent 34%, rgba(23,17,28,0.072) 100%)}
  :root:not([data-tema]):not([data-theme]) .bg-b9b7b8{background:linear-gradient(150deg,rgba(255,174,26,.45),rgba(255,77,141,.35))}
  :root:not([data-tema]):not([data-theme]) .bg-bce091{background:radial-gradient(120% 90% at 50% 0%, transparent 34%, rgba(23,17,28,0.072) 100%)}
  :root:not([data-tema]):not([data-theme]) .bg-c1785c{background:linear-gradient(100deg, rgba(255,77,141,.3), rgba(255,77,141,.12))}
  :root:not([data-tema]):not([data-theme]) .bg-cdd63a{background:linear-gradient(155deg, rgba(255,77,141,.22), rgba(139,107,255,.14))}
  :root:not([data-tema]):not([data-theme]) .bg-ce5012{background:linear-gradient(90deg,#00D9A3,#6BE8C6)}
  :root:not([data-tema]):not([data-theme]) .bg-d14d2c{background:radial-gradient(120% 90% at 50% 0%, transparent 38%, rgba(23,17,28,0.072) 100%)}
  :root:not([data-tema]):not([data-theme]) .bg-d91092{background:linear-gradient(150deg, rgba(255,77,141,.32), rgba(139,107,255,.2))}
  :root:not([data-tema]):not([data-theme]) .bg-dd7d0b{background:linear-gradient(150deg,#FF4D8D,#8B6BFF)}
  :root:not([data-tema]):not([data-theme]) .bg-e377b9{background:radial-gradient(110% 80% at 50% 10%, transparent 24%, rgba(23,17,28,0.077) 100%)}
  :root:not([data-tema]):not([data-theme]) .bg-e7cd12{background:linear-gradient(90deg,#8B6BFF,#B6A0FF)}
  :root:not([data-tema]):not([data-theme]) .bg-eae919{background:linear-gradient(100deg, rgba(255,77,141,.28), rgba(255,77,141,.08))}
  :root:not([data-tema]):not([data-theme]) .bg-f14772{background:radial-gradient(120% 90% at 50% 0%, transparent 34%, rgba(23,17,28,0.07) 100%)}
  :root:not([data-tema]):not([data-theme]) .border-bottom-1e3365{border-bottom:1px solid rgba(23,17,28,0.056)}
  :root:not([data-tema]):not([data-theme]) .border-bottom-39ace8{border-bottom:1px solid rgba(23,17,28,0.112)}
  :root:not([data-tema]):not([data-theme]) .border-bottom-5271a9{border-bottom:1px solid rgba(23,17,28,0.048)}
  :root:not([data-tema]):not([data-theme]) .border-bottom-7017b9{border-bottom:1px solid rgba(23,17,28,0.08)}
  :root:not([data-tema]):not([data-theme]) .border-bottom-800b0f{border-bottom:1px solid rgba(23,17,28,0.064)}
  :root:not([data-tema]):not([data-theme]) .border-bottom-8e5161{border-bottom:1px solid rgba(23,17,28,0.072)}
  :root:not([data-tema]):not([data-theme]) .border-bottom-bc5581{border-bottom:1px solid rgba(23,17,28,0.096)}
  :root:not([data-tema]):not([data-theme]) .border-left-0f273e{border-left:3px solid rgba(23,17,28,0.272)}
  :root:not([data-tema]):not([data-theme]) .border-left-a1a4fd{border-left:3px solid rgba(23,17,28,0.192)}
  :root:not([data-tema]):not([data-theme]) .border-left-e770a0{border-left:3px solid rgba(23,17,28,0.24)}
  :root:not([data-tema]):not([data-theme]) .border-top-0e39f6{border-top:1px solid rgba(23,17,28,0.096)}
  :root:not([data-tema]):not([data-theme]) .border-top-457116{border-top:1px solid rgba(23,17,28,0.128)}
  :root:not([data-tema]):not([data-theme]) .border-top-4b4632{border-top:1px solid rgba(23,17,28,0.112)}
  :root:not([data-tema]):not([data-theme]) .border-top-69333e{border-top:1px solid rgba(23,17,28,0.08)}
  :root:not([data-tema]):not([data-theme]) .border-top-a1d66c{border-top:1px solid rgba(23,17,28,0.064)}
  :root:not([data-tema]):not([data-theme]) .border-top-ffefac{border-top:1px solid rgba(23,17,28,0.104)}
  :root:not([data-tema]):not([data-theme]) .c-00d9a3{color:#0F6B55}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-2{color:rgba(23,17,28,0.236)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-3{color:rgba(23,17,28,0.354)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-32{color:rgba(23,17,28,0.378)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-34{color:rgba(23,17,28,0.401)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-35{color:rgba(23,17,28,0.413)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-38{color:rgba(23,17,28,0.448)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-4{color:rgba(23,17,28,0.472)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-42{color:rgba(23,17,28,0.496)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-44{color:rgba(23,17,28,0.519)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-45{color:rgba(23,17,28,0.531)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-48{color:rgba(23,17,28,0.566)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-5{color:rgba(23,17,28,0.59)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-55{color:rgba(23,17,28,0.649)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-58{color:rgba(23,17,28,0.684)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-6{color:rgba(23,17,28,0.708)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-62{color:rgba(23,17,28,0.732)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-65{color:rgba(23,17,28,0.767)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-7{color:rgba(23,17,28,0.826)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-72{color:rgba(23,17,28,0.85)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-75{color:rgba(23,17,28,0.885)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-78{color:rgba(23,17,28,0.92)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-8{color:rgba(23,17,28,0.944)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-82{color:rgba(23,17,28,0.968)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-85{color:rgba(23,17,28,1)}
  :root:not([data-tema]):not([data-theme]) .c-255-255-255-9{color:rgba(23,17,28,1)}
  :root:not([data-tema]):not([data-theme]) .c-7df0ce{color:#0F6B55}
  :root:not([data-tema]):not([data-theme]) .c-8fe3a6{color:#1B6B3D}
  :root:not([data-tema]):not([data-theme]) .c-c7b4ff{color:#4A2FB0}
  :root:not([data-tema]):not([data-theme]) .c-ff4d8d{color:#C42462}
  :root:not([data-tema]):not([data-theme]) .c-ff9ec4{color:#B31E52}
  :root:not([data-tema]):not([data-theme]) .c-ffc257{color:#8A5600}
  :root:not([data-tema]):not([data-theme]) .c-fff{color:#17111C}
  :root:not([data-tema]):not([data-theme]) .sh-0-6px-18px-6px-0-0-0-6{box-shadow:0 6px 18px -6px rgba(23,17,28,0.18)}
  :root:not([data-tema]):not([data-theme]) .sh-0-8px-20px-8px-0-0-0-6{box-shadow:0 8px 20px -8px rgba(23,17,28,0.18)}
  :root:not([data-tema]):not([data-theme]) .sh-1c6aec{box-shadow:inset 0 1px 0 rgba(255,255,255,0.912), 0 26px 60px -30px rgba(23,17,28,0.24)}
  :root:not([data-tema]):not([data-theme]) .sh-27796a{box-shadow:0 0 0 2px rgba(255,255,255,1), 0 8px 20px -8px rgba(255,77,141,.9)}
  :root:not([data-tema]):not([data-theme]) .sh-321b51{box-shadow:inset 0 1px 0 rgba(255,255,255,0.874), 0 30px 70px -32px rgba(23,17,28,0.255)}
  :root:not([data-tema]):not([data-theme]) .sh-33cdb6{box-shadow:inset 0 1px 0 rgba(255,255,255,0.646), 0 26px 60px -30px rgba(23,17,28,0.24)}
  :root:not([data-tema]):not([data-theme]) .sh-372d96{box-shadow:inset 0 1px 0 rgba(255,255,255,0.722)}
  :root:not([data-tema]):not([data-theme]) .sh-38611f{box-shadow:inset 0 1px 0 rgba(255,255,255,0.798), 0 26px 60px -30px rgba(23,17,28,0.24)}
  :root:not([data-tema]):not([data-theme]) .sh-397541{box-shadow:inset 0 1px 0 rgba(255,255,255,0.76)}
  :root:not([data-tema]):not([data-theme]) .sh-48f1ce{box-shadow:inset 0 1px 0 rgba(255,255,255,0.684)}
  :root:not([data-tema]):not([data-theme]) .sh-796021{box-shadow:0 14px 32px -10px rgba(23,17,28,0.21)}
  :root:not([data-tema]):not([data-theme]) .sh-7d02db{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 10px 26px -8px rgba(255,77,141,.6)}
  :root:not([data-tema]):not([data-theme]) .sh-7d2328{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 26px 60px -30px rgba(23,17,28,0.255), 0 0 0 4px rgba(255,77,141,.1)}
  :root:not([data-tema]):not([data-theme]) .sh-7d8e80{box-shadow:inset 0 1px 0 rgba(255,255,255,0.646)}
  :root:not([data-tema]):not([data-theme]) .sh-82b82d{box-shadow:inset 0 1px 0 rgba(255,255,255,0.57)}
  :root:not([data-tema]):not([data-theme]) .sh-8378b0{box-shadow:0 14px 34px -10px rgba(255,77,141,.9), inset 0 1px 0 rgba(255,255,255,0.95)}
  :root:not([data-tema]):not([data-theme]) .sh-88185f{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 12px 30px -10px rgba(255,77,141,.7)}
  :root:not([data-tema]):not([data-theme]) .sh-8ff78d{box-shadow:inset 0 1px 0 rgba(255,255,255,0.798), inset 0 -1px 0 rgba(255,255,255,0.114), 0 26px 60px -30px rgba(23,17,28,0.24)}
  :root:not([data-tema]):not([data-theme]) .sh-a17cdd{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855)}
  :root:not([data-tema]):not([data-theme]) .sh-a5481a{box-shadow:inset 0 1px 0 rgba(255,255,255,0.95), 0 40px 90px -40px rgba(23,17,28,0.27)}
  :root:not([data-tema]):not([data-theme]) .sh-b135a9{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 26px 60px -30px rgba(23,17,28,0.255), 0 0 0 4px rgba(255,174,26,.08)}
  :root:not([data-tema]):not([data-theme]) .sh-b9832b{box-shadow:0 12px 30px -8px rgba(23,17,28,0.24)}
  :root:not([data-tema]):not([data-theme]) .sh-e7e4c0{box-shadow:0 20px 44px -16px rgba(23,17,28,0.21)}
  :root:not([data-tema]):not([data-theme]) .sh-ea101b{box-shadow:inset 0 1px 0 rgba(255,255,255,0.76), 0 26px 60px -30px rgba(23,17,28,0.24)}
  :root:not([data-tema]):not([data-theme]) .sh-eb9d6a{box-shadow:inset 0 1px 0 rgba(255,255,255,0.798)}
  :root:not([data-tema]):not([data-theme]) .sh-f301d7{box-shadow:inset 0 1px 0 rgba(255,255,255,0.95), 0 40px 90px -34px rgba(23,17,28,0.27)}
  :root:not([data-tema]):not([data-theme]) .sh-fbf67f{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 26px 60px -30px rgba(23,17,28,0.255)}
  :root:not([data-tema]):not([data-theme]) .bg-ff4d8d.c-fff,.bg-ff4d8d .c-fff{color:#fff}
  :root:not([data-tema]):not([data-theme]) .bg-ff4d8d [class*="c-255-255-255"]{color:rgba(255,255,255,.8)}
  :root:not([data-tema]):not([data-theme]) .bg-8b6bff.c-fff,.bg-8b6bff .c-fff{color:#fff}
  :root:not([data-tema]):not([data-theme]) .bg-8b6bff [class*="c-255-255-255"]{color:rgba(255,255,255,.8)}
  :root:not([data-tema]):not([data-theme]) .bg-dd7d0b.c-fff,.bg-dd7d0b .c-fff{color:#fff}
  :root:not([data-tema]):not([data-theme]) .bg-dd7d0b [class*="c-255-255-255"]{color:rgba(255,255,255,.8)}
  :root:not([data-tema]):not([data-theme]) .bg-ffae1a.c-17111c,.bg-ffae1a .c-17111c{color:#17111C}
  :root:not([data-tema]):not([data-theme]) .bg-8fe3a6.c-17111c,.bg-8fe3a6 .c-17111c{color:#17111C}
  :root:not([data-tema]):not([data-theme]) .bg-fff.c-17111c,.bg-fff .c-17111c{color:#17111C}
  :root:not([data-tema]):not([data-theme]) .bg-ff9ec4.c-17111c,.bg-ff9ec4 .c-17111c{color:#17111C}
  :root:not([data-tema]):not([data-theme]) .bg-00d9a3.c-17111c,.bg-00d9a3 .c-17111c{color:#17111C}
}

:root[data-tema="claro"] .bd-011b69{border:1px solid rgba(23,17,28,0.192)}
:root[data-tema="claro"] .bd-03ee34{border:1px solid rgba(23,17,28,0.16)}
:root[data-tema="claro"] .bd-1f094d{border:1px solid rgba(23,17,28,0.112)}
:root[data-tema="claro"] .bd-20eac9{border:2px solid rgba(23,17,28,0.24)}
:root[data-tema="claro"] .bd-39e5ef{border:1px dashed rgba(23,17,28,0.192)}
:root[data-tema="claro"] .bd-3eddf0{border:1px solid rgba(23,17,28,0.176)}
:root[data-tema="claro"] .bd-40666c{border:1px solid rgba(23,17,28,0.08)}
:root[data-tema="claro"] .bd-470cf3{border:1px dashed rgba(23,17,28,0.144)}
:root[data-tema="claro"] .bd-58486f{border:1px solid rgba(23,17,28,0.12)}
:root[data-tema="claro"] .bd-5b0d4f{border:1px solid rgba(23,17,28,0.048)}
:root[data-tema="claro"] .bd-5bf476{border:2px solid rgba(23,17,28,0.336)}
:root[data-tema="claro"] .bd-5d9354{border:1px solid rgba(23,17,28,0.144)}
:root[data-tema="claro"] .bd-5fbcab{border:1px solid rgba(23,17,28,0.104)}
:root[data-tema="claro"] .bd-6501d6{border:1px dashed rgba(23,17,28,0.208)}
:root[data-tema="claro"] .bd-7a461d{border:1px solid rgba(23,17,28,0.136)}
:root[data-tema="claro"] .bd-8b69c0{border:1px dashed rgba(23,17,28,0.24)}
:root[data-tema="claro"] .bd-94c98b{border:1px solid rgba(23,17,28,0.072)}
:root[data-tema="claro"] .bd-b1c3e0{border:1px dashed rgba(23,17,28,0.16)}
:root[data-tema="claro"] .bd-c1aa86{border:1px dashed rgba(23,17,28,0.128)}
:root[data-tema="claro"] .bd-cefdca{border:1px solid rgba(23,17,28,0.088)}
:root[data-tema="claro"] .bd-cf6fb3{border:1px dashed rgba(23,17,28,0.176)}
:root[data-tema="claro"] .bd-d4908c{border:1px solid rgba(23,17,28,0.096)}
:root[data-tema="claro"] .bd-dd5d0b{border:1px solid rgba(23,17,28,0.128)}
:root[data-tema="claro"] .bg-02856f{background:linear-gradient(100deg, rgba(255,174,26,.14), transparent 60%)}
:root[data-tema="claro"] .bg-0f46d7{background:linear-gradient(180deg,#C7B4FF,rgba(198,180,255,.3))}
:root[data-tema="claro"] .bg-156e1f{background:linear-gradient(150deg,rgba(198,180,255,.45),rgba(255,158,196,.35))}
:root[data-tema="claro"] .bg-255-255-255-04{background:rgba(23,17,28,0.038)}
:root[data-tema="claro"] .bg-255-255-255-05{background:rgba(23,17,28,0.048)}
:root[data-tema="claro"] .bg-255-255-255-06{background:rgba(23,17,28,0.057)}
:root[data-tema="claro"] .bg-255-255-255-07{background:rgba(23,17,28,0.067)}
:root[data-tema="claro"] .bg-255-255-255-08{background:rgba(23,17,28,0.076)}
:root[data-tema="claro"] .bg-255-255-255-09{background:rgba(23,17,28,0.085)}
:root[data-tema="claro"] .bg-255-255-255-1{background:rgba(23,17,28,0.095)}
:root[data-tema="claro"] .bg-255-255-255-13{background:rgba(23,17,28,0.123)}
:root[data-tema="claro"] .bg-255-255-255-14{background:rgba(23,17,28,0.133)}
:root[data-tema="claro"] .bg-255-255-255-16{background:rgba(23,17,28,0.152)}
:root[data-tema="claro"] .bg-255-255-255-22{background:rgba(23,17,28,0.209)}
:root[data-tema="claro"] .bg-255-255-255-26{background:rgba(23,17,28,0.247)}
:root[data-tema="claro"] .bg-255-255-255-34{background:rgba(23,17,28,0.323)}
:root[data-tema="claro"] .bg-255-255-255-4{background:rgba(23,17,28,0.38)}
:root[data-tema="claro"] .bg-255-255-255-45{background:rgba(23,17,28,0.427)}
:root[data-tema="claro"] .bg-255-255-255-6{background:rgba(23,17,28,0.57)}
:root[data-tema="claro"] .bg-259e9f{background:radial-gradient(120% 90% at 50% 0%, transparent 34%, rgba(23,17,28,0.074) 100%)}
:root[data-tema="claro"] .bg-285272{background:radial-gradient(120% 90% at 50% 0%, transparent 40%, rgba(23,17,28,0.076) 100%)}
:root[data-tema="claro"] .bg-3146e1{background:linear-gradient(90deg,#8B6BFF,#C7B4FF)}
:root[data-tema="claro"] .bg-3364ba{background:linear-gradient(160deg, rgba(255,77,141,.6), rgba(139,107,255,.3))}
:root[data-tema="claro"] .bg-36aabb{background:linear-gradient(100deg, rgba(255,77,141,.26), rgba(255,77,141,.1))}
:root[data-tema="claro"] .bg-40957f{background:linear-gradient(120deg, rgba(255,77,141,.3), rgba(255,77,141,.1))}
:root[data-tema="claro"] .bg-48c902{background:linear-gradient(150deg,rgba(255,158,196,.5),rgba(139,107,255,.4))}
:root[data-tema="claro"] .bg-4a6d30{background:linear-gradient(150deg, rgba(255,77,141,.5), rgba(255,77,141,.24))}
:root[data-tema="claro"] .bg-51f725{background:radial-gradient(120% 90% at 50% 0%, transparent 38%, rgba(23,17,28,0.074) 100%)}
:root[data-tema="claro"] .bg-5d5034{background:linear-gradient(90deg,#FF4D8D,#FF8AB4)}
:root[data-tema="claro"] .bg-603bde{background:linear-gradient(100deg, rgba(255,77,141,.2), transparent 70%)}
:root[data-tema="claro"] .bg-651ee2{background:linear-gradient(100deg, rgba(255,174,26,.16), transparent 70%)}
:root[data-tema="claro"] .bg-671d10{background:radial-gradient(120% 90% at 50% 0%, transparent 36%, rgba(23,17,28,0.07) 100%)}
:root[data-tema="claro"] .bg-7a2509{background:radial-gradient(120% 90% at 50% 0%, transparent 38%, rgba(23,17,28,0.068) 100%)}
:root[data-tema="claro"] .bg-7b8ed4{background:linear-gradient(155deg, rgba(0,217,163,.2), rgba(139,107,255,.12))}
:root[data-tema="claro"] .bg-8ba868{background:linear-gradient(150deg,rgba(139,107,255,.45),rgba(255,174,26,.3))}
:root[data-tema="claro"] .bg-933b8e{background:linear-gradient(180deg,#8B6BFF,rgba(139,107,255,.35))}
:root[data-tema="claro"] .bg-936d27{background:linear-gradient(155deg, rgba(255,77,141,.2), rgba(139,107,255,.14))}
:root[data-tema="claro"] .bg-a0c938{background:linear-gradient(120deg, rgba(255,77,141,.28), rgba(255,77,141,.1))}
:root[data-tema="claro"] .bg-a792c6{background:linear-gradient(100deg, rgba(255,77,141,.14), transparent 70%)}
:root[data-tema="claro"] .bg-b6ca2b{background:radial-gradient(120% 90% at 50% 0%, transparent 40%, rgba(23,17,28,0.065) 100%)}
:root[data-tema="claro"] .bg-b6ea16{background:linear-gradient(180deg,#FF4D8D,rgba(255,77,141,.35))}
:root[data-tema="claro"] .bg-b8c21e{background:radial-gradient(120% 100% at 50% 0%, transparent 34%, rgba(23,17,28,0.072) 100%)}
:root[data-tema="claro"] .bg-b9b7b8{background:linear-gradient(150deg,rgba(255,174,26,.45),rgba(255,77,141,.35))}
:root[data-tema="claro"] .bg-bce091{background:radial-gradient(120% 90% at 50% 0%, transparent 34%, rgba(23,17,28,0.072) 100%)}
:root[data-tema="claro"] .bg-c1785c{background:linear-gradient(100deg, rgba(255,77,141,.3), rgba(255,77,141,.12))}
:root[data-tema="claro"] .bg-cdd63a{background:linear-gradient(155deg, rgba(255,77,141,.22), rgba(139,107,255,.14))}
:root[data-tema="claro"] .bg-ce5012{background:linear-gradient(90deg,#00D9A3,#6BE8C6)}
:root[data-tema="claro"] .bg-d14d2c{background:radial-gradient(120% 90% at 50% 0%, transparent 38%, rgba(23,17,28,0.072) 100%)}
:root[data-tema="claro"] .bg-d91092{background:linear-gradient(150deg, rgba(255,77,141,.32), rgba(139,107,255,.2))}
:root[data-tema="claro"] .bg-dd7d0b{background:linear-gradient(150deg,#FF4D8D,#8B6BFF)}
:root[data-tema="claro"] .bg-e377b9{background:radial-gradient(110% 80% at 50% 10%, transparent 24%, rgba(23,17,28,0.077) 100%)}
:root[data-tema="claro"] .bg-e7cd12{background:linear-gradient(90deg,#8B6BFF,#B6A0FF)}
:root[data-tema="claro"] .bg-eae919{background:linear-gradient(100deg, rgba(255,77,141,.28), rgba(255,77,141,.08))}
:root[data-tema="claro"] .bg-f14772{background:radial-gradient(120% 90% at 50% 0%, transparent 34%, rgba(23,17,28,0.07) 100%)}
:root[data-tema="claro"] .border-bottom-1e3365{border-bottom:1px solid rgba(23,17,28,0.056)}
:root[data-tema="claro"] .border-bottom-39ace8{border-bottom:1px solid rgba(23,17,28,0.112)}
:root[data-tema="claro"] .border-bottom-5271a9{border-bottom:1px solid rgba(23,17,28,0.048)}
:root[data-tema="claro"] .border-bottom-7017b9{border-bottom:1px solid rgba(23,17,28,0.08)}
:root[data-tema="claro"] .border-bottom-800b0f{border-bottom:1px solid rgba(23,17,28,0.064)}
:root[data-tema="claro"] .border-bottom-8e5161{border-bottom:1px solid rgba(23,17,28,0.072)}
:root[data-tema="claro"] .border-bottom-bc5581{border-bottom:1px solid rgba(23,17,28,0.096)}
:root[data-tema="claro"] .border-left-0f273e{border-left:3px solid rgba(23,17,28,0.272)}
:root[data-tema="claro"] .border-left-a1a4fd{border-left:3px solid rgba(23,17,28,0.192)}
:root[data-tema="claro"] .border-left-e770a0{border-left:3px solid rgba(23,17,28,0.24)}
:root[data-tema="claro"] .border-top-0e39f6{border-top:1px solid rgba(23,17,28,0.096)}
:root[data-tema="claro"] .border-top-457116{border-top:1px solid rgba(23,17,28,0.128)}
:root[data-tema="claro"] .border-top-4b4632{border-top:1px solid rgba(23,17,28,0.112)}
:root[data-tema="claro"] .border-top-69333e{border-top:1px solid rgba(23,17,28,0.08)}
:root[data-tema="claro"] .border-top-a1d66c{border-top:1px solid rgba(23,17,28,0.064)}
:root[data-tema="claro"] .border-top-ffefac{border-top:1px solid rgba(23,17,28,0.104)}
:root[data-tema="claro"] .c-00d9a3{color:#0F6B55}
:root[data-tema="claro"] .c-255-255-255-2{color:rgba(23,17,28,0.236)}
:root[data-tema="claro"] .c-255-255-255-3{color:rgba(23,17,28,0.354)}
:root[data-tema="claro"] .c-255-255-255-32{color:rgba(23,17,28,0.378)}
:root[data-tema="claro"] .c-255-255-255-34{color:rgba(23,17,28,0.401)}
:root[data-tema="claro"] .c-255-255-255-35{color:rgba(23,17,28,0.413)}
:root[data-tema="claro"] .c-255-255-255-38{color:rgba(23,17,28,0.448)}
:root[data-tema="claro"] .c-255-255-255-4{color:rgba(23,17,28,0.472)}
:root[data-tema="claro"] .c-255-255-255-42{color:rgba(23,17,28,0.496)}
:root[data-tema="claro"] .c-255-255-255-44{color:rgba(23,17,28,0.519)}
:root[data-tema="claro"] .c-255-255-255-45{color:rgba(23,17,28,0.531)}
:root[data-tema="claro"] .c-255-255-255-48{color:rgba(23,17,28,0.566)}
:root[data-tema="claro"] .c-255-255-255-5{color:rgba(23,17,28,0.59)}
:root[data-tema="claro"] .c-255-255-255-55{color:rgba(23,17,28,0.649)}
:root[data-tema="claro"] .c-255-255-255-58{color:rgba(23,17,28,0.684)}
:root[data-tema="claro"] .c-255-255-255-6{color:rgba(23,17,28,0.708)}
:root[data-tema="claro"] .c-255-255-255-62{color:rgba(23,17,28,0.732)}
:root[data-tema="claro"] .c-255-255-255-65{color:rgba(23,17,28,0.767)}
:root[data-tema="claro"] .c-255-255-255-7{color:rgba(23,17,28,0.826)}
:root[data-tema="claro"] .c-255-255-255-72{color:rgba(23,17,28,0.85)}
:root[data-tema="claro"] .c-255-255-255-75{color:rgba(23,17,28,0.885)}
:root[data-tema="claro"] .c-255-255-255-78{color:rgba(23,17,28,0.92)}
:root[data-tema="claro"] .c-255-255-255-8{color:rgba(23,17,28,0.944)}
:root[data-tema="claro"] .c-255-255-255-82{color:rgba(23,17,28,0.968)}
:root[data-tema="claro"] .c-255-255-255-85{color:rgba(23,17,28,1)}
:root[data-tema="claro"] .c-255-255-255-9{color:rgba(23,17,28,1)}
:root[data-tema="claro"] .c-7df0ce{color:#0F6B55}
:root[data-tema="claro"] .c-8fe3a6{color:#1B6B3D}
:root[data-tema="claro"] .c-c7b4ff{color:#4A2FB0}
:root[data-tema="claro"] .c-ff4d8d{color:#C42462}
:root[data-tema="claro"] .c-ff9ec4{color:#B31E52}
:root[data-tema="claro"] .c-ffc257{color:#8A5600}
:root[data-tema="claro"] .c-fff{color:#17111C}
:root[data-tema="claro"] .sh-0-6px-18px-6px-0-0-0-6{box-shadow:0 6px 18px -6px rgba(23,17,28,0.18)}
:root[data-tema="claro"] .sh-0-8px-20px-8px-0-0-0-6{box-shadow:0 8px 20px -8px rgba(23,17,28,0.18)}
:root[data-tema="claro"] .sh-1c6aec{box-shadow:inset 0 1px 0 rgba(255,255,255,0.912), 0 26px 60px -30px rgba(23,17,28,0.24)}
:root[data-tema="claro"] .sh-27796a{box-shadow:0 0 0 2px rgba(255,255,255,1), 0 8px 20px -8px rgba(255,77,141,.9)}
:root[data-tema="claro"] .sh-321b51{box-shadow:inset 0 1px 0 rgba(255,255,255,0.874), 0 30px 70px -32px rgba(23,17,28,0.255)}
:root[data-tema="claro"] .sh-33cdb6{box-shadow:inset 0 1px 0 rgba(255,255,255,0.646), 0 26px 60px -30px rgba(23,17,28,0.24)}
:root[data-tema="claro"] .sh-372d96{box-shadow:inset 0 1px 0 rgba(255,255,255,0.722)}
:root[data-tema="claro"] .sh-38611f{box-shadow:inset 0 1px 0 rgba(255,255,255,0.798), 0 26px 60px -30px rgba(23,17,28,0.24)}
:root[data-tema="claro"] .sh-397541{box-shadow:inset 0 1px 0 rgba(255,255,255,0.76)}
:root[data-tema="claro"] .sh-48f1ce{box-shadow:inset 0 1px 0 rgba(255,255,255,0.684)}
:root[data-tema="claro"] .sh-796021{box-shadow:0 14px 32px -10px rgba(23,17,28,0.21)}
:root[data-tema="claro"] .sh-7d02db{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 10px 26px -8px rgba(255,77,141,.6)}
:root[data-tema="claro"] .sh-7d2328{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 26px 60px -30px rgba(23,17,28,0.255), 0 0 0 4px rgba(255,77,141,.1)}
:root[data-tema="claro"] .sh-7d8e80{box-shadow:inset 0 1px 0 rgba(255,255,255,0.646)}
:root[data-tema="claro"] .sh-82b82d{box-shadow:inset 0 1px 0 rgba(255,255,255,0.57)}
:root[data-tema="claro"] .sh-8378b0{box-shadow:0 14px 34px -10px rgba(255,77,141,.9), inset 0 1px 0 rgba(255,255,255,0.95)}
:root[data-tema="claro"] .sh-88185f{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 12px 30px -10px rgba(255,77,141,.7)}
:root[data-tema="claro"] .sh-8ff78d{box-shadow:inset 0 1px 0 rgba(255,255,255,0.798), inset 0 -1px 0 rgba(255,255,255,0.114), 0 26px 60px -30px rgba(23,17,28,0.24)}
:root[data-tema="claro"] .sh-a17cdd{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855)}
:root[data-tema="claro"] .sh-a5481a{box-shadow:inset 0 1px 0 rgba(255,255,255,0.95), 0 40px 90px -40px rgba(23,17,28,0.27)}
:root[data-tema="claro"] .sh-b135a9{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 26px 60px -30px rgba(23,17,28,0.255), 0 0 0 4px rgba(255,174,26,.08)}
:root[data-tema="claro"] .sh-b9832b{box-shadow:0 12px 30px -8px rgba(23,17,28,0.24)}
:root[data-tema="claro"] .sh-e7e4c0{box-shadow:0 20px 44px -16px rgba(23,17,28,0.21)}
:root[data-tema="claro"] .sh-ea101b{box-shadow:inset 0 1px 0 rgba(255,255,255,0.76), 0 26px 60px -30px rgba(23,17,28,0.24)}
:root[data-tema="claro"] .sh-eb9d6a{box-shadow:inset 0 1px 0 rgba(255,255,255,0.798)}
:root[data-tema="claro"] .sh-f301d7{box-shadow:inset 0 1px 0 rgba(255,255,255,0.95), 0 40px 90px -34px rgba(23,17,28,0.27)}
:root[data-tema="claro"] .sh-fbf67f{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 26px 60px -30px rgba(23,17,28,0.255)}
:root[data-tema="claro"] .bg-ff4d8d.c-fff,.bg-ff4d8d .c-fff{color:#fff}
:root[data-tema="claro"] .bg-ff4d8d [class*="c-255-255-255"]{color:rgba(255,255,255,.8)}
:root[data-tema="claro"] .bg-8b6bff.c-fff,.bg-8b6bff .c-fff{color:#fff}
:root[data-tema="claro"] .bg-8b6bff [class*="c-255-255-255"]{color:rgba(255,255,255,.8)}
:root[data-tema="claro"] .bg-dd7d0b.c-fff,.bg-dd7d0b .c-fff{color:#fff}
:root[data-tema="claro"] .bg-dd7d0b [class*="c-255-255-255"]{color:rgba(255,255,255,.8)}
:root[data-tema="claro"] .bg-ffae1a.c-17111c,.bg-ffae1a .c-17111c{color:#17111C}
:root[data-tema="claro"] .bg-8fe3a6.c-17111c,.bg-8fe3a6 .c-17111c{color:#17111C}
:root[data-tema="claro"] .bg-fff.c-17111c,.bg-fff .c-17111c{color:#17111C}
:root[data-tema="claro"] .bg-ff9ec4.c-17111c,.bg-ff9ec4 .c-17111c{color:#17111C}
:root[data-tema="claro"] .bg-00d9a3.c-17111c,.bg-00d9a3 .c-17111c{color:#17111C}

:root[data-theme="light"]:not([data-tema]) .bd-011b69{border:1px solid rgba(23,17,28,0.192)}
:root[data-theme="light"]:not([data-tema]) .bd-03ee34{border:1px solid rgba(23,17,28,0.16)}
:root[data-theme="light"]:not([data-tema]) .bd-1f094d{border:1px solid rgba(23,17,28,0.112)}
:root[data-theme="light"]:not([data-tema]) .bd-20eac9{border:2px solid rgba(23,17,28,0.24)}
:root[data-theme="light"]:not([data-tema]) .bd-39e5ef{border:1px dashed rgba(23,17,28,0.192)}
:root[data-theme="light"]:not([data-tema]) .bd-3eddf0{border:1px solid rgba(23,17,28,0.176)}
:root[data-theme="light"]:not([data-tema]) .bd-40666c{border:1px solid rgba(23,17,28,0.08)}
:root[data-theme="light"]:not([data-tema]) .bd-470cf3{border:1px dashed rgba(23,17,28,0.144)}
:root[data-theme="light"]:not([data-tema]) .bd-58486f{border:1px solid rgba(23,17,28,0.12)}
:root[data-theme="light"]:not([data-tema]) .bd-5b0d4f{border:1px solid rgba(23,17,28,0.048)}
:root[data-theme="light"]:not([data-tema]) .bd-5bf476{border:2px solid rgba(23,17,28,0.336)}
:root[data-theme="light"]:not([data-tema]) .bd-5d9354{border:1px solid rgba(23,17,28,0.144)}
:root[data-theme="light"]:not([data-tema]) .bd-5fbcab{border:1px solid rgba(23,17,28,0.104)}
:root[data-theme="light"]:not([data-tema]) .bd-6501d6{border:1px dashed rgba(23,17,28,0.208)}
:root[data-theme="light"]:not([data-tema]) .bd-7a461d{border:1px solid rgba(23,17,28,0.136)}
:root[data-theme="light"]:not([data-tema]) .bd-8b69c0{border:1px dashed rgba(23,17,28,0.24)}
:root[data-theme="light"]:not([data-tema]) .bd-94c98b{border:1px solid rgba(23,17,28,0.072)}
:root[data-theme="light"]:not([data-tema]) .bd-b1c3e0{border:1px dashed rgba(23,17,28,0.16)}
:root[data-theme="light"]:not([data-tema]) .bd-c1aa86{border:1px dashed rgba(23,17,28,0.128)}
:root[data-theme="light"]:not([data-tema]) .bd-cefdca{border:1px solid rgba(23,17,28,0.088)}
:root[data-theme="light"]:not([data-tema]) .bd-cf6fb3{border:1px dashed rgba(23,17,28,0.176)}
:root[data-theme="light"]:not([data-tema]) .bd-d4908c{border:1px solid rgba(23,17,28,0.096)}
:root[data-theme="light"]:not([data-tema]) .bd-dd5d0b{border:1px solid rgba(23,17,28,0.128)}
:root[data-theme="light"]:not([data-tema]) .bg-02856f{background:linear-gradient(100deg, rgba(255,174,26,.14), transparent 60%)}
:root[data-theme="light"]:not([data-tema]) .bg-0f46d7{background:linear-gradient(180deg,#C7B4FF,rgba(198,180,255,.3))}
:root[data-theme="light"]:not([data-tema]) .bg-156e1f{background:linear-gradient(150deg,rgba(198,180,255,.45),rgba(255,158,196,.35))}
:root[data-theme="light"]:not([data-tema]) .bg-255-255-255-04{background:rgba(23,17,28,0.038)}
:root[data-theme="light"]:not([data-tema]) .bg-255-255-255-05{background:rgba(23,17,28,0.048)}
:root[data-theme="light"]:not([data-tema]) .bg-255-255-255-06{background:rgba(23,17,28,0.057)}
:root[data-theme="light"]:not([data-tema]) .bg-255-255-255-07{background:rgba(23,17,28,0.067)}
:root[data-theme="light"]:not([data-tema]) .bg-255-255-255-08{background:rgba(23,17,28,0.076)}
:root[data-theme="light"]:not([data-tema]) .bg-255-255-255-09{background:rgba(23,17,28,0.085)}
:root[data-theme="light"]:not([data-tema]) .bg-255-255-255-1{background:rgba(23,17,28,0.095)}
:root[data-theme="light"]:not([data-tema]) .bg-255-255-255-13{background:rgba(23,17,28,0.123)}
:root[data-theme="light"]:not([data-tema]) .bg-255-255-255-14{background:rgba(23,17,28,0.133)}
:root[data-theme="light"]:not([data-tema]) .bg-255-255-255-16{background:rgba(23,17,28,0.152)}
:root[data-theme="light"]:not([data-tema]) .bg-255-255-255-22{background:rgba(23,17,28,0.209)}
:root[data-theme="light"]:not([data-tema]) .bg-255-255-255-26{background:rgba(23,17,28,0.247)}
:root[data-theme="light"]:not([data-tema]) .bg-255-255-255-34{background:rgba(23,17,28,0.323)}
:root[data-theme="light"]:not([data-tema]) .bg-255-255-255-4{background:rgba(23,17,28,0.38)}
:root[data-theme="light"]:not([data-tema]) .bg-255-255-255-45{background:rgba(23,17,28,0.427)}
:root[data-theme="light"]:not([data-tema]) .bg-255-255-255-6{background:rgba(23,17,28,0.57)}
:root[data-theme="light"]:not([data-tema]) .bg-259e9f{background:radial-gradient(120% 90% at 50% 0%, transparent 34%, rgba(23,17,28,0.074) 100%)}
:root[data-theme="light"]:not([data-tema]) .bg-285272{background:radial-gradient(120% 90% at 50% 0%, transparent 40%, rgba(23,17,28,0.076) 100%)}
:root[data-theme="light"]:not([data-tema]) .bg-3146e1{background:linear-gradient(90deg,#8B6BFF,#C7B4FF)}
:root[data-theme="light"]:not([data-tema]) .bg-3364ba{background:linear-gradient(160deg, rgba(255,77,141,.6), rgba(139,107,255,.3))}
:root[data-theme="light"]:not([data-tema]) .bg-36aabb{background:linear-gradient(100deg, rgba(255,77,141,.26), rgba(255,77,141,.1))}
:root[data-theme="light"]:not([data-tema]) .bg-40957f{background:linear-gradient(120deg, rgba(255,77,141,.3), rgba(255,77,141,.1))}
:root[data-theme="light"]:not([data-tema]) .bg-48c902{background:linear-gradient(150deg,rgba(255,158,196,.5),rgba(139,107,255,.4))}
:root[data-theme="light"]:not([data-tema]) .bg-4a6d30{background:linear-gradient(150deg, rgba(255,77,141,.5), rgba(255,77,141,.24))}
:root[data-theme="light"]:not([data-tema]) .bg-51f725{background:radial-gradient(120% 90% at 50% 0%, transparent 38%, rgba(23,17,28,0.074) 100%)}
:root[data-theme="light"]:not([data-tema]) .bg-5d5034{background:linear-gradient(90deg,#FF4D8D,#FF8AB4)}
:root[data-theme="light"]:not([data-tema]) .bg-603bde{background:linear-gradient(100deg, rgba(255,77,141,.2), transparent 70%)}
:root[data-theme="light"]:not([data-tema]) .bg-651ee2{background:linear-gradient(100deg, rgba(255,174,26,.16), transparent 70%)}
:root[data-theme="light"]:not([data-tema]) .bg-671d10{background:radial-gradient(120% 90% at 50% 0%, transparent 36%, rgba(23,17,28,0.07) 100%)}
:root[data-theme="light"]:not([data-tema]) .bg-7a2509{background:radial-gradient(120% 90% at 50% 0%, transparent 38%, rgba(23,17,28,0.068) 100%)}
:root[data-theme="light"]:not([data-tema]) .bg-7b8ed4{background:linear-gradient(155deg, rgba(0,217,163,.2), rgba(139,107,255,.12))}
:root[data-theme="light"]:not([data-tema]) .bg-8ba868{background:linear-gradient(150deg,rgba(139,107,255,.45),rgba(255,174,26,.3))}
:root[data-theme="light"]:not([data-tema]) .bg-933b8e{background:linear-gradient(180deg,#8B6BFF,rgba(139,107,255,.35))}
:root[data-theme="light"]:not([data-tema]) .bg-936d27{background:linear-gradient(155deg, rgba(255,77,141,.2), rgba(139,107,255,.14))}
:root[data-theme="light"]:not([data-tema]) .bg-a0c938{background:linear-gradient(120deg, rgba(255,77,141,.28), rgba(255,77,141,.1))}
:root[data-theme="light"]:not([data-tema]) .bg-a792c6{background:linear-gradient(100deg, rgba(255,77,141,.14), transparent 70%)}
:root[data-theme="light"]:not([data-tema]) .bg-b6ca2b{background:radial-gradient(120% 90% at 50% 0%, transparent 40%, rgba(23,17,28,0.065) 100%)}
:root[data-theme="light"]:not([data-tema]) .bg-b6ea16{background:linear-gradient(180deg,#FF4D8D,rgba(255,77,141,.35))}
:root[data-theme="light"]:not([data-tema]) .bg-b8c21e{background:radial-gradient(120% 100% at 50% 0%, transparent 34%, rgba(23,17,28,0.072) 100%)}
:root[data-theme="light"]:not([data-tema]) .bg-b9b7b8{background:linear-gradient(150deg,rgba(255,174,26,.45),rgba(255,77,141,.35))}
:root[data-theme="light"]:not([data-tema]) .bg-bce091{background:radial-gradient(120% 90% at 50% 0%, transparent 34%, rgba(23,17,28,0.072) 100%)}
:root[data-theme="light"]:not([data-tema]) .bg-c1785c{background:linear-gradient(100deg, rgba(255,77,141,.3), rgba(255,77,141,.12))}
:root[data-theme="light"]:not([data-tema]) .bg-cdd63a{background:linear-gradient(155deg, rgba(255,77,141,.22), rgba(139,107,255,.14))}
:root[data-theme="light"]:not([data-tema]) .bg-ce5012{background:linear-gradient(90deg,#00D9A3,#6BE8C6)}
:root[data-theme="light"]:not([data-tema]) .bg-d14d2c{background:radial-gradient(120% 90% at 50% 0%, transparent 38%, rgba(23,17,28,0.072) 100%)}
:root[data-theme="light"]:not([data-tema]) .bg-d91092{background:linear-gradient(150deg, rgba(255,77,141,.32), rgba(139,107,255,.2))}
:root[data-theme="light"]:not([data-tema]) .bg-dd7d0b{background:linear-gradient(150deg,#FF4D8D,#8B6BFF)}
:root[data-theme="light"]:not([data-tema]) .bg-e377b9{background:radial-gradient(110% 80% at 50% 10%, transparent 24%, rgba(23,17,28,0.077) 100%)}
:root[data-theme="light"]:not([data-tema]) .bg-e7cd12{background:linear-gradient(90deg,#8B6BFF,#B6A0FF)}
:root[data-theme="light"]:not([data-tema]) .bg-eae919{background:linear-gradient(100deg, rgba(255,77,141,.28), rgba(255,77,141,.08))}
:root[data-theme="light"]:not([data-tema]) .bg-f14772{background:radial-gradient(120% 90% at 50% 0%, transparent 34%, rgba(23,17,28,0.07) 100%)}
:root[data-theme="light"]:not([data-tema]) .border-bottom-1e3365{border-bottom:1px solid rgba(23,17,28,0.056)}
:root[data-theme="light"]:not([data-tema]) .border-bottom-39ace8{border-bottom:1px solid rgba(23,17,28,0.112)}
:root[data-theme="light"]:not([data-tema]) .border-bottom-5271a9{border-bottom:1px solid rgba(23,17,28,0.048)}
:root[data-theme="light"]:not([data-tema]) .border-bottom-7017b9{border-bottom:1px solid rgba(23,17,28,0.08)}
:root[data-theme="light"]:not([data-tema]) .border-bottom-800b0f{border-bottom:1px solid rgba(23,17,28,0.064)}
:root[data-theme="light"]:not([data-tema]) .border-bottom-8e5161{border-bottom:1px solid rgba(23,17,28,0.072)}
:root[data-theme="light"]:not([data-tema]) .border-bottom-bc5581{border-bottom:1px solid rgba(23,17,28,0.096)}
:root[data-theme="light"]:not([data-tema]) .border-left-0f273e{border-left:3px solid rgba(23,17,28,0.272)}
:root[data-theme="light"]:not([data-tema]) .border-left-a1a4fd{border-left:3px solid rgba(23,17,28,0.192)}
:root[data-theme="light"]:not([data-tema]) .border-left-e770a0{border-left:3px solid rgba(23,17,28,0.24)}
:root[data-theme="light"]:not([data-tema]) .border-top-0e39f6{border-top:1px solid rgba(23,17,28,0.096)}
:root[data-theme="light"]:not([data-tema]) .border-top-457116{border-top:1px solid rgba(23,17,28,0.128)}
:root[data-theme="light"]:not([data-tema]) .border-top-4b4632{border-top:1px solid rgba(23,17,28,0.112)}
:root[data-theme="light"]:not([data-tema]) .border-top-69333e{border-top:1px solid rgba(23,17,28,0.08)}
:root[data-theme="light"]:not([data-tema]) .border-top-a1d66c{border-top:1px solid rgba(23,17,28,0.064)}
:root[data-theme="light"]:not([data-tema]) .border-top-ffefac{border-top:1px solid rgba(23,17,28,0.104)}
:root[data-theme="light"]:not([data-tema]) .c-00d9a3{color:#0F6B55}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-2{color:rgba(23,17,28,0.236)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-3{color:rgba(23,17,28,0.354)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-32{color:rgba(23,17,28,0.378)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-34{color:rgba(23,17,28,0.401)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-35{color:rgba(23,17,28,0.413)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-38{color:rgba(23,17,28,0.448)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-4{color:rgba(23,17,28,0.472)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-42{color:rgba(23,17,28,0.496)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-44{color:rgba(23,17,28,0.519)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-45{color:rgba(23,17,28,0.531)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-48{color:rgba(23,17,28,0.566)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-5{color:rgba(23,17,28,0.59)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-55{color:rgba(23,17,28,0.649)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-58{color:rgba(23,17,28,0.684)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-6{color:rgba(23,17,28,0.708)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-62{color:rgba(23,17,28,0.732)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-65{color:rgba(23,17,28,0.767)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-7{color:rgba(23,17,28,0.826)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-72{color:rgba(23,17,28,0.85)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-75{color:rgba(23,17,28,0.885)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-78{color:rgba(23,17,28,0.92)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-8{color:rgba(23,17,28,0.944)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-82{color:rgba(23,17,28,0.968)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-85{color:rgba(23,17,28,1)}
:root[data-theme="light"]:not([data-tema]) .c-255-255-255-9{color:rgba(23,17,28,1)}
:root[data-theme="light"]:not([data-tema]) .c-7df0ce{color:#0F6B55}
:root[data-theme="light"]:not([data-tema]) .c-8fe3a6{color:#1B6B3D}
:root[data-theme="light"]:not([data-tema]) .c-c7b4ff{color:#4A2FB0}
:root[data-theme="light"]:not([data-tema]) .c-ff4d8d{color:#C42462}
:root[data-theme="light"]:not([data-tema]) .c-ff9ec4{color:#B31E52}
:root[data-theme="light"]:not([data-tema]) .c-ffc257{color:#8A5600}
:root[data-theme="light"]:not([data-tema]) .c-fff{color:#17111C}
:root[data-theme="light"]:not([data-tema]) .sh-0-6px-18px-6px-0-0-0-6{box-shadow:0 6px 18px -6px rgba(23,17,28,0.18)}
:root[data-theme="light"]:not([data-tema]) .sh-0-8px-20px-8px-0-0-0-6{box-shadow:0 8px 20px -8px rgba(23,17,28,0.18)}
:root[data-theme="light"]:not([data-tema]) .sh-1c6aec{box-shadow:inset 0 1px 0 rgba(255,255,255,0.912), 0 26px 60px -30px rgba(23,17,28,0.24)}
:root[data-theme="light"]:not([data-tema]) .sh-27796a{box-shadow:0 0 0 2px rgba(255,255,255,1), 0 8px 20px -8px rgba(255,77,141,.9)}
:root[data-theme="light"]:not([data-tema]) .sh-321b51{box-shadow:inset 0 1px 0 rgba(255,255,255,0.874), 0 30px 70px -32px rgba(23,17,28,0.255)}
:root[data-theme="light"]:not([data-tema]) .sh-33cdb6{box-shadow:inset 0 1px 0 rgba(255,255,255,0.646), 0 26px 60px -30px rgba(23,17,28,0.24)}
:root[data-theme="light"]:not([data-tema]) .sh-372d96{box-shadow:inset 0 1px 0 rgba(255,255,255,0.722)}
:root[data-theme="light"]:not([data-tema]) .sh-38611f{box-shadow:inset 0 1px 0 rgba(255,255,255,0.798), 0 26px 60px -30px rgba(23,17,28,0.24)}
:root[data-theme="light"]:not([data-tema]) .sh-397541{box-shadow:inset 0 1px 0 rgba(255,255,255,0.76)}
:root[data-theme="light"]:not([data-tema]) .sh-48f1ce{box-shadow:inset 0 1px 0 rgba(255,255,255,0.684)}
:root[data-theme="light"]:not([data-tema]) .sh-796021{box-shadow:0 14px 32px -10px rgba(23,17,28,0.21)}
:root[data-theme="light"]:not([data-tema]) .sh-7d02db{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 10px 26px -8px rgba(255,77,141,.6)}
:root[data-theme="light"]:not([data-tema]) .sh-7d2328{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 26px 60px -30px rgba(23,17,28,0.255), 0 0 0 4px rgba(255,77,141,.1)}
:root[data-theme="light"]:not([data-tema]) .sh-7d8e80{box-shadow:inset 0 1px 0 rgba(255,255,255,0.646)}
:root[data-theme="light"]:not([data-tema]) .sh-82b82d{box-shadow:inset 0 1px 0 rgba(255,255,255,0.57)}
:root[data-theme="light"]:not([data-tema]) .sh-8378b0{box-shadow:0 14px 34px -10px rgba(255,77,141,.9), inset 0 1px 0 rgba(255,255,255,0.95)}
:root[data-theme="light"]:not([data-tema]) .sh-88185f{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 12px 30px -10px rgba(255,77,141,.7)}
:root[data-theme="light"]:not([data-tema]) .sh-8ff78d{box-shadow:inset 0 1px 0 rgba(255,255,255,0.798), inset 0 -1px 0 rgba(255,255,255,0.114), 0 26px 60px -30px rgba(23,17,28,0.24)}
:root[data-theme="light"]:not([data-tema]) .sh-a17cdd{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855)}
:root[data-theme="light"]:not([data-tema]) .sh-a5481a{box-shadow:inset 0 1px 0 rgba(255,255,255,0.95), 0 40px 90px -40px rgba(23,17,28,0.27)}
:root[data-theme="light"]:not([data-tema]) .sh-b135a9{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 26px 60px -30px rgba(23,17,28,0.255), 0 0 0 4px rgba(255,174,26,.08)}
:root[data-theme="light"]:not([data-tema]) .sh-b9832b{box-shadow:0 12px 30px -8px rgba(23,17,28,0.24)}
:root[data-theme="light"]:not([data-tema]) .sh-e7e4c0{box-shadow:0 20px 44px -16px rgba(23,17,28,0.21)}
:root[data-theme="light"]:not([data-tema]) .sh-ea101b{box-shadow:inset 0 1px 0 rgba(255,255,255,0.76), 0 26px 60px -30px rgba(23,17,28,0.24)}
:root[data-theme="light"]:not([data-tema]) .sh-eb9d6a{box-shadow:inset 0 1px 0 rgba(255,255,255,0.798)}
:root[data-theme="light"]:not([data-tema]) .sh-f301d7{box-shadow:inset 0 1px 0 rgba(255,255,255,0.95), 0 40px 90px -34px rgba(23,17,28,0.27)}
:root[data-theme="light"]:not([data-tema]) .sh-fbf67f{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 26px 60px -30px rgba(23,17,28,0.255)}
:root[data-theme="light"]:not([data-tema]) .bg-ff4d8d.c-fff,.bg-ff4d8d .c-fff{color:#fff}
:root[data-theme="light"]:not([data-tema]) .bg-ff4d8d [class*="c-255-255-255"]{color:rgba(255,255,255,.8)}
:root[data-theme="light"]:not([data-tema]) .bg-8b6bff.c-fff,.bg-8b6bff .c-fff{color:#fff}
:root[data-theme="light"]:not([data-tema]) .bg-8b6bff [class*="c-255-255-255"]{color:rgba(255,255,255,.8)}
:root[data-theme="light"]:not([data-tema]) .bg-dd7d0b.c-fff,.bg-dd7d0b .c-fff{color:#fff}
:root[data-theme="light"]:not([data-tema]) .bg-dd7d0b [class*="c-255-255-255"]{color:rgba(255,255,255,.8)}
:root[data-theme="light"]:not([data-tema]) .bg-ffae1a.c-17111c,.bg-ffae1a .c-17111c{color:#17111C}
:root[data-theme="light"]:not([data-tema]) .bg-8fe3a6.c-17111c,.bg-8fe3a6 .c-17111c{color:#17111C}
:root[data-theme="light"]:not([data-tema]) .bg-fff.c-17111c,.bg-fff .c-17111c{color:#17111C}
:root[data-theme="light"]:not([data-tema]) .bg-ff9ec4.c-17111c,.bg-ff9ec4 .c-17111c{color:#17111C}
:root[data-theme="light"]:not([data-tema]) .bg-00d9a3.c-17111c,.bg-00d9a3 .c-17111c{color:#17111C}
/* ============================================================================
   MARCA APLICADA — GERADO. Não editar à mão.
     python3 scripts/marca.py

   A cor da marca é LIVRE desde 18/09/2026 (roteiro de configuração §10 #3). Cada
   regra do canvas que assa o rosa aparece aqui UMA vez, com variáveis, sob
   `:root[data-cor]`; `C.aplicarTema()` liga o atributo e calcula
   --marca, --marca-rgb, --marca-clara e --marca-escura a partir da cor da casa.
   A cor do canvas (#FF4D8D) não liga nada: ela é o padrão.
   ============================================================================ */

/* --- escuro --- */
:root[data-cor] .bd-1-5px-solid-ff4d8d{border:1.5px solid var(--marca)}
:root[data-cor] .bd-1px-dashed-ff4d8d{border:1px dashed var(--marca)}
:root[data-cor] .bd-1px-solid-255-77-141-4{border:1px solid rgba(var(--marca-rgb),.4)}
:root[data-cor] .bd-1px-solid-255-77-141-5{border:1px solid rgba(var(--marca-rgb),.5)}
:root[data-cor] .bd-1px-solid-ff4d8d{border:1px solid var(--marca)}
:root[data-cor] .bd-2715f8{border:1.5px solid rgba(var(--marca-rgb),.5)}
:root[data-cor] .bd-628670{border:1.5px solid rgba(var(--marca-rgb),.45)}
:root[data-cor] .bd-7c740a{border:1px solid rgba(var(--marca-rgb),.45)}
:root[data-cor] .bd-cdf567{border:1px solid rgba(var(--marca-rgb),.55)}
:root[data-cor] .bd-fc130f{border:1px solid rgba(var(--marca-rgb),.42)}
:root[data-cor] .bg-255-77-141-1{background:rgba(var(--marca-rgb),.1)}
:root[data-cor] .bg-255-77-141-12{background:rgba(var(--marca-rgb),.12)}
:root[data-cor] .bg-255-77-141-14{background:rgba(var(--marca-rgb),.14)}
:root[data-cor] .bg-255-77-141-16{background:rgba(var(--marca-rgb),.16)}
:root[data-cor] .bg-255-77-141-2{background:rgba(var(--marca-rgb),.2)}
:root[data-cor] .bg-255-77-141-55{background:rgba(var(--marca-rgb),.55)}
:root[data-cor] .bg-255-77-141-7{background:rgba(var(--marca-rgb),.7)}
:root[data-cor] .bg-3364ba{background:linear-gradient(160deg, rgba(var(--marca-rgb),.6), rgba(139,107,255,.3))}
:root[data-cor] .bg-36aabb{background:linear-gradient(100deg, rgba(var(--marca-rgb),.26), rgba(var(--marca-rgb),.1))}
:root[data-cor] .bg-40957f{background:linear-gradient(120deg, rgba(var(--marca-rgb),.3), rgba(var(--marca-rgb),.1))}
:root[data-cor] .bg-4a6d30{background:linear-gradient(150deg, rgba(var(--marca-rgb),.5), rgba(var(--marca-rgb),.24))}
:root[data-cor] .bg-5d5034{background:linear-gradient(90deg,var(--marca),var(--marca-clara))}
:root[data-cor] .bg-603bde{background:linear-gradient(100deg, rgba(var(--marca-rgb),.2), transparent 70%)}
:root[data-cor] .bg-936d27{background:linear-gradient(155deg, rgba(var(--marca-rgb),.2), rgba(139,107,255,.14))}
:root[data-cor] .bg-a0c938{background:linear-gradient(120deg, rgba(var(--marca-rgb),.28), rgba(var(--marca-rgb),.1))}
:root[data-cor] .bg-a792c6{background:linear-gradient(100deg, rgba(var(--marca-rgb),.14), transparent 70%)}
:root[data-cor] .bg-b6ea16{background:linear-gradient(180deg,var(--marca),rgba(var(--marca-rgb),.35))}
:root[data-cor] .bg-b9b7b8{background:linear-gradient(150deg,rgba(255,174,26,.45),rgba(var(--marca-rgb),.35))}
:root[data-cor] .bg-c1785c{background:linear-gradient(100deg, rgba(var(--marca-rgb),.3), rgba(var(--marca-rgb),.12))}
:root[data-cor] .bg-cdd63a{background:linear-gradient(155deg, rgba(var(--marca-rgb),.22), rgba(139,107,255,.14))}
:root[data-cor] .bg-d91092{background:linear-gradient(150deg, rgba(var(--marca-rgb),.32), rgba(139,107,255,.2))}
:root[data-cor] .bg-dd7d0b{background:linear-gradient(150deg,var(--marca),#8B6BFF)}
:root[data-cor] .bg-eae919{background:linear-gradient(100deg, rgba(var(--marca-rgb),.28), rgba(var(--marca-rgb),.08))}
:root[data-cor] .bg-ff4d8d{background:var(--marca)}
:root[data-cor] .border-left-3px-solid-ff4d8d{border-left:3px solid var(--marca)}
:root[data-cor] .c-ff4d8d{color:var(--marca)}
:root[data-cor] .c-ff9ec4{color:var(--marca-clara)}
:root[data-cor] .sh-09e8f1{box-shadow:0 10px 26px -8px rgba(var(--marca-rgb),.8)}
:root[data-cor] .sh-12b263{box-shadow:0 8px 22px -6px rgba(var(--marca-rgb),.9)}
:root[data-cor] .sh-20249a{box-shadow:0 8px 20px -8px rgba(var(--marca-rgb),.9)}
:root[data-cor] .sh-27796a{box-shadow:0 0 0 2px rgba(255,255,255,.9), 0 8px 20px -8px rgba(var(--marca-rgb),.9)}
:root[data-cor] .sh-41024c{box-shadow:0 12px 30px -8px rgba(var(--marca-rgb),.9)}
:root[data-cor] .sh-62d6e6{box-shadow:0 16px 36px -10px rgba(var(--marca-rgb),.9)}
:root[data-cor] .sh-677c18{box-shadow:0 10px 26px -8px rgba(var(--marca-rgb),.9)}
:root[data-cor] .sh-7d02db{box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 10px 26px -8px rgba(var(--marca-rgb),.6)}
:root[data-cor] .sh-7d2328{box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 26px 60px -30px rgba(0,0,0,.85), 0 0 0 4px rgba(var(--marca-rgb),.1)}
:root[data-cor] .sh-8378b0{box-shadow:0 14px 34px -10px rgba(var(--marca-rgb),.9), inset 0 1px 0 rgba(255,255,255,.5)}
:root[data-cor] .sh-88185f{box-shadow:inset 0 1px 0 rgba(255,255,255,.45), 0 12px 30px -10px rgba(var(--marca-rgb),.7)}
:root[data-cor] .sh-8b7fe3{box-shadow:0 14px 32px -10px rgba(var(--marca-rgb),.9)}
:root[data-cor] .sh-a1962d{box-shadow:0 20px 40px -18px rgba(var(--marca-rgb),.7)}
:root[data-cor] .sh-a5a689{box-shadow:0 4px 14px -4px rgba(var(--marca-rgb),.9)}
:root[data-cor] .sh-d464a0{box-shadow:0 12px 28px -10px rgba(var(--marca-rgb),.9)}
:root[data-cor] .sh-e4d22c{box-shadow:0 8px 20px -6px rgba(var(--marca-rgb),.9)}
:root[data-cor] .sh-f7c834{box-shadow:0 16px 36px -12px rgba(var(--marca-rgb),.9)}

/* --- claro --- */
:root[data-cor][data-tema="claro"] .bg-3364ba{background:linear-gradient(160deg, rgba(var(--marca-rgb),.6), rgba(139,107,255,.3))}
:root[data-cor][data-tema="claro"] .bg-36aabb{background:linear-gradient(100deg, rgba(var(--marca-rgb),.26), rgba(var(--marca-rgb),.1))}
:root[data-cor][data-tema="claro"] .bg-40957f{background:linear-gradient(120deg, rgba(var(--marca-rgb),.3), rgba(var(--marca-rgb),.1))}
:root[data-cor][data-tema="claro"] .bg-4a6d30{background:linear-gradient(150deg, rgba(var(--marca-rgb),.5), rgba(var(--marca-rgb),.24))}
:root[data-cor][data-tema="claro"] .bg-5d5034{background:linear-gradient(90deg,var(--marca),var(--marca-clara))}
:root[data-cor][data-tema="claro"] .bg-603bde{background:linear-gradient(100deg, rgba(var(--marca-rgb),.2), transparent 70%)}
:root[data-cor][data-tema="claro"] .bg-936d27{background:linear-gradient(155deg, rgba(var(--marca-rgb),.2), rgba(139,107,255,.14))}
:root[data-cor][data-tema="claro"] .bg-a0c938{background:linear-gradient(120deg, rgba(var(--marca-rgb),.28), rgba(var(--marca-rgb),.1))}
:root[data-cor][data-tema="claro"] .bg-a792c6{background:linear-gradient(100deg, rgba(var(--marca-rgb),.14), transparent 70%)}
:root[data-cor][data-tema="claro"] .bg-b6ea16{background:linear-gradient(180deg,var(--marca),rgba(var(--marca-rgb),.35))}
:root[data-cor][data-tema="claro"] .bg-b9b7b8{background:linear-gradient(150deg,rgba(255,174,26,.45),rgba(var(--marca-rgb),.35))}
:root[data-cor][data-tema="claro"] .bg-c1785c{background:linear-gradient(100deg, rgba(var(--marca-rgb),.3), rgba(var(--marca-rgb),.12))}
:root[data-cor][data-tema="claro"] .bg-cdd63a{background:linear-gradient(155deg, rgba(var(--marca-rgb),.22), rgba(139,107,255,.14))}
:root[data-cor][data-tema="claro"] .bg-d91092{background:linear-gradient(150deg, rgba(var(--marca-rgb),.32), rgba(139,107,255,.2))}
:root[data-cor][data-tema="claro"] .bg-dd7d0b{background:linear-gradient(150deg,var(--marca),#8B6BFF)}
:root[data-cor][data-tema="claro"] .bg-eae919{background:linear-gradient(100deg, rgba(var(--marca-rgb),.28), rgba(var(--marca-rgb),.08))}
:root[data-cor][data-tema="claro"] .c-ff4d8d{color:var(--marca-escura)}
:root[data-cor][data-tema="claro"] .c-ff9ec4{color:var(--marca-escura)}
:root[data-cor][data-tema="claro"] .sh-27796a{box-shadow:0 0 0 2px rgba(255,255,255,1), 0 8px 20px -8px rgba(var(--marca-rgb),.9)}
:root[data-cor][data-tema="claro"] .sh-7d02db{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 10px 26px -8px rgba(var(--marca-rgb),.6)}
:root[data-cor][data-tema="claro"] .sh-7d2328{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 26px 60px -30px rgba(23,17,28,0.255), 0 0 0 4px rgba(var(--marca-rgb),.1)}
:root[data-cor][data-tema="claro"] .sh-8378b0{box-shadow:0 14px 34px -10px rgba(var(--marca-rgb),.9), inset 0 1px 0 rgba(255,255,255,0.95)}
:root[data-cor][data-tema="claro"] .sh-88185f{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 12px 30px -10px rgba(var(--marca-rgb),.7)}
:root[data-cor][data-theme="light"]:not([data-tema]) .bg-3364ba{background:linear-gradient(160deg, rgba(var(--marca-rgb),.6), rgba(139,107,255,.3))}
:root[data-cor][data-theme="light"]:not([data-tema]) .bg-36aabb{background:linear-gradient(100deg, rgba(var(--marca-rgb),.26), rgba(var(--marca-rgb),.1))}
:root[data-cor][data-theme="light"]:not([data-tema]) .bg-40957f{background:linear-gradient(120deg, rgba(var(--marca-rgb),.3), rgba(var(--marca-rgb),.1))}
:root[data-cor][data-theme="light"]:not([data-tema]) .bg-4a6d30{background:linear-gradient(150deg, rgba(var(--marca-rgb),.5), rgba(var(--marca-rgb),.24))}
:root[data-cor][data-theme="light"]:not([data-tema]) .bg-5d5034{background:linear-gradient(90deg,var(--marca),var(--marca-clara))}
:root[data-cor][data-theme="light"]:not([data-tema]) .bg-603bde{background:linear-gradient(100deg, rgba(var(--marca-rgb),.2), transparent 70%)}
:root[data-cor][data-theme="light"]:not([data-tema]) .bg-936d27{background:linear-gradient(155deg, rgba(var(--marca-rgb),.2), rgba(139,107,255,.14))}
:root[data-cor][data-theme="light"]:not([data-tema]) .bg-a0c938{background:linear-gradient(120deg, rgba(var(--marca-rgb),.28), rgba(var(--marca-rgb),.1))}
:root[data-cor][data-theme="light"]:not([data-tema]) .bg-a792c6{background:linear-gradient(100deg, rgba(var(--marca-rgb),.14), transparent 70%)}
:root[data-cor][data-theme="light"]:not([data-tema]) .bg-b6ea16{background:linear-gradient(180deg,var(--marca),rgba(var(--marca-rgb),.35))}
:root[data-cor][data-theme="light"]:not([data-tema]) .bg-b9b7b8{background:linear-gradient(150deg,rgba(255,174,26,.45),rgba(var(--marca-rgb),.35))}
:root[data-cor][data-theme="light"]:not([data-tema]) .bg-c1785c{background:linear-gradient(100deg, rgba(var(--marca-rgb),.3), rgba(var(--marca-rgb),.12))}
:root[data-cor][data-theme="light"]:not([data-tema]) .bg-cdd63a{background:linear-gradient(155deg, rgba(var(--marca-rgb),.22), rgba(139,107,255,.14))}
:root[data-cor][data-theme="light"]:not([data-tema]) .bg-d91092{background:linear-gradient(150deg, rgba(var(--marca-rgb),.32), rgba(139,107,255,.2))}
:root[data-cor][data-theme="light"]:not([data-tema]) .bg-dd7d0b{background:linear-gradient(150deg,var(--marca),#8B6BFF)}
:root[data-cor][data-theme="light"]:not([data-tema]) .bg-eae919{background:linear-gradient(100deg, rgba(var(--marca-rgb),.28), rgba(var(--marca-rgb),.08))}
:root[data-cor][data-theme="light"]:not([data-tema]) .c-ff4d8d{color:var(--marca-escura)}
:root[data-cor][data-theme="light"]:not([data-tema]) .c-ff9ec4{color:var(--marca-escura)}
:root[data-cor][data-theme="light"]:not([data-tema]) .sh-27796a{box-shadow:0 0 0 2px rgba(255,255,255,1), 0 8px 20px -8px rgba(var(--marca-rgb),.9)}
:root[data-cor][data-theme="light"]:not([data-tema]) .sh-7d02db{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 10px 26px -8px rgba(var(--marca-rgb),.6)}
:root[data-cor][data-theme="light"]:not([data-tema]) .sh-7d2328{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 26px 60px -30px rgba(23,17,28,0.255), 0 0 0 4px rgba(var(--marca-rgb),.1)}
:root[data-cor][data-theme="light"]:not([data-tema]) .sh-8378b0{box-shadow:0 14px 34px -10px rgba(var(--marca-rgb),.9), inset 0 1px 0 rgba(255,255,255,0.95)}
:root[data-cor][data-theme="light"]:not([data-tema]) .sh-88185f{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 12px 30px -10px rgba(var(--marca-rgb),.7)}
@media (prefers-color-scheme: light){
  :root[data-cor]:not([data-tema]):not([data-theme]) .bg-3364ba{background:linear-gradient(160deg, rgba(var(--marca-rgb),.6), rgba(139,107,255,.3))}
  :root[data-cor]:not([data-tema]):not([data-theme]) .bg-36aabb{background:linear-gradient(100deg, rgba(var(--marca-rgb),.26), rgba(var(--marca-rgb),.1))}
  :root[data-cor]:not([data-tema]):not([data-theme]) .bg-40957f{background:linear-gradient(120deg, rgba(var(--marca-rgb),.3), rgba(var(--marca-rgb),.1))}
  :root[data-cor]:not([data-tema]):not([data-theme]) .bg-4a6d30{background:linear-gradient(150deg, rgba(var(--marca-rgb),.5), rgba(var(--marca-rgb),.24))}
  :root[data-cor]:not([data-tema]):not([data-theme]) .bg-5d5034{background:linear-gradient(90deg,var(--marca),var(--marca-clara))}
  :root[data-cor]:not([data-tema]):not([data-theme]) .bg-603bde{background:linear-gradient(100deg, rgba(var(--marca-rgb),.2), transparent 70%)}
  :root[data-cor]:not([data-tema]):not([data-theme]) .bg-936d27{background:linear-gradient(155deg, rgba(var(--marca-rgb),.2), rgba(139,107,255,.14))}
  :root[data-cor]:not([data-tema]):not([data-theme]) .bg-a0c938{background:linear-gradient(120deg, rgba(var(--marca-rgb),.28), rgba(var(--marca-rgb),.1))}
  :root[data-cor]:not([data-tema]):not([data-theme]) .bg-a792c6{background:linear-gradient(100deg, rgba(var(--marca-rgb),.14), transparent 70%)}
  :root[data-cor]:not([data-tema]):not([data-theme]) .bg-b6ea16{background:linear-gradient(180deg,var(--marca),rgba(var(--marca-rgb),.35))}
  :root[data-cor]:not([data-tema]):not([data-theme]) .bg-b9b7b8{background:linear-gradient(150deg,rgba(255,174,26,.45),rgba(var(--marca-rgb),.35))}
  :root[data-cor]:not([data-tema]):not([data-theme]) .bg-c1785c{background:linear-gradient(100deg, rgba(var(--marca-rgb),.3), rgba(var(--marca-rgb),.12))}
  :root[data-cor]:not([data-tema]):not([data-theme]) .bg-cdd63a{background:linear-gradient(155deg, rgba(var(--marca-rgb),.22), rgba(139,107,255,.14))}
  :root[data-cor]:not([data-tema]):not([data-theme]) .bg-d91092{background:linear-gradient(150deg, rgba(var(--marca-rgb),.32), rgba(139,107,255,.2))}
  :root[data-cor]:not([data-tema]):not([data-theme]) .bg-dd7d0b{background:linear-gradient(150deg,var(--marca),#8B6BFF)}
  :root[data-cor]:not([data-tema]):not([data-theme]) .bg-eae919{background:linear-gradient(100deg, rgba(var(--marca-rgb),.28), rgba(var(--marca-rgb),.08))}
  :root[data-cor]:not([data-tema]):not([data-theme]) .c-ff4d8d{color:var(--marca-escura)}
  :root[data-cor]:not([data-tema]):not([data-theme]) .c-ff9ec4{color:var(--marca-escura)}
  :root[data-cor]:not([data-tema]):not([data-theme]) .sh-27796a{box-shadow:0 0 0 2px rgba(255,255,255,1), 0 8px 20px -8px rgba(var(--marca-rgb),.9)}
  :root[data-cor]:not([data-tema]):not([data-theme]) .sh-7d02db{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 10px 26px -8px rgba(var(--marca-rgb),.6)}
  :root[data-cor]:not([data-tema]):not([data-theme]) .sh-7d2328{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 26px 60px -30px rgba(23,17,28,0.255), 0 0 0 4px rgba(var(--marca-rgb),.1)}
  :root[data-cor]:not([data-tema]):not([data-theme]) .sh-8378b0{box-shadow:0 14px 34px -10px rgba(var(--marca-rgb),.9), inset 0 1px 0 rgba(255,255,255,0.95)}
  :root[data-cor]:not([data-tema]):not([data-theme]) .sh-88185f{box-shadow:inset 0 1px 0 rgba(255,255,255,0.855), 0 12px 30px -10px rgba(var(--marca-rgb),.7)}
}

/* --- tipografia --- */
:root[data-tipografia="manrope"] .ff-483e42{font-family:Manrope,-apple-system,BlinkMacSystemFont,sans-serif}
/* A prancheta do canvas tem 1440x900 fixos. Na aplicacao ela vira a janela:
   o quadro ocupa a viewport e o conteudo rola dentro da coluna, nao na pagina —
   e assim o trilho fica parado, como no design. */
/* LARGURA CHEIA (29/08/2026, decisao do dono): o quadro ocupa a tela inteira,
   sem teto e sem margem lateral. O medo era o monitor largo esticar os cartoes
   ate virarem faixas; quem resolve isso agora e a coluna da direita, que tem
   largura fixa de 352px no canvas, mais os limites de leitura das listas.
   Se um dia um bloco esticar demais, o limite vai NELE, nao no quadro. */
.quadro{position:relative;height:100dvh;overflow:hidden;
  width:100%;margin:0;
  container-type:inline-size}
@supports not (height:100dvh){.quadro{height:-webkit-fill-available}}
.quadro>.pos-relative{height:100%}
/* a coluna de conteudo e quem rola */
.quadro .fx-1.minw-0.d-flex.fd-column{overflow-y:auto;overscroll-behavior:contain}

/* A faixa de modo-leitura nao existe no canvas. Ela e verdade que precisa aparecer,
   entao flutua por cima em vez de empurrar a moldura para fora da tela. */
.leitura-banner{position:fixed;left:0;right:0;top:0;z-index:60;text-align:center;
  padding:7px 16px;font:600 12px/1.35 var(--fonte-texto);
  color:var(--ink);background:var(--solido-fraco);
  -webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border-bottom:1px solid var(--line)}
.leitura-banner ~ .quadro{padding-top:30px}

/* A prancheta tem 900px fixos; a janela nao. Onde o canvas usa minh-0 para
   dizer "esta area encolhe", a aplicacao precisa dizer tambem que ela ROLA —
   senao o conteudo passa por baixo do rodape fixo do assistente. */
.quadro .minh-0{min-height:0}
.quadro .fx-1.minh-0,
.quadro .fx-1.minw-0.d-flex.fd-column{overflow-y:auto;overscroll-behavior:contain}
.quadro .d-grid{min-width:0}
/* barras de rolagem discretas, para nao competir com o desenho */
.quadro *::-webkit-scrollbar{width:8px;height:8px}
.quadro *::-webkit-scrollbar-thumb{background:var(--line-strong);border-radius:99px}
.quadro *::-webkit-scrollbar-track{background:transparent}

/* A prancheta tem altura fixa de 900px; a janela nao tem. No PAINEL, a linha de
   baixo (servicos + meta) fica com a sobra — senao ela flutua no meio do
   monitor. Regra estreita de proposito: uma versao larga disto esticou uma
   linha de opcoes dentro dos Ajustes. */
.quadro.tela-1b .fx-1.minw-0.d-flex.fd-column > .d-flex.g-18px:last-of-type{
  flex:1; min-height:0; align-items:stretch;
}

/* Marcadores de tela. Cada prancheta se identifica no proprio quadro, para
   dar onde escrever regra de UMA tela sem tocar nas classes do canvas.
   Sem estilo proprio: existem para serem alvo. */
.tela-1b,
.tela-1c,
.tela-3a,
.tela-3c,
.tela-4a,
.tela-4b,
.tela-5a,
.tela-5b,
.tela-5c,
.tela-5e,
.tela-5f,
.tela-5g,
.tela-5i,
.tela-5j,
.tela-5k,
.tela-5l,
.tela-5m,
.tela-5n,
.tela-5o,
.tela-5p,
.tela-5q,
.tela-5r,
.tela-5s,
.tela-5v,
.tela-5w,
.tela-5y{}

/* Campo com flex:1 nao encolhe sozinho: sem min-width:0 ele fica na largura
   intrinseca e empurra o botao ao lado para fora do cartao. Foi o que cortava o
   "Definir" na meta do Painel. Vale para todo campo do app. */
.quadro input,.quadro select,.quadro textarea{ min-width:0; max-width:100% }
.quadro .fx-1{ min-width:0 }

/* O anel que pulsa no ponto "em campo" e decoracao: nao pode gerar rolagem. */
.quadro .pos-relative > .pos-absolute.r-99px{ pointer-events:none }
.quadro .w-9px.pos-relative,.quadro .w-8px.pos-relative{ overflow:visible }

/* ============================================================================
   ESTREITO — o degrau que faltava entre o celular e os 1440px do canvas.

   A prancheta foi medida para 1440. Abaixo de ~1200 a linha de conteudo
   (miolo elastico + coluna fixa de 340-390px) espremia o miolo: em 1024 o
   "R$ 4.020,00" quebrava em duas linhas, o bloco de ticket/quitado virava
   coluna de 60px e o rodape da tela era cortado. E 1024 nao e hipotese: o
   painel do artifact costuma abrir entre 700 e 1000px.

   Container query, nao media query: o .quadro ja e `container-type:inline-size`,
   entao a regra responde a LARGURA DO QUADRO — vale igual na janela inteira, no
   painel do artifact e num iframe.

   O que muda, e so isto: a linha de conteudo empilha, a coluna fixa vira faixa
   cheia, os cabecalhos passam a quebrar, e os dois corpos gigantes encolhem por
   escala do proprio container. Nenhuma cor, nenhum raio, nenhum espaco novo.
   ============================================================================ */
@container (max-width:1180px){
  /* 1. a linha [miolo | coluna] empilha e CRESCE; quem rola continua sendo a
     coluna de conteudo, como no largo. Um so rolador: se a linha tambem
     rolasse, o polegar teria de adivinhar em qual dos dois esta. */
  .quadro .fx-1.d-flex.minh-0{
    flex-direction:column; flex:none; min-height:auto; overflow:visible;
  }
  .quadro .fx-1.d-flex.minh-0 > .fx-1{ overflow:visible; min-height:auto }
  .quadro .fx-1.d-flex.minh-0 > [class*="w-"].fx-none{ width:100%; min-height:auto }
  /* Em algumas pranchetas (Pessoas, 5f) a coluna de conteudo E a propria linha:
     um elemento so, filho direto do quadro. Nesse caso ela empilha os filhos MAS
     continua sendo quem preenche a largura ao lado do trilho e quem rola — com
     `flex:none` ela crescia para a largura do conteudo e vazava 216px. */
  .quadro > .pos-relative > .fx-1.d-flex.minh-0{
    flex:1 1 0%; min-width:0; overflow-y:auto; overscroll-behavior:contain;
  }

  /* 2. cabecalho e blocos em linha passam a quebrar em vez de espremer */
  .quadro .d-flex.ai-flex-end,
  .quadro .d-flex.ai-flex-start{ flex-wrap:wrap; row-gap:14px }

  /* 3. os corpos grandes acompanham a largura do container */
  .quadro .fs-76px{ font-size:clamp(38px,5.4cqi,76px) }
  .quadro .fs-40px{ font-size:clamp(26px,3cqi,40px) }
  .quadro .fs-34px{ font-size:clamp(24px,2.6cqi,34px) }

  /* 4. no Painel a linha de baixo (servicos + meta) tambem empilha */
  .quadro.tela-1b .fx-1.minw-0.d-flex.fd-column > .d-flex.g-18px:last-of-type{
    flex-direction:column; flex:none;
  }
}

/* Numero que muda de largura ao mudar de valor faz a linha inteira dancar: o
   "R$ 4.020,00" virava "R$ 11.900,00" e empurrava ticket e quitado para o lado.
   Algarismo tabular resolve — todo digito ocupa a mesma caixa. Vale para as tres
   fontes do sistema; onde a fonte nao tiver o recurso, nada acontece. */
.quadro{font-variant-numeric:tabular-nums}

/* A linha de baixo do Painel ganhou um terceiro cartao (dias da semana) e tres
   cartoes mais a meta de 330px nao cabem lado a lado numa janela de 1440 com o
   trilho aberto: "Make + Hair A" quebrava em duas linhas. Entao a linha QUEBRA
   quando falta largura — cada cartao guarda um minimo legivel e a meta desce
   sozinha. Num monitor largo os tres voltam para a mesma linha. */
/* O Painel não pode rolar (decisão do dono, 29/08): a linha de baixo cabe em UMA
   linha a partir de ~1400px de quadro, e só quebra quando a largura não dá.
   290 de mínimo forçava a quebra já em 1440 e sobravam 250px de rolagem. */
.quadro.tela-1b .d-flex.g-18px:not(.fx-1){ flex-wrap:wrap }
.quadro.tela-1b .d-flex.g-18px:not(.fx-1) > .fx-1{ min-width:198px }

/* ---- leitura do gráfico do Painel (hover) ----
   Uma fatia transparente por balde, cobrindo a coluna toda. O canvas não desenha
   nenhum destes estados: gráfico de prancheta é imagem parada. */
.quadro .grafico-fatias{position:absolute;inset:0;z-index:2}
.quadro .fatia{position:absolute;top:0;bottom:14px;cursor:crosshair}
.quadro .fatia .guia,
.quadro .fatia .alvo,
.quadro .fatia .ponta{opacity:0;transition:opacity .1s ease;pointer-events:none}
.quadro .fatia:hover .guia,
.quadro .fatia:hover .alvo,
.quadro .fatia:hover .ponta{opacity:1}
.quadro .fatia .guia{
  position:absolute;top:0;bottom:0;width:1px;margin-left:-.5px;
  background:linear-gradient(180deg,rgba(255,77,141,0),rgba(255,77,141,.55));
}
/* o ponto exato do dado: o balão sai daqui, e o olho confere que é este */
.quadro .fatia .alvo{
  position:absolute;width:11px;height:11px;border-radius:99px;margin:-5.5px 0 0 -5.5px;
  background:var(--alvo-miolo);border:3px solid var(--berry);
}
.quadro .fatia .ponta{
  position:absolute;display:block;white-space:nowrap;
  padding:6px 10px;border-radius:11px;
  background:var(--solido);border:1px solid var(--line-strong);
  box-shadow:0 12px 30px -12px rgba(0,0,0,.9);
  font:600 11px/1.35 var(--fonte-texto);color:var(--ink-55);
}
.quadro .fatia .ponta b{
  display:block;font:800 13.5px/1.2 var(--fonte-mono);color:var(--ink);letter-spacing:-.01em;
}
@media (prefers-reduced-motion:reduce){
  .quadro .fatia .guia,.quadro .fatia .ponta{transition:none}
}
/* No toque não há hover: a fatia não pode virar uma área morta por cima do
   gráfico, então some. O eixo continua contando a história. */
@media (hover:none){ .quadro .grafico-fatias{ display:none } }

/* ---- o botão da média e o que ele desenha ----
   Ligado/desligado, e o hover explica: "média" sozinho não diz sobre o quê nem
   sobre quando, e um número de referência sem procedência é pior que nenhum. */
.quadro .media-caixa{position:relative;display:inline-flex}
.quadro .media-btn{border:1px solid var(--line-strong);background:transparent;
  color:var(--ink-45);display:flex;align-items:center;white-space:nowrap}
@media (hover:hover) and (pointer:fine){
  .quadro .media-btn:hover{color:var(--ink);border-color:var(--ink-40)}
}
.quadro .media-btn.ligada{
  background:var(--violeta-wash);border-color:var(--violeta);color:var(--violeta-2);
}
.quadro .media-btn.ligada::before{
  content:"";width:6px;height:6px;border-radius:99px;margin-right:7px;
  background:var(--violeta-2);
}

/* o balão de explicação, em CSS: a página é string, não tem laço de render */
.quadro .media-dica{
  position:absolute;z-index:90;top:calc(100% + 9px);right:0;width:290px;
  display:flex;flex-direction:column;gap:7px;
  padding:13px 15px;border-radius:16px;text-align:left;
  background:var(--tinta-ui);border:1px solid var(--line-strong);
  box-shadow:0 26px 60px -22px rgba(0,0,0,.9), var(--vidro-brilho);
  font:500 11.5px/1.5 var(--fonte-texto);color:var(--ink-70);
  opacity:0;visibility:hidden;transform:translateY(-4px);
  transition:opacity .12s ease, transform .12s ease, visibility .12s;
  pointer-events:none;
}
.quadro .media-dica b{color:var(--ink);font-weight:800}
.quadro .media-dica > b{font:800 12.5px/1.2 var(--fonte-display);letter-spacing:-.01em}
.quadro .media-dica em{font-style:normal;color:var(--violeta-2);font-weight:700}
.quadro .media-dica .fina{color:var(--ink-40);font-size:11px;
  padding-top:7px;border-top:1px solid var(--line)}
.quadro .media-caixa:hover .media-dica,
.quadro .media-btn:focus-visible + .media-dica{
  opacity:1;visibility:visible;transform:none;
}
@media (prefers-reduced-motion:reduce){ .quadro .media-dica{transition:none} }

/* a linha da média sobre o gráfico */
.quadro .media-linha{
  position:absolute;left:0;right:0;height:0;
  border-top:1px dashed var(--violeta-2);opacity:.75;pointer-events:none;
}
.quadro .media-linha i{
  position:absolute;right:0;bottom:4px;
  font:700 10px/1 var(--fonte-mono);letter-spacing:.04em;color:var(--violeta-2);
  background:var(--solido-fraco);border-radius:6px;padding:3px 6px;font-style:normal;
}
/* linha colada no topo: o rótulo desce, senão bate na legenda do gráfico */
.quadro .media-linha.abaixo i{bottom:auto;top:4px}

/* A faixa de operação: seis números numa linha. Abaixo de ~900px de quadro eles
   quebram em duas linhas em vez de espremer "Deslocamento cobrado" em 60px. */
.quadro .faixa-numeros{flex-wrap:wrap;row-gap:14px;gap:18px}
.quadro .faixa-numeros > div{min-width:100px}
@container (max-width:1180px){
  .quadro .faixa-numeros{gap:16px}
  .quadro .faixa-numeros > div{min-width:130px}
}

/* ---- pílula de seletor não pode mudar de largura ao ser escolhida ----
   O canvas pinta a selecionada em peso 800 e a apagada em 700. Pesos diferentes
   têm larguras diferentes: a barra inteira encolhia e crescia a cada clique, e
   os botões andavam embaixo do dedo (visto no Financeiro, no Painel e na
   Agenda). O peso não carrega significado aqui — quem diz "esta é a escolhida"
   é o fundo. Então todas as pílulas ficam em 800 e a barra para de dançar. */
.quadro button[class~="r-999px"]{font-weight:800}

/* ============================================================================
   FORMULÁRIO EM JANELA (decisão do dono, 29/08)

   As pranchetas de formulário (4a/4b/5a/5b, 5e, 5g) são desenhadas em folha
   cheia, como toda prancheta. Aqui elas viram janela sem uma linha de markup
   novo: o quadro deixa de ser a viewport e passa a ser a caixa da janela, com
   teto de altura e rolagem própria. A tela de trás continua montada atrás do
   véu — é ela que dá o contexto de onde se estava.
   ============================================================================ */
.janela-tela{
  position:fixed;inset:0;z-index:76;
  display:flex;align-items:center;justify-content:center;padding:28px;
  pointer-events:none;
}
.janela-tela > .quadro{
  pointer-events:auto;
  height:auto;max-height:min(880px,calc(100dvh - 56px));
  width:min(1080px,100%);
  border-radius:28px;overflow:auto;overscroll-behavior:contain;
  border:1px solid var(--line-strong);
  box-shadow:0 44px 110px -30px rgba(0,0,0,.92), var(--vidro-brilho);
  animation:janela-entra .16s cubic-bezier(.2,.7,.3,1);
}
@keyframes janela-entra{
  from{opacity:0;transform:translateY(10px) scale(.985)}
  to{opacity:1;transform:none}
}
@media (prefers-reduced-motion:reduce){ .janela-tela > .quadro{animation:none} }
/* O "fundo" da prancheta é só uma vinheta — um gradiente que escurece as bordas
   sobre o fundo da PÁGINA. Numa janela não há página atrás, então ele deixava a
   janela transparente e o calendário atravessava o formulário. A vinheta sai e a
   janela ganha fundo próprio. */
.janela-tela > .quadro{background:var(--tinta-ui)}
.janela-tela > .quadro > .pos-absolute.inset-0{display:none}
.janela-tela > .quadro > .pos-relative{height:auto;min-height:100%}
/* sem trilho dentro da janela: a navegação é a da tela de trás */
.janela-tela .trilho{display:none}
@media (max-width:759.98px){
  .janela-tela{padding:0}
  .janela-tela > .quadro{max-height:100dvh;border-radius:0;border:0}
}
/* marcador da ficha (janela sem prancheta no canvas) */
.tela-ficha{}

/* ---- o botão de lançar ----
   Era do trilho; mudou de lugar para a Agenda a pedido do dono, e o desenho veio
   junto inteiro: ladrilho rosa de 52px, raio 18, o mesmo brilho e a mesma sombra
   do canvas. Mudou de lugar, não de desenho. */
.quadro .acao-lancar{
  display:flex; align-items:center; gap:11px;
  padding:0; border:0; background:none; cursor:pointer; color:var(--ink);
  font:800 13.5px/1 var(--fonte-texto);
}
.quadro .acao-lancar .mais{
  width:52px; height:52px; border-radius:18px; background:#FF4D8D; color:#fff; flex:none;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 14px 34px -10px rgba(255,77,141,.9), inset 0 1px 0 rgba(255,255,255,.5);
  transition:transform .13s cubic-bezier(.2,.7,.3,1), box-shadow .13s ease;
}
@media (hover:hover) and (pointer:fine){
  .quadro .acao-lancar:hover .mais{ transform:translateY(-2px);
    box-shadow:0 18px 40px -10px rgba(255,77,141,1), inset 0 1px 0 rgba(255,255,255,.5) }
}
.quadro .acao-lancar:active .mais{ transform:translateY(1px) scale(.97);
  box-shadow:0 8px 20px -10px rgba(255,77,141,.9), inset 0 1px 0 rgba(255,255,255,.4) }
.quadro .acao-lancar:focus-visible{ outline:2px solid var(--berry); outline-offset:3px }
@media (prefers-reduced-motion:reduce){ .quadro .acao-lancar .mais{ transition:none } }
/* marcador da tela de entrar */
/* "Últimos endereços" saiu da Nova reserva (30/08, pedido do dono): quem
   preenche o endereço agora é o CEP. O texto do título é cravado na prancheta,
   então o cartão inteiro sai pelo escopo — mesma técnica dos Ajustes. */
.quadro.tela-4a .w-800px > .fx-1.minh-0{display:none}

.tela-entrar{}

/* ---- Ajustes 5p: uma prancheta, duas perguntas ----
   O canvas juntou "Deslocamento" e "Marca e aparência" numa tela só, mas o menu
   as separa — quem clicava em Marca via a tarifa por km ao lado. O escopo
   esconde a metade que não foi pedida, e a que fica ocupa a largura. */
.quadro.esc-marca .fx-1.minh-0.d-flex.g-14px > .fx-1.minw-0{display:none}
.quadro.esc-marca .fx-1.minh-0.d-flex.g-14px > .w-340px{width:100%;max-width:560px}
.quadro.esc-desloc .fx-1.minh-0.d-flex.g-14px > .w-340px{display:none}
/* O segundo cartão do canvas era "Exceções por bairro" — valor fechado por
   bairro, que é exatamente o que o cálculo por rota substitui. Some, e a tela
   fica com o que foi pedido: só a cobrança. O rodapé fixo do canvas também
   sai, porque ele fala de pedágio, que deixou de existir. */
/* O caminho completo importa: a PRÓPRIA linha de cartões é `.fx-1.minh-0`
   dentro de um `.fx-1.minw-0`, então o seletor curto escondia a tela inteira. */
.quadro.esc-desloc .fx-1.minh-0.d-flex.g-14px > .fx-1.minw-0 > .fx-1.minh-0{display:none}
.quadro.esc-desloc .fx-1.minh-0.d-flex.g-14px > .fx-1.minw-0 > div:first-child{max-width:640px}
.quadro.esc-desloc .mt-14px.f-a6a9e3{display:none}

/* ---- o Painel cabe na tela (decisão do dono, 29/08) ----
   A prancheta tem 900px de altura fixa e a aplicação ganhou desde então a faixa
   de operação e o cartão de dias da semana. Sobravam ~30px de rolagem numa
   janela de 900. Em vez de cortar um bloco, o Painel aperta o espaço MORTO:
   respiro entre cartões e enchimento do cartão do KPI. Nada de conteúdo sai. */
.quadro.tela-1b .fx-1.minw-0.d-flex.fd-column.g-18px{gap:13px}
.quadro.tela-1b .p-26px-28px{padding:20px 28px}
.quadro.tela-1b .mt-22px{margin-top:16px}
.quadro.tela-1b .faixa-numeros{padding:15px 22px}
/* Serviços carrega nomes longos ("Make + Hair A"); dias da semana são sete
   colunas de largura fixa. Dividir a sobra meio a meio quebrava os nomes em duas
   linhas — a coluna de dias cede o que não usa. */
.quadro.tela-1b .d-flex.g-18px:not(.fx-1) > .fx-1:nth-child(2){flex:0 1 216px}
/* Estados que o canvas nao desenhou.

   O design mostra cada tela num estado so — o interruptor de GPS aparece ligado,
   por exemplo. A aplicacao precisa do outro lado de cada um. Estas regras usam
   os MESMOS valores do canvas; nada aqui inventa medida ou cor nova.

   Regra da casa: se uma classe daqui virar desenho de verdade, ela sobe para o
   canvas e sai deste arquivo. */

/* interruptor desligado: o botao do canvas mora em right:3px quando ligado */
.left-3px{left:3px}

/* ENTRAR E TROCAR SENHA: a janela pode ser mais baixa que o cartão.

   O cartão de entrar tem 641px e pede 761px de janela com o respiro de 60px.
   Abaixo disso o `ai-center` corta em cima E EMBAIXO — e o corte é INALCANÇÁVEL,
   porque no desktop `html`, `body` e `.quadro` são todos `overflow:hidden`
   (10-base.css). Medido em 04/09/2026: a 600px de altura somem 21px do topo; a
   420px, 111px. Não há barra de rolagem para trazer de volta: a pessoa fica
   olhando um formulário decapitado, e num monitor mais baixo o que some é o
   botão de entrar.

   Duas linhas resolvem, sem tocar no canvas: rolagem própria aqui, e
   `safe center`, que abandona a centralização quando ela começaria a cortar
   (o navegador passa a alinhar pelo começo em vez de esconder o topo). */
.quadro.tela-entrar > .pos-relative{ overflow-y:auto; align-items:safe center }

/* A FOLHA QUE VEM DO CANVAS (5x, F0.13).

   `.folha` tem 420px, fundo próprio, borda e padding — ela foi desenhada para
   conter markup de componente (chips, opções, um h3). O cartão da 5x já traz o
   vidro, a borda, a sombra e a largura DO CANVAS; deixar a `.folha` por baixo é
   pintar duas caixas uma dentro da outra, com dois raios de canto diferentes.

   Aqui ela sai da frente e vira só o posicionamento: fixa, centrada, acima do
   véu. Nenhuma medida nova — o tamanho é o que a prancheta desenhou. */
.folha.folha-do-canvas{width:auto;padding:0;
  background:none;border:0;box-shadow:none;border-radius:0;overflow:visible}

/* NO CELULAR o cartão do canvas não cabe. Ele foi desenhado a 640px, num quadro
   de 1440 — a prancheta de 390 entra no extrator só na F1.13 —, e num iPhone de
   375 ele vaza pela direita: o texto corta e a página ganha rolagem horizontal,
   que é o defeito que os testes de iOS existem para impedir.

   Aqui a folha volta a ser o que toda folha desta casa é no celular: uma gaveta
   de baixo, largura inteira (`20-componentes.css:131`). O cartão solta a largura
   fixa e segue com as MESMAS cores, bordas e espaços do canvas — nada aqui
   inventa medida. Quando a prancheta de celular chegar, estas cinco linhas saem. */
@media (max-width:759.98px){
  .folha.folha-do-canvas{left:0;right:0;bottom:var(--teclado,0px);transform:none;
    max-height:88vh;overflow-y:auto}
  .folha.folha-do-canvas > *{width:auto;border-radius:16px 16px 0 0;padding:24px 20px}
}

/* `.ta-left` — o canvas define `ta-center` e `ta-right` e nunca precisou do
   esquerdo, porque na prancheta todo texto já nasce à esquerda. Os BOTÕES não:
   o navegador centraliza o texto de um <button>, e três cartões que viram
   botão (a faixa de rascunhos e os cartões da semana na Agenda, o cartão
   clicável do Financeiro) pedem `ta-left` para o texto ficar onde a prancheta
   o desenhou. A classe não existia em CSS nenhum: o texto saía centralizado e
   nada reclamava. O CLAUDE.md a listava como órfã em estados que o seed não
   monta; quem a pegou foi a auditoria por papel (F1.09), no Financeiro visto
   pela profissional. */
.ta-left{text-align:left}

/* OS MARCADORES DAS TRÊS PRANCHETAS NOVAS (5d entrar, 6a Boas-vindas, 6p
   Configurar a casa).

   Cada prancheta se identifica no próprio quadro — `.tela-<id>` —, e a lista
   desses marcadores mora em `96-quadro.css`, sem estilo: eles existem para
   serem alvo. As três novas entram aqui porque o `96-quadro.css` está sendo
   mexido noutra cópia nesta rodada; na fusão elas sobem para a lista de lá e
   saem daqui, como manda a regra deste arquivo. */
.tela-5d,
.tela-6a,
.tela-6p{}

/* A 6p ROLA A COLUNA DO MEIO, e o `96-quadro.css` já dá isso a toda tela: quem
   rola é `.fx-1.minw-0.d-flex.fd-column`. O que a 6p acrescenta é a GRADE — treze
   cartões em três colunas com `grid-auto-rows:1fr` numa janela que não tem os
   900px da prancheta. Sem altura mínima de linha, uma janela baixa espreme o
   cartão até o resumo sumir atrás do número. O valor é o do próprio cartão do
   canvas (34px do número + 16px de padding em cima e embaixo + as duas linhas
   de texto), não uma medida nova. */
.tela-6p .d-grid.gtc-1fr-1fr-1fr{grid-auto-rows:minmax(112px,1fr)}

/* A 6a e a 5d são cartão centrado, como a tela de entrar — e pela mesma razão
   dela precisam de rolagem própria quando a janela é mais baixa que o cartão
   (ver o bloco de `.tela-entrar`, acima: sem isto o corte é INALCANÇÁVEL, porque
   `html`, `body` e `.quadro` são `overflow:hidden`). */
.quadro.tela-6a > .pos-relative{ overflow-y:auto; align-items:safe center }

/* ---- A 6q como MOLDE de três seções dos Ajustes (21/09/2026) ----

   O canvas revisado pôs doze itens no menu e desenhou onze deles. Faltam a 6b
   ("Como você trabalha", que a Boas-vindas pergunta) e a 6h (Fiscal, no lote B
   da fase 5 — F1.28b diz por escrito que até lá os campos entram por
   `C.linhaForm`). As duas usam o esqueleto da 6q, que é o único da leva com a
   forma de que elas precisam: cartões à esquerda e um cartão de ESTADO à
   direita. Nenhuma medida nova — o que muda é QUAL cartão aparece, e é isso que
   estas regras fazem, pela mesma técnica de `esc-marca`/`esc-desloc` (96-quadro).

   Quando a 6b e a 6h forem desenhadas, cada seção passa a ter a sua prancheta e
   estas regras saem daqui. */

.tela-6q{}

/* "Como você trabalha" é um recado curto: só o primeiro cartão. */

.quadro.esc-modo .fx-1.minh-0.d-flex.g-14px > .fx-1.minw-0 > div:nth-child(n+2){display:none}

.quadro.esc-modo .fx-1.minh-0.d-flex.g-14px > .w-340px{display:none}

/* Fiscal usa o cartão dos dados, o recado do certificado e os dois da direita;
   o do meio (na 6q, os registros de DNS) não tem uso aqui. */

.quadro.esc-fiscal .fx-1.minh-0.d-flex.g-14px > .fx-1.minw-0 > div:nth-child(2){display:none}

/* Endereço, nos três estados que a rota `/api/dominio` devolve:
   sem token no servidor — não há registro nem envio a mostrar, e a resposta
   honesta é o cartão "ainda não disponível"; */

.quadro.esc-dominio-off .fx-1.minh-0.d-flex.g-14px > .fx-1.minw-0 > div:nth-child(2),

.quadro.esc-dominio-off .fx-1.minh-0.d-flex.g-14px > .fx-1.minw-0 > div:nth-child(3){display:none}

/* disponível e ainda sem domínio — não há registros a copiar; */

.quadro.esc-dominio-novo .fx-1.minh-0.d-flex.g-14px > .fx-1.minw-0 > div:nth-child(2){display:none}

.quadro.esc-dominio-novo .fx-1.minh-0.d-flex.g-14px > .w-340px > div:nth-child(2){display:none}

/* domínio enviado — tudo à mostra, menos o cartão do "não disponível". */

.quadro.esc-dominio-ativo .fx-1.minh-0.d-flex.g-14px > .w-340px > div:nth-child(2){display:none}

/* O ENVIO DO LOGO (5p, etapa 1.5).

   A prancheta desenha um CARTÃO — ícone, "Enviar logo", "PNG ou SVG até 200 KB"
   — e nenhum seletor de arquivo: o `<input type="file">` traz o botão do
   sistema, que não se pinta, e a regra da casa é que campo de preenchimento
   nunca dependa do controle nativo. Aqui ele entra invisível POR CIMA do
   cartão: o clique e o foco de teclado caem nele, e o que se vê continua sendo
   o que o canvas desenhou. */

.campo-arquivo{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}

/* `.p-16px` — órfã da reextração de 21/09/2026.

   Ela era do canvas: `padding:16px`, o enchimento do cartão da marca na 5p
   antiga. As pranchetas revisadas passaram a usar `p-12px` ali, e o extrator
   apaga do `95-canvas.css` toda classe que nenhuma prancheta usa — mas o botão
   "Voltar" da troca de senha voluntária (`src/alvo/servidor/33-senha.js:107`)
   continua pedindo por ela, e sem regra ele perdia o enchimento inteiro.

   O valor é o MESMO que o canvas tinha; nada aqui inventa medida. Quando a
   prancheta da troca de senha for desenhada, a classe volta ao canvas e esta
   linha sai. */

.p-16px{padding:16px}

/* OS MARCADORES DAS PRANCHETAS NOVAS (5d entrar, 6a Boas-vindas, 6c Equipe,
   6d Usuários, 6p Configurar a casa).

   Cada prancheta se identifica no próprio quadro — `.tela-<id>` —, e a lista
   desses marcadores mora em `96-quadro.css`, sem estilo: eles existem para
   serem alvo. As novas entram aqui porque o `96-quadro.css` está sendo
   mexido noutra cópia nesta rodada; na fusão elas sobem para a lista de lá e
   saem daqui, como manda a regra deste arquivo. */

.tela-6c,

.tela-6d,
/* ============================================================================
   TRILHO — refeito em 29/08/2026 a pedido do dono.

   O que mudou e por quê:
   · todo destino é fixo (o "Mais" abria folha e escondia metade do sistema);
   · oito itens em três grupos separados por um fio, porque oito iguais em fila
     viram uma lista e ninguém acha nada;
   · ícone de traço de verdade (05-icones.js) no lugar do quadrado de raio
     variável, que era marcador da prancheta;
   · rodapé com o perfil e um balão — preferência de aparelho e a saída.

   As medidas do canvas continuam mandando onde existiam: ladrilho 48×48, raio
   15, marca 44 com raio 14, "+" de 52 com raio 18. O que é novo (grupo, fio,
   perfil, balão) segue os mesmos raios e a mesma escala de tinta.
   ============================================================================ */

:root{
  --trilho-aberto:216px;
  --trilho-fechado:78px;
  --trilho-pad:14px;
}

.trilho{
  flex:none; display:flex; flex-direction:column; gap:4px;
  width:var(--trilho-aberto); padding:20px var(--trilho-pad) 14px;
  position:relative;                     /* o balão do perfil se ancora aqui */
  transition:width .18s cubic-bezier(.2,.7,.3,1);
}
.trilho.recolhido{ width:var(--trilho-fechado); padding:20px 0 14px; align-items:center }
@media (prefers-reduced-motion:reduce){ .trilho{ transition:none } }

/* ---------------------------------------------------------------- topo ---- */
.trilho .topo{ display:flex; align-items:center; gap:12px; margin-bottom:18px }
.trilho.recolhido .topo{ flex-direction:column; gap:10px; margin-bottom:14px }
.trilho .marca{
  width:44px; height:44px; border-radius:14px; flex:none;
  background:linear-gradient(150deg,#FF4D8D,#8B6BFF);
  display:flex; align-items:center; justify-content:center;
  font:800 15px/1 var(--fonte-texto); color:#fff; letter-spacing:.02em;
  box-shadow:0 10px 26px -8px rgba(255,77,141,.8);
}
.trilho .marca-nome{
  flex:1; min-width:0;
  font:800 16px/1 var(--fonte-display); letter-spacing:-.03em; color:var(--ink);
}
.trilho.recolhido .marca-nome{ display:none }
.trilho .alternar{
  width:30px; height:30px; flex:none; border-radius:10px;
  display:flex; align-items:center; justify-content:center;
  color:var(--ink-40); border:1px solid transparent;
}
.trilho .alternar:hover{ color:var(--ink); background:var(--toque-veu); border-color:var(--line) }

/* --------------------------------------------------------------- grupos ---- */
.trilho .grupo{ display:flex; flex-direction:column; gap:2px }
.trilho.recolhido .grupo{ align-items:center; gap:6px }
.trilho .sep{
  height:1px; background:var(--line); margin:11px 6px;
}
.trilho.recolhido .sep{ width:34px; margin:9px 0 }

/* ----------------------------------------------------------------- abas ---- */
.trilho .aba{
  display:flex; align-items:center; gap:11px;
  padding:0 10px 0 0; border:0; background:none; cursor:pointer;
  border-radius:15px; color:var(--ink-55); text-align:left;
  font:700 13.5px/1 var(--fonte-texto); letter-spacing:-.005em;
  transition:color .13s ease, background-color .13s ease;
}
.trilho.recolhido .aba{ padding:0 }
.trilho .aba .ladrilho{
  width:48px; height:48px; flex:none; border-radius:15px;
  display:flex; align-items:center; justify-content:center; position:relative;
  border:1px solid transparent;
  transition:background-color .13s ease, border-color .13s ease, box-shadow .13s ease;
}
.trilho .aba .rotulo{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.trilho.recolhido .aba .rotulo{ display:none }

/* --- os quatro estados de uma aba --- */
/* 1. sem seleção: o ícone vive a 45% da tinta; o rótulo, a 55% */
.trilho .aba .ico{ color:var(--ink-45); transition:color .13s ease }
/* 2. hover: a tinta vem à frente e o ladrilho ganha chão */
@media (hover:hover) and (pointer:fine){
  .trilho .aba:hover{ color:var(--ink) }
  .trilho .aba:hover .ico{ color:var(--ink) }
  .trilho .aba:hover .ladrilho{ background:var(--toque-veu) }
  .trilho .aba.aceso:hover .ladrilho{ background:rgba(255,255,255,.18) }
}
/* 3. momento do clique: o ladrilho afunda 1px — o único movimento do trilho */
.trilho .aba:active .ladrilho{ transform:translateY(1px) }
/* 4. selecionado: o vidro do canvas, e o rótulo em peso 800 */
.trilho .aba.aceso{ color:var(--ink) }
.trilho .aba.aceso .rotulo{ font-weight:800 }
.trilho .aba.aceso .ladrilho{
  background:rgba(255,255,255,.13); border-color:rgba(255,255,255,.2);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.45);
  -webkit-backdrop-filter:blur(20px); backdrop-filter:blur(20px);
}
.trilho .aba.aceso .ico{ color:#fff }
/* 5. foco de teclado: anel visível, sempre */
.trilho .aba:focus-visible,
.trilho .alternar:focus-visible,
.trilho .perfil:focus-visible{ outline:2px solid var(--berry); outline-offset:3px }

/* No tema claro o vidro branco some contra o fundo areia: o aceso vira véu de
   tinta. ATENÇÃO à guarda: `:root:not([data-tema]):not([data-theme])` sozinho vale também
   no ESCURO do sistema (que não estampa atributo nenhum) — foi assim que o
   balão do perfil saiu branco com texto branco na primeira revisão. Sem a media
   query, a regra do claro pinta o escuro. */
@media (prefers-color-scheme: light){
  :root:not([data-tema]):not([data-theme]) .trilho .aba.aceso .ladrilho{
    background:rgba(23,17,28,.07); border-color:rgba(23,17,28,.12);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
  }
  :root:not([data-tema]):not([data-theme]) .trilho .aba.aceso .ico{ color:var(--ink) }
  @media (hover:hover) and (pointer:fine){
    :root:not([data-tema]):not([data-theme]) .trilho .aba.aceso:hover .ladrilho{ background:rgba(23,17,28,.11) }
  }
}
:root[data-tema="claro"] .trilho .aba.aceso .ladrilho,
:root[data-theme="light"]:not([data-tema]) .trilho .aba.aceso .ladrilho{
  background:rgba(23,17,28,.07); border-color:rgba(23,17,28,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
}
:root[data-tema="claro"] .trilho .aba.aceso .ico,
:root[data-theme="light"]:not([data-tema]) .trilho .aba.aceso .ico{ color:var(--ink) }
@media (hover:hover) and (pointer:fine){
  :root[data-tema="claro"] .trilho .aba.aceso:hover .ladrilho,
:root[data-theme="light"]:not([data-tema]) .trilho .aba.aceso:hover .ladrilho{ background:rgba(23,17,28,.11) }
}

/* --- avisos sobre o ladrilho: número em Pedidos, ponto em Cobrança --- */
.trilho .aba .conta{
  position:absolute; top:2px; right:2px; min-width:18px; height:18px; padding:0 5px;
  border-radius:99px; background:var(--berry); color:#fff;
  font:800 10.5px/18px var(--fonte-mono); text-align:center;
  box-shadow:0 0 0 2px var(--ground);
}
.trilho .aba .ponto{
  position:absolute; top:7px; right:7px; width:9px; height:9px; border-radius:99px;
  background:var(--brass); box-shadow:0 0 0 2px var(--ground);
}

/* --------------------------------------------------------------- rodapé ---- */
.trilho .espaco{ flex:1; min-height:14px }

/* ---------------------------------------------------------------- perfil --- */
.trilho .perfil-caixa{ position:relative }
.trilho .perfil{
  display:flex; align-items:center; gap:10px; width:100%;
  padding:8px 10px 8px 8px; border-radius:16px; cursor:pointer;
  border:1px solid transparent; background:none; text-align:left; color:var(--ink);
  transition:background-color .13s ease, border-color .13s ease;
}
.trilho.recolhido .perfil{ padding:0; width:auto; justify-content:center }
.trilho .perfil .avatar{
  width:34px; height:34px; flex:none; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  background:var(--surface); border:1px solid var(--line-strong);
  font:800 12.5px/1 var(--fonte-texto); color:var(--ink); letter-spacing:.02em;
}
.trilho.recolhido .perfil .avatar{ width:44px; height:44px; border-radius:14px; font-size:14px }
.trilho .perfil-txt{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px }
.trilho .perfil-txt b{
  font:700 12.5px/1.15 var(--fonte-texto); color:var(--ink);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.trilho .perfil-txt small{ font:600 10.5px/1 var(--fonte-mono); color:var(--ink-45);
  letter-spacing:.08em; text-transform:uppercase }
.trilho .perfil .ico{ flex:none; color:var(--ink-40); transform:rotate(-90deg) }
.trilho.recolhido .perfil-txt,
.trilho.recolhido .perfil .ico{ display:none }
@media (hover:hover) and (pointer:fine){
  .trilho .perfil:hover{ background:var(--toque-veu); border-color:var(--line) }
}
.trilho .perfil.aberto{ background:var(--toque-veu); border-color:var(--line-strong) }
.trilho .perfil.aberto .ico{ transform:rotate(90deg); color:var(--ink) }

/* ----------------------------------------------------------------- balão --- */
.trilho .veu-perfil{ position:fixed; inset:0; z-index:78 }
.trilho .balao{
  position:absolute; z-index:80; bottom:calc(100% + 10px); left:0; width:272px;
  background:var(--tinta-ui); border:1px solid var(--line-strong); border-radius:20px;
  padding:6px; box-shadow:0 30px 70px -24px rgba(0,0,0,.85), var(--vidro-brilho);
  -webkit-backdrop-filter:var(--vidro-blur); backdrop-filter:var(--vidro-blur);
  animation:balao-entra .13s cubic-bezier(.2,.7,.3,1);
}
@media (prefers-color-scheme: light){
  :root:not([data-tema]):not([data-theme]) .trilho .balao{ background:#fff }
}
:root[data-tema="claro"] .trilho .balao,
:root[data-theme="light"]:not([data-tema]) .trilho .balao{ background:#fff }
.trilho.recolhido .balao{ left:6px }
@keyframes balao-entra{ from{ opacity:0; transform:translateY(6px) } to{ opacity:1; transform:none } }
@media (prefers-reduced-motion:reduce){ .trilho .balao{ animation:none } }

.trilho .balao-cab{ display:flex; align-items:center; gap:11px; padding:12px 12px 13px }
.trilho .balao-cab .avatar.grande{
  width:40px; height:40px; flex:none; border-radius:14px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(150deg,#FF4D8D,#8B6BFF); color:#fff;
  font:800 14px/1 var(--fonte-texto);
}
.trilho .balao-quem{ min-width:0; display:flex; flex-direction:column; gap:3px }
.trilho .balao-quem b{ font:800 14px/1.15 var(--fonte-display); letter-spacing:-.02em;
  color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis }
.trilho .acesso{ font:600 10.5px/1 var(--fonte-mono); letter-spacing:.06em;
  text-transform:uppercase }
.trilho .acesso.grava{ color:var(--good) }
.trilho .acesso.ler{ color:var(--brass) }
.trilho .acesso.espera{ color:var(--ink-40) }

.trilho .balao-secao{ padding:10px 12px 12px; border-top:1px solid var(--line) }
.trilho .balao-rot{
  display:block; margin-bottom:9px;
  font:600 10px/1 var(--fonte-mono); letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-40);
}
.trilho .balao-temas{ display:flex; gap:5px }
.trilho .balao-temas .tema{
  flex:1; min-width:0; display:flex; flex-direction:column; align-items:center; gap:6px;
  padding:10px 4px; border-radius:13px; cursor:pointer;
  border:1px solid var(--line); background:var(--surface-2); color:var(--ink-55);
  font:700 11px/1 var(--fonte-texto);
  transition:color .13s ease, background-color .13s ease, border-color .13s ease;
}
@media (hover:hover) and (pointer:fine){
  .trilho .balao-temas .tema:hover{ color:var(--ink); border-color:var(--line-strong) }
}
.trilho .balao-temas .tema:active{ transform:translateY(1px) }
.trilho .balao-temas .tema.sel{
  background:var(--berry-wash); border-color:var(--berry); color:var(--ink);
}
.trilho .balao-temas .tema.sel .ico{ color:var(--berry) }
.trilho .balao-temas .tema:focus-visible{ outline:2px solid var(--berry); outline-offset:2px }
.trilho .balao-nota{
  padding:0 12px 12px; margin:0 0 2px;
  font:500 11.5px/1.45 var(--fonte-texto); color:var(--ink-45);
}
.trilho .balao-pe{
  display:flex; justify-content:space-between; gap:10px;
  padding:9px 12px 10px; border-top:1px solid var(--line);
  font:500 10.5px/1 var(--fonte-mono); color:var(--ink-40); letter-spacing:.03em;
}
.trilho .balao-linhas{ padding:6px; border-top:1px solid var(--line) }
.trilho .balao-linhas button{
  display:flex; align-items:center; gap:11px; width:100%;
  padding:10px 10px; border-radius:12px; cursor:pointer;
  background:none; border:0; text-align:left; color:var(--ink-78);
  font:600 13px/1 var(--fonte-texto);
  transition:color .13s ease, background-color .13s ease;
}
.trilho .balao-linhas button .ico{ flex:none; color:var(--ink-45) }
@media (hover:hover) and (pointer:fine){
  .trilho .balao-linhas button:hover{ background:var(--toque-veu); color:var(--ink) }
  .trilho .balao-linhas button:hover .ico{ color:var(--ink) }
  .trilho .balao-linhas button.sair:hover{ background:var(--crit-wash); color:var(--crit) }
  .trilho .balao-linhas button.sair:hover .ico{ color:var(--crit) }
}
.trilho .balao-linhas button:active{ transform:translateY(1px) }
.trilho .balao-linhas button:focus-visible{ outline:2px solid var(--berry); outline-offset:-1px }
.trilho .balao-linhas button.sair{ color:var(--crit) }
.trilho .balao-linhas button.sair .ico{ color:var(--crit) }

/* --------------------------------------------------------------- celular --- */
/* O canvas 1d não tem barra de baixo, tem cápsula flutuante — o mobile é o
   próximo capítulo. Até lá a barra continua funcionando: cinco destinos, que é
   o que cabe. Os outros três moram no balão do perfil. */
@media (max-width:759.98px){
  .trilho{
    position:fixed; left:0; right:0; bottom:0; top:auto; z-index:40;
    width:auto; flex-direction:row; justify-content:space-around; gap:0; padding:0;
    height:calc(var(--nav-h) + env(safe-area-inset-bottom,0px));
    padding-bottom:env(safe-area-inset-bottom,0px);
    background:var(--surface); border-top:1px solid var(--line);
    -webkit-backdrop-filter:var(--vidro-blur); backdrop-filter:var(--vidro-blur);
  }
  .trilho .topo,.trilho .sep,.trilho .espaco,.trilho .perfil-txt{ display:none }
  .trilho .grupo{ display:contents }
  /* cabem cinco: Painel, Ordem, Agenda, Cobrança e Perfil (que abre o resto) */
  .trilho .aba[data-arg="financeiro"],
  .trilho .aba[data-arg="pessoas"],
  .trilho .aba[data-arg="pedidos"],
  .trilho .aba[data-arg="ajustes"]{ display:none }
  .trilho .aba{ flex:1; flex-direction:column; gap:3px; justify-content:center;
                font-size:10.5px; min-height:44px; padding:0 }
  .trilho .aba .rotulo{ display:block }
  .trilho .aba .ladrilho{ width:auto; height:auto; background:none!important;
                          border:0; box-shadow:none; backdrop-filter:none }
  .trilho .aba.aceso .ico{ color:var(--berry) }
  .trilho .aba.aceso{ color:var(--berry) }
  .trilho .perfil-caixa{ flex:1; display:flex; align-items:center; justify-content:center }
  .trilho .perfil{ width:auto; padding:0 }
  .trilho .perfil .ico{ display:none }
  .trilho .balao{ bottom:calc(100% + 14px); left:auto; right:8px; width:min(300px,calc(100vw - 16px)) }
}
/* ============================================================================
   ESTADOS DE TOQUE — o que o canvas não desenha.

   A prancheta mostra cada botão num estado só: parado. Ela não tem hover, não
   tem o instante do clique, não tem foco de teclado nem desabilitado. Sem esta
   camada a Central inteira era uma imagem: o cursor virava mãozinha e nada
   mais acontecia até a tela trocar.

   O SISTEMA, em seis estados:

     repouso        exatamente como o canvas pinta — nada aqui mexe nisso
     hover          pintado: clareia 10% e sobe 1px, com chão embaixo
                    discreto: a tinta vem a 100% e ganha um véu de 10%
     selecionado    já é desenho do canvas (fundo branco / ladrilho de vidro);
                    o hover NÃO o repinta, só o aprofunda um pouco
     clique         afunda 1px e escurece 5% — dura 120ms, é o recibo do toque
     foco (teclado) anel berry de 2px com folga de 3px, sempre visível
     desabilitado   45% de opacidade, cursor de bloqueio, sem hover e sem clique

   COMO ISTO FUNCIONA SEM TOCAR NO CANVAS
   As classes atômicas nomeiam o valor: `bg-ff4d8d`, `bg-255-255-255-07`. Então
   `[class*="bg-"]` separa, com exatidão, o botão PINTADO do botão DISCRETO —
   e nenhuma classe do canvas contém "bg-" fora do começo (conferido: 898
   classes). Duas famílias, duas regras, zero classe nova no markup gerado.

   Por que `filter` e não `background`: trocar o fundo de um botão pintado
   apagaria a cor do canvas. `filter` compõe por cima do que já está lá — cor,
   translucidez e sombra — e é a única propriedade que o canvas não usa
   (`bf-*` é backdrop-filter, outra coisa). Onde há vidro (backdrop-filter) o
   filter quebraria o efeito: por isso o trilho tem regras próprias em
   98-trilho.css, com fundo e sombra em vez de filtro.
   ============================================================================ */

:root{
  --toque-veu:color-mix(in srgb, var(--ink) 9%, transparent);
  --toque-veu-forte:color-mix(in srgb, var(--ink) 15%, transparent);
  --toque-tempo:120ms;
  --toque-curva:cubic-bezier(.2,.7,.3,1);
  --toque-chao:0 8px 20px -10px rgba(0,0,0,.55);
}
@media (prefers-color-scheme: light){
  :root:not([data-tema]):not([data-theme]){ --toque-chao:0 8px 18px -10px rgba(23,17,28,.32) }
}
:root[data-tema="claro"],
:root[data-theme="light"]:not([data-tema]){ --toque-chao:0 8px 18px -10px rgba(23,17,28,.32) }

/* --------------------------------------------------------------- a base ---- */
.quadro button,
.quadro summary,
.quadro [role="button"]{
  cursor:pointer;
  transition:filter var(--toque-tempo) var(--toque-curva),
             transform var(--toque-tempo) var(--toque-curva),
             color var(--toque-tempo) ease,
             background-color var(--toque-tempo) ease,
             box-shadow var(--toque-tempo) ease;
}
@media (prefers-reduced-motion:reduce){
  .quadro button,.quadro summary,.quadro [role="button"]{ transition:none }
}

/* ---------------------------------------------------------------- hover ---- */
/* `hover:hover` e `pointer:fine`: no toque o hover COLA (fica aceso depois do
   toque, como se estivesse selecionado) — e selecionado é outro estado. */
@media (hover:hover) and (pointer:fine){
  /* botão pintado */
  .quadro button[class*="bg-"]:hover:not(:disabled):not([aria-disabled="true"]){
    filter:brightness(1.10);
    transform:translateY(-1px);
    box-shadow:var(--toque-chao);
  }
  /* botão discreto: não há o que clarear, então a tinta é que vem à frente */
  .quadro button:not([class*="bg-"]):hover:not(:disabled):not([aria-disabled="true"]){
    color:var(--ink);
    background-color:var(--toque-veu);
  }
  .quadro button:not([class*="bg-"]):hover .ico{ color:var(--ink) }
}
/* No claro, clarear um botão pintado o apaga contra o fundo areia: lá o hover
   é para dentro. Mesma leitura ("este é o que está sob o cursor"), tinta certa. */
/* A guarda importa: `:not([data-theme="dark"])` sozinho vale no escuro do
   sistema, que não estampa atributo nenhum — a regra do claro pintaria os dois. */
@media (prefers-color-scheme: light) and (hover:hover) and (pointer:fine){
  :root:not([data-tema]):not([data-theme]) .quadro button[class*="bg-"]:hover:not(:disabled){
    filter:brightness(.95);
  }
}
@media (hover:hover) and (pointer:fine){
  :root[data-tema="claro"] .quadro button[class*="bg-"]:hover:not(:disabled),
:root[data-theme="light"]:not([data-tema]) .quadro button[class*="bg-"]:hover:not(:disabled){
    filter:brightness(.95);
  }
}

/* -------------------------------------------------- o momento do clique ---- */
.quadro button:active:not(:disabled):not([aria-disabled="true"]),
.quadro [role="button"]:active{
  transform:translateY(1px) scale(.99);
  filter:brightness(.95);
  box-shadow:none;
}
@media (prefers-reduced-motion:reduce){
  .quadro button:active{ transform:none }
}

/* ------------------------------------------------------ foco de teclado ---- */
/* Nunca esconder o anel: o único jeito de operar a Central sem mouse. */
.quadro button:focus-visible,
.quadro a:focus-visible,
.quadro input:focus-visible,
.quadro select:focus-visible,
.quadro textarea:focus-visible,
.quadro [tabindex]:focus-visible{
  outline:2px solid var(--berry);
  outline-offset:3px;
}
/* campo em foco também ganha borda — dentro de um cartão o anel externo some */
.quadro input:focus-visible,
.quadro select:focus-visible,
.quadro textarea:focus-visible{ outline-offset:1px; border-color:var(--berry) }

/* -------------------------------------------------------- desabilitado ---- */
.quadro button:disabled,
.quadro button[aria-disabled="true"],
.quadro input:disabled,
.quadro select:disabled{
  opacity:.45; cursor:not-allowed;
  filter:none!important; transform:none!important; box-shadow:none!important;
}

/* ------------------------------------------------------------ variantes ---- */
/* Destrutivo: nunca clareia para um rosa alegre — vai para a tinta de perigo. */
@media (hover:hover) and (pointer:fine){
  .quadro button.perigo:hover:not(:disabled),
  .quadro button[data-tom="perigo"]:hover:not(:disabled){
    color:var(--crit); background-color:var(--crit-wash); filter:none;
  }
}

/* Selecionado: o canvas já pinta (fundo branco, pílula acesa). O que falta é
   ANUNCIAR — e impedir que o hover finja seleção em quem não está selecionado. */
.quadro [aria-pressed="true"],
.quadro [aria-current="page"],
.quadro [aria-current="true"]{ cursor:default }
@media (hover:hover) and (pointer:fine){
  .quadro button[aria-pressed="true"]:hover,
  .quadro button[aria-current]:hover{ transform:none; box-shadow:none; filter:brightness(1.04) }
}

/* Gravação em voo: o botão que disparou fica preso até a página renascer. */
.quadro button[data-voando="1"]{ opacity:.6; pointer-events:none }

/* ------------------------------------------------------- fora do quadro ---- */
/* Componentes antigos (folha, chips, cartões) seguem o mesmo sistema. */
.chip,.botao,.cartao,.folha .opcoes button,.toast button,.faixa .faixa-acoes button{
  transition:filter var(--toque-tempo) var(--toque-curva),
             transform var(--toque-tempo) var(--toque-curva),
             background-color var(--toque-tempo) ease,
             border-color var(--toque-tempo) ease;
}
@media (hover:hover) and (pointer:fine){
  .chip:hover:not(:disabled):not(.sel){ border-color:var(--line-strong); background:var(--toque-veu) }
  .chip.sel:hover{ filter:brightness(1.08) }
  .botao:hover:not(:disabled){ filter:brightness(1.10); transform:translateY(-1px);
                               box-shadow:var(--toque-chao) }
  .botao.fantasma:hover:not(:disabled){ filter:none; background:var(--toque-veu);
                                        border-color:var(--line-strong) }
  .botao.perigo:hover:not(:disabled){ filter:none; background:var(--crit-wash) }
  .cartao:hover{ border-color:var(--line-strong); background:var(--surface) }
  .folha .opcoes button:hover{ border-color:var(--line-strong); background:var(--toque-veu) }
}
.chip:active:not(:disabled),.botao:active:not(:disabled),
.folha .opcoes button:active{ transform:translateY(1px) scale(.99); filter:brightness(.95) }
.cartao:active{ transform:scale(.995) }
@media (prefers-reduced-motion:reduce){
  .chip,.botao,.cartao,.folha .opcoes button{ transition:none }
  .chip:active,.botao:active,.cartao:active,.folha .opcoes button:active{ transform:none }
}

/* O véu da folha ganha um fade — abrir uma caixa modal sem transição pisca. */
.veu{ animation:veu-entra .14s ease }
@keyframes veu-entra{ from{ opacity:0 } to{ opacity:1 } }
@media (prefers-reduced-motion:reduce){ .veu{ animation:none } }

/* ---- campo de preenchimento nunca depende do controle nativo ----
   As pranchetas dão borda, raio e tinta ao campo, mas nenhum fundo: o `<input>`
   ficava com o fundo padrão do navegador. Isso funciona enquanto `color-scheme`
   acompanha o tema — e não acompanha: o invólucro que a publicação põe em volta
   da página declara `:root{color-scheme:light}`, então o campo nascia BRANCO com
   a nossa tinta branca por cima. Ilegível nos Ajustes, que é onde há mais campo.

   Só onde a prancheta não pintou fundo (`bg-*`): quem o canvas pintou, fica. */
.quadro input:not([class*="bg-"]),
.quadro select:not([class*="bg-"]),
.quadro textarea:not([class*="bg-"]){
  background-color:var(--campo-bg);
}
.quadro input::placeholder,
.quadro textarea::placeholder{ color:var(--campo-placeholder) }
/* o seletor de data traz ícone próprio, desenhado pelo navegador na cor do
   esquema — sem isto ele some no escuro */
.quadro input[type="date"]::-webkit-calendar-picker-indicator{
  filter:invert(1); opacity:.55; cursor:pointer;
}
:root[data-tema="claro"] .quadro input[type="date"]::-webkit-calendar-picker-indicator,
:root[data-theme="light"]:not([data-tema]) .quadro input[type="date"]::-webkit-calendar-picker-indicator{
  filter:none; opacity:.6;
}
@media (prefers-color-scheme: light){
  :root:not([data-tema]):not([data-theme]) .quadro input[type="date"]::-webkit-calendar-picker-indicator{
    filter:none; opacity:.6;
  }
}
