/* NPS CactusMed
   Estrutura: menu lateral (computador) ou menu inferior (celular), páginas (visão geral, clientes, reuniões, calendário, como funciona), janelas (ficha, registro, Google Agenda, importação).
   Cores: tokens em :root, versão escura no media query e em data-theme.
   Estados: ok (verde), warn (amarelo), bad (vermelho), idle (cinza), lidos pelas variáveis --s, --sf, --ss. */

:root{
  --bg:#F3F2EA; --surface:#FFFFFF; --surface-2:#F6F5EE;
  --ink:#0F231C; --ink-2:#47594F; --ink-3:#5B6C63;
  --line:#DEDDD0; --line-2:#CBCABB;
  --brand:#1B7A5A; --brand-soft:#DCEFE5; --on-brand:#FFFFFF;
  --hero-a:#0D4A38; --hero-b:#1B7A5A; --hero-ink:#FFFFFF; --lime:#CDE86B;
  --ok:#126B41; --ok-soft:#DDF1E5; --ok-f:#23A06A; --on-ok-f:#FFFFFF;
  --warn:#8A5300; --warn-soft:#FCEFCF; --warn-f:#E0A021; --on-warn-f:#2B1D00;
  --bad:#A52D23; --bad-soft:#FBE3E0; --bad-f:#DB4A3D; --on-bad-f:#FFFFFF;
  --idle:#475E6C; --idle-soft:#E5ECEF; --idle-f:#8AA0AD; --on-idle-f:#FFFFFF;
  --lg-ok:#43E09F; --lg-warn:#FFCB45; --lg-bad:#FF7468;
  --track:#E6E5DA;
  --c1:#2A78D6; --c2:#EB6834; --c7:#6250D6;
  --grid:var(--line); --axis:var(--line-2);
  --shadow:0 1px 2px rgba(15,35,28,.06),0 10px 28px rgba(15,35,28,.07);
  --r:18px; --r-sm:12px; --side:264px;
  --s:var(--idle); --sf:var(--idle-f); --ss:var(--idle-soft); --on:var(--on-idle-f);
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#0B1512; --surface:#122019; --surface-2:#172821;
    --ink:#E6F0EA; --ink-2:#A8BDB2; --ink-3:#8AA095;
    --line:#24372E; --line-2:#33493E;
    --brand:#52CC9E; --brand-soft:#173B2E; --on-brand:#06261B;
    --hero-a:#0C3A2D; --hero-b:#14543F; --hero-ink:#EAF7F0; --lime:#C5E266;
    --ok:#5DD39E; --ok-soft:#153A2B; --ok-f:#3DB985; --on-ok-f:#062016;
    --warn:#F0BE5A; --warn-soft:#3A2E10; --warn-f:#E5A92F; --on-warn-f:#2B1D00;
    --bad:#FF8F84; --bad-soft:#431D19; --bad-f:#EF6759; --on-bad-f:#2B0A07;
    --idle:#A5BAC6; --idle-soft:#1E2E36; --idle-f:#6F8896; --on-idle-f:#0B1512;
    --track:#203129;
    --c1:#3987E5; --c2:#D95926; --c7:#9085E9;
    --shadow:0 1px 2px rgba(0,0,0,.4),0 12px 30px rgba(0,0,0,.35);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#0B1512; --surface:#122019; --surface-2:#172821;
  --ink:#E6F0EA; --ink-2:#A8BDB2; --ink-3:#8AA095;
  --line:#24372E; --line-2:#33493E;
  --brand:#52CC9E; --brand-soft:#173B2E; --on-brand:#06261B;
  --hero-a:#0C3A2D; --hero-b:#14543F; --hero-ink:#EAF7F0; --lime:#C5E266;
  --ok:#5DD39E; --ok-soft:#153A2B; --ok-f:#3DB985; --on-ok-f:#062016;
  --warn:#F0BE5A; --warn-soft:#3A2E10; --warn-f:#E5A92F; --on-warn-f:#2B1D00;
  --bad:#FF8F84; --bad-soft:#431D19; --bad-f:#EF6759; --on-bad-f:#2B0A07;
  --idle:#A5BAC6; --idle-soft:#1E2E36; --idle-f:#6F8896; --on-idle-f:#0B1512;
  --track:#203129;
  --c1:#3987E5; --c2:#D95926; --c7:#9085E9;
  --shadow:0 1px 2px rgba(0,0,0,.4),0 12px 30px rgba(0,0,0,.35);
  color-scheme:dark;
}

*{box-sizing:border-box}
[hidden]{display:none !important}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:'Plus Jakarta Sans',ui-sans-serif,system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;
  font-size:16px; line-height:1.5; -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,p,ul,ol{margin:0}
button,input,select,textarea{font:inherit; color:inherit}
button{cursor:pointer; background:none; border:0; padding:0; margin:0}
a{color:var(--brand); font-weight:600}
svg{display:block}
:focus-visible{outline:3px solid color-mix(in srgb, var(--brand) 55%, transparent); outline-offset:2px}
.sr{position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0}
h1,h2,h3{text-wrap:balance}

body:not(.can-write) .w-only{display:none !important}
body:not(.can-admin) .a-only{display:none !important}
body.demo .no-demo{display:none !important}

/* estados de cor: cada elemento com data-s lê as variáveis --s (texto), --sf (preenchimento), --ss (fundo suave) */
[data-s="ok"]{--s:var(--ok); --sf:var(--ok-f); --ss:var(--ok-soft); --on:var(--on-ok-f)}
[data-s="warn"]{--s:var(--warn); --sf:var(--warn-f); --ss:var(--warn-soft); --on:var(--on-warn-f)}
[data-s="bad"]{--s:var(--bad); --sf:var(--bad-f); --ss:var(--bad-soft); --on:var(--on-bad-f)}
[data-s="idle"]{--s:var(--idle); --sf:var(--idle-f); --ss:var(--idle-soft); --on:var(--on-idle-f)}

/* ---------- estrutura geral ---------- */
.app{display:block; min-height:100vh}
.side{display:none}
.mtop{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 16px 4px}
.brand{display:flex; align-items:center; gap:10px; font-weight:800; letter-spacing:-.01em; min-width:0}
.brand .mark{flex:0 0 auto; width:38px; height:38px; border-radius:12px; background:var(--brand); color:var(--on-brand); display:grid; place-items:center}
.brand b{display:block; line-height:1.15}
.brand small{display:block; font-size:12px; font-weight:600; color:var(--ink-3); letter-spacing:0}
.mode{display:inline-flex; align-items:center; gap:7px; padding:6px 12px; border-radius:999px; font-size:12.5px; font-weight:700; background:var(--surface); border:1px solid var(--line); color:var(--ink-2); line-height:1.2}
.mode i{flex:0 0 auto; width:8px; height:8px; border-radius:50%; background:var(--idle-f)}
.mode.on i{background:var(--ok-f)}
.content{container-type:inline-size; container-name:pg; max-width:1280px; margin:0 auto; padding:8px 16px 128px}
.page[hidden]{display:none !important}

.bnav{
  position:fixed; left:0; right:0; bottom:0; z-index:30; display:grid; grid-template-columns:repeat(5,minmax(0,1fr));
  background:var(--surface); border-top:1px solid var(--line); padding:6px 4px calc(6px + env(safe-area-inset-bottom, 0px));
  box-shadow:0 -6px 20px rgba(15,35,28,.06);
}
.bnav button{
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; min-height:54px; padding:4px 2px;
  background:none; border:0; border-radius:12px; color:var(--ink-3); font-size:11.5px; font-weight:700; line-height:1.15; text-align:center;
}
.bnav button[aria-current="page"]{color:var(--brand); background:var(--brand-soft)}
.fab{
  position:fixed; right:16px; bottom:calc(78px + env(safe-area-inset-bottom, 0px)); z-index:31; display:inline-flex; align-items:center; gap:8px;
  min-height:52px; padding:0 20px 0 16px; border-radius:999px; border:0; background:var(--brand); color:var(--on-brand); font-weight:800;
  box-shadow:0 8px 24px rgba(13,74,56,.35);
}

@media (min-width:960px){
  .app{display:grid; grid-template-columns:var(--side) minmax(0,1fr); align-items:start}
  .side{
    display:flex; flex-direction:column; gap:20px; position:sticky; top:env(safe-area-inset-top, 0px);
    height:calc(100vh - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)); overflow:auto;
    padding:24px 16px 20px; background:var(--surface); border-right:1px solid var(--line);
  }
  .mtop, .bnav, .fab{display:none}
  .content{padding:30px 32px 72px}
}
.snav{display:grid; gap:4px}
.nav-btn{
  display:flex; align-items:center; gap:12px; width:100%; min-height:46px; padding:0 12px; border:0; border-radius:12px;
  background:none; color:var(--ink-2); font-weight:700; text-align:left;
}
.nav-btn:hover{background:var(--surface-2); color:var(--ink)}
.nav-btn[aria-current="page"]{background:var(--brand-soft); color:var(--brand)}
.nav-btn .nbadge{margin-left:auto; min-width:24px; height:22px; padding:0 7px; border-radius:999px; background:var(--surface-2); border:1px solid var(--line); font-size:12px; display:grid; place-items:center; color:var(--ink-2)}
.nav-btn .nbadge[data-s]{background:var(--ss); color:var(--s); border-color:var(--sf)}
.side .btn.primary{width:100%}
.side-foot{margin-top:auto; display:grid; gap:10px}
.side-foot p{font-size:12.5px; color:var(--ink-3)}

/* ---------- cabeçalho das páginas ---------- */
.pg-head{display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between; gap:12px 18px; margin:6px 0 18px}
.h1{font-size:clamp(25px,4vw,32px); font-weight:800; letter-spacing:-.025em; line-height:1.1}
.h2{font-size:20px; font-weight:800; letter-spacing:-.015em}
.sub{color:var(--ink-2); font-size:14.5px; margin-top:4px; max-width:68ch}
.acts-top{display:flex; flex-wrap:wrap; gap:8px}

/* ---------- aviso do modo exemplo e de carregamento ---------- */
.demo-bar{
  display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; margin:0 0 16px; padding:12px 14px; border-radius:var(--r-sm);
  background:var(--brand-soft); border:1px dashed var(--brand); font-size:14px;
}
.demo-bar b{font-weight:800}
.demo-bar .grow{flex:1 1 240px}
.state-note{margin:0 0 16px; padding:12px 14px; border-radius:var(--r-sm); border:1px solid var(--line-2); background:var(--surface); font-size:14px; color:var(--ink-2)}

/* ---------- visão geral: composição ---------- */
.ov-grid{display:grid; gap:14px; grid-template-columns:minmax(0,1fr)}
.ov-grid > *{min-width:0}
@container pg (min-width:900px){
  .ov-grid{grid-template-columns:repeat(12,minmax(0,1fr)); gap:16px}
  .s12{grid-column:span 12} .s8{grid-column:span 8} .s7{grid-column:span 7} .s5{grid-column:span 5} .s4{grid-column:span 4} .s6{grid-column:span 6}
}
@container pg (min-width:640px) and (max-width:899px){
  .ov-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .s12, .s8, .s7, .s5, .s4{grid-column:span 2}
}

/* ---------- destaque do NPS ---------- */
.hero{
  position:relative; overflow:hidden; border-radius:26px; padding:22px 20px; color:var(--hero-ink);
  background:
    radial-gradient(520px 260px at 92% -10%, color-mix(in srgb, var(--lime) 40%, transparent), transparent 70%),
    radial-gradient(420px 220px at -5% 120%, color-mix(in srgb, var(--lime) 16%, transparent), transparent 70%),
    linear-gradient(135deg, var(--hero-a), var(--hero-b));
  box-shadow:var(--shadow);
}
.hero::after{
  content:""; position:absolute; inset:0; pointer-events:none; opacity:.45;
  background-image:radial-gradient(rgba(255,255,255,.16) 1px, transparent 1.4px);
  background-size:22px 22px;
  -webkit-mask-image:linear-gradient(90deg, transparent 30%, #000 100%); mask-image:linear-gradient(90deg, transparent 30%, #000 100%);
}
.hero-in{position:relative; z-index:1; display:grid; gap:18px}
@container pg (min-width:700px){ .hero{padding:26px 30px} .hero-in{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); align-items:center; gap:30px} }
.eyebrow{display:inline-flex; align-items:center; gap:8px; font-size:13px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; opacity:.92}
.hero-num{font-size:clamp(68px,13vw,104px); font-weight:800; letter-spacing:-.045em; line-height:.95; margin:10px 0 6px}
.hero-num.none{font-size:clamp(48px,9vw,72px); opacity:.7}
.hero-cap{font-size:14.5px; max-width:44ch; opacity:.95}
.hero-cap b{font-weight:800}
.per{display:flex; flex-wrap:wrap; gap:6px; margin-top:14px}
.per button{
  min-height:38px; padding:0 13px; border-radius:999px; border:1px solid rgba(255,255,255,.34); background:rgba(255,255,255,.1);
  color:var(--hero-ink); font-weight:700; font-size:13.5px;
}
.per button:hover{background:rgba(255,255,255,.2)}
.per button[aria-pressed="true"]{background:var(--hero-ink); color:var(--hero-a); border-color:var(--hero-ink)}
.dist{display:grid; gap:12px}
.dist-bar{display:flex; gap:2px; height:14px; border-radius:999px; overflow:hidden; background:rgba(255,255,255,.14)}
.dist-bar i{display:block; flex:1 1 0; min-width:0; height:100%}
.dist-bar i[data-c="promotor"]{background:var(--lg-ok)}
.dist-bar i[data-c="neutro"]{background:var(--lg-warn)}
.dist-bar i[data-c="detrator"]{background:var(--lg-bad)}
.dist-rows{display:grid; gap:8px}
.dist-row{display:grid; grid-template-columns:22px minmax(0,1fr) auto auto; gap:10px; align-items:center; font-size:14.5px}
.dist-row svg{color:var(--c)}
.dist-row[data-c="promotor"]{--c:var(--lg-ok)} .dist-row[data-c="neutro"]{--c:var(--lg-warn)} .dist-row[data-c="detrator"]{--c:var(--lg-bad)}
.dist-row b{font-weight:800}
.dist-row small{display:block; font-size:12px; opacity:.85}
.dist-row .n{font-weight:800; font-size:18px; min-width:1.6ch; text-align:right}
.dist-row .p{opacity:.9; font-size:13.5px; min-width:4ch; text-align:right}
.hero-foot{font-size:13px; opacity:.88; margin-top:2px}

/* ---------- cartão de pendências ---------- */
.panel{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow); padding:16px}
.panel-head{display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:6px 12px; margin-bottom:12px}
.panel-head h2{font-size:17px; font-weight:800; letter-spacing:-.01em}
.panel-head p{font-size:13.5px; color:var(--ink-2); margin-top:2px}
.meter{height:12px; border-radius:999px; background:var(--track); overflow:hidden}
.meter i{display:block; height:100%; width:var(--w, 0%); border-radius:999px; background:var(--brand); transition:width .3s ease}
.pend-big{display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; margin:6px 0 10px}
.pend-big b{font-size:40px; font-weight:800; letter-spacing:-.03em; line-height:1}
.pend-big span{color:var(--ink-2); font-size:14.5px}
.pend-chips{display:flex; flex-wrap:wrap; gap:6px; margin-top:12px}
.pchip{
  max-width:100%; min-height:34px; padding:0 11px; border-radius:999px; border:1px solid var(--line-2); background:var(--surface-2);
  font-size:13px; font-weight:700; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.pchip:hover{border-color:var(--brand)}
.pchip.more{background:none; color:var(--ink-2)}

/* ---------- indicadores de saúde e números de apoio ---------- */
.tiles{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
@container pg (min-width:760px){ .tiles{grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px} }
.tile{
  text-align:left; background:var(--surface); border:1px solid var(--line); border-radius:var(--r);
  padding:14px 14px 13px; box-shadow:inset 0 4px 0 var(--sf), var(--shadow); display:flex; flex-direction:column; gap:2px; color:var(--ink);
  transition:transform .15s ease, border-color .15s ease, background .15s ease; min-width:0;
}
.tile:hover{transform:translateY(-2px)}
.tile[aria-pressed="true"]{border-color:var(--sf); background:var(--ss)}
.tile .row{display:flex; align-items:center; gap:8px; font-weight:800; font-size:14px; color:var(--s)}
.tile .row svg{flex:0 0 auto}
.tile .num{font-size:38px; font-weight:800; letter-spacing:-.035em; line-height:1.1}
.tile .cap{font-size:12.5px; color:var(--ink-2); line-height:1.35}
.stats{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
@container pg (min-width:760px){ .stats{grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px} }
@container pg (min-width:480px) and (max-width:759px){ .stats{grid-template-columns:repeat(3,minmax(0,1fr))} }
.stat{
  text-align:left; background:var(--surface); border:1px solid var(--line); border-left:5px solid var(--sf); border-radius:14px;
  padding:11px 12px; display:flex; flex-direction:column; gap:1px; color:var(--ink); min-width:0;
}
button.stat:hover{border-color:var(--sf)}
.stat .l{font-size:12.5px; font-weight:700; color:var(--ink-2); line-height:1.25}
.stat .v{font-size:26px; font-weight:800; letter-spacing:-.03em; line-height:1.15}
.stat .c{font-size:12px; color:var(--ink-3); line-height:1.3}
.stat[data-s="bad"] .v{color:var(--bad)}
.stat[data-s="warn"] .v{color:var(--warn)}

/* ---------- lista "o que fazer agora" e agenda ---------- */
.todo-list{list-style:none; padding:0; margin:0; display:grid; gap:8px}
.todo-item{
  display:grid; grid-template-columns:34px minmax(0,1fr) auto; gap:4px 12px; align-items:center; padding:10px 12px;
  border:1px solid var(--line); border-left:5px solid var(--sf); border-radius:14px; background:var(--surface-2);
}
.todo-item .ti-ico{width:34px; height:34px; border-radius:11px; display:grid; place-items:center; background:var(--ss); color:var(--s)}
.todo-item .ti-body{min-width:0}
.todo-item .ti-name{background:none; border:0; padding:0; font-weight:800; font-size:15px; text-align:left; line-height:1.25; overflow-wrap:anywhere; color:var(--ink)}
.todo-item .ti-name:hover{color:var(--brand); text-decoration:underline}
.todo-item .ti-txt{display:block; font-size:13.5px; color:var(--ink-2); line-height:1.35; margin-top:1px}
.todo-item .ti-act{display:flex; gap:6px}
@media (max-width:520px){
  .todo-item{grid-template-columns:34px minmax(0,1fr)}
  .todo-item .ti-act{grid-column:2; justify-content:flex-start}
}
.empty-line{font-size:14.5px; color:var(--ink-2); padding:8px 2px}
.agenda-list{display:grid; gap:6px}
.ag-day{font-size:12.5px; font-weight:800; color:var(--ink-2); margin-top:8px}
.ag-day:first-child{margin-top:0}
.ag-item{
  display:grid; grid-template-columns:12px minmax(0,1fr) auto; gap:10px; align-items:center; text-align:left; width:100%;
  padding:9px 10px; border:1px solid var(--line); border-radius:12px; background:var(--surface-2); color:var(--ink);
}
.ag-item:hover{border-color:var(--e)}
.ag-item > i{width:12px; height:12px; border-radius:50%; background:var(--e)}
.ag-item b{display:block; font-size:14px; line-height:1.3; overflow-wrap:anywhere}
.ag-item small{display:block; font-size:12.5px; color:var(--ink-2)}
.ag-item .gl{font-size:12px; font-weight:700; text-decoration:none; white-space:nowrap; padding:4px 8px; border-radius:8px; border:1px solid var(--line-2); background:var(--surface)}

/* ---------- componentes comuns ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:0 16px;
  border-radius:var(--r-sm); border:1px solid var(--line-2); background:var(--surface); color:var(--ink);
  font-weight:700; white-space:nowrap; transition:transform .12s ease, background .12s ease; text-decoration:none;
}
.btn:hover{background:var(--surface-2)}
.btn:active{transform:translateY(1px)}
.btn.primary{background:var(--brand); border-color:var(--brand); color:var(--on-brand)}
.btn.primary:hover{filter:brightness(1.06)}
.btn.sm{min-height:38px; padding:0 12px; font-size:14px}
.btn.danger{color:var(--bad); border-color:var(--bad-f)}
.btn[disabled]{opacity:.55; cursor:default}
.btn svg{flex:0 0 auto}
.icon-btn{
  width:40px; height:40px; display:inline-grid; place-items:center; border-radius:12px; flex:0 0 auto;
  border:1px solid var(--line-2); background:var(--surface); color:var(--ink-2);
}
.icon-btn:hover{color:var(--brand); border-color:var(--brand)}
.icon-btn.sm{width:36px; height:36px; border-radius:10px}
.inp{
  width:100%; min-height:44px; padding:10px 12px; border-radius:var(--r-sm); border:1px solid var(--line-2);
  background:var(--surface); color:var(--ink);
}
textarea.inp{min-height:84px; resize:vertical; line-height:1.4}
textarea.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12.5px; min-height:130px}
.inp:focus-visible{border-color:var(--brand)}
.inp[disabled], .inp[readonly]{background:var(--surface-2); color:var(--ink)}
select.inp{max-width:100%; min-width:0}
select.inp[disabled]{opacity:1; -webkit-text-fill-color:var(--ink)}
.fld{display:block; min-width:0}
.fld > span, .fld-l{display:block; font-size:12.5px; font-weight:700; color:var(--ink-2); margin-bottom:5px}
.hint{font-size:13px; color:var(--ink-3)}
.pill{
  display:inline-flex; align-items:center; gap:6px; padding:3px 10px 3px 8px; border-radius:999px;
  background:var(--ss); color:var(--s); font-size:13px; font-weight:800; white-space:nowrap; line-height:1.4;
}
.pill svg{flex:0 0 auto}
.tag{display:inline-block; padding:2px 9px; border-radius:999px; font-size:12px; font-weight:800; background:var(--idle-soft); color:var(--idle); white-space:nowrap}
.tag.new{background:var(--ok-soft); color:var(--ok)}
.tag.upd{background:var(--brand-soft); color:var(--brand)}
.tag.skip{background:var(--bad-soft); color:var(--bad)}
.tag.claude{background:var(--brand-soft); color:var(--brand)}
.tag.ghost{background:none; border:1px solid var(--line-2); color:var(--ink-2)}
.stack{display:grid; gap:10px}
.span-all{grid-column:1/-1}
.link-btn{background:none; border:0; padding:6px 8px; border-radius:8px; color:var(--ink-2); font-weight:700; font-size:13.5px}
.link-btn:hover{color:var(--ink); text-decoration:underline}
.link-btn.danger{color:var(--bad)}
.nchip{
  display:inline-grid; place-items:center; min-width:38px; height:38px; padding:0 8px; border-radius:11px;
  background:var(--sf); color:var(--on); font-weight:800; font-size:19px; letter-spacing:-.02em; line-height:1;
}
.nchip.sm{min-width:30px; height:30px; font-size:15px; border-radius:9px}
.nchip.none{background:var(--idle-soft); color:var(--idle); font-size:15px}
.ncat{display:inline-flex; align-items:center; gap:5px; font-size:12.5px; font-weight:700; color:var(--s)}

/* ---------- formas de ver ---------- */
.seg{display:inline-flex; background:var(--surface); border:1px solid var(--line-2); border-radius:14px; padding:4px; gap:2px; max-width:100%}
.seg button{
  display:inline-flex; align-items:center; gap:8px; min-height:42px; padding:0 12px; border:0; border-radius:10px;
  background:transparent; font-weight:700; color:var(--ink-2); white-space:nowrap;
}
.seg button:hover{color:var(--ink)}
.seg button[aria-pressed="true"]{background:var(--brand); color:var(--on-brand)}
.seg button svg{flex:0 0 auto}
.seg.full{display:flex; width:100%}
.seg.full button{flex:1 1 0; min-width:0; justify-content:center; padding:0 6px; white-space:normal; text-align:center; line-height:1.15}
@media (max-width:560px){ .seg.full.g2{display:grid; grid-template-columns:repeat(2,minmax(0,1fr))} }
@media (max-width:640px){
  .seg.views{width:100%}
  .seg.views button{flex:1 1 0; min-width:0; padding:0 4px; flex-direction:column; gap:3px; min-height:56px; font-size:12.5px; justify-content:center}
}
.view-help{font-size:14px; color:var(--ink-2); margin:10px 0 0; max-width:84ch}
.toolbar{display:flex; flex-wrap:wrap; gap:10px; align-items:center; margin:14px 0 8px}
.search{position:relative; flex:1 1 240px}
.search svg{position:absolute; left:12px; top:50%; transform:translateY(-50%); color:var(--ink-3); pointer-events:none}
.search .inp{padding-left:40px}
.toolbar > label{flex:0 1 214px; min-width:0}
.toolbar > label.search{flex:1 1 240px}
.toolbar > label.check-line{flex:0 0 auto}
.toolbar select.inp{width:100%; min-width:0; max-width:100%; font-size:14.5px; padding-left:10px; padding-right:6px}
.filt-tog{display:none}
.filt-tog .nbadge{min-width:22px; height:22px; padding:0 6px; border-radius:999px; background:var(--brand); color:var(--on-brand); font-size:12px; font-weight:800; display:inline-grid; place-items:center}
@media (max-width:640px){
  .toolbar > label{flex:1 1 calc(50% - 10px)}
  .toolbar > label.search{flex:1 1 150px}
  .toolbar > label.check-line{flex:1 1 100%}
  .filt-tog{display:inline-flex}
  .toolbar:not(.open):not(.ftb) > label:not(.search){display:none}
}
.fchip{
  display:inline-flex; align-items:center; gap:8px; min-height:38px; padding:0 10px 0 14px; border-radius:999px;
  background:var(--ink); color:var(--bg); font-weight:700; font-size:13.5px; border:0;
}
.check-line{display:inline-flex; align-items:center; gap:9px; min-height:44px; padding:0 12px; border-radius:var(--r-sm); border:1px solid var(--line-2); background:var(--surface); font-weight:700; font-size:14px; color:var(--ink-2)}
.check-line input{width:20px; height:20px; accent-color:var(--brand)}

/* ---------- gráficos ---------- */
.chart .panel-head{align-items:center}
.ch-tog{
  display:inline-flex; align-items:center; gap:6px; min-height:34px; padding:0 10px; border-radius:10px;
  border:1px solid var(--line-2); background:var(--surface); color:var(--ink-2); font-size:12.5px; font-weight:700;
}
.ch-tog:hover{color:var(--ink); border-color:var(--ink-3)}
.ch-body{min-width:0}
.ch-note{font-size:13px; color:var(--ink-3); margin-top:10px}
.ch-empty{display:flex; flex-direction:column; justify-content:center; min-height:150px; gap:6px; color:var(--ink-2); font-size:14.5px; padding:6px 2px}
svg.lc{width:100%; height:auto; overflow:visible}
svg.lc .grid line{stroke:var(--grid); stroke-width:1}
svg.lc .zero line{stroke:var(--axis); stroke-width:1.5}
svg.lc text{font-family:inherit; font-size:11.5px; fill:var(--ink-3)}
svg.lc .yl{text-anchor:end}
svg.lc .xl{text-anchor:middle}
svg.lc .line{fill:none; stroke:var(--c1); stroke-width:2; stroke-linejoin:round; stroke-linecap:round}
svg.lc .dot{fill:var(--c1); stroke:var(--surface); stroke-width:2}
svg.lc .vlab{font-size:13px; font-weight:800; fill:var(--ink); text-anchor:start}
svg.lc .hit{fill:transparent; cursor:default}
svg.lc .hit:focus-visible{outline:none}
svg.lc .hit:focus-visible + .ring, svg.lc .ring.on{stroke:var(--ink)}
svg.lc .ring{fill:none; stroke:transparent; stroke-width:2}
svg.lc .hov{stroke:var(--ink-3); stroke-width:1; opacity:0}
svg.lc .hov.on{opacity:.6}
.hb{display:grid; gap:6px}
.hb-row{display:grid; grid-template-columns:minmax(80px,38%) minmax(0,1fr) auto; gap:10px; align-items:center; min-height:34px; padding:2px 4px; border-radius:8px}
.hb-row:hover, .hb-row:focus-visible{background:var(--surface-2)}
.hb-label{font-size:13.5px; font-weight:600; color:var(--ink); line-height:1.25; overflow-wrap:anywhere}
.hb-label small{display:block; font-size:12px; color:var(--ink-3); font-weight:500}
.hb-track{height:18px; display:flex; align-items:center}
.hb-bar{display:block; height:18px; min-width:3px; border-radius:0 4px 4px 0; background:var(--c1)}
.hb-val{font-size:14px; font-weight:800; min-width:2.2ch; text-align:right}
.rc{display:flex; align-items:flex-end; gap:6px; height:200px; padding-top:4px}
.rc-col{flex:1 1 0; min-width:0; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; gap:5px; height:100%; border-radius:8px; padding:0 2px}
.rc-col:hover, .rc-col:focus-visible{background:var(--surface-2)}
.rc-tot{font-size:13px; font-weight:800; color:var(--ink); min-height:18px}
.rc-stack{width:100%; max-width:28px; display:flex; flex-direction:column-reverse; gap:2px}
.rc-seg{display:block; width:100%; background:var(--sf)}
.rc-seg:last-child{border-radius:4px 4px 0 0}
.rc-lab{font-size:11.5px; color:var(--ink-3); white-space:nowrap}
.lg{display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:12px; font-size:13px; color:var(--ink-2)}
.lg span{display:inline-flex; align-items:center; gap:7px}
.lg i{width:12px; height:12px; border-radius:3px; background:var(--sf)}
.rc-info{display:flex; flex-wrap:wrap; gap:6px 10px; margin-top:10px}
.tview{max-height:300px; overflow:auto; border:1px solid var(--line); border-radius:var(--r-sm)}
.tview table{width:100%; border-collapse:collapse; font-size:13.5px}
.tview th, .tview td{padding:7px 10px; text-align:left; border-bottom:1px solid var(--line); vertical-align:top}
.tview th{position:sticky; top:0; background:var(--surface-2); font-size:12px; color:var(--ink-2)}
.tview td.num, .tview th.num{text-align:right; font-variant-numeric:tabular-nums}
.tip{
  position:fixed; z-index:80; max-width:min(300px, calc(100vw - 20px)); padding:9px 12px; border-radius:12px; background:var(--ink); color:var(--bg);
  font-size:13px; line-height:1.35; pointer-events:none; box-shadow:0 8px 24px rgba(0,0,0,.28);
}
.tip b{display:block; font-size:16px; font-weight:800; margin:2px 0}
.tip span{display:block; opacity:.85}

/* ---------- clientes: tabela ---------- */
.tbl-wrap{background:none; border:0; box-shadow:none}
.ctbl{width:100%; border-collapse:collapse}
.ctbl, .ctbl tbody{display:block}
.ctbl thead{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0)}
.ctbl tr.row{
  position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:12px 12px; padding:16px 14px 14px; margin:0 0 12px;
  background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:inset 0 4px 0 var(--sf), var(--shadow);
}
.ctbl td{display:block; padding:0; border:0; min-width:0}
.ctbl td.c-name{grid-column:1/-1; padding-right:84px}
.ctbl td.c-acao{grid-column:1/-1}
.ctbl td.c-btns{position:absolute; top:10px; right:10px; display:flex; gap:6px}
.ctbl td[data-label]::before{display:block; content:attr(data-label); font-size:12.5px; font-weight:700; color:var(--ink-2); margin-bottom:5px}
.ctbl td.c-name::before, .ctbl td.c-btns::before{display:none}
.name-btn{
  background:none; border:0; padding:0; text-align:left; font-weight:800; font-size:16px; line-height:1.25;
  color:var(--ink); overflow-wrap:anywhere;
}
.name-btn:hover{color:var(--brand); text-decoration:underline}
.sub-line{display:block; font-size:12.5px; color:var(--ink-2); margin-top:3px; line-height:1.35}
.cell-note{display:flex; flex-wrap:wrap; align-items:center; gap:4px 8px}
.cell-sub{display:block; font-size:12.5px; color:var(--ink-2); margin-top:4px; line-height:1.3}
.cell-sub .blk{display:block}
.cell-sub[data-s]{color:var(--s); font-weight:700}
.act-txt{font-size:13.5px; line-height:1.35; color:var(--ink-2)}
.act-txt[data-s="bad"], .act-txt[data-s="warn"]{color:var(--s); font-weight:700}
.act-txt.ok{color:var(--ok); font-weight:700; display:inline-flex; align-items:center; gap:6px}
.date-inp{min-height:40px; padding:7px 8px; font-size:14px}
@container pg (min-width:1020px){
  .ctbl{display:table; table-layout:fixed; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow); overflow:hidden}
  .ctbl tbody{display:table-row-group}
  .ctbl thead{position:static; width:auto; height:auto; overflow:visible; clip:auto; display:table-header-group}
  .ctbl tr.row{display:table-row; padding:0; margin:0; background:none; border:0; box-shadow:none; border-radius:0}
  .ctbl thead tr{display:table-row}
  .ctbl th{background:var(--surface-2); text-align:left; font-size:12.5px; font-weight:800; color:var(--ink-2); padding:8px 10px; border-bottom:1px solid var(--line-2)}
  .ctbl th.c-nota{width:116px} .ctbl th.c-saude{width:152px} .ctbl th.c-risco{width:158px} .ctbl th.c-renov{width:162px} .ctbl th.c-btns{width:104px}
  .ctbl td.c-risco .reason-line{display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden}
  .ctbl .em-pre{display:none}
  .ctbl td{display:table-cell; padding:12px 10px; vertical-align:top; border-bottom:1px solid var(--line)}
  .ctbl td.c-name{border-left:5px solid var(--sf); padding-right:10px}
  .ctbl td.c-btns{position:static; display:table-cell; text-align:right; white-space:nowrap}
  .ctbl td.c-btns .icon-btn{margin-left:4px}
  .ctbl td[data-label]::before{display:none}
  .ctbl tr.row:hover td{background:color-mix(in srgb, var(--ss) 35%, var(--surface))}
}
.th{display:inline-flex; align-items:center; gap:6px; background:none; border:0; padding:4px 0; font:inherit; color:inherit; font-weight:800; min-height:30px}
.th .arr{width:10px; opacity:.3; font-size:11px}
.th[data-on="1"]{color:var(--brand)}
.th[data-on="1"] .arr{opacity:1}
@keyframes flashbg{0%{background:color-mix(in srgb, var(--brand) 24%, var(--surface))} 100%{background:transparent}}
.ctbl tr.row.flash td{animation:flashbg 1.8s ease-out}

/* ---------- clientes: quadro por saúde ---------- */
.board{display:grid; gap:14px; grid-template-columns:minmax(0,1fr); align-items:start}
@container pg (min-width:640px){ .board{grid-template-columns:repeat(2,minmax(0,1fr))} }
@container pg (min-width:1100px){ .board{grid-template-columns:repeat(4,minmax(0,1fr))} }
.bcol{
  background:color-mix(in srgb, var(--ss) 55%, var(--bg)); border:1px solid var(--line); border-radius:var(--r);
  padding:12px; display:flex; flex-direction:column; gap:10px; min-width:0; box-shadow:inset 0 4px 0 var(--sf);
}
.bcol-head h3{display:flex; align-items:center; gap:8px; font-size:16px; font-weight:800; color:var(--s)}
.bcol-head .n{margin-left:auto; min-width:26px; height:26px; padding:0 8px; border-radius:999px; background:var(--surface); color:var(--ink); border:1px solid var(--line-2); font-size:13px; display:grid; place-items:center}
.bcol-head p{font-size:12.5px; color:var(--ink-2); margin-top:2px}
.bcol-body{display:flex; flex-direction:column; gap:10px; min-width:0}
.bempty{font-size:13.5px; color:var(--ink-3); padding:6px 4px 10px}
.bcard{
  display:flex; flex-direction:column; gap:7px; width:100%; text-align:left; padding:12px; background:var(--surface);
  border:1px solid var(--line); border-radius:14px; box-shadow:var(--shadow); color:var(--ink);
}
.bcard:hover{border-color:var(--sf)}
.bcard .b-top{display:flex; align-items:flex-start; justify-content:space-between; gap:8px}
.bcard .b-name{font-weight:800; line-height:1.25; overflow-wrap:anywhere}
.bcard .b-meta{font-size:12.5px; color:var(--ink-2); line-height:1.35}
.bcard .b-next{font-size:13px; font-weight:700; color:var(--s); line-height:1.3}
.bcard .b-pills{display:flex; flex-wrap:wrap; gap:6px}

/* ---------- clientes: mapa de notas ---------- */
.hm-wrap{overflow:auto; background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow)}
.hm{border-collapse:separate; border-spacing:3px; width:100%; min-width:520px; table-layout:fixed}
.hm th{font-size:12px; font-weight:800; color:var(--ink-2); padding:8px 6px; text-align:center; white-space:nowrap}
.hm th.c0, .hm td.c0{position:sticky; left:0; background:var(--surface); z-index:1; text-align:left; width:150px}
@container pg (min-width:720px){ .hm th.c0, .hm td.c0{width:250px} }
.hm td.c0{padding:4px 8px}
.hm td.c0 .name-btn{font-size:14px}
.hm td.cell{height:42px; text-align:center; border-radius:9px; font-weight:800; font-size:16px; background:var(--ss); color:var(--s)}
.hm td.cell[data-s="idle"]{font-weight:600; font-size:13px}
.hm td.cell.blank{background:var(--surface-2); color:var(--ink-3); font-weight:500}
.hm td.cell:hover{outline:2px solid var(--ink-3); outline-offset:-2px}
.hm td.cell{padding:0}
.hm .cellbtn{display:block; width:100%; height:100%; min-height:42px; padding:0 4px; margin:0; background:transparent; border:0; border-radius:9px; color:inherit; font:inherit; cursor:pointer}
.hm .cellbtn:focus-visible{outline:2px solid var(--ink); outline-offset:-2px}
.hm td.cell.blank .cellbtn{font-weight:500}
.hm-key{display:flex; flex-wrap:wrap; gap:6px 16px; margin:10px 0 0; font-size:13px; color:var(--ink-2)}
.hm-key span{display:inline-flex; align-items:center; gap:7px}
.hm-key i{width:14px; height:14px; border-radius:4px; background:var(--ss); border:1px solid var(--sf)}

/* ---------- reuniões ---------- */
.mgroup{margin:20px 0 8px; font-size:14px; font-weight:800; color:var(--ink-2); display:flex; align-items:center; gap:10px}
.mgroup::after{content:""; flex:1; height:1px; background:var(--line)}
.mlist{display:grid; gap:8px}
.mrow{
  display:grid; grid-template-columns:58px minmax(0,1fr) auto; gap:4px 14px; align-items:start; padding:12px 12px 12px 10px;
  background:var(--surface); border:1px solid var(--line); border-left:5px solid var(--sf); border-radius:14px; box-shadow:var(--shadow);
}
.mdate{display:flex; flex-direction:column; align-items:center; justify-content:center; padding:6px 4px; border-radius:11px; background:var(--surface-2); border:1px solid var(--line); text-align:center; line-height:1.1}
.mdate b{font-size:22px; font-weight:800; letter-spacing:-.03em}
.mdate span{font-size:11.5px; font-weight:700; color:var(--ink-2); text-transform:uppercase}
.mbody{min-width:0; display:grid; gap:6px}
.mline{display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px}
.mline .name-btn{font-size:15.5px}
.mquote{font-size:13.5px; color:var(--ink-2); font-style:italic; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:anywhere}
.msum{font-size:13px; color:var(--ink-2); line-height:1.4; overflow-wrap:anywhere}
.mact{display:flex; gap:6px}
@media (max-width:560px){
  .mrow{grid-template-columns:52px minmax(0,1fr)}
  .mact{grid-column:2}
}

/* ---------- calendário ---------- */
.cal{display:grid; gap:16px; grid-template-columns:minmax(0,1fr)}
@container pg (min-width:980px){ .cal{grid-template-columns:minmax(0,2.3fr) minmax(280px,1fr); align-items:start} }
.cal-head{display:flex; flex-wrap:wrap; align-items:center; gap:8px 10px; margin-bottom:10px}
.cal-title{font-size:21px; font-weight:800; letter-spacing:-.015em; margin-right:auto}
.cal-togs{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:12px}
.evtog{
  display:inline-flex; align-items:center; gap:8px; min-height:38px; padding:0 12px; border-radius:999px;
  border:1px solid var(--line-2); background:var(--surface); font-weight:700; font-size:13px; color:var(--ink-2);
}
.evtog i{width:10px; height:10px; border-radius:50%; background:var(--e)}
.evtog[aria-pressed="false"]{opacity:.55}
.evtog[aria-pressed="false"] i{background:transparent; box-shadow:inset 0 0 0 2px var(--e)}
[data-e="agendada"]{--e:var(--c1)} [data-e="renov"]{--e:var(--c7)} [data-e="inicio"]{--e:var(--c7)} [data-e="prazo"]{--e:var(--c2)} [data-e="feita"]{--e:var(--idle-f)}
[data-e="feita"][data-s]{--e:var(--sf)}
.cal-grid{
  display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); border:1px solid var(--line); border-radius:var(--r);
  overflow:hidden; background:var(--surface); box-shadow:var(--shadow);
}
.cal-dow{padding:8px 2px; text-align:center; font-size:12px; font-weight:800; color:var(--ink-3); background:var(--surface-2); border-bottom:1px solid var(--line)}
.cal-day{
  min-height:98px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); padding:5px 4px 4px;
  display:flex; flex-direction:column; gap:3px; min-width:0; background:var(--surface);
}
.cal-day:nth-child(7n){border-right:0}
.cal-day.out{background:var(--surface-2)}
.cal-day.out .dnum{opacity:.5}
.cal-day.past .evs{opacity:.7}
.cal-day.sel{box-shadow:inset 0 0 0 2px var(--brand)}
.dnum{
  align-self:flex-start; min-width:26px; height:26px; padding:0 6px; border:0; border-radius:999px; background:none;
  font-weight:700; font-size:13px; color:var(--ink);
}
.dnum:hover{background:var(--brand-soft)}
.cal-day.today .dnum{background:var(--brand); color:var(--on-brand)}
.evs{display:flex; flex-direction:column; gap:3px; min-width:0}
.ev{
  display:block; width:100%; border:0; border-left:3px solid var(--e); border-radius:6px; padding:3px 6px 3px 7px; min-width:0; text-align:left;
  line-height:1.25; color:var(--ink);
  background:color-mix(in srgb, var(--e) 16%, var(--surface));
}
.ev i{display:none}
.ev .evx{display:block; min-width:0}
.ev .evt, .ev .evn{display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.ev .evt{font-size:10.5px; font-weight:800; color:var(--ink-2)}
.ev .evn{font-size:12px; font-weight:700}
.ev:hover{background:color-mix(in srgb, var(--e) 28%, var(--surface))}
.ev.late{border-left-color:var(--bad-f)}
.more{font-size:11px; color:var(--ink-3); font-weight:700; background:none; border:0; padding:0 4px; text-align:left}
@media (max-width:640px){
  .cal-day{min-height:62px; padding:3px 2px}
  .evs{flex-direction:row; flex-wrap:wrap; gap:3px; padding:0 2px}
  .ev{width:auto; padding:3px; border:0; border-radius:50%}
  .ev .evx{display:none}
  .ev i{display:block; width:9px; height:9px; border-radius:50%; background:var(--e)}
  .more{padding:0 2px; font-size:10.5px}
}
.cal-side{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow); padding:14px}
.cal-side h3{font-size:16px; font-weight:800}
.cal-side .sub2{font-size:13px; color:var(--ink-2); margin:2px 0 10px}
.ag-list{display:flex; flex-direction:column; gap:8px; max-height:560px; overflow:auto; padding-right:2px}

/* ---------- janelas ---------- */
dialog.dlg{
  border:0; padding:0; border-radius:22px; background:var(--bg); color:var(--ink);
  width:min(760px, calc(100vw - 20px)); max-height:calc(100vh - 20px); overflow:auto; box-shadow:0 24px 80px rgba(0,0,0,.4);
}
dialog.dlg.wide{width:min(900px, calc(100vw - 20px))}
dialog.dlg::backdrop{background:rgba(6,18,13,.62)}
.dlg-in{padding:16px 14px 18px; display:grid; gap:16px; grid-template-columns:minmax(0,1fr)}
@media (min-width:600px){ .dlg-in{padding:22px 24px 22px} }
.dlg-top{display:flex; align-items:flex-start; justify-content:space-between; gap:12px}
.dlg-top h2{font-size:21px; font-weight:800; letter-spacing:-.015em; line-height:1.2; overflow-wrap:anywhere}
.dlg-top p{font-size:13.5px; color:var(--ink-2); margin-top:3px}
.dlg-foot{display:flex; flex-wrap:wrap; gap:8px; align-items:center}
.dlg-foot .grow{flex:1}
@media (max-width:640px){
  dialog.dlg, dialog.dlg.wide{width:100vw; max-width:100vw; height:100dvh; max-height:100dvh; border-radius:0; margin:0}
  .dlg-in{padding:calc(14px + env(safe-area-inset-top, 0px)) 14px calc(18px + env(safe-area-inset-bottom, 0px))}
  .dlg-foot.sticky{position:sticky; bottom:0; background:var(--bg); padding:10px 0 calc(6px + env(safe-area-inset-bottom, 0px)); margin-bottom:calc(-1 * env(safe-area-inset-bottom, 0px)); border-top:1px solid var(--line); z-index:2}
}
.opts{display:grid; gap:8px}
.opt{display:flex; gap:12px; align-items:flex-start; padding:10px 12px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface); cursor:pointer}
.opt input{margin-top:3px; width:20px; height:20px; accent-color:var(--brand); flex:0 0 auto}
.opt b{display:block; font-size:14.5px}
.opt small{display:block; font-size:13px; color:var(--ink-2)}
.ol{counter-reset:s; list-style:none; padding:0; margin:0; display:grid; gap:10px}
.ol li{counter-increment:s; position:relative; padding-left:38px; font-size:14.5px; color:var(--ink-2); min-height:28px}
.ol li::before{
  content:counter(s); position:absolute; left:0; top:-1px; width:28px; height:28px; border-radius:50%;
  background:var(--brand-soft); color:var(--brand); font-weight:800; display:grid; place-items:center; font-size:14px;
}
.ol li b{color:var(--ink)}
.note-box{font-size:13.5px; color:var(--ink-2); background:var(--surface); border:1px solid var(--line); border-radius:var(--r-sm); padding:10px 12px}
.note-box[data-s]{border-color:var(--sf); background:var(--ss); color:var(--ink)}
.sec-t{font-size:15px; font-weight:800; letter-spacing:-.005em}
.sec-d{font-size:13.5px; color:var(--ink-2); margin-top:2px}
.fsec{display:grid; gap:10px; grid-template-columns:minmax(0,1fr)}
.cols2{display:grid; gap:12px; grid-template-columns:minmax(0,1fr)}
@media (min-width:560px){ .cols2{grid-template-columns:repeat(2,minmax(0,1fr))} .cols3{grid-template-columns:repeat(3,minmax(0,1fr))} }
.cols3{display:grid; gap:12px; grid-template-columns:minmax(0,1fr)}

/* ---------- ficha do cliente ---------- */
.fh-cards{display:grid; gap:10px; grid-template-columns:minmax(0,1fr)}
@media (min-width:600px){ .fh-cards{grid-template-columns:repeat(3,minmax(0,1fr))} }
.fh-card{background:var(--surface); border:1px solid var(--line); border-top:4px solid var(--sf); border-radius:var(--r-sm); padding:12px 13px; display:grid; gap:4px; align-content:start}
.fh-card .k{font-size:12.5px; font-weight:700; color:var(--ink-2)}
.fh-card .v{display:flex; align-items:baseline; gap:8px; flex-wrap:wrap}
.fh-card .v b{font-size:26px; font-weight:800; letter-spacing:-.03em; line-height:1.1}
.fh-card .v span{font-size:13px; color:var(--ink-2)}
.fh-card p{font-size:13px; color:var(--ink-2); line-height:1.4}
.why{list-style:none; padding:0; margin:0; display:grid; gap:7px}
.why li{display:grid; grid-template-columns:22px minmax(0,1fr); gap:9px; align-items:start; font-size:14px; line-height:1.4}
.why li svg{color:var(--s); margin-top:1px}
.pil{display:grid; gap:10px}
.pil-row{display:grid; grid-template-columns:minmax(0,150px) minmax(0,1fr) 62px; gap:10px; align-items:center; font-size:13.5px}
.pil-row b{font-weight:700; line-height:1.25}
.pil-row small{display:block; color:var(--ink-3); font-size:12px; font-weight:500}
.pil-row .meter i{background:var(--sf)}
.pil-row .pv{text-align:right; font-weight:800}
.pil-row.off{opacity:.65}
@media (max-width:520px){ .pil-row{grid-template-columns:minmax(0,1fr) 54px} .pil-row .meter{grid-column:1/-1; order:3} }
.nl{display:flex; gap:8px; overflow-x:auto; padding:2px 2px 8px}
.nl-i{flex:0 0 auto; display:grid; justify-items:center; gap:4px; min-width:56px; padding:0; background:none; border:0; color:var(--ink)}
.nl-i small{font-size:11.5px; color:var(--ink-2); font-weight:600}
.so{list-style:none; padding:0; margin:0; display:grid; gap:8px}
.so li{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:6px 10px; align-items:center; padding:10px 12px; border:1px solid var(--line); border-left:4px solid var(--sf); border-radius:12px; background:var(--surface)}
.so li b{font-size:14px; line-height:1.3; overflow-wrap:anywhere}
.so li small{display:block; font-size:12.5px; color:var(--s); font-weight:700}
.mh{display:grid; gap:8px}
.mh-i{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 10px; align-items:start; padding:10px 12px; border:1px solid var(--line); border-radius:12px; background:var(--surface)}
.mh-i .mline{gap:6px 8px}
.gbtns{display:flex; flex-wrap:wrap; gap:8px}
.edit-form{display:grid; gap:12px; background:var(--surface); border:1px solid var(--line-2); border-radius:var(--r-sm); padding:14px}

/* ---------- registro da reunião ---------- */
.nbtns{display:flex; flex-wrap:wrap; gap:6px}
.nb{
  width:44px; height:48px; border-radius:12px; border:2px solid var(--sf); background:var(--surface); color:var(--s);
  font-weight:800; font-size:18px; display:grid; place-items:center; padding:0;
}
.nb:hover{background:var(--ss)}
.nb[aria-pressed="true"]{background:var(--sf); color:var(--on); box-shadow:0 0 0 3px color-mix(in srgb, var(--sf) 30%, transparent)}
.nb.none{width:auto; padding:0 14px; font-size:14px; border-color:var(--line-2); --s:var(--ink-2); --sf:var(--ink-3)}
.nb.none[aria-pressed="true"]{background:var(--ink); color:var(--bg); border-color:var(--ink)}
.nkey{display:flex; flex-wrap:wrap; gap:4px 14px; font-size:12.5px; color:var(--ink-2); margin-top:8px}
.nkey span{display:inline-flex; align-items:center; gap:6px}
.nkey i{width:10px; height:10px; border-radius:3px; background:var(--sf)}
.qline{font-size:14px; color:var(--ink); background:var(--brand-soft); border-radius:var(--r-sm); padding:10px 12px; line-height:1.4}
.qline b{font-weight:800}
.chipset{display:flex; flex-wrap:wrap; gap:8px}
.sgn{
  display:inline-flex; align-items:center; gap:7px; min-height:40px; padding:0 13px; border-radius:999px; border:1px solid var(--line-2);
  background:var(--surface); font-weight:700; font-size:13.5px; color:var(--ink-2);
}
.sgn[data-t="neg"]{--s:var(--bad); --sf:var(--bad-f); --ss:var(--bad-soft)}
.sgn[data-t="pos"]{--s:var(--ok); --sf:var(--ok-f); --ss:var(--ok-soft)}
.sgn[aria-pressed="true"]{background:var(--ss); border-color:var(--sf); color:var(--s)}
.sgn svg{opacity:0; width:0}
.sgn[aria-pressed="true"] svg{opacity:1; width:14px}
details.det{border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface)}
details.det > summary{cursor:pointer; padding:12px 14px; font-weight:800; list-style:none; display:flex; align-items:center; justify-content:space-between; gap:10px; min-height:48px}
details.det > summary::-webkit-details-marker{display:none}
details.det > summary::after{content:"+"; font-size:22px; line-height:1; color:var(--brand)}
details.det[open] > summary::after{content:"\2212"}
details.det > .det-in{padding:0 14px 14px; display:grid; gap:14px}
.claude-box{display:grid; gap:10px}
.cx-list{list-style:none; padding:0; margin:0; display:grid; gap:6px; font-size:13.5px}
.cx-list li{background:var(--warn-soft); color:var(--warn); border-radius:10px; padding:7px 10px; font-weight:600}
.cx-ev{font-size:13px; color:var(--ink-2); font-style:italic; margin-top:6px}
.err-line{font-size:13.5px; font-weight:700; color:var(--bad); background:var(--bad-soft); border-radius:10px; padding:8px 12px}

/* ---------- importação ---------- */
.prev-wrap{max-height:280px; overflow:auto; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface)}
.prev-tbl{width:100%; border-collapse:collapse; font-size:13.5px}
.prev-tbl th, .prev-tbl td{padding:7px 10px; text-align:left; border-bottom:1px solid var(--line); vertical-align:top}
.prev-tbl th{position:sticky; top:0; background:var(--surface-2); font-size:12px; color:var(--ink-2)}
.prev-tbl td.nm{max-width:220px; overflow-wrap:anywhere; font-weight:700}
.prev-tbl td.wn{color:var(--warn); font-size:12.5px}
.sum-line{font-size:14px; color:var(--ink-2)}
.sum-line b{color:var(--ink)}
label.link-btn{cursor:pointer}
label.link-btn:has(+ input:focus-visible){outline:3px solid color-mix(in srgb, var(--brand) 55%, transparent); outline-offset:2px}

/* ---------- vazio e carregando ---------- */
.empty{
  text-align:center; background:var(--surface); border:1px dashed var(--line-2); border-radius:var(--r);
  padding:36px 20px; display:flex; flex-direction:column; align-items:center; gap:10px;
}
.empty .ico{width:64px; height:64px; border-radius:20px; background:var(--brand-soft); color:var(--brand); display:grid; place-items:center}
.empty h3{font-size:19px; font-weight:800}
.empty p{color:var(--ink-2); max-width:52ch; font-size:14.5px}
.empty .btns{display:flex; flex-wrap:wrap; justify-content:center; gap:8px; margin-top:4px}
.skel{height:220px; border-radius:var(--r); border:1px solid var(--line); background:linear-gradient(90deg,var(--surface) 0,var(--surface-2) 50%,var(--surface) 100%); background-size:220% 100%; animation:sh 1.5s ease-in-out infinite}
@keyframes sh{from{background-position:120% 0} to{background-position:-120% 0}}

/* ---------- como funciona ---------- */
.steps{display:grid; gap:12px; grid-template-columns:minmax(0,1fr)}
@container pg (min-width:760px){ .steps{grid-template-columns:repeat(3,minmax(0,1fr))} }
.step{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:16px; box-shadow:var(--shadow)}
.step .n{width:34px; height:34px; border-radius:50%; background:var(--brand-soft); color:var(--brand); font-weight:800; display:grid; place-items:center; margin-bottom:10px}
.step h3{font-size:16.5px; font-weight:800; margin-bottom:4px}
.step p{font-size:14.5px; color:var(--ink-2)}
.block{margin-top:30px}
.block > .h2{margin-bottom:12px}
.rows{display:grid; gap:10px}
.rowc{display:grid; gap:8px; grid-template-columns:minmax(0,1fr); background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:14px 16px}
@container pg (min-width:720px){ .rowc{grid-template-columns:200px minmax(0,1fr); align-items:start; gap:16px} }
.rowc p{font-size:14.5px; color:var(--ink-2)}
.rowc p + p{margin-top:6px}
.rowc h3{font-size:15.5px; font-weight:800}
.rowc ul{margin:6px 0 0; padding-left:20px; font-size:14.5px; color:var(--ink-2); display:grid; gap:4px}
.legend-grid{display:grid; gap:10px; grid-template-columns:minmax(0,1fr)}
@container pg (min-width:760px){ .legend-grid{grid-template-columns:repeat(2,minmax(0,1fr))} }
.lgc{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:14px 16px; display:grid; gap:10px; align-content:start}
.lgc h3{font-size:15.5px; font-weight:800}
.lgc ul{list-style:none; padding:0; margin:0; display:grid; gap:8px; align-content:start}
.lgc li{display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px; align-items:start; font-size:14px; color:var(--ink-2); line-height:1.4}
.lgc li .pill{margin-top:1px}
.settings{display:grid; gap:12px; grid-template-columns:minmax(0,1fr); background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:16px}
@container pg (min-width:720px){ .settings{grid-template-columns:repeat(3,minmax(0,1fr))} }
.sources{display:grid; gap:8px; padding:0; margin:0; list-style:none}
.sources li{background:var(--surface); border:1px solid var(--line); border-radius:var(--r-sm); padding:10px 14px; font-size:14.5px; color:var(--ink-2)}
.foot-note{margin-top:34px; font-size:13px; color:var(--ink-3); text-align:center}
.code-box{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:13px; background:var(--surface-2); border:1px solid var(--line); border-radius:var(--r-sm); padding:10px 12px; overflow-wrap:anywhere; color:var(--ink)}

/* ---------- aviso rápido ---------- */
.toast{
  position:fixed; left:50%; bottom:calc(86px + env(safe-area-inset-bottom, 0px)); transform:translate(-50%,24px); opacity:0; pointer-events:none; z-index:90;
  background:var(--ink); color:var(--bg); padding:12px 18px; border-radius:14px; font-weight:700; font-size:14.5px;
  box-shadow:var(--shadow); transition:opacity .25s ease, transform .25s ease; max-width:calc(100% - 32px); text-align:center;
}
@media (min-width:960px){ .toast{bottom:24px} }
.toast.on{opacity:1; transform:translate(-50%,0)}
dialog.dlg .toast{position:sticky; bottom:8px; left:auto; transform:none; margin:0 auto; display:none; width:fit-content; opacity:1; pointer-events:auto}
dialog.dlg .toast.on{display:block}
@keyframes flash{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--brand) 65%, transparent)} 100%{box-shadow:0 0 0 16px transparent}}
.flash{animation:flash 1.8s ease-out}
body.can-admin .r-only{display:none !important}
@media (prefers-reduced-motion: reduce){
  *{animation:none !important; transition:none !important}
}

/* ---------- ajustes finais ---------- */
.gap-top{margin-top:10px}
.main{min-width:0}
.ag-item .ag-open{background:none; border:0; padding:0; text-align:left; color:inherit; min-width:0; display:block}
.ag-item .ag-open:hover b{text-decoration:underline}
.ag-item.late{border-color:var(--bad-f)}
.toolbar-info{display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; margin:2px 0 14px; font-size:13.5px; color:var(--ink-2)}
.cal-side .btn{width:100%; margin-top:10px}
.pill.lg2{padding:5px 12px 5px 10px; font-size:14px}
.sgn-t{font-size:12.5px; font-weight:800; color:var(--ink-2); margin:2px 0 -2px}
.inline-row{display:flex; flex-wrap:wrap; gap:8px; align-items:center}
.grid-2{display:grid; gap:10px; grid-template-columns:minmax(0,1fr)}
@media (min-width:560px){ .grid-2{grid-template-columns:repeat(2,minmax(0,1fr))} }
.res-list{list-style:none; padding:0; margin:0; display:grid; gap:6px; font-size:13.5px}
.res-list li{display:grid; grid-template-columns:20px minmax(0,1fr); gap:8px; align-items:start; color:var(--ink-2)}
.res-list li svg{color:var(--s)}
.res-list li[data-s]{color:var(--ink)}
.tbl-sm{width:100%; border-collapse:collapse; font-size:13.5px}
.tbl-sm th, .tbl-sm td{padding:7px 10px; text-align:left; border-bottom:1px solid var(--line); vertical-align:top}
.tbl-sm th{font-size:12px; color:var(--ink-2); background:var(--surface-2)}
.tbl-sm td.num{text-align:right; font-variant-numeric:tabular-nums}
.scroll-x{overflow-x:auto; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface)}
.brand-link{font-size:13px; font-weight:700}
.reason-line{display:block; font-size:12.5px; color:var(--ink-2); margin-top:3px; line-height:1.35}
.tone-ico{display:inline-grid; place-items:center}

/* ===== fstyle.html ===== */

/* ===================== FINANCEIRO ===================== */
:root{
  --c4:#1BAF7A; --c5:#C2417A; --fin-in:#126B41; --fin-out:#A52D23;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){ --c4:#199E70; --c5:#E0679D; --fin-in:#5DD39E; --fin-out:#FF8F84; }
}
:root[data-theme="dark"]{ --c4:#199E70; --c5:#E0679D; --fin-in:#5DD39E; --fin-out:#FF8F84; }
[data-m="med"]{--mc:var(--c1)} [data-m="law"]{--mc:var(--c4)} [data-m="varejo"]{--mc:var(--c2)} [data-m=""]{--mc:var(--idle-f)}

/* troca entre NPS e Financeiro */
.modsw{display:grid; grid-template-columns:1fr 1fr; gap:3px; padding:4px; border-radius:14px; background:var(--surface-2); border:1px solid var(--line)}
.modsw button{min-height:40px; border:0; border-radius:10px; background:none; font-weight:800; font-size:13.5px; color:var(--ink-2); display:inline-flex; align-items:center; justify-content:center; gap:7px}
.modsw button[aria-pressed="true"]{background:var(--surface); color:var(--brand); box-shadow:0 1px 3px rgba(15,35,28,.14)}
.mtop .modsw{grid-template-columns:auto auto; padding:3px}
body.fin-ok .mtop{flex-wrap:wrap; row-gap:10px}
body.fin-ok .mtop .modsw{order:3; flex:1 1 100%; grid-template-columns:1fr 1fr}
.mtop .brand b{white-space:nowrap}
.mtop .modsw button{min-height:34px; padding:0 10px; font-size:12.5px}
body:not(.fin-ok) .fin-only{display:none !important}
body.mod-fin .nps-mod{display:none !important}
body:not(.mod-fin) .fin-mod{display:none !important}
.snav-t{font-size:11.5px; font-weight:800; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3); padding:2px 12px 4px}

/* barra de filtros do financeiro */
.fbar{display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; margin:0 0 18px; padding:10px 12px; border-radius:var(--r); background:var(--surface); border:1px solid var(--line); box-shadow:var(--shadow)}
.fbar .mnav{display:flex; align-items:center; gap:6px}
.fbar .mtitle{font-weight:800; font-size:16.5px; min-width:12ch; text-align:center; letter-spacing:-.01em}
.fbar .grow{flex:1 1 auto}
.mchips{display:flex; flex-wrap:wrap; gap:6px}
.mchip{display:inline-flex; align-items:center; gap:7px; min-height:36px; padding:0 12px; border-radius:999px; border:1px solid var(--line-2); background:var(--surface); font-weight:700; font-size:13px; color:var(--ink-2)}
.mchip i{width:9px; height:9px; border-radius:50%; background:var(--mc, var(--brand))}
.mchip[aria-pressed="true"]{background:var(--ink); color:var(--bg); border-color:var(--ink)}
.live{display:inline-flex; align-items:center; gap:7px; font-size:12.5px; font-weight:700; color:var(--ink-2)}
.live i{width:8px; height:8px; border-radius:50%; background:var(--ok-f); box-shadow:0 0 0 0 color-mix(in srgb, var(--ok-f) 60%, transparent); animation:pulse 2.2s ease-out infinite}
.live.off i{background:var(--idle-f); animation:none}
@keyframes pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb, var(--ok-f) 55%, transparent)} 100%{box-shadow:0 0 0 9px transparent}}
@media (max-width:640px){ .fbar{gap:8px} .fbar .mnav{width:100%; justify-content:space-between} .mchips{width:100%} .mchip{flex:1 1 0; justify-content:center; padding:0 6px; white-space:nowrap} .mpre{display:none} }

/* dinheiro */
.amt{font-variant-numeric:tabular-nums; font-weight:800; white-space:nowrap}
.amt.in{color:var(--fin-in)} .amt.out{color:var(--fin-out)}
.num{font-variant-numeric:tabular-nums}

/* destaque do resultado */
.fhero .hero-num{font-size:clamp(40px,6vw,76px)}
.fhero .hero-num.none{font-size:clamp(36px,5.2vw,56px)}
.fhero .hero-num.neg{color:#FFD2CC}
.hstats{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
.hstat{background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.18); border-radius:14px; padding:10px 12px; min-width:0}
.hstat span{display:block; font-size:12.5px; opacity:.88; font-weight:700}
.hstat b{display:block; font-size:21px; font-weight:800; letter-spacing:-.02em; line-height:1.2; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.hstat small{display:block; font-size:12px; opacity:.85}
.hbtns{display:flex; flex-wrap:wrap; gap:8px; margin-top:14px}
.hbtns .btn{background:rgba(255,255,255,.14); color:var(--hero-ink); border-color:rgba(255,255,255,.34)}
.hbtns .btn.primary{background:var(--hero-ink); color:var(--hero-a); border-color:var(--hero-ink)}

/* cartões de números */
.kpis{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px}
@container pg (min-width:700px){ .kpis{grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px} }
@container pg (min-width:1060px){ .kpis{grid-template-columns:repeat(6,minmax(0,1fr))} .kpis.k4{grid-template-columns:repeat(4,minmax(0,1fr))} .kpis.k5{grid-template-columns:repeat(5,minmax(0,1fr))} }
.kpi{
  text-align:left; background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:12px 13px; display:flex; flex-direction:column; gap:2px;
  color:var(--ink); min-width:0; box-shadow:inset 0 3px 0 var(--sf), var(--shadow); position:relative
}
button.kpi:hover{border-color:var(--sf)}
.kpi .l{font-size:12.5px; font-weight:700; color:var(--ink-2); line-height:1.25; display:flex; align-items:center; gap:6px}
.kpi .v{font-size:23px; font-weight:800; letter-spacing:-.025em; line-height:1.2; font-variant-numeric:tabular-nums; overflow-wrap:anywhere}
.kpi .c{font-size:12px; color:var(--ink-3); line-height:1.3}
.kpi .c[data-s]{color:var(--s); font-weight:700}
.kpi[data-s="bad"] .v{color:var(--bad)}
.delta{display:inline-flex; align-items:center; gap:3px; font-size:12px; font-weight:800; color:var(--s)}

/* listas de linhas (lançamentos, previstos, contratos) */
.flist{display:grid; gap:8px}
.frow{
  display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:4px 12px; align-items:center; padding:10px 12px;
  background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--sf); border-radius:14px
}
.frow .fdate{display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:48px; padding:5px 4px; border-radius:10px; background:var(--surface-2); border:1px solid var(--line); line-height:1.1; text-align:center}
.frow .fdate b{font-size:17px; font-weight:800}
.frow .fdate span{font-size:10.5px; font-weight:700; color:var(--ink-2); text-transform:uppercase}
.frow .fmain{min-width:0}
.frow .ft{font-weight:800; font-size:14.5px; line-height:1.3; overflow-wrap:anywhere}
.frow .fm{display:flex; flex-wrap:wrap; gap:4px 10px; font-size:12.5px; color:var(--ink-2); margin-top:2px; align-items:center}
.frow .fend{display:flex; flex-direction:column; align-items:flex-end; gap:5px}
.frow .facts{display:flex; gap:6px; flex-wrap:wrap; justify-content:flex-end}
@container pg (min-width:900px){ .frow .fend{flex-direction:row; align-items:center; gap:14px} .frow .fend .amt{min-width:120px; text-align:right} }
.mtag{display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:700; color:var(--ink-2)}
.mtag i{width:8px; height:8px; border-radius:50%; background:var(--mc)}
@media (max-width:600px){
  .frow{grid-template-columns:auto minmax(0,1fr)}
  .frow .fend{grid-column:1 / -1; flex-direction:row; justify-content:space-between; align-items:center}
}
.fsum{display:flex; flex-wrap:wrap; gap:6px 18px; align-items:center; margin:2px 0 12px; font-size:13.5px; color:var(--ink-2)}
.fsum b{color:var(--ink)}
.grp-t{margin:18px 0 8px; font-size:13.5px; font-weight:800; color:var(--ink-2); display:flex; align-items:center; gap:10px}
.grp-t::after{content:""; flex:1; height:1px; background:var(--line)}
.grp-t .amt{font-size:13.5px}

/* prestação de contas */
.pc-head{display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin:0 0 14px}
.accs{display:grid; gap:14px; grid-template-columns:minmax(0,1fr)}
@container pg (min-width:900px){ .accs{grid-template-columns:repeat(3,minmax(0,1fr)); align-items:start} }
@container pg (min-width:640px) and (max-width:899px){ .accs{grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start} }
.acc{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow); padding:14px; display:grid; gap:12px; min-width:0}
.acc h3{font-size:16.5px; font-weight:800; display:flex; align-items:center; gap:8px}
.acc h3 small{font-size:12.5px; font-weight:700; color:var(--ink-3)}
.acc-sec{display:grid; gap:4px}
.acc-sec > b{font-size:12px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-3)}
.acc-row{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; font-size:13.5px; padding:3px 0; border-bottom:1px dashed var(--line)}
.acc-row span{overflow-wrap:anywhere}
.acc-row:last-child{border-bottom:0}
.acc-tot{display:grid; gap:4px; padding:10px 12px; border-radius:12px; background:var(--surface-2); border:1px solid var(--line)}
.acc-tot .acc-row{border:0; font-weight:700}
.acc-tot .acc-row.big{font-size:15.5px; font-weight:800}
.more-btn{justify-self:start}
.split{width:100%; border-collapse:collapse; font-size:14px}
.split th, .split td{padding:9px 10px; border-bottom:1px solid var(--line); text-align:right; font-variant-numeric:tabular-nums}
.split th:first-child, .split td:first-child{text-align:left}
.split th{font-size:12px; color:var(--ink-2); background:var(--surface-2)}
.split tr.tot td{font-weight:800; border-top:2px solid var(--line-2)}
.split td.big{font-weight:800; font-size:15.5px}
.transfers{display:grid; gap:8px}
.transfer{display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto; gap:10px; align-items:center; padding:12px 14px; border-radius:14px; background:var(--surface); border:1px solid var(--line)}
.transfer .who{font-weight:800; overflow-wrap:anywhere}
.transfer .arr{color:var(--brand)}
.transfer .amt{font-size:17px}
@media (max-width:560px){ .transfer{grid-template-columns:minmax(0,1fr) auto; } .transfer .arr{display:none} .transfer .who.to::before{content:"para "; font-weight:600; color:var(--ink-2)} .transfer .amt{grid-column:1 / -1} }
.steps4{display:grid; gap:10px; grid-template-columns:minmax(0,1fr)}
@container pg (min-width:760px){ .steps4{grid-template-columns:repeat(4,minmax(0,1fr))} }
.steps4 .step{padding:14px}
.lock{display:inline-flex; align-items:center; gap:6px; font-size:13px; font-weight:800; padding:5px 11px; border-radius:999px; background:var(--ss); color:var(--s)}

/* contratos */
.ctr{display:grid; grid-template-columns:minmax(0,1fr) 150px 110px 200px 214px; gap:10px 14px; align-items:center; padding:12px 14px;
  background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--mc); border-radius:14px}
.ctr .cn{min-width:0}
.ctr .cn b{display:block; font-weight:800; overflow-wrap:anywhere}
.ctr .cn small{display:flex; flex-wrap:wrap; gap:4px 10px; font-size:12.5px; color:var(--ink-2); margin-top:2px}
.ctr .lbl{display:none; font-size:12px; font-weight:700; color:var(--ink-2); margin-bottom:3px}
.ctr .money-inp{width:100%}
.ctr .cact .pill{white-space:normal; text-align:center}
.ctr-head{display:grid; grid-template-columns:minmax(0,1fr) 150px 110px 200px 214px; gap:10px 14px; padding:0 14px 6px 18px; font-size:12px; font-weight:800; color:var(--ink-2)}
@container pg (max-width:980px){
  .ctr{grid-template-columns:minmax(0,1fr) 120px minmax(0,1.2fr)} .ctr .cn{grid-column:1 / -1} .ctr .lbl{display:block} .ctr-head{display:none}
  .ctr .cact{grid-column:1 / -1; justify-content:flex-start}
}
@container pg (max-width:560px){
  .ctr{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  .ctr > :nth-child(4){grid-column:1 / -1}
}
.cact{display:flex; gap:6px; justify-content:flex-end}
.money-inp{font-variant-numeric:tabular-nums; text-align:right; min-height:40px; padding:7px 10px}
.flag{display:inline-flex; align-items:center; gap:5px; font-size:12px; font-weight:800; color:var(--warn); background:var(--warn-soft); border-radius:999px; padding:2px 9px}
.banner{display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; padding:12px 14px; border-radius:var(--r-sm); background:var(--ss); border:1px solid var(--sf); margin:0 0 14px; font-size:14px}
.banner .grow{flex:1 1 260px}
.banner b{font-weight:800}

/* gráficos do financeiro */
svg.bc{width:100%; height:auto; overflow:visible}
svg.bc text{font-family:inherit; font-size:11.5px; fill:var(--ink-3)}
svg.bc .yl{text-anchor:end} svg.bc .xl{text-anchor:middle}
svg.bc .grid line{stroke:var(--grid); stroke-width:1}
svg.bc .zero line{stroke:var(--axis); stroke-width:1.5}
svg.bc .b1{fill:var(--c1)} svg.bc .b2{fill:var(--c2)} svg.bc .b4{fill:var(--c4)} svg.bc .b5{fill:var(--c5)} svg.bc .b7{fill:var(--c7)}
svg.bc .bgh{fill:var(--track)}
svg.bc .ln{fill:none; stroke:var(--ink); stroke-width:2; stroke-linejoin:round; stroke-linecap:round}
svg.bc .ln.l1{stroke:var(--c1)} svg.bc .ln.l2{stroke:var(--c2)} svg.bc .ln.l7{stroke:var(--c7)} svg.bc .ln.l4{stroke:var(--c4)}
svg.bc .ln.dash{stroke-dasharray:5 5}
svg.bc .dt{fill:var(--ink); stroke:var(--surface); stroke-width:2}
svg.bc .dt.l1{fill:var(--c1)} svg.bc .dt.l2{fill:var(--c2)} svg.bc .dt.l7{fill:var(--c7)} svg.bc .dt.l4{fill:var(--c4)}
svg.bc .vlab{font-size:12.5px; font-weight:800; fill:var(--ink)}
svg.bc .hit{fill:transparent}
svg.bc .hit:focus-visible{outline:none}
svg.bc .hov{stroke:var(--ink-3); stroke-width:1; opacity:0}
svg.bc .hov.on{opacity:.6}
svg.bc .band{fill:var(--c1); opacity:.1}
svg.bc .wf-up{fill:var(--c1)} svg.bc .wf-down{fill:var(--c2)} svg.bc .wf-tot{fill:var(--ink-2)}
svg.bc .conn{stroke:var(--line-2); stroke-width:1; stroke-dasharray:3 3}
.lgd{display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:10px; font-size:13px; color:var(--ink-2)}
.lgd span{display:inline-flex; align-items:center; gap:7px}
.lgd i{width:12px; height:12px; border-radius:3px; background:var(--k)}
.lgd i.ln{height:3px; border-radius:2px}
.k1{--k:var(--c1)} .k2{--k:var(--c2)} .k4{--k:var(--c4)} .k5{--k:var(--c5)} .k7{--k:var(--c7)} .kink{--k:var(--ink)} .kidle{--k:var(--idle-f)}
.hb-bar.k1{background:var(--c1)} .hb-bar.k2{background:var(--c2)} .hb-bar.k4{background:var(--c4)} .hb-bar.k5{background:var(--c5)} .hb-bar.k7{background:var(--c7)}
.hb-bar.km{background:var(--mc)}
.stackbar{display:flex; gap:2px; height:16px; border-radius:6px; overflow:hidden; background:var(--track)}
.stackbar i{display:block; height:100%; min-width:2px; background:var(--k)}
.spark{display:block; width:100%; height:34px}
.spark path{fill:none; stroke:var(--c1); stroke-width:2}
.spark circle{fill:var(--c1)}

/* saúde financeira */
.checks{list-style:none; padding:0; margin:0; display:grid; gap:8px}
.checks li{display:grid; grid-template-columns:22px minmax(0,1fr) auto; gap:10px; align-items:start; font-size:14px; line-height:1.4}
.checks li svg{color:var(--s); margin-top:1px}
.checks li b{display:block; font-weight:800}
.checks li small{display:block; font-size:12.5px; color:var(--ink-2)}
.checks li .amt{font-size:13.5px; padding-top:1px}

/* comercial: quadro por etapa */
.kan{display:grid; grid-auto-flow:column; grid-auto-columns:minmax(230px,1fr); gap:12px; overflow-x:auto; padding:2px 2px 10px}
.kcol{background:var(--surface-2); border:1px solid var(--line); border-radius:var(--r); padding:10px; display:flex; flex-direction:column; gap:8px; min-width:0}
.kcol h3{font-size:14.5px; font-weight:800; display:flex; align-items:center; gap:8px}
.kcol h3 .n{margin-left:auto; font-size:12.5px; min-width:24px; height:24px; border-radius:999px; background:var(--surface); border:1px solid var(--line-2); display:grid; place-items:center}
.kcol .ksum{font-size:12.5px; color:var(--ink-2)}
.kcard{display:grid; gap:6px; padding:10px; background:var(--surface); border:1px solid var(--line); border-radius:12px; box-shadow:var(--shadow); text-align:left; color:var(--ink); width:100%}
.kcard b{font-weight:800; overflow-wrap:anywhere}
.kcard small{font-size:12.5px; color:var(--ink-2)}
.kmove{display:flex; gap:6px; justify-content:space-between}

/* grades de preenchimento (operação, equipe, orçamento) */
.gwrap{overflow:auto; max-height:70vh; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface)}
.gtbl{border-collapse:separate; border-spacing:0; font-size:13.5px; min-width:100%}
.gtbl th, .gtbl td{padding:6px 8px; border-bottom:1px solid var(--line); text-align:left; vertical-align:middle; background:var(--surface)}
.gtbl thead th{position:sticky; top:0; z-index:2; background:var(--surface-2); font-size:12px; color:var(--ink-2); min-width:110px; line-height:1.25}
.gtbl .g0{position:sticky; left:0; z-index:1; min-width:170px; max-width:220px; font-weight:700; border-right:1px solid var(--line)}
.gtbl thead .g0{z-index:3}
.gtbl tr.gtot td{font-weight:800; background:var(--surface-2)}
.gin{width:100%; min-width:84px; min-height:36px; padding:6px 8px; border-radius:9px; border:1px solid var(--line-2); background:var(--surface); text-align:right; font-variant-numeric:tabular-nums}
.gin:focus-visible{border-color:var(--brand)}
.gin.saved{border-color:var(--ok-f)}

/* riscos */
.matrix{display:grid; grid-template-columns:28px repeat(5,minmax(0,1fr)); gap:4px; max-width:520px}
.matrix .ax{font-size:11.5px; font-weight:800; color:var(--ink-3); display:grid; place-items:center}
.matrix .cell{min-height:46px; border-radius:9px; display:grid; place-items:center; font-weight:800; font-size:15px; background:var(--ss); color:var(--s); border:1px solid color-mix(in srgb, var(--sf) 40%, transparent)}
.matrix .cell.zero{background:var(--surface-2); color:var(--ink-3); font-weight:600; border-color:var(--line)}
.mx-cap{font-size:12.5px; color:var(--ink-2); margin-top:6px}

/* rotina */
.rot{display:grid; gap:12px; grid-template-columns:minmax(0,1fr)}
@container pg (min-width:900px){ .rot{grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start} }
.rot-box{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); padding:14px; display:grid; gap:8px}
.rot-box h3{font-size:15.5px; font-weight:800; display:flex; align-items:center; gap:8px}
.rot-box h3 .meter{flex:1 1 auto; max-width:140px; height:8px}
.chk{display:flex; align-items:flex-start; gap:10px; font-size:14px; padding:6px 4px; border-radius:8px; cursor:pointer}
.chk:hover{background:var(--surface-2)}
.chk input{width:20px; height:20px; accent-color:var(--brand); margin:1px 0 0; flex:0 0 auto}
.chk.done span{color:var(--ink-3); text-decoration:line-through}

/* indicadores */
.isec{margin:22px 0 10px; display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 12px}
.isecd > summary{list-style:none; cursor:pointer; border-radius:12px}
.isecd > summary::-webkit-details-marker{display:none}
.isecd > summary .chev{margin-left:auto; align-self:center; display:inline-flex; color:var(--ink-3); transition:transform .15s}
.isecd[open] > summary .chev{transform:rotate(90deg)}
.isecd > summary:focus-visible{outline:2px solid var(--brand); outline-offset:3px}
@media (max-width:640px){ .isecd{border-bottom:1px solid var(--line)} .isecd > summary{margin:0; padding:16px 2px; display:grid; grid-template-columns:minmax(0,1fr) auto; column-gap:12px; row-gap:2px} .isecd > summary h2{grid-column:1} .isecd > summary span{grid-column:1} .isecd > summary .chev{grid-column:2; grid-row:1 / 3} .isecd[open] > .igrid{padding-bottom:16px} }
.isec h2{font-size:19px; font-weight:800; letter-spacing:-.01em}
.isec span{font-size:13px; color:var(--ink-2)}
.igrid{display:grid; gap:10px; grid-template-columns:minmax(0,1fr); align-items:start}
.ind details.det > summary{font-size:13px; font-weight:700; min-height:38px; padding:8px 12px; color:var(--ink-2)}
.ind details.det > summary::after{font-size:18px}
.ov-grid.top{align-items:start}
#navFin .nav-btn{min-height:40px}
#navFin{gap:2px}
@container pg (min-width:700px){ .igrid{grid-template-columns:repeat(2,minmax(0,1fr))} }
@container pg (min-width:1100px){ .igrid{grid-template-columns:repeat(3,minmax(0,1fr))} }
.ind{display:grid; gap:6px; align-content:start; padding:12px 13px; background:var(--surface); border:1px solid var(--line); border-radius:14px; box-shadow:inset 3px 0 0 var(--sf); min-width:0}
.ind .it{display:flex; align-items:flex-start; justify-content:space-between; gap:8px}
.ind .it b{font-size:14.5px; font-weight:800; line-height:1.3}
.ind .iv{font-size:22px; font-weight:800; letter-spacing:-.02em; color:var(--ink); font-variant-numeric:tabular-nums}
.ind[data-s="bad"] .iv{color:var(--bad)} .ind[data-s="ok"] .iv{color:var(--ok)} .ind[data-s="warn"] .iv{color:var(--warn)}
.ind .iv.none{font-size:14px; font-weight:700; color:var(--ink-3)}
.ind .id{font-size:13px; color:var(--ink-2); line-height:1.4}
.ind .imeta{display:flex; flex-wrap:wrap; gap:4px 10px; font-size:12px; color:var(--ink-3)}
.ind ol, .ind ul.il{margin:0; padding-left:18px; font-size:13px; display:grid; gap:2px}
.ind ul.il{list-style:none; padding:0}
.ind ul.il li{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px; border-bottom:1px dashed var(--line); padding:2px 0}
.ind ul.il li span:last-child{font-weight:700; font-variant-numeric:tabular-nums; text-align:right}
.prio{font-size:11px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--brand); background:var(--brand-soft); border-radius:999px; padding:2px 8px; white-space:nowrap}
.ibar{display:flex; flex-wrap:wrap; gap:8px 16px; font-size:13.5px; color:var(--ink-2); margin:4px 0 6px}
.ibar b{color:var(--ink)}

/* simulador e premissas */
.sim{display:grid; gap:14px; grid-template-columns:minmax(0,1fr)}
@container pg (min-width:900px){ .sim{grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:start} }
.sim-out{display:grid; gap:8px}
.sim-line{display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:10px; align-items:baseline; font-size:14px; padding:6px 0; border-bottom:1px dashed var(--line)}
.sim-line b{font-weight:800}
.sim-line .delta{min-width:9ch; justify-content:flex-end}
.tax{display:grid; gap:10px; grid-template-columns:minmax(0,1fr)}
@container pg (min-width:760px){ .tax{grid-template-columns:repeat(2,minmax(0,1fr))} }

/* ficha do sócio */
.sgrid{display:grid; gap:14px; grid-template-columns:minmax(0,1fr)}
@container pg (min-width:900px){ .sgrid{grid-template-columns:repeat(3,minmax(0,1fr)); align-items:start} }
.scard{background:var(--surface); border:1px solid var(--line); border-radius:var(--r); box-shadow:var(--shadow); padding:16px; display:grid; gap:10px; min-width:0}
.scard .sn{display:flex; align-items:center; gap:10px}
.scard .av{width:42px; height:42px; border-radius:14px; display:grid; place-items:center; font-weight:800; background:var(--brand-soft); color:var(--brand); font-size:16px; flex:0 0 auto}
.scard h3{font-size:17px; font-weight:800}
.scard .big{font-size:30px; font-weight:800; letter-spacing:-.03em; line-height:1.1; font-variant-numeric:tabular-nums}
.txt-box{white-space:pre-wrap; font-size:14px; color:var(--ink-2); background:var(--surface-2); border:1px solid var(--line); border-radius:var(--r-sm); padding:10px 12px; min-height:44px}

/* agenda financeira */
[data-e="receber"]{--e:var(--c1)} [data-e="pagar"]{--e:var(--c2)} [data-e="obrig"]{--e:var(--c7)} [data-e="renovf"]{--e:var(--c4)} [data-e="rotina"]{--e:var(--idle-f)}

/* análise do Claude */
.ai-out{white-space:pre-wrap; font-size:14.5px; line-height:1.55; background:var(--surface); border:1px solid var(--line); border-radius:var(--r-sm); padding:12px 14px; min-height:60px}
.mais-list{display:grid; gap:6px}
.mais-list .nav-btn{border:1px solid var(--line); background:var(--surface)}
@media (max-width:640px){ .fpage .seg.views{display:grid; grid-template-columns:repeat(2,minmax(0,1fr))} .fpage .seg.views button{flex-direction:row; min-height:44px; gap:6px; white-space:normal; text-align:left; line-height:1.15; font-size:13px; justify-content:flex-start; padding:0 10px} }

/* ===================== explicações ===================== */
.kpi .kx{display:none}
body.explica .kpi .kx{display:block; font-size:12px; line-height:1.35; color:var(--ink-2); border-top:1px dashed var(--line); margin-top:6px; padding-top:6px}
.exp-tog{display:inline-flex; align-items:center; gap:8px; min-height:36px; padding:0 12px 0 8px; border-radius:999px; border:1px solid var(--line-2); background:var(--surface); font-weight:700; font-size:13px; color:var(--ink-2)}
.exp-tog .sw{width:30px; height:18px; border-radius:999px; background:var(--track); position:relative; flex:0 0 auto; transition:background .15s}
.exp-tog .sw i{position:absolute; top:2px; left:2px; width:14px; height:14px; border-radius:50%; background:var(--surface); box-shadow:0 1px 2px rgba(0,0,0,.25); transition:left .15s}
.exp-tog[aria-pressed="true"]{color:var(--ink)}
.exp-tog[aria-pressed="true"] .sw{background:var(--brand)}
.exp-tog[aria-pressed="true"] .sw i{left:14px}
.fbar .tlbl{min-width:0; text-align:left}
.gloss{display:grid; gap:4px 18px; grid-template-columns:minmax(0,1fr); margin:10px 0 0}
.gloss dt{font-weight:800; margin-top:8px}
.gloss dd{margin:0; font-size:14px; color:var(--ink-2); line-height:1.45}
.gloss dd .hint{display:block; margin-top:2px}
@container pg (min-width:900px){ .gloss{grid-template-columns:220px minmax(0,1fr)} .gloss dt{margin-top:0} }

/* ===================== HOJE ===================== */
.today-card{display:grid; gap:16px}
.td-head{display:flex; flex-wrap:wrap; gap:14px 28px; justify-content:space-between; align-items:flex-start}
.td-head > div:first-child{flex:1 1 320px; min-width:0}
.td-date{font-size:clamp(24px,3.2vw,32px); font-weight:800; letter-spacing:-.02em; line-height:1.15; margin:4px 0 4px}
.td-big{display:grid; gap:2px; padding:12px 16px; border-radius:var(--r-sm); background:var(--surface-2); border:1px solid var(--line); min-width:0; flex:0 1 300px}
.td-big span{font-size:12.5px; font-weight:800; color:var(--ink-2)}
.td-big b{font-size:28px; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums; color:var(--fin-in)}
.td-big b.neg{color:var(--fin-out)}
.td-big small{font-size:12px; color:var(--ink-3); line-height:1.35}
.td-meters{display:grid; gap:14px; grid-template-columns:minmax(0,1fr)}
@container pg (min-width:760px){ .td-meters{grid-template-columns:repeat(2,minmax(0,1fr))} }
.tdm{display:grid; gap:6px}
.tdm-t{display:flex; flex-wrap:wrap; justify-content:space-between; gap:4px 10px; font-size:14px}
.tdm-t span{font-variant-numeric:tabular-nums; color:var(--ink-2); font-weight:700}
.tdm small{font-size:12.5px; color:var(--ink-2)}
.meter.m-in i{background:var(--c1)} .meter.m-out i{background:var(--c2)} .meter.m-brand i{background:var(--brand)}
.setup-card{display:grid; gap:12px; border-color:color-mix(in srgb, var(--brand) 40%, var(--line)); background:linear-gradient(0deg, var(--surface), color-mix(in srgb, var(--brand-soft) 60%, var(--surface)))}
.su-row{display:flex; flex-wrap:wrap; gap:12px 24px; align-items:center; justify-content:space-between}
.su-txt{flex:1 1 360px; min-width:0}
.su-txt h2{font-size:19px; font-weight:800; letter-spacing:-.01em}
.su-txt p{font-size:14px; color:var(--ink-2); margin-top:4px; max-width:70ch}
.su-act{display:grid; gap:4px; justify-items:start}
.su-act small{font-size:12px; color:var(--ink-3)}
svg.bc .prev{opacity:.38}
svg.bc .today-l{stroke:var(--ink); stroke-width:1.5; stroke-dasharray:3 3}
.lgd i.lprev{opacity:.38}
.day-pick{display:grid; gap:6px; margin-top:12px; padding:10px 12px; border-radius:var(--r-sm); background:var(--surface-2); border:1px solid var(--line); font-size:14px}
.day-items{list-style:none; margin:0; padding:0; display:grid; gap:4px}
.day-items li{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:10px; border-bottom:1px dashed var(--line); padding:3px 0}
.day-items li:last-child{border-bottom:0}

/* ===================== ASSISTENTE ===================== */
#fdWiz .dlg-top > .grow{flex:1 1 auto; min-width:0}
.wz-top{display:flex; justify-content:space-between; gap:10px; font-size:12.5px; font-weight:800; color:var(--ink-2); text-transform:uppercase; letter-spacing:.04em}
.wz-bar{height:8px; margin:8px 0 12px}
.wz-bar i{background:var(--brand)}
.wz-body{display:grid; gap:16px}
.wz-q{display:grid; gap:8px}
.wz-q > b{font-size:15px}
.wz-days{display:flex; flex-wrap:wrap; gap:8px; align-items:center}
.wz-day{min-width:52px; min-height:48px; border-radius:12px; border:1px solid var(--line-2); background:var(--surface); font-weight:800; font-size:17px; color:var(--ink)}
.wz-day:hover{border-color:var(--brand)}
.wz-day[aria-pressed="true"]{background:var(--brand); color:var(--on-brand); border-color:var(--brand)}
.wz-dayin{width:120px; min-height:48px}
.wz-chips{display:flex; flex-wrap:wrap; gap:8px}
.wz-chip{display:inline-flex; flex-direction:column; align-items:flex-start; gap:1px; min-height:44px; padding:6px 12px; border-radius:12px; border:1px solid var(--line-2); background:var(--surface); font-weight:700; font-size:13.5px; color:var(--ink); text-align:left}
.wz-chip span{font-size:12px; color:var(--ink-2); font-weight:700}
.wz-chip b{font-variant-numeric:tabular-nums}
.wz-chip:hover{border-color:var(--brand)}
.wz-chip[aria-pressed="true"]{background:var(--brand); color:var(--on-brand); border-color:var(--brand)}
.wz-money{max-width:260px; min-height:48px; font-size:18px}
.wz-known{font-size:15px; font-weight:700}
.wz-big{font-size:34px; font-weight:800; letter-spacing:-.02em}
.wz-table{display:grid; gap:6px}
.wz-tr{display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) 84px 92px; gap:8px; align-items:center}
.wz-th{font-size:12px; font-weight:800; color:var(--ink-2)}
.wz-n{font-weight:700; overflow-wrap:anywhere}
.wz-tr .inp{min-height:42px}
.wz-ck{display:flex; justify-content:center}
.wz-ck input{width:22px; height:22px; accent-color:var(--brand)}
@media (max-width:560px){
  .wz-tr{grid-template-columns:minmax(0,1fr) 76px 56px}
  .wz-tr > :nth-child(2){grid-column:1 / -1; order:4}
  .wz-th > :nth-child(2){display:none}
  .wz-th > :nth-child(4){font-size:0; text-align:center}
  .wz-th > :nth-child(4)::after{content:"Auto"; font-size:12px}
  .wz-tr:not(.wz-th){padding:8px 0; border-bottom:1px dashed var(--line)}
}

/* ===================== PAINÉIS ===================== */
.dtabs{margin-bottom:6px}
@media (min-width:641px){ .dtabs{display:flex; flex-wrap:wrap} }
.dash-sub{display:flex; flex-wrap:wrap; gap:8px 16px; align-items:center; justify-content:space-between; margin:6px 0 14px}
.dash-sub .view-help{margin:0; flex:1 1 360px}
.seg.sm button{min-height:36px; font-size:13px; padding:0 10px}

/* ===================== CALCULADORA ===================== */
.calc-card{display:grid; gap:12px}
.calc-l{display:block}
.calc-in{width:100%; min-height:56px; font-size:21px; font-weight:700; font-variant-numeric:tabular-nums; padding:10px 14px}
.calc-res{display:flex; flex-wrap:wrap; align-items:baseline; gap:4px 14px}
.calc-res b{font-size:clamp(28px,4vw,38px); font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.calc-res span{font-size:13px; color:var(--ink-2)}
.calc-keys{display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:8px}
.ck{min-height:50px; border-radius:12px; border:1px solid var(--line-2); background:var(--surface); font-size:19px; font-weight:800; color:var(--ink)}
.ck:hover{border-color:var(--brand)}
.ck.op{background:var(--surface-2); color:var(--brand)}
.ck.txt{font-size:14px}
.ck.eq{grid-column:span 4; background:var(--brand); color:var(--on-brand); border-color:var(--brand)}
.hist-row{display:flex; justify-content:space-between; align-items:baseline; gap:10px; width:100%; text-align:left; padding:9px 12px; border-radius:10px; border:1px solid var(--line); background:var(--surface); color:var(--ink); font-size:14px}
.hist-row span{overflow-wrap:anywhere; font-variant-numeric:tabular-nums}
.hist-row b{font-variant-numeric:tabular-nums; white-space:nowrap}
.hist-row small{color:var(--ink-2); font-size:12.5px; text-align:right}
.hist-row:hover{border-color:var(--brand)}
.cc-grid{display:grid; gap:14px; grid-template-columns:minmax(0,1fr)}
@container pg (min-width:760px){ .cc-grid{grid-template-columns:repeat(2,minmax(0,1fr)); align-items:start} }
@container pg (min-width:1200px){ .cc-grid{grid-template-columns:repeat(3,minmax(0,1fr))} }
.cc-card{display:grid; gap:10px; align-content:start}
.cc-card .panel-head{margin-bottom:0}
.cc-body{display:grid; gap:12px}
.cc-f{display:grid; gap:8px; grid-template-columns:repeat(2,minmax(0,1fr))}
.cc-f .fld{min-width:0}
.cc-f .fld span{font-size:12.5px}
@media (max-width:420px){ .cc-f{grid-template-columns:minmax(0,1fr)} }
.cc-out{display:grid; gap:4px; padding:12px 14px; border-radius:var(--r-sm); background:var(--surface-2); border:1px solid var(--line)}
.cc-bl{font-size:12.5px; font-weight:800; color:var(--ink-2)}
.cc-big{font-size:26px; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.cc-lines{margin:2px 0 6px; padding-left:18px; font-size:13.5px; color:var(--ink-2); display:grid; gap:2px}
.cc-src{font-size:12px; color:var(--ink-3)}
.cc-src a{color:var(--ink-2)}

/* ===== quem está usando ===== */
.eu-chip{display:flex; align-items:center; gap:8px; width:100%; min-height:40px; padding:6px 10px; margin-bottom:8px; border-radius:12px; border:1px solid var(--line); background:var(--surface-2); color:var(--ink); font-weight:800; font-size:13.5px; text-align:left}
.eu-chip small{margin-left:auto; font-size:11.5px; font-weight:700; color:var(--ink-3)}
.eu-chip:hover{border-color:var(--brand)}
.autor{font-size:11.5px; color:var(--ink-3); font-style:italic}
.ftag{display:inline-flex; align-items:center; gap:4px; font-size:11.5px; font-weight:800; color:var(--ink-2); background:var(--surface-2); border:1px solid var(--line); border-radius:999px; padding:1px 8px}
.clip{display:inline-flex; align-items:center; gap:4px; font-size:12px; font-weight:800; color:var(--brand)}

/* ===== lançamentos por bloco ===== */
.blk-sec{margin:22px 0 8px; font-size:15px; font-weight:800; letter-spacing:-.01em}
.blk{border:1px solid var(--line); border-radius:var(--r); background:var(--surface); margin-bottom:8px; overflow:hidden}
.blk[data-s="bad"]{border-color:var(--bad-f)}
.blk > summary{list-style:none; display:grid; grid-template-columns:auto minmax(0,1fr) auto auto auto; gap:10px; align-items:center; padding:12px 14px; cursor:pointer; min-height:56px}
.blk > summary::-webkit-details-marker{display:none}
.blk > summary .chev{display:inline-flex; color:var(--ink-3); transition:transform .2s ease}
.blk[open] > summary .chev{transform:rotate(90deg)}
.blk[data-s="none"] > summary{opacity:.72}
.blk-ico{display:inline-flex; align-items:center; justify-content:center; width:34px; height:34px; border-radius:10px; background:var(--brand-soft); color:var(--brand)}
.blk-n{min-width:0; display:flex; flex-direction:column}
.blk-n b{font-size:14.5px; font-weight:800}
.blk-n small{font-size:12.5px; color:var(--ink-2)}
.blk-v{display:flex; flex-direction:column; align-items:flex-end}
.blk-v b{font-size:15px; font-weight:800; font-variant-numeric:tabular-nums}
.blk-v small{font-size:12px; color:var(--ink-3); font-variant-numeric:tabular-nums}
.blk > .meter{height:4px; border-radius:0; margin:0 14px}
.blk-body{padding:10px 14px 14px; display:grid; gap:8px}
@container pg (max-width:560px){ .blk > summary{grid-template-columns:auto minmax(0,1fr) auto; } .blk > summary .blk-v{grid-column:2 / 3; align-items:flex-start} .blk > summary .icon-btn{grid-row:1} }
.stackbar.big{height:22px; border-radius:8px}
.kb0{--k:var(--c1)} .kb1{--k:var(--c2)} .kb2{--k:var(--c4)} .kb3{--k:var(--c5)} .kb4{--k:var(--c7)} .kb5{--k:var(--idle-f)}
.blk-lgd{display:flex; flex-wrap:wrap; gap:6px}
.blk-chip{display:inline-flex; align-items:center; gap:7px; min-height:36px; padding:4px 10px; border-radius:999px; border:1px solid var(--line); background:var(--surface); font-size:12.5px; font-weight:700; color:var(--ink-2)}
.blk-chip i{width:10px; height:10px; border-radius:3px; background:var(--k)}
.blk-chip b{color:var(--ink); font-variant-numeric:tabular-nums}
.cards-row{display:grid; gap:8px; grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.card-mini{display:flex; flex-direction:column; align-items:flex-start; gap:3px; padding:12px; border-radius:var(--r-sm); border:1px solid var(--line); background:var(--surface-2); text-align:left; color:var(--ink)}
.card-mini:hover{border-color:var(--brand)}
.card-mini b{font-size:17px; font-weight:800; font-variant-numeric:tabular-nums}
.card-mini small{font-size:12.5px; color:var(--ink-2)}
.card-mini.wide{width:100%}
.cm-t{display:inline-flex; align-items:center; gap:6px; font-weight:800; font-size:13.5px}
.cat-blk{padding:10px 0; border-bottom:1px solid var(--line)}
.cat-blk:last-child{border-bottom:0}
.cat-h{display:flex; align-items:center; gap:10px; margin-bottom:8px}
.cat-h b{flex:1; font-size:14px}
.cat-h .blk-ico{width:28px; height:28px}
.cat-chips{display:flex; flex-wrap:wrap; gap:6px}
.cat-chip{display:inline-flex; align-items:center; gap:6px; padding:4px 10px; min-height:32px; border-radius:999px; background:var(--surface-2); border:1px solid transparent; font-size:12.5px; font-weight:700; color:var(--ink)}
.cat-chip b{font-size:12px; color:var(--ink-2); font-variant-numeric:tabular-nums}
.cat-chip.custom{border-color:var(--brand); background:var(--brand-soft)}
.cat-chip.off{opacity:.55; text-decoration:line-through}
.cat-chip:disabled{cursor:default; color:var(--ink)}

/* ===== lançamento rápido ===== */
.qk{gap:16px}
.qk-step{display:grid; gap:10px}
.qk-t{font-size:14.5px; font-weight:800}
.qk-two{display:grid; grid-template-columns:1fr 1fr; gap:8px}
.qk-big{display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; min-height:74px; border-radius:var(--r-sm); border:1.5px solid var(--line-2); background:var(--surface); font-weight:800; font-size:15px; color:var(--ink)}
.qk-big.in span{color:var(--fin-in)} .qk-big.out span{color:var(--fin-out)}
.qk-big[aria-pressed="true"].in{border-color:var(--fin-in); background:var(--ok-soft)}
.qk-big[aria-pressed="true"].out{border-color:var(--fin-out); background:var(--bad-soft)}
.qk-tiles{display:grid; grid-template-columns:repeat(auto-fill,minmax(132px,1fr)); gap:8px}
.qk-tile{display:flex; flex-direction:column; align-items:flex-start; gap:6px; padding:10px; min-height:66px; border-radius:var(--r-sm); border:1px solid var(--line-2); background:var(--surface); font-weight:800; font-size:13px; line-height:1.25; color:var(--ink); text-align:left}
.qk-tile span:first-child{color:var(--brand)}
.qk-tile:hover{border-color:var(--brand)}
.qk-tile[aria-pressed="true"]{background:var(--brand); color:var(--on-brand); border-color:var(--brand)}
.qk-tile[aria-pressed="true"] span:first-child{color:var(--on-brand)}
.qk-val{font-size:20px; font-weight:800}
.qk-q{display:grid; gap:8px}
.qk-l{font-size:13px; font-weight:800; color:var(--ink-2)}
.wz-chip.sm{min-height:36px; padding:4px 10px; font-size:12.5px}

/* ===== histórico ===== */
.hlist{display:grid; gap:6px; margin-top:6px}
.hrow{display:grid; grid-template-columns:52px minmax(0,1fr); gap:10px; padding:10px 12px; border-radius:var(--r-sm); background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--idle-f)}
.hrow[data-a="criou"]{border-left-color:var(--ok-f)}
.hrow[data-a="apagou"]{border-left-color:var(--bad-f)}
.h-time{font-weight:800; font-size:13px; font-variant-numeric:tabular-nums; color:var(--ink-2); padding-top:1px}
.h-main{min-width:0; display:grid; gap:4px}
.h-t{font-size:14px; line-height:1.4; overflow-wrap:anywhere}
.h-meta{display:flex; gap:6px; flex-wrap:wrap}
.h-det{display:grid; gap:2px}
.h-ch{display:flex; flex-wrap:wrap; align-items:center; gap:4px 6px; font-size:12.5px; color:var(--ink-2)}
.h-old{text-decoration:line-through; color:var(--ink-3)}
.h-new{color:var(--ink); font-weight:700}
.h-arr{display:inline-flex; color:var(--ink-3)}

/* ===== período ===== */
.fbar .pseg{display:inline-flex}
.pertbl .link-btn{white-space:nowrap; padding-left:0; text-align:left; color:var(--brand)}
.pertbl td.tot, .pertbl tr.tot td{font-weight:800}
.pertbl tr.tot td{border-top:2px solid var(--line-2)}
.num{text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap}
.neg{color:var(--fin-out)}
.dre-tbl{width:100%; border-collapse:collapse; font-size:13.5px}
.dre-tbl th, .dre-tbl td{padding:8px 10px; border-bottom:1px solid var(--line); text-align:left; vertical-align:top}
.dre-tbl th{font-size:12px; font-weight:800; color:var(--ink-2); text-transform:uppercase; letter-spacing:.04em; white-space:nowrap}
.dre-tbl th.num, .dre-tbl td.num{text-align:right}
.dre-tbl td small{display:block; font-size:11.5px; color:var(--ink-3); font-weight:500}
.dre-tbl tr.tot td{font-weight:800; background:var(--surface-2)}
.dre-tbl tr.big td{font-size:15px; background:var(--brand-soft)}
.dre-tbl tr.sub td{color:var(--ink-2); font-size:12.5px}
.dre-tbl tr.sub td:first-child{padding-left:26px}
.dre-tbl tr.sep td{border-bottom:0; padding-top:16px; font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.04em; color:var(--ink-3)}
.dre-tbl td.av{color:var(--ink-3); font-size:12px}
.dre-tbl .tog{border:0; background:none; padding:0; font:inherit; color:inherit; display:inline-flex; align-items:center; gap:4px; text-align:left}
.met-grid{display:grid; gap:10px; grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.met{display:grid; gap:6px; padding:14px; border-radius:var(--r); background:var(--surface); border:1px solid var(--line); border-top:4px solid var(--sf)}
.met-h{display:flex; justify-content:space-between; gap:8px; align-items:baseline}
.met-h b{font-size:13.5px; font-weight:800}
.met-h span{font-size:11.5px; font-weight:800; color:var(--ink-3); letter-spacing:.04em}
.met-v{font-size:24px; font-weight:800; letter-spacing:-.02em; font-variant-numeric:tabular-nums}
.met-n{font-size:13px; line-height:1.45; color:var(--ink)}
.met-c{font-size:12px; color:var(--ink-3); line-height:1.4}
.met-c b{color:var(--ink-2)}

/* ===== diagnóstico ===== */
.ov-k{font-size:12px; font-weight:800; text-transform:uppercase; letter-spacing:.06em; color:var(--s)}
.dg-hero{display:grid; gap:10px; padding:18px; border-radius:var(--r); background:var(--ss); border:1px solid var(--sf)}
.dg-hero h2{font-size:20px; font-weight:800; letter-spacing:-.01em; color:var(--s)}
.dg-hero p{font-size:14.5px; line-height:1.5}
.dg-need{display:grid; gap:8px; grid-template-columns:repeat(auto-fill,minmax(210px,1fr))}
.dg-n{padding:14px; border-radius:var(--r-sm); background:var(--surface); border:1px solid var(--line)}
.dg-n b{display:block; font-size:28px; font-weight:800; letter-spacing:-.02em; color:var(--brand)}
.dg-n span{display:block; font-weight:800; font-size:13.5px}
.dg-n small{display:block; font-size:12.5px; color:var(--ink-2); margin-top:3px}
.al-list{display:grid; gap:8px}
.al{display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px; padding:12px 14px; border-radius:var(--r-sm); background:var(--surface); border:1px solid var(--line); border-left:4px solid var(--sf)}
.al .tone-ico{color:var(--s)}
.al b{display:block; font-size:14px; font-weight:800}
.al p{font-size:13px; color:var(--ink-2); line-height:1.45; margin-top:2px}
.al .al-do{color:var(--ink); font-weight:700}
.al .al-m{display:flex; flex-wrap:wrap; gap:6px 10px; margin-top:6px; align-items:center; font-size:12px}
.al .al-m a{color:var(--ink-2)}
.al ul{margin:4px 0 0; padding-left:18px; font-size:12.5px; color:var(--ink-2)}

/* ===== cobranças ===== */
.cal-grid{display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:4px}
.cal-wd{font-size:11px; font-weight:800; text-transform:uppercase; color:var(--ink-3); text-align:center; padding:4px 0}
.cal-d{min-height:92px; padding:6px; border-radius:10px; background:var(--surface); border:1px solid var(--line); display:flex; flex-direction:column; gap:3px; min-width:0}
.cal-d.out{background:transparent; border-color:transparent}
.cal-d.hoje{border-color:var(--brand); box-shadow:inset 0 0 0 1px var(--brand)}
.cal-d .dn{font-size:12px; font-weight:800; color:var(--ink-2)}
.cob-ev{display:block; width:100%; padding:3px 6px; border-radius:6px; border:0; font-size:11.5px; font-weight:800; text-align:left; line-height:1.25; background:var(--ss); color:var(--s); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.cob-ev small{font-weight:700; opacity:.85}
.cal-lgd{display:flex; flex-wrap:wrap; gap:6px 14px; font-size:12.5px; color:var(--ink-2); margin:8px 0}
.cal-lgd span{display:inline-flex; align-items:center; gap:6px}
.cal-lgd i{width:10px; height:10px; border-radius:3px; background:var(--sf)}
@container pg (max-width:620px){ .cal-d{min-height:56px; padding:4px} .cob-ev{font-size:0; padding:0; height:7px; border-radius:4px; background:var(--sf)} .cob-ev small{display:none} }
.parc-row{display:grid; grid-template-columns:repeat(auto-fill,minmax(110px,1fr)); gap:6px; margin-top:8px}
.parc{padding:8px; border-radius:10px; background:var(--ss); border:1px solid var(--sf); font-size:12px}
button.parc{cursor:pointer; text-align:left; color:var(--ink); font-weight:700; white-space:nowrap}
.dre-tbl button.parc{padding:3px 8px}
.parc b{display:block; font-size:13.5px; color:var(--s); font-variant-numeric:tabular-nums}

/* cores da Google Agenda, iguais às do Google */
.gcor{display:inline-flex; align-items:center; gap:5px; margin-left:8px; font-size:11.5px; font-weight:700; color:var(--ink-2)}
.gcor::before{content:""; width:10px; height:10px; border-radius:50%; background:var(--gc)}
[data-c="11"]{--gc:#D50000} [data-c="5"]{--gc:#F6BF26} [data-c="6"]{--gc:#F4511E} [data-c="9"]{--gc:#3F51B5} [data-c="8"]{--gc:#616161}

/* ===== relatórios ===== */
.rel-opts{display:grid; gap:8px; grid-template-columns:repeat(auto-fill,minmax(230px,1fr))}
.rel-opts .check-line{width:100%}
.rel-prev{border:1px solid var(--line); border-radius:var(--r-sm); padding:16px; background:var(--surface); font-size:14px; line-height:1.55; white-space:pre-wrap; overflow-wrap:anywhere; max-height:480px; overflow:auto}

/* ===== dicionário ===== */
.dic{display:grid; gap:10px; grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.dic-it{padding:14px; border-radius:var(--r); background:var(--surface); border:1px solid var(--line); display:grid; gap:6px}
.dic-it h3{font-size:15px; font-weight:800; display:flex; gap:8px; align-items:baseline; flex-wrap:wrap}
.dic-it h3 span{font-size:12px; font-weight:800; color:var(--brand); letter-spacing:.04em}
.dic-it p{font-size:13.5px; line-height:1.5}
.dic-it .ex{font-size:13px; color:var(--ink-2); background:var(--surface-2); border-radius:10px; padding:8px 10px}
.dic-letra{grid-column:1 / -1; font-size:13px; font-weight:800; color:var(--ink-3); margin-top:6px}

/* ===== checklist 100% ===== */
.ck-hero{display:grid; grid-template-columns:auto minmax(0,1fr); gap:16px; align-items:center; padding:16px; border-radius:var(--r); background:var(--surface); border:1px solid var(--line)}
.ck-ring{width:84px; height:84px}
.ck-ring circle{fill:none; stroke-width:9}
.ck-ring .bg{stroke:var(--track)}
.ck-ring .fg{stroke:var(--brand); stroke-linecap:round; transform:rotate(-90deg); transform-origin:50% 50%}
.ck-ring text{font-size:20px; font-weight:800; fill:var(--ink); text-anchor:middle; dominant-baseline:central}
.ck-list{display:grid; gap:8px}
.ck{display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:12px; align-items:center; padding:12px 14px; border-radius:var(--r-sm); background:var(--surface); border:1px solid var(--line)}
.ck .tone-ico{color:var(--s)}
.ck b{display:block; font-size:14px}
.ck p{font-size:12.5px; color:var(--ink-2); line-height:1.45}
.ck .why{color:var(--ink-3)}
@container pg (max-width:560px){ .ck{grid-template-columns:auto minmax(0,1fr)} .ck .btn{grid-column:2} }

/* ===== ztheme.html ===== */

/* ===================================================================
   CACTUS OS: visual escuro das imagens de referência.
   Um tema só, escolhido de propósito: fundo quase preto com toque verde,
   cartões com cor própria, menu lateral com a logo da CactusMed.
   Os tokens daqui vencem os anteriores em qualquer configuração de tema.
   =================================================================== */
:root:not(.zz1):not(.zz2){
  --bg:#070B0A; --surface:#0E1412; --surface-2:#141B18; --surface-3:#19221E;
  --ink:#EEF4F0; --ink-2:#A9B8B0; --ink-3:#7F8F88;
  --line:#1C2622; --line-2:#2A3631;
  --brand:#22C55E; --brand-2:#16A34A; --brand-soft:#0F2A1C; --on-brand:#03140A;
  --hero-a:#0B2A1B; --hero-b:#11402A; --hero-ink:#EEF4F0; --lime:#B9F27C;
  --ok:#4ADE80; --ok-soft:#0F2A1C; --ok-f:#22C55E; --on-ok-f:#03140A;
  --warn:#FBBF24; --warn-soft:#2B2110; --warn-f:#F59E0B; --on-warn-f:#1F1500;
  --bad:#F87171; --bad-soft:#2C1214; --bad-f:#EF4444; --on-bad-f:#FFFFFF;
  --idle:#9FB1C2; --idle-soft:#141E26; --idle-f:#64748B; --on-idle-f:#FFFFFF;
  --lg-ok:#4ADE80; --lg-warn:#FBBF24; --lg-bad:#F87171;
  --track:#1A2420;
  --c1:#22C55E; --c2:#EF4444; --c4:#3B82F6; --c5:#F59E0B; --c7:#A855F7;
  --h-blue:#3B82F6; --h-purple:#A855F7; --h-teal:#14B8A6; --h-amber:#F59E0B; --h-green:#22C55E; --h-red:#EF4444; --h-pink:#EC4899;
  --fin-in:#4ADE80; --fin-out:#F87171;
  --grid:#1A2420; --axis:#2A3631;
  --shadow:none;
  --r:14px; --r-sm:10px; --side:248px;
  color-scheme:dark;
}
body{background:var(--bg); font-size:15px}
body::before{content:""; position:fixed; inset:0; pointer-events:none; z-index:-1;
  background:radial-gradient(900px 500px at 12% -10%, rgba(34,197,94,.08), transparent 60%), radial-gradient(700px 400px at 100% 0%, rgba(59,130,246,.05), transparent 60%)}
[data-m="med"]{--mc:#22C55E} [data-m="law"]{--mc:#3B82F6} [data-m="varejo"]{--mc:#A855F7}

/* ---------- menu lateral ---------- */
.side-logo{padding:2px 6px 6px}
.side-logo img{width:190px; height:auto; display:block}
.side .snav{gap:2px}
.side .snav + .snav{margin-top:2px}
.nav-btn{min-height:40px; gap:12px; padding:0 12px; border-radius:10px; font-size:14.5px; font-weight:600; color:var(--ink-2); border:1px solid transparent; position:relative}
.nav-btn svg{color:var(--ink-2)}
.nav-btn:hover{background:var(--surface-2); color:var(--ink)}
.nav-btn[aria-current="page"]{background:rgba(34,197,94,.12); color:#EAFBEF; border-color:var(--brand)}
.nav-btn[aria-current="page"] svg{color:var(--brand)}
.nav-btn .nbadge{height:20px; min-width:22px; font-size:11.5px; font-weight:800; background:var(--surface-3); border-color:var(--line-2)}
.nav-btn .nbadge[data-s="bad"]{background:var(--bad-f); color:#fff; border-color:var(--bad-f)}
.nav-btn .nbadge[data-s="warn"]{background:var(--warn-f); color:var(--on-warn-f); border-color:var(--warn-f)}
.nav-sub{display:grid; gap:2px; padding-left:16px; margin:2px 0 4px; border-left:1px solid var(--line-2); margin-left:20px}
.nav-sub .nav-btn{min-height:36px; font-size:13.5px}
body.mod-fin .nav-sub{display:none}
.nav-more > summary{list-style:none; cursor:pointer}
.nav-more > summary::-webkit-details-marker{display:none}
.nav-more[open] > summary{color:var(--ink)}
.nav-more > .nav-btn{padding-left:28px; font-size:13.5px; min-height:36px}
.side{background:#090E0C; border-right:1px solid var(--line); gap:14px; padding:20px 12px 18px}
.side-foot{gap:8px; padding-top:12px; border-top:1px solid var(--line)}
.side-brand{display:grid; gap:2px; padding:4px 6px}
.side-brand img{width:150px; height:auto; margin-bottom:4px}
.side-brand small{font-size:11.5px; color:var(--ink-3)}
.side-brand p{font-size:13px; color:var(--ink-2); line-height:1.35}
.side-today{font-size:12px; color:var(--ink-3); padding:0 6px}
.side .brand-link{padding:0 6px; font-size:12.5px}
.eu-chip{display:flex; align-items:center; gap:10px; width:100%; min-height:44px; padding:6px 10px; border-radius:12px; border:1px solid var(--line-2); background:var(--surface-2); color:var(--ink); font-weight:800; font-size:13.5px}
.eu-chip small{margin-left:auto; font-size:11.5px; color:var(--ink-3)}
.uav{flex:0 0 auto; width:32px; height:32px; border-radius:50%; display:grid; place-items:center; font-size:12px; font-weight:800; color:#fff; background:var(--avc, var(--h-blue)); box-shadow:0 0 0 2px var(--surface), 0 0 0 3px var(--avc, var(--h-blue))}
.uav.sm{width:24px; height:24px; font-size:10px; box-shadow:none}
.uav[data-i="0"]{--avc:#3B82F6} .uav[data-i="1"]{--avc:#22C55E} .uav[data-i="2"]{--avc:#A855F7} .uav[data-i="3"]{--avc:#F59E0B} .uav[data-i="4"]{--avc:#EC4899}

/* ---------- barra do topo ---------- */
.mtop{display:none !important}
.topbar{position:sticky; top:env(safe-area-inset-top, 0px); z-index:40; display:flex; align-items:center; gap:14px; padding:10px 16px; background:rgba(9,14,12,.92); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); border-bottom:1px solid var(--line)}
.tb-logo img{width:34px; height:auto; display:block}
.tb-title{display:flex; flex-direction:column; min-width:0; line-height:1.2; flex:0 1 auto; max-width:330px}
.tb-title b{font-size:17px; font-weight:800; letter-spacing:-.01em; white-space:nowrap}
.tb-title small{font-size:12.5px; color:var(--ink-3); white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.tb-title .tb-today{display:none}
.tb-search{position:relative; flex:1 1 320px; min-width:0; max-width:520px; margin-left:auto}
.tb-s{display:flex; align-items:center; gap:8px; height:40px; padding:0 10px 0 12px; border-radius:10px; background:var(--surface); border:1px solid var(--line-2); color:var(--ink-3)}
.tb-s:focus-within{border-color:var(--brand)}
.tb-s input{flex:1; min-width:0; background:none; border:0; outline:none; color:var(--ink); font-size:14px; height:100%}
.tb-s input::placeholder{color:var(--ink-3)}
.tb-s kbd{font:inherit; font-size:11px; font-weight:700; color:var(--ink-3); border:1px solid var(--line-2); border-radius:6px; padding:1px 6px; white-space:nowrap}
.gs-res{position:absolute; left:0; right:0; top:46px; max-height:420px; overflow:auto; background:var(--surface-2); border:1px solid var(--line-2); border-radius:12px; box-shadow:0 18px 40px rgba(0,0,0,.5); padding:6px; display:grid; gap:2px}
.gs-it{display:grid; grid-template-columns:28px minmax(0,1fr) auto; gap:10px; align-items:center; padding:8px 10px; border-radius:8px; text-align:left; color:var(--ink); width:100%}
.gs-it:hover, .gs-it[aria-selected="true"]{background:var(--surface-3)}
.gs-it b{display:block; font-size:13.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.gs-it small{display:block; font-size:12px; color:var(--ink-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.gs-it .gi{width:28px; height:28px; border-radius:8px; display:grid; place-items:center; background:var(--surface-3); color:var(--brand)}
.gs-it .gt{font-size:11px; font-weight:800; color:var(--ink-3); text-transform:uppercase; letter-spacing:.05em}
.gs-vazio{padding:12px; font-size:13.5px; color:var(--ink-3)}
.tb-per{position:relative; display:inline-flex; align-items:center; gap:8px; height:40px; padding:0 12px; border-radius:10px; border:1px solid var(--line-2); background:var(--surface); font-size:13.5px; font-weight:700; color:var(--ink); white-space:nowrap; cursor:pointer}
.tb-per svg{color:var(--ink-2)}
.tb-per input{position:absolute; inset:0; opacity:0; cursor:pointer; width:100%; height:100%}
.tb-bell{position:relative; width:40px; height:40px; border-radius:10px; border:1px solid var(--line-2); background:var(--surface); display:grid; place-items:center; color:var(--ink-2); flex:0 0 auto}
.tb-bell:hover{color:var(--ink)}
.tb-n{position:absolute; top:-6px; right:-6px; min-width:18px; height:18px; padding:0 5px; border-radius:999px; background:var(--bad-f); color:#fff; font-size:11px; font-weight:800; display:grid; place-items:center}
.tb-users{display:flex; align-items:center; gap:12px}
.tb-u{display:flex; align-items:center; gap:8px; padding:2px; border-radius:999px; color:var(--ink); text-align:left}
.tb-u b{display:block; font-size:13px; line-height:1.15; white-space:nowrap}
.tb-u small{display:block; font-size:11.5px; color:var(--ink-3); line-height:1.15}
.tb-u.eu .uav{box-shadow:0 0 0 2px var(--surface), 0 0 0 4px var(--brand)}
.tb-u:not(.eu){opacity:.82}
.tb-new{flex:0 0 auto}
@media (max-width:1380px){ .tb-u:not(.eu) .tb-un{display:none} .tb-users{gap:6px} }
@media (max-width:1180px){ .tb-title small:not(.tb-today){display:none} .tb-new{display:none} }
@media (min-width:960px){ .tb-logo{display:none} }
@media (max-width:959px){
  .topbar{gap:10px; padding:8px 12px}
  .tb-title b{font-size:15.5px}
  .tb-title .tb-today{display:block}
  .tb-title small:not(.tb-today){display:none}
  .tb-search, .tb-per, .tb-u:not(.eu), .tb-u .tb-un, .tb-new{display:none}
  .tb-bell{margin-left:auto}
}
.content{max-width:1560px}
@media (min-width:960px){ .content{padding:22px 26px 64px} }

/* ---------- títulos ---------- */
.h1{font-size:clamp(24px,3.4vw,32px); font-weight:800; letter-spacing:-.02em}
.sub{font-size:14px; color:var(--ink-2)}
.pg-head{margin:0 0 16px; align-items:center}
.acts-top{display:flex; flex-wrap:wrap; gap:8px}

/* ---------- botões ---------- */
.btn{min-height:40px; border-radius:10px; border-color:var(--line-2); background:var(--surface); color:var(--ink); font-weight:700; font-size:14px}
.btn:hover{background:var(--surface-2); border-color:#3A4842}
.btn.primary{background:var(--brand); border-color:var(--brand); color:var(--on-brand); font-weight:800}
.btn.primary:hover{background:#2FD46A; filter:none}
.btn.sm{min-height:34px; font-size:13px; padding:0 12px}
.icon-btn{border-radius:10px}
.link-btn{color:var(--brand)}

/* ---------- cartões de números (KPI) ---------- */
.kpi{--kh:var(--h-blue); background:linear-gradient(135deg, color-mix(in srgb, var(--kh) 22%, var(--surface)) 0%, color-mix(in srgb, var(--kh) 8%, var(--surface)) 100%);
  border:1px solid color-mix(in srgb, var(--kh) 55%, transparent); border-radius:14px; box-shadow:none; padding:14px 16px 14px 74px; min-height:104px; justify-content:center; gap:3px; overflow:hidden}
.kpi[data-s="ok"]{--kh:var(--h-green)} .kpi[data-s="bad"]{--kh:var(--h-red)} .kpi[data-s="warn"]{--kh:var(--h-amber)}
.kpis > .kpi[data-s="idle"]:nth-child(4n+1){--kh:var(--h-blue)}
.kpis > .kpi[data-s="idle"]:nth-child(4n+2){--kh:var(--h-purple)}
.kpis > .kpi[data-s="idle"]:nth-child(4n+3){--kh:var(--h-teal)}
.kpis > .kpi[data-s="idle"]:nth-child(4n){--kh:var(--h-amber)}
.kpi .kpi-ic{position:absolute; left:16px; top:50%; transform:translateY(-50%); width:44px; height:44px; border-radius:50%; background:var(--kh); color:#fff; display:grid; place-items:center; box-shadow:0 0 0 5px color-mix(in srgb, var(--kh) 18%, transparent)}
.kpi:has(.kx) .kpi-ic{top:30px; transform:none}
.kpi .kpi-bars{position:absolute; right:14px; top:14px; display:flex; align-items:flex-end; gap:2px; height:18px; opacity:.9}
.kpi .kpi-bars i{display:block; width:3px; border-radius:1px; background:var(--kh)}
.kpi .kpi-bars i:nth-child(1){height:30%} .kpi .kpi-bars i:nth-child(2){height:55%} .kpi .kpi-bars i:nth-child(3){height:40%} .kpi .kpi-bars i:nth-child(4){height:75%} .kpi .kpi-bars i:nth-child(5){height:100%}
.kpi .l{font-size:13px; font-weight:700; color:#DDE7E1; padding-right:26px}
.kpi .v{font-size:24px; font-weight:800; color:#fff; letter-spacing:-.02em}
.kpi[data-s="bad"] .v{color:#fff}
.kpi .c{font-size:12.5px; color:color-mix(in srgb, var(--kh) 55%, #D7E2DB); font-weight:600}
.kpi .kx{font-size:12px; color:#C9D6CF; border-top:1px dashed color-mix(in srgb, var(--kh) 40%, transparent); margin-top:6px; padding-top:6px}
button.kpi:hover{border-color:var(--kh); filter:brightness(1.08)}
.kpis{gap:12px}
@container pg (max-width:560px){ .kpi{padding:12px 12px 12px 56px; min-height:92px} .kpi .kpi-ic{width:32px; height:32px; left:12px; box-shadow:0 0 0 3px color-mix(in srgb, var(--kh) 18%, transparent)} .kpi .kpi-ic svg{width:17px; height:17px} .kpi .v{font-size:19px} .kpi .kpi-bars{display:none} .kpi .l{padding-right:0} }

@container pg (min-width:560px){ .kpis, .kpis.k4, .kpis.k5, .kpis.k8{grid-template-columns:repeat(auto-fit,minmax(232px,1fr))} }
.dre-tbl td{vertical-align:middle}
.ch-body{background:none !important; border:0 !important}

/* ---------- painéis ---------- */
.panel{background:var(--surface); border:1px solid var(--line); border-radius:14px; box-shadow:none; padding:16px 18px}
.panel-head{margin-bottom:14px; align-items:center}
.panel-head h2{font-size:16px; font-weight:800; display:flex; align-items:center; gap:10px}
.panel-head p{font-size:13px; color:var(--ink-3)}
.ph-ic{flex:0 0 auto; width:28px; height:28px; border-radius:8px; display:grid; place-items:center; color:#fff; background:var(--ph, var(--h-green))}
.ph-ic[data-h="0"]{--ph:var(--h-green)} .ph-ic[data-h="1"]{--ph:var(--h-blue)} .ph-ic[data-h="2"]{--ph:var(--h-purple)} .ph-ic[data-h="3"]{--ph:var(--h-amber)} .ph-ic[data-h="4"]{--ph:var(--h-red)} .ph-ic[data-h="5"]{--ph:var(--h-teal)}
.panel-head > div:first-child:has(.ph-ic) > p{padding-left:38px}
.ch-tog{border-radius:8px}

/* ---------- abas e seletores ---------- */
.seg{background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:4px}
.seg button{min-height:38px; border-radius:9px; font-weight:700; font-size:14px; color:var(--ink-2); border:1px solid transparent}
.seg button[aria-pressed="true"]{background:rgba(34,197,94,.14); color:#EAFBEF; border-color:var(--brand)}
.seg button[aria-pressed="true"] svg{color:var(--brand)}
.seg.views{margin-bottom:14px}
.seg.sm button{min-height:32px; font-size:12.5px}

/* ---------- etiquetas, avisos e tabelas ---------- */
.pill{border-radius:6px; padding:2px 9px 2px 7px; font-size:12px; font-weight:800; background:color-mix(in srgb, var(--sf) 22%, transparent); color:var(--s); border:1px solid color-mix(in srgb, var(--sf) 55%, transparent)}
.banner{border-radius:12px; background:color-mix(in srgb, var(--sf) 12%, var(--surface)); border:1px solid color-mix(in srgb, var(--sf) 50%, transparent)}
.flag{border-radius:6px}
.dre-tbl th, .split th, table th{color:var(--ink-3); font-weight:700; text-transform:none; letter-spacing:0; font-size:12.5px; background:var(--surface-2)}
.dre-tbl td, .dre-tbl th{border-bottom-color:var(--line)}
.dre-tbl tbody tr:hover td{background:rgba(255,255,255,.02)}
.dre-tbl tr.tot td{background:var(--surface-2)}
.dre-tbl tr.big td{background:rgba(34,197,94,.12)}
.scroll-x{border-color:var(--line); background:var(--surface)}
.inp{background:var(--surface-2); border-color:var(--line-2); color:var(--ink); border-radius:10px}
.inp:focus{border-color:var(--brand)}
select.inp{background-color:var(--surface-2)}
.frow{background:var(--surface); border-color:var(--line); border-radius:12px}
.frow .fdate{background:var(--surface-2); border-color:var(--line-2)}
.grp-t{color:var(--ink-2)}
.meter{background:var(--track)}
.dlg{background:var(--surface); color:var(--ink); border:1px solid var(--line-2); border-radius:16px}
.dlg::backdrop{background:rgba(2,6,5,.72); backdrop-filter:blur(3px)}
.toast{background:#EAFBEF; color:#06140C}
.fbar{background:var(--surface); border:1px solid var(--line); border-radius:12px; padding:8px 10px; box-shadow:none}
.blk, .met, .dic-it, .ck, .al, .card-mini, .cat-blk, .dg-n, .hrow, .qk-tile, .qk-big, .wz-chip{border-color:var(--line-2)}
.blk-ico{background:rgba(34,197,94,.14)}
.hero{background:linear-gradient(135deg, var(--hero-a), var(--hero-b)); border:1px solid #1F5A3B}

/* ---------- entrada (login) ---------- */
#dlgEu{width:100vw; height:100vh; max-width:none; max-height:none; margin:0; padding:0; border:0; border-radius:0; background:#060A09; overflow:auto}
#dlgEu::backdrop{background:#060A09}
#dlgEu[open]{display:grid; place-items:center}
.login-bg{position:fixed; inset:0; pointer-events:none; background:radial-gradient(600px 420px at 20% 30%, rgba(34,197,94,.16), transparent 70%), radial-gradient(500px 380px at 85% 80%, rgba(34,197,94,.08), transparent 70%)}
.login-bg img{position:absolute; left:-60px; bottom:-40px; width:520px; max-width:70vw; opacity:.06}
.login{position:relative; width:min(420px, calc(100vw - 32px)); margin:24px auto; padding:28px 26px 22px; border-radius:18px; background:rgba(14,20,18,.9); border:1px solid var(--line-2); box-shadow:0 30px 80px rgba(0,0,0,.55); display:grid; gap:16px}
.login .lg-logo{display:grid; place-items:center; gap:10px; text-align:center}
.login .lg-logo img{width:220px; height:auto}
.login h2{font-size:21px; font-weight:800; text-align:center}
.login .lg-sub{font-size:13.5px; color:var(--ink-3); text-align:center; margin-top:-8px}
.login .fld > span{font-size:13px; color:var(--ink-2)}
.login .inp{height:46px}
.lg-row{display:flex; justify-content:space-between; align-items:center; gap:8px; font-size:13px; color:var(--ink-2)}
.lg-row label{display:inline-flex; align-items:center; gap:8px}
.login .btn.primary{width:100%; min-height:46px; font-size:15px}
.lg-users{display:flex; justify-content:center; gap:10px; flex-wrap:wrap}
.lg-users button{display:flex; flex-direction:column; align-items:center; gap:4px; font-size:11.5px; color:var(--ink-3); padding:4px; border-radius:10px}
.lg-users button:hover{color:var(--ink)}
.lg-nota{font-size:12px; color:var(--ink-3); text-align:center; line-height:1.45}

/* ---------- telas novas: grade com coluna da direita ---------- */
.vg-wrap{display:grid; gap:16px; grid-template-columns:minmax(0,1fr)}
@container pg (min-width:1060px){ .vg-wrap{grid-template-columns:minmax(0,1fr) 320px} }
.vg-main, .vg-rail{display:grid; gap:16px; align-content:start; min-width:0}
.vg-main{container-type:inline-size; container-name:pg}
.vg-main > *, .vg-rail > *, .vg-wrap > *{min-width:0}
.g2{display:grid; gap:16px; grid-template-columns:minmax(0,1fr)}
.g3{display:grid; gap:16px; grid-template-columns:minmax(0,1fr)}
.g4{display:grid; gap:16px; grid-template-columns:minmax(0,1fr)}
@container pg (min-width:760px){ .g2{grid-template-columns:repeat(2,minmax(0,1fr))} .g3{grid-template-columns:repeat(2,minmax(0,1fr))} .g4{grid-template-columns:repeat(2,minmax(0,1fr))} }
@container pg (min-width:1100px){ .g3{grid-template-columns:repeat(3,minmax(0,1fr))} .g4{grid-template-columns:repeat(4,minmax(0,1fr))} .g2.w12{grid-template-columns:1.25fr 1fr} }
.g2 > *, .g3 > *, .g4 > *{min-width:0}
.kpis.k8{grid-template-columns:repeat(2,minmax(0,1fr))}
@container pg (min-width:760px){ .kpis.k8{grid-template-columns:repeat(4,minmax(0,1fr))} }
.mini-list{display:grid; gap:2px}
.mini-it{display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:10px; align-items:center; padding:9px 8px; border-radius:10px; text-align:left; width:100%; color:var(--ink)}
button.mini-it:hover{background:var(--surface-2)}
.mini-it .dot{width:9px; height:9px; border-radius:50%; background:var(--sf)}
.mini-it b{display:block; font-size:13.5px; font-weight:700; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mini-it small{display:block; font-size:12px; color:var(--ink-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.mini-it .amt{font-size:13.5px}
.ver-todos{font-size:13px; font-weight:700; color:var(--brand); display:inline-flex; align-items:center; gap:4px}
.al-tabs{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:10px}
.al-tabs button{min-height:30px; padding:0 10px; border-radius:8px; border:1px solid var(--line-2); font-size:12.5px; font-weight:700; color:var(--ink-2)}
.al-tabs button[aria-pressed="true"]{border-color:var(--brand); color:#EAFBEF; background:rgba(34,197,94,.14)}
.ins{display:grid; grid-template-columns:34px minmax(0,1fr); gap:10px; padding:10px 0; border-bottom:1px solid var(--line)}
.ins:last-child{border-bottom:0}
.ins .ii{width:34px; height:34px; border-radius:10px; display:grid; place-items:center; background:color-mix(in srgb, var(--sf) 20%, transparent); color:var(--s)}
.ins b{display:block; font-size:13.5px; line-height:1.35}
.ins p{font-size:12.5px; color:var(--ink-3); line-height:1.4; margin-top:2px}
.gl-it{display:grid; grid-template-columns:30px minmax(0,1fr); gap:10px; padding:9px 0; border-bottom:1px solid var(--line)}
.gl-it:last-child{border-bottom:0}
.gl-it .n{width:28px; height:28px; border-radius:50%; display:grid; place-items:center; font-weight:800; font-size:13px; background:rgba(34,197,94,.16); color:var(--brand)}
.gl-it b{font-size:13.5px}
.gl-it p{font-size:12.5px; color:var(--ink-3); line-height:1.4}
.donut-wrap{display:grid; grid-template-columns:minmax(110px, 160px) minmax(0,1fr); gap:16px; align-items:center}
@container pg (max-width:420px){ .donut-wrap{grid-template-columns:minmax(0,1fr)} }
.donut{width:100%; max-width:180px; height:auto; aspect-ratio:1}
.donut text{fill:var(--ink); font-weight:800; text-anchor:middle}
.dl{display:grid; gap:6px}
.dl-it{display:grid; grid-template-columns:10px minmax(0,1fr) auto auto; gap:8px; align-items:center; font-size:13px}
.dl-it i{width:10px; height:10px; border-radius:3px; background:var(--k)}
.dl-it span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--ink-2)}
.dl-it b{font-variant-numeric:tabular-nums; font-size:12.5px}
.dl-it em{font-style:normal; color:var(--ink-3); font-size:12px; font-variant-numeric:tabular-nums; min-width:44px; text-align:right}
.kc0{--k:#22C55E} .kc1{--k:#3B82F6} .kc2{--k:#A855F7} .kc3{--k:#F59E0B} .kc4{--k:#EF4444} .kc5{--k:#14B8A6} .kc6{--k:#EC4899} .kc7{--k:#64748B} .kc8{--k:#84CC16} .kc9{--k:#F97316}
.cat-cards{display:grid; gap:10px; grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.cat-card{display:grid; grid-template-columns:40px minmax(0,1fr); gap:10px; align-items:center; padding:12px; border-radius:12px; text-align:left; color:var(--ink);
  background:color-mix(in srgb, var(--k) 14%, var(--surface)); border:1px solid color-mix(in srgb, var(--k) 50%, transparent)}
.cat-card .ci{width:40px; height:40px; border-radius:50%; display:grid; place-items:center; background:var(--k); color:#fff}
.cat-card b{display:block; font-size:13.5px}
.cat-card strong{display:block; font-size:17px; font-variant-numeric:tabular-nums}
.cat-card small{display:block; font-size:12px; color:var(--ink-2)}
.cat-card small em{font-style:normal; color:var(--k); font-weight:800}
.fp-bars{display:grid; gap:10px}
.fp-it{display:grid; grid-template-columns:minmax(110px,1fr) minmax(80px,1.4fr) 54px minmax(90px,auto); gap:10px; align-items:center; font-size:13px}
.fp-it .tr{height:8px; border-radius:999px; background:var(--track); overflow:hidden}
.fp-it .tr i{display:block; height:100%; border-radius:999px; background:var(--k)}
.fp-it b, .fp-it em{font-variant-numeric:tabular-nums; text-align:right; font-style:normal}
.fp-it em{color:var(--ink-3)}
.filtros{display:flex; flex-wrap:wrap; gap:8px; align-items:flex-end; margin:4px 0 10px}
.filtros label{display:grid; gap:3px; font-size:11.5px; color:var(--ink-3); font-weight:700; min-width:0}
.filtros .inp{height:38px; min-width:130px; font-size:13px}
.filtros .grow{flex:1 1 220px}
.tx-tbl td{white-space:nowrap}
.tx-tbl td.wrap{white-space:normal; min-width:160px}
.tag-cat{display:inline-flex; align-items:center; gap:7px}
.tag-cat i{width:9px; height:9px; border-radius:50%; background:var(--k)}
.who{display:inline-flex; align-items:center; gap:6px}
.brand-cards{display:grid; gap:12px; grid-template-columns:minmax(0,1fr)}
@container pg (min-width:760px){ .brand-cards{grid-template-columns:repeat(3,minmax(0,1fr))} }
.bc{padding:16px; border-radius:14px; background:linear-gradient(135deg, color-mix(in srgb, var(--k) 24%, var(--surface)), color-mix(in srgb, var(--k) 6%, var(--surface))); border:1px solid color-mix(in srgb, var(--k) 55%, transparent); display:grid; gap:10px; text-align:left; color:var(--ink)}
.bc[data-m="med"]{--k:#22C55E} .bc[data-m="law"]{--k:#3B82F6} .bc[data-m="varejo"]{--k:#A855F7}
.bc-h{display:flex; align-items:center; gap:12px}
.bc-h .ci{width:42px; height:42px; border-radius:50%; display:grid; place-items:center; background:var(--k); color:#fff}
.bc-h b{font-size:16px; display:block}
.bc-h small{font-size:12.5px; color:var(--ink-2)}
.bc-n{display:grid; grid-template-columns:auto 1fr 1fr; gap:12px; align-items:end}
.bc-n strong{font-size:32px; line-height:1; font-weight:800}
.bc-n span{display:block; font-size:12px; color:var(--ink-2)}
.bc-n b{font-size:15px; font-variant-numeric:tabular-nums}
.stk{display:flex; height:10px; border-radius:999px; overflow:hidden; gap:2px; background:var(--track)}
.stk i{display:block; height:100%; background:var(--k)}
.stk-l{display:flex; flex-wrap:wrap; gap:6px 12px; font-size:12px; color:var(--ink-2); margin-top:8px}
.stk-l span{display:inline-flex; align-items:center; gap:5px}
.stk-l i{width:8px; height:8px; border-radius:50%; background:var(--k)}
.npsb{display:inline-grid; place-items:center; min-width:30px; height:22px; padding:0 6px; border-radius:6px; font-weight:800; font-size:12px; color:#04140B; background:var(--sf)}
.drawer-h{display:flex; align-items:center; gap:12px}
.drawer-h .ci{width:52px; height:52px; border-radius:50%; display:grid; place-items:center; background:var(--mc, var(--brand)); color:#fff; font-weight:800; font-size:18px}
.kv{display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px}
.kv div{padding:10px 12px; border-radius:10px; background:var(--surface-2); border:1px solid var(--line)}
.kv span{display:block; font-size:11.5px; color:var(--ink-3); font-weight:700}
.kv b{display:block; font-size:15px; font-variant-numeric:tabular-nums}

.donut text.dsub{fill:var(--ink-3); font-weight:600}
.dre-tbl td.pos{color:var(--ok)}
.dre-tbl td.neg, .num.neg{color:var(--bad)}
.dlg.drawer{margin:0 0 0 auto; height:100vh; max-height:100vh; width:min(620px, 100vw); max-width:100vw; border-radius:0; border-width:0 0 0 1px}
.dlg.drawer .dlg-in{min-height:100%}
.cat-card[aria-pressed="true"]{box-shadow:0 0 0 2px var(--k)}
.bc:hover{filter:brightness(1.08)}
.npsb[data-s="ok"]{background:var(--ok-f)} .npsb[data-s="warn"]{background:var(--warn-f)} .npsb[data-s="bad"]{background:var(--bad-f); color:#fff}
.fbar.mini{background:none; border:0; padding:0; margin:0 0 6px; justify-content:flex-end}
#modeM{display:none !important}
.tbl-acts{display:flex; gap:4px; justify-content:flex-end}

/* ===== zv.html ===== */

/* ===================================================================
   CACTUS FINANCEIRO 2: entrada com senha, presença, conferência, motor de visões,
   quadros, CRM, equipamentos, precificação e cálculos
   =================================================================== */
/* ----- entrada com senha e trava ----- */
body.trancado .app{visibility:hidden}
.login .lg-conta{display:block}
.lg-quem{display:flex; align-items:center; gap:12px; padding:10px 12px; border:1px solid var(--line-2); border-radius:12px; background:var(--surface-2)}
.lg-quem b{display:block; font-weight:800}
.lg-quem small{display:block; font-size:12.5px; color:var(--ink-3)}
.lg-quem.big .uav{width:44px; height:44px; font-size:15px}
.fld > span.pw, .pw{display:flex; gap:8px; align-items:center; margin:0; font-size:inherit; color:inherit; font-weight:inherit}
.pw .inp{flex:1 1 auto}
.pw-forca{display:grid; grid-template-columns:repeat(4, 1fr); gap:6px; align-items:center; margin-top:-6px}
.pw-forca i{height:5px; border-radius:3px; background:var(--line-2)}
.pw-forca span{grid-column:1 / -1; font-size:12px; color:var(--ink-3)}
.pw-forca[data-f="1"] i:nth-child(-n+1){background:var(--bad-f)}
.pw-forca[data-f="2"] i:nth-child(-n+2){background:var(--warn-f)}
.pw-forca[data-f="3"] i:nth-child(-n+3){background:var(--h-teal)}
.pw-forca[data-f="4"] i:nth-child(-n+4){background:var(--brand)}
.lg-link{background:none; border:0; color:var(--brand); font-weight:700; font-size:13.5px; justify-self:center; padding:4px; cursor:pointer}
.lg-link:hover{text-decoration:underline}
/* ----- quem está usando ----- */
.online-bar{display:flex; align-items:center; gap:10px; padding:9px 14px; margin:0 0 14px; border-radius:12px; font-size:13.5px; color:var(--ink-2);
  background:color-mix(in srgb, var(--brand) 9%, var(--surface)); border:1px solid color-mix(in srgb, var(--brand) 35%, transparent)}
.on-dot{width:9px; height:9px; border-radius:50%; background:var(--brand); box-shadow:0 0 0 4px color-mix(in srgb, var(--brand) 25%, transparent); flex:0 0 auto}
.tb-u{position:relative}
.tb-u.on .uav::after{content:""; position:absolute; right:-1px; bottom:-1px; width:10px; height:10px; border-radius:50%; background:var(--brand); border:2px solid var(--surface)}
.tb-u .uav{position:relative}
.nav-h{font-size:11px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:var(--ink-3); padding:12px 12px 4px; margin:0}
.h-mot{font-size:13px; color:var(--ink-2); margin-top:4px; padding:6px 9px; border-left:3px solid var(--warn-f); background:var(--surface-2); border-radius:0 8px 8px 0}
.mot-diff{display:grid; gap:4px; padding:10px 12px; border-radius:10px; background:var(--surface-2); border:1px solid var(--line-2)}
.dlg-in.sm{max-width:520px}
.banner.priv{margin-bottom:14px}
/* ----- botões e campos compactos ----- */
.btn.xs{min-height:30px; padding:0 9px; font-size:12.5px; gap:5px; border-radius:8px}
.danger-txt{color:var(--bad)}
.danger-txt:hover{border-color:var(--bad-f)}
.inp.sm{min-height:36px; padding:6px 10px; font-size:13.5px}
.search.sm .inp{min-height:36px; padding-left:38px}
.search.sm svg{left:11px}
.fld.sm > span{font-size:12px; margin-bottom:3px}
.prem > p, .prem > a{grid-column:1 / -1}
.prem{display:grid; grid-template-columns:repeat(auto-fill, minmax(170px, 1fr)); gap:10px 12px; align-items:end}
.cmp-row{display:flex; flex-wrap:wrap; justify-content:space-between; gap:4px 14px; padding:8px 0; border-bottom:1px solid var(--line); font-size:13.5px}
.cmp-row > span{color:var(--ink-2); flex:1 1 220px}
.cmp-row.tot{border-bottom:0; border-top:1px solid var(--line-2); font-size:15px}
td[data-s="ok"]{color:var(--ok)} td[data-s="bad"]{color:var(--bad)}
.dl .tot dt, .dl .tot dd{font-weight:800; color:var(--ink)}
/* ----- motor de visões ----- */
.vw{display:grid; grid-template-columns:minmax(0, 1fr); gap:10px; min-width:0}
.vw-tabs{display:flex; gap:4px; overflow-x:auto; padding:4px; border:1px solid var(--line); border-radius:12px; background:var(--surface); scrollbar-width:thin}
.vw-tabs button{display:inline-flex; align-items:center; gap:6px; padding:7px 11px; border-radius:9px; font-size:13px; font-weight:700; color:var(--ink-2); white-space:nowrap; border:1px solid transparent; background:none}
.vw-tabs button:hover{color:var(--ink); background:var(--surface-2)}
.vw-tabs button[aria-selected="true"]{background:color-mix(in srgb, var(--brand) 14%, transparent); color:var(--ink); border-color:var(--brand)}
.vw-tabs button[aria-selected="true"] svg{color:var(--brand)}
.vw-bar{display:flex; flex-wrap:wrap; gap:8px; align-items:center}
.vw-bar .search{flex:1 1 200px; max-width:340px}
.vw-sel{display:inline-flex; align-items:center; gap:6px; font-size:12.5px; color:var(--ink-3); font-weight:700; min-width:0}
.vw-sel select{max-width:220px}
.vw-new{margin-left:auto}
.vw-body{min-width:0}
.vchip{display:inline-flex; align-items:center; gap:5px; padding:2px 8px 2px 6px; border-radius:999px; font-size:12px; font-weight:700; white-space:nowrap;
  background:color-mix(in srgb, var(--k, var(--h-blue)) 16%, transparent); color:var(--ink); border:1px solid color-mix(in srgb, var(--k, var(--h-blue)) 45%, transparent)}
.vchip i{width:7px; height:7px; border-radius:50%; background:var(--k, var(--h-blue))}
button.vchip{cursor:pointer}
button.vchip[aria-pressed="false"]{opacity:.55}
button.vchip[aria-pressed="true"]{box-shadow:0 0 0 1px var(--k)}
.vprop{font-size:12.5px; color:var(--ink-2)}
.vprop small{color:var(--ink-3); font-size:12px}
.vw-props{display:flex; flex-wrap:wrap; gap:5px 8px; align-items:center}
.vw-card{position:relative; display:grid; gap:7px; padding:11px 12px; background:var(--surface); border:1px solid var(--line-2); border-radius:12px; text-align:left; color:var(--ink); cursor:pointer; min-width:0}
.vw-card:hover{border-color:color-mix(in srgb, var(--brand) 55%, var(--line-2))}
.vw-card > b{font-weight:800; font-size:14px; overflow-wrap:anywhere; padding-right:18px}
.vw-prazo{font-size:12px; font-weight:700; color:var(--s, var(--ink-3))}
.vw-grip{position:absolute; top:8px; right:6px; color:var(--ink-3); touch-action:none; cursor:grab; padding:2px}
.vw-arr{opacity:.35}
.vw-ghost{position:fixed; left:0; top:0; z-index:9999; pointer-events:none; box-shadow:0 18px 40px rgba(0,0,0,.5); border-color:var(--brand) !important}
.vw-kan{display:grid; grid-auto-flow:column; grid-auto-columns:minmax(250px, 290px); gap:12px; overflow-x:auto; padding:2px 2px 12px; align-items:start}
.vw-col{display:flex; flex-direction:column; gap:8px; padding:10px; border-radius:14px; background:var(--surface-2); border:1px solid var(--line); border-top:3px solid var(--k, var(--line-2)); min-width:0; min-height:120px}
.vw-col.vw-over{border-color:var(--brand); background:color-mix(in srgb, var(--brand) 8%, var(--surface-2))}
.vw-col-h{display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px}
.vw-col-h .dot{width:9px; height:9px; border-radius:50%; background:var(--k)}
.vw-col-h b{font-size:14px; font-weight:800}
.vw-col-h .n{margin-left:auto; min-width:24px; height:22px; padding:0 7px; border-radius:999px; background:var(--surface); border:1px solid var(--line-2); display:grid; place-items:center; font-size:12px; font-weight:800}
.vw-col-h .icon-btn{width:28px; height:28px}
.vw-col-s{flex:1 1 100%; font-size:12px; color:var(--ink-3)}
.vw-col-b{display:grid; gap:8px; min-height:30px}
.vw-col .bempty{font-size:12.5px; color:var(--ink-3); text-align:center; padding:10px 4px; border:1px dashed var(--line-2); border-radius:10px}
.vw-add{display:flex; align-items:center; gap:6px; justify-content:center; padding:7px; border-radius:10px; color:var(--ink-3); font-size:13px; font-weight:700; background:none; border:1px dashed var(--line-2)}
.vw-add:hover{color:var(--brand); border-color:var(--brand)}
.vw-col-new{align-items:center; justify-content:center; color:var(--ink-3); font-weight:800; border-style:dashed; min-height:120px; cursor:pointer}
.vw-col-new:hover{color:var(--brand)}
.vw-list{display:grid; gap:6px}
.vw-row{display:flex; flex-wrap:wrap; align-items:center; gap:6px 14px; padding:10px 12px; border-radius:10px; background:var(--surface); border:1px solid var(--line); cursor:pointer}
.vw-row:hover{border-color:var(--line-2)}
.vw-row > b{flex:1 1 220px; min-width:0; overflow-wrap:anywhere; font-weight:700}
.vw-row.feito > b{text-decoration:line-through; color:var(--ink-3)}
.vw-gal{display:grid; grid-template-columns:repeat(auto-fill, minmax(220px, 1fr)); gap:10px}
.vw-calnav{align-items:center; margin-bottom:8px}
.vw-calnav b{font-size:15px; min-width:150px; text-align:center}
.vw-cal{display:grid; grid-template-columns:repeat(7, minmax(92px, 1fr)); gap:4px; min-width:660px}
.vw-cal-h{font-size:12px; font-weight:800; color:var(--ink-3); text-align:center; padding:4px}
.vw-cal-d{min-height:92px; padding:5px; border-radius:10px; background:var(--surface); border:1px solid var(--line); display:flex; flex-direction:column; gap:3px; min-width:0}
.vw-cal-d.fora{opacity:.45}
.vw-cal-d.hoje{border-color:var(--brand)}
.vw-cal-d.vw-over{background:color-mix(in srgb, var(--brand) 12%, var(--surface))}
.vw-cal-n{font-size:12px; font-weight:800; color:var(--ink-3)}
.vw-cal-it{display:block; width:100%; text-align:left; font-size:12px; font-weight:700; padding:3px 6px; border-radius:6px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  background:color-mix(in srgb, var(--k, var(--h-blue)) 22%, transparent); border:0; border-left:3px solid var(--k, var(--h-blue)); cursor:pointer}
.vw-cal-mais{font-size:11.5px; color:var(--ink-3)}
.vw-g-wrap{display:grid; grid-template-columns:minmax(120px, 210px) minmax(0, 1fr); border:1px solid var(--line); border-radius:12px; overflow:hidden; background:var(--surface)}
.vw-g-nomes{border-right:1px solid var(--line)}
.vw-g-scroll{overflow-x:auto}
.vw-g-esc{position:relative; height:30px; border-bottom:1px solid var(--line); font-size:11.5px; color:var(--ink-3)}
.vw-g-esc span{position:absolute; top:8px; padding-left:4px; border-left:1px solid var(--line-2); white-space:nowrap}
.vw-g-rows{position:relative}
.vw-g-row{position:relative; height:34px; border-bottom:1px solid var(--line)}
.vw-g-row.nome{display:flex; align-items:center; padding:0 10px; font-size:13px; font-weight:700; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.vw-g-bar{position:absolute; top:6px; height:22px; border-radius:6px; font-size:11.5px; font-weight:700; color:var(--ink); text-align:left; padding:0 7px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
  background:color-mix(in srgb, var(--k, var(--h-blue)) 45%, var(--surface-2)); border:1px solid var(--k, var(--h-blue)); cursor:pointer}
.vw-g-hoje{position:absolute; top:0; bottom:0; width:2px; background:var(--warn-f); z-index:1}
.vw-tl{display:grid; gap:8px}
.vw-tl-it{display:grid; grid-template-columns:52px 14px minmax(0, 1fr); gap:8px; align-items:start}
.vw-tl-d{font-size:12.5px; font-weight:800; color:var(--ink-3); padding-top:12px; text-align:right}
.vw-tl-it .dot{width:12px; height:12px; border-radius:50%; background:var(--brand); margin-top:13px; box-shadow:0 0 0 3px var(--surface)}
.vw-tl-it.fut .dot{background:var(--h-blue)}
.vw-mat{border-collapse:separate; border-spacing:4px; width:100%; min-width:560px}
.vw-mat th{font-size:12.5px; color:var(--ink-3); font-weight:800; padding:6px; text-align:center}
.vw-mat-c{vertical-align:top; padding:6px; min-width:110px; height:70px; border-radius:10px; background:var(--surface); border:1px solid var(--line)}
.vw-mat-c[data-n="3"]{background:color-mix(in srgb, var(--h-amber) 10%, var(--surface))}
.vw-mat-c[data-n="4"]{background:color-mix(in srgb, var(--h-red) 12%, var(--surface))}
.vw-mat-c .vw-cal-it{margin-bottom:3px}
.vw-funil{display:grid; gap:8px}
.vw-f-row{display:flex; flex-direction:column; align-items:center; gap:2px}
.vw-f-bar{display:flex; justify-content:space-between; gap:10px; padding:10px 14px; border-radius:10px; min-width:0; font-size:13.5px;
  background:color-mix(in srgb, var(--k, var(--h-blue)) 30%, var(--surface)); border:1px solid var(--k, var(--h-blue))}
.vw-f-bar b{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.vw-f-bar span{white-space:nowrap; color:var(--ink-2)}
.vw-f-row small{font-size:12px; color:var(--ink-3)}
.vw-table{width:max-content; min-width:100%}
.vw-table th, .vw-table td{white-space:nowrap}
.vw-table td:first-child{white-space:normal; min-width:180px; max-width:300px; font-weight:700}
.vw-table td .inp.sm{min-width:110px}
.vw-table td input[type="checkbox"]{width:18px; height:18px}
.vw-table th.sortable{cursor:pointer; user-select:none; white-space:nowrap}
.vw-table tfoot td{font-weight:800; border-top:1px solid var(--line-2)}
.vw-multi{display:flex; flex-wrap:wrap; gap:6px}
.heat-wrap{display:grid; gap:8px}
.heat{display:flex; gap:3px; width:max-content; padding:4px 0}
.heat-w{display:grid; grid-template-rows:repeat(7, 12px); gap:3px}
.heat i, .heat-lg i{width:12px; height:12px; border-radius:3px; background:var(--track); display:block}
.heat i[data-n="1"], .heat-lg i[data-n="1"]{background:color-mix(in srgb, var(--brand) 30%, var(--track))}
.heat i[data-n="2"], .heat-lg i[data-n="2"]{background:color-mix(in srgb, var(--brand) 55%, var(--track))}
.heat i[data-n="3"], .heat-lg i[data-n="3"]{background:color-mix(in srgb, var(--brand) 78%, var(--track))}
.heat i[data-n="4"], .heat-lg i[data-n="4"]{background:var(--brand)}
.heat i.fut{opacity:.25}
.heat-lg{display:flex; align-items:center; gap:4px; font-size:12px; color:var(--ink-3); flex-wrap:wrap}
.heat-lg small{font-size:12px}
.vw-pn{min-width:0}
.hb-bar[class*="kc"]{background:var(--k)} .hb-bar.k3{background:var(--c5)}
/* ----- janela de um item ----- */
.cd-tit{font-size:20px; font-weight:800; border-color:transparent; background:transparent; padding-left:0}
.cd-tit:focus-visible{border-color:var(--brand); background:var(--surface); padding-left:10px}
.cd-base{display:inline-flex; align-items:center; gap:6px; font-size:12.5px; color:var(--ink-3); font-weight:700}
.cd-props{display:grid; grid-template-columns:repeat(auto-fill, minmax(230px, 1fr)); gap:10px 14px}
.cd-row{display:grid; gap:4px; min-width:0}
.cd-row.full{grid-column:1 / -1}
.cd-k{font-size:12px; font-weight:800; color:var(--ink-3); letter-spacing:.02em}
.cd-ro{padding:8px 10px; border-radius:var(--r-sm); background:var(--surface-2); border:1px dashed var(--line-2); font-weight:700}
/* ----- quadros ----- */
.qd-tabs{display:flex; gap:6px; overflow-x:auto; padding-bottom:4px; margin-bottom:10px; scrollbar-width:thin}
.qd-tab{display:inline-flex; align-items:center; gap:7px; padding:8px 12px; border-radius:10px; border:1px solid var(--line-2); background:var(--surface); color:var(--ink-2); font-weight:700; font-size:13.5px; white-space:nowrap}
.qd-tab small{font-size:11.5px; color:var(--ink-3); background:var(--surface-2); padding:1px 7px; border-radius:999px}
.qd-tab[aria-pressed="true"]{color:var(--ink); border-color:var(--brand); background:color-mix(in srgb, var(--brand) 12%, var(--surface))}
.qd-tab.add{border-style:dashed}
.qd-cols{display:grid; gap:8px}
.qd-col{display:grid; grid-template-columns:auto minmax(0, 1fr) minmax(0, 170px) auto; gap:6px; align-items:center}
.qd-col-l{display:flex; gap:2px}
.qd-col-l .icon-btn{width:28px; height:28px}
.qd-col-op{display:grid; gap:3px; padding-left:66px}
.qd-col-op small{font-size:12px; color:var(--ink-3)}
.qd-modelos{display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:10px}
.qd-modelo{display:grid; gap:5px; text-align:left; padding:12px; border-radius:12px; border:1px solid var(--line-2); background:var(--surface); color:var(--ink)}
.qd-modelo:hover{border-color:var(--brand)}
.qd-modelo b{font-weight:800}
.qd-modelo small{font-size:12px; color:var(--ink-2)}
.cor-pick{display:flex; flex-wrap:wrap; gap:6px}
.cor-pick button{width:28px; height:28px; border-radius:50%; background:var(--k); border:2px solid transparent}
.cor-pick button[aria-pressed="true"]{border-color:var(--ink); box-shadow:0 0 0 2px var(--surface)}
/* ----- responsabilidades e contribuição ----- */
.resp-cards{display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:12px}
.resp-card{display:grid; gap:10px; padding:14px; border-radius:14px; background:var(--surface); border:1px solid var(--line-2); border-top:3px solid var(--sf, var(--line-2))}
.rc-top{display:flex; align-items:center; gap:10px}
.rc-top b{display:block; font-weight:800}
.rc-top small{display:block; font-size:12px; color:var(--ink-3)}
.rc-top > span:nth-child(2){flex:1 1 auto; min-width:0}
.rc-pos{font-size:20px; font-weight:800; color:var(--brand)}
.rc-big b{font-size:30px; font-weight:800; line-height:1}
.rc-big small{display:block; font-size:12.5px; color:var(--ink-3); margin-top:3px}
.rc-bar{height:8px; border-radius:4px; background:var(--track); overflow:hidden}
.rc-bar i{display:block; height:100%; background:var(--sf, var(--brand)); border-radius:4px}
.rc-nums{display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:8px}
.rc-nums.c3{grid-template-columns:repeat(3, minmax(0, 1fr))}
.rc-nums span{display:grid; gap:1px; padding:7px 8px; border-radius:9px; background:var(--surface-2)}
.rc-nums b{font-weight:800; font-size:15px}
.rc-nums small{font-size:11.5px; color:var(--ink-3); line-height:1.25}
/* ----- CRM ----- */
.crm-card{border-left:3px solid var(--mk, var(--line-2))}
.crm-card[data-m="med"]{--mk:#22C55E} .crm-card[data-m="law"]{--mk:#3B82F6} .crm-card[data-m="varejo"]{--mk:#A855F7}
.crm-top{display:flex; align-items:flex-start; gap:8px; justify-content:space-between; padding-right:16px}
.crm-top b{font-weight:800; font-size:14px; overflow-wrap:anywhere}
.crm-val{display:flex; align-items:baseline; gap:4px; flex-wrap:wrap}
.crm-val b{font-size:16px; font-weight:800}
.crm-val small{font-size:12px; color:var(--ink-3)}
.crm-pe{display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px}
.crm-resp{display:inline-flex; align-items:center; gap:6px; font-size:12.5px; font-weight:700}
.crm-resp .uav{width:22px; height:22px; font-size:9.5px; box-shadow:none}
.crm-age{font-size:12px; font-weight:700; color:var(--s)}
.crm-qa{display:flex; flex-wrap:wrap; gap:5px; padding-top:6px; border-top:1px solid var(--line)}
/* ----- equipamentos, preços e cálculos ----- */
.eq-pick{display:grid; gap:10px; max-height:300px; overflow:auto; padding:8px; border:1px solid var(--line-2); border-radius:12px; background:var(--surface-2)}
.eq-grp{display:grid; gap:2px}
.eq-grp-h{display:flex; justify-content:space-between; align-items:center; gap:8px}
.eq-grp-h b{font-size:13px}
.sv-comp{display:grid; gap:8px}
.sv-row{display:grid; grid-template-columns:auto minmax(0, 1fr) 90px auto auto; gap:6px; align-items:center}
.sv-t{font-size:12.5px; font-weight:700; color:var(--ink-3)}
.calc-mini{display:grid; gap:10px}
.lab-ser{display:grid; grid-template-columns:minmax(0, 200px) minmax(0, 1fr) auto; gap:6px}
.lab-vars{display:flex; flex-wrap:wrap; gap:5px; max-height:150px; overflow:auto}
.lab-prev{display:grid; padding:8px 12px; border-radius:10px; background:var(--surface-2); border:1px solid var(--line-2)}
.lab-head{display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; margin-bottom:8px}
.lab-big{font-size:28px; font-weight:800}
.lab-head small{color:var(--ink-3)}
.mono{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12.5px; overflow-wrap:anywhere}
.tree{display:grid; gap:8px; padding-left:14px; border-left:2px solid var(--line-2)}
.tree-n{position:relative; display:grid; gap:2px; padding:10px 12px; border-radius:10px; background:var(--surface-2); border:1px solid var(--line-2)}
.tree-n::before{content:""; position:absolute; left:-16px; top:50%; width:14px; height:2px; background:var(--line-2)}
.tree-n[data-k="pess"]{border-left:3px solid var(--bad-f)} .tree-n[data-k="base"]{border-left:3px solid var(--brand)} .tree-n[data-k="otim"]{border-left:3px solid var(--h-blue)}
.tree-n span{font-size:13px; color:var(--ink-2)}
.cv-lista{display:grid; grid-template-columns:repeat(auto-fill, minmax(280px, 1fr)); gap:0 18px}
@media (max-width:640px){
  .vw-kan{grid-auto-columns:minmax(240px, 82vw)}
  .qd-col{grid-template-columns:auto minmax(0, 1fr) auto}
  .qd-col select{grid-column:2 / 3}
  .qd-col-op{padding-left:0}
  .sv-row{grid-template-columns:minmax(0, 1fr) 80px auto}
  .sv-row .sv-t, .sv-row .hint{display:none}
  .lab-ser{grid-template-columns:minmax(0, 1fr) auto}
  .lab-ser .inp:first-child{grid-column:1 / -1}
  .vw-g-wrap{grid-template-columns:110px minmax(0, 1fr)}
  .rc-nums.c3{grid-template-columns:repeat(2, minmax(0, 1fr))}
  .vw-new{margin-left:0}
}

/* ===== zw.html ===== */

/* ===================================================================
   CACTUS FINANCEIRO 3: governança, metas, sucesso do cliente, integrações e sistema
   =================================================================== */
/* ----- menu agrupado ----- */
.nav-grp{margin:2px 0}
.nav-grp > summary{list-style:none}
.nav-grp > summary::-webkit-details-marker{display:none}
.nav-gh{display:flex; align-items:center; gap:10px; min-height:38px; padding:0 12px; border-radius:10px; font-size:11.5px; font-weight:800; letter-spacing:.07em; text-transform:uppercase; color:var(--ink-3); cursor:pointer; user-select:none}
.nav-gh::after{content:''; margin-left:auto; width:7px; height:7px; border-right:2px solid currentColor; border-bottom:2px solid currentColor; transform:rotate(-45deg); transition:transform .15s}
.nav-grp[open] > .nav-gh::after{transform:rotate(45deg)}
.nav-gh:hover{color:var(--ink-2); background:var(--surface-2)}
.nav-gh:focus-visible{outline:2px solid var(--brand); outline-offset:1px}
.nav-gh [data-ico] svg{width:16px; height:16px}
.nav-grp .nav-btn{padding-left:20px}
.nav-grp:has([aria-current="page"]) > .nav-gh{color:var(--brand)}
#fFab{display:none !important}
.bnav-novo{color:var(--on-brand) !important; background:var(--brand) !important; border-radius:14px; margin:4px}

.kpis + .qd-tabs, .kpis + .banner, .kpis + .gx-list, .kpis + .toolbar, .kpis + .gx-metas, .kpis + .inline-row{margin-top:14px}
.qd-tabs + .kpis, .toolbar + .kpis, .banner + .gx-list{margin-top:12px}
/* ----- linhas de lista ----- */
.gx-list{display:flex; flex-direction:column; gap:8px}
.gx-list.gx-mini{gap:0}
.gx-row{display:grid; grid-template-columns:auto minmax(0, 1fr) auto; gap:4px 12px; align-items:start; padding:12px 14px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface); border-left:4px solid var(--idle-f)}
.gx-row[data-s="ok"]{border-left-color:var(--ok-f)} .gx-row[data-s="warn"]{border-left-color:var(--warn-f)} .gx-row[data-s="bad"]{border-left-color:var(--bad-f)}
.gx-ic{width:32px; height:32px; display:grid; place-items:center; border-radius:9px; background:var(--surface-2); color:var(--ink-2)}
.gx-row[data-s="ok"] .gx-ic{color:var(--ok); background:var(--ok-soft)} .gx-row[data-s="warn"] .gx-ic{color:var(--warn); background:var(--warn-soft)} .gx-row[data-s="bad"] .gx-ic{color:var(--bad); background:var(--bad-soft)}
.gx-body{min-width:0; display:flex; flex-direction:column; gap:3px}
.gx-t{font-weight:800; font-size:14.5px; overflow-wrap:anywhere}
.gx-s{color:var(--ink-2); font-size:13px; line-height:1.45; overflow-wrap:anywhere}
.gx-s[data-s="ok"]{color:var(--ok)} .gx-s[data-s="warn"]{color:var(--warn)}
.gx-right{display:flex; flex-direction:column; align-items:flex-end; gap:6px; text-align:right}
.gx-v{font-size:15px; font-variant-numeric:tabular-nums; white-space:nowrap}
.gx-acts{grid-column:2 / -1; display:flex; flex-wrap:wrap; gap:6px; margin-top:4px}
.gx-acts .btn, .gx-foot .btn{min-height:36px}
.gx-more{grid-column:2 / -1; margin-top:2px}
.gx-more > summary{cursor:pointer; font-size:12.5px; font-weight:700; color:var(--ink-2); padding:4px 0}
.gx-dets{display:flex; flex-direction:column; gap:8px; padding:8px 0 2px}
.gx-dec{display:flex; flex-direction:column; gap:2px; padding:8px 10px; border-radius:10px; background:var(--surface-2); border-left:3px solid var(--idle-f); font-size:13px}
.gx-dec[data-s="ok"]{border-left-color:var(--ok-f)} .gx-dec[data-s="warn"]{border-left-color:var(--warn-f)} .gx-dec[data-s="bad"]{border-left-color:var(--bad-f)}
.gx-pills{display:flex; flex-wrap:wrap; gap:6px; align-items:center}
.gx-right .pill{max-width:240px}
.gx-vazio{display:flex; flex-direction:column; align-items:center; gap:4px; text-align:center; padding:22px 14px; color:var(--ink-2); border:1px dashed var(--line-2); border-radius:var(--r-sm)}
.gx-vazio > span:first-child{color:var(--ok)}
.gx-fonte{font-size:12.5px; color:var(--ink-3); line-height:1.5; margin:12px 0 0}
.gx-acao{font-size:13px; color:var(--ink); background:var(--brand-soft); border-radius:8px; padding:6px 10px; margin:4px 0 0}
.gx-alerta{font-weight:800; color:var(--bad); margin:0}
.gx-h3{font-size:13px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-3); margin:14px 0 6px}
.gx-foot{margin-top:12px}
.form-err{color:var(--bad); font-weight:700; font-size:13.5px; margin:6px 0 0}

/* ----- pares chave e valor ----- */
.gx-kv{display:grid; grid-template-columns:minmax(120px, max-content) minmax(0, 1fr); gap:6px 14px; margin:8px 0; font-size:13.5px}
.gx-kv dt{color:var(--ink-3); font-weight:600}
.gx-kv dd{margin:0; color:var(--ink); overflow-wrap:anywhere; font-variant-numeric:tabular-nums}
@media (max-width:520px){ .gx-kv{grid-template-columns:minmax(0, 1fr)} .gx-kv dd{margin-bottom:6px} }

/* ----- cartões ----- */
.gx-cards{display:grid; grid-template-columns:repeat(auto-fill, minmax(min(240px, 100%), 1fr)); gap:10px}
.gx-card{display:flex; flex-direction:column; gap:4px; padding:12px 14px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface-2); min-width:0}
.gx-pair{display:flex; flex-direction:column; gap:6px; padding:12px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface); margin:8px 0}
.gx-pair-h{display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:6px 10px}

/* ----- checklist ----- */
.gx-check{display:grid; grid-template-columns:repeat(auto-fill, minmax(min(260px, 100%), 1fr)); gap:8px}
.gx-chk{display:grid; grid-template-columns:auto minmax(0, 1fr); gap:2px 10px; align-items:start; text-align:left; padding:10px 12px; border-radius:var(--r-sm); border:1px solid var(--line); background:var(--surface); color:var(--ink); font:inherit; min-height:44px}
button.gx-chk{cursor:pointer}
button.gx-chk:hover{border-color:var(--line-2)}
.gx-chk > span:first-child{grid-row:span 2; color:var(--idle)}
.gx-chk[data-s="ok"] > span:first-child{color:var(--ok)} .gx-chk[data-s="warn"] > span:first-child{color:var(--warn)}
.gx-chk b{font-size:14px} .gx-chk > span:last-child{font-size:12.5px; color:var(--ink-2)}

/* ----- + Novo ----- */
.gx-novo{display:grid; grid-template-columns:repeat(auto-fill, minmax(min(150px, 46%), 1fr)); gap:8px}
.gx-novo-it{display:flex; flex-direction:column; align-items:flex-start; gap:8px; min-height:76px; padding:12px; border-radius:var(--r-sm); border:1px solid var(--line); background:var(--surface); color:var(--ink); font:inherit; text-align:left; cursor:pointer}
.gx-novo-it:hover{border-color:var(--brand)}
.gx-novo-it > span{color:var(--brand)}
.gx-novo-it b{font-size:13.5px}

/* ----- metas ----- */
.gx-metas{display:grid; grid-template-columns:repeat(auto-fill, minmax(min(340px, 100%), 1fr)); gap:12px}
.gx-meta{display:flex; flex-direction:column; gap:8px; padding:14px; border:1px solid var(--line); border-radius:var(--r); background:var(--surface); border-top:4px solid var(--idle-f); min-width:0}
.gx-meta[data-s="ok"]{border-top-color:var(--ok-f)} .gx-meta[data-s="warn"]{border-top-color:var(--warn-f)} .gx-meta[data-s="bad"]{border-top-color:var(--bad-f)}
.gx-meta-h{display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px}
.gx-meta-h b{font-size:15.5px}
.gx-bar{position:relative; height:10px; border-radius:999px; background:var(--track); overflow:hidden}
.gx-bar-f{position:absolute; left:0; top:0; bottom:0; border-radius:999px; background:var(--idle-f)}
.gx-bar-f[data-s="ok"]{background:var(--ok-f)} .gx-bar-f[data-s="warn"]{background:var(--warn-f)} .gx-bar-f[data-s="bad"]{background:var(--bad-f)}
.gx-bar-t{position:absolute; top:-2px; bottom:-2px; width:2px; background:var(--ink); opacity:.55}
.gx-bar-f[data-w="0"]{width:0} .gx-bar-f[data-w="5"]{width:5%} .gx-bar-f[data-w="10"]{width:10%} .gx-bar-f[data-w="15"]{width:15%} .gx-bar-f[data-w="20"]{width:20%} .gx-bar-f[data-w="25"]{width:25%}
.gx-bar-f[data-w="30"]{width:30%} .gx-bar-f[data-w="35"]{width:35%} .gx-bar-f[data-w="40"]{width:40%} .gx-bar-f[data-w="45"]{width:45%} .gx-bar-f[data-w="50"]{width:50%} .gx-bar-f[data-w="55"]{width:55%}
.gx-bar-f[data-w="60"]{width:60%} .gx-bar-f[data-w="65"]{width:65%} .gx-bar-f[data-w="70"]{width:70%} .gx-bar-f[data-w="75"]{width:75%} .gx-bar-f[data-w="80"]{width:80%} .gx-bar-f[data-w="85"]{width:85%}
.gx-bar-f[data-w="90"]{width:90%} .gx-bar-f[data-w="95"]{width:95%} .gx-bar-f[data-w="100"]{width:100%}
.gx-bar-t[data-w="0"]{left:0} .gx-bar-t[data-w="5"]{left:5%} .gx-bar-t[data-w="10"]{left:10%} .gx-bar-t[data-w="15"]{left:15%} .gx-bar-t[data-w="20"]{left:20%} .gx-bar-t[data-w="25"]{left:25%}
.gx-bar-t[data-w="30"]{left:30%} .gx-bar-t[data-w="35"]{left:35%} .gx-bar-t[data-w="40"]{left:40%} .gx-bar-t[data-w="45"]{left:45%} .gx-bar-t[data-w="50"]{left:50%} .gx-bar-t[data-w="55"]{left:55%}
.gx-bar-t[data-w="60"]{left:60%} .gx-bar-t[data-w="65"]{left:65%} .gx-bar-t[data-w="70"]{left:70%} .gx-bar-t[data-w="75"]{left:75%} .gx-bar-t[data-w="80"]{left:80%} .gx-bar-t[data-w="85"]{left:85%}
.gx-bar-t[data-w="90"]{left:90%} .gx-bar-t[data-w="95"]{left:95%} .gx-bar-t[data-w="100"]{left:calc(100% - 2px)}

/* ----- custo do atraso ----- */
.gx-serie{display:flex; flex-wrap:wrap; gap:6px; margin-top:4px}
.gx-serie > span{display:flex; flex-direction:column; padding:6px 10px; border-radius:8px; background:var(--surface-2); min-width:72px}
.gx-serie small{font-size:11px; color:var(--ink-3)} .gx-serie b{font-size:13px; font-variant-numeric:tabular-nums}

/* ----- integrações ----- */
.gx-ints{display:grid; grid-template-columns:repeat(auto-fill, minmax(min(320px, 100%), 1fr)); gap:12px}
.gx-int{display:flex; flex-direction:column; gap:6px; padding:14px; border:1px solid var(--line); border-radius:var(--r); background:var(--surface); min-width:0}
.gx-int[data-s="ok"]{border-color:color-mix(in srgb, var(--ok-f) 55%, var(--line))}
.gx-int[data-s="bad"]{border-color:color-mix(in srgb, var(--bad-f) 55%, var(--line))}
.gx-int .gx-kv{grid-template-columns:minmax(0, 1fr)}
.gx-int .gx-kv dt{font-size:11.5px; text-transform:uppercase; letter-spacing:.05em}
.gx-int .gx-kv dd{margin-bottom:4px}

/* ----- notícias ----- */
.gx-news{display:flex; flex-direction:column; gap:4px; padding:12px 14px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface)}
.gx-news p{margin:2px 0; font-size:13.5px; line-height:1.5}
.gx-news-t{font-weight:800; color:var(--ink); text-decoration:none; font-size:14.5px}
.gx-news-t:hover{text-decoration:underline; color:var(--brand)}

/* ----- tabela simples ----- */
.tbl-wrap{overflow-x:auto; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface)}
.tbl{width:100%; border-collapse:collapse; font-size:13px; min-width:max-content}
.tbl th, .tbl td{padding:8px 10px; border-bottom:1px solid var(--line); text-align:left; white-space:nowrap}
.tbl th{font-size:11.5px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-3); background:var(--surface-2)}
.tbl .num{text-align:right; font-variant-numeric:tabular-nums}
.tbl tr:last-child td{border-bottom:0}

@media (max-width:640px){
  .gx-row{grid-template-columns:auto minmax(0, 1fr); padding:12px}
  .gx-right{grid-column:2; align-items:flex-start; text-align:left; flex-direction:row; flex-wrap:wrap}
  .gx-acts{grid-column:1 / -1}
  .gx-acts .btn{flex:1 1 auto; min-height:44px}
  .gx-more{grid-column:1 / -1}
}

/* ===== Cactus Operação: componentes próprios, sobre o tema do Cactus Financeiro ===== */
.lnk{background:none; border:0; padding:0; color:var(--ink); font:inherit; font-weight:700; text-align:left; cursor:pointer; text-decoration:underline; text-decoration-color:color-mix(in srgb, var(--brand) 60%, transparent); text-underline-offset:3px}
.lnk:hover{color:var(--brand)}
.grow{flex:1 1 auto; min-width:0}
.mais-h{font-size:13px; font-weight:800; letter-spacing:.04em; text-transform:uppercase; color:var(--ink-3); margin:18px 0 8px}
.gx-s[data-s]{color:var(--s); font-weight:700}

/* cabeçalho da peça e esteira de passos */
.pc-head{display:grid; gap:6px}
.pc-head .h2{margin:0; text-wrap:balance}
.pe-wrap{overflow-x:auto; padding:2px 0 8px; margin:0 0 12px}
.pe-steps{list-style:none; margin:0; padding:0; display:flex; gap:6px; min-width:max-content}
.pe-step{display:flex; align-items:flex-start; gap:7px; padding:8px 10px; border-radius:10px; border:1px solid var(--line); background:var(--surface-2); min-width:150px; max-width:200px}
.pe-step[data-s="ok"]{border-color:color-mix(in srgb, var(--ok-f) 45%, var(--line))}
.pe-step[data-atual="1"]{border-color:var(--sf); background:color-mix(in srgb, var(--sf) 14%, var(--surface)); box-shadow:0 0 0 1px var(--sf)}
.pe-dot{flex:0 0 auto; width:22px; height:22px; border-radius:50%; display:grid; place-items:center; background:var(--track); color:var(--ink-2)}
.pe-step[data-s="ok"] .pe-dot{background:var(--ok-f); color:#fff}
.pe-step[data-atual="1"] .pe-dot{background:var(--sf); color:#fff}
.pe-t{display:grid; gap:2px; min-width:0}
.pe-t b{font-size:12.5px; font-weight:800; line-height:1.2}
.pe-t small{font-size:11.5px; color:var(--ink-3); line-height:1.25; overflow-wrap:anywhere}

/* arquivos da peça */
.md-list{display:grid; gap:6px; margin:4px 0 8px}
.md-it{display:flex; align-items:center; gap:10px; padding:6px 8px; border:1px solid var(--line); border-radius:10px; background:var(--surface-2); min-width:0}
.md-th{width:44px; height:44px; flex:0 0 auto; border-radius:8px; object-fit:cover; background:var(--track); display:grid; place-items:center; color:var(--ink-2)}
.md-n{flex:1 1 auto; min-width:0; font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}

/* barras de progresso em passos de 5 */
.gx-bar{display:block}
.gx-bar-f[data-s="bad"]{background:var(--bad-f)}
.gx-bar-f[data-w="0"]{width:2%}
.gx-bar-f[data-w="5"]{width:5%} .gx-bar-f[data-w="10"]{width:10%} .gx-bar-f[data-w="15"]{width:15%} .gx-bar-f[data-w="20"]{width:20%}
.gx-bar-f[data-w="25"]{width:25%} .gx-bar-f[data-w="30"]{width:30%} .gx-bar-f[data-w="35"]{width:35%} .gx-bar-f[data-w="40"]{width:40%}
.gx-bar-f[data-w="45"]{width:45%} .gx-bar-f[data-w="50"]{width:50%} .gx-bar-f[data-w="55"]{width:55%} .gx-bar-f[data-w="60"]{width:60%}
.gx-bar-f[data-w="65"]{width:65%} .gx-bar-f[data-w="70"]{width:70%} .gx-bar-f[data-w="75"]{width:75%} .gx-bar-f[data-w="80"]{width:80%}
.gx-bar-f[data-w="85"]{width:85%} .gx-bar-f[data-w="90"]{width:90%} .gx-bar-f[data-w="95"]{width:95%} .gx-bar-f[data-w="100"]{width:100%}
td.w-bar{min-width:120px}

/* gráficos: séries por situação */
.bc .s-ok{fill:var(--ok-f)} .bc .s-bad{fill:var(--bad-f)} .bc .s-warn{fill:var(--warn-f)} .bc .s-idle{fill:var(--idle-f)}
.lgd i.s-ok{--k:var(--ok-f)} .lgd i.s-bad{--k:var(--bad-f)} .lgd i.s-warn{--k:var(--warn-f)} .lgd i.s-idle{--k:var(--idle-f)}
.hb-bar.ok{background:var(--ok-f)} .hb-bar.warn{background:var(--warn-f)} .hb-bar.bad{background:var(--bad-f)} .hb-bar.idle{background:var(--idle-f)}

/* cartões de cliente */
.cl-card{text-align:left; cursor:pointer; color:var(--ink); gap:8px; border-left:3px solid var(--sf, var(--line))}
.cl-card:hover{border-color:var(--brand)}
.cl-top{display:flex; align-items:flex-start; justify-content:space-between; gap:8px}
.cl-top b{font-size:15px; font-weight:800; overflow-wrap:anywhere}
.cl-est{display:flex; align-items:center; gap:8px; font-size:13px; color:var(--ink-2)}
.cl-est b{color:var(--ink); font-variant-numeric:tabular-nums}
.cl-risco{font-size:12.5px; font-weight:700; color:var(--s)}
.cl-eq{display:flex; flex-wrap:wrap; gap:4px; min-height:24px}

/* quadro e calendário */
.vw-col[data-s]{border-top-color:var(--sf)}
.vw-prazo[data-s]{--s:var(--s)}
.pchip{display:block; width:100%; text-align:left; font-size:11.5px; line-height:1.25; padding:3px 6px; border-radius:6px; border:1px solid color-mix(in srgb, var(--sf, var(--line-2)) 60%, transparent); background:color-mix(in srgb, var(--sf, var(--surface-2)) 16%, var(--surface)); color:var(--ink); cursor:pointer; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.pchip b{font-weight:800}

/* ranking */
.rk-pod{display:grid; grid-template-columns:repeat(auto-fit, minmax(180px, 1fr)); gap:10px}
.rk-p{display:grid; justify-items:center; gap:4px; padding:16px 12px; border-radius:14px; border:1px solid var(--line-2); background:var(--surface); color:var(--ink); cursor:pointer; text-align:center}
.rk-p[data-i="1"]{border-color:var(--warn-f); background:color-mix(in srgb, var(--warn-f) 12%, var(--surface))}
.rk-p strong{font-size:20px; font-weight:800; font-variant-numeric:tabular-nums}
.rk-p small{color:var(--ink-3); font-size:12px}
.rk-n{font-size:12px; font-weight:800; color:var(--ink-3)}

/* leitura em tela cheia */
.tp-wrap{display:grid; gap:18px}
.tp-it{padding:14px 16px; border:1px solid var(--line); border-radius:12px; background:var(--surface-2)}
.tp-t{white-space:pre-wrap; line-height:1.6; font-size:17px; max-width:68ch}
.tp-g{font-weight:800; color:var(--brand)}
.tp-wrap[data-z="0"] .tp-t{font-size:15px} .tp-wrap[data-z="2"] .tp-t{font-size:21px} .tp-wrap[data-z="3"] .tp-t{font-size:26px}

/* post no estilo do Instagram */
.ig{width:100%; max-width:470px; margin:0 auto; background:var(--surface); border:1px solid var(--line-2); border-radius:14px; overflow:hidden; color:var(--ink)}
.ig-h{display:flex; align-items:center; gap:10px; padding:10px 12px}
.ig-av{width:34px; height:34px; border-radius:50%; flex:0 0 auto; display:grid; place-items:center; font-size:12px; font-weight:800; color:#fff; background:linear-gradient(45deg, #F59E0B, #DB4A3D 55%, #A855F7); box-shadow:0 0 0 2px var(--surface), 0 0 0 4px #DB4A3D}
.ig-av.lg{width:52px; height:52px; font-size:16px}
.ig-u{display:grid; flex:1 1 auto; min-width:0}
.ig-u b{font-size:13.5px; font-weight:800}
.ig-u small{font-size:11.5px; color:var(--ink-3)}
.ig-mid{position:relative; background:#000; aspect-ratio:4/5; max-width:100%}
.ig-mid.v{aspect-ratio:9/16; max-height:72vh; margin:0 auto}
.ig.story .ig-mid{aspect-ratio:9/16}
.ig-mid.txt{background:linear-gradient(160deg, color-mix(in srgb, var(--brand) 26%, var(--surface-2)), var(--surface-2)); aspect-ratio:auto; min-height:260px; display:flex}
.ig-txt{padding:22px 20px; display:grid; align-content:center; gap:10px; width:100%}
.ig-txt p{margin:0; white-space:pre-wrap; font-size:16px; line-height:1.55; font-weight:600}
.ig-m{display:block; width:100%; height:100%; object-fit:cover; background:#000}
.ig-link{position:relative; display:grid; place-items:center; gap:8px; color:#fff; text-decoration:none; align-content:center}
.ig-link img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.7}
.ig-play{position:relative; width:64px; height:64px; border-radius:50%; background:rgba(0,0,0,.55); display:grid; place-items:center}
.ig-link small{position:relative; font-weight:800}
.ig-car{display:flex; overflow-x:auto; scroll-snap-type:x mandatory; height:100%; scrollbar-width:none}
.ig-car::-webkit-scrollbar{display:none}
.ig-sl{flex:0 0 100%; scroll-snap-align:start; height:100%}
.ig-cnt{position:absolute; top:10px; right:10px; background:rgba(0,0,0,.6); color:#fff; font-size:12px; font-weight:700; padding:2px 8px; border-radius:999px}
.ig-dots{display:flex; justify-content:center; gap:4px; padding:8px 0 0}
.ig-dots i{width:6px; height:6px; border-radius:50%; background:var(--line-2)}
.ig-dots i[data-on="1"]{background:#3B82F6}
.ig-acts{display:flex; align-items:center; gap:14px; padding:10px 12px 4px}
.ig-leg{margin:0; padding:2px 12px 12px; font-size:13.5px; line-height:1.45; white-space:pre-wrap; overflow-wrap:anywhere}
.ig-leg[data-cut="1"]{display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden}
.ig-mais{margin:-8px 12px 12px; color:var(--ink-3); text-decoration:none}

/* espaço do cliente */
.pt-root{max-width:720px; margin:0 auto; display:grid; gap:14px; padding-block:8px 90px}
.pt-preview{display:grid; gap:14px}
.pt-top{display:flex; align-items:center; gap:12px; padding:14px; border:1px solid var(--line); border-radius:14px; background:var(--surface)}
.pt-top b{display:block; font-size:16px; font-weight:800}
.pt-top small{color:var(--ink-3)}
.pt-num{text-align:center; display:grid}
.pt-num b{font-size:22px; color:var(--brand)}
.pt-tit{display:grid; gap:2px; max-width:470px; width:100%; margin:0 auto}
.pt-tit b{font-size:16px; font-weight:800; text-wrap:balance}
.pt-tit small{color:var(--ink-3); font-size:12.5px}
.pt-item{display:grid; gap:10px; padding-bottom:18px; border-bottom:1px solid var(--line)}
.pt-acts{display:grid; grid-template-columns:repeat(auto-fit, minmax(170px, 1fr)); gap:8px; max-width:470px; width:100%; margin:0 auto}
.btn.lg{min-height:52px; font-size:16px; justify-content:center}
.pt-rot{max-width:470px; margin:0 auto; padding:14px; border:1px solid var(--line); border-radius:12px; background:var(--surface-2)}
.pt-rot .tp-t{font-size:15.5px}
.ig-grid{display:grid; grid-template-columns:repeat(3, minmax(0, 1fr)); gap:3px}
.ig-cell{position:relative; aspect-ratio:4/5; border:0; padding:0; background:var(--surface-2); overflow:hidden; cursor:pointer; color:var(--ink)}
.ig-cell img{width:100%; height:100%; object-fit:cover; display:block}
.ig-cell-t{position:absolute; inset:0; display:grid; place-items:center; padding:10px; font-size:12.5px; font-weight:700; text-align:center; line-height:1.3}
.ig-cell-d{position:absolute; left:6px; top:6px; background:rgba(0,0,0,.6); color:#fff; font-size:11px; font-weight:800; padding:1px 6px; border-radius:6px}
.ig-cell-v{position:absolute; right:6px; top:6px; color:#fff}
.ig-cell-s{position:absolute; left:0; right:0; bottom:0; font-size:10.5px; font-weight:800; padding:3px 6px; background:color-mix(in srgb, var(--sf, #000) 70%, #000); color:#fff; text-align:left}
.pt-cal{min-width:520px}
body.portal-mode .side, body.portal-mode .topbar, body.portal-mode .bnav, body.portal-mode .fbar, body.portal-mode .online-bar{display:none !important}
body.portal-mode .main{margin-left:0}
body.portal-mode .content{padding-top:12px}

@media (max-width: 640px){
  .ig-grid{gap:2px}
  .pe-step{min-width:132px}
  .rk-pod{grid-template-columns:1fr}
}

.rk-nm{display:inline-flex; align-items:center; gap:8px; white-space:nowrap}
.pt-acts .btn{white-space:nowrap; font-size:15px}
.pt-acts .btn{display:inline-flex; flex-direction:row; flex-wrap:nowrap; align-items:center; gap:8px; padding-inline:10px}

/* ===================== v2 ===================== */
.chip{display:inline-flex; align-items:center; gap:6px; min-height:34px; padding:6px 12px; border-radius:999px; border:1px solid var(--line-2); background:var(--surface); color:var(--ink-2); font-size:13px; font-weight:700; cursor:pointer; text-align:left}
.chip:hover{border-color:var(--brand); color:var(--ink)}
.chip.on,.chip[aria-pressed="true"]{background:color-mix(in srgb, var(--brand) 16%, var(--surface)); border-color:var(--brand); color:var(--ink)}
.chip:disabled{opacity:.5; cursor:not-allowed}
.chip.sm{min-height:28px; padding:3px 9px; font-size:12px}
.fld-l{font-size:13px; font-weight:700; color:var(--ink-2)}
.inp.sm{min-height:32px; padding:4px 8px; font-size:13px}
.inp.mono{font-family:ui-monospace, Menlo, Consolas, monospace; font-size:13px}
.spin{display:inline-block; width:14px; height:14px; border-radius:50%; border:2px solid currentColor; border-right-color:transparent; animation:spin .8s linear infinite; margin-right:6px; vertical-align:-2px}
@keyframes spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion: reduce){ .spin{animation-duration:2.5s} }
.btn.busy,.btn:disabled{opacity:.7; cursor:progress}
label.btn.busy{pointer-events:none; opacity:.6}

/* janelas largas */
.dlg.drawer.xl{width:min(1180px, 100vw)}
#fdInfo.xl{width:min(1180px, 96vw); max-width:96vw}

/* peça aberta em duas colunas */
.pc-head{display:grid; gap:8px; min-width:0}
.pc-bc{display:flex; flex-wrap:wrap; align-items:center; gap:2px; font-size:12.5px; color:var(--ink-3)}
.pc-bc .lnk{font-size:12.5px}
.pc-titulo{width:100%; font-size:22px; font-weight:800; border:1px solid transparent; border-radius:10px; padding:6px 8px; margin-left:-8px; background:transparent; color:var(--ink)}
.pc-titulo:hover{border-color:var(--line)} .pc-titulo:focus{border-color:var(--brand); outline:none; background:var(--surface)}
.pc-salvo{color:var(--ink-3); font-size:12px} .pc-salvo[data-s="ok"]{color:var(--ok)}
.pc-grid{display:grid; grid-template-columns:minmax(0,1fr); gap:16px; align-items:start}
@media (min-width:900px){ .pc-grid{grid-template-columns:minmax(0,1fr) 320px} }
.pc-main,.pc-side{display:grid; gap:14px; min-width:0}
@media (min-width:900px){ .pc-side{position:sticky; top:0} }
.pc-sec{display:grid; gap:10px; padding:14px; border:1px solid var(--line); border-radius:14px; background:var(--surface); min-width:0}
.pc-sh{display:flex; align-items:center; justify-content:space-between; gap:8px; font-size:14px; font-weight:800; margin:0}
.pc-card{display:grid; gap:6px; padding:14px; border-radius:14px; border:1px solid var(--sf); background:color-mix(in srgb, var(--sf) 10%, var(--surface))}
.pc-agora{font-size:17px}
.resp-l{display:grid; gap:8px}
.resp-it{display:flex; align-items:center; gap:10px; min-width:0}
.resp-it .grow{display:grid; min-width:0} .resp-it small{color:var(--ink-3)}
.rt-met{display:grid; gap:8px}
.rt-ck{list-style:none; margin:0; padding:0; display:grid; gap:4px}
.rt-ck li{display:flex; align-items:flex-start; gap:6px; font-size:13.5px; color:var(--ink-2)}
.rt-ck li[data-s="ok"] span:first-child{color:var(--ok)} .rt-ck li[data-s="warn"] span:first-child{color:var(--warn)} .rt-ck li[data-s="bad"] span:first-child{color:var(--bad)}
.pacote{display:grid; gap:6px; padding:10px 12px; border-radius:12px; background:var(--surface-2); border:1px dashed var(--line-2)}
.cards-ed{display:grid; gap:10px}
.card-ed{display:grid; gap:8px; padding:12px; border-radius:12px; border:1px solid var(--line); border-left:4px solid var(--sf); background:var(--surface-2)}
.card-h{display:flex; align-items:center; gap:8px; flex-wrap:wrap}
.drop{display:grid; place-items:center; gap:4px; padding:22px; border:2px dashed var(--line-2); border-radius:12px; color:var(--ink-3); text-align:center}
.coms{display:grid; gap:10px}
.com{display:flex; gap:10px; align-items:flex-start}
.com p{margin:2px 0 0; white-space:pre-wrap}
.com-novo{display:flex; gap:8px; align-items:flex-end}
.com-novo .inp{flex:1 1 auto; min-width:0}
.com-b .btn{white-space:nowrap}

/* metas por período */
.metas{display:grid; gap:10px; grid-template-columns:repeat(auto-fill, minmax(160px, 1fr))}
.meta{display:grid; gap:6px; padding:12px; border-radius:14px; background:var(--surface); border:1px solid var(--line); border-top:3px solid var(--sf)}
.meta-h{display:flex; align-items:center; justify-content:space-between; gap:6px; flex-wrap:wrap}
.meta-n{display:flex; align-items:baseline; gap:8px} .meta-n strong{font-size:20px; font-variant-numeric:tabular-nums} .meta-n span{color:var(--ink-3); font-size:12.5px}

/* motor de visões */
.vw-top{display:flex; flex-wrap:wrap; align-items:center; gap:10px}
.vw-top .vw-tabs{flex:1 1 360px; min-width:0}
.vw-sel{display:inline-flex; align-items:center; gap:6px; font-size:13px; color:var(--ink-2)}
.vw-ajuda{margin:8px 2px 10px; font-size:12.5px; color:var(--ink-3)}
.th-sort{border:0; background:none; font:inherit; font-weight:800; color:inherit; cursor:pointer; padding:0; text-align:left}
.tr-click{cursor:pointer} .tr-click:hover td{background:var(--surface-2)}
.tl-bloco{display:grid; gap:6px}
.tl{list-style:none; margin:0; padding:0; display:grid; gap:10px; border-left:2px solid var(--line); margin-left:6px}
.tl-dia{display:grid; gap:6px; padding-left:14px; position:relative}
.tl-dia::before{content:""; position:absolute; left:-7px; top:4px; width:12px; height:12px; border-radius:50%; background:var(--sf); border:2px solid var(--surface)}
.tl-d{font-size:12.5px; color:var(--ink-2)}
.tl-its{display:grid; gap:6px}
.tl-it{display:grid; gap:2px; text-align:left; padding:8px 10px; border-radius:10px; border:1px solid var(--line); border-left:3px solid var(--sf); background:var(--surface); color:var(--ink); cursor:pointer; font:inherit}
.tl-it small{color:var(--ink-3)}
.gantt{display:grid; gap:4px; min-width:640px}
.gt-row{display:grid; grid-template-columns:220px minmax(0,1fr); gap:8px; align-items:center}
.gt-l{font-size:12.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
.gt-track{position:relative; height:22px; border-radius:6px; background:var(--surface-2)}
.gt-head .gt-track{background:none; height:18px}
.gt-tick{position:absolute; top:0; font-size:11px; color:var(--ink-3); white-space:nowrap}
.gt-bar{position:absolute; top:3px; bottom:3px; left:var(--l, 0); width:var(--w, 4%); border-radius:5px; border:0; background:var(--sf); cursor:pointer; padding:0}
.gt-hoje{position:absolute; top:-2px; bottom:-2px; left:var(--l, 0); width:2px; background:var(--ok-f)}
.heat{border-collapse:separate; border-spacing:3px; font-size:12px}
.heat th{font-weight:700; color:var(--ink-3); text-align:center}
.heat-l{text-align:left !important; white-space:nowrap; color:var(--ink) !important; padding-right:8px}
.heat-c{width:30px; height:26px; border-radius:5px; border:0; font-size:11px; font-weight:800; color:var(--ink); cursor:pointer; background:var(--surface-2)}
.heat-c[data-n="1"]{background:color-mix(in srgb, var(--sf) 22%, var(--surface))} .heat-c[data-n="2"]{background:color-mix(in srgb, var(--sf) 40%, var(--surface))}
.heat-c[data-n="3"]{background:color-mix(in srgb, var(--sf) 58%, var(--surface))} .heat-c[data-n="4"]{background:color-mix(in srgb, var(--sf) 78%, var(--surface)); color:var(--on)} .heat-c[data-n="5"]{background:var(--sf); color:var(--on)}
.funil{display:grid; gap:6px}
.fn-row{display:grid; grid-template-columns:minmax(120px, 220px) minmax(0,1fr) 44px 90px; gap:10px; align-items:center; text-align:left; padding:6px 8px; border-radius:10px; border:1px solid transparent; background:none; color:var(--ink); cursor:pointer; font:inherit}
.fn-row:hover{border-color:var(--line); background:var(--surface-2)}
.fn-n{font-size:13px; font-weight:700} .fn-row small{color:var(--ink-3); font-size:12px}
.fn-bar{display:flex; justify-content:center; height:22px}
.fn-bar i{display:block; height:100%; border-radius:6px; background:var(--sf)}
.mtz{display:grid; gap:10px; grid-template-columns:repeat(auto-fit, minmax(260px, 1fr))}
.mtz-q{display:grid; gap:8px; align-content:start; padding:12px; border-radius:14px; border:1px solid var(--sf); background:color-mix(in srgb, var(--sf) 8%, var(--surface))}
.mtz-h{display:grid} .mtz-h small{color:var(--ink-3)}
.mtz-its{display:flex; flex-wrap:wrap; gap:6px}
.pg-row{display:grid; grid-template-columns:minmax(120px, 220px) minmax(0,1fr) 48px 70px; gap:10px; align-items:center; padding:8px 10px; border:1px solid var(--line); border-radius:10px; background:var(--surface); color:var(--ink); text-align:left; font:inherit; cursor:pointer}
.pg-n{font-weight:700; font-size:13px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap} .pg-row small{color:var(--ink-3)}
.resumo{display:grid; gap:8px} .resumo p{display:flex; gap:8px; align-items:flex-start; margin:0} .resumo p span:first-child{color:var(--brand); flex:0 0 auto}
.resumo-ia{white-space:pre-wrap; padding:12px; border-radius:12px; background:var(--surface-2); margin-top:8px; font-size:14px; line-height:1.55}
.resumo-ia:empty{display:none}
.dep{max-width:100%; height:auto}
.dep-l{fill:none; stroke:var(--warn-f); opacity:.65; cursor:pointer} .dep-l:hover{opacity:1}
.dep-n{fill:var(--surface-2); stroke:var(--line-2)} .dep-n.b{fill:color-mix(in srgb, var(--warn-f) 18%, var(--surface))}
.dep-t{fill:var(--ink); font-size:12px; font-weight:700}
.ish{display:grid; gap:8px}
.ish-row{display:grid; grid-template-columns:repeat(auto-fit, minmax(150px, 1fr)); gap:8px}
.ish-c{display:grid; gap:2px; padding:10px; border-radius:12px; border:1px solid var(--sf); background:color-mix(in srgb, var(--sf) 10%, var(--surface)); color:var(--ink); text-align:left; font:inherit; cursor:pointer}
.ish-c span{font-size:12.5px; color:var(--ink-2)}
.ish-espinha{display:flex; align-items:center; height:28px; border-radius:999px; background:var(--track); position:relative}
.ish-cabeca{margin-left:auto; padding:4px 14px; border-radius:999px; background:var(--bad-f); color:var(--on-bad-f); font-weight:800; font-size:13px}
.geo{max-width:100%; height:auto}
.geo-bg{fill:var(--surface-2); stroke:var(--line)}
.geo-c{fill:color-mix(in srgb, var(--ok-f) 55%, transparent); stroke:var(--ok-f); cursor:pointer} .geo-c.bad{fill:color-mix(in srgb, var(--bad-f) 55%, transparent); stroke:var(--bad-f)}
.geo-t{fill:var(--ink); font-size:12px; font-weight:700} .geo-uf{fill:var(--ink-3); font-size:28px; font-weight:800; opacity:.35}
.geo-p:focus{outline:none} .geo-p:focus .geo-c{stroke-width:3}
.arv{display:grid; gap:8px}
.arv-r{display:grid; grid-template-columns:minmax(0,1fr) 24px minmax(0,1fr) auto; gap:10px; align-items:center; padding:10px 12px; border-radius:12px; border:1px solid var(--line); border-left:4px solid var(--sf); background:var(--surface)}
.arv-q,.arv-a{display:grid} .arv-q small,.arv-a small{color:var(--ink-3); font-size:11.5px; text-transform:uppercase; letter-spacing:.04em}
.arv-seta{color:var(--ink-3)}
.arv-n{border:1px solid var(--sf); border-radius:999px; padding:4px 10px; background:color-mix(in srgb, var(--sf) 14%, var(--surface)); color:var(--ink); font-weight:800; cursor:pointer; white-space:nowrap}
@media (max-width:640px){ .arv-r{grid-template-columns:minmax(0,1fr)} .arv-seta{display:none} .fn-row{grid-template-columns:minmax(0,1fr) 44px} .fn-row .fn-bar,.fn-row small{grid-column:1 / -1} .pg-row{grid-template-columns:minmax(0,1fr) 48px} .pg-row .gx-bar{grid-column:1 / -1} .gt-row{grid-template-columns:130px minmax(0,1fr)} }
.chart-box{min-height:200px}
.gx-kv-r{display:contents}

/* gravação em planilha e teleprompter */
.planilha td{vertical-align:middle} .planilha .inp.sm{min-width:110px}
.planilha tr[data-s="ok"] td:first-child{box-shadow:inset 3px 0 0 var(--ok-f)} .planilha tr[data-s="bad"] td:first-child{box-shadow:inset 3px 0 0 var(--bad-f)} .planilha tr[data-s="warn"] td:first-child{box-shadow:inset 3px 0 0 var(--warn-f)}
.doc-l{display:grid; gap:6px; padding:8px 0; border-bottom:1px solid var(--line)}
.tp-ctl{display:flex; flex-wrap:wrap; align-items:center; gap:10px 16px}
.tp-sl{display:inline-flex; align-items:center; gap:8px; font-size:13px}
.tp-sl input[type=range]{width:140px; accent-color:var(--brand)}
.tp-tela{height:min(70vh, 640px); overflow-y:auto; border-radius:16px; background:#0B0F0D; color:#F4F7F5; padding:40vh 24px; scrollbar-width:none}
.tp-tela:fullscreen{height:100vh; border-radius:0}
.tp-trilho{white-space:pre-wrap; line-height:1.45; font-size:var(--tp-t, 44px); font-family:var(--tp-f, system-ui, sans-serif); max-width:1000px; margin:0 auto; text-align:center}
.tp-trilho[data-esp="1"]{transform:scaleX(-1)}

/* ideias */
.ideias{display:grid; gap:12px; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr))}
.ideia{display:grid; gap:6px; align-content:start; text-align:left; padding:10px; border-radius:14px; border:1px solid var(--line); background:var(--surface); color:var(--ink); cursor:pointer; font:inherit; min-width:0}
.ideia:hover{border-color:var(--brand)}
.ideia-img{width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:10px; background:var(--surface-2)}
.ideia-ic{display:grid; place-items:center; aspect-ratio:4/3; border-radius:10px; background:var(--surface-2); color:var(--brand)}
.ideia small{color:var(--ink-2)}

/* IA integrada */
.ia-chat{display:grid; gap:12px; padding:14px; border:1px solid var(--line); border-radius:16px; background:var(--surface); min-height:240px; max-height:62vh; overflow-y:auto}
.ia-vazio{display:grid; justify-items:center; gap:10px; text-align:center; color:var(--ink-2); padding:20px 0}
.ia-vazio .chipset{justify-content:center}
.ia-m{display:grid; gap:4px; max-width:860px}
.ia-m small{font-size:12px; color:var(--ink-3); font-weight:700}
.ia-m[data-r="user"]{justify-self:end; text-align:right}
.ia-t{white-space:pre-wrap; line-height:1.55; padding:10px 14px; border-radius:14px; background:var(--surface-2)}
.ia-m[data-r="user"] .ia-t{background:color-mix(in srgb, var(--brand) 14%, var(--surface))}

/* ranking e quem é quem */
.coroa{display:inline-flex; color:var(--warn-f); margin-left:2px}
.rk2 td[data-s="ok"]{color:var(--ok)} .rk2 td[data-s="warn"]{color:var(--warn)} .rk2 td[data-s="bad"]{color:var(--bad)}
.rk2 td.num{white-space:nowrap}
.rk2 th .icon-btn.sm{width:24px; height:24px; vertical-align:middle; margin-left:4px}
.quem td{white-space:nowrap} .quem .inp.sm{min-width:140px}
.ln.s1{stroke:var(--c1)} .ln.s2{stroke:var(--c2)} .ln.s3{stroke:var(--ok-f)} .ln.s4{stroke:var(--c7)} .ln.s5{stroke:var(--warn-f)} .ln.s6{stroke:var(--bad-f)}
.dt.s1{fill:var(--c1)} .dt.s2{fill:var(--c2)} .dt.s3{fill:var(--ok-f)} .dt.s4{fill:var(--c7)} .dt.s5{fill:var(--warn-f)} .dt.s6{fill:var(--bad-f)}
.lg .s1,.lgd.s1{background:var(--c1)} .lg .s2,.lgd.s2{background:var(--c2)} .lg .s3,.lgd.s3{background:var(--ok-f)} .lg .s4,.lgd.s4{background:var(--c7)} .lg .s5,.lgd.s5{background:var(--warn-f)} .lg .s6,.lgd.s6{background:var(--bad-f)}

.fn-bar i[data-w="0"]{width:0%} .fn-bar i[data-w="5"]{width:5%} .fn-bar i[data-w="10"]{width:10%} .fn-bar i[data-w="15"]{width:15%} .fn-bar i[data-w="20"]{width:20%} .fn-bar i[data-w="25"]{width:25%} .fn-bar i[data-w="30"]{width:30%} .fn-bar i[data-w="35"]{width:35%} .fn-bar i[data-w="40"]{width:40%} .fn-bar i[data-w="45"]{width:45%} .fn-bar i[data-w="50"]{width:50%} .fn-bar i[data-w="55"]{width:55%} .fn-bar i[data-w="60"]{width:60%} .fn-bar i[data-w="65"]{width:65%} .fn-bar i[data-w="70"]{width:70%} .fn-bar i[data-w="75"]{width:75%} .fn-bar i[data-w="80"]{width:80%} .fn-bar i[data-w="85"]{width:85%} .fn-bar i[data-w="90"]{width:90%} .fn-bar i[data-w="95"]{width:95%} .fn-bar i[data-w="100"]{width:100%}
.lgd i.s1{background:var(--c1)} .lgd i.s2{background:var(--c2)} .lgd i.s3{background:var(--ok-f)} .lgd i.s4{background:var(--c7)} .lgd i.s5{background:var(--warn-f)} .lgd i.s6{background:var(--bad-f)}

/* ===== v4: menu, Meu dia, equipe agora, indicadores, conversas, notícias, integrações, saúde, relatórios, mapa e marcações ===== */
/* toques de pelo menos 44px no celular */
@media (pointer:coarse){ .btn,.chip,.nav-btn,.mn-it,.qd-tab,.icon-btn,.md-k,.eq-av,.ind-v,.conv-it{min-height:44px} .chip.sm{min-height:40px} }

/* menu em tela cheia no celular */
#fdInfo.menu{width:min(560px, 100vw); max-height:100dvh}
.mn-lista{display:grid; gap:6px}
.mn-grp{border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface)}
.mn-grp > summary{display:flex; align-items:center; gap:10px; padding:12px 14px; cursor:pointer; list-style:none; min-height:44px}
.mn-grp > summary::-webkit-details-marker{display:none}
.mn-grp > summary small{margin-left:auto; color:var(--ink-3)}
.mn-grp[open] > .mn-lista{padding:0 8px 10px}
.mn-it{display:flex; align-items:center; gap:12px; width:100%; padding:10px 12px; border:1px solid transparent; border-radius:var(--r-sm); background:transparent; color:var(--ink); text-align:left; cursor:pointer}
.mn-it:hover{background:var(--surface-2)}
.mn-it[aria-current="page"]{border-color:var(--brand); background:var(--brand-soft)}
.mn-ic{display:inline-grid; place-items:center; width:36px; height:36px; border-radius:10px; background:var(--surface-2); color:var(--brand); flex:none}
.mn-n{display:grid; min-width:0; flex:1}
.mn-n b{font-size:14px}
.mn-n small{color:var(--ink-3); font-size:12px}
.nav-busca{width:100%; margin-bottom:8px}
.nav-res{display:grid; gap:2px; margin-bottom:8px}
.nav-atalhos{display:grid; gap:2px; margin-bottom:10px}
.nav-gn{margin-left:auto; color:var(--ink-3); font-weight:600}
.pg-ajuda{display:inline-flex; align-items:center; gap:6px; margin-top:4px; font-size:13px}

/* Meu dia */
.md-kpis{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:10px; margin-top:12px}
@media (max-width:640px){ .md-kpis{grid-template-columns:repeat(2, minmax(0,1fr))} }
.md-k{display:grid; gap:2px; padding:12px 14px; border-radius:var(--r-sm); border:1px solid var(--line); background:var(--surface); color:var(--ink); text-align:left; font:inherit}
button.md-k{cursor:pointer}
.md-k b{font-size:22px; font-variant-numeric:tabular-nums}
.md-k small{color:var(--ink-3)}
.md-k[data-s="bad"]{border-color:var(--bad-f); background:var(--bad-soft)}
.md-k[data-s="warn"]{border-color:var(--warn-f); background:var(--warn-soft)}
.md-prox{display:flex; align-items:center; gap:12px; padding:14px; border-radius:var(--r-sm); border:1px solid var(--line); background:var(--surface); margin-top:12px; flex-wrap:wrap}
.md-res{display:grid; gap:8px; margin-top:12px}
.md-per{display:flex; gap:6px; overflow-x:auto; padding-bottom:2px; scrollbar-width:thin}
.md-per .chip{flex:none}
.md-res-l{display:flex; align-items:center; gap:8px; flex-wrap:wrap; color:var(--ink-2)}
.md-ctl{display:flex; gap:10px; flex-wrap:wrap; margin-top:12px; align-items:flex-end}
.md-ctl .fld{min-width:0; flex:1 1 180px}
.dm-info{display:flex; gap:8px; flex-wrap:wrap; font-size:13px; color:var(--ink-2)}
.dm-imp{color:var(--warn); font-weight:700}
.vw-ver{display:grid; gap:4px}
.vw-m{min-width:0}

/* estados vazios */
.vazio2{display:grid; justify-items:start; gap:6px; padding:18px; border:1px dashed var(--line-2); border-radius:var(--r-sm); background:var(--surface)}
.vazio2 p{margin:0; color:var(--ink-2)}
.vazio2[data-s="bad"]{border-color:var(--bad-f)}
.vazio2[data-s="warn"]{border-color:var(--warn-f)}
.vazio-c{display:grid; place-items:center; min-height:240px}

/* equipe agora */
.eq-strip{display:grid; gap:8px; padding:12px 14px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface); margin-top:12px}
.eq-h{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.eq-h .lnk,.eq-h .btn{margin-left:auto}
.eq-row{display:flex; gap:8px; overflow-x:auto; padding-bottom:2px}
.eq-av{position:relative; display:inline-grid; place-items:center; flex:none; width:44px; height:44px; padding:0; border-radius:999px; border:2px solid var(--line); background:var(--surface-2); cursor:pointer}
.eq-av[data-s="ok"]{border-color:var(--ok-f)}
.eq-av[data-s="warn"]{border-color:var(--warn-f)}
.eq-dot{position:absolute; right:-2px; bottom:-2px; width:12px; height:12px; border-radius:999px; border:2px solid var(--surface); background:var(--idle-f)}
.eq-dot[data-k="online"]{background:var(--ok-f)}
.eq-dot[data-k="semint"]{background:var(--warn-f)}
.eq-dot[data-k="off"]{background:var(--idle-f)}
.eq-dot[data-k="desconhecido"]{background:transparent; border-style:dashed; border-color:var(--ink-3)}

/* indicadores */
.ind-l{display:grid; gap:2px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface); overflow:hidden}
.ind-r{display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; gap:10px; padding:8px 12px; border-top:1px solid var(--line)}
.ind-r:first-child{border-top:0}
.ind-n{display:flex; align-items:center; gap:6px; min-width:0; color:var(--ink)}
.ind-v{min-width:64px; padding:6px 10px; border-radius:10px; border:1px solid var(--line); background:var(--surface-2); color:var(--ink); font:inherit; font-weight:700; font-variant-numeric:tabular-nums; text-align:right; cursor:pointer}
.ind-v[data-s="bad"]{color:var(--bad); border-color:var(--bad-f)}
.ind-v[data-s="warn"]{color:var(--warn); border-color:var(--warn-f)}
.ind-v[data-s="ok"]{color:var(--ok)}
@media (max-width:480px){ .ind-r{grid-template-columns:minmax(0,1fr)} .ind-v{justify-self:start} }

/* desfazer e simulação */
#desfazerBar,.desfazer{position:fixed; left:50%; transform:translateX(-50%); bottom:calc(16px + env(safe-area-inset-bottom, 0px)); z-index:60; display:flex; align-items:center; gap:12px; padding:10px 14px; border-radius:999px; background:var(--ink); color:var(--bg); box-shadow:var(--shadow); max-width:calc(100vw - 32px)}
.desfazer .btn{background:var(--bg); color:var(--ink)}
.sim-bar{position:sticky; top:env(safe-area-inset-top, 0px); z-index:70; display:flex; align-items:center; gap:10px; flex-wrap:wrap; padding:10px 16px; background:var(--warn-f); color:var(--on-warn-f); font-weight:700}
body.simulando .main{outline:3px solid var(--warn-f); outline-offset:-3px}

/* conversas */
.conv-wrap{display:grid; grid-template-columns:300px minmax(0,1fr); gap:12px; min-height:60dvh}
.conv-l{display:grid; align-content:start; gap:4px; max-height:72dvh; overflow-y:auto}
.conv-it{display:grid; gap:2px; width:100%; padding:10px 12px; border-radius:var(--r-sm); border:1px solid var(--line); background:var(--surface); color:var(--ink); text-align:left; font:inherit; cursor:pointer}
.conv-it[aria-current="true"]{border-color:var(--brand); background:var(--brand-soft)}
.conv-d{display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:8px; min-width:0; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface); padding:10px}
.conv-voltar{display:none}
@media (max-width:760px){ .conv-wrap{grid-template-columns:minmax(0,1fr)} .conv-wrap.aberta .conv-l{display:none} .conv-wrap:not(.aberta) .conv-d{display:none} .conv-voltar{display:inline-flex} }
.conv{display:grid; gap:8px; min-width:0}
.msgs{display:grid; align-content:start; gap:8px; max-height:56dvh; overflow-y:auto; padding:4px}
.msg{display:flex; gap:8px; align-items:flex-start; max-width:92%}
.msg.eu{margin-left:auto; flex-direction:row-reverse}
.msg-b{display:grid; gap:4px; padding:8px 12px; border-radius:14px; background:var(--surface-2); border:1px solid var(--line); min-width:0}
.msg.eu .msg-b{background:var(--brand-soft); border-color:color-mix(in srgb, var(--brand) 40%, var(--line))}
.msg-h{display:flex; gap:8px; align-items:baseline; flex-wrap:wrap; font-size:12px; color:var(--ink-3)}
.msg-h b{color:var(--ink); font-size:13px}
.msg-t{margin:0; white-space:pre-wrap; overflow-wrap:anywhere}
.msg-a{display:flex; gap:6px; flex-wrap:wrap}
.msg-novo{display:grid; gap:8px; border-top:1px solid var(--line); padding-top:8px}

/* notícias e integrações */
.nt-it{display:grid; gap:6px; padding:10px 12px; border:1px solid var(--line); border-left:4px solid var(--idle-f); border-radius:var(--r-sm); background:var(--surface)}
.nt-it[data-s="ok"]{border-left-color:var(--ok-f)}
.nt-it[data-s="warn"]{border-left-color:var(--warn-f)}
.nt-it[data-s="bad"]{border-left-color:var(--bad-f)}
.int-c{display:grid; gap:8px; padding:14px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface)}
.int-c[data-s="ok"]{border-color:var(--ok-f)}
.int-c[data-s="bad"]{border-color:var(--bad-f); background:var(--bad-soft)}
.int-h{display:flex; align-items:center; gap:10px; flex-wrap:wrap}
.int-h .pill{margin-left:auto}

/* relatórios */
.rel-bloco{display:grid; gap:8px; padding:12px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface)}
.rel-mini{display:grid; grid-template-columns:repeat(auto-fill, minmax(140px, 1fr)); gap:8px}
.rel-form{display:grid; gap:6px}
.rel-l{display:grid; grid-template-columns:minmax(0,1fr) minmax(120px, 200px); gap:10px; align-items:center; padding:6px 0; border-bottom:1px solid var(--line)}
@media (max-width:520px){ .rel-l{grid-template-columns:minmax(0,1fr)} }
.rel-v{display:grid; gap:2px; font-variant-numeric:tabular-nums}
.collab-l{display:grid; gap:2px; padding:8px 10px; border:1px solid var(--line); border-radius:var(--r-sm)}

/* saúde em três dimensões */
.s3{display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:10px; margin-top:12px}
@media (max-width:760px){ .s3{grid-template-columns:minmax(0,1fr)} }
.s3-b{display:grid; align-content:start; gap:8px; padding:12px; border:1px solid var(--line); border-top:4px solid var(--idle-f); border-radius:var(--r-sm); background:var(--surface); min-width:0}
.s3-b[data-s="bad"]{border-top-color:var(--bad-f)}
.s3-b[data-s="warn"]{border-top-color:var(--warn-f)}
.s3-b[data-s="ok"]{border-top-color:var(--ok-f)}
.s3-h{display:flex; align-items:center; justify-content:space-between; gap:8px; flex-wrap:wrap}

/* pesquisa no espaço do cliente */
.pt-pesq{display:grid; gap:10px; padding:16px; border:1px solid var(--brand); border-radius:var(--r); background:var(--brand-soft); margin:12px 0}
.pt-pesq .nbtns{display:flex; flex-wrap:wrap; gap:6px}
.pt-pesq .nb{min-width:44px; min-height:44px; border-radius:12px; border:1px solid var(--line-2); background:var(--surface); color:var(--ink); font:inherit; font-weight:800; cursor:pointer}
.pt-pesq .nb[data-s="ok"]:hover{border-color:var(--ok-f)}
.pt-pesq .nb[data-s="warn"]:hover{border-color:var(--warn-f)}
.pt-pesq .nb[data-s="bad"]:hover{border-color:var(--bad-f)}
.pt-pesq .nb.none{padding:0 12px; font-weight:600}

/* mapa do processo */
.mapa{display:grid; gap:8px; margin-top:12px}
.mapa-f{display:flex; gap:8px; overflow-x:auto; padding:2px 0 6px; counter-reset:m}
.mapa-e{position:relative; display:grid; gap:2px; flex:none; width:150px; padding:10px; border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface)}
.mapa-e small{color:var(--ink-3); font-variant-numeric:tabular-nums}
.mapa-e span{color:var(--ink-2); font-size:12px}
.mapa-e[data-t="revisao"]{border-color:var(--warn-f)}
.mapa-e[data-t="cliente"],.mapa-e[data-t="cliente_roteiro"]{border-color:var(--c1)}
.mapa-e + .mapa-e::before{content:''; position:absolute; left:-9px; top:50%; width:8px; height:2px; background:var(--line-2)}

/* marcações nas imagens */
.mk-wrap{position:relative; display:inline-block; max-width:100%; cursor:crosshair; border-radius:var(--r-sm); overflow:hidden; border:1px solid var(--line)}
.mk-img{display:block; max-width:100%; height:auto}
.mk-pt{position:absolute; left:var(--x); top:var(--y); transform:translate(-50%, -50%); display:grid; place-items:center; width:28px; height:28px; border-radius:999px; background:var(--bad-f); color:var(--on-bad-f); font-weight:800; font-size:13px; border:2px solid var(--surface); box-shadow:var(--shadow); pointer-events:none}
.mk-pt[data-v="antiga"]{background:var(--idle-f); color:var(--on-idle-f)}
.mk-cmp{display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:10px}
.mk-cmp figure{margin:0; display:grid; gap:4px}
.mk-cmp figcaption{color:var(--ink-3); font-size:12px}
@media (max-width:520px){ .mk-cmp{grid-template-columns:minmax(0,1fr)} }
/* contexto do cliente e da unidade nas ações */
.ctx-cli{display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:8px 10px; border:1px solid var(--line-2); border-radius:var(--r-sm); background:var(--surface-2)}
.ctx-cli b{font-size:15px}
.ctx-cli small{color:var(--ink-3)}

/* ===== v6: interface reorganizada ===== */
/* menu lateral: áreas fechadas, favoritos e estrela */
.nav-li{display:flex; align-items:center; gap:2px; min-width:0}
.nav-li > .nav-btn{flex:1; min-width:0}
.nav-t{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.nav-fav{flex:none; display:inline-grid; place-items:center; width:30px; height:30px; border:0; border-radius:8px; background:transparent; color:var(--ink-3); cursor:pointer; opacity:0; transition:opacity .12s}
.nav-li:hover .nav-fav, .nav-fav:focus-visible, .nav-fav.on, .mn-li .nav-fav{opacity:1}
.nav-fav.on{color:var(--warn)}
.nav-fav.on svg{fill:currentColor}
.nav-fav:hover{background:var(--surface-2)}
@media (pointer:coarse){ .nav-fav{opacity:1; width:40px; height:40px} }
.nav-grp{border-top:1px solid var(--line)}
.nav-grp > summary{display:flex; align-items:center; gap:10px; padding:10px 12px; cursor:pointer; list-style:none; border-radius:10px; font-weight:700; font-size:14px; color:var(--ink-2); min-height:40px}
.nav-grp > summary::-webkit-details-marker{display:none}
.nav-grp > summary::after{content:''; width:7px; height:7px; border-right:2px solid var(--ink-3); border-bottom:2px solid var(--ink-3); transform:rotate(-45deg); margin-left:6px; transition:transform .15s}
.nav-grp[open] > summary::after{transform:rotate(45deg)}
.nav-grp > summary:hover{background:var(--surface-2); color:var(--ink)}
.nav-grp[open]{padding-bottom:6px}
.nav-grp .nav-btn{padding-left:20px}
.nav-gt{flex:1; min-width:0}
.nav-ajuda{margin-top:8px; border-top:1px solid var(--line); border-radius:0; padding-top:10px}
.mn-li{display:flex; align-items:center; gap:4px}
.mn-li > .mn-it{flex:1; min-width:0}
.mais-h{font-size:13px; font-weight:800; color:var(--ink-3); margin:6px 0 4px}

/* topo: equipe e ajuda no lugar dos avatares */
.tb-eq{white-space:nowrap}
@media (max-width:760px){ .tb-eq{display:none} }

/* menu de ações raras */
details.mm{position:relative; display:inline-block}
details.mm > summary{list-style:none; cursor:pointer; display:inline-flex; align-items:center; gap:6px}
details.mm > summary::-webkit-details-marker{display:none}
.mm-l{position:absolute; right:0; top:calc(100% + 6px); z-index:40; display:grid; gap:4px; min-width:220px; max-width:min(320px, 86vw); padding:6px; border:1px solid var(--line); border-radius:12px; background:var(--surface); box-shadow:var(--shadow)}
.mm-l .btn{justify-content:flex-start; width:100%; border-color:transparent; background:transparent; text-align:left}
.mm-l .btn:hover{background:var(--surface-2)}
.mm-l .btn.danger{color:var(--bad)}
.gx-acts details.mm .mm-l{right:0}

/* "Sobre esta tela" fechado */
details.sobre{margin:0 0 12px}
details.sobre > summary{display:inline-flex; align-items:center; gap:6px; cursor:pointer; color:var(--ink-2); font-size:13px; font-weight:600; list-style:none}
details.sobre > summary::-webkit-details-marker{display:none}
details.sobre[open] > .note-box{margin-top:8px}

/* quadro individual */
.q-atencao{display:flex; flex-wrap:wrap; align-items:center; gap:6px 10px; padding:10px 14px; border-radius:var(--r-sm); border:1px solid var(--bad-f); background:var(--bad-soft); color:var(--ink); margin-bottom:12px}
.q-atencao > span:first-child{color:var(--bad)}
.q-atencao .lnk{font-weight:700; color:var(--bad)}
.q-atencao .grow{display:flex; flex-wrap:wrap; gap:4px 10px}
.q-prox{display:flex; align-items:center; gap:12px 16px; flex-wrap:wrap; padding:14px 16px; border-radius:var(--r-sm); border:1px solid var(--line); border-left:4px solid var(--brand); background:var(--surface); margin-bottom:14px}
.q-prox .grow{display:grid; gap:2px; min-width:0; flex:1 1 240px}
.q-prox b{font-size:16px}
.q-filtro{margin:-6px 0 12px}
.q-grid{display:grid; grid-template-columns:minmax(0, 1.7fr) minmax(0, 1fr); gap:14px; align-items:start}
@media (max-width:980px){ .q-grid{grid-template-columns:minmax(0, 1fr)} }
.q-col{display:grid; gap:12px; min-width:0; align-content:start; min-height:40px}
.q-grid.edit .q-col{padding:8px; border:2px dashed var(--line-2); border-radius:14px}
.q-sec{font-size:12px; font-weight:800; color:var(--ink-3); letter-spacing:.04em; text-transform:uppercase; margin:2px 4px}
.qb{display:grid; gap:0; border:1px solid var(--line); border-radius:14px; background:var(--surface); min-width:0}
.qb-h{display:flex; align-items:center; gap:6px; padding:6px 8px 6px 4px; min-width:0}
.qb-tog{display:flex; align-items:center; gap:8px; flex:1; min-width:0; padding:8px 8px; border:0; background:transparent; color:var(--ink); font:inherit; font-size:15px; text-align:left; cursor:pointer; border-radius:10px}
.qb-tog:hover{background:var(--surface-2)}
.qb-tog b{min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.qb-tog::after{content:''; width:7px; height:7px; border-right:2px solid var(--ink-3); border-bottom:2px solid var(--ink-3); transform:rotate(45deg); margin-left:auto; flex:none}
.qb.rec .qb-tog::after{transform:rotate(-45deg)}
.qb-n{flex:none; min-width:24px; height:22px; padding:0 7px; border-radius:999px; display:inline-grid; place-items:center; font-size:12px; font-weight:800; background:var(--surface-2); color:var(--ink-2); font-variant-numeric:tabular-nums}
.qb-n[data-s="warn"]{background:var(--warn-soft); color:var(--warn)}
.qb-n[data-s="bad"]{background:var(--bad-soft); color:var(--bad)}
.qb-n[data-s="ok"]{background:var(--ok-soft); color:var(--ok)}
.qb-ver{flex:none; font-size:13px}
.qb-b{display:grid; gap:8px; padding:0 12px 12px; min-width:0}
.qb.rec .qb-b{display:none}
.qb-res{margin:0; color:var(--ink-2); font-size:13px}
.qb .gx-list.compacta .gx-row{padding:8px 10px}
.gx-list.compacta{gap:6px}
.gx-list.compacta .gx-row{padding:9px 12px}
.qb.edit{border-style:dashed; border-color:var(--brand); cursor:grab}
.qb.edit.arrastando{opacity:.5}
.qb.edit.alvo{box-shadow:0 0 0 3px var(--brand)}
.qb-ed{display:flex; flex-wrap:wrap; align-items:center; gap:6px; padding:8px 10px; border-bottom:1px solid var(--line); background:var(--surface-2); border-radius:14px 14px 0 0}
.qb-alca{display:inline-grid; place-items:center; width:28px; height:28px; color:var(--ink-3); cursor:grab}
.q-modo{display:flex; flex-wrap:wrap; align-items:center; gap:10px 14px; padding:12px 14px; border-radius:var(--r-sm); border:2px solid var(--brand); background:var(--brand-soft); margin-bottom:12px}
.q-modo .grow{min-width:0; flex:1 1 260px}
.q-opts{display:grid; grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)); gap:10px; margin-bottom:8px}
.q-opts .fld{min-width:0}
.qcal{display:grid; grid-template-columns:repeat(7, minmax(0, 1fr)); gap:4px}
.qcal-d{display:grid; gap:2px; padding:6px 4px; border-radius:8px; background:var(--surface-2); text-align:center; min-width:0}
.qcal-d small{font-size:11px; color:var(--ink-3); overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.qcal-d b{font-variant-numeric:tabular-nums}
.qcal-d[data-s="warn"]{background:var(--warn-soft)}
.qcal-d[data-s="idle"] b{color:var(--brand)}

/* peça: seções secundárias fechadas */
.pc-det{border:1px solid var(--line); border-radius:14px; background:var(--surface); min-width:0}
.pc-det > summary{list-style:none; cursor:pointer; padding:12px 14px; display:flex; align-items:center; gap:8px; min-height:44px}
.pc-det > summary::-webkit-details-marker{display:none}
.pc-det > summary::after{content:''; width:7px; height:7px; border-right:2px solid var(--ink-3); border-bottom:2px solid var(--ink-3); transform:rotate(-45deg); margin-left:auto}
.pc-det[open] > summary::after{transform:rotate(45deg)}
.pc-det > .pc-sec{border:0; padding-top:0; background:transparent}
.pc-sync{display:block}
.pub-canais{display:flex; flex-wrap:wrap; gap:6px}

/* Como funciona */
.como-top{display:grid; gap:10px; margin-bottom:14px}
.como-busca{font-size:16px; min-height:48px}
.como-cats{display:grid; gap:8px}
.como-cat{border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface); margin-top:8px}
.como-cat > summary{display:flex; align-items:center; gap:10px; padding:12px 14px; cursor:pointer; list-style:none; min-height:44px}
.como-cat > summary::-webkit-details-marker{display:none}
.como-cat > summary small{margin-left:auto; color:var(--ink-3)}
.como-cat[open] > :not(summary){margin:0 10px 10px}
.guia{list-style:none; counter-reset:gp; display:grid; gap:12px; padding:0; margin:12px 0 0}
.guia-pt{counter-increment:gp; display:grid; gap:4px; padding-left:36px; position:relative}
.guia-pt::before{content:counter(gp); position:absolute; left:0; top:0; width:26px; height:26px; border-radius:50%; display:grid; place-items:center; background:var(--brand-soft); color:var(--brand); font-weight:800; font-size:13px}
.guia-pt p{margin:0; color:var(--ink-2); max-width:68ch}
.guia-passos{margin:0; padding-left:20px; display:grid; gap:4px; color:var(--ink-2); max-width:68ch}
.guia-ex{margin-top:14px; padding:12px 14px; border-radius:var(--r-sm); border:1px dashed var(--line-2); background:var(--surface-2)}
.guia-ex p{margin:4px 0 0}
.guia-meta{margin:0 0 8px}

/* tours */
.tour-b{position:fixed; z-index:1000; display:grid; gap:6px; padding:14px 16px; border-radius:14px; border:1px solid var(--brand); background:var(--surface); color:var(--ink); box-shadow:0 14px 40px rgba(0,0,0,.28); outline:none}
.tour-b p{margin:0; color:var(--ink-2)}
.tour-ctl{display:flex; flex-wrap:wrap; gap:6px; margin-top:4px}
.tour-nunca{justify-self:start; font-size:12.5px}
.tour-alvo{position:relative; z-index:999; outline:3px solid var(--brand) !important; outline-offset:3px; border-radius:10px}
.tour-oferta{display:flex; flex-wrap:wrap; align-items:center; gap:8px 12px; padding:10px 14px; border-radius:var(--r-sm); border:1px solid var(--line); background:var(--surface-2); margin-bottom:12px; font-size:14px}
.tour-oferta > span:first-child{color:var(--brand)}

/* esteira */
.est-fmt{margin:12px 0}
.est-macros{display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:8px}
.est-tile{position:relative; display:grid; border:1px solid var(--line); border-radius:12px; background:var(--surface); border-top:4px solid var(--idle-f); min-width:0}
.est-tile[data-s="ok"]{border-top-color:var(--ok-f)} .est-tile[data-s="warn"]{border-top-color:var(--warn-f)} .est-tile[data-s="bad"]{border-top-color:var(--bad-f)}
.est-tile[data-s="vazio"]{opacity:.7}
.est-tile.on{box-shadow:0 0 0 2px var(--brand)}
.est-tb{display:grid; gap:2px; padding:10px 34px 10px 12px; border:0; background:transparent; color:var(--ink); font:inherit; text-align:left; cursor:pointer; min-height:72px; border-radius:12px}
.est-tb:hover{background:var(--surface-2)}
.est-n{font-size:22px; font-weight:800; font-variant-numeric:tabular-nums}
.est-tb b{font-size:13.5px}
.est-tb small{color:var(--ink-3); font-size:12px}
.est-tile[data-s="bad"] .est-tb small{color:var(--bad); font-weight:700}
.est-q{position:absolute; top:6px; right:6px}
.est-sync{margin:10px 0}
.est-lista{display:grid; gap:10px; margin-top:6px}
@media (max-width:420px){ .est-macros{grid-template-columns:repeat(2, minmax(0, 1fr))} .qb-ed .btn{padding:0 8px} }
.pc-sec > *, .qb-b > *, .como-cat > *{min-width:0}
@media (max-width:760px){ .qb-ed .btn, .qb-ed .icon-btn{min-height:44px} .q-modo .btn, .tour-ctl .btn{min-height:44px} }
/* pontos */
.pt-formula{display:grid; gap:4px; padding:14px 16px; border-radius:var(--r-sm); border:1px solid var(--line); border-left:4px solid var(--brand); background:var(--surface); margin-bottom:12px}
.pt-formula span{color:var(--ink-2)}
.pt-top{display:grid; gap:10px; margin:6px 0 12px}
.pt-card{border:1px solid var(--line); border-radius:var(--r-sm); background:var(--surface); margin-top:8px; min-width:0}
.pt-card > summary{display:flex; flex-wrap:wrap; align-items:center; gap:8px 10px; padding:12px 14px; cursor:pointer; list-style:none; min-height:48px}
.pt-card > summary::-webkit-details-marker{display:none}
.pt-ic{display:inline-grid; place-items:center; width:28px; height:28px; border-radius:8px; background:var(--ok-soft); color:var(--ok); flex:none}
.pt-card[data-g="perder"] .pt-ic{background:var(--bad-soft); color:var(--bad)}
.pt-meu .pt-ic{background:var(--brand-soft); color:var(--brand)}
.pt-vale{margin-left:auto; color:var(--ink-2); font-size:13.5px; font-weight:600}
.pt-body{display:grid; gap:10px; padding:0 14px 14px; min-width:0}
.pt-body > *{min-width:0}
.pt-body h4{margin:6px 0 0; font-size:14px}
.pt-body p{margin:0; color:var(--ink-2); max-width:72ch}
.pt-cen td:first-child{width:55%}
.pt-cen td{white-space:normal; text-align:left}
.pt-req{margin-top:14px; padding:12px 14px; border-radius:var(--r-sm); border:1px dashed var(--line-2)}
.pt-sim{display:grid; grid-template-columns:repeat(auto-fill, minmax(180px, 1fr)); gap:10px}
.pt-sim-res{margin-top:12px}

/* ===================================================================
   v7: linguagem visual inspirada em Liquid Glass
   Vidro só na camada de navegação e controles (menu lateral, barra superior,
   barra de baixo, menus, painéis sobrepostos, balões e avisos).
   Conteúdo, tarefas, formulários e números ficam em superfícies estáveis.
   Modo "menos transparência" troca todo vidro por superfície sólida.
   =================================================================== */
:root:not(.zz1):not(.zz2){
  /* fundo calmo com profundidade, sem movimento */
  --bg:#060A0B; --surface:#0E1514; --surface-2:#131C1A; --surface-3:#18221F;
  --ink:#EEF5F1; --ink-2:#B6C5BE; --ink-3:#9DADA6;
  --line:#1D2825; --line-2:#2B3834;
  /* vidro: tinta, brilho da borda e sombra */
  --glass-tint:rgba(16,24,22,.84);
  --glass-tint-strong:rgba(16,24,22,.9);
  --glass-hi:rgba(255,255,255,.07);
  --glass-edge:rgba(255,255,255,.10);
  --glass-edge-2:rgba(255,255,255,.05);
  --glass-shadow:0 10px 32px rgba(0,0,0,.38), 0 1px 0 rgba(255,255,255,.05) inset;
  --glass-blur:blur(20px) saturate(150%);
  --ease:cubic-bezier(.2,.7,.2,1);
  --t-fast:140ms; --t-mid:200ms;
  --focus:#7EE2B0;
}
body::before{background:
  radial-gradient(1100px 620px at 8% -12%, rgba(34,197,94,.13), transparent 62%),
  radial-gradient(900px 520px at 104% -6%, rgba(56,189,248,.08), transparent 60%),
  radial-gradient(900px 700px at 60% 118%, rgba(20,184,166,.07), transparent 62%)}

/* ---------- material de vidro ---------- */
.side, .topbar, .bnav, .mm-l, .gs-res, .tour-b, .toast, .tb-salvo-pop{
  background:linear-gradient(180deg, var(--glass-hi), transparent 46%), var(--glass-tint);
  -webkit-backdrop-filter:var(--glass-blur); backdrop-filter:var(--glass-blur);
  border-color:var(--glass-edge);
}
.side{border-right:1px solid var(--glass-edge); box-shadow:1px 0 0 var(--glass-edge-2)}
.topbar{border-bottom:1px solid var(--glass-edge); box-shadow:0 1px 0 var(--glass-edge-2), 0 6px 18px rgba(0,0,0,.18)}
.bnav{border-top:1px solid var(--glass-edge); box-shadow:0 -8px 24px rgba(0,0,0,.28)}
.mm-l, .gs-res{background:linear-gradient(180deg, var(--glass-hi), transparent 50%), var(--glass-tint-strong); border:1px solid var(--glass-edge); box-shadow:var(--glass-shadow); border-radius:14px}
.tour-b{background:linear-gradient(180deg, var(--glass-hi), transparent 50%), var(--glass-tint-strong); border:1px solid rgba(126,226,176,.45); box-shadow:var(--glass-shadow)}
.toast{background:linear-gradient(180deg, var(--glass-hi), transparent 50%), var(--glass-tint-strong); border:1px solid var(--glass-edge); color:var(--ink); box-shadow:var(--glass-shadow)}
/* painéis sobrepostos: moldura de vidro denso; o conteúdo dentro fica estável */
.dlg{background:linear-gradient(180deg, rgba(255,255,255,.05), transparent 120px), rgba(14,21,20,.97); border:1px solid var(--glass-edge); box-shadow:0 24px 70px rgba(0,0,0,.55), 0 1px 0 rgba(255,255,255,.06) inset}
.dlg::backdrop{background:rgba(3,7,6,.55); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px)}
/* nada de vidro sobre vidro: o que fica dentro do vidro não ganha outro vidro */
.side .nav-btn, .side .nav-grp, .topbar .btn, .topbar .icon-btn, .topbar .tb-search{-webkit-backdrop-filter:none; backdrop-filter:none}
.topbar .tb-search{background:rgba(255,255,255,.05); border:1px solid var(--glass-edge-2)}
.topbar .btn:not(.primary), .topbar .icon-btn{background:rgba(255,255,255,.04); border-color:var(--glass-edge-2)}
.side .nav-btn:hover{background:rgba(255,255,255,.06)}
.side .nav-btn[aria-current="page"]{background:rgba(34,197,94,.14); border-color:rgba(74,222,128,.55); color:#F2FFF7}
.nav-grp{border-top-color:var(--glass-edge-2)}

/* ---------- conteúdo: superfícies estáveis, menos bordas ---------- */
.qb, .pc-sec, .pt-card, .como-cat, .est-tile, .q-prox{background:var(--surface); border-color:var(--line)}
.qb{border-radius:16px}
/* dentro de um bloco, as linhas não viram cartões dentro de cartões */
.qb .gx-list{gap:0}
.qb .gx-row{background:transparent; border:0; border-left:3px solid var(--idle-f); border-radius:0; padding:10px 10px 10px 12px}
.qb .gx-row + .gx-row{box-shadow:0 -1px 0 var(--line) inset; border-top:1px solid var(--line)}
.qb .gx-row[data-s="bad"]{border-left-color:var(--bad-f)} .qb .gx-row[data-s="warn"]{border-left-color:var(--warn-f)} .qb .gx-row[data-s="ok"]{border-left-color:var(--ok-f)}
.qb .gx-row[data-s="idle"]{border-left-color:var(--line-2)}
.q-prox{border-left-width:4px; border-left-color:var(--brand); box-shadow:0 1px 0 rgba(255,255,255,.03) inset}
/* hierarquia: título, conteúdo e comandos com espaçamento constante */
.page-h h1, .ph h1, h1.pt{letter-spacing:-.01em}
.qb-h{padding:8px 10px 6px 6px}
.qb-b{padding:0 14px 14px}

/* ---------- uma ação principal: secundárias com menos peso ---------- */
.gx-acts .btn:not(.primary), .inline-row .btn:not(.primary):not(.danger){background:transparent; border-color:var(--line-2)}
.btn.primary{box-shadow:0 1px 0 rgba(255,255,255,.18) inset, 0 4px 14px rgba(34,197,94,.18)}
.btn.danger{color:var(--bad)}

/* ---------- foco visível e alvos confortáveis ---------- */
:focus-visible{outline:2px solid var(--focus); outline-offset:2px; border-radius:8px}
.btn:focus-visible, .chip:focus-visible, .nav-btn:focus-visible, summary:focus-visible{outline:2px solid var(--focus); outline-offset:2px}
@media (pointer:coarse){ .gx-acts .btn, .qb-tog, .est-tb, .pt-card > summary, .como-cat > summary, details.mm > summary{min-height:44px} }

/* ---------- transições curtas que explicam abertura, seleção e estado ---------- */
.btn, .chip, .nav-btn, .qb-tog, .est-tb, .nav-fav, .gx-row{transition:background-color var(--t-fast) var(--ease), border-color var(--t-fast) var(--ease), color var(--t-fast) var(--ease), box-shadow var(--t-fast) var(--ease)}
@keyframes lgIn{from{opacity:0; transform:translateY(6px) scale(.985)} to{opacity:1; transform:none}}
@keyframes lgFade{from{opacity:0} to{opacity:1}}
dialog.dlg[open]{animation:lgIn var(--t-mid) var(--ease)}
.mm[open] > .mm-l, .tour-b, .gs-res:not([hidden]){animation:lgIn var(--t-fast) var(--ease)}
.qb:not(.rec) > .qb-b, .pt-card[open] > .pt-body, .pc-det[open] > .pc-sec, .como-cat[open] > :not(summary), .nav-grp[open] > .nav-li{animation:lgFade var(--t-mid) var(--ease)}
.est-tile.on{box-shadow:0 0 0 2px var(--brand), 0 8px 24px rgba(34,197,94,.12)}

/* ---------- salvamento: salvando, salvo e falha ---------- */
.tb-salvo{display:inline-flex; align-items:center; gap:6px; padding:0 10px; height:32px; border-radius:999px; font-size:12.5px; font-weight:700; color:var(--ink-2); background:rgba(255,255,255,.04); border:1px solid var(--glass-edge-2); white-space:nowrap}
.tb-salvo[data-s="salvando"]{color:var(--warn)}
.tb-salvo[data-s="salvo"]{color:var(--ok)}
.tb-salvo[data-s="falha"]{color:#fff; background:var(--bad-f); border-color:var(--bad-f)}
.tb-salvo[data-s="off"]{color:var(--warn); border-color:var(--warn-f)}
.tb-salvo .dot{width:8px; height:8px; border-radius:50%; background:currentColor}
.tb-salvo[data-s="salvando"] .dot{animation:lgPulse 1s ease-in-out infinite}
@keyframes lgPulse{50%{opacity:.35}}
@media (max-width:760px){ .tb-salvo .tx{display:none} .tb-salvo{padding:0 9px} }

/* ---------- barras fixas não cobrem conteúdo ---------- */
@media (max-width:959px){ .content{padding-bottom:calc(110px + env(safe-area-inset-bottom, 0px))} dialog.dlg .dlg-foot, dialog.dlg footer{padding-bottom:calc(12px + env(safe-area-inset-bottom, 0px))} }
.tour-b{max-height:calc(100vh - 24px); overflow:auto}

/* ---------- texto maior quando a pessoa pede ---------- */
html.lg-texto body{font-size:17px}
html.lg-texto .nav-btn, html.lg-texto .gx-t{font-size:16px}
html.lg-texto .gx-s, html.lg-texto .hint, html.lg-texto small{font-size:14px}

/* ---------- modo com menos transparência (escolha da pessoa ou do sistema) ---------- */
html.lg-solid .side, html.lg-solid .topbar, html.lg-solid .bnav, html.lg-solid .mm-l, html.lg-solid .gs-res, html.lg-solid .tour-b, html.lg-solid .toast, html.lg-solid .dlg{background:var(--surface-2) !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important}
html.lg-solid .side{background:#0B1110 !important}
html.lg-solid .dlg::backdrop{background:rgba(3,7,6,.82); -webkit-backdrop-filter:none; backdrop-filter:none}
html.lg-solid body::before{display:none}
@media (prefers-reduced-transparency: reduce){
  html:not(.lg-vidro) .side, html:not(.lg-vidro) .topbar, html:not(.lg-vidro) .bnav, html:not(.lg-vidro) .mm-l, html:not(.lg-vidro) .gs-res, html:not(.lg-vidro) .tour-b, html:not(.lg-vidro) .toast, html:not(.lg-vidro) .dlg{background:var(--surface-2) !important; -webkit-backdrop-filter:none !important; backdrop-filter:none !important}
}
/* sem suporte a desfoque: superfície sólida, nunca texto sobre transparência fraca */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .side, .topbar, .bnav, .mm-l, .gs-res, .tour-b, .toast, .dlg{background:var(--surface-2)}
}
/* ---------- menos movimento ---------- */
html.lg-calmo *, html.lg-calmo *::before, html.lg-calmo *::after{animation:none !important; transition:none !important; scroll-behavior:auto !important}
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{animation-duration:1ms !important; animation-iteration-count:1 !important; transition-duration:1ms !important; scroll-behavior:auto !important}
}

/* ---------- aparência: painel de preferências ---------- */
.ap-grid{display:grid; gap:10px}
.ap-op{display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:12px; border:1px solid var(--line); background:var(--surface)}
.ap-op .grow{display:grid; gap:2px; min-width:0}
.ap-op small{color:var(--ink-3)}
.sw-l{position:relative; width:46px; height:28px; flex:none}
.sw-l input{position:absolute; inset:0; opacity:0; margin:0; cursor:pointer; z-index:1}
.sw-l span{position:absolute; inset:0; pointer-events:none; border-radius:999px; background:var(--surface-3); border:1px solid var(--line-2); transition:background-color var(--t-fast)}
.sw-l span::after{content:''; position:absolute; top:3px; left:3px; width:20px; height:20px; border-radius:50%; background:#DDE8E2; transition:transform var(--t-fast) var(--ease)}
.sw-l input:checked + span{background:var(--brand); border-color:var(--brand)}
.sw-l input:checked + span::after{transform:translateX(18px); background:#fff}
.sw-l input:focus-visible + span{outline:2px solid var(--focus); outline-offset:2px}

/* ---------- quadro: abas Demandas, Tarefas, Entregas e Futuro ---------- */
.q-abas{display:flex; gap:6px; overflow-x:auto; padding:4px; margin-bottom:12px; border-radius:14px; background:var(--surface); border:1px solid var(--line); scrollbar-width:none}
.q-abas::-webkit-scrollbar{display:none}
.q-aba{display:inline-flex; align-items:center; gap:8px; flex:none; min-height:40px; padding:0 14px; border:0; border-radius:10px; background:transparent; color:var(--ink-2); font:inherit; font-weight:700; cursor:pointer}
.q-aba:hover{background:var(--surface-2); color:var(--ink)}
.q-aba[aria-selected="true"]{background:var(--brand-soft); color:#F2FFF7; box-shadow:0 0 0 1px rgba(74,222,128,.45) inset}
.q-aba-b{display:grid; gap:12px}
.q-vinc{display:flex; flex-wrap:wrap; align-items:center; gap:4px; color:var(--ink-2); font-size:12.5px}
.q-vinc svg{color:var(--brand)}
.q-nova{display:grid; grid-template-columns:minmax(0,1fr) 160px auto auto; gap:8px; align-items:center}
@media (max-width:640px){ .q-nova{grid-template-columns:minmax(0,1fr) 1fr} .q-nova .btn{width:100%} }
.ent-ms{display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:8px; margin:12px 0}
.ent-m{display:grid; gap:2px; text-align:left; padding:12px; border-radius:12px; border:1px solid var(--line); background:var(--surface); color:var(--ink); font:inherit; cursor:pointer}
.ent-m:hover:not([disabled]){border-color:var(--line-2); background:var(--surface-2)}
.ent-m[disabled]{cursor:default; opacity:.75}
.ent-m b{font-size:22px; font-variant-numeric:tabular-nums}
.ent-m span{font-weight:700; font-size:13.5px}
.ent-m small{color:var(--ink-3); font-size:12px}
.fut-g{display:grid; gap:4px; margin:0 10px 10px; padding:8px 10px; border-left:3px solid var(--line-2); min-width:0}
.fut-g[data-s="ok"]{border-left-color:var(--ok-f)} .fut-g[data-s="warn"]{border-left-color:var(--warn-f)}
.pc-etapa-dica{margin:0 0 4px; padding:10px 12px; border-radius:10px; background:var(--brand-soft); color:var(--ink); font-size:14px}
/* estoque: contagens neutras, cor só no estado */
.est-resumo{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:10px}
.est-cnt{display:inline-flex; align-items:baseline; gap:8px; padding:8px 12px; border-radius:12px; border:1px solid var(--line); background:var(--surface); color:var(--ink); font:inherit; cursor:pointer}
.est-cnt b{font-size:18px; font-variant-numeric:tabular-nums}
.est-cnt span{color:var(--ink-2); font-size:13px}
.est-cnt[aria-pressed="true"]{border-color:var(--brand); background:var(--brand-soft)}
.barra-zero{display:inline-block; min-width:18px; color:var(--ink-3); font-size:12px}
.rk-ciclo{margin:0 0 12px; color:var(--ink-2)}
.rk3 td, .rk3 th{white-space:nowrap}
/* treinamento */
.treino-tag{display:grid; gap:2px; padding:10px 12px; margin-bottom:10px; border-radius:12px; border:1px dashed var(--warn-f); background:var(--warn-soft)}
.treino-tag small{color:var(--ink-2)}
.treino-faixa{padding:10px 14px; margin-bottom:12px; border-radius:12px; border:1px dashed var(--warn-f); background:var(--warn-soft); color:var(--ink); font-size:14px}
html.modo-treino .topbar{box-shadow:0 2px 0 var(--warn-f)}
.nav-ap{margin-top:2px}
/* tour com detalhe e progresso */
.tour-dl{display:grid; grid-template-columns:auto minmax(0,1fr); gap:2px 10px; margin:4px 0 0; font-size:13px}
.tour-dl dt{color:var(--ink-3); font-weight:700}
.tour-dl dd{margin:0; color:var(--ink-2)}
.tour-prog{height:8px; border-radius:999px; background:var(--surface-3); overflow:hidden}
.tour-prog i{display:block; height:100%; background:var(--brand); width:0}
.tour-prog i[data-w="0"]{width:0%}
.tour-prog i[data-w="5"]{width:5%}
.tour-prog i[data-w="10"]{width:10%}
.tour-prog i[data-w="15"]{width:15%}
.tour-prog i[data-w="20"]{width:20%}
.tour-prog i[data-w="25"]{width:25%}
.tour-prog i[data-w="30"]{width:30%}
.tour-prog i[data-w="35"]{width:35%}
.tour-prog i[data-w="40"]{width:40%}
.tour-prog i[data-w="45"]{width:45%}
.tour-prog i[data-w="50"]{width:50%}
.tour-prog i[data-w="55"]{width:55%}
.tour-prog i[data-w="60"]{width:60%}
.tour-prog i[data-w="65"]{width:65%}
.tour-prog i[data-w="70"]{width:70%}
.tour-prog i[data-w="75"]{width:75%}
.tour-prog i[data-w="80"]{width:80%}
.tour-prog i[data-w="85"]{width:85%}
.tour-prog i[data-w="90"]{width:90%}
.tour-prog i[data-w="95"]{width:95%}
.tour-prog i[data-w="100"]{width:100%}
.pc-sec > .stack, .stack > *{min-width:0}
.btn{max-width:100%}
@media (max-width:480px){ .inline-row .btn, .gx-acts .btn{white-space:normal; height:auto; min-height:40px; text-align:left; line-height:1.25; padding-top:8px; padding-bottom:8px} }
/* menu lateral: nada vaza da coluna; títulos das áreas em caixa normal */
#navOp > *, #navOp .nav-grp > *{min-width:0}
#navOp .nav-li{width:100%; min-width:0}
#navOp .nav-grp > summary{text-transform:none; letter-spacing:0; font-size:14px; font-weight:700; color:var(--ink-2)}
#navOp .nav-gt{white-space:nowrap; overflow:hidden; text-overflow:ellipsis}
#navOp .nav-grp[open] > summary{color:var(--ink)}
.pc-card .gx-kv{grid-template-columns:1fr; gap:2px 0}
.pc-card .gx-kv dt{margin-top:6px; font-size:12.5px}
.pc-card .gx-kv dd{margin:0}
.pc-card .lnk{display:inline-flex; gap:6px; align-items:center}