/* Colinha Digital · sistema visual comum do portal (frente UX, 11/10/2026) — /assets/cd-ui.css?v=N
   Fonte: devcode/colinha_v2/nav_build/cd-ui.css. Carregado por último no <head> (cdui.py faz isso nas páginas geradas).
   1) fontes locais (Inter e JetBrains Mono em /assets/fonts/, sem Google Fonts: mais rápido e sem enviar o IP do visitante ao Google);
      font-display:optional + preload da Inter (mesmo servidor e cache de 7 dias: chega antes da 1ª pintura na maioria das visitas).
   2) tokens (--cd-*) para cores, raios, sombras, espaçamentos e tipografia, com tema escuro;
   3) componentes (.cd-card, .cd-btn, .cd-chip, .cd-tabs, .cd-kpi, .cd-skel, .cd-grid) para páginas novas;
   4) harmonização leve das peças que já existem nas páginas (trilha, chips, abas, botões, toque no celular, largura). */
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:optional;src:url(fonts/inter-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Inter';font-style:normal;font-weight:100 900;font-display:optional;src:url(fonts/inter-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:100 800;font-display:optional;src:url(fonts/jetbrains-mono-latin.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'JetBrains Mono';font-style:normal;font-weight:100 800;font-display:optional;src:url(fonts/jetbrains-mono-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C4,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* ---------------------------------------------------------------- tokens */
:root{
  --cd-ui:1;
  --cd-font:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;--cd-mono:'JetBrains Mono',ui-monospace,Menlo,Consolas,monospace;
  --cd-bg:var(--bg,#eef1f6);--cd-surface:var(--bg2,#fff);--cd-surface2:var(--bg3,#f3f5f9);--cd-line:var(--border,#d9dfea);--cd-line2:var(--border2,#c3ccdb);
  --cd-text:var(--text,#0b0f17);--cd-muted:var(--muted,#5b6880);--cd-muted2:var(--muted2,#3f4b63);
  --cd-blue:var(--blue,#2983ec);--cd-blue-ink:#1f5fbf;--cd-violet:#7c4dff;--cd-amber:#fbbf24;--cd-green:#16a34a;--cd-red:#dc2626;
  --cd-grad:linear-gradient(135deg,#2983ec,#7c4dff);--cd-hero:linear-gradient(135deg,#060b1b,#0e1a3d 60%,#1b1550);
  --cd-r-sm:8px;--cd-r:12px;--cd-r-lg:16px;--cd-r-xl:20px;--cd-pill:999px;
  --cd-sh-1:0 1px 2px rgba(8,14,38,.06),0 2px 8px rgba(8,14,38,.05);--cd-sh-2:0 8px 24px rgba(8,14,38,.12);--cd-sh-3:0 22px 50px rgba(8,14,38,.24);
  --cd-s1:4px;--cd-s2:8px;--cd-s3:12px;--cd-s4:16px;--cd-s5:24px;--cd-s6:32px;--cd-s7:48px;
  --cd-fs-xs:12px;--cd-fs-sm:13.5px;--cd-fs:15px;--cd-fs-lg:17px;--cd-h3:clamp(17px,1.4vw,20px);--cd-h2:clamp(21px,2vw,28px);--cd-h1:clamp(28px,3.4vw,44px);
  --cd-tap:40px;--cd-ease:cubic-bezier(.2,.8,.2,1)
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--cd-bg:var(--bg,#070b13);--cd-surface:var(--bg2,#0e1420);--cd-surface2:var(--bg3,#151c2e);--cd-line:var(--border,#1e2d4a);--cd-line2:var(--border2,#2a3d5e);--cd-text:var(--text,#e8edf5);--cd-muted:var(--muted,#7d90b3);--cd-muted2:var(--muted2,#9aaacb);--cd-blue:var(--blue,#4f8ef7);--cd-blue-ink:#8db8ff;--cd-sh-1:0 1px 2px rgba(0,0,0,.3);--cd-sh-2:0 8px 24px rgba(0,0,0,.35)}}
:root[data-theme="dark"]{--cd-bg:var(--bg,#070b13);--cd-surface:var(--bg2,#0e1420);--cd-surface2:var(--bg3,#151c2e);--cd-line:var(--border,#1e2d4a);--cd-line2:var(--border2,#2a3d5e);--cd-text:var(--text,#e8edf5);--cd-muted:var(--muted,#7d90b3);--cd-muted2:var(--muted2,#9aaacb);--cd-blue:var(--blue,#4f8ef7);--cd-blue-ink:#8db8ff;--cd-sh-1:0 1px 2px rgba(0,0,0,.3);--cd-sh-2:0 8px 24px rgba(0,0,0,.35)}

/* ---------------------------------------------------------------- componentes (para páginas novas) */
.cd-wrap{width:100%;max-width:var(--cd-maxw,100%);margin-inline:auto;padding-inline:var(--cd-pad,clamp(12px,2.4vw,40px));box-sizing:border-box}
.cd-grid{display:grid;gap:var(--cd-s4);grid-template-columns:repeat(auto-fill,minmax(min(100%,var(--cd-min,280px)),1fr))}
.cd-card{background:var(--cd-surface);border:1px solid var(--cd-line);border-radius:var(--cd-r-lg);box-shadow:var(--cd-sh-1);padding:var(--cd-s4) var(--cd-s5);color:var(--cd-text)}
a.cd-card{display:block;text-decoration:none;transition:transform .16s var(--cd-ease),box-shadow .16s var(--cd-ease),border-color .16s}
a.cd-card:hover{transform:translateY(-2px);box-shadow:var(--cd-sh-2);border-color:color-mix(in srgb,var(--cd-blue) 45%,var(--cd-line))}
a.cd-card:active{transform:translateY(0) scale(.99)}
.cd-eyebrow{font:800 11.5px var(--cd-font);letter-spacing:.09em;text-transform:uppercase;color:var(--cd-muted)}
.cd-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--cd-tap);padding:0 18px;border-radius:var(--cd-pill);border:1px solid var(--cd-line2);background:var(--cd-surface);color:var(--cd-text);font:800 14px var(--cd-font);text-decoration:none;cursor:pointer;transition:transform .12s,background .15s,border-color .15s,box-shadow .15s}
.cd-btn:hover{border-color:var(--cd-blue)}
.cd-btn:active{transform:scale(.97)}
.cd-btn--pri{background:var(--cd-amber);border-color:#f59e0b;color:#231400}
.cd-btn--blue{background:var(--cd-blue-ink);border-color:var(--cd-blue-ink);color:#fff}
.cd-btn--ghost{background:transparent}
.cd-chip{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 12px;border-radius:var(--cd-pill);border:1px solid var(--cd-line2);background:var(--cd-surface2);color:var(--cd-muted2);font:700 12.5px var(--cd-font);text-decoration:none;white-space:nowrap}
.cd-chip[aria-pressed="true"],.cd-chip[aria-current],.cd-chip.on{background:var(--cd-blue-ink);border-color:var(--cd-blue-ink);color:#fff}
.cd-tabs{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:4px;border-radius:var(--cd-r);background:var(--cd-surface2);border:1px solid var(--cd-line)}
.cd-tabs>*{flex:0 0 auto;min-height:36px;padding:0 14px;border-radius:9px;border:0;background:none;color:var(--cd-muted2);font:800 13.5px var(--cd-font);cursor:pointer;display:inline-flex;align-items:center;text-decoration:none}
.cd-tabs>[aria-selected="true"],.cd-tabs>[aria-current]{background:var(--cd-surface);color:var(--cd-text);box-shadow:var(--cd-sh-1)}
.cd-kpi{display:flex;flex-direction:column;gap:2px;padding:var(--cd-s3) var(--cd-s4);border-radius:var(--cd-r);background:var(--cd-surface);border:1px solid var(--cd-line)}
.cd-kpi b{font:900 clamp(20px,2.2vw,28px) var(--cd-font);letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.cd-kpi span{font-size:var(--cd-fs-xs);color:var(--cd-muted)}
.cd-skel{display:block;border-radius:var(--cd-r-sm);min-height:14px;background:linear-gradient(90deg,var(--cd-surface2) 25%,color-mix(in srgb,var(--cd-line) 70%,var(--cd-surface2)) 37%,var(--cd-surface2) 63%);background-size:400% 100%;animation:cdUiSk 1.3s ease infinite}
@keyframes cdUiSk{0%{background-position:100% 50%}100%{background-position:0 50%}}
.cd-src{font-size:var(--cd-fs-xs);color:var(--cd-muted)}
.cd-vh{position:absolute!important;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.cd-reveal{opacity:0;transform:translateY(10px);transition:opacity .45s var(--cd-ease),transform .45s var(--cd-ease)}
.cd-reveal.cd-in{opacity:1;transform:none}

/* ---------------------------------------------------------------- harmonização das páginas existentes */
/* trilha própria das páginas (ol.crumbs) e a trilha comum (.cdn-bc) com o mesmo visual */
nav[aria-label="Você está em"] ol.crumbs{list-style:none;margin:0 0 10px;padding:0;display:flex;flex-wrap:nowrap;gap:6px;overflow-x:auto;scrollbar-width:none;white-space:nowrap;font:600 12.5px var(--cd-font);color:var(--cd-muted)}
nav[aria-label="Você está em"] ol.crumbs::-webkit-scrollbar{display:none}
nav[aria-label="Você está em"] ol.crumbs li+li::before{content:"›";margin-right:6px;opacity:.8}
nav[aria-label="Você está em"] ol.crumbs a{color:var(--cd-muted2);text-decoration:none;padding:4px 0}
nav[aria-label="Você está em"] ol.crumbs a:hover{color:var(--cd-blue);text-decoration:underline}
nav[aria-label="Você está em"] ol.crumbs [aria-current]{color:var(--cd-text);font-weight:700}
.cdn-bc.cdn-bc-in{padding:0 0 12px;max-width:none}
/* foco visível e resposta ao toque em tudo que é clicável */
:where(a,button,summary,[role=tab],[role=button]):focus-visible{outline:2px solid var(--cd-blue);outline-offset:2px}
:where(.chip,.cd-chip,.cd-btn,[role=tab]):active{transform:scale(.97)}
:where(.card,.sec,.box):where(a){transition:transform .16s var(--cd-ease),box-shadow .16s}
/* números alinhados (tabelas e indicadores) */
:where(td,.kpi b,.num,.v){font-variant-numeric:tabular-nums}
/* toque no celular: alvos de pelo menos ~32 px nas peças pequenas mais comuns */
@media (max-width:760px){
  :where(.chip,.lg-chips a,.tabsx a,.tabsx button,.tabs button,.pills button,.pill){min-height:34px;display:inline-flex;align-items:center}
  :where(details>summary){min-height:40px;display:flex;align-items:center}
  :where(.lg-l a,.lk a,.extra a,.src a,.hd a){display:inline-block;padding-block:5px}
  nav[aria-label="Você está em"] ol.crumbs a,.cdn-bc a{display:inline-block;padding:7px 0}
}
/* largura: páginas de leitura ficam confortáveis (texto ≤ 78 caracteres), painéis usam a tela toda */
:where(.prose,.legal,article.txt) p{max-width:78ch}
@media (prefers-reduced-motion:reduce){.cd-skel{animation:none}.cd-reveal{opacity:1;transform:none;transition:none}a.cd-card,.cd-btn{transition:none}}

/* ---------------------------------------------------------------- reserva de espaço (CLS) enquanto as listas carregam
   Medido em 11/10 (altura final em 1440 px / 375 px). Só vale enquanto o bloco está no estado "carregando"; depois a altura é a do conteúdo. */
#tempo:empty{min-height:860px}
#maRes:has(> .ma-load){min-height:1400px}
#maSemL:has(> .ma-load){min-height:470px}
#maFatos:empty{min-height:225px}
#maLeis:empty{min-height:1400px}
#spProx:has(> .empty:only-child){min-height:480px}
#exHist:has(> .empty:only-child){min-height:500px}
#exTab:has(> .empty:only-child){min-height:2300px}
#perguntar:has(> #pgOff[hidden]):has(> #pgForm[hidden]){min-height:228px}
#tzChips:has(> .cdz-msg){min-height:140px}
#pc-contas:has(> .pc-load){min-height:1500px}
section.hero2:has(#upd .cdn-sk){min-height:311px}
@media (max-width:760px){
  #tempo:empty{min-height:1880px}
  #maRes:has(> .ma-load){min-height:2800px}
  #maSemL:has(> .ma-load){min-height:850px}
  #maFatos:empty{min-height:560px}
  #maLeis:empty{min-height:2800px}
  #spProx:has(> .empty:only-child){min-height:660px}
  #exHist:has(> .empty:only-child){min-height:1800px}
  #exTab:has(> .empty:only-child){min-height:3000px}
  #chSel:has(> .chmini:only-child){min-height:440px}
  #chBody:has(.chvazio){min-height:1060px}
  #maHero:not(:has(.ma-head)){min-height:330px}
  #perguntar:has(> #pgOff[hidden]):has(> #pgForm[hidden]){min-height:420px}
  #tzChips:has(> .cdz-msg){min-height:590px}
  #pc-contas:has(> .pc-load){min-height:2900px}
  section.hero2:has(#upd .cdn-sk){min-height:496px}
}
/* largura: as páginas de calendário, suplementares e exterior usam a tela toda como as outras (o texto corrido continua com ≤ 78 caracteres) */
html.cdn-wide main.wrap>.pg{max-width:none}
html.cdn-wide main.wrap>.pg p{max-width:96ch}