/* ==========================================================================
   Vendas · visual "colorido, cards"
   Papel claro, cartões grandes e coloridos por plataforma, números enormes.
   ========================================================================== */
:root{
  --bg:#F4EFE6; --bg2:#EDE6D9; --card:#FFFFFF; --ink:#17151C; --ink2:#3A3642; --muted:#716B78; --faint:#A39DA8;
  --line:#E6DFD2; --line2:#D9D0C0;
  --ml:#FFE14D; --ml-ink:#2B2300; --ml-deep:#E6B800;
  --sh:#FF5A36; --sh-ink:#FFFFFF; --sh-deep:#D63A17;
  --tt:#15131A; --tt-ink:#FFFFFF; --tt-a:#25F4EE; --tt-b:#FE2C55;
  --ext:#16B3A0; --ext-ink:#FFFFFF; --ext-deep:#0E8B7C;
  --emp:#6C4CF1; --emp-ink:#FFFFFF; --emp-deep:#4B2FD1;
  --good:#12A150; --good-bg:#DDF5E6; --bad:#E5484D; --bad-bg:#FDE3E3; --warn:#E89B0C; --warn-bg:#FFF1D1;
  --c-tarifa:#F5A524; --c-custo:#8B5CF6; --c-imposto:#E5484D; --c-frete:#3B82F6; --c-ads:#EC4899; --c-afil:#6366F1; --c-lucro:#12A150;
  --r-xl:28px; --r-lg:22px; --r-md:16px; --r-sm:11px;
  --sombra:0 1px 0 rgba(23,21,28,.04), 0 14px 34px -22px rgba(23,21,28,.35);
  --sombra-forte:0 24px 60px -24px rgba(23,21,28,.45);
  --f-disp:'Bricolage Grotesque', 'Figtree', system-ui, sans-serif;
  --f-corpo:'Figtree', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){ :root:not([data-tema="claro"]){
  --bg:#141218; --bg2:#1B1820; --card:#211E27; --ink:#F4F1F7; --ink2:#D6D1DC; --muted:#A09AA8; --faint:#6F6977;
  --line:#2E2A35; --line2:#3A3542; --tt:#0B0A0E; --good-bg:#12321F; --bad-bg:#3A1719; --warn-bg:#3A2A0A;
  --sombra:0 1px 0 rgba(0,0,0,.2), 0 14px 34px -22px rgba(0,0,0,.8); color-scheme:dark; } }
:root[data-tema="escuro"]{
  --bg:#141218; --bg2:#1B1820; --card:#211E27; --ink:#F4F1F7; --ink2:#D6D1DC; --muted:#A09AA8; --faint:#6F6977;
  --line:#2E2A35; --line2:#3A3542; --tt:#0B0A0E; --good-bg:#12321F; --bad-bg:#3A1719; --warn-bg:#3A2A0A;
  --sombra:0 1px 0 rgba(0,0,0,.2), 0 14px 34px -22px rgba(0,0,0,.8); color-scheme:dark; }

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{background:var(--bg);color:var(--ink);font:500 15px/1.45 var(--f-corpo);min-height:100vh;-webkit-font-smoothing:antialiased}
a{color:inherit}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
input,select,textarea{font:inherit;color:inherit}
.num,.mono{font-variant-numeric:tabular-nums}
[hidden]{display:none!important}
i.ph,i.ph-bold,i.ph-fill{line-height:1}

/* ----------------------------- topo ----------------------------- */
.topo{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.topo-l1{display:flex;align-items:center;gap:12px;padding:12px max(16px,calc((100vw - 1320px)/2));}
.marca{display:flex;align-items:center;gap:10px;text-decoration:none;min-width:0}
.marca-bola{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;flex-shrink:0;
  background:conic-gradient(from 200deg,var(--ml),var(--sh),var(--emp),var(--ext),var(--ml));color:var(--ink);font:800 14px var(--f-disp);position:relative}
.marca-bola::after{content:'';position:absolute;inset:4px;border-radius:10px;background:var(--card)}
.marca-bola b{position:relative;z-index:1}
.marca-txt{min-width:0}
.marca-txt strong{display:block;font:800 17px/1.1 var(--f-disp);letter-spacing:-.02em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.marca-txt small{color:var(--muted);font-size:12px;font-weight:600}
.topo-acoes{margin-left:auto;display:flex;align-items:center;gap:8px}
.btn-ico{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--card);box-shadow:var(--sombra);font-size:19px;color:var(--ink2);flex-shrink:0;text-decoration:none}
.btn-ico:hover{color:var(--ink)}
.btn-ico .ponto{position:absolute}
.periodo-btn{display:flex;align-items:center;gap:8px;height:40px;padding:0 14px 0 12px;border-radius:12px;background:var(--ink);color:var(--bg);font-weight:700;font-size:14px;white-space:nowrap}
.periodo-btn i{font-size:17px}
.periodo-btn small{opacity:.65;font-weight:600}

.nav{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:0 max(16px,calc((100vw - 1320px)/2)) 10px}
.nav::-webkit-scrollbar{display:none}
.nav a{display:flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;text-decoration:none;font-weight:700;font-size:14px;color:var(--ink2);white-space:nowrap;flex-shrink:0;transition:background .15s}
.nav a i{font-size:17px}
.nav a:hover{background:var(--bg2)}
.nav a.on{background:var(--ink);color:var(--bg)}
.nav .sep{width:1px;background:var(--line2);margin:6px 4px;flex-shrink:0}

/* filtros */
.filtros{display:flex;gap:8px;align-items:center;flex-wrap:wrap;padding:14px max(16px,calc((100vw - 1320px)/2)) 0}
.chip{display:inline-flex;align-items:center;gap:7px;height:34px;padding:0 13px;border-radius:999px;background:var(--card);box-shadow:var(--sombra);font-weight:700;font-size:13px;color:var(--ink2)}
.chip .bol{width:10px;height:10px;border-radius:50%}
.chip.on{outline:2px solid var(--ink);color:var(--ink)}
.chip-sel{height:34px;border-radius:999px;background:var(--card);box-shadow:var(--sombra);border:0;padding:0 30px 0 13px;font-weight:700;font-size:13px;color:var(--ink2);
  appearance:none;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='%23716B78' stroke-width='3'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 11px center;max-width:210px}
.chip-sel.on{outline:2px solid var(--ink);color:var(--ink)}
.limpar{font-size:13px;font-weight:700;color:var(--muted);text-decoration:underline;padding:0 6px}

/* ----------------------------- página ----------------------------- */
main{padding:18px max(16px,calc((100vw - 1320px)/2)) 90px}
.cab{display:flex;align-items:flex-end;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:6px 0 18px}
.cab h1{font:800 clamp(26px,4vw,38px)/1.05 var(--f-disp);letter-spacing:-.035em}
.cab p{color:var(--muted);font-weight:600;margin-top:4px}
.cab .acoes{display:flex;gap:8px;flex-wrap:wrap}
.secao{font:800 20px/1.2 var(--f-disp);letter-spacing:-.02em;margin:30px 0 12px;display:flex;align-items:center;gap:10px}
.secao small{font:600 13px var(--f-corpo);color:var(--muted);letter-spacing:0}

.grade{display:grid;gap:14px}
.g2{grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr))}
.g3{grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr))}
.g5{grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr))}
.span2{grid-column:span 2}
@media (max-width:760px){.span2{grid-column:auto}}

.card{background:var(--card);border-radius:var(--r-lg);box-shadow:var(--sombra);padding:20px;min-width:0;position:relative}
.card.pad-l{padding:24px}
.card h3{font:800 16px/1.25 var(--f-disp);letter-spacing:-.01em;display:flex;align-items:center;gap:8px}
.card h3 i{font-size:19px}
.card .sub{color:var(--muted);font-size:13px;font-weight:600;margin-top:2px}
.card-cab{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.clicavel{cursor:pointer;transition:transform .15s, box-shadow .15s}
.clicavel:hover{transform:translateY(-2px);box-shadow:var(--sombra-forte)}

/* cartões coloridos (plataformas / empresa) */
.cc{border-radius:var(--r-xl);padding:20px 20px 18px;min-height:176px;display:flex;flex-direction:column;position:relative;overflow:hidden;box-shadow:var(--sombra);isolation:isolate}
/* grão de papel por cima da cor + desenho próprio de cada plataforma no canto */
.cc::before{content:'';position:absolute;inset:0;z-index:0;pointer-events:none;opacity:.22;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 1  0 0 0 0 1  0 0 0 .9 0'/></filter><rect width='100%' height='100%' filter='url(%23g)'/></svg>")}
.cc::after{content:'';position:absolute;z-index:0;width:210px;height:210px;right:-60px;top:-70px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle,transparent 0 36%,rgba(255,255,255,.2) 37% 50%,transparent 51% 62%,rgba(255,255,255,.12) 63% 70%,transparent 71%)}
.cc-ML::after{background:repeating-radial-gradient(circle at 70% 30%,rgba(255,255,255,.55) 0 7px,transparent 7px 17px);opacity:.55}
.cc-Shopee::after{border-radius:0;width:230px;height:170px;top:-20px;right:-20px;background:radial-gradient(rgba(255,255,255,.45) 2.2px,transparent 2.8px) 0 0/15px 15px;
  -webkit-mask-image:radial-gradient(circle at 100% 0,#000 20%,transparent 70%);mask-image:radial-gradient(circle at 100% 0,#000 20%,transparent 70%)}
.cc-Externa::after{border-radius:0;width:240px;height:180px;top:-20px;right:-20px;
  background:linear-gradient(rgba(255,255,255,.28) 1px,transparent 1px) 0 0/18px 18px,linear-gradient(90deg,rgba(255,255,255,.28) 1px,transparent 1px) 0 0/18px 18px;
  -webkit-mask-image:radial-gradient(circle at 100% 0,#000 15%,transparent 68%);mask-image:radial-gradient(circle at 100% 0,#000 15%,transparent 68%)}
.cc-TikTok::after{border-radius:0;width:260px;height:200px;top:-40px;right:-60px;opacity:.6;
  background:radial-gradient(circle at 35% 45%,var(--tt-a),transparent 55%),radial-gradient(circle at 60% 55%,var(--tt-b),transparent 55%)}
.cc-ML{background:var(--ml);color:var(--ml-ink)}
.cc-Shopee{background:var(--sh);color:var(--sh-ink)}
.cc-TikTok{background:var(--tt);color:var(--tt-ink)}
.cc-Externa{background:var(--ext);color:var(--ext-ink)}
.cc-emp{background:linear-gradient(140deg,var(--emp) 0%,#8B5CF6 70%,#A566F5 100%);color:var(--emp-ink)}
.cc-marca{position:absolute;right:-10px;bottom:-26px;font-size:128px;opacity:.12;transform:rotate(-14deg);pointer-events:none;z-index:0;transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.cc-ML .cc-marca{opacity:.09}
.cc:hover .cc-marca{transform:rotate(-4deg) scale(1.08)}
.cc-topo{display:flex;align-items:center;gap:9px;font-weight:800;font-size:14px;position:relative;z-index:1}
.cc-logo{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:rgba(255,255,255,.28);font-size:17px}
.cc-ML .cc-logo{background:rgba(0,0,0,.08)}
.cc-val{font:800 clamp(24px,2.5vw,36px)/1 var(--f-disp);letter-spacing:-.04em;margin:auto 0 4px;padding-top:18px;position:relative;z-index:1;white-space:nowrap}
.cc-spark{position:relative;z-index:1;height:30px;margin:0 0 8px;display:block;width:100%;overflow:visible}
.cc-spark path.l{fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;opacity:.75}
.cc-spark path.a{fill:currentColor;opacity:.09}
.cc-spark circle{fill:currentColor}
.cc-val small{font-size:.5em;font-weight:700;letter-spacing:-.01em;opacity:.8}
.cc-rod{display:flex;align-items:center;justify-content:space-between;gap:8px;font-weight:700;font-size:13px;position:relative;z-index:1;flex-wrap:wrap}
.cc-rod span{opacity:.85}
.cc .delta{background:rgba(255,255,255,.3);color:inherit}
.cc-ML .delta{background:rgba(0,0,0,.08)}

/* delta */
.delta{display:inline-flex;align-items:center;gap:3px;padding:3px 9px;border-radius:999px;font-weight:800;font-size:12px;white-space:nowrap}
.delta.up{background:var(--good-bg);color:var(--good)}
.delta.down{background:var(--bad-bg);color:var(--bad)}
.delta.flat{background:var(--bg2);color:var(--muted)}
.delta.novo{background:var(--bg2);color:var(--ink2)}

/* KPI simples */
.kpi-rot{display:flex;align-items:center;gap:7px;color:var(--muted);font-weight:700;font-size:13px}
.kpi-rot i{font-size:17px}
.kpi-val{font:800 clamp(24px,2.6vw,32px)/1.05 var(--f-disp);letter-spacing:-.035em;margin:10px 0 6px}
.kpi-val small{font-size:.52em;color:var(--muted);letter-spacing:0}
.kpi-rod{display:flex;align-items:center;gap:8px;justify-content:space-between;color:var(--muted);font-size:13px;font-weight:600;flex-wrap:wrap}
.kpi-ico{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;font-size:20px;flex-shrink:0}
.linhas-mini{margin-top:12px;border-top:1px dashed var(--line2);padding-top:10px;display:grid;gap:6px}
.lm{display:flex;justify-content:space-between;gap:10px;font-size:13px;font-weight:600;color:var(--muted)}
.lm b{color:var(--ink);font-weight:800}

/* meta */
.meta{display:grid;grid-template-columns:1.4fr 1fr;gap:18px;align-items:center}
@media (max-width:760px){.meta{grid-template-columns:1fr}}
.meta-pc{font:800 clamp(44px,6vw,72px)/.9 var(--f-disp);letter-spacing:-.05em}
.barra{height:14px;border-radius:999px;background:var(--bg2);overflow:hidden;position:relative}
.barra>i{display:block;height:100%;border-radius:999px;background:var(--emp)}
.barra .ritmo{position:absolute;top:-4px;bottom:-4px;width:3px;border-radius:3px;background:var(--ink)}
.barra.fina{height:8px}
.estado{display:inline-flex;align-items:center;gap:6px;font-weight:800;font-size:13px;padding:5px 11px;border-radius:999px}
.estado.hit{background:var(--good-bg);color:var(--good)} .estado.ok{background:#E8E3FF;color:var(--emp-deep)} .estado.behind{background:var(--warn-bg);color:var(--warn)}

/* aviso */
.aviso{display:flex;gap:12px;align-items:flex-start;padding:14px 16px;border-radius:var(--r-md);font-weight:600;font-size:14px;margin-bottom:14px}
.aviso i{font-size:22px;flex-shrink:0;margin-top:-1px}
.aviso.bom{background:var(--good-bg);color:var(--good)} .aviso.ruim{background:var(--bad-bg);color:var(--bad)}
.aviso.info{background:var(--bg2);color:var(--ink2)} .aviso.alerta{background:var(--warn-bg);color:#9A6300}
:root[data-tema="escuro"] .aviso.alerta{color:var(--warn)}
.aviso b{color:inherit}

/* leituras */
.leitura{display:flex;gap:12px;padding:14px;border-radius:var(--r-md);background:var(--card);box-shadow:var(--sombra)}
.leitura .kpi-ico{width:36px;height:36px}
.leitura.bom .kpi-ico{background:var(--good-bg);color:var(--good)}
.leitura.alerta .kpi-ico{background:var(--bad-bg);color:var(--bad)}
.leitura.neutro .kpi-ico{background:var(--bg2);color:var(--ink2)}
.leitura b{display:block;font-weight:800;font-size:14px;margin-bottom:2px}
.leitura p{font-size:13.5px;color:var(--muted);font-weight:600}

/* barras horizontais / ranking */
.rank{display:grid;gap:12px}
.rank-l{display:grid;grid-template-columns:1fr auto;gap:4px 12px;align-items:center}
.rank-n{display:flex;align-items:center;gap:8px;font-weight:700;font-size:14px;min-width:0}
.rank-n span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rank-v{font-weight:800;font-size:14px;text-align:right;white-space:nowrap}
.rank-b{grid-column:1/-1;height:9px;border-radius:999px;background:var(--bg2);overflow:hidden}
.rank-b i{display:block;height:100%;border-radius:999px}
.tag{display:inline-flex;align-items:center;height:21px;padding:0 8px;border-radius:7px;font-size:11px;font-weight:800;flex-shrink:0;letter-spacing:.01em}
.tag-ML{background:var(--ml);color:var(--ml-ink)} .tag-Shopee{background:var(--sh);color:#fff} .tag-TikTok{background:var(--tt);color:#fff}
.tag-Externa{background:var(--ext);color:#fff} .tag-cinza{background:var(--bg2);color:var(--ink2)}
.dot{width:10px;height:10px;border-radius:50%;flex-shrink:0;display:inline-block}
.bg-ML{background:var(--ml-deep)} .bg-Shopee{background:var(--sh)} .bg-TikTok{background:var(--tt-b)} .bg-Externa{background:var(--ext)} .bg-emp{background:var(--emp)}

/* DRE (cascata) */
.dre{display:grid;gap:4px}
.dre-l{display:grid;grid-template-columns:22px 1fr auto;align-items:center;gap:10px;padding:9px 4px;border-radius:10px}
.dre-l i{font-size:18px;color:var(--muted)}
.dre-l .n{font-weight:700;font-size:14px}
.dre-l .n small{display:block;color:var(--muted);font-weight:600;font-size:12px}
.dre-l .v{font-weight:800;font-size:15px;white-space:nowrap;font-variant-numeric:tabular-nums}
.dre-l.neg .v{color:var(--bad)} .dre-l.info .v{color:var(--muted);font-weight:700}
.dre-l.base{background:var(--bg2)}
.dre-l.total{background:var(--good-bg);margin-top:6px;padding:14px 8px}
.dre-l.total.ruim{background:var(--bad-bg)}
.dre-l.total .n{font:800 16px var(--f-disp)} .dre-l.total .v{font:800 22px var(--f-disp);color:var(--good)}
.dre-l.total.ruim .v{color:var(--bad)}
.cascata{display:flex;height:34px;border-radius:12px;overflow:hidden;margin:14px 0 8px;gap:2px}
.cascata i{display:block;height:100%;min-width:3px}
.legenda{display:flex;flex-wrap:wrap;gap:6px 14px;font-size:12.5px;font-weight:700;color:var(--ink2)}
.legenda span{display:inline-flex;align-items:center;gap:6px}
.legenda .q{width:10px;height:10px;border-radius:3px}

/* chave liga/desliga */
.chave{display:inline-flex;align-items:center;gap:9px;font-weight:700;font-size:13px;color:var(--ink2);cursor:pointer;user-select:none}
.chave input{appearance:none;width:38px;height:22px;border-radius:999px;background:var(--line2);position:relative;cursor:pointer;transition:.2s;flex-shrink:0}
.chave input::after{content:'';position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#fff;transition:.2s;box-shadow:0 1px 3px rgba(0,0,0,.25)}
.chave input:checked{background:var(--good)} .chave input:checked::after{left:19px}

/* segmentado */
.seg{display:inline-flex;background:var(--bg2);border-radius:12px;padding:4px;gap:2px;flex-wrap:wrap}
.seg button{padding:7px 13px;border-radius:9px;font-weight:700;font-size:13px;color:var(--muted)}
.seg button.on{background:var(--card);color:var(--ink);box-shadow:0 1px 3px rgba(0,0,0,.1)}

/* tabelas */
.tab-rola{overflow-x:auto;margin:0 -20px;padding:0 20px}
table.t{width:100%;border-collapse:collapse;font-size:13.5px}
.t th{text-align:left;font-size:11.5px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;padding:8px 10px;border-bottom:2px solid var(--line);white-space:nowrap}
.t td{padding:10px;border-bottom:1px solid var(--line);font-weight:600;vertical-align:middle}
.t td.r,.t th.r{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.t tr:last-child td{border-bottom:0}
.t tfoot td{font-weight:800;border-top:2px solid var(--line);border-bottom:0}
.t tr.linha-click{cursor:pointer} .t tr.linha-click:hover td{background:var(--bg)}
.t .neg{color:var(--bad)} .t .pos{color:var(--good)} .t .fraco{color:var(--muted)}
.t .trunc{max-width:320px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.t tr.aberto td{background:var(--bg)}
.t tr.det>td{padding:0;background:var(--bg)}
.det-in{padding:12px 14px 16px}

/* formulários */
.campo{display:grid;gap:6px;min-width:0}
.campo label,.campo>span{font-size:12px;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.inp{width:100%;height:44px;border-radius:12px;border:1.5px solid var(--line2);background:var(--card);padding:0 13px;font-weight:600;font-size:15px;transition:border-color .15s, box-shadow .15s}
textarea.inp{height:auto;min-height:80px;padding:11px 13px;resize:vertical}
.inp:focus{outline:none;border-color:var(--emp);box-shadow:0 0 0 4px color-mix(in srgb,var(--emp) 18%,transparent)}
.inp.erro{border-color:var(--bad)}
.inp-pre{position:relative} .inp-pre>span{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--muted);font-weight:700;font-size:14px;pointer-events:none}
.inp-pre .inp{padding-left:38px}
.inp-suf{position:relative} .inp-suf>span{position:absolute;right:13px;top:50%;transform:translateY(-50%);color:var(--muted);font-weight:700}
.inp-suf .inp{padding-right:32px}
.form-g{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr))}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:44px;padding:0 18px;border-radius:13px;font-weight:800;font-size:14.5px;background:var(--ink);color:var(--bg);white-space:nowrap;text-decoration:none;transition:filter .15s, transform .1s}
.btn:hover{filter:brightness(1.15)} .btn:active{transform:scale(.98)}
.btn i{font-size:18px}
.btn.sec{background:var(--card);color:var(--ink);box-shadow:var(--sombra)}
.btn.cor{background:var(--emp);color:#fff}
.btn.verde{background:var(--good);color:#fff}
.btn.perigo{background:var(--bad-bg);color:var(--bad)}
.btn.peq{height:34px;padding:0 12px;font-size:13px;border-radius:10px}
.btn[disabled]{opacity:.5;pointer-events:none}

/* modal / folha */
.modal-fundo{position:fixed;inset:0;background:rgba(15,12,20,.45);z-index:80;display:flex;align-items:center;justify-content:center;padding:18px;animation:aparece .15s}
.modal{background:var(--card);border-radius:var(--r-xl);width:min(980px,100%);max-height:calc(100vh - 36px);overflow:auto;box-shadow:var(--sombra-forte);animation:sobe .2s}
.modal.estreito{width:min(560px,100%)}
.modal-cab{position:sticky;top:0;background:var(--card);display:flex;align-items:center;gap:12px;padding:18px 20px;border-bottom:1px solid var(--line);z-index:2}
.modal-cab h2{font:800 20px/1.2 var(--f-disp);letter-spacing:-.02em;flex:1;min-width:0}
.modal-corpo{padding:20px}
@media (max-width:640px){
  .modal-fundo{align-items:flex-end;padding:0}
  .modal{border-radius:24px 24px 0 0;max-height:92vh;width:100%}
}
@keyframes aparece{from{opacity:0}} @keyframes sobe{from{transform:translateY(20px);opacity:0}}

/* avisos rápidos */
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:12px 18px;border-radius:14px;font-weight:700;z-index:200;box-shadow:var(--sombra-forte);display:flex;gap:10px;align-items:center;max-width:calc(100vw - 32px);animation:sobe .2s}
.toast.erro{background:var(--bad);color:#fff}

/* carregando / vazio */
.esq{background:linear-gradient(90deg,var(--bg2) 0,var(--line) 50%,var(--bg2) 100%);background-size:200% 100%;animation:brilho 1.2s infinite;border-radius:var(--r-lg)}
@keyframes brilho{to{background-position:-200% 0}}
.vazio{text-align:center;padding:40px 20px;color:var(--muted);font-weight:600}
.vazio i{font-size:42px;display:block;margin-bottom:10px;color:var(--faint)}
.vazio b{display:block;color:var(--ink);font-size:17px;margin-bottom:4px}

/* gráficos */
.graf{position:relative;height:280px}
.graf.baixo{height:200px} .graf.alto{height:340px}
.spark{height:54px;margin-top:10px}

/* mapa */
.mapa-wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:18px;align-items:start}
@media (max-width:820px){.mapa-wrap{grid-template-columns:1fr}}
.mapa svg{width:100%;height:auto;display:block}
.mapa path{stroke:var(--card);stroke-width:1.2;cursor:pointer;transition:opacity .15s}
.mapa path:hover{opacity:.8}
.mapa path.sel{stroke:var(--ink);stroke-width:2.5}

/* calendário (heatmap) */
.cal{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.cal span{aspect-ratio:1;border-radius:8px;display:grid;place-items:center;font-size:12px;font-weight:700;background:var(--bg2);color:var(--muted)}
.cal span.wd{background:none;font-size:11px}
.cal span.vazio2{background:none}
.cal span.forte{color:#fff}

/* pessoas */
.avatar{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;font:800 17px var(--f-disp);flex-shrink:0;color:#fff}
.av0{background:var(--emp)} .av1{background:var(--sh)} .av2{background:var(--ext)} .av3{background:#E6B800;color:var(--ml-ink)} .av4{background:var(--tt)} .av5{background:#3B82F6}

/* lançamento */
.itens-l{display:grid;grid-template-columns:minmax(0,3fr) 80px minmax(0,1.2fr) minmax(0,1.2fr) 44px;gap:8px;align-items:end;margin-bottom:8px}
@media (max-width:720px){.itens-l{grid-template-columns:1fr 1fr;padding:12px;border-radius:14px;background:var(--bg)}.itens-l .campo:first-child{grid-column:1/-1}}
.resumo-v{position:sticky;top:130px}
.resumo-v .lin{display:flex;justify-content:space-between;padding:7px 0;font-weight:600;color:var(--muted);font-size:14px}
.resumo-v .lin b{color:var(--ink)}
.resumo-v .grande{font:800 30px var(--f-disp);letter-spacing:-.03em}

/* sincronização */
.prog{height:12px;border-radius:999px;background:var(--bg2);overflow:hidden}
.prog i{display:block;height:100%;background:linear-gradient(90deg,var(--emp),var(--sh));border-radius:999px;transition:width .3s}
.log{max-height:320px;overflow:auto;font-size:13px;background:var(--bg);border-radius:14px;padding:12px 14px;display:grid;gap:4px}
.log .ok{color:var(--good)} .log .aviso{color:var(--warn);display:block;padding:0;margin:0;font-weight:600} .log .erro{color:var(--bad)} .log .info{color:var(--muted)}

.rodape{margin-top:40px;color:var(--faint);font-size:12px;font-weight:600;text-align:center}
.nota{color:var(--muted);font-size:12.5px;font-weight:600;margin-top:10px;display:flex;gap:6px;align-items:flex-start}
.nota i{font-size:15px;margin-top:1px;flex-shrink:0}
.flex{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.entre{justify-content:space-between}
.mt{margin-top:14px} .mt2{margin-top:24px}
.muted{color:var(--muted)}
.forte{font-weight:800}
.menu-pop{position:absolute;right:0;top:48px;background:var(--card);border-radius:18px;box-shadow:var(--sombra-forte);padding:8px;min-width:250px;z-index:60;display:grid}
.menu-pop a,.menu-pop button{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:11px;text-decoration:none;font-weight:700;font-size:14px;text-align:left}
.menu-pop a:hover,.menu-pop button:hover{background:var(--bg2)}
.menu-pop i{font-size:18px;color:var(--muted)}
.menu-pop hr{border:0;border-top:1px solid var(--line);margin:6px 4px}
.rel{position:relative}
@media (max-width:640px){
  .marca-txt small{display:none}
  .periodo-btn small{display:none}
  .card{padding:16px} .tab-rola{margin:0 -16px;padding:0 16px}
  .cc{min-height:150px}
}
@media print{
  .topo,.filtros,.nav,.cab .acoes,.no-print{display:none!important}
  body{background:#fff} .card{box-shadow:none;border:1px solid #ddd} main{padding:0}
}
@media (max-width:640px){
  .g5{grid-template-columns:1fr 1fr} .g5>.cc-emp{grid-column:1/-1}
  .g5 .cc:not(.cc-emp){min-height:132px;padding:16px} .g5 .cc:not(.cc-emp) .cc-val{font-size:22px}
  .g5 .cc:not(.cc-emp) .cc-rod span:not(.delta){display:none}
  .filtros{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:4px} .filtros::-webkit-scrollbar{display:none}
  .filtros>*{flex-shrink:0}
}
.secao,.card[id^="sec-"]{scroll-margin-top:150px}

/* ==========================================================================
   Tempero: voz (manchetes), movimento, celebração
   ========================================================================== */
:root{--emp-txt:#5B3BE8}
@media (prefers-color-scheme: dark){ :root:not([data-tema="claro"]){--emp-txt:#A996FF} }
:root[data-tema="escuro"]{--emp-txt:#A996FF}
.olho{display:inline-flex;align-items:center;gap:7px;font:800 12px var(--f-corpo);letter-spacing:.09em;text-transform:uppercase;color:var(--muted)}
.olho i{font-size:15px;color:var(--emp-txt)}
.cab h1{max-width:26ch;margin-top:6px}
.cab h1 em,.manchete h1 em{font-family:'Instrument Serif',Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.015em;color:var(--emp-txt);padding-right:.05em}
.cab h1 em{font-size:1.12em}

.manchete{margin:4px 0 20px}
.manchete .saud{display:flex;align-items:center;gap:8px;font-weight:700;color:var(--muted);font-size:14px;flex-wrap:wrap}
.manchete .saud .sol{font-size:18px}
.manchete h1{font:800 clamp(32px,5.4vw,60px)/1 var(--f-disp);letter-spacing:-.045em;margin:10px 0 12px;max-width:18ch}
.manchete h1 em{font-size:1.1em}
.manchete p{font-size:clamp(15px,1.5vw,18px);font-weight:600;color:var(--ink2);max-width:64ch;line-height:1.5}
.manchete p b{color:var(--ink);font-weight:800}
.selos{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}
.selo{display:inline-flex;align-items:center;gap:8px;padding:7px 13px 7px 9px;border-radius:999px;background:var(--card);box-shadow:var(--sombra);font-weight:800;font-size:13px;color:var(--ink2)}
.selo .em{font-size:17px;line-height:1}
.selo.ouro{background:linear-gradient(135deg,#FFF3C4,#FFE08A);color:#6B4A00}
.selo.fogo{background:linear-gradient(135deg,#FFE1D6,#FFC2AE);color:#8A2A0A}
.selo.alvo{background:linear-gradient(135deg,#DDF5E6,#BDEBCF);color:#0C6B36}
.selo.foguete{background:linear-gradient(135deg,#E8E3FF,#D4CBFF);color:#3A23A6}
:root[data-tema="escuro"] .selo.ouro,:root[data-tema="escuro"] .selo.fogo,:root[data-tema="escuro"] .selo.alvo,:root[data-tema="escuro"] .selo.foguete{filter:saturate(.9) brightness(.92)}

.carregando{display:flex;align-items:center;gap:10px;font-weight:700;color:var(--muted);margin:6px 0 16px}
.carregando .pulso{width:10px;height:10px;border-radius:50%;background:var(--emp);animation:pulso 1s ease-in-out infinite}
@keyframes pulso{50%{transform:scale(1.6);opacity:.4}}

.confete{position:fixed;top:-16px;width:9px;height:15px;border-radius:2px;z-index:180;pointer-events:none;
  animation:caiConfete var(--d,3s) cubic-bezier(.25,.6,.4,1) var(--a,0s) forwards}
@keyframes caiConfete{to{transform:translate(var(--x,0),108vh) rotate(var(--r,540deg))}}

@media (prefers-reduced-motion: no-preference){
  .anima .manchete,.anima .cab{animation:entra .6s cubic-bezier(.2,.8,.2,1) both}
  .anima .grade>*,.anima .leitura{animation:entra .6s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0) * 55ms + 80ms)}
  .anima .barra>i,.anima .rank-b i,.anima .cascata i,.anima .prog i{animation:enche 1.1s cubic-bezier(.2,.8,.2,1) both;animation-delay:.3s}
  .anima .cc-spark path.l{stroke-dasharray:1000;stroke-dashoffset:1000;animation:traca 1.6s cubic-bezier(.4,.1,.2,1) .35s forwards}
  .anima .cc-spark path.a{animation:aparece 1s ease .9s both}
}
@keyframes entra{from{opacity:0;translate:0 18px}}
@keyframes enche{from{width:0}}
@keyframes traca{to{stroke-dashoffset:0}}

/* seletor de fundo */
.modal-fundo.leve{background:rgba(15,12,20,.14)}
.fundos{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:14px}
.fundo-op{display:grid;gap:6px;align-content:start;text-align:left;padding:10px;border-radius:16px;background:var(--bg2);border:2px solid transparent;transition:border-color .15s, transform .15s}
.fundo-op:hover{border-color:var(--line2);transform:translateY(-2px)}
.fundo-op.on{border-color:var(--emp);background:var(--card)}
.fundo-am{height:64px;border-radius:11px;box-shadow:inset 0 0 0 1px rgba(0,0,0,.07);display:block}
.fundo-op b{font:800 14px var(--f-disp);letter-spacing:-.01em}
.fundo-op small{color:var(--muted);font-size:12px;font-weight:600;line-height:1.3}