:root[data-theme="dark"]{
  --bg:#0A0A0A; --bg-elevated:#111110; --surface:#151513; --surface-hover:#1D1D1A;
  --border:#2A2A26; --border-soft:#1E1E1B;
  --text:#F3F2ED; --text-dim:#948F84; --text-faint:#5C584F;
  --accent:#D83831; --accent-text:#FF6156; --accent-soft:rgba(216,56,49,.16); --accent-soft-strong:rgba(216,56,49,.30);
  --success:#3FAE6B; --success-soft:rgba(63,174,107,.14);
  --warn:#D89A38; --warn-soft:rgba(216,154,56,.14);
  --info:#4F8CC9; --info-soft:rgba(79,140,201,.14);
}
:root[data-theme="light"]{
  --bg:#FBFAF8; --bg-elevated:#FFFFFF; --surface:#FFFFFF; --surface-hover:#F3F2ED;
  --border:#E4E2DB; --border-soft:#ECEAE3;
  --text:#14130F; --text-dim:#716C61; --text-faint:#A8A297;
  --accent:#D83831; --accent-text:#B72B25; --accent-soft:rgba(216,56,49,.08); --accent-soft-strong:rgba(216,56,49,.16);
  --success:#2F8F55; --success-soft:rgba(47,143,85,.10);
  --warn:#B57A1F; --warn-soft:rgba(181,122,31,.10);
  --info:#3C6E9E; --info-soft:rgba(60,110,158,.10);
}
*{ box-sizing:border-box; }
[hidden]{ display:none !important; }
html,body{ margin:0; padding:0; }
body{ background:var(--bg); color:var(--text); font-family:'Inter',system-ui,sans-serif; -webkit-font-smoothing:antialiased; opacity:0; transition:opacity .28s ease; }
body.pronto{ opacity:1; }
@media (prefers-reduced-motion:reduce){ *,*::before,*::after{ transition:none !important; animation:none !important; } }

/* ---------- barras de rolagem no tema ---------- */
*{ scrollbar-width:thin; scrollbar-color:var(--border-soft) transparent; }
*::-webkit-scrollbar{ width:9px; height:9px; }
*::-webkit-scrollbar-track{ background:transparent; }
*::-webkit-scrollbar-thumb{ background:var(--border); border-radius:8px; background-clip:padding-box; border:2px solid transparent; }
*::-webkit-scrollbar-thumb:hover{ background:var(--text-faint); background-clip:padding-box; border:2px solid transparent; }
*::-webkit-scrollbar-corner{ background:transparent; }
.mono{ font-family:'IBM Plex Mono',monospace; }
.muted{ color:var(--text-faint); }
a{ color:var(--accent-text); }
input,select,button{ font-family:inherit; }
button{ cursor:pointer; }

.app{ max-width:1360px; margin:0 auto; padding:22px 20px 80px; }
header.top{ display:flex; align-items:flex-start; justify-content:space-between; gap:16px; padding-bottom:18px; border-bottom:1px solid var(--border-soft); margin-bottom:18px; flex-wrap:wrap; }
.brand{ display:flex; align-items:center; gap:14px; }
.brand-mark{ width:40px; height:40px; border-radius:10px; background:var(--accent); color:#fff; display:flex; align-items:center; justify-content:center; }
.brand-mark svg{ width:20px; height:20px; }
.brand-text h1{ margin:0; font-size:18px; font-weight:700; }
.brand-text p{ margin:2px 0 0; font-size:12px; color:var(--text-dim); }
.icon-btn{ width:36px; height:36px; border-radius:9px; border:1px solid var(--border); background:var(--surface); color:var(--text); display:flex; align-items:center; justify-content:center; }
.icon-btn svg{ width:17px; height:17px; }

.ctrl{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:10px 12px; margin-bottom:18px; }
.ctrl-select{ background:var(--bg-elevated); border:1px solid var(--border); color:var(--text); font-size:12.5px; font-weight:600; padding:8px 10px; border-radius:8px; max-width:230px; }
.ctrl-select.sm{ font-weight:500; max-width:150px; }
.ctrl-sep{ width:1px; height:22px; background:var(--border); }
.ctrl-dates{ display:flex; align-items:center; gap:6px; }
.ctrl-dates label{ font-size:10.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--text-faint); font-weight:600; }
.ctrl-dates input{ background:var(--bg-elevated); border:1px solid var(--border); color:var(--text); font-size:12px; padding:7px 8px; border-radius:7px; }
.grow{ flex:1; }
.btn-primary{ background:var(--accent); color:#fff; border:none; padding:8px 16px; font-size:12.5px; font-weight:600; border-radius:8px; }
.btn-primary:hover{ background:var(--accent-text); }
.btn-primary:disabled{ opacity:.45; cursor:not-allowed; }
.btn-secondary{ background:var(--bg-elevated); border:1px solid var(--border); color:var(--text); font-size:12px; font-weight:600; padding:7px 12px; border-radius:8px; }
.btn-secondary:hover{ border-color:var(--accent); color:var(--accent-text); }
.btn-secondary:disabled{ opacity:.45; cursor:not-allowed; }
.btn-secondary.danger:hover{ border-color:var(--warn); color:var(--warn); }
.btn-mini{ background:var(--bg-elevated); border:1px solid var(--border); color:var(--text-dim); font-size:11px; font-weight:600; padding:4px 9px; border-radius:6px; }
.btn-mini:hover{ border-color:var(--accent); color:var(--accent-text); }

/* ---------- modo ver / editar ---------- */
.btn-editar{ display:inline-flex; align-items:center; gap:7px; background:var(--accent); color:#fff; border:none; padding:8px 14px; font-size:12.5px; font-weight:600; border-radius:9px; }
.btn-editar:hover{ background:var(--accent-text); }
.btn-editar svg{ width:15px; height:15px; }
.app[data-modo="editar"] .view-only{ display:none !important; }
.app[data-modo="ver"] .edit-only{ display:none !important; }
.app[data-modo="ver"] #editBar{ display:none; }              /* a barra some inteira no modo ver */
.app[data-modo="ver"] .widget-tools{ display:none; }
.app[data-modo="ver"] .widget-head{ cursor:default; }

/* ---------- navegação de páginas ---------- */
.page-nav{ display:flex; align-items:center; gap:4px; background:var(--bg-elevated); border:1px solid var(--border); border-radius:9px; padding:3px 4px; }
.page-nav .pg-arrow{ width:24px; height:24px; border:none; background:none; color:var(--text-dim); font-size:16px; line-height:1; border-radius:6px; }
.page-nav .pg-arrow:hover:not(:disabled){ background:var(--surface-hover); color:var(--text); }
.page-nav .pg-arrow:disabled{ opacity:.3; cursor:not-allowed; }
.page-nav .pg-label{ display:flex; align-items:baseline; gap:6px; padding:0 6px; max-width:220px; }
.page-nav .pg-label b{ font-size:12.5px; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.page-nav .pg-label small{ font-size:10.5px; color:var(--text-faint); font-family:'IBM Plex Mono',monospace; }
.page-nav .pg-tools{ display:flex; gap:2px; margin-left:2px; padding-left:4px; border-left:1px solid var(--border); }
.page-nav .pg-edit{ width:22px; height:22px; border:none; background:none; color:var(--text-faint); font-size:11px; border-radius:5px; }
.page-nav .pg-edit:hover{ background:var(--surface-hover); color:var(--text); }
.page-nav .pg-edit.danger:hover{ color:var(--accent-text); }

/* ---------- barra de filtros + navegação ---------- */
.filtro-bar{ display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:18px; padding:0 2px; min-height:38px; }
.app[data-modo="editar"] .filtro-bar{ margin-top:-4px; }
.filtro-bar .ctrl-dates .ate{ color:var(--text-faint); font-size:12px; padding:0 1px; }
.filtro-dims{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.filtro-bar .grow{ flex:1 1 20px; }
.filtro-bar .btn-editar{ margin-left:auto; }
.filtro-drop{ position:relative; }
.filtro-drop > button{ display:inline-flex; align-items:center; gap:6px; background:var(--bg-elevated); border:1px solid var(--border); color:var(--text); font-size:12px; font-weight:600; padding:7px 10px; border-radius:8px; }
.filtro-drop > button:hover{ border-color:var(--accent); }
.filtro-drop > button .fd-count{ font-size:10px; font-weight:700; background:var(--accent); color:#fff; border-radius:20px; padding:1px 6px; }
.filtro-drop > button .fd-caret{ color:var(--text-faint); font-size:10px; }
.filtro-panel{ display:none; position:absolute; top:calc(100% + 4px); left:0; z-index:40; width:240px; background:var(--surface); border:1px solid var(--border); border-radius:10px; box-shadow:0 16px 40px -12px rgba(0,0,0,.5); padding:8px; }
.filtro-drop.aberto .filtro-panel{ display:block; }
.filtro-panel .fp-search{ width:100%; background:var(--bg-elevated); border:1px solid var(--border); color:var(--text); font-size:12px; padding:6px 8px; border-radius:7px; margin-bottom:6px; }
.filtro-panel .fp-list{ max-height:220px; overflow-y:auto; display:flex; flex-direction:column; gap:1px; }
.filtro-panel label{ display:flex; align-items:center; gap:8px; padding:5px 7px; border-radius:6px; font-size:12px; cursor:pointer; }
.filtro-panel label:hover{ background:var(--surface-hover); }
.filtro-panel label span{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.filtro-panel .fp-foot{ display:flex; justify-content:space-between; margin-top:6px; padding-top:6px; border-top:1px solid var(--border-soft); }
.filtro-panel .fp-foot button{ background:none; border:none; color:var(--text-dim); font-size:11px; font-weight:600; padding:3px 5px; border-radius:5px; }
.filtro-panel .fp-foot button:hover{ color:var(--accent-text); }

/* ---------- compartilhar: papéis ---------- */
.share-row{ display:flex; align-items:center; gap:10px; padding:9px 0; border-bottom:1px solid var(--border-soft); }
.share-row:last-child{ border-bottom:none; }
.share-row .sr-id{ flex:1; min-width:0; }
.share-row .sr-id b{ display:block; font-size:12.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.share-row .sr-id small{ font-size:10.5px; color:var(--text-faint); }
.papel-toggle{ display:inline-flex; border:1px solid var(--border); border-radius:7px; overflow:hidden; }
.papel-toggle button{ background:var(--bg-elevated); border:none; color:var(--text-dim); font-size:10.5px; font-weight:700; padding:5px 9px; }
.papel-toggle button.on{ background:var(--accent); color:#fff; }
.share-row .sr-rm{ background:none; border:none; color:var(--text-faint); font-size:13px; padding:4px; border-radius:5px; }
.share-row .sr-rm:hover{ color:var(--accent-text); }
.share-add{ display:flex; gap:6px; margin:12px 0 4px; }
.share-add input{ flex:1; min-width:0; background:var(--bg-elevated); border:1px solid var(--border); color:var(--text); font-size:12px; padding:7px 9px; border-radius:7px; }

.msg{ display:none; font-size:12.5px; padding:10px 14px; border-radius:10px; margin-bottom:14px; }
.msg.show{ display:block; }
.msg.ok{ background:var(--success-soft); border:1px solid var(--success); color:var(--success); }
.msg.err{ background:var(--warn-soft); border:1px solid var(--warn); color:var(--warn); }

.empty-state{ display:none; text-align:center; padding:60px 20px; color:var(--text-dim); font-size:13px; }
.empty-state p{ margin:6px 0; }

.grid{ display:grid; grid-template-columns:repeat(12, 1fr); grid-auto-rows:78px; gap:14px; transition:opacity .2s ease, transform .2s ease; }
.grid.trocando{ opacity:0; transform:translateY(6px); }
.grid.reordenando{ cursor:grabbing; }
.grid.reordenando .widget-body{ pointer-events:none; }
.widget{ background:var(--surface); border:1px solid var(--border); border-radius:14px; display:flex; flex-direction:column; overflow:hidden; min-height:0; transition:box-shadow .15s ease, opacity .15s ease; }

/* --- arrastar: o widget "descola" da tela e segue o cursor --- */
.widget.arrastando{
  position:fixed; margin:0; z-index:200; pointer-events:none;
  transition:none;                 /* segue o cursor sem lag */
  box-shadow:0 26px 64px -14px rgba(0,0,0,.55), 0 0 0 1px var(--accent-soft-strong);
  cursor:grabbing; will-change:transform;
}
/* os demais widgets deslizam suavemente pro novo lugar (FLIP: o JS mede antes/
   depois e anima a diferença; a transição em si é setada inline pelo JS) */
.widget-ghost{
  border:2px dashed var(--accent); border-radius:14px; background:var(--accent-soft);
  transition:transform .24s cubic-bezier(.2,.9,.25,1);
  animation:ghostPulse 1.3s ease-in-out infinite;
}
@keyframes ghostPulse{ 0%,100%{ opacity:.7; } 50%{ opacity:1; } }
@media (prefers-reduced-motion:reduce){ .widget-ghost{ animation:none; } }

.app[data-modo="editar"] .widget:hover{ box-shadow:0 0 0 1px var(--accent-soft-strong); }
.widget-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 12px; border-bottom:1px solid var(--border-soft); cursor:default; touch-action:none; }
.app[data-modo="editar"] .widget-head{ cursor:grab; }
.app[data-modo="editar"] .widget-head:active{ cursor:grabbing; }

/* três pontinhos animados */
.loading-dots{ display:inline-flex; gap:5px; align-items:center; }
.loading-dots span{ width:6px; height:6px; border-radius:50%; background:currentColor; opacity:.5; animation:ldBounce 1s ease-in-out infinite; }
.loading-dots span:nth-child(2){ animation-delay:.15s; }
.loading-dots span:nth-child(3){ animation-delay:.3s; }
@keyframes ldBounce{ 0%,80%,100%{ transform:translateY(0); opacity:.4; } 40%{ transform:translateY(-5px); opacity:1; } }
.widget-title{ flex:1; min-width:0; font-size:12.5px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.widget-tools{ display:flex; gap:2px; flex-shrink:0; }
.widget-tools button{ width:22px; height:22px; border:none; background:none; color:var(--text-faint); font-size:12px; border-radius:5px; }
.widget-tools button:hover{ background:var(--surface-hover); color:var(--text); }
.widget-export{ flex-shrink:0; width:24px; height:24px; display:inline-flex; align-items:center; justify-content:center; padding:0; border:1px solid var(--border-soft); background:var(--bg-elevated); color:var(--text-dim); border-radius:6px; cursor:pointer; }
.widget-export svg{ width:13px; height:13px; }
.widget-export:hover{ border-color:var(--success); color:var(--success); }
.widget-export:disabled{ opacity:.5; cursor:progress; }
.widget-body{ flex:1; padding:12px; overflow:auto; position:relative; display:flex; flex-direction:column; }
.widget-loading,.widget-empty{ margin:auto; color:var(--text-faint); font-size:12px; }
.widget-empty.err{ color:var(--warn); }
.kpi-val{ margin:auto; font-family:'Space Grotesk',sans-serif; font-size:30px; font-weight:700; }

/* ---- KPI com pacing + comparativos ---- */
.kpi2{ display:flex; flex-direction:column; gap:12px; width:100%; }
.kpi2-main{ display:flex; align-items:baseline; gap:10px; flex-wrap:wrap; }
.kpi2-val{ font-family:'Space Grotesk',sans-serif; font-size:30px; font-weight:700; line-height:1; }
.kpi2-vs{ display:inline-flex; align-items:center; gap:4px; font-size:12px; font-weight:700; white-space:nowrap; }
.kpi2-vs.good{ color:var(--success); }
.kpi2-vs.bad{ color:var(--accent-text); }
.kpi2-vs.flat{ color:var(--text-dim); }
.kpi2-rows{ display:flex; flex-direction:column; border-top:1px solid var(--border-soft); }
.kpi2-row{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:7px 0; border-bottom:1px solid var(--border-soft); font-size:12px; }
.kpi2-row:last-child{ border-bottom:none; }
.kpi2-row > span{ color:var(--text-dim); font-weight:600; }
.kpi2-row > b{ font-family:'IBM Plex Mono',monospace; font-weight:600; color:var(--text); }
.kpi2-row > b.good{ color:var(--success); }
.kpi2-row > b.warn{ color:var(--warn); }
.kpi2-row > b.bad{ color:var(--accent-text); }
.kpi2-row > b.flat{ color:var(--text-dim); }

/* ---- Pacing (realizado x planejado) ---- */
.pacing{ display:flex; flex-direction:column; gap:12px; width:100%; margin:auto 0; }
.pacing-pct{ font-family:'Space Grotesk',sans-serif; font-size:34px; font-weight:700; line-height:1; color:var(--text); }
.pacing-pct small{ font-size:16px; font-weight:600; margin-left:2px; color:var(--text-dim); }
.pacing-pct.good{ color:var(--success); }
.pacing-pct.warn{ color:var(--warn); }
.pacing-pct.bad{ color:var(--accent-text); }
.pacing-pct.flat{ color:var(--text-dim); }
.pacing-bar{ height:8px; border-radius:6px; background:var(--border-soft); overflow:hidden; }
.pacing-bar > span{ display:block; height:100%; border-radius:6px; background:var(--text-faint); transition:width .35s cubic-bezier(.16,1,.3,1), background .2s ease; }
.pacing-bar > span.good{ background:var(--success); }
.pacing-bar > span.warn{ background:var(--warn); }
.pacing-bar > span.bad{ background:var(--accent); }
.pacing-vals{ display:flex; justify-content:space-between; gap:10px; font-size:11.5px; color:var(--text-dim); }
.pacing-vals b{ font-family:'IBM Plex Mono',monospace; font-weight:600; color:var(--text); margin-left:4px; }

.cf-hint{ display:block; font-size:10.5px; color:var(--text-faint); margin-top:5px; line-height:1.4; text-transform:none; letter-spacing:0; font-weight:400; }
.cf label.cf-chk{ display:grid; grid-template-columns:17px 1fr; align-items:start; gap:9px; margin-bottom:0; text-transform:none; letter-spacing:0; font-weight:400; color:var(--text); font-size:12px; cursor:pointer; }
.cf label.cf-chk input[type="checkbox"]{
  appearance:none; -webkit-appearance:none;
  width:17px; height:17px; margin:1px 0 0; padding:0;
  border:1.5px solid var(--border); border-radius:5px; background:var(--surface);
  display:grid; place-content:center; cursor:pointer; transition:background .12s ease, border-color .12s ease;
}
.cf label.cf-chk input[type="checkbox"]:hover{ border-color:var(--text-faint); }
.cf label.cf-chk input[type="checkbox"]:checked{ background:var(--accent); border-color:var(--accent); }
.cf label.cf-chk input[type="checkbox"]:checked::after{
  content:""; width:5px; height:9px; margin-top:-1px;
  border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg);
}
.cf label.cf-chk span{ min-width:0; line-height:1.45; }
.cf label.cf-chk b{ font-weight:700; }

.wt-wrap{ overflow:auto; width:100%; }
.wt{ width:100%; border-collapse:collapse; font-size:11.5px; }
.wt th{ text-align:right; padding:5px 8px; color:var(--text-faint); font-size:10px; text-transform:uppercase; border-bottom:1px solid var(--border); white-space:nowrap; }
.wt th:first-child, .wt td:first-child{ text-align:left; }
.wt td{ padding:5px 8px; border-bottom:1px solid var(--border-soft); text-align:right; font-family:'IBM Plex Mono',monospace; white-space:nowrap; }

/* gráficos (charts.js) */
.chart-svg{ width:100%; height:auto; display:block; flex:none; }
.chart-tick{ font-size:9px; fill:var(--text-faint); font-family:'IBM Plex Mono',monospace; }
/* rótulos do eixo Y ficam dentro do gráfico — halo pra ler por cima do traçado */
.chart-tick-y{ paint-order:stroke; stroke:var(--surface); stroke-width:3px; stroke-linejoin:round; }
.chart-tip{ position:absolute; background:var(--bg-elevated); border:1px solid var(--border); border-radius:8px; padding:7px 9px; font-size:10.5px; pointer-events:none; z-index:5; box-shadow:0 8px 24px -8px rgba(0,0,0,.5); }
.chart-tip b{ display:block; margin-bottom:3px; font-family:'IBM Plex Mono',monospace; }
.chart-legend{ display:flex; gap:12px; flex-wrap:wrap; margin-top:8px; font-size:10.5px; color:var(--text-dim); }
.chart-legend span{ display:flex; align-items:center; gap:5px; }
.chart-legend i, .chart-tip i{ width:8px; height:8px; border-radius:2px; display:inline-block; }
.chart-empty{ margin:auto; color:var(--text-faint); font-size:11px; }

/* drawer */
.drawer-overlay{ display:none; position:fixed; inset:0; background:rgba(0,0,0,.5); z-index:60; }
.drawer-overlay.active{ display:block; }
.drawer{ position:absolute; top:0; right:0; bottom:0; width:380px; max-width:92vw; background:var(--surface); border-left:1px solid var(--border); display:flex; flex-direction:column; box-shadow:-20px 0 50px -20px rgba(0,0,0,.5); }
.drawer-head{ display:flex; align-items:center; justify-content:space-between; padding:16px 18px; border-bottom:1px solid var(--border-soft); }
.drawer-head h3{ margin:0; font-size:15px; }
.drawer-body{ padding:16px 18px; overflow-y:auto; overflow-x:hidden; flex:1; }
.drawer-body .cf select, .drawer-body .cf input{ max-width:100%; }
.drawer-foot{ display:flex; justify-content:flex-end; gap:8px; padding:12px 18px; border-top:1px solid var(--border-soft); background:var(--surface); }
.cf{ margin-bottom:12px; }
.cf label, .cf-sub{ display:block; font-size:11px; font-weight:600; color:var(--text-dim); margin-bottom:5px; text-transform:uppercase; letter-spacing:.03em; }
.cf-sub{ margin-top:14px; }
.cf input, .cf select{ width:100%; background:var(--bg-elevated); border:1px solid var(--border); color:var(--text); font-size:12.5px; padding:8px 10px; border-radius:8px; }
.cf-serie{ display:flex; gap:6px; margin-bottom:6px; }
.cf-serie select{ flex:1; min-width:0; background:var(--bg-elevated); border:1px solid var(--border); color:var(--text); font-size:11.5px; padding:6px 8px; border-radius:7px; }
.cf-serie input{ flex:1; min-width:0; background:var(--bg-elevated); border:1px solid var(--border); color:var(--text); font-size:11.5px; padding:6px 8px; border-radius:7px; }
.cf-serie select[data-k="op"]{ flex:0 0 68px; }
.cf-rm{ flex-shrink:0; border:1px solid var(--border); background:none; color:var(--text-faint); border-radius:6px; padding:0 8px; font-size:11px; }
.cf-rm:hover{ color:var(--accent-text); border-color:var(--accent); }
.cf-axis{ flex:0 0 34px; border:1px solid var(--border); background:none; color:var(--text-faint); border-radius:6px; padding:0; font-size:10.5px; font-weight:700; letter-spacing:.02em; cursor:pointer; }
.cf-axis:hover{ color:var(--text); border-color:var(--text-faint); }
.cf-axis.on{ border-color:var(--accent); color:var(--accent-text); background:var(--accent-soft); }
.chk-list{ display:flex; flex-direction:column; gap:2px; max-height:170px; overflow-y:auto; background:var(--bg-elevated); border:1px solid var(--border); border-radius:9px; padding:6px; }
.cf .chk-list label.chk-opt{ display:flex; align-items:center; gap:9px; margin:0; padding:6px 8px; border-radius:7px; font-size:12.5px; font-weight:500; text-transform:none; letter-spacing:0; color:var(--text); cursor:pointer; transition:background .12s ease; }
.cf .chk-list label.chk-opt:hover{ background:var(--surface-hover); }
.cf .chk-list label.chk-opt span{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cf .chk-list input[type="checkbox"]{
  appearance:none; -webkit-appearance:none;
  width:17px; height:17px; flex:0 0 17px; margin:0; padding:0;
  border:1.5px solid var(--border); border-radius:5px; background:var(--surface);
  display:grid; place-content:center; cursor:pointer; transition:background .12s ease, border-color .12s ease;
}
.cf .chk-list input[type="checkbox"]:hover{ border-color:var(--text-faint); }
.cf .chk-list input[type="checkbox"]:checked{ background:var(--accent); border-color:var(--accent); }
.cf .chk-list input[type="checkbox"]:checked::after{
  content:""; width:5px; height:9px; margin-top:-1px;
  border:solid #fff; border-width:0 2px 2px 0; transform:rotate(45deg);
}
.cf .chk-list input[type="checkbox"]:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; }

footer.foot{ margin-top:44px; padding-top:18px; border-top:1px solid var(--border-soft); display:flex; justify-content:space-between; font-size:11px; color:var(--text-faint); }

/* ---------- ícone de info + glossário ---------- */
.dash-info{ position:relative; display:inline-flex; }
.info-btn{ width:32px; height:32px; border-radius:8px; border:1px solid var(--border); background:var(--bg-elevated); color:var(--text-dim); display:flex; align-items:center; justify-content:center; }
.info-btn svg{ width:16px; height:16px; }
.info-btn:hover{ border-color:var(--accent); color:var(--accent-text); }
.info-balao{ position:absolute; top:calc(100% + 8px); right:0; z-index:50; width:320px; max-width:78vw; background:var(--surface); border:1px solid var(--border); border-radius:12px; padding:14px 16px; box-shadow:0 20px 50px -16px rgba(0,0,0,.55); font-size:12px; line-height:1.5; color:var(--text-dim); opacity:0; visibility:hidden; transform:translateY(-4px); transition:opacity .16s ease, transform .16s ease, visibility .16s; }
.dash-info:hover .info-balao, .dash-info:focus-within .info-balao{ opacity:1; visibility:visible; transform:translateY(0); }
.info-balao::before{ content:""; position:absolute; top:-6px; right:12px; width:10px; height:10px; background:var(--surface); border-left:1px solid var(--border); border-top:1px solid var(--border); transform:rotate(45deg); }
.info-balao b{ display:block; font-size:12.5px; color:var(--text); margin-bottom:6px; }
.info-balao p{ margin:6px 0; }
.info-balao strong{ color:var(--text); font-weight:600; }

/* ---------- chat de IA ---------- */
.chat-fab{ position:fixed; right:22px; bottom:22px; z-index:70; width:52px; height:52px; border-radius:50%; border:none; background:var(--accent); color:#fff; display:flex; align-items:center; justify-content:center; box-shadow:0 12px 30px -8px rgba(216,56,49,.5); transition:transform .18s cubic-bezier(.16,1,.3,1), background .15s ease; }
.chat-fab:hover{ background:var(--accent-text); transform:scale(1.06); }
.chat-fab.aberto{ transform:scale(.9); }
.chat-fab svg{ width:22px; height:22px; }
.chat-panel{ position:fixed; right:22px; bottom:86px; z-index:70; width:380px; max-width:calc(100vw - 32px); height:520px; max-height:calc(100vh - 120px); background:var(--surface); border:1px solid var(--border); border-radius:16px; display:flex; flex-direction:column; overflow:hidden; box-shadow:0 24px 60px -18px rgba(0,0,0,.6); animation:chatIn .2s cubic-bezier(.16,1,.3,1); }
@keyframes chatIn{ from{ opacity:0; transform:translateY(12px) scale(.98); } to{ opacity:1; transform:none; } }
.chat-head{ display:flex; align-items:center; gap:10px; padding:12px 14px; border-bottom:1px solid var(--border-soft); }
.chat-head b{ font-size:13px; }
.chat-engine{ display:inline-flex; margin-left:auto; border:1px solid var(--border); border-radius:8px; overflow:hidden; }
.chat-engine button{ background:var(--bg-elevated); border:none; color:var(--text-dim); font-size:10.5px; font-weight:700; padding:5px 9px; }
.chat-engine button.on{ background:var(--accent); color:#fff; }
.chat-head .icon-btn{ width:28px; height:28px; }
.chat-msgs{ flex:1; overflow-y:auto; padding:14px; display:flex; flex-direction:column; gap:10px; }
.chat-vazio{ margin:auto; text-align:center; color:var(--text-faint); font-size:12px; padding:0 20px; }
.chat-msg{ max-width:85%; font-size:12.5px; line-height:1.5; padding:9px 12px; border-radius:12px; white-space:pre-wrap; word-wrap:break-word; animation:chatMsgIn .18s ease; }
@keyframes chatMsgIn{ from{ opacity:0; transform:translateY(4px); } to{ opacity:1; transform:none; } }
.chat-msg.user{ align-self:flex-end; background:var(--accent); color:#fff; border-bottom-right-radius:4px; }
.chat-msg.assistant{ align-self:flex-start; background:var(--bg-elevated); border:1px solid var(--border-soft); color:var(--text); border-bottom-left-radius:4px; }
.chat-msg.assistant code{ font-family:'IBM Plex Mono',monospace; background:var(--surface-hover); padding:1px 4px; border-radius:4px; font-size:11px; }
.chat-msg.carregando{ color:var(--text-faint); }
.chat-input{ display:flex; gap:8px; padding:10px 12px; border-top:1px solid var(--border-soft); align-items:flex-end; }
.chat-input textarea{ flex:1; resize:none; background:var(--bg-elevated); border:1px solid var(--border); color:var(--text); font-family:inherit; font-size:12.5px; line-height:1.4; padding:8px 10px; border-radius:9px; max-height:120px; }
.chat-input textarea:focus{ outline:none; border-color:var(--accent); }
.chat-input .btn-primary{ padding:8px 14px; }

@media (max-width:820px){
  .grid{ grid-template-columns:repeat(6, 1fr); }
  .widget{ grid-column:span 6 !important; }
  .chat-panel{ right:12px; left:12px; width:auto; bottom:80px; }
}
