/* Cogn.IA ERP · v2 "Central"
   Ideia: o ERP com cara de central de operações. Fundo profundo, vidro sobre um campo de sinais,
   e o teal da marca reservado para o que importa (o que é ação, o que mudou, o que está ativo).
   Tipografia do site: Poppins (texto e títulos) + JetBrains Mono (números e valores). */

:root{
  /* tema claro */
  --bg:#EEF3F8;--bg-2:#E3EBF3;--surface:rgba(255,255,255,.78);--surface-solida:#FFFFFF;--field:#F6F9FC;
  --line:rgba(8,24,44,.10);--line-forte:rgba(8,24,44,.18);--fg:#08182C;--fg-2:#4A5F76;--fg-3:#7A8CA0;
  --teal:#1FB6A8;--teal-text:#0C7A70;--teal-soft:rgba(31,182,168,.12);--teal-glow:rgba(31,182,168,.35);
  --blue:#2B6CD4;--wa:#128C4A;--wa-hover:#0E763D;
  --ok:#0C7A70;--ok-soft:rgba(31,182,168,.13);--warn:#9A6200;--warn-soft:rgba(230,159,0,.15);
  --bad:#C0410F;--bad-soft:rgba(213,94,0,.12);--info:#2B6CD4;--info-soft:rgba(43,108,212,.11);
  --e1:#5B6B7E;--e2:#0072B2;--e3:#7A5CC2;--e4:#B07800;--e5:#C4520A;--e6:#0F8F84;--e7:#8A94A3;
  --sombra:0 1px 0 rgba(255,255,255,.7) inset,0 10px 30px -12px rgba(8,24,44,.18);
  --sombra-alta:0 30px 80px -20px rgba(8,24,44,.35);
  --vidro:saturate(160%) blur(18px);
  --aurora-1:rgba(31,182,168,.16);--aurora-2:rgba(43,108,212,.12);--grade-ponto:rgba(8,24,44,.07);
  --c-bg:#06111E;--c-panel:rgba(255,255,255,.05);--c-line:rgba(255,255,255,.08);--c-fg:#E8F0F8;--c-fg2:#8FA6BF;--c-teal:#4FE3D1;
  --sans:"Poppins",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;
  --mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Consolas,monospace;
  --r:16px;--r-s:10px;--side:248px;--ease:cubic-bezier(.2,.8,.2,1);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#050D18;--bg-2:#081525;--surface:rgba(14,32,54,.62);--surface-solida:#0C1C30;--field:rgba(5,13,24,.7);
  --line:rgba(148,190,230,.10);--line-forte:rgba(148,190,230,.18);--fg:#EEF4FA;--fg-2:#9BB0C6;--fg-3:#6A819A;
  --teal-text:#4FE3D1;--teal-soft:rgba(79,227,209,.12);--teal-glow:rgba(79,227,209,.38);--blue:#6FA3FF;
  --ok:#4FE3D1;--ok-soft:rgba(79,227,209,.12);--warn:#FFC25C;--warn-soft:rgba(255,194,92,.12);
  --bad:#FF8466;--bad-soft:rgba(255,132,102,.13);--info:#7FB0FF;--info-soft:rgba(127,176,255,.12);
  --e1:#9AA9BA;--e2:#56B4E9;--e3:#B39DEB;--e4:#F2B544;--e5:#FF8A5C;--e6:#4FE3D1;--e7:#6E7A89;
  --sombra:0 1px 0 rgba(255,255,255,.05) inset,0 20px 40px -20px rgba(0,0,0,.6);
  --sombra-alta:0 40px 100px -20px rgba(0,0,0,.75);
  --aurora-1:rgba(31,182,168,.20);--aurora-2:rgba(43,108,212,.16);--grade-ponto:rgba(148,190,230,.07);
  color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#050D18;--bg-2:#081525;--surface:rgba(14,32,54,.62);--surface-solida:#0C1C30;--field:rgba(5,13,24,.7);
  --line:rgba(148,190,230,.10);--line-forte:rgba(148,190,230,.18);--fg:#EEF4FA;--fg-2:#9BB0C6;--fg-3:#6A819A;
  --teal-text:#4FE3D1;--teal-soft:rgba(79,227,209,.12);--teal-glow:rgba(79,227,209,.38);--blue:#6FA3FF;
  --ok:#4FE3D1;--ok-soft:rgba(79,227,209,.12);--warn:#FFC25C;--warn-soft:rgba(255,194,92,.12);
  --bad:#FF8466;--bad-soft:rgba(255,132,102,.13);--info:#7FB0FF;--info-soft:rgba(127,176,255,.12);
  --e1:#9AA9BA;--e2:#56B4E9;--e3:#B39DEB;--e4:#F2B544;--e5:#FF8A5C;--e6:#4FE3D1;--e7:#6E7A89;
  --sombra:0 1px 0 rgba(255,255,255,.05) inset,0 20px 40px -20px rgba(0,0,0,.6);
  --sombra-alta:0 40px 100px -20px rgba(0,0,0,.75);
  --aurora-1:rgba(31,182,168,.20);--aurora-2:rgba(43,108,212,.16);--grade-ponto:rgba(148,190,230,.07);
  color-scheme:dark}

*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{font-family:var(--sans);font-size:14px;line-height:1.5;color:var(--fg);-webkit-font-smoothing:antialiased;
  background:var(--bg);
  background-image:
    radial-gradient(900px 520px at 85% -8%,var(--aurora-1),transparent 70%),
    radial-gradient(700px 480px at 10% 110%,var(--aurora-2),transparent 70%),
    radial-gradient(circle at 1px 1px,var(--grade-ponto) 1px,transparent 0);
  background-size:auto,auto,22px 22px;background-attachment:fixed}
body.compacto{font-size:13px}
::selection{background:var(--teal-glow);color:var(--fg)}
h1,h2,h3,h4{margin:0;line-height:1.18}
h1{font-size:28px;font-weight:700;letter-spacing:-.035em}
h2{font-size:16px;font-weight:600;letter-spacing:-.015em}
h3{font-size:14px;font-weight:600;letter-spacing:-.01em}
a{color:var(--teal-text);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}
code,.mono,.num{font-family:var(--mono);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.num{font-size:.93em}
.mini{font-size:12px;color:var(--fg-2)}
.fraco{color:var(--fg-3)}
.quebra{word-break:break-all}
.oculto{display:none!important}
.dir{text-align:right}
.espaco-topo{margin-top:16px}
.wm{font-weight:700;letter-spacing:-.03em;white-space:nowrap}
.wm b{color:var(--teal);font-weight:700}
.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--fg-2);font-size:12.5px;font-weight:500}
.eyebrow::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--teal);box-shadow:0 0 0 3px var(--teal-soft),0 0 12px var(--teal-glow)}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px;border-radius:6px}
*::-webkit-scrollbar{width:10px;height:10px}
*::-webkit-scrollbar-thumb{background:var(--line-forte);border-radius:10px;border:3px solid transparent;background-clip:padding-box}
*::-webkit-scrollbar-track{background:transparent}

/* ---------- Botões e campos ---------- */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:9px 16px;border-radius:11px;
  font-weight:600;font-size:13.5px;line-height:1.2;border:1px solid transparent;cursor:pointer;font-family:var(--sans);
  background:transparent;color:var(--fg);white-space:nowrap;text-decoration:none;
  transition:transform .18s var(--ease),background .18s,border-color .18s,box-shadow .25s}
.btn:hover{text-decoration:none}
.btn:active{transform:translateY(1px) scale(.99)}
.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}
.btn-teal{color:#03201C;background:linear-gradient(180deg,#5CEBD9,#1FB6A8);box-shadow:0 1px 0 rgba(255,255,255,.45) inset,0 8px 24px -8px var(--teal-glow)}
.btn-teal:hover{box-shadow:0 1px 0 rgba(255,255,255,.5) inset,0 10px 30px -6px var(--teal-glow)}
.btn-ghost{background:var(--surface);border-color:var(--line-forte);backdrop-filter:var(--vidro);-webkit-backdrop-filter:var(--vidro)}
.btn-ghost:hover{border-color:var(--teal);color:var(--teal-text)}
.btn-wa{background:var(--wa);color:#fff}.btn-wa:hover{background:var(--wa-hover)}
.btn-perigo{border-color:var(--bad-soft);color:var(--bad);background:var(--bad-soft)}
.btn-perigo:hover{border-color:var(--bad)}
.btn-s{padding:6px 11px;font-size:12.5px;border-radius:9px}
.btn-ico{padding:6px 8px;border-radius:9px}
.btn svg{width:16px;height:16px}
input,select,textarea{font-family:var(--sans);font-size:13.5px;color:var(--fg);background:var(--field);border:1px solid var(--line-forte);
  border-radius:var(--r-s);padding:9px 11px;width:100%;outline:none;transition:border-color .15s,box-shadow .2s,background .15s}
input:hover,select:hover,textarea:hover{border-color:var(--fg-3)}
input:focus,select:focus,textarea:focus{border-color:var(--teal);box-shadow:0 0 0 4px var(--teal-soft)}
input:disabled,select:disabled,textarea:disabled{opacity:.7}
select{appearance:none;-webkit-appearance:none;padding-right:32px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%237A8CA0' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 11px center}
select option{background:var(--surface-solida);color:var(--fg)}
textarea{min-height:80px;resize:vertical;line-height:1.5}
input[type=checkbox],input[type=radio]{width:auto;accent-color:var(--teal)}
label{display:flex;flex-direction:column;gap:6px;font-size:12.5px;font-weight:500;color:var(--fg-2)}
label.check{flex-direction:row;align-items:center;gap:8px;font-weight:500;font-size:13px;color:var(--fg);cursor:pointer}
.form-grade{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 16px}
.form-grade.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.form-grade.g4{grid-template-columns:repeat(4,minmax(0,1fr))}
.col-2{grid-column:span 2}.col-3{grid-column:span 3}.col-4{grid-column:1/-1}
.form-grade h2{margin-top:8px}
.checks{display:flex;flex-wrap:wrap;gap:8px 10px}
.checks label.check{padding:7px 12px;border:1px solid var(--line-forte);border-radius:999px;background:var(--field);transition:border-color .15s,background .15s}
.checks label.check:has(input:checked){border-color:var(--teal);background:var(--teal-soft);color:var(--teal-text)}

/* ---------- Estrutura ---------- */
.app{display:grid;grid-template-columns:var(--side) 1fr;min-height:100vh;transition:grid-template-columns .3s var(--ease)}
.app.recolhido{--side:76px}
.lateral{position:sticky;top:0;height:100vh;color:var(--c-fg);display:flex;flex-direction:column;overflow:hidden;
  background:linear-gradient(180deg,#07172A 0%,#050E1A 100%);border-right:1px solid var(--c-line)}
.lateral::before{content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(300px 220px at 20% 0%,rgba(79,227,209,.14),transparent 70%)}
.lateral canvas.sinais{position:absolute;inset:auto 0 0 0;width:100%;height:260px;pointer-events:none;opacity:.9;
  -webkit-mask-image:linear-gradient(180deg,transparent,#000 60%);mask-image:linear-gradient(180deg,transparent,#000 60%)}
.lateral .topo{position:relative;display:flex;align-items:center;justify-content:space-between;padding:20px 16px 16px 18px}
.lateral .logo{font-size:22px;color:var(--c-fg);text-decoration:none}
.logo-sub{font-family:var(--mono);font-size:10.5px;font-weight:600;color:var(--c-fg2);margin-left:8px;padding:2px 6px;border:1px solid var(--c-line);border-radius:6px;letter-spacing:.02em;vertical-align:3px}
.busca-rapida{position:relative;margin:0 12px 10px;display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;
  background:var(--c-panel);border:1px solid var(--c-line);color:var(--c-fg2);font-size:12.5px;cursor:pointer;font-family:var(--sans);text-align:left;transition:border-color .15s,color .15s}
.busca-rapida:hover{border-color:rgba(79,227,209,.35);color:var(--c-fg)}
.busca-rapida svg{width:15px;height:15px;flex:0 0 auto}
.busca-rapida kbd{margin-left:auto;font-family:var(--mono);font-size:10.5px;padding:1px 5px;border:1px solid var(--c-line);border-radius:5px;color:var(--c-fg2)}
.lateral nav{position:relative;display:flex;flex-direction:column;gap:2px;padding:4px 10px;flex:1;overflow-y:auto}
.lateral nav a{position:relative;display:flex;align-items:center;gap:12px;padding:9px 12px;border-radius:10px;color:var(--c-fg2);text-decoration:none;font-weight:500;font-size:13.5px;white-space:nowrap;transition:background .15s,color .15s}
.lateral nav a:hover{background:var(--c-panel);color:var(--c-fg)}
.lateral nav a.ativo{color:var(--c-fg);background:linear-gradient(90deg,rgba(79,227,209,.16),rgba(79,227,209,.02))}
.lateral nav a.ativo::before{content:"";position:absolute;left:-10px;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--c-teal);box-shadow:0 0 14px var(--c-teal)}
.lateral nav a.ativo svg{color:var(--c-teal)}
.lateral nav a svg{width:18px;height:18px;flex:0 0 auto}
.lateral nav .sep{height:1px;background:var(--c-line);margin:10px 8px}
.lateral .pe{position:relative;padding:14px 16px 16px;border-top:1px solid var(--c-line);font-size:11.5px;color:var(--c-fg2);display:flex;flex-direction:column;gap:10px;background:rgba(5,14,26,.6);backdrop-filter:blur(8px)}
.lateral .pe .quem{color:var(--c-fg);font-weight:600;font-size:13px;overflow:hidden;text-overflow:ellipsis}
.lateral .pe .eu{display:flex;align-items:center;gap:10px}
.avatar{width:32px;height:32px;border-radius:10px;flex:0 0 auto;display:grid;place-items:center;font-weight:700;font-size:12.5px;color:#03201C;background:linear-gradient(135deg,#5CEBD9,#2B6CD4)}
.lateral .pe .acoes{display:flex;gap:6px;flex-wrap:wrap}
.lateral .pe button{background:var(--c-panel);border:1px solid var(--c-line);color:var(--c-fg2);border-radius:8px;padding:5px 9px;font-size:11.5px;cursor:pointer;font-family:var(--sans);transition:color .15s,border-color .15s}
.lateral .pe button:hover{color:var(--c-fg);border-color:rgba(79,227,209,.35)}
.lateral .versao{font-family:var(--mono);font-size:10.5px;color:var(--c-fg2);opacity:.7}
.lateral .recolher{background:none;border:0;color:var(--c-fg2);cursor:pointer;padding:6px;border-radius:8px}
.lateral .recolher:hover{background:var(--c-panel);color:var(--c-fg)}
.app.recolhido .lateral nav a span,.app.recolhido .lateral .pe .txt,.app.recolhido .logo-sub,.app.recolhido .busca-rapida span,.app.recolhido .busca-rapida kbd,.app.recolhido .lateral .pe .acoes{display:none}
.app.recolhido .lateral nav a{justify-content:center;padding:10px}
.app.recolhido .lateral .topo{flex-direction:column;gap:10px;padding:18px 8px}
.app.recolhido .busca-rapida{justify-content:center;margin:0 10px 10px}
.app.recolhido .lateral .pe .eu{justify-content:center}
.principal{min-width:0;padding:26px 32px 90px;max-width:1680px;width:100%}
.cabeca{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:22px}
.cabeca .t{display:flex;flex-direction:column;gap:8px}
.cabeca .acoes{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.barra-inf{display:none}

/* entrada de cada tela: um único movimento, curto */
@keyframes surgir{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
#tela.entrou>*{animation:surgir .35s var(--ease) both}

/* ---------- Cartões e KPIs ---------- */
.card{position:relative;background:var(--surface);backdrop-filter:var(--vidro);-webkit-backdrop-filter:var(--vidro);
  border:1px solid var(--line);border-radius:var(--r);padding:18px;box-shadow:var(--sombra);min-width:0}
.card>h2,.card>.ch{margin-bottom:14px}
.ch{display:flex;align-items:center;justify-content:space-between;gap:10px}
.grade{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,minmax(0,1fr))}.g3{grid-template-columns:repeat(3,minmax(0,1fr))}
.g-2-1{grid-template-columns:minmax(0,2fr) minmax(0,1fr)}
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:14px;margin-bottom:16px}
.kpi{position:relative;overflow:hidden;background:var(--surface);backdrop-filter:var(--vidro);-webkit-backdrop-filter:var(--vidro);
  border:1px solid var(--line);border-radius:var(--r);padding:15px 17px 16px;display:flex;flex-direction:column;gap:6px;min-width:0;box-shadow:var(--sombra);
  transition:border-color .2s,transform .2s var(--ease)}
.kpi[data-ir]{cursor:pointer}
.kpi[data-ir]:hover{border-color:var(--teal);transform:translateY(-2px)}
.kpi .r{font-size:12.5px;color:var(--fg-2);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi .v{font-size:25px;font-weight:600;letter-spacing:-.04em;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.1}
.kpi .s{font-size:12px;color:var(--fg-3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.kpi .spark{position:absolute;right:0;bottom:0;width:55%;height:46px;opacity:.55;pointer-events:none}
/* o KPI principal: o único elemento com brilho próprio */
.kpi.destaque{background:linear-gradient(160deg,#0B2A3F 0%,#06182A 60%);border-color:transparent;color:var(--c-fg);isolation:isolate}
.kpi.destaque::before{content:"";position:absolute;inset:-1px;border-radius:inherit;padding:1px;z-index:-1;
  background:conic-gradient(from var(--giro,0deg),rgba(79,227,209,.12),rgba(79,227,209,1),rgba(111,163,255,.7),rgba(79,227,209,.12) 55%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;animation:girar 7s linear infinite}
.kpi.destaque::after{content:"";position:absolute;right:-40px;top:-60px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(79,227,209,.28),transparent 70%);z-index:-1}
.kpi.destaque .r,.kpi.destaque .s{color:var(--c-fg2)}.kpi.destaque .v{color:var(--c-teal);text-shadow:0 0 24px rgba(79,227,209,.35)}
@property --giro{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes girar{to{--giro:360deg}}
.sobe{color:var(--ok)}.desce{color:var(--bad)}

/* ---------- Etiquetas ---------- */
.chip{display:inline-flex;align-items:center;gap:6px;padding:3px 10px;border-radius:999px;font-size:11.5px;font-weight:500;border:1px solid var(--line-forte);color:var(--fg-2);white-space:nowrap;background:transparent}
button.chip{cursor:pointer;font-family:var(--sans);transition:border-color .15s,color .15s,background .15s}
button.chip:hover{border-color:var(--teal);color:var(--teal-text)}
button.chip.on{background:var(--teal-soft);border-color:var(--teal);color:var(--teal-text)}
.chip.ok{background:var(--ok-soft);border-color:transparent;color:var(--ok)}
.chip.warn{background:var(--warn-soft);border-color:transparent;color:var(--warn)}
.chip.bad{background:var(--bad-soft);border-color:transparent;color:var(--bad)}
.chip.info{background:var(--info-soft);border-color:transparent;color:var(--info)}
.chip.teal{background:var(--teal-soft);border-color:transparent;color:var(--teal-text)}
.pt::before{content:"";width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor}
.e-Novo{color:var(--e1)}.e-Em-contato{color:var(--e2)}.e-Qualificado{color:var(--e3)}.e-Proposta-enviada{color:var(--e4)}.e-Negociação{color:var(--e5)}.e-Ganho{color:var(--e6)}.e-Perdido{color:var(--e7)}
.filtros{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}
.filtros input[type=search]{max-width:280px;padding-left:34px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 24 24' fill='none' stroke='%237A8CA0' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:11px center}
.filtros select{width:auto}
.filtros.sem-m{margin:0;flex-wrap:nowrap}.filtros.sem-m>input,.filtros.sem-m>select{flex:1}

/* ---------- Tabelas ---------- */
.tbl-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r);background:var(--surface);backdrop-filter:var(--vidro);-webkit-backdrop-filter:var(--vidro);box-shadow:var(--sombra)}
.card .tbl-wrap{box-shadow:none;background:transparent;backdrop-filter:none}
table{border-collapse:collapse;width:100%}
th,td{padding:11px 14px;text-align:left;border-bottom:1px solid var(--line);vertical-align:middle}
th{font-size:12px;color:var(--fg-3);font-weight:500;white-space:nowrap;position:sticky;top:0;background:var(--surface-solida)}
.card th{background:transparent}
th[data-ord]{cursor:pointer;user-select:none}th[data-ord]:hover{color:var(--fg)}
th[data-dir="asc"]::after{content:" ↑";color:var(--teal-text)}th[data-dir="desc"]::after{content:" ↓";color:var(--teal-text)}
tr:last-child td{border-bottom:0}
tbody tr{transition:background .12s}
tbody tr[data-abrir],tbody tr[data-ir]{cursor:pointer}
tbody tr[data-abrir]:hover td,tbody tr[data-ir]:hover td{background:var(--teal-soft)}
td.d,th.d{text-align:right}
td .sub{font-size:12px;color:var(--fg-3)}
.trunc{max-width:280px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
tfoot td{font-weight:600;border-top:1px solid var(--line-forte)}
.vazio{padding:34px;text-align:center;color:var(--fg-3)}

/* ---------- Kanban ---------- */
.kanban{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(262px,1fr);gap:14px;overflow-x:auto;padding-bottom:10px;height:calc(100vh - 236px);min-height:440px}
.coluna{position:relative;background:color-mix(in srgb,var(--surface) 55%,transparent);border:1px solid var(--line);border-radius:var(--r);display:flex;flex-direction:column;min-height:0;transition:border-color .2s,background .2s}
.coluna::before{content:"";position:absolute;left:16px;right:16px;top:-1px;height:2px;border-radius:2px;background:currentColor;opacity:.8;box-shadow:0 0 12px currentColor}
.coluna .topo-c{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 14px;color:var(--fg)}
.coluna .topo-c h3{font-size:13px;display:flex;gap:8px;align-items:center;white-space:nowrap;overflow:hidden;min-width:0}
.coluna .topo-c .soma{font-size:11.5px;color:var(--fg-3);font-family:var(--mono);white-space:nowrap;flex:0 0 auto}
.coluna .lista{flex:1;overflow-y:auto;padding:0 10px 12px;display:flex;flex-direction:column;gap:9px;min-height:60px}
.coluna.sobre{border-color:var(--teal);background:var(--teal-soft)}
.cardk{position:relative;background:var(--surface-solida);border:1px solid var(--line);border-radius:12px;padding:11px 12px 11px 14px;cursor:pointer;display:flex;flex-direction:column;gap:6px;color:var(--fg);
  box-shadow:0 1px 2px rgba(0,0,0,.06);transition:transform .18s var(--ease),border-color .18s,box-shadow .2s}
.cardk::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:currentColor}
.cardk:hover{transform:translateY(-2px);border-color:var(--line-forte);box-shadow:0 12px 24px -12px rgba(0,0,0,.35)}
.cardk .t1{font-weight:600;font-size:13.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--fg)}
.cardk .t2{font-size:12px;color:var(--fg-2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cardk .linha{display:flex;gap:6px;flex-wrap:wrap;align-items:center;font-size:12px;color:var(--fg-3)}
.cardk.arrastando{opacity:.4;transform:rotate(1.5deg)}
.prog{height:6px;background:var(--line);border-radius:9px;overflow:hidden}
.prog svg{display:block;width:100%;height:6px}
.prog rect{fill:url(#gradProg)}

/* ---------- Modal, gaveta, avisos ---------- */
@keyframes fundoIn{from{opacity:0}to{opacity:1}}
@keyframes gavetaIn{from{transform:translateX(24px);opacity:0}to{transform:none;opacity:1}}
@keyframes modalIn{from{transform:translateY(10px) scale(.98);opacity:0}to{transform:none;opacity:1}}
.fundo{position:fixed;inset:0;background:rgba(2,8,16,.55);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);z-index:50;display:flex;justify-content:flex-end;animation:fundoIn .2s ease both}
.fundo.centro{justify-content:center;align-items:center;padding:16px}
.gaveta{background:var(--bg);background-image:radial-gradient(600px 300px at 100% 0%,var(--aurora-1),transparent 70%);width:min(780px,100%);height:100%;overflow-y:auto;box-shadow:var(--sombra-alta);display:flex;flex-direction:column;border-left:1px solid var(--line-forte);animation:gavetaIn .3s var(--ease) both}
.gaveta.larga{width:min(1180px,100%)}
.gaveta .gtopo{position:sticky;top:0;z-index:2;background:color-mix(in srgb,var(--bg) 80%,transparent);backdrop-filter:var(--vidro);-webkit-backdrop-filter:var(--vidro);border-bottom:1px solid var(--line);padding:16px 20px;display:flex;justify-content:space-between;gap:10px;align-items:center}
.gaveta .gtopo h2{font-size:17px}
.gaveta .gtopo .acoes{display:flex;gap:8px;align-items:center}
.gaveta .gcorpo{padding:20px;display:flex;flex-direction:column;gap:16px}
.modal{background:var(--surface-solida);border:1px solid var(--line-forte);border-radius:20px;width:min(560px,100%);max-height:92vh;overflow-y:auto;padding:22px;box-shadow:var(--sombra-alta);display:flex;flex-direction:column;gap:14px;animation:modalIn .25s var(--ease) both}
.modal .rodape,.gaveta .rodape{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.fechar{background:none;border:0;color:var(--fg-2);font-size:22px;cursor:pointer;line-height:1;padding:4px 9px;border-radius:9px}
.fechar:hover{background:var(--line);color:var(--fg)}
@keyframes toastIn{from{transform:translate(-50%,12px);opacity:0}to{transform:translate(-50%,0);opacity:1}}
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);display:flex;align-items:center;gap:10px;background:rgba(6,17,30,.92);backdrop-filter:blur(12px);color:var(--c-fg);padding:12px 18px;border-radius:12px;z-index:90;
  box-shadow:0 20px 50px -10px rgba(0,0,0,.6),0 0 0 1px rgba(79,227,209,.25);font-size:13.5px;max-width:92vw;animation:toastIn .3s var(--ease) both}
.toast::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--c-teal);box-shadow:0 0 10px var(--c-teal);flex:0 0 auto}
.toast.erro{box-shadow:0 20px 50px -10px rgba(0,0,0,.6),0 0 0 1px rgba(255,132,102,.4)}
.toast.erro::before{background:#FF8466;box-shadow:0 0 10px #FF8466}
.aviso{padding:11px 14px;border-radius:12px;font-size:13px;margin:0;border:1px solid transparent}
.aviso.ok{background:var(--ok-soft);color:var(--ok);border-color:var(--ok-soft)}.aviso.erro{background:var(--bad-soft);color:var(--bad)}.aviso.warn{background:var(--warn-soft);color:var(--warn)}.aviso.info{background:var(--info-soft);color:var(--info)}

/* ---------- Histórico ---------- */
.hist{display:flex;flex-direction:column;gap:2px}
.hist .h{position:relative;border-left:1px solid var(--line-forte);padding:4px 0 10px 16px;font-size:13px;margin-left:4px}
.hist .h::before{content:"";position:absolute;left:-4px;top:9px;width:7px;height:7px;border-radius:50%;background:var(--surface-solida);border:1.5px solid var(--teal)}
.hist .h .q{font-size:11.5px;color:var(--fg-3);margin-bottom:2px}

/* ---------- Cockpit ---------- */
.alertas{display:flex;flex-direction:column;gap:8px}
.alerta{position:relative;display:flex;gap:10px;align-items:flex-start;padding:10px 12px 10px 14px;border-radius:12px;font-size:13px;cursor:pointer;border:1px solid transparent;transition:border-color .15s,transform .15s var(--ease)}
.alerta::before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:3px;border-radius:0 3px 3px 0;background:currentColor}
.alerta:hover{transform:translateX(2px)}
.alerta.bad{background:var(--bad-soft);color:var(--bad)}.alerta.warn{background:var(--warn-soft);color:var(--warn)}.alerta.info{background:var(--info-soft);color:var(--info)}
.alerta span{color:var(--fg)}.alerta b{font-weight:600}
.grafico svg{width:100%;height:auto;display:block;overflow:visible}
.grafico text{font-family:var(--sans);font-size:11px;fill:var(--fg-3)}
.grafico .rot{font-family:var(--mono);font-size:11px;fill:var(--fg)}
.grafico .grade-l{stroke:var(--line);stroke-dasharray:2 4}
.grafico .linha-mrr{fill:none;stroke:var(--teal);stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 4px 10px var(--teal-glow))}
.grafico .area-mrr{fill:url(#gradArea)}
.grafico .ponto{fill:var(--surface-solida);stroke:var(--teal);stroke-width:2}
.grafico .ponto.ultimo{fill:var(--teal)}
.grafico .pulso{fill:var(--teal);opacity:.35;transform-box:fill-box;transform-origin:center;animation:pulsar 2.4s ease-out infinite}
@keyframes pulsar{0%{transform:scale(1);opacity:.45}100%{transform:scale(3.2);opacity:0}}
@keyframes desenhar{from{stroke-dashoffset:var(--comp)}to{stroke-dashoffset:0}}
.grafico .linha-mrr.anima{stroke-dasharray:var(--comp);animation:desenhar 1.2s var(--ease) both}
@keyframes subirArea{from{opacity:0}to{opacity:1}}
.grafico .area-mrr.anima{animation:subirArea 1.2s .3s ease both}
.linha-f{margin-bottom:12px;cursor:pointer}.linha-f .ch{margin-bottom:6px}

/* ---------- Editor de proposta ---------- */
.ed-grade{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:16px;align-items:start}
.resumo{position:sticky;top:20px;display:flex;flex-direction:column;gap:14px}
.resumo .linha{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:13px;padding:2px 0}
.resumo .linha span:first-child{color:var(--fg-2)}
.resumo .total{font-size:30px;font-weight:600;letter-spacing:-.04em;font-family:var(--mono);margin:4px 0 10px}
.resumo .card:first-child{background:linear-gradient(160deg,#0B2A3F,#06182A);color:var(--c-fg);border-color:rgba(79,227,209,.25)}
.resumo .card:first-child .eyebrow{color:var(--c-fg2)}
.resumo .card:first-child .total{color:var(--c-teal);text-shadow:0 0 24px rgba(79,227,209,.3)}
.resumo .card:first-child .linha span:first-child{color:var(--c-fg2)}
.resumo .card:first-child .mini{color:var(--c-fg2)}
.resumo .total .chip{font-size:20px;padding:4px 12px;font-family:var(--mono)}
.itens td input{width:80px;min-width:0;padding:6px 8px;font-size:13px;font-family:var(--mono)}
.itens td.n{min-width:180px}
.add-itens{display:flex;flex-direction:column;gap:6px;max-height:360px;overflow-y:auto}
.add-itens button{display:flex;justify-content:space-between;gap:10px;align-items:center;text-align:left;background:var(--field);border:1px solid var(--line);border-radius:10px;padding:9px 12px;cursor:pointer;color:var(--fg);font-family:var(--sans);font-size:13px;transition:border-color .15s,background .15s}
.add-itens button:hover{border-color:var(--teal)}
.add-itens button.on{border-color:var(--teal);background:var(--teal-soft)}
.abaixo td{background:var(--bad-soft)}

/* ---------- Entrada (login, convite, instalação) ---------- */
.tela-entrada{position:relative;min-height:100vh;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(380px,.85fr);background:#040B15;color:#E8F0F8;overflow:hidden}
.tela-entrada.simples{display:flex;align-items:center;justify-content:center;padding:20px}
.entrada-arte{position:relative;overflow:hidden;border-right:1px solid rgba(255,255,255,.06)}
.entrada-arte canvas{position:absolute;inset:0;width:100%;height:100%}
.entrada-arte .legenda{position:absolute;left:48px;bottom:48px;right:48px;max-width:520px}
.entrada-arte .legenda p{margin:0;font-size:34px;line-height:1.15;font-weight:600;letter-spacing:-.035em;color:#E8F0F8}
.entrada-arte .legenda small{display:block;margin-top:14px;font-size:13.5px;color:#8FA6BF;max-width:420px}
.entrada-arte .contadores{display:flex;gap:28px;margin-top:24px;font-family:var(--mono);font-size:12px;color:#8FA6BF}
.entrada-arte .contadores b{display:block;font-size:22px;color:#E8F0F8;font-weight:600;letter-spacing:-.03em}
.entrada-arte .contadores .sinal b{color:#4FE3D1;text-shadow:0 0 16px rgba(79,227,209,.4)}
.entrada-lado{display:flex;align-items:center;justify-content:center;padding:32px;background:radial-gradient(500px 400px at 50% 0%,rgba(31,182,168,.10),transparent 70%)}
.entrada-card{position:relative;background:var(--surface-solida);color:var(--fg);border-radius:22px;padding:30px;width:min(400px,100%);box-shadow:var(--sombra-alta);display:flex;flex-direction:column;gap:16px;border:1px solid var(--line-forte)}
.entrada-lado .entrada-card{background:rgba(12,28,48,.7);backdrop-filter:blur(20px);color:#EEF4FA;border-color:rgba(148,190,230,.14);
  --fg:#EEF4FA;--fg-2:#9BB0C6;--fg-3:#6A819A;--field:rgba(5,13,24,.7);--line-forte:rgba(148,190,230,.18);--line:rgba(148,190,230,.10);--teal-text:#4FE3D1;--surface:rgba(255,255,255,.04);--surface-solida:#0C1C30;color-scheme:dark}
.entrada-card.largo{width:min(720px,100%)}
.entrada-card h2{font-size:20px;letter-spacing:-.03em}
.logo-grande{font-size:30px}
.entrada-card .logo-sub{color:var(--fg-2);border-color:var(--line-forte)}
.entrada-card .rodape-e{font-size:11.5px;color:var(--fg-3);display:flex;justify-content:space-between}
@media (max-width:900px){
  .tela-entrada{grid-template-columns:1fr}
  .entrada-arte{position:absolute;inset:0;border:0;opacity:.6}
  .entrada-arte .legenda{display:none}
  .entrada-lado{position:relative;min-height:100vh;background:transparent}
}

/* ---------- Busca rápida (Ctrl+K) ---------- */
.paleta{width:min(640px,100%);background:var(--surface-solida);border:1px solid var(--line-forte);border-radius:18px;box-shadow:var(--sombra-alta);overflow:hidden;animation:modalIn .2s var(--ease) both;align-self:flex-start;margin-top:12vh}
.paleta input{border:0;border-bottom:1px solid var(--line);border-radius:0;padding:18px 20px 18px 50px;font-size:16px;background-color:transparent;box-shadow:none!important;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none' stroke='%231FB6A8' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-3.5-3.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:19px center}
.paleta .res{max-height:52vh;overflow-y:auto;padding:8px}
.paleta .grupo{font-size:11.5px;color:var(--fg-3);padding:10px 12px 4px}
.paleta .it{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:10px;cursor:pointer;color:var(--fg)}
.paleta .it svg{width:17px;height:17px;color:var(--fg-3);flex:0 0 auto}
.paleta .it .tt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.paleta .it .sub{font-size:12px;color:var(--fg-3);font-family:var(--mono)}
.paleta .it.sel{background:var(--teal-soft)}
.paleta .it.sel svg{color:var(--teal-text)}
.paleta .dica{display:flex;gap:14px;padding:10px 16px;border-top:1px solid var(--line);font-size:11.5px;color:var(--fg-3)}
.paleta kbd{font-family:var(--mono);font-size:10.5px;padding:1px 5px;border:1px solid var(--line-forte);border-radius:5px}

/* ---------- Esqueleto de carregamento ---------- */
@keyframes brilho{to{background-position:-200% 0}}
.esqueleto{border-radius:12px;background:linear-gradient(90deg,var(--line) 0%,var(--line-forte) 50%,var(--line) 100%);background-size:200% 100%;animation:brilho 1.4s linear infinite}

/* ---------- Documento da proposta (sempre claro, para imprimir) ---------- */
.doc{background:#fff;color:#08182C;max-width:820px;margin:0 auto;padding:44px 48px;border-radius:16px;box-shadow:var(--sombra-alta);font-size:13px;color-scheme:light}
.doc .dtopo{display:flex;justify-content:space-between;align-items:flex-start;padding-bottom:18px;margin-bottom:22px;border-bottom:1px solid #D2DEE9;position:relative}
.doc .dtopo::after{content:"";position:absolute;left:0;bottom:-1px;width:120px;height:2px;background:linear-gradient(90deg,#1FB6A8,#2B6CD4)}
.doc .dtopo .wm{font-size:28px}
.doc h1{font-size:24px;margin:6px 0;letter-spacing:-.03em}
.doc h2{font-size:13px;margin:22px 0 8px;color:#0C7A70;font-weight:600}
.doc table th{background:#F1F5F9;color:#4A5F76;position:static}
.doc table td,.doc table th{border-bottom:1px solid #E1E8F0;padding:8px 10px}
.doc .num{font-family:var(--mono)}
.doc .cartoes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}
.doc .cartoes div{border:1px solid #D2DEE9;border-radius:12px;padding:12px 14px}
.doc .cartoes b{display:block;font-size:20px;letter-spacing:-.03em;font-family:var(--mono);font-weight:600}
.doc .cartoes span{font-size:11.5px;color:#4A5F76}
.doc .cartoes .verde{background:linear-gradient(160deg,#0B2A3F,#06182A);color:#E8F0F8;border-color:#06182A}.doc .cartoes .verde b{color:#4FE3D1}.doc .cartoes .verde span{color:#9FB6CF}
.doc .cond{white-space:pre-line;color:#4A5F76}
.doc .mini{color:#4A5F76}
.doc .ass{margin-top:26px;border:1px solid #D2DEE9;border-radius:12px;padding:12px;font-size:12px;color:#4A5F76}
.doc .drodape{margin-top:28px;padding-top:12px;border-top:1px solid #D2DEE9;font-size:11px;color:#4A5F76;display:flex;justify-content:space-between;gap:12px}
.assinatura{border:1.5px dashed var(--line-forte);border-radius:12px;background:#fff;touch-action:none;width:100%;height:170px;display:block}
.pagina-aceite{background:var(--bg)}
.aceite-wrap{max-width:860px;margin:0 auto;padding:24px 14px 60px;display:flex;flex-direction:column;gap:16px}
.aceite-wrap .card h2{margin-bottom:10px}

@media print{
  body{background:#fff!important}
  .lateral,.barra-inf,.cabeca,.nao-imprime,.toast,.fundo>.gaveta>.gtopo{display:none!important}
  .app{display:block}.principal{padding:0}
  .fundo{position:static;background:none;display:block;backdrop-filter:none}.gaveta{width:100%;height:auto;box-shadow:none;background:#fff;border:0;animation:none}.gaveta .gcorpo{padding:0}
  .doc{box-shadow:none;border-radius:0;padding:0;max-width:none}
  @page{size:A4;margin:16mm}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* ---------- Telas menores ---------- */
@media (max-width:1100px){.ed-grade{grid-template-columns:1fr}.resumo{position:static}.g-2-1{grid-template-columns:1fr}}
@media (max-width:860px){
  .app{grid-template-columns:1fr}
  .lateral{display:none}
  .principal{padding:18px 14px 96px}
  h1{font-size:23px}
  .barra-inf{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;bottom:10px;left:10px;right:10px;z-index:40;border-radius:18px;
    background:rgba(6,17,30,.86);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(148,190,230,.12);
    box-shadow:0 20px 40px -10px rgba(0,0,0,.6);padding:6px 4px calc(6px + env(safe-area-inset-bottom)/2)}
  .barra-inf a,.barra-inf button{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;font-size:10.5px;color:var(--c-fg2);text-decoration:none;background:none;border:0;font-family:var(--sans);padding:5px 0;cursor:pointer}
  .barra-inf a.ativo{color:var(--c-teal)}
  .barra-inf a.ativo::after{content:"";position:absolute;top:-6px;width:22px;height:2px;border-radius:2px;background:var(--c-teal);box-shadow:0 0 10px var(--c-teal)}
  .barra-inf svg{width:21px;height:21px}
  .folha{position:fixed;inset:auto 0 0 0;background:var(--surface-solida);border-radius:22px 22px 0 0;padding:18px 16px calc(22px + env(safe-area-inset-bottom));z-index:60;max-height:82vh;overflow-y:auto;box-shadow:var(--sombra-alta);border-top:1px solid var(--line-forte);animation:modalIn .25s var(--ease) both}
  .folha .itens-f{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:12px 0}
  .folha .itens-f a{display:flex;flex-direction:column;align-items:center;gap:6px;padding:14px 4px;border:1px solid var(--line);border-radius:14px;color:var(--fg);text-decoration:none;font-size:12px;text-align:center;background:var(--field)}
  .folha .itens-f svg{width:22px;height:22px;color:var(--teal-text)}
  .kpis{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .kpis .kpi:last-child:nth-child(odd){grid-column:1/-1}
  .kpi{padding:13px 14px}
  .kpi .v{font-size:19px}
  .g2,.g3{grid-template-columns:1fr}
  .form-grade,.form-grade.g3,.form-grade.g4{grid-template-columns:1fr}
  .col-2,.col-3{grid-column:auto}
  .kanban{height:calc(100vh - 250px);grid-auto-columns:84%}
  .gaveta .gcorpo{padding:14px}
  .doc{padding:24px 18px}.doc .cartoes{grid-template-columns:1fr}
  .filtros input[type=search]{max-width:none}
  .esconde-cel{display:none}
  .resumo .total{font-size:26px}
}
.oculto-svg{position:absolute;width:0;height:0;overflow:hidden}
.esqueleto.alto{height:260px}
@keyframes carregar{0%{transform:translateX(-100%)}100%{transform:translateX(300%)}}
.prog rect.carregando{animation:carregar 1.1s var(--ease) infinite}

.kpis.k4{grid-template-columns:repeat(4,minmax(0,1fr))}
@media (max-width:1180px){.kpis.k4{grid-template-columns:repeat(2,minmax(0,1fr))}}
.paleta input:focus{border-color:var(--line)}
.itens td input{width:70px}
.itens th,.itens td{padding:9px 10px}