/* CRM Jonh FPV: painel no padrão da landing FPV NA PELE (HOVR). Toda cor e fonte sai de tokens.css (var(--...)).
   Black é o padrão; Paper entra com data-tema="claro". Anima sempre, mesmo com "reduzir movimento" (pedido do Jonh).
   Estrutura do kit /ogab (layout inspirado em TailAdmin e shadcn-admin, MIT); código próprio. */

/* ---------- tema claro (Paper): só troca superfícies e texto; o vermelho continua sendo o destaque ---------- */
:root[data-tema="claro"]{
  --fundo:#EEEFF0; --fundo2:#E4E6E7; --card:#FFFFFF; --texto:#0B0B0B; --texto2:#5C615B; --sucesso:#56604F;
  --sombra:0 24px 50px -32px rgba(11,11,11,.35); color-scheme:light;
}
:root{
  --linha:color-mix(in srgb,var(--texto) 11%,transparent);
  --linha2:color-mix(in srgb,var(--texto) 6%,transparent);
  --suave:color-mix(in srgb,var(--texto) 5%,transparent);
  --suave2:color-mix(in srgb,var(--texto) 10%,transparent);
  --acao-suave:color-mix(in srgb,var(--acao) 16%,transparent);
  --alerta:var(--acao);
  --acao-texto:color-mix(in srgb,var(--acao) 70%,var(--texto));
  --sucesso-texto:color-mix(in srgb,var(--sucesso) 80%,var(--texto));
  --erro-texto:color-mix(in srgb,var(--erro) 70%,var(--texto));
  --sombra-elev:0 1px 2px rgb(0 0 0 / .18),0 16px 34px -16px rgb(0 0 0 / .6);
  --lateral:252px; --lateral-mini:76px; --topo:64px;
  /* vidro (escuro) */
  --vidro-bg:linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,.025) 45%,rgba(255,255,255,.05));
  --vidro-luz:linear-gradient(180deg,rgba(255,255,255,.45),rgba(255,255,255,.05) 50%,rgba(255,255,255,.18));
  --vidro-sombra:inset 0 1px 0 rgba(255,255,255,.18),inset 0 0 0 1px rgba(255,255,255,.06),0 30px 60px -30px rgba(0,0,0,.7);
  --ambiente1:rgba(217,4,41,.16); --ambiente2:rgba(158,163,157,.12);
}
:root[data-tema="claro"]{
  --vidro-bg:linear-gradient(135deg,rgba(255,255,255,.82),rgba(255,255,255,.5));
  --vidro-luz:linear-gradient(180deg,#fff,rgba(255,255,255,.2) 50%,rgba(255,255,255,.7));
  --vidro-sombra:inset 0 1px 0 #fff,0 24px 50px -28px rgba(11,11,11,.28);
  --ambiente1:rgba(217,4,41,.08); --ambiente2:rgba(158,163,157,.28);
}

/* ---------- base ---------- */
*,*::before,*::after{box-sizing:border-box}
html,body{margin:0;min-height:100%}
html{-webkit-text-size-adjust:100%}
body{background:var(--fundo);color:var(--texto);font:14px/1.5 var(--f-texto);-webkit-font-smoothing:antialiased;overflow-x:hidden}
/* luz ambiente atrás do vidro + grão de filme */
body::before{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(60vw 50vh at 92% -10%,var(--ambiente1),transparent 70%),radial-gradient(50vw 60vh at -10% 110%,var(--ambiente2),transparent 70%)}
body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:var(--grao);opacity:.05;mix-blend-mode:overlay}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer;border:0;background:none;padding:0}
a{color:inherit}
h1,h2,h3,h4{margin:0;color:var(--texto)}
h1{font-family:var(--f-titulo);text-transform:var(--caixa-titulo);font-weight:400;font-size:clamp(34px,4.6vw,60px);line-height:.95;letter-spacing:.005em}
h2{font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
h3{font-size:13px;font-weight:700}
p,li{text-wrap:pretty}
svg{flex:none}
:focus-visible{outline:2px solid var(--acao);outline-offset:2px}
.mudo{color:var(--texto2)}
.micro{font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--texto2)}
.num{font-variant-numeric:tabular-nums}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
[hidden]{display:none!important}
::selection{background:var(--acao);color:var(--texto-acao)}

/* ponto vermelho "ao vivo" */
.vivo{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--acao);flex:none;animation:pisca 1.2s steps(2) infinite}
@keyframes pisca{50%{opacity:.15}}
.ao-vivo{display:inline-flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--texto)}

/* lente (marca da landing) */
.lente{position:relative;border-radius:50%;border:solid var(--texto);display:grid;place-items:center;flex:none}
.lente i{display:block;border-radius:50%;background:var(--acao)}
.lente-xs{width:32px;height:32px;border-width:3.5px}
.lente-xs i{width:8px;height:8px}
.lente-p{width:64px;height:64px;border-width:6px}
.lente-p i{width:14px;height:14px}
.lente-p::after{content:"";position:absolute;inset:-10px;border-radius:50%;border:1.5px solid transparent;border-top-color:var(--acao);animation:gira 1.6s linear infinite}
@keyframes gira{to{transform:rotate(360deg)}}

/* vidro: preenchimento + blur + borda de luz + sombra + grão */
.vidro{position:relative;isolation:isolate;background:var(--vidro-bg)!important;
  -webkit-backdrop-filter:blur(18px) saturate(115%);backdrop-filter:blur(18px) saturate(115%);box-shadow:var(--vidro-sombra)!important;border-color:transparent!important}
.vidro::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;z-index:-1;background:var(--vidro-luz);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.vidro::after{content:"";position:absolute;inset:0;border-radius:inherit;background:var(--grao);opacity:.05;mix-blend-mode:overlay;pointer-events:none;z-index:-1}

/* entrada em cascata (sem fill no fim: não deixa transform preso nos elementos) */
.entra{animation:entraC .65s var(--ease) backwards;animation-delay:calc(var(--i,0) * 55ms)}
@keyframes entraC{from{opacity:0;transform:translateY(16px)}}

/* ---------- botões, campos, selos ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;padding:0 20px;border-radius:var(--pilula);
  background:var(--acao);color:var(--texto-acao);font-weight:700;font-size:12.5px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;text-decoration:none;
  box-shadow:0 10px 26px -12px color-mix(in srgb,var(--acao) 80%,transparent);transition:filter .2s,transform .2s,box-shadow .2s,background .2s}
.btn:hover{filter:brightness(1.1);transform:translateY(-1px)}
.btn:active{transform:translateY(1px)}
.btn.leve{background:transparent;color:var(--texto);border:1px solid var(--linha);box-shadow:none}
.btn.leve:hover{background:var(--suave);border-color:var(--suave2)}
.btn.fantasma{background:transparent;color:var(--texto2);box-shadow:none}
.btn.fantasma:hover{background:var(--suave);color:var(--texto)}
.btn.perigo{background:color-mix(in srgb,var(--erro) 14%,transparent);color:var(--erro-texto);box-shadow:none}
.btn.p{min-height:34px;padding:0 14px;font-size:11.5px}
.btn[disabled]{opacity:.55;pointer-events:none}
.ico{width:38px;height:38px;display:inline-grid;place-items:center;border-radius:50%;color:var(--texto2);transition:background .2s,color .2s,transform .2s}
.ico:hover{background:var(--suave);color:var(--texto)}
label.campo{display:flex;flex-direction:column;gap:7px;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--texto2)}
input,select,textarea{width:100%;min-height:44px;border:1px solid var(--linha);border-radius:var(--raio-p);padding:10px 14px;background:color-mix(in srgb,var(--fundo) 70%,transparent);
  color:var(--texto);font-size:14px;letter-spacing:0;text-transform:none;font-weight:400;outline:none;transition:border-color .2s,box-shadow .2s}
textarea{min-height:90px;resize:vertical}
input:focus,select:focus,textarea:focus{border-color:var(--acao);box-shadow:0 0 0 3px var(--acao-suave)}
input::placeholder,textarea::placeholder{color:var(--texto2);opacity:1}
input[type=checkbox]{width:18px;height:18px;min-height:0;accent-color:var(--acao);padding:0}
.grade-campos{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.grade-campos .todo{grid-column:1/-1}
.selo{display:inline-flex;align-items:center;gap:6px;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;border-radius:var(--pilula);padding:4px 10px;white-space:nowrap;
  background:var(--suave2);color:var(--texto2)}
.selo::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.selo.ok{background:color-mix(in srgb,var(--sucesso) 18%,transparent);color:var(--sucesso-texto)}
.selo.erro{background:color-mix(in srgb,var(--erro) 14%,transparent);color:var(--erro-texto)}
.selo.acao{background:var(--acao-suave);color:var(--acao-texto)}
.selo.sem-ponto::before{display:none}
.selo.vermelho{background:var(--acao);color:var(--texto-acao)}
.selo.vermelho::before{background:var(--texto-acao)}
.selo.icone::before{display:none}
.av{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-weight:800;font-size:12px;letter-spacing:.04em;background:var(--suave2);color:var(--texto);
  border:1px solid var(--linha);flex:none}
.av.g{width:56px;height:56px;font:400 22px var(--f-titulo);letter-spacing:.02em}

/* ---------- login / primeiro acesso / convite: sempre no centro ---------- */
.porta{min-height:100svh;display:grid;place-items:center;padding:24px 16px}
.porta-caixa{width:min(420px,100%);display:flex;flex-direction:column;align-items:center;gap:22px;text-align:center;animation:entraC .7s var(--ease) backwards}
.porta-logo{display:grid;place-items:center;margin-bottom:6px}
.porta-marca{font:400 14px/1 var(--f-titulo);letter-spacing:.24em;color:var(--texto2)}
.porta h1{font-size:clamp(40px,9vw,56px)}
.porta form{width:100%;border-radius:var(--raio-g);padding:26px;display:flex;flex-direction:column;gap:14px;text-align:left}
.porta form .btn{min-height:48px;margin-top:4px}
.porta .erro-t{color:var(--erro-texto);font-size:13px;min-height:18px;text-align:center}

/* ---------- casca: lateral + topo + conteúdo ---------- */
.casca{min-height:100svh;display:grid;grid-template-columns:var(--lateral) minmax(0,1fr);transition:grid-template-columns .25s var(--ease)}
:root[data-lateral="mini"] .casca{grid-template-columns:var(--lateral-mini) minmax(0,1fr)}
.lateral{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;gap:6px;padding:18px 12px;
  background:color-mix(in srgb,var(--fundo2) 78%,transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);
  border-right:1px solid var(--linha2);overflow-y:auto;overflow-x:hidden}
.marca{display:flex;align-items:center;gap:12px;padding:4px 8px 18px;min-width:0;text-decoration:none}
.marca-nome{font:400 22px/.95 var(--f-titulo);letter-spacing:.02em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.marca-nome small{display:block;font:700 9.5px/1 var(--f-texto);letter-spacing:.32em;color:var(--acao);margin-bottom:4px}
.grupo{display:flex;flex-direction:column;gap:2px;margin-top:10px}
.grupo-nome{padding:6px 14px;font-size:10px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--texto2);white-space:nowrap;opacity:.8}
.item{display:flex;align-items:center;gap:12px;min-height:42px;padding:0 14px;border-radius:var(--pilula);color:var(--texto2);font-weight:600;font-size:13.5px;
  text-decoration:none;white-space:nowrap;position:relative;transition:background .2s,color .2s}
.item:hover{background:var(--suave);color:var(--texto)}
.item.ativo{background:var(--suave2);color:var(--texto)}
.item.ativo::before{content:"";position:absolute;left:4px;top:50%;width:4px;height:4px;margin-top:-2px;border-radius:50%;background:var(--acao);box-shadow:0 0 10px var(--acao)}
.item.ativo svg{color:var(--acao)}
.item .conta{margin-left:auto;font-size:11px;font-weight:800;background:var(--acao);color:var(--texto-acao);border-radius:var(--pilula);padding:1px 8px}
.lateral-pe{margin-top:auto;padding-top:10px}
:root[data-lateral="mini"] .lateral .rotulo,:root[data-lateral="mini"] .marca-nome,:root[data-lateral="mini"] .item .conta{display:none}
:root[data-lateral="mini"] .grupo-nome{font-size:0;padding:0;height:1px;margin:6px 10px;background:var(--linha)}
:root[data-lateral="mini"] .item{justify-content:center;padding:0}
:root[data-lateral="mini"] .marca{justify-content:center;padding-left:0;padding-right:0}
:root[data-lateral="mini"] .recolher svg{transform:rotate(180deg)}

.principal{min-width:0;display:flex;flex-direction:column}
.topo{position:sticky;top:0;z-index:20;height:var(--topo);display:flex;align-items:center;gap:10px;padding:0 28px;
  background:color-mix(in srgb,var(--fundo) 72%,transparent);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--linha2)}
.topo-titulo{display:flex;align-items:center;gap:10px;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;white-space:nowrap;overflow:hidden;min-width:0}
.topo-titulo span:last-child{overflow:hidden;text-overflow:ellipsis}
.busca-bt{margin-left:auto;display:flex;align-items:center;gap:10px;height:40px;width:min(320px,34vw);padding:0 10px 0 14px;border-radius:var(--pilula);
  border:1px solid var(--linha);background:var(--suave);color:var(--texto2);font-size:13px;transition:border-color .2s}
.busca-bt:hover{border-color:var(--suave2)}
.busca-bt span{flex:1;text-align:left}
kbd{font:600 11px var(--f-mono);border:1px solid var(--linha);border-bottom-width:2px;border-radius:6px;padding:1px 6px;color:var(--texto2);background:var(--fundo)}
.eu-bt{display:flex;align-items:center;gap:8px;padding:2px;border-radius:var(--pilula)}
.eu-bt .av{background:var(--acao);color:var(--texto-acao);border-color:transparent}
.menu-eu{position:absolute;right:16px;top:calc(var(--topo) - 4px);width:250px;background:var(--card);border:1px solid var(--linha);border-radius:var(--raio-g);
  box-shadow:var(--sombra);padding:8px;z-index:40;animation:entraC .25s var(--ease)}
.menu-eu .cab{padding:8px 10px 10px;border-bottom:1px solid var(--linha2);margin-bottom:6px}
.menu-eu .cab b{display:block}
.menu-eu button{width:100%;display:flex;align-items:center;gap:10px;padding:10px;border-radius:var(--raio-p);color:var(--texto2);font-weight:600}
.menu-eu button:hover{background:var(--suave);color:var(--texto)}

.conteudo{width:100%;max-width:1320px;margin:0 auto;padding:34px 28px 56px;display:flex;flex-direction:column;gap:24px}
.cabeca{display:flex;align-items:flex-end;gap:16px;flex-wrap:wrap;padding-bottom:6px}
.cabeca>div:first-child{flex:1;min-width:220px;display:flex;flex-direction:column;gap:10px}
.cabeca>div:first-child>p{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:13px}
.cabeca .acoes{display:flex;gap:8px;flex-wrap:wrap}

/* ---------- cartões, KPIs ---------- */
.cartao{background:color-mix(in srgb,var(--card) 80%,transparent);border:1px solid var(--linha);border-radius:var(--raio-g);padding:22px;min-width:0;box-shadow:var(--sombra)}
.cartao-cab{display:flex;align-items:center;gap:10px;margin-bottom:18px;flex-wrap:wrap}
.cartao-cab h2{flex:1}
.kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.kpi{background:color-mix(in srgb,var(--card) 80%,transparent);border:1px solid var(--linha);border-radius:var(--raio-g);padding:20px;display:flex;flex-direction:column;gap:12px;min-width:0;box-shadow:var(--sombra);overflow:hidden}
.kpi-topo{display:flex;align-items:center;gap:10px;color:var(--texto2);font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase}
.kpi-topo .bolha{width:30px;height:30px;border-radius:50%;display:grid;place-items:center;background:var(--suave2);color:var(--texto)}
.kpi b{font:400 clamp(34px,3.8vw,56px)/.95 var(--f-titulo);letter-spacing:.01em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi small{font-size:12px;color:var(--texto2)}
.kpi small .sobe{color:var(--sucesso-texto);font-weight:700}
.kpi small .desce{color:var(--erro-texto);font-weight:700}
.kpi.destaque{background:var(--acao);border-color:transparent;box-shadow:0 30px 60px -28px color-mix(in srgb,var(--acao) 70%,transparent)}
.kpi.destaque,.kpi.destaque *{color:var(--texto-acao)}
.kpi.destaque .bolha{background:color-mix(in srgb,var(--texto-acao) 16%,transparent)}
.kpi.alerta{border-color:color-mix(in srgb,var(--erro) 50%,var(--linha))}
.kpi.alerta b,.kpi.alerta .bolha{color:var(--erro-texto)}
.kpi.alerta .bolha{background:color-mix(in srgb,var(--erro) 12%,transparent)}
.kpi .suf{font-size:.5em;margin-left:2px;color:var(--texto2)}
.kpi.destaque .suf{color:inherit;opacity:.8}
.grade-2{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:14px}
.grade-2.igual{grid-template-columns:repeat(2,minmax(0,1fr))}

/* ---------- gráficos sem biblioteca ---------- */
.barras{display:flex;align-items:flex-end;gap:4px;height:170px;padding-top:8px}
.barras .b{flex:1;height:100%;display:flex;align-items:flex-end;position:relative}
.barras .b i{display:block;width:100%;min-height:3px;border-radius:4px 4px 1px 1px;background:color-mix(in srgb,var(--texto2) 45%,transparent);transition:background .2s;
  transform-origin:bottom;animation:sobeB .9s var(--ease) backwards;animation-delay:calc(var(--i,0) * 18ms + 150ms)}
@keyframes sobeB{from{transform:scaleY(0)}}
.barras .b.hoje i,.barras .b:hover i{background:var(--acao)}
.barras .b:hover::after,.ret .rb:hover::after{content:attr(data-t);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);white-space:nowrap;
  background:var(--texto);color:var(--fundo);padding:4px 9px;border-radius:var(--pilula);font-size:11.5px;font-weight:700;z-index:3;pointer-events:none}
.eixo{display:flex;justify-content:space-between;margin-top:10px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--texto2)}
.duplas{display:flex;align-items:flex-end;gap:14px;height:190px}
.duplas .g{flex:1;display:flex;flex-direction:column;align-items:center;gap:8px;height:100%;min-width:0}
.duplas .par{flex:1;width:100%;display:flex;align-items:flex-end;justify-content:center;gap:4px}
.duplas .par i{width:min(18px,40%);min-height:3px;border-radius:4px 4px 1px 1px;position:relative;transform-origin:bottom;animation:sobeB .9s var(--ease) backwards}
.duplas .par i.e{background:var(--sucesso)}
.duplas .par i.s{background:var(--erro)}
.duplas .par i:hover::after{content:attr(data-t);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translateX(-50%);white-space:nowrap;
  background:var(--texto);color:var(--fundo);padding:4px 9px;border-radius:var(--pilula);font-size:11.5px;font-weight:700;font-style:normal;z-index:3}
.duplas .g span{font-size:11px;color:var(--texto2);text-transform:uppercase;letter-spacing:.08em}
.legenda{display:flex;gap:14px;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--texto2)}
.legenda i{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:6px;vertical-align:0}
.linha-graf{position:relative;height:190px}
.linha-graf svg{width:100%;height:100%;overflow:visible}
.linha-graf .area{fill:color-mix(in srgb,var(--sucesso) 14%,transparent)}
.linha-graf .traco{fill:none;stroke:var(--sucesso);stroke-width:2.5;vector-effect:non-scaling-stroke;stroke-linejoin:round;stroke-linecap:round}
.linha-graf .traco.s{stroke:var(--erro);stroke-dasharray:5 5;opacity:.9}
.linha-graf .guia{stroke:var(--linha2);stroke-width:1;vector-effect:non-scaling-stroke}
.funil-h{display:flex;flex-direction:column;gap:13px}
.funil-h .l{display:grid;grid-template-columns:minmax(80px,130px) 1fr 40px;gap:12px;align-items:center;font-size:13px}
.funil-h .l>span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--texto2);font-weight:600}
.funil-h .t{height:8px;border-radius:var(--pilula);background:var(--suave2);overflow:hidden}
.funil-h .t i{display:block;height:100%;border-radius:inherit;background:var(--texto);animation:cresceW 1.1s var(--ease) backwards .2s}
.funil-h .l:first-child .t i{background:var(--acao)}
.funil-h b{text-align:right;font:400 18px var(--f-titulo)}
@keyframes cresceW{from{width:0}}

/* ---------- LEADS DO CURSO: funil da jornada ---------- */
.kpis-j .kpi b{font-size:clamp(40px,5vw,72px)}
.funil-j{display:flex;flex-direction:column;gap:16px}
.fj-top{display:flex;align-items:baseline;gap:10px;margin-bottom:8px;min-width:0}
.fj-n{font:400 13px var(--f-titulo);color:var(--texto2);letter-spacing:.06em;flex:none}
.fj-nome{min-width:0;display:flex;flex-direction:column}
.fj-nome b{font-size:13.5px;font-weight:700}
.fj-nome small{font-size:11.5px;color:var(--texto2)}
.fj-v{margin-left:auto;display:flex;align-items:baseline;gap:8px;flex:none}
.fj-v b{font:400 26px/1 var(--f-titulo)}
.fj-v small{font-size:12px;font-weight:700;color:var(--texto2);min-width:44px;text-align:right}
.fj .t{height:10px;border-radius:var(--pilula);background:var(--suave2);overflow:hidden}
.fj .t i{display:block;height:100%;width:var(--w);min-width:4px;border-radius:inherit;background:linear-gradient(90deg,color-mix(in srgb,var(--texto) 45%,transparent),var(--texto));
  animation:cresceW 1.2s var(--ease) backwards;animation-delay:calc(var(--i,0) * 110ms + 250ms)}
.fj.queda .t i{background:linear-gradient(90deg,color-mix(in srgb,var(--acao) 55%,transparent),var(--acao));box-shadow:0 0 18px color-mix(in srgb,var(--acao) 60%,transparent)}
.fj.queda .fj-v b,.fj.queda .fj-n{color:var(--acao)}
.fj .selo{font-size:10px;padding:3px 9px;align-self:flex-start;margin-top:6px}
.dica-j{font-size:12px;color:var(--texto2);margin:16px 0 0;padding-top:14px;border-top:1px solid var(--linha2)}

/* retenção por aula */
.ret{display:grid;grid-template-columns:repeat(11,minmax(0,1fr));gap:6px;height:170px;align-items:stretch}
.ret .rb{display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0;position:relative}
.ret .rv{font:400 13px/1 var(--f-titulo);color:var(--texto)}
.ret .rt{flex:1;width:100%;display:flex;align-items:flex-end;border-radius:4px;background:var(--suave)}
.ret .rt i{display:block;width:100%;height:var(--h);min-height:2px;border-radius:4px 4px 1px 1px;background:color-mix(in srgb,var(--texto2) 70%,transparent);
  transform-origin:bottom;animation:sobeB .9s var(--ease) backwards;animation-delay:calc(var(--i,0) * 50ms + 200ms)}
.ret .rb:hover .rt i{background:var(--acao)}
.ret .rb.fim .rt i{background:var(--acao)}
.ret .rl{font-size:10.5px;font-weight:700;color:var(--texto2);letter-spacing:.04em}

/* pílulas de filtro */
.pilulas{display:flex;gap:8px;flex-wrap:wrap}
.pilulas button{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:0 14px;border-radius:var(--pilula);border:1px solid var(--linha);
  font-size:12px;font-weight:700;letter-spacing:.04em;color:var(--texto2);transition:background .2s,color .2s,border-color .2s}
.pilulas button:hover{color:var(--texto);border-color:var(--suave2)}
.pilulas button .n{font-size:11px;padding:1px 7px;border-radius:var(--pilula);background:var(--suave2);color:var(--texto)}
.pilulas button.ativo{background:var(--texto);color:var(--fundo);border-color:var(--texto)}
.pilulas button.ativo .n{background:var(--acao);color:var(--texto-acao)}

/* lista de leads */
.leads-ferr{display:flex;flex-direction:column;gap:12px;margin-bottom:6px}
.legenda-j{display:flex;gap:16px;flex-wrap:wrap;align-items:center;font-size:11.5px;color:var(--texto2)}
.legenda-j span{display:inline-flex;align-items:center;gap:6px}
.legenda-j .bl{width:12px;height:12px;border-radius:50%;border:1.5px solid var(--linha);display:inline-block}
.legenda-j .bl.on{background:var(--acao);border-color:var(--acao)}
.lista-leads{display:flex;flex-direction:column}
.lead{display:grid;grid-template-columns:minmax(190px,1.3fr) minmax(150px,.8fr) minmax(250px,1.5fr) minmax(130px,.8fr) 120px;gap:18px;align-items:center;
  padding:14px 12px;margin:0 -12px;border-radius:var(--raio);border-bottom:1px solid var(--linha2);cursor:pointer;transition:background .2s}
.lead:last-child{border-bottom:0}
.lead:hover{background:var(--suave)}
.lead .quem b{font-size:14px}
.zap{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;text-decoration:none;color:var(--texto);padding:6px 12px 6px 8px;border-radius:var(--pilula);
  border:1px solid var(--linha);white-space:nowrap;transition:background .2s,border-color .2s,color .2s;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.zap svg{color:var(--sucesso)}
.zap:hover{background:var(--texto);color:var(--fundo);border-color:var(--texto)}
.zap:hover svg{color:var(--fundo)}
.lead-fim{display:flex;flex-direction:column;align-items:flex-end;gap:6px;font-size:12px;text-align:right}
.lead-fim .quando{color:var(--texto2);white-space:nowrap}
.lead-aulas small{display:block;font-size:11.5px;color:var(--texto2);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mais-leads{display:flex;justify-content:center;padding-top:14px}

/* 4 checks da jornada ligados por uma linha */
.checks{list-style:none;margin:0;padding:0;display:flex}
.ck{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;position:relative;min-width:0;text-align:center}
.ck+.ck::before{content:"";position:absolute;top:11px;right:50%;width:100%;height:2px;background:var(--linha);z-index:0}
.ck.lig::before{background:var(--acao)}
.ck .bola{position:relative;z-index:1;width:24px;height:24px;border-radius:50%;border:1.5px solid color-mix(in srgb,var(--texto) 25%,transparent);background:var(--fundo);display:grid;place-items:center}
.ck.on .bola{background:var(--acao);border-color:var(--acao);color:var(--texto-acao);box-shadow:0 0 0 4px color-mix(in srgb,var(--acao) 18%,transparent);
  animation:pop .55s var(--ease) backwards;animation-delay:calc(var(--i,0) * 110ms + 250ms)}
.ck .tique{width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.ck .tique path{stroke-dasharray:24;stroke-dashoffset:0;animation:risca .45s var(--ease) both;animation-delay:calc(var(--i,0) * 110ms + 450ms)}
@keyframes pop{0%{transform:scale(.3);opacity:0}60%{transform:scale(1.18)}100%{transform:scale(1)}}
@keyframes risca{from{stroke-dashoffset:24}to{stroke-dashoffset:0}}
.ck-n{font-size:10.5px;font-weight:700;letter-spacing:.04em;color:var(--texto2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.ck.on .ck-n{color:var(--texto)}
.checks.g .ck+.ck::before{top:21px}
.checks.g .bola{width:44px;height:44px;border-width:2px}
.checks.g .tique{width:22px;height:22px}
.checks.g .ck-n{font-size:11px;letter-spacing:.14em;text-transform:uppercase;margin-top:2px}
.checks.g small{font-size:12px;font-weight:700;color:var(--texto)}
.checks.g .ck:not(.on) small{color:var(--texto2);font-weight:500}
.checks.g em{font-style:normal;font-size:10.5px;color:var(--texto2);line-height:1.25}
.quieta *{animation:none!important}

/* barrinha de aulas x/11 */
.aulas-b{display:flex;align-items:center;gap:10px;min-width:0}
.aulas-b .t{flex:1;height:6px;border-radius:var(--pilula);background:var(--suave2);overflow:hidden;min-width:50px}
.aulas-b .t i{display:block;height:100%;width:var(--w);border-radius:inherit;background:var(--texto);animation:cresceW 1s var(--ease) backwards .35s}
.aulas-b.cheio .t i{background:var(--acao)}
.aulas-b b{font:400 15px/1 var(--f-titulo);letter-spacing:.04em;white-space:nowrap}

/* ficha: bloco da jornada */
.ficha-jornada{border-radius:var(--raio-g);padding:18px 16px;display:flex;flex-direction:column;gap:16px}
.fj-cab{display:flex;align-items:center;gap:10px;justify-content:space-between;flex-wrap:wrap}
.fj-aulas{display:flex;flex-direction:column;gap:8px;padding-top:14px;border-top:1px solid var(--linha2)}
.fj-aulas .aulas-b .t{height:8px}
.fj-aulas .aulas-b b{font-size:20px}

/* ---------- listas e atividades ---------- */
.atividades{display:flex;flex-direction:column}
.atividade{display:flex;gap:12px;padding:11px 0;border-bottom:1px solid var(--linha2);align-items:flex-start}
.atividade:last-child{border-bottom:0}
.atividade .ponto{width:7px;height:7px;border-radius:50%;background:var(--acao);margin-top:7px;flex:none}
.atividade p{margin:0;font-size:13.5px}
.atividade small{color:var(--texto2);font-size:12px}
.linkish{color:var(--texto);font-weight:700;text-decoration:none;cursor:pointer}
.linkish:hover{color:var(--acao-texto)}

/* ---------- barra de ferramentas + tabela ---------- */
.ferramentas{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.ferramentas .busca,.leads-ferr .busca{flex:1;min-width:200px;position:relative;display:block}
.busca svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--texto2);pointer-events:none}
.busca input{padding-left:42px;border-radius:var(--pilula)}
.ferramentas select{width:auto;min-width:160px;border-radius:var(--pilula)}
.abas{display:inline-flex;gap:4px;padding:4px;border-radius:var(--pilula);border:1px solid var(--linha);flex-wrap:wrap}
.abas button{min-height:32px;padding:0 14px;border-radius:var(--pilula);font-weight:700;font-size:12px;letter-spacing:.04em;color:var(--texto2);transition:background .2s,color .2s}
.abas button:hover{color:var(--texto)}
.abas button.ativo{background:var(--texto);color:var(--fundo)}
.abas button.ativo .mudo{color:inherit;opacity:.7}
.tabela{background:color-mix(in srgb,var(--card) 80%,transparent);border:1px solid var(--linha);border-radius:var(--raio-g);overflow:hidden;box-shadow:var(--sombra)}
.tabela table{width:100%;border-collapse:collapse}
.tabela th{text-align:left;font-size:10.5px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--texto2);padding:14px 16px;
  border-bottom:1px solid var(--linha);white-space:nowrap}
.tabela th button{display:inline-flex;align-items:center;gap:4px;font:inherit;letter-spacing:inherit;text-transform:inherit;color:inherit}
.tabela th button:hover{color:var(--texto)}
.tabela th .seta{opacity:.35}
.tabela th.ord .seta{opacity:1;color:var(--acao)}
.tabela td{padding:13px 16px;border-bottom:1px solid var(--linha2);vertical-align:middle;font-size:13.5px}
.tabela tbody tr{cursor:pointer;transition:background .15s}
.tabela tbody tr:hover{background:var(--suave)}
.tabela tbody tr:last-child td{border-bottom:0}
.tabela .direita{text-align:right}
.quem{display:flex;align-items:center;gap:12px;min-width:0}
.quem b{display:block;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.quem small{display:block;color:var(--texto2);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.quem>div{min-width:0}
.rodape-tab{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;font-size:12px;color:var(--texto2);border-top:1px solid var(--linha2)}

/* ---------- estado vazio + skeleton ---------- */
.vazio{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:10px;padding:48px 20px;
  border:1px dashed var(--linha);border-radius:var(--raio-g);color:var(--texto2)}
.vazio .bolha{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;background:var(--acao-suave);color:var(--acao-texto)}
.cartao .vazio{border:0;padding:28px 12px}
.vazio b{color:var(--texto);font:400 22px/1 var(--f-titulo);text-transform:uppercase;letter-spacing:.02em}
.vazio p{margin:0;max-width:380px;font-size:13.5px}
.esq{background:linear-gradient(90deg,var(--suave) 25%,var(--suave2) 50%,var(--suave) 75%);background-size:200% 100%;animation:brilho 1.2s infinite linear;border-radius:var(--raio-g)}
@keyframes brilho{to{background-position:-200% 0}}

/* ---------- kanban ---------- */
.kanban{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(210px,1fr);gap:14px;overflow-x:auto;padding-bottom:12px;align-items:start;
  scroll-snap-type:x proximity;overscroll-behavior-x:contain}
.k-col{background:transparent;border:0;border-top:2px solid var(--linha);border-radius:0;padding:14px 2px;display:flex;flex-direction:column;gap:10px;min-height:300px;
  scroll-snap-align:start;transition:background .2s,border-color .2s}
.k-col:first-child{border-top-color:var(--acao)}
.k-col.k-sobre{border-color:var(--acao);background:var(--acao-suave);border-radius:var(--raio)}
.k-col-cab{display:flex;align-items:center;gap:8px;padding:2px 4px}
.k-col-cab b{flex:1;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.k-col-cab .n{font:400 16px/1 var(--f-titulo);color:var(--texto);padding:0 4px}
.k-col-cab .soma{font-size:11.5px;color:var(--texto2);width:100%;padding-left:2px}
.k-lista{display:flex;flex-direction:column;gap:8px;min-height:60px;flex:1}
.k-card{background:color-mix(in srgb,var(--card) 85%,transparent);border:1px solid var(--linha);border-radius:var(--raio);padding:12px;display:flex;gap:10px;align-items:flex-start;cursor:grab;
  user-select:none;-webkit-user-select:none;box-shadow:0 1px 2px rgba(0,0,0,.1);transition:border-color .2s,transform .2s}
.k-card:hover{border-color:var(--borda2);transform:translateY(-1px)}
.k-card>div{flex:1;min-width:0}
.k-card b{display:block;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k-card small{display:block;font-size:12px;color:var(--texto2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.k-alca{width:30px;height:30px;margin:-4px -4px 0 0;display:grid;place-items:center;border-radius:50%;color:var(--texto2);touch-action:none;cursor:grab}
.k-alca:hover{background:var(--suave)}
.k-origem{opacity:.35}
.k-fantasma{position:fixed;left:0;top:0;z-index:90;pointer-events:none;box-shadow:0 24px 50px -10px rgba(0,0,0,.5);border-color:var(--acao);transform-origin:center;rotate:2deg;cursor:grabbing}
body.arrastando{cursor:grabbing;user-select:none}

/* ---------- tarefas ---------- */
.tarefas{display:flex;flex-direction:column;background:color-mix(in srgb,var(--card) 80%,transparent);border:1px solid var(--linha);border-radius:var(--raio-g);overflow:hidden;box-shadow:var(--sombra)}
.tarefa{display:flex;align-items:center;gap:14px;padding:14px 16px;border-bottom:1px solid var(--linha2);transition:background .2s}
.tarefa:hover{background:var(--suave)}
.tarefa:last-child{border-bottom:0}
.tarefa>div{flex:1;min-width:0}
.tarefa b{display:block;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tarefa small{display:flex;gap:10px;flex-wrap:wrap;color:var(--texto2);font-size:12.5px;margin-top:2px}
.tarefa small .atrasada{color:var(--erro-texto);font-weight:700}
.tarefa.feita b{text-decoration:line-through;color:var(--texto2)}
.check{width:26px;height:26px;border-radius:50%;border:1.5px solid color-mix(in srgb,var(--texto) 28%,transparent);display:grid;place-items:center;color:transparent;flex:none;transition:.2s}
.check:hover{border-color:var(--acao)}
.tarefa.feita .check{background:var(--acao);border-color:var(--acao);color:var(--texto-acao);animation:pop .45s var(--ease)}

/* ---------- agenda ---------- */
.agenda-nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.agenda-nav h2{min-width:180px;text-align:center;font:400 22px/1 var(--f-titulo);letter-spacing:.02em}
.semana{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
.dia{background:color-mix(in srgb,var(--card) 80%,transparent);border:1px solid var(--linha);border-radius:var(--raio);padding:10px;min-height:220px;display:flex;flex-direction:column;gap:6px;min-width:0}
.dia.hoje{border-color:var(--acao);box-shadow:0 0 0 3px var(--acao-suave)}
.dia-cab{display:flex;align-items:baseline;gap:6px;margin-bottom:4px}
.dia-cab span{font-size:10.5px;font-weight:700;text-transform:uppercase;color:var(--texto2);letter-spacing:.14em}
.dia-cab b{font:400 22px/1 var(--f-titulo)}
.dia-cab .ico{margin-left:auto;width:28px;height:28px}
.ev{display:block;width:100%;text-align:left;padding:6px 8px;border-radius:8px;font-size:12.5px;background:var(--acao-suave);border-left:3px solid var(--acao);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ev small{color:var(--texto2);font-size:11.5px;font-weight:700;margin-right:4px}
.ev.tarefa-ev{background:var(--suave2);border-left-color:var(--texto2)}
.ev.feita{opacity:.55;text-decoration:line-through}
.mes{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));border:1px solid var(--linha);border-radius:var(--raio-g);overflow:hidden;background:color-mix(in srgb,var(--card) 80%,transparent)}
.mes .dsem{padding:10px;font-size:10.5px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--texto2);text-align:center;border-bottom:1px solid var(--linha)}
.mes .cel{min-height:104px;padding:6px;border-right:1px solid var(--linha2);border-bottom:1px solid var(--linha2);display:flex;flex-direction:column;gap:3px;min-width:0;text-align:left;cursor:pointer}
.mes .cel:nth-child(7n){border-right:0}
.mes .cel:hover{background:var(--suave)}
.mes .cel.fora{opacity:.4}
.mes .cel .d{font-size:12.5px;font-weight:700;width:24px;height:24px;display:grid;place-items:center;border-radius:50%}
.mes .cel.hoje .d{background:var(--acao);color:var(--texto-acao)}
.mes .cel .ev{font-size:12px;padding:2px 6px}
.mes .mais{font-size:12px;color:var(--texto2);font-weight:700;padding-left:4px}

/* ---------- financeiro ---------- */
.valor-e{color:var(--sucesso-texto);font-weight:700}
.valor-s{color:var(--erro-texto);font-weight:700}

/* ---------- equipe / config ---------- */
.lista-simples{display:flex;flex-direction:column}
.lista-simples>div{display:flex;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--linha2)}
.lista-simples>div:last-child{border-bottom:0}
.lista-simples .quem{flex:1}
.etapa-ed{display:grid;grid-template-columns:28px minmax(0,1fr) 160px auto;gap:8px;align-items:center;padding:6px 0}
.etapa-ed .pos{font:400 18px var(--f-titulo);color:var(--texto2);text-align:center}
.etapa-ed .mv{display:flex;gap:2px}
.pilha{display:flex;flex-direction:column;gap:14px}
.dica{font-size:12.5px;color:var(--texto2);margin:0}
code{font:12.5px var(--f-mono);background:var(--suave);padding:2px 6px;border-radius:6px;word-break:break-all}

/* ---------- dialogs: modal, ficha lateral ---------- */
dialog{color:var(--texto);background:var(--card);border:1px solid var(--linha);padding:0;max-height:calc(100svh - 32px)}
dialog::backdrop{background:rgba(11,11,11,.7);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}
dialog.modal{width:min(520px,calc(100% - 32px));border-radius:var(--raio-g);box-shadow:var(--sombra)}
dialog.modal form{padding:24px;display:flex;flex-direction:column;gap:16px}
dialog.modal .modal-cab{display:flex;align-items:center;gap:10px}
dialog.modal .modal-cab h2{flex:1;font:400 26px/1 var(--f-titulo);letter-spacing:.01em;text-transform:uppercase}
dialog.modal .botoes{display:flex;gap:8px;justify-content:flex-end;flex-wrap:wrap;margin-top:4px}
dialog.modal .botoes .esq-bt{margin-right:auto}
dialog.modal .erro-t{color:var(--erro-texto);font-size:13px;min-height:0}
dialog.modal[open]{animation:sobe .3s var(--ease)}
@keyframes sobe{from{opacity:0;transform:translateY(16px) scale(.98)}}
dialog.ficha{margin:0 0 0 auto;height:100svh;max-height:100svh;width:min(520px,100%);border-radius:var(--raio-g) 0 0 var(--raio-g);border-right:0;
  background:color-mix(in srgb,var(--card) 92%,transparent);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
dialog.ficha[open]{animation:entra .35s var(--ease);display:flex;flex-direction:column}
@keyframes entra{from{transform:translateX(48px);opacity:0}}
.ficha-cab{display:flex;gap:14px;align-items:center;padding:22px 22px 18px;border-bottom:1px solid var(--linha2)}
.ficha-cab>div{flex:1;min-width:0}
.ficha-cab h2{font:400 30px/1 var(--f-titulo);letter-spacing:.01em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ficha-cab .av.g{background:var(--acao);color:var(--texto-acao);border-color:transparent}
.ficha-corpo{flex:1;overflow-y:auto;padding:20px 22px 30px;display:flex;flex-direction:column;gap:22px}
.ficha-corpo>*{flex-shrink:0;animation:entraC .5s var(--ease) backwards}
.ficha-corpo>*:nth-child(2){animation-delay:.05s}.ficha-corpo>*:nth-child(3){animation-delay:.1s}.ficha-corpo>*:nth-child(4){animation-delay:.15s}
.ficha-corpo>*:nth-child(5){animation-delay:.2s}.ficha-corpo>*:nth-child(n+6){animation-delay:.25s}
.ficha-acoes{display:flex;gap:8px;flex-wrap:wrap}
.dados{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:var(--linha2);border:1px solid var(--linha2);border-radius:var(--raio);overflow:hidden}
.dados>div{background:var(--card);padding:11px 13px;min-width:0}
.dados span{display:block;font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.18em;color:var(--texto2);margin-bottom:2px}
.dados b{display:block;font-weight:600;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tempo{position:relative;display:flex;flex-direction:column;gap:14px;padding-left:22px}
.tempo::before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:1px;background:var(--linha)}
.tempo>div{position:relative}
.tempo>div::before{content:"";position:absolute;left:-21px;top:5px;width:11px;height:11px;border-radius:50%;background:var(--card);border:1.5px solid var(--texto2)}
.tempo>div:first-child::before{border-color:var(--acao);background:var(--acao);box-shadow:0 0 0 4px var(--acao-suave)}
.tempo>div.nota::before{border-color:var(--texto);background:var(--texto)}
.tempo p{margin:0;font-size:13.5px;white-space:pre-wrap;word-break:break-word}
.tempo small{color:var(--texto2);font-size:11.5px;letter-spacing:.02em}
.tempo .nota p{background:var(--suave);padding:10px 12px;border-radius:var(--raio-p);margin-top:4px}

/* ---------- paleta ⌘K ---------- */
dialog.paleta{width:min(600px,calc(100% - 32px));margin-top:12vh;border-radius:var(--raio-g);box-shadow:var(--sombra);animation:sobe .25s var(--ease)}
.paleta-busca{display:flex;align-items:center;gap:10px;padding:0 16px;border-bottom:1px solid var(--linha)}
.paleta-busca input{border:0;box-shadow:none;background:transparent;min-height:56px;padding:0;font-size:15px}
.paleta-res{max-height:min(420px,60svh);overflow-y:auto;padding:8px}
.paleta-res .g{padding:8px 10px 4px;font-size:10.5px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--texto2)}
.paleta-res button{width:100%;display:flex;align-items:center;gap:12px;padding:10px;border-radius:var(--raio-p);text-align:left;color:var(--texto2)}
.paleta-res button span{flex:1;color:var(--texto);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.paleta-res button.sel{background:var(--suave2)}
.paleta-res button.sel svg{color:var(--acao)}
.paleta-res .nada{padding:28px;text-align:center;color:var(--texto2)}

/* ---------- toast em pílula ---------- */
.toasts{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;z-index:100;pointer-events:none;width:max-content;max-width:calc(100% - 32px)}
.toast{display:flex;align-items:center;gap:8px;background:var(--texto);color:var(--fundo);font-weight:700;font-size:13px;padding:11px 18px;border-radius:var(--pilula);
  box-shadow:0 14px 40px -10px rgba(0,0,0,.5);animation:toast .3s var(--ease)}
.toast svg{color:var(--acao)}
.toast.erro{background:var(--acao);color:var(--texto-acao)}
.toast.erro svg{color:inherit}
.toast.sai{opacity:0;transform:translateY(8px);transition:.25s}
@keyframes toast{from{opacity:0;transform:translateY(12px) scale(.96)}}

/* ---------- dock do celular + folha "Mais" ---------- */
.dock{display:none}
dialog.folha{margin:auto 0 0;width:100%;max-width:100%;border-radius:var(--raio-g) var(--raio-g) 0 0;border-bottom:0;padding:8px 16px calc(20px + env(safe-area-inset-bottom))}
dialog.folha[open]{animation:folha .3s var(--ease)}
@keyframes folha{from{transform:translateY(40px);opacity:0}}
.folha-alca{width:44px;height:5px;border-radius:5px;background:var(--linha);margin:6px auto 12px}
.folha-grade{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:12px}
.folha-grade a{display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 6px;border-radius:var(--raio);background:var(--suave);text-decoration:none;
  font-size:12px;font-weight:700;color:var(--texto2);text-align:center}
.folha-grade a.ativo{background:var(--suave2);color:var(--texto)}
.folha-grade a.ativo svg{color:var(--acao)}

/* ---------- responsivo ---------- */
@media (max-width:1180px){
  .lead{grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"quem fim" "checks checks" "zap aulas";gap:12px 16px;padding:16px 12px}
  .lead-quem{grid-area:quem;min-width:0}.lead-fim{grid-area:fim}.lead-checks{grid-area:checks}.lead-zap{grid-area:zap;min-width:0}.lead-aulas{grid-area:aulas;min-width:min(200px,45vw)}
  .lead-checks .checks{max-width:520px}
}
@media (max-width:1100px){
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
  .grade-2,.grade-2.igual{grid-template-columns:minmax(0,1fr)}
  .semana{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:900px){
  :root{--lateral:var(--lateral-mini)}
  .lateral .rotulo,.marca-nome,.item .conta,.recolher{display:none}
  .grupo-nome{font-size:0;padding:0;height:1px;margin:6px 10px;background:var(--linha)}
  .item{justify-content:center;padding:0}
  .marca{justify-content:center;padding-left:0;padding-right:0}
}
@media (max-width:760px){
  .casca,:root[data-lateral="mini"] .casca{grid-template-columns:minmax(0,1fr)}
  .lateral{display:none}
  .topo{padding:0 16px;height:58px}
  .busca-bt{width:auto;padding:0 12px}
  .busca-bt span,.busca-bt kbd{display:none}
  .conteudo{padding:22px 16px calc(110px + env(safe-area-inset-bottom));gap:18px}
  h1{font-size:clamp(34px,11vw,48px)}
  .kpis{gap:10px}
  .kpi{padding:15px;gap:8px}
  .kpi-topo{font-size:10px;letter-spacing:.14em}
  .kpi-topo .bolha{display:none}
  .kpi b,.kpis-j .kpi b{font-size:clamp(32px,10vw,44px)}
  .cartao{padding:16px}
  .grade-campos{grid-template-columns:minmax(0,1fr)}
  .cabeca{align-items:stretch}
  .cabeca .acoes{width:100%}
  .cabeca .acoes .btn{flex:1}
  .ferramentas .busca{flex-basis:100%}
  .ferramentas select{flex:1;min-width:0}
  .pilulas{flex-wrap:nowrap;overflow-x:auto;margin:0 -16px;padding:0 16px 4px;scrollbar-width:none}
  .pilulas::-webkit-scrollbar{display:none}
  .pilulas button{flex:none}
  .lead{margin:0;padding:14px;border:1px solid var(--linha2);border-radius:var(--raio);background:var(--suave);grid-template-areas:"quem fim" "checks checks" "aulas aulas" "zap zap"}
  .lista-leads{gap:10px}
  .lead-zap .zap{width:100%;justify-content:center;padding:10px}
  .fj-v b{font-size:22px}
  .ret{gap:3px;height:150px}
  .ret .rv{font-size:11px}
  .kanban{grid-auto-columns:84%;margin:0 -16px;padding:0 16px 12px;scroll-padding:0 16px}
  .tabela th:not(:first-child):not(:last-child),.tabela td:not(:first-child):not(:last-child){display:none}
  .tabela td,.tabela th{padding:12px}
  .tabela table{table-layout:fixed}
  .tabela th:last-child,.tabela td:last-child{width:128px}
  .tabela td:last-child .selo{display:block;overflow:hidden;text-overflow:ellipsis;max-width:100%}
  .tabela td:last-child .selo::before{display:inline-block;margin-right:6px;vertical-align:1px}
  .semana{grid-template-columns:minmax(0,1fr)}
  .dia{min-height:0}
  .mes .cel{min-height:64px;padding:4px}
  .mes .cel .ev{font-size:0;padding:0;height:6px;border-radius:3px;border-left:0}
  .mes .dsem{padding:8px 0;font-size:10px;letter-spacing:.06em}
  .etapa-ed{grid-template-columns:22px minmax(0,1fr) auto}
  .etapa-ed select{grid-column:2/3}
  dialog.ficha{margin:auto 0 0;width:100%;max-width:100%;height:auto;max-height:92svh;border-radius:var(--raio-g) var(--raio-g) 0 0;border-right:1px solid var(--linha);border-bottom:0}
  dialog.ficha[open]{animation:folha .3s var(--ease)}
  .ficha-cab{padding:18px 16px 14px}
  .ficha-cab h2{font-size:26px}
  .ficha-corpo{padding:16px 16px calc(28px + env(safe-area-inset-bottom))}
  .checks.g .bola{width:38px;height:38px}
  .checks.g .ck+.ck::before{top:18px}
  .checks.g .ck-n{font-size:9.5px;letter-spacing:.08em}
  dialog.modal{width:100%;max-width:100%;margin:auto 0 0;border-radius:var(--raio-g) var(--raio-g) 0 0;max-height:92svh}
  dialog.modal form{padding:20px 16px calc(20px + env(safe-area-inset-bottom))}
  .dock{display:flex;position:fixed;left:12px;right:12px;bottom:calc(12px + env(safe-area-inset-bottom));z-index:30;justify-content:space-around;
    background:color-mix(in srgb,var(--card) 70%,transparent);backdrop-filter:blur(20px) saturate(120%);-webkit-backdrop-filter:blur(20px) saturate(120%);
    border:1px solid var(--linha);border-radius:var(--pilula);padding:6px;box-shadow:0 18px 40px -12px rgba(0,0,0,.55)}
  .dock a,.dock button{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:7px 2px;border-radius:var(--pilula);font-size:10.5px;font-weight:700;letter-spacing:.04em;
    color:var(--texto2);text-decoration:none;min-width:0;transition:background .2s,color .2s}
  .dock a.ativo{color:var(--texto);background:var(--suave2)}
  .dock a.ativo svg{color:var(--acao)}
  .toasts{bottom:calc(100px + env(safe-area-inset-bottom))}
}