/* ══════════════════════════════════════════════════════════════
   PREMIOS DE LA FORTUNA · PAINEL DE MÉTRICAS
   Identidade visual da marca: dourado sobre vinho profundo,
   gradiente âmbar→cobre, cantos suaves ecoando a moeda premiada.
   ══════════════════════════════════════════════════════════════ */

:root {
  --pf-100:#FFF6DF; --pf-200:#FFE7AE; --pf-300:#F8D06A; --pf-400:#FFC900;
  --pf-500:#FFA600; --pf-600:#E37B00; --pf-700:#B85A00; --pf-800:#7A3A00;

  --bg-0:#170000; --bg-1:#2A0000; --bg-2:#3A0605; --bg-3:#4E0F0A;
  --line:rgba(248,208,106,.16); --line-strong:rgba(248,208,106,.36);
  --txt:#FBEFE0; --txt-dim:#DCC3A6; --muted:#A98D74;

  --ok:#3FE07B; --warn:#FFC24B; --bad:#FF6B7A;
  --grad: linear-gradient(135deg,#FFEA00 0%,#FFA600 45%,#B85A00 100%);
  --grad-soft: linear-gradient(135deg,rgba(255,231,174,.16),rgba(184,90,0,.08));
  --grad-text: linear-gradient(135deg,#FFF6DF 0%,#F8D06A 48%,#FFA600 100%);

  --r: 14px;
  --shadow: 0 18px 50px -22px rgba(0,0,0,.9);
  --glow: 0 0 0 1px var(--line), 0 0 34px -14px rgba(255,166,0,.55);

  --font: "DM Sans","Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,"Inter",sans-serif;
  --font-display: "Oswald","Bahnschrift","Segoe UI Variable Display","Segoe UI Semibold",var(--font);
}


*,*::before,*::after{ box-sizing:border-box; }

body{
  margin:0; font-family:var(--font); color:var(--txt); font-size:14px; line-height:1.5;
  background:
    radial-gradient(1100px 620px at 76% -12%, rgba(255,166,0,.16), transparent 62%),
    radial-gradient(820px 520px at 4% 4%, rgba(143,63,22,.28), transparent 60%),
    var(--bg-0);
  min-height:100vh;
}
/* trama técnica de fundo */
body::before{
  content:""; position:fixed; inset:0; pointer-events:none; z-index:0; opacity:.5;
  background-image:
    linear-gradient(rgba(248,208,106,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(248,208,106,.035) 1px, transparent 1px);
  background-size:56px 56px;
  mask-image:radial-gradient(ellipse 100% 70% at 50% 0%, #000 20%, transparent 78%);
}
body > *{ position:relative; z-index:1; }

h1,h2,h3{ font-family:var(--font-display); font-weight:600; letter-spacing:.4px; margin:0; }
code,pre{ font-family:"Cascadia Mono",Consolas,"SF Mono",monospace; font-size:12.5px; }
.num,table .num{ text-align:right; font-variant-numeric:tabular-nums; }

/* ─────────────── TOPO ─────────────── */
.topbar{
  display:flex; align-items:center; justify-content:space-between; gap:20px;
  padding:16px 26px; border-bottom:1px solid var(--line);
  background:linear-gradient(180deg, rgba(58,6,5,.94), rgba(42,0,0,.72));
  backdrop-filter:blur(14px); position:sticky; top:0; z-index:40;
}
.brand{ display:flex; align-items:center; gap:16px; }
.brand-mark{ width:40px; height:40px; border-radius:10px; filter:drop-shadow(0 0 14px rgba(255,166,0,.45)); }
/* O logotipo já traz o próprio contorno escuro; o brilho só o descola do vinho. */
.brand-logo{
  height:58px; width:auto; display:block;
  filter:drop-shadow(0 0 16px rgba(255,166,0,.35));
}
.brand-text{ display:flex; flex-direction:column; line-height:1.15; }
.brand-name{
  font-family:var(--font-display); font-size:16px; font-weight:700; letter-spacing:2.4px; white-space:nowrap;
  background:var(--grad-text); -webkit-background-clip:text; background-clip:text; color:transparent;
}
.brand-sub{ font-size:10.5px; letter-spacing:2.2px; text-transform:uppercase; color:var(--muted); }

.topbar-right{ display:flex; align-items:center; gap:18px; }
.conn{
  display:flex; align-items:center; gap:8px; padding:6px 12px; border-radius:999px;
  border:1px solid var(--line); background:rgba(58,6,5,.7);
  font-size:11.5px; letter-spacing:1.1px; text-transform:uppercase; color:var(--txt-dim);
}
.conn-dot{ width:8px; height:8px; border-radius:50%; background:var(--muted); box-shadow:0 0 0 3px rgba(255,255,255,.04); }
.conn.live .conn-dot{ background:var(--ok); animation:pulse 2.4s infinite; }
.conn.demo .conn-dot{ background:var(--warn); }
.conn.err  .conn-dot{ background:var(--bad); }
.conn.planilha .conn-dot{ background:#7FB8FF; }

.fonte-selo{
  font-size:11px; color:#BFDBFF; letter-spacing:.3px; padding:6px 12px; border-radius:999px;
  border:1px solid rgba(127,184,255,.35); background:rgba(127,184,255,.08); white-space:nowrap;
}
.fonte-selo[hidden]{ display:none !important; }
/* ── linha de totais das tabelas (Campanhas, Conjuntos, Anúncios) ── */
/* cabeçalho numérico alinhado à direita, como o valor embaixo dele */
.data-table th.num{ text-align:right; }
.data-table thead .totais-row td{
  padding:11px 14px; font-size:12.5px; color:var(--txt);
  background:rgba(255,166,0,.07); border-bottom:2px solid rgba(255,166,0,.28);
  font-variant-numeric:tabular-nums;
}

/* ── seletor de colunas (Anúncios) ── */
.colunas-wrap{ position:relative; margin-left:auto; }
.colunas-panel{
  position:absolute; top:calc(100% + 8px); right:0; width:420px; z-index:60;
  border:1px solid var(--line-strong); border-radius:12px; background:var(--bg-2);
  box-shadow:var(--shadow); overflow:hidden;
}
.colunas-panel[hidden]{ display:none !important; }
.colunas-head{ display:flex; align-items:center; gap:8px; padding:10px 12px; border-bottom:1px solid var(--line); flex-wrap:wrap; }
.colunas-head select{ flex:1 1 160px; font-size:12px; padding:5px 8px; }
.colunas-head .btn{ padding:5px 9px; font-size:11.5px; }
.colunas-lista{ max-height:360px; overflow-y:auto; padding:6px; }
.colunas-item{
  display:flex; align-items:center; gap:8px; padding:6px 8px; border-radius:8px; font-size:12.5px; color:var(--txt);
  cursor:grab; user-select:none;
}
.colunas-item:hover{ background:rgba(255,166,0,.07); }
.colunas-item:active{ cursor:grabbing; }
.colunas-item.arrastando{ opacity:.35; outline:1px dashed var(--pf-400); }
.colunas-item.oculta{ color:var(--muted); }
.colunas-item label{ display:flex; align-items:center; gap:8px; cursor:inherit; min-width:0; }
.colunas-item .grip{ color:var(--muted); font-size:14px; line-height:1; width:12px; text-align:center; }
.colunas-item:hover .grip{ color:var(--pf-300); }
.colunas-item .grupo{ margin-left:auto; font-size:10px; letter-spacing:.6px; text-transform:uppercase; color:var(--muted); }
.colunas-divisor{
  display:flex; align-items:center; gap:8px; margin:6px 2px; font-size:10px; letter-spacing:.6px; text-transform:uppercase; color:var(--muted);
}
.colunas-divisor::before,.colunas-divisor::after{ content:""; flex:1; border-top:1px dashed var(--line-strong); }
.colunas-foot{ display:flex; gap:10px; padding:10px 12px; border-top:1px solid var(--line); font-size:11.5px; color:var(--muted); align-items:center; }
.colunas-foot .link{ margin-left:auto; }
.colunas-busca{ padding:8px 12px; border-bottom:1px solid var(--line); }
.colunas-busca input{ width:100%; box-sizing:border-box; font-size:12px; padding:6px 9px; }
.colunas-vazio[hidden]{ display:none !important; }
.colunas-vazio{ padding:6px 2px 0; font-size:12px; color:var(--muted); }
/* busca: nada some; quem não bate esmaece, quem bate ganha destaque */
.colunas-item.busca-fora{ opacity:.38; }
.colunas-item.busca-fora:hover{ opacity:.8; }
.colunas-item.busca-bate{ background:color-mix(in srgb, var(--pf-200, #7cc4ff) 14%, transparent); }
.colunas-item.busca-atual{ box-shadow:inset 0 0 0 1px var(--pf-200, #7cc4ff); }
.data-table thead .totais-row .name-cell{ color:var(--pf-200); font-weight:650; letter-spacing:.3px; }
.data-table thead .totais-row .strong{ font-weight:700; }

/* ── nível Anúncios em tabela (padrão) ── */
#drillCreatives .head-actions{ display:flex; align-items:center; flex-wrap:wrap; gap:14px; }
.vista-toggle{ align-items:center; flex:0 0 auto; margin-right:auto; }
#criativosTabela[hidden],#criativosGrid[hidden]{ display:none !important; }
.cr-mini-cell{ width:56px; padding-right:4px !important; }
.cr-mini{
  display:block; width:48px; height:48px; border-radius:7px; overflow:hidden;
  background:#0F150B; border:1px solid var(--line);
}
.cr-mini img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .2s; }
.cr-mini:hover img{ transform:scale(1.08); }
.cr-mini-vazia{ display:flex; align-items:center; justify-content:center; color:var(--muted); font-size:16px; }
.cr-mini-icone{
  width:34px; height:34px; display:flex; align-items:center; justify-content:center;
  font-size:14px; color:var(--pf-300); text-decoration:none; transition:.15s;
}
a.cr-mini-icone:hover{ border-color:var(--pf-300); background:rgba(255,166,0,.1); }
.cr-mini-cell{ width:44px; }
#criativosTable td.sorted-col{ color:var(--pf-200); }
#criativosTable .st{ font-size:10px; letter-spacing:.6px; padding:2px 6px; border-radius:4px; text-transform:uppercase; white-space:nowrap; }
#criativosTable .name-cell{ max-width:var(--nome-col-width, 280px); }
@keyframes pulse{ 0%,100%{ box-shadow:0 0 0 0 rgba(63,224,123,.45);} 50%{ box-shadow:0 0 0 7px rgba(63,224,123,0);} }

.refresh-box{ display:flex; align-items:center; gap:10px; }
.refresh-meta{ font-size:11px; color:var(--muted); min-width:120px; }

/* ─────────────── BOTÕES ─────────────── */
.btn{
  display:inline-flex; align-items:center; gap:7px; cursor:pointer; font:inherit; font-size:13px;
  padding:8px 14px; border-radius:9px; border:1px solid var(--line); color:var(--txt);
  background:rgba(78,15,10,.6); transition:.18s ease;
}
.btn:hover{ border-color:var(--line-strong); background:rgba(255,201,0,.16); transform:translateY(-1px); }
.btn:active{ transform:translateY(0); }
.btn-primary{ background:var(--grad); border-color:transparent; color:#0A1206; font-weight:650; }
.btn-primary:hover{ filter:brightness(1.1); background:var(--grad); }
.btn-sm{ padding:6px 11px; font-size:12px; }
.ico{ width:15px; height:15px; }
.link{ background:none; border:0; color:var(--pf-300); cursor:pointer; font:inherit; font-size:12px; padding:0; }
.link:hover{ text-decoration:underline; }

/* ─────────────── FILTROS ─────────────── */
/* z-index acima do body > * (1): os painéis de conta e campanha abrem por cima dos cards. */
.filters{
  display:flex; align-items:center; gap:16px; flex-wrap:wrap;
  padding:14px 26px; border-bottom:1px solid var(--line); background:rgba(42,0,0,.55);
  z-index:30;
}
.presets{ display:flex; gap:4px; padding:4px; border-radius:11px; border:1px solid var(--line); background:rgba(23,0,0,.6); }
.presets button{
  border:0; background:none; color:var(--txt-dim); font:inherit; font-size:12.5px;
  padding:6px 13px; border-radius:8px; cursor:pointer; transition:.16s; white-space:nowrap;
}
.presets button:hover{ color:var(--pf-200); background:rgba(255,166,0,.1); }
.presets button.active{ background:var(--grad); color:#0A1206; font-weight:650; }

.custom-range{ display:flex; align-items:center; gap:10px; }
.custom-range[hidden]{ display:none !important; }
.custom-range label{ display:flex; align-items:center; gap:6px; font-size:12px; color:var(--muted); }
input[type=date],input[type=number],input[type=text],select{
  font:inherit; font-size:13px; color:var(--txt); background:rgba(23,0,0,.7);
  border:1px solid var(--line); border-radius:8px; padding:7px 10px; color-scheme:dark;
}
input:focus,select:focus{ outline:none; border-color:var(--pf-400); box-shadow:0 0 0 3px rgba(255,166,0,.14); }

/* ── aba INBOX (painéis Alcateia em iframe) ── */
.inbox-shell{ display:flex; flex-direction:column; gap:0; border:1px solid var(--line); border-radius:var(--r); overflow:hidden; background:var(--bg-1); min-height:78vh; }
.inbox-subnav{ display:flex; gap:4px; padding:8px 10px; border-bottom:1px solid var(--line); background:rgba(42,0,0,.6); }
.inbox-subtab{ border:0; background:none; color:var(--txt-dim); font:inherit; font-size:13px; padding:8px 16px; border-radius:8px; cursor:pointer; transition:.16s; }
.inbox-subtab:hover{ color:var(--pf-200); background:rgba(255,166,0,.1); }
.inbox-subtab.active{ background:var(--grad); color:#0A1206; font-weight:650; }
#inboxFrame,#leadsFrame{ width:100%; flex:1; min-height:74vh; border:0; background:#fff; display:block; }

/* Seletor de contas: mesmo painel de checkboxes do filtro de campanhas. */
.account-filter{ position:relative; }
.account-filter[hidden]{ display:none !important; }
.account-filter .select-trigger{ min-width:250px; color:var(--pf-200); }
.account-filter .select-trigger span{ color:var(--txt); }
.account-filter .select-panel{ width:320px; }
.account-filter .select-list label span:first-of-type{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.account-filter .st-off{ background:rgba(255,255,255,.08); color:var(--muted); }

.campaign-filter{ position:relative; }
.select-trigger{
  display:flex; align-items:center; gap:8px; font:inherit; font-size:13px; cursor:pointer;
  padding:8px 14px; border-radius:9px; border:1px solid var(--line);
  background:rgba(78,15,10,.6); color:var(--txt); max-width:290px;
}
.select-trigger span{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.select-trigger:hover{ border-color:var(--line-strong); }
.select-panel{
  position:absolute; top:calc(100% + 8px); left:0; width:380px; z-index:60;
  border:1px solid var(--line-strong); border-radius:12px; background:var(--bg-2);
  box-shadow:var(--shadow); overflow:hidden;
}
.select-panel-head{ display:flex; gap:14px; padding:10px 14px; border-bottom:1px solid var(--line); }
.select-panel-search{ padding:8px 10px; border-bottom:1px solid var(--line); }
.select-panel-search input{ width:100%; font-size:12.5px; }
.drill-search{ display:flex; align-items:center; gap:12px; padding:10px 18px 4px; }
.drill-search input{ flex:0 1 360px; min-width:220px; font-size:12.5px; }
.cohort-intro{ display:flex; flex-direction:column; gap:4px; padding:14px 18px 10px; position:sticky; left:0; }
.cohort-intro b{ color:var(--pf-200); font-size:13px; }
.cohort-intro span,.cohort-empty{ color:var(--muted); font-size:12px; }
.cohort-controls{ display:flex; align-items:flex-end; gap:12px; flex-wrap:wrap; margin-top:10px; }
.cohort-controls label,.cohort-window{ display:flex; flex-direction:column; gap:5px; }
.cohort-controls input{ min-width:145px; padding:8px 10px; }
.cohort-controls input[type="number"]{ min-width:84px; width:84px; }
.cohort-window .seg{ flex-wrap:wrap; }
.cohort-status{ color:var(--pf-300) !important; min-height:16px; }
.cohort-selection-actions{ display:flex; align-items:center; justify-content:space-between; gap:12px; padding-top:10px; border-top:1px solid var(--line); }
.cohort-selection-actions span{ color:var(--txt-dim); }
.cohort-selection-actions button:disabled{ opacity:.45; cursor:not-allowed; }
.cohort-empty{ padding:22px 18px; }
.cohort-table{ min-width:1180px; }
.cohort-table .cohort-campaign{ min-width:360px; max-width:520px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
/* drilldown da coorte: campanha › conjunto › anúncio */
.cohort-toggle,.cohort-toggle-vazio{ display:inline-block; width:20px; margin-right:6px; vertical-align:middle; }
.cohort-toggle{ padding:0; border:0; background:none; color:var(--pf-300); font-size:12px; line-height:20px; cursor:pointer; border-radius:4px; }
.cohort-toggle:hover,.cohort-toggle:focus-visible{ background:rgba(255,166,0,.12); outline:none; }
.cohort-nome{ vertical-align:middle; }
.cohort-table .cohort-arte{ margin-right:8px; vertical-align:middle; }
#cohortTableWrap[hidden],#cohortCardsWrap[hidden]{ display:none !important; }
.cohort-cards{ padding:12px 0 4px; }
.cohort-selection-actions .vista-toggle{ margin-left:auto; }
.cohort-table tr.cohort-nivel-adset td{ background:rgba(255,166,0,.025); }
.cohort-table tr.cohort-nivel-adset .cohort-campaign{ padding-left:34px; color:var(--txt-dim); }
.cohort-table tr.cohort-nivel-ad td{ background:rgba(255,166,0,.05); font-size:12px; }
.cohort-table tr.cohort-nivel-ad .cohort-campaign{ padding-left:60px; color:var(--muted); }
.cohort-bucket b,.cohort-bucket small{ display:block; }
.cohort-bucket small{ color:var(--muted); margin-top:3px; font-size:10px; }
.criativos-actions{ justify-content:space-between; margin-bottom:12px; gap:14px; flex-wrap:wrap; }
.criativos-actions .drill-search{ padding:0; flex:1 1 320px; }
.criativos-actions .drill-search input{ flex:0 1 320px; }
#viewSelectedCardCampaigns[hidden]{ display:none !important; }
.select-list{ max-height:320px; overflow-y:auto; padding:6px; }
.select-list label{
  display:flex; align-items:center; gap:10px; padding:8px 10px; border-radius:8px;
  cursor:pointer; font-size:13px;
}
.select-list label:hover{ background:rgba(255,166,0,.08); }
.select-list .st{ font-size:10px; letter-spacing:.6px; padding:2px 6px; border-radius:4px; margin-left:auto; }
.st-active{ background:rgba(63,224,123,.14); color:var(--ok); }
.st-paused{ background:rgba(255,194,75,.14); color:var(--warn); }
.range-label{ margin-left:auto; font-size:12px; color:var(--muted); letter-spacing:.4px; }

/* ─────────────── AVISOS ─────────────── */
.notice-stack{ display:flex; flex-direction:column; gap:8px; padding:0 26px; margin-top:14px; }
/* precisa ser block: em flex, cada <code> inline vira um item próprio e o
   texto do aviso deixa de quebrar linha */
.notice{
  display:block; padding:12px 16px; border-radius:11px;
  font-size:13px; border:1px solid; line-height:1.7;
}
.notice-warn{ background:rgba(255,194,75,.08); border-color:rgba(255,194,75,.3); color:#FFDFA0; }
.notice-err{ background:rgba(255,107,122,.08); border-color:rgba(255,107,122,.3); color:#FFC3C9; }
.notice-info{ background:rgba(255,166,0,.07); border-color:var(--line-strong); color:var(--txt-dim); }
.notice b{ color:#fff; }

/* ─────────────── ABAS ─────────────── */
.tabs{ display:flex; gap:2px; padding:16px 26px 0; border-bottom:1px solid var(--line); }
.tabs button{
  border:0; background:none; font:inherit; font-size:13px; color:var(--muted); cursor:pointer;
  padding:10px 18px; border-radius:9px 9px 0 0; position:relative; transition:.16s;
}
.tabs button:hover{ color:var(--pf-200); }
.tabs button.active{ color:var(--pf-200); background:rgba(255,166,0,.07); }
.tabs button.active::after{
  content:""; position:absolute; left:14px; right:14px; bottom:-1px; height:2px;
  background:var(--grad); border-radius:2px;
}

main{ padding:22px 26px 40px; display:block; }
.tab-panel{ display:none; }
.tab-panel.active{ display:flex; flex-direction:column; gap:20px; animation:fade .28s ease; }

/* ── atribuição first-party ───────────────────────────────────────────── */
.tracking-intro{ display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:18px 20px; border:1px solid var(--line); border-radius:var(--r); background:linear-gradient(135deg,rgba(255,166,0,.08),rgba(14,20,11,.7)); }
.tracking-intro h2{ margin:0 0 5px; color:var(--txt); }
.tracking-intro p{ margin:0; color:var(--muted); max-width:780px; font-size:13px; }
.tracking-shadow{ padding:6px 10px; border-radius:999px; border:1px solid rgba(255,190,70,.35); color:var(--warn); font-size:11px; font-weight:700; white-space:nowrap; }
.tracking-kpis{ display:grid; grid-template-columns:repeat(5,minmax(150px,1fr)); gap:12px; }
.tracking-kpi{ padding:16px; border:1px solid var(--line); border-radius:var(--r); background:var(--bg-2); }
.tracking-kpi span{ display:block; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.7px; }
.tracking-kpi b{ display:block; margin-top:7px; color:var(--txt); font-family:var(--font-display); font-size:22px; font-variant-numeric:tabular-nums; }
.tracking-kpi small{ color:var(--muted); font-size:11px; }
.tracking-recon{ padding:18px 20px; font-size:13px; color:var(--txt-dim); }
.tracking-recon.ok{ border-color:rgba(255,166,0,.3); }
.tracking-recon.alerta{ border-color:rgba(255,96,112,.45); }
.tracking-bucket{ display:inline-flex; padding:3px 8px; border-radius:999px; background:rgba(255,166,0,.09); color:var(--pf-200); font-size:11px; }
.tracking-link-form{ display:grid; grid-template-columns:repeat(5,minmax(130px,1fr)); gap:9px; padding:16px 18px; border-bottom:1px solid var(--line); }
.tracking-link-form input,.tracking-link-form select{ min-width:0; }
.tracking-link-form .tracking-wide{ grid-column:span 2; }
.tracking-link-error{ padding:8px 18px; margin:0; }
.tracking-config-hint{ margin:0; padding:12px 18px; color:var(--warn); background:rgba(255,190,70,.08); border-bottom:1px solid var(--line); }
.tracking-owner-map{ margin:0; padding:10px 18px; color:var(--muted); font-size:11px; border-bottom:1px solid var(--line); }
.tracking-actions{ display:flex; align-items:center; gap:6px; white-space:nowrap; }
#trackingLinks .url-cell{ max-width:430px; overflow:hidden; text-overflow:ellipsis; }
@media(max-width:900px){ .tracking-kpis{ grid-template-columns:repeat(2,minmax(140px,1fr)); } .tracking-intro{ flex-direction:column; } }
@media(max-width:900px){ .tracking-link-form{ grid-template-columns:repeat(2,minmax(130px,1fr)); } .tracking-link-form .tracking-wide{ grid-column:span 2; } }
@keyframes fade{ from{ opacity:0; transform:translateY(6px);} to{ opacity:1; transform:none;} }

/* ─────────────── CARDS ─────────────── */
.card{
  border:1px solid var(--line); border-radius:var(--r); background:linear-gradient(180deg, rgba(58,6,5,.78), rgba(42,0,0,.62));
  box-shadow:var(--shadow); overflow:hidden;
}
.card-head{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:15px 20px; border-bottom:1px solid var(--line);
}
.card-head h2{ font-size:14px; letter-spacing:1.6px; text-transform:uppercase; color:var(--pf-200); }
.card-head h2::before{
  content:"▸"; color:var(--pf-400); margin-right:8px; font-size:11px; vertical-align:1px;
}
.pad{ padding:20px; }
.muted-note{ font-size:11.5px; color:var(--muted); }
.sub-title{ font-size:12px; letter-spacing:1.4px; text-transform:uppercase; color:var(--txt-dim); margin-bottom:12px; }
.rule{ border:0; border-top:1px solid var(--line); margin:22px 0 18px; }

.split{ display:grid; grid-template-columns:1.65fr 1fr; gap:20px; align-items:start; }
.split-wide{ grid-template-columns:1fr 1.15fr; }
.split-even{ grid-template-columns:1fr 1fr; }
@media (max-width:1180px){ .split,.split-wide,.split-even{ grid-template-columns:1fr; } }

/* ─────────────── KPIs ─────────────── */
.kpi-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(178px,1fr)); gap:14px; }
.kpi{
  position:relative; padding:16px 17px; border:1px solid var(--line); border-radius:12px;
  background:linear-gradient(160deg, rgba(78,15,10,.8), rgba(42,0,0,.55));
  overflow:hidden; transition:.2s;
}
.kpi::after{
  content:""; position:absolute; top:0; left:0; width:3px; height:100%;
  background:var(--grad); opacity:.85;
}
.kpi:hover{ transform:translateY(-2px); border-color:var(--line-strong); box-shadow:var(--glow); }
.kpi-label{ font-size:10.5px; letter-spacing:1.5px; text-transform:uppercase; color:var(--muted); }
.kpi-value{
  font-family:var(--font-display); font-size:27px; font-weight:650; letter-spacing:.3px;
  margin-top:7px; color:#fff; font-variant-numeric:tabular-nums;
}
.kpi-foot{ display:flex; align-items:center; gap:8px; margin-top:8px; font-size:11.5px; flex-wrap:wrap; }
.delta{ display:inline-flex; align-items:center; gap:3px; font-weight:600; }
.delta.up{ color:var(--ok); } .delta.down{ color:var(--bad); } .delta.flat{ color:var(--muted); }
.kpi-sub{ color:var(--muted); }
.goal-pill{ font-size:10px; padding:2px 7px; border-radius:5px; letter-spacing:.4px; }
.goal-ok{ background:rgba(63,224,123,.13); color:var(--ok); }
.goal-bad{ background:rgba(255,107,122,.13); color:var(--bad); }

/* ─────────────── FUNIL ─────────────── */
.funnel-wrap{ padding:18px 12px 22px; }
.funnel-wrap svg{ width:100%; height:auto; display:block; }
.fn-band{ cursor:default; transition:.18s; }
.fn-band:hover .fn-shape{ filter:brightness(1.22); }
/* Fora da faixa (coluna da esquerda, sobre o fundo escuro): texto claro.
   Regra CSS vence atributo fill no SVG — a cor precisa morar aqui. */
.fn-name{ font-family:var(--font-display); font-size:13.5px; fill:var(--txt); font-weight:650; letter-spacing:.3px; }
.fn-hint{ font-size:10.5px; fill:var(--muted); letter-spacing:.2px; }

/* Dentro da faixa verde: texto escuro. */
.fn-val{ font-family:var(--font-display); font-size:17px; font-weight:700; fill:#0A1508; font-variant-numeric:tabular-nums; }
.fn-inband{ font-size:10px; fill:rgba(10,18,6,.7); letter-spacing:.2px; }
.fn-side{ font-size:11px; fill:var(--muted); font-variant-numeric:tabular-nums; }
.fn-conv{ font-family:var(--font-display); font-size:13px; font-weight:650; fill:var(--pf-200); font-variant-numeric:tabular-nums; }
.fn-conv-sub{ font-size:9.5px; fill:var(--muted); letter-spacing:.5px; text-transform:uppercase; }
.fn-drop{ font-size:10.5px; fill:#FF8A96; font-variant-numeric:tabular-nums; }
.fn-leak-box{ fill:rgba(255,107,122,.09); stroke:rgba(255,107,122,.42); stroke-width:1; }
.fn-leak-name{ font-size:11px; fill:#FFB3BB; letter-spacing:.3px; }
.fn-leak-val{ font-family:var(--font-display); font-size:15px; font-weight:700; fill:#FF9BA6; font-variant-numeric:tabular-nums; }
.fn-conn{ stroke:var(--line-strong); stroke-width:1; stroke-dasharray:3 4; fill:none; }
.fn-tag{ font-size:9px; letter-spacing:1px; text-transform:uppercase; }
.fn-tag-meta{ fill:var(--pf-400); } .fn-tag-crm{ fill:#B98CFF; }

/* ─────────────── DIAGNÓSTICO ─────────────── */
.diagnostico{ padding:0 20px 20px; }

/* ── relatório do período ── */
.relatorio{ display:flex; flex-direction:column; gap:16px; }
.rel-head{ display:flex; align-items:flex-start; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.rel-head h3{ font-size:13px; letter-spacing:1.2px; text-transform:uppercase; color:var(--pf-200); }
.rel-periodo{ display:block; margin-top:4px; font-size:12px; color:var(--muted); }

.rel-veredito{ padding:14px 16px; border-radius:11px; border:1px solid var(--line); border-left-width:3px; background:rgba(42,0,0,.5); }
.rel-veredito h4{ font-size:13.5px; font-weight:650; color:#fff; margin-bottom:5px; }
.rel-veredito p{ font-size:12.5px; color:var(--txt-dim); line-height:1.6; }
.rel-veredito b{ color:var(--pf-200); }
.rel-bom{ border-left-color:var(--ok); background:rgba(63,224,123,.06); }
.rel-atencao{ border-left-color:var(--warn); background:rgba(255,194,75,.06); }
.rel-critico{ border-left-color:var(--bad); background:rgba(255,107,122,.06); }
.rel-neutro{ border-left-color:var(--muted); }
.rel-info{ border-left-color:var(--pf-400); }

.rel-bloco h5{
  font-size:10.5px; letter-spacing:1.3px; text-transform:uppercase; color:var(--muted);
  margin-bottom:10px; display:flex; align-items:center; gap:8px;
}
.rel-bloco h5 em{
  font-style:normal; font-size:10px; letter-spacing:.4px; text-transform:none;
  padding:2px 7px; border-radius:5px; background:rgba(255,166,0,.13); color:var(--pf-300);
}
.rel-texto{ font-size:12.5px; color:var(--txt-dim); line-height:1.65; }
.rel-texto b{ color:var(--pf-200); }

.rel-nums{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; }
.rel-num{
  display:flex; flex-direction:column; gap:3px; padding:11px 13px;
  border:1px solid var(--line); border-radius:10px; background:rgba(23,0,0,.45);
}
.rel-num-label{ font-size:9.5px; letter-spacing:1px; text-transform:uppercase; color:var(--muted); }
.rel-num b{ font-size:17px; color:#fff; font-weight:650; letter-spacing:-.3px; }
.rel-var{ font-size:10.5px; }
.rel-var-up{ color:var(--ok); }
.rel-var-down{ color:var(--bad); }
.rel-var-flat{ color:var(--muted); }
.rel-ritmo{ margin-top:10px; font-size:12px; color:var(--txt-dim); line-height:1.6; }
.rel-ritmo b{ color:var(--pf-200); }

.rel-lista{ list-style:none; display:flex; flex-direction:column; gap:9px; }
.rel-item{
  padding:12px 14px; border-radius:10px; border:1px solid var(--line);
  border-left-width:3px; background:rgba(23,0,0,.45); counter-increment:rel;
}
.rel-item-titulo{ font-size:12.5px; font-weight:650; color:#fff; }
.rel-item-texto{ font-size:12px; color:var(--txt-dim); margin-top:4px; line-height:1.55; }
.rel-item-texto b{ color:var(--pf-200); }
.rel-item-acao{ font-size:11.5px; color:var(--txt-dim); margin-top:7px; }
.rel-item-acao span{
  font-size:9.5px; letter-spacing:1px; text-transform:uppercase; color:var(--pf-300);
  padding:2px 6px; border-radius:4px; background:rgba(255,166,0,.13); margin-right:6px;
}
.rel-item-acao b{ color:var(--pf-200); }

@media (max-width:640px){
  .rel-nums{ grid-template-columns:repeat(auto-fit,minmax(130px,1fr)); }
  .rel-num b{ font-size:15px; }
}

/* ─────────────── GRÁFICO ─────────────── */
.chart-wrap{ padding:18px 20px 6px; position:relative; }
.chart-wrap svg{ width:100%; height:auto; display:block; overflow:visible; }
.ch-grid{ stroke:rgba(248,208,106,.08); stroke-width:1; }
.ch-axis{ font-size:10px; fill:var(--muted); font-variant-numeric:tabular-nums; }
.ch-bar{ fill:url(#barGrad); transition:.15s; }
.ch-bar:hover{ fill:var(--pf-300); }
.ch-line{ fill:none; stroke:#FFC24B; stroke-width:2.2; stroke-linejoin:round; stroke-linecap:round; }
.ch-dot{ fill:#FFC24B; stroke:var(--bg-1); stroke-width:2; }
.ch-hover{ fill:rgba(255,166,0,.07); }
.chart-legend{ display:flex; gap:20px; padding:6px 20px 18px; font-size:11.5px; color:var(--muted); }
.sw{ display:inline-block; width:11px; height:11px; border-radius:3px; vertical-align:-1px; margin-right:5px; }
.sw-bar{ background:linear-gradient(180deg,var(--pf-300),var(--pf-700)); }
.sw-line{ background:#FFC24B; }
.ch-tip{
  position:absolute; pointer-events:none; z-index:20; padding:9px 12px; border-radius:9px;
  background:rgba(23,0,0,.96); border:1px solid var(--line-strong); box-shadow:var(--shadow);
  font-size:12px; white-space:nowrap; transform:translate(-50%,-115%); opacity:0; transition:opacity .12s;
}
.ch-tip.on{ opacity:1; }
.ch-tip .t-date{ color:var(--pf-200); font-weight:650; margin-bottom:5px; letter-spacing:.4px; }
.ch-tip .t-row{ display:flex; justify-content:space-between; gap:18px; color:var(--txt-dim); }
.ch-tip .t-row b{ color:#fff; font-variant-numeric:tabular-nums; }
.ch-tip .t-active span{ color:#FFC24B; } .ch-tip .t-active b{ color:#FFC24B; }

/* ─────────────── SEGMENTOS ─────────────── */
.seg{ display:flex; gap:3px; padding:3px; border-radius:9px; border:1px solid var(--line); background:rgba(23,0,0,.6); }
.seg button{
  border:0; background:none; color:var(--muted); font:inherit; font-size:11.5px;
  padding:5px 11px; border-radius:7px; cursor:pointer; transition:.15s; white-space:nowrap;
}
.seg button:hover{ color:var(--pf-200); }
.seg button.active{ background:rgba(255,166,0,.16); color:var(--pf-200); font-weight:600; }

/* ─────────────── TABELAS ─────────────── */
.table-wrap{ overflow-x:auto; }
/*
 * Aba Anúncios: a tabela rola dentro de uma área do tamanho da janela, como
 * no Gerenciador da Meta. A barra horizontal fica sempre à vista no pé dessa
 * área (não no fim da página) e o cabeçalho com os totais acompanha a rolagem.
 */
[data-panel="anuncios"] .table-wrap{ overflow:auto; max-height:calc(100vh - 150px); overscroll-behavior-x:contain; }
[data-panel="anuncios"] .table-wrap thead{ position:sticky; top:0; z-index:3; background:var(--bg-2); }
[data-panel="anuncios"] .table-wrap .drill-search{ position:sticky; left:0; }
.table-scroll{ max-height:430px; overflow-y:auto; }
.data-table{ width:100%; border-collapse:collapse; font-size:12.5px; }
.data-table th{
  position:sticky; top:0; z-index:2; text-align:left; padding:11px 14px; font-weight:600;
  font-size:10.5px; letter-spacing:1.2px; text-transform:uppercase; color:var(--muted);
  background:var(--bg-2); border-bottom:1px solid var(--line); white-space:nowrap;
}
.sortable th{ cursor:pointer; user-select:none; }
.sortable th:hover{ color:var(--pf-300); }
.sortable th.sorted::after{ content:" ▾"; color:var(--pf-400); }
.sortable th.sorted.asc::after{ content:" ▴"; }
.data-table td{ padding:11px 14px; border-bottom:1px solid rgba(248,208,106,.07); color:var(--txt-dim); white-space:nowrap; }
.data-table tbody tr:hover td{ background:rgba(255,166,0,.05); color:var(--txt); }
.data-table td.strong{ color:#fff; font-weight:600; }
/*
 * Coluna do nome congelada. Com trinta colunas de métrica, rolar para o lado
 * fazia perder de vista de quem era a linha. A caixa de seleção e o nome ficam
 * presos à esquerda; precisam de fundo próprio, senão o conteúdo que passa por
 * baixo aparece através deles.
 */
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) .data-table th.sel-col,
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) .data-table td.sel-col{
  position:sticky; left:0; z-index:4; background:var(--bg-2);
}
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) .data-table th.cr-mini-cell,
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) .data-table td.cr-mini-cell{
  position:sticky; left:0; z-index:3; background:var(--bg-2);
}
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) .data-table th.name-cell,
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) .data-table td.name-cell{
  position:sticky; left:34px; z-index:4; background:var(--bg-2);
  box-shadow:1px 0 0 var(--line-strong);
}
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) #campaignTable thead th:nth-child(2),
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) #adsetTable thead th:nth-child(2){
  position:sticky; left:34px; z-index:4; background:var(--bg-2);
  box-shadow:1px 0 0 var(--line-strong);
}
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) :is(#campaignTable,#adsetTable) .status-col{
  position:sticky; left:34px; z-index:4; background:var(--bg-2);
}
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) :is(#campaignTable,#adsetTable) .name-cell{
  left:82px;
}
/* Largura ajustável pelo operador; o mínimo impede a tabela de esmagar o nome. */
[data-panel="anuncios"] .data-table .name-cell{
  width:var(--nome-col-width, 280px); min-width:var(--nome-col-width, 280px); max-width:var(--nome-col-width, 280px);
}
.name-cell-resizable{ position:relative; padding-right:18px !important; }
.col-resize-nome{
  position:absolute; top:0; right:-5px; bottom:0; width:10px; z-index:8;
  cursor:col-resize; touch-action:none;
}
.col-resize-nome::after{
  content:""; position:absolute; top:20%; bottom:20%; left:4px; width:2px;
  border-radius:2px; background:rgba(248,208,106,.28);
}
.col-resize-nome:hover::after,.col-resize-nome.arrastando::after{ background:var(--pf-300); }
body.redimensionando-coluna{ cursor:col-resize; user-select:none; }
body.redimensionando-coluna *{ cursor:col-resize !important; }
/* o cabeçalho já é sticky no topo: sobreposto, precisa vencer as células */
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) .data-table thead th.sel-col,
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) .data-table thead th.cr-mini-cell,
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) .data-table thead th.status-col,
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) .data-table thead th.name-cell{ z-index:6; }
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) .data-table thead .totais-row td.sel-col,
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) :is(#campaignTable,#adsetTable) thead .totais-row td.status-col,
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) .data-table thead .totais-row td.name-cell,
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) .data-table thead .totais-row td.cr-mini-cell{ z-index:6; }
/* linha destacada não pode ficar transparente na parte congelada */
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) .data-table tbody tr:hover td.sel-col,
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) :is(#campaignTable,#adsetTable) tbody tr:hover td.status-col,
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) .data-table tbody tr:hover td.name-cell,
[data-panel="anuncios"]:is(.congelar-nome,.congelar-investido) .data-table tbody tr:hover td.cr-mini-cell{ background:var(--surface-hover, #1a2414); }
#btnCongelar[aria-pressed="true"],#btnCongelarInvestido[aria-pressed="true"]{ border-color:var(--pf-400); color:var(--pf-200); }

/* Congelar Investido também prende nome/seleção, para a métrica não
 * ficar solta por cima da identificação da linha. */
[data-panel="anuncios"].congelar-investido .data-table [data-col="investimento"]{
  position:sticky; left:var(--investimento-left, 364px); z-index:3;
  background:var(--bg-2); box-shadow:-1px 0 0 var(--bg-2), 1px 0 0 var(--line-strong);
}
[data-panel="anuncios"].congelar-investido .data-table thead [data-col="investimento"]{ z-index:5; }
[data-panel="anuncios"].congelar-investido .data-table tbody tr:hover td[data-col="investimento"]{
  background:var(--surface-hover, #1a2414);
}

/* Aba Anúncios: mini barreira vertical à esquerda de cada coluna de métrica
 * (traço curto, centrado na linha) para separar os blocos sem virar grade. */
[data-panel="anuncios"] .data-table td.num{ position:relative; }
[data-panel="anuncios"] .data-table th.num::before,
[data-panel="anuncios"] .data-table td.num::before{
  content:""; position:absolute; left:0; top:22%; height:56%; width:1px;
  background:rgba(248,208,106,.22);
}
[data-panel="anuncios"] .data-table th.num::before{ background:rgba(248,208,106,.32); top:18%; height:64%; }
[data-panel="anuncios"] .data-table thead .totais-row td.num::before{ background:rgba(248,208,106,.32); }
.data-table .name-cell{ max-width:330px; overflow:hidden; text-overflow:ellipsis; color:var(--txt); }
.leak-row td{ color:#FFB3BB; background:rgba(255,107,122,.04); }
.empty-row td{ text-align:center; color:var(--muted); padding:30px; font-style:italic; }
.pill{ padding:2px 8px; border-radius:5px; font-size:10.5px; letter-spacing:.4px; }
.pill-meta{ background:rgba(255,166,0,.13); color:var(--pf-300); }
.pill-crm{ background:rgba(185,140,255,.14); color:#C9A8FF; }
.pill-manual{ background:rgba(255,194,75,.13); color:var(--warn); }
.pill-demo{ background:rgba(255,194,75,.1); color:var(--warn); }
.icon-btn{ background:none; border:0; color:var(--muted); cursor:pointer; font-size:14px; padding:2px 6px; border-radius:5px; }
.icon-btn:hover{ color:var(--bad); background:rgba(255,107,122,.1); }

/* ─────────────── FORMULÁRIOS / CRM ─────────────── */
.lead-text{ font-size:13px; color:var(--txt-dim); margin:0 0 18px; line-height:1.6; }
.lead-text code,.hint code{ color:var(--pf-200); background:rgba(255,166,0,.1); padding:1px 5px; border-radius:4px; }
.field-label{ display:block; font-size:10.5px; letter-spacing:1.3px; text-transform:uppercase; color:var(--muted); margin:16px 0 7px; }
.copy-row{
  display:flex; align-items:flex-start; gap:10px; padding:11px 13px; border-radius:9px;
  border:1px solid var(--line); background:rgba(23,0,0,.6);
}
/* min-width:0 deixa o item flex encolher abaixo do conteúdo e rolar por dentro */
.copy-row code,.copy-row pre{ flex:1; min-width:0; margin:0; color:var(--pf-100); overflow-x:auto; white-space:pre; }
.copy-block pre{ line-height:1.6; }
.chips{ display:flex; flex-wrap:wrap; gap:6px; }
.chip{
  padding:4px 10px; border-radius:6px; font-size:11.5px; font-family:"Cascadia Mono",Consolas,monospace;
  border:1px solid var(--line); background:rgba(255,166,0,.07); color:var(--pf-200);
}
.hint{ font-size:12px; color:var(--muted); line-height:1.65; margin-top:14px; }
.hint b{ color:var(--txt-dim); }

/* ── drilldown campanha › conjunto › criativo ── */
tr.drill-row{ cursor:pointer; transition:background .14s; }
tr.drill-row:hover{ background:rgba(255,166,0,.07); }
tr.drill-row:hover .drill-caret{ color:var(--pf-200); transform:translateX(2px); }
.drill-caret{ display:inline-block; margin-right:8px; color:var(--muted); transition:.14s; font-size:11px; }
/* ── níveis da aba Anúncios: campanhas · conjuntos · anúncios ── */
.ads-subtabs{ display:flex; gap:4px; padding:4px 18px 0; flex-wrap:wrap; }
.ads-navigation-row{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding-right:12px; border-bottom:1px solid rgba(255,166,0,.08);
}
.ads-navigation-row .ads-subtabs{ flex:1 1 auto; }
.ads-navigation-row .colunas-wrap{ display:flex; align-items:center; gap:5px; flex:0 0 auto; }
.ads-navigation-row .colunas-wrap .btn{ padding:6px 9px; font-size:11px; }
/* Um nível por vez: regras de layout nunca podem reexibir painéis marcados
 * como ocultos pela navegação do Gerenciador. */
[data-panel="anuncios"] :is(#campaignSearchBar,#drillCampaigns,#drillAdsets,#drillCreatives,#drillCohorts)[hidden]{
  display:none !important;
}
.ads-subtab{
  padding:9px 16px; font:inherit; font-size:13px; font-weight:600; line-height:1;
  color:var(--muted); background:transparent; border:none; border-bottom:2px solid transparent;
  cursor:pointer; transition:color .14s, border-color .14s;
}
.ads-subtab:hover{ color:var(--txt); }
.ads-subtab.active{ color:var(--pf-300); border-bottom-color:var(--pf-300); }
.ads-subtab:focus-visible{ outline:2px solid var(--pf-300); outline-offset:-2px; border-radius:6px; }

/* filtros ativos */
.ads-filters{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:12px 18px 0; }
.ads-chip{
  display:inline-flex; align-items:center; gap:7px; max-width:320px;
  padding:5px 10px; font:inherit; font-size:12px; line-height:1.4;
  color:var(--txt); background:rgba(255,166,0,.08);
  border:1px solid rgba(255,166,0,.28); border-radius:999px; cursor:pointer;
  transition:background .14s, border-color .14s;
}
.ads-chip:hover{ background:rgba(255,166,0,.16); border-color:rgba(255,166,0,.5); }
.ads-chip .ac-tag{
  font-size:9px; letter-spacing:.8px; text-transform:uppercase; color:var(--pf-300);
  padding:2px 6px; border-radius:4px; background:rgba(255,166,0,.14); flex:none;
}
.ads-chip .ac-x{ color:var(--muted); font-size:14px; line-height:1; flex:none; }
.ads-chip:hover .ac-x{ color:var(--txt); }
.ads-chip-clear{ background:transparent; border-style:dashed; color:var(--muted); }

.ads-classification-toolbar{
  display:flex; align-items:flex-end; gap:10px; flex-wrap:wrap;
  margin:8px 14px 0; padding:10px 12px;
  background:rgba(255,166,0,.035); border:1px solid rgba(255,166,0,.17); border-radius:10px;
}
.ads-classification-title{ min-width:190px; margin-right:auto; align-self:center; }
.ads-classification-title b{ display:block; color:var(--pf-200); font-size:12px; text-transform:uppercase; letter-spacing:.7px; }
.ads-classification-title span{ display:block; margin-top:3px; color:var(--muted); font-size:11px; }
.ads-classification-toolbar :is(label,.filtro-campo){ display:grid; gap:4px; min-width:155px; }
.ads-classification-toolbar :is(label,.filtro-campo) > span{ color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.65px; }
.ads-classification-toolbar select{ min-width:155px; padding:7px 30px 7px 9px; font-size:12px; }
.ads-classification-toolbar .btn{ align-self:flex-end; }
.overview-classification-toolbar{ margin:0 0 14px; }

/* coluna de seleção das tabelas */
.data-table th.sel-col, .data-table td.sel-col{ width:34px; padding-left:14px; padding-right:0; text-align:center; }
.data-table th.status-col,.data-table td.status-col{ width:48px; min-width:48px; padding-left:8px; padding-right:8px; text-align:center; }
.sel-col input[type="checkbox"]{ width:15px; height:15px; accent-color:var(--pf-300); cursor:pointer; vertical-align:middle; }
tr.drill-row.is-selected{ background:rgba(255,166,0,.09); }
tr.drill-row.is-selected:hover{ background:rgba(255,166,0,.13); }
.row-sub{ display:block; margin-top:3px; font-size:11px; color:var(--muted); }
.meta-status-toggle{
  position:relative; display:inline-block; width:36px; height:20px; border-radius:999px;
  vertical-align:middle; padding:0; cursor:default; user-select:none; pointer-events:auto;
  background:#313a2e; border:1px solid rgba(255,255,255,.13); box-sizing:border-box;
}
.meta-status-toggle i{
  position:absolute; top:2px; left:2px; width:14px; height:14px; border-radius:50%;
  background:#a7b0a3; box-shadow:0 1px 2px rgba(0,0,0,.45); transition:none;
}
.meta-status-toggle.is-on{ background:#168dcc; border-color:#168dcc; }
.meta-status-toggle.is-on i{ left:18px; background:#fff; }
.meta-status-toggle[data-opt-action]{ cursor:pointer; transition:filter .14s,box-shadow .14s; }
.meta-status-toggle[data-opt-action]:hover{ filter:brightness(1.16); box-shadow:0 0 0 3px rgba(22,141,204,.14); }
.meta-status-toggle[data-opt-action]:focus-visible{ outline:2px solid var(--pf-300); outline-offset:2px; }
.meta-status-toggle:disabled{ cursor:wait; opacity:.62; }
.cr-status-toggle{ position:absolute; top:8px; left:8px; z-index:2; }
.cr-card-select{
  position:absolute; top:8px; right:8px; z-index:3; width:28px; height:28px;
  display:grid; place-items:center; cursor:pointer; border-radius:7px;
  background:rgba(7,12,5,.88); border:1px solid rgba(248,208,106,.48);
  box-shadow:0 2px 9px rgba(0,0,0,.35); backdrop-filter:blur(5px);
}
.cr-card-select input{ position:absolute; opacity:0; pointer-events:none; }
.cr-card-select span{
  width:15px; height:15px; border-radius:3px; border:1px solid rgba(255,255,255,.72);
  background:rgba(255,255,255,.05); position:relative;
}
.cr-card-select input:checked + span{ background:var(--pf-300); border-color:var(--pf-200); }
.cr-card-select input:checked + span::after{
  content:'✓'; position:absolute; inset:-3px 0 0; text-align:center;
  color:#102000; font-size:14px; font-weight:900;
}
.cr-card-select:has(input:focus-visible){ outline:2px solid #fff; outline-offset:2px; }

.drill-summary{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; margin:14px 18px 0; padding:12px 16px; border:1px solid var(--line); border-radius:11px; background:rgba(255,166,0,.05); }
.ds-tag{ font-size:10px; letter-spacing:1px; text-transform:uppercase; padding:3px 8px; border-radius:5px; background:rgba(255,166,0,.14); color:var(--pf-300); }
.ds-item{ position:relative; display:flex; flex-direction:column; gap:2px; }
.ds-item + .ds-item::before{
  content:'|'; position:absolute; left:-9px; top:50%; transform:translateY(-50%);
  color:var(--line-strong); font-size:20px; font-weight:300; line-height:1;
}
.ds-item span{ font-size:10px; letter-spacing:.6px; text-transform:uppercase; color:var(--muted); }
.ds-item b{ font-size:15px; color:var(--txt); font-variant-numeric:tabular-nums; }

/* ── criativos ── */
.criativos-grid{
  display:grid; gap:16px; margin-top:6px;
  grid-template-columns:repeat(auto-fill, minmax(290px, 1fr));
}
.cr-card{
  border:1px solid var(--line); border-radius:12px; overflow:hidden;
  background:rgba(255,255,255,.015); display:flex; flex-direction:column;
  transition:border-color .18s, transform .18s;
}
.cr-card:hover{ border-color:rgba(255,166,0,.4); transform:translateY(-2px); }
.cr-art{
  position:relative; aspect-ratio:1/1; background:#0F150B;
  display:grid; place-items:center; overflow:hidden; border-bottom:1px solid var(--line);
}
.cr-art-zoom{ display:block; width:100%; height:100%; }
.cr-art img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .25s; }
.cr-card:hover .cr-art img{ transform:scale(1.03); }
.cr-art-vazia{ text-align:center; color:var(--muted); font-size:11px; letter-spacing:1.4px; text-transform:uppercase; }
.cr-art-vazia b{ display:block; font-size:26px; margin-bottom:6px; opacity:.55; }
.cr-badge{
  position:absolute; top:8px; left:8px; font-size:9.5px; letter-spacing:1.1px;
  text-transform:uppercase; padding:3px 7px; border-radius:5px;
  background:rgba(10,21,8,.82); color:var(--pf-200); backdrop-filter:blur(4px);
}
.cr-badge.pausado{ color:#FFC98A; }
.cr-body{ padding:13px 14px 14px; display:flex; flex-direction:column; gap:10px; flex:1; }
.cr-nome{
  font-size:12.5px; font-weight:600; color:var(--txt); line-height:1.35;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.cr-camp{ font-size:10.5px; color:var(--muted); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.cr-metricas{ display:grid; grid-template-columns:1fr 1fr; gap:9px 10px; margin-top:auto; }
.cr-met{ display:flex; flex-direction:column; gap:2px; }
.cr-met-wide{ grid-column:1 / -1; padding-top:8px; border-top:1px solid var(--line); }
.cr-met span{ font-size:9.5px; letter-spacing:.9px; text-transform:uppercase; color:var(--muted); }
.cr-met b{ font-size:14px; font-weight:650; color:var(--txt); font-variant-numeric:tabular-nums; }
.cr-met.destaque b{ color:var(--pf-200); }
.cr-barra{ height:3px; border-radius:2px; background:rgba(255,255,255,.07); overflow:hidden; }
.cr-barra i{ display:block; height:100%; background:linear-gradient(90deg, var(--pf-400), var(--pf-200)); }

/* funil dentro do card do criativo */
.crf{ border-top:1px solid var(--line); margin-top:2px; padding-top:10px; }
.crf summary{
  cursor:pointer; font-size:10.5px; letter-spacing:1px; text-transform:uppercase;
  color:var(--pf-300); list-style:none; user-select:none;
}
.crf summary::-webkit-details-marker{ display:none; }
.crf summary::before{ content:'▸ '; display:inline-block; transition:transform .15s; }
.crf[open] summary::before{ content:'▾ '; }
.crf summary:hover{ color:var(--pf-200); }
.crf-corpo{ margin-top:10px; display:flex; flex-direction:column; gap:5px; }
.crf-linha{ display:grid; grid-template-columns:1fr 46px 40px; align-items:center; gap:7px; }
.crf-nome{ font-size:10.5px; color:var(--txt-dim); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.crf-barra{ height:4px; border-radius:2px; background:rgba(255,255,255,.06); overflow:hidden; }
.crf-barra i{ display:block; height:100%; background:linear-gradient(90deg, var(--pf-500), var(--pf-300)); }
.crf-val{ font-size:11px; text-align:right; color:var(--txt); font-variant-numeric:tabular-nums; }
.crf-linha.vazamento .crf-nome{ color:#FF9BA6; }
.crf-linha.vazamento .crf-barra i{ background:linear-gradient(90deg, #A8434F, #FF8A96); }
.crf-linha.sem-dado .crf-nome,
.crf-linha.sem-dado .crf-val{ opacity:.42; }

.sel-inline{ display:flex; align-items:center; gap:8px; font-size:11px; color:var(--muted); }
.sel-inline select{ padding:5px 9px; font-size:12px; }

.integra{ padding:16px 0; border-top:1px solid var(--line); }
.integra:first-of-type{ border-top:0; padding-top:0; }
.integra-head{ display:flex; align-items:center; gap:10px; margin-bottom:10px; }
.integra-nome{ font-family:var(--font-display); font-size:14px; font-weight:650; color:var(--pf-200); letter-spacing:.4px; }
.integra-tag{
  font-size:10px; letter-spacing:1px; text-transform:uppercase; padding:3px 8px;
  border-radius:5px; background:rgba(255,166,0,.12); color:var(--pf-300);
}
.integra .hint{ margin-top:10px; }

.manual-form{ display:flex; flex-direction:column; gap:16px; align-items:flex-start; }
.manual-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:12px; width:100%; }
.field{ display:flex; flex-direction:column; gap:5px; font-size:11px; letter-spacing:.8px; text-transform:uppercase; color:var(--muted); }
.field input{ text-transform:none; letter-spacing:normal; font-size:13px; }
.form-msg{ font-size:12px; color:var(--ok); }
.form-msg.err{ color:var(--bad); }
.check{ display:flex; align-items:center; gap:9px; font-size:12.5px; color:var(--txt-dim); margin:18px 0; cursor:pointer; }
.check input{ width:15px; height:15px; accent-color:var(--pf-400); }
.row-actions{ display:flex; gap:10px; margin-top:16px; flex-wrap:wrap; }
.map-fields{ display:flex; flex-direction:column; gap:14px; }
.map-field label{ display:block; font-size:11px; letter-spacing:1px; text-transform:uppercase; color:var(--muted); margin-bottom:6px; }
.map-field input{ width:100%; }
.map-field .map-hint{ font-size:11px; color:var(--muted); margin-top:5px; }
.found-list{ margin-top:16px; display:flex; flex-wrap:wrap; gap:6px; }
.found-list .chip{ cursor:pointer; }
.found-list .chip:hover{ background:rgba(255,166,0,.18); border-color:var(--line-strong); }
.conn-detail{ display:flex; flex-direction:column; gap:9px; font-size:12.5px; }
.conn-row{ display:flex; justify-content:space-between; gap:16px; padding:9px 0; border-bottom:1px solid rgba(248,208,106,.07); }
.conn-row span:first-child{ color:var(--muted); }
.conn-row span:last-child{ color:var(--txt); text-align:right; }

/* ─────────────── RODAPÉ / TOAST ─────────────── */
.foot{
  display:flex; gap:10px; align-items:center; justify-content:center; padding:22px;
  border-top:1px solid var(--line); font-size:11.5px; color:var(--muted); letter-spacing:.5px;
}
.foot .dot{ opacity:.5; }
.toast{
  position:fixed; bottom:26px; left:50%; transform:translateX(-50%); z-index:200;
  padding:12px 20px; border-radius:10px; background:var(--bg-3); border:1px solid var(--line-strong);
  box-shadow:var(--shadow); font-size:13px; color:var(--txt); animation:up .25s ease;
}
.toast.err{ border-color:rgba(255,107,122,.45); color:#FFC3C9; }
@keyframes up{ from{ opacity:0; transform:translate(-50%,14px);} to{ opacity:1; transform:translate(-50%,0);} }

.skeleton{
  background:linear-gradient(90deg, rgba(255,166,0,.05), rgba(255,166,0,.14), rgba(255,166,0,.05));
  background-size:200% 100%; animation:sk 1.3s infinite; border-radius:8px; color:transparent !important;
}
@keyframes sk{ from{ background-position:200% 0;} to{ background-position:-200% 0;} }

::-webkit-scrollbar{ width:10px; height:10px; }
::-webkit-scrollbar-track{ background:rgba(23,0,0,.5); }
::-webkit-scrollbar-thumb{ background:rgba(255,166,0,.25); border-radius:6px; border:2px solid var(--bg-0); }
::-webkit-scrollbar-thumb:hover{ background:rgba(255,166,0,.45); }

@media (max-width:820px){
  .topbar{ flex-wrap:wrap; padding:14px 16px; }
  .filters,.tabs,main{ padding-left:16px; padding-right:16px; }
  .notice-stack{ padding-left:16px; padding-right:16px; }
  .range-label{ margin-left:0; width:100%; }

  /* nada pode empurrar a página para os lados: o que não cabe rola sozinho */
  .filters{ align-items:stretch; }
  .topbar-right{ flex-wrap:wrap; gap:10px; }
  .refresh-meta{ min-width:0; }
  .presets,.tabs,.custom-range{ overflow-x:auto; max-width:100%; scrollbar-width:thin; }
  .presets{ flex-wrap:nowrap; }
  .campaign-filter,.select-trigger{ width:100%; max-width:100%; }
  .account-picker{ width:100%; min-width:0; }
  .account-picker select{ width:100%; }
  .select-panel{ width:min(380px,calc(100vw - 32px)); }

  .card-head{ flex-wrap:wrap; }
  .seg{ overflow-x:auto; max-width:100%; }
  .seg button{ white-space:nowrap; }

  /* o funil e o gráfico ficam ilegíveis se comprimidos: rolam em vez de encolher */
  .funnel-wrap,.chart-wrap{ overflow-x:auto; }
  .funnel-wrap svg{ min-width:620px; }
  .chart-wrap svg{ min-width:520px; }
}

/* ══════════════════ ABA LINKS (UTM) ══════════════════ */
.links-toolbar{
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  padding:14px 18px; border-bottom:1px solid var(--line);
}
.links-toolbar input[type=text]{ flex:1 1 260px; min-width:200px; }
.links-toolbar select{ flex:0 0 auto; }
.links-toolbar-gap{ flex:1 1 auto; }
.links-chk{ display:flex; align-items:center; gap:6px; font-size:12px; color:var(--muted); white-space:nowrap; }
.links-chk input{ accent-color:var(--pf-300); width:14px; height:14px; }

.links-lista{ padding:4px 0 8px; }
.links-vazio{ padding:28px 20px; }
.links-grupo{ padding:14px 18px 6px; }
.links-grupo + .links-grupo{ border-top:1px solid var(--line); }
.links-grupo-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:10px; }
.links-grupo-head h3{ font-size:13px; letter-spacing:1.2px; text-transform:uppercase; color:var(--pf-200); display:flex; align-items:baseline; gap:10px; }
.links-grupo-meta{ font-size:11px; letter-spacing:.3px; text-transform:none; color:var(--muted); font-weight:400; }

.links-table td{ white-space:normal; }
.links-table .name-cell{ max-width:260px; }
.links-table .url-cell{ max-width:460px; }
.url-text{
  display:block; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:11.5px;
  color:var(--txt-dim); overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.utm-code{ font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12px; color:var(--pf-200); background:rgba(255,166,0,.1); padding:2px 7px; border-radius:5px; }
/* "Nome do UTM" do back office — destaque diferente da campanha */
.utm-code.utm-nome{ color:var(--pf-100); background:rgba(248,208,106,.22); font-weight:600; }
tr.link-inativo td{ opacity:.55; }
tr.link-inativo:hover td{ opacity:.85; }
.link-acoes{ white-space:nowrap; }
.link-acoes .link + .link{ margin-left:12px; }
.link-acoes .link.txt-bad{ color:var(--bad); }

/* ══════════════════ ABA CONEXÕES ══════════════════ */
.conexoes-intro{ padding:14px 18px 0; margin:0; max-width:860px; }
.conexoes-lista{ padding:8px 18px 18px; display:flex; flex-direction:column; gap:14px; }

.conexao{ border:1px solid var(--line); border-radius:var(--r); padding:14px 16px; background:var(--bg-2); }
.conexao.principal{ border-color:var(--line-strong); }
.conexao-head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:10px; }
.conexao-head h3{ font-size:13px; letter-spacing:1.1px; text-transform:uppercase; color:var(--pf-200); margin:0; }
.conexao-tag{ font-size:11px; letter-spacing:.3px; color:var(--muted); text-transform:none; font-weight:400; }

.conexao-form{ display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.conexao-form input[type=password]{ flex:1 1 340px; min-width:220px; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12px; }
.conexao-mascara{
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12px;
  color:var(--pf-200); background:rgba(255,166,0,.1); padding:3px 8px; border-radius:5px;
}
.conexao-vazio{ font-size:12px; color:var(--warn); }
.conexao-msg{ margin:9px 0 0; font-size:12px; line-height:1.5; }
.conexao-contas{ margin:10px 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:3px; }
.conexao-contas li{ font-size:11.5px; color:var(--txt-dim); font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; }
.conexao-contas .conta-off{ color:var(--muted); }
.conexao-msg.txt-bad{ color:var(--bad); }
.conexao-msg.txt-ok{ color:var(--ok); }

/* anti-regressão: link do Auctuz sem utm_campaign na URL (cai em "Default") */
.links-aviso{
  margin:12px 18px 2px; padding:11px 14px; border-radius:10px; font-size:12.5px; line-height:1.55;
  border:1px solid rgba(255,194,75,.4); background:rgba(255,194,75,.08); color:var(--txt-dim);
}
.links-aviso b{ color:var(--warn); }
.links-aviso-nomes{ display:block; margin-top:5px; color:var(--muted); font-size:11.5px; }
.link-alerta{
  display:inline-block; margin-left:7px; padding:2px 7px; border-radius:5px; cursor:help;
  font-size:11px; white-space:nowrap; color:var(--warn); background:rgba(255,194,75,.13);
}

/* switch ativo/inativo */
.switch{ position:relative; display:inline-block; width:34px; height:19px; cursor:pointer; vertical-align:middle; }
.switch input{ opacity:0; width:0; height:0; position:absolute; }
.switch i{
  position:absolute; inset:0; border-radius:999px; background:rgba(255,255,255,.12); border:1px solid var(--line);
  transition:background .16s, border-color .16s;
}
.switch i::after{
  content:''; position:absolute; top:2px; left:2px; width:13px; height:13px; border-radius:50%;
  background:var(--muted); transition:transform .16s, background .16s;
}
.switch input:checked + i{ background:rgba(255,166,0,.22); border-color:rgba(255,166,0,.5); }
.switch input:checked + i::after{ transform:translateX(15px); background:var(--pf-300); }
.switch input:focus-visible + i{ box-shadow:0 0 0 3px rgba(255,166,0,.18); }

/* modal genérico */
.modal-backdrop{
  position:fixed; inset:0; z-index:60; display:flex; align-items:center; justify-content:center;
  background:rgba(4,7,2,.72); backdrop-filter:blur(3px); padding:20px;
}
.modal-backdrop[hidden]{ display:none; }
.modal{
  width:min(680px, 100%); max-height:calc(100vh - 40px); overflow:auto;
  background:linear-gradient(180deg, var(--bg-2), var(--bg-1)); border:1px solid var(--line-strong); border-radius:16px;
  padding:20px 22px 18px; box-shadow:0 24px 60px rgba(0,0,0,.5);
}
.modal-head{ display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:6px; }
.modal-head h3{ font-size:14px; letter-spacing:1.4px; text-transform:uppercase; color:var(--pf-200); }
.modal-x{ background:none; border:0; color:var(--muted); font-size:22px; line-height:1; cursor:pointer; padding:2px 6px; border-radius:6px; }
.modal-x:hover{ color:var(--txt); background:rgba(255,255,255,.06); }
.modal-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px 14px; margin-top:8px; }
.modal-grid .field-wide{ grid-column:1 / -1; }
.modal-grid .field select{ text-transform:none; letter-spacing:normal; font-size:13px; }
.field-hint{ font-style:normal; text-transform:none; letter-spacing:normal; color:var(--muted); font-size:10.5px; margin-left:4px; }
.link-preview{ margin-top:16px; padding:12px 14px; border:1px dashed var(--line); border-radius:10px; background:rgba(23,0,0,.5); }
.link-preview code{
  display:block; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12px; color:var(--pf-200);
  word-break:break-all; line-height:1.5;
}
.modal-erro{ margin:12px 0 0; font-size:12.5px; }
.modal-actions{ display:flex; justify-content:flex-end; gap:10px; margin-top:18px; }
.modal textarea{
  width:100%; font:inherit; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12px; color:var(--txt);
  background:rgba(23,0,0,.7); border:1px solid var(--line); border-radius:8px; padding:10px 12px; resize:vertical; color-scheme:dark;
}
.modal textarea:focus{ outline:none; border-color:var(--pf-400); box-shadow:0 0 0 3px rgba(255,166,0,.14); }
@media (max-width:640px){ .modal-grid{ grid-template-columns:1fr; } }
/* popup de jogadores largo e alto: as 7 colunas cabem sem rolar para os lados */
.depositors-modal{ width:min(1280px,100%); }
.depositors-table-wrap{ max-height:calc(100vh - 290px); min-height:240px; margin-top:12px; overflow:auto; }
.depositors-table-wrap th, .depositors-table-wrap td.num{ white-space:nowrap; }
.depositors-summary{ display:flex; flex-wrap:wrap; gap:8px 18px; margin-top:12px; padding:10px 12px; background:rgba(255,166,0,.06); border:1px solid var(--line); border-radius:9px; }
.depositors-summary b{ color:var(--pf-200); }
.depositor-id{ display:block; margin-top:3px; color:var(--muted); font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; }
.cr-depositors{ width:100%; margin:10px 0 2px; }

/* ───────────────────────── analista de campanhas ───────────────────────── */
.analyst-shell{
  margin-bottom:18px; overflow:hidden; border:1px solid rgba(255,166,0,.22); border-radius:16px;
  background:
    radial-gradient(680px 260px at 8% 0%,rgba(255,166,0,.12),transparent 68%),
    linear-gradient(145deg,rgba(58,6,5,.97),rgba(9,13,7,.96));
  box-shadow:0 20px 52px -34px rgba(255,166,0,.55);
}
[data-panel="anuncios"] > .card{ order:1; }
[data-panel="anuncios"] > .analyst-shell{ order:2; }
.analyst-head{
  display:flex; align-items:flex-start; justify-content:space-between; gap:24px;
  padding:20px 22px 16px; border-bottom:1px solid rgba(255,166,0,.1);
}
.analyst-head-actions{ display:flex; align-items:center; gap:9px; flex:0 0 auto; }
.analyst-shell.is-collapsed{ margin-bottom:18px; }
.analyst-shell.is-collapsed .analyst-summary,
.analyst-shell.is-collapsed .analyst-quality,
.analyst-shell.is-collapsed .analyst-layout{ display:none !important; }
.analyst-shell.is-collapsed .analyst-head{ border-bottom:0; padding-top:15px; padding-bottom:15px; }
.analyst-head h2{ margin:3px 0 5px; color:#fff; font-size:20px; }
.analyst-head p{ margin:0; max-width:760px; color:var(--txt-dim); font-size:12.5px; }
.analyst-kicker{ color:var(--pf-300); font-size:9.5px; font-weight:800; letter-spacing:1.8px; }
.analyst-live{
  display:flex; align-items:center; gap:8px; flex:0 0 auto; padding:7px 10px; border:1px solid var(--line);
  border-radius:999px; background:rgba(23,0,0,.55); color:var(--txt-dim); font-size:10.5px; white-space:nowrap;
}
.analyst-live i{ width:7px; height:7px; border-radius:50%; background:var(--muted); }
.analyst-live.ready i{ background:var(--ok); box-shadow:0 0 0 4px rgba(63,224,123,.1); animation:pulse 2.4s infinite; }
.analyst-live.loading i{ background:var(--warn); animation:pulse 1s infinite; }
.analyst-live.error i{ background:var(--bad); }
.analyst-summary{ display:grid; grid-template-columns:repeat(4,minmax(120px,1fr)); gap:1px; background:rgba(255,166,0,.09); }
.analyst-summary > div{ padding:13px 18px; background:rgba(8,12,6,.78); }
.analyst-summary span{ display:block; color:var(--muted); font-size:9.5px; letter-spacing:1px; text-transform:uppercase; }
.analyst-summary b{ display:block; margin-top:3px; color:#fff; font-size:19px; font-variant-numeric:tabular-nums; }
.analyst-summary b.good{ color:var(--ok); }
.analyst-summary b.bad{ color:var(--bad); }
.analyst-quality{
  margin:14px 18px 0; padding:10px 12px; border:1px solid rgba(255,194,75,.3); border-radius:9px;
  color:#FFE1A2; background:rgba(255,194,75,.075); font-size:11.5px; line-height:1.55;
}
.analyst-quality[hidden]{ display:none !important; }
.analyst-quality.good{ color:#BFFFCF; border-color:rgba(63,224,123,.28); background:rgba(63,224,123,.065); }
.analyst-layout{ display:grid; grid-template-columns:minmax(0,1.18fr) minmax(340px,.82fr); gap:14px; padding:18px; }
.analyst-guesses,.analyst-chat{ min-width:0; border:1px solid var(--line); border-radius:12px; background:rgba(23,0,0,.48); }
.analyst-section-head{
  display:flex; align-items:center; justify-content:space-between; gap:12px; padding:13px 14px;
  border-bottom:1px solid var(--line);
}
.analyst-section-head h3{ color:var(--pf-100); font-size:13px; }
.analyst-section-head span{ display:block; margin-top:2px; color:var(--muted); font-size:10.5px; }
.analyst-cards{ display:grid; gap:8px; padding:11px; max-height:522px; overflow:auto; }
.analyst-card{
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:8px 14px; padding:12px;
  border:1px solid rgba(255,255,255,.07); border-left:3px solid var(--muted); border-radius:9px;
  background:rgba(255,255,255,.025);
}
.analyst-card.good{ border-left-color:var(--ok); }
.analyst-card.warn{ border-left-color:var(--warn); }
.analyst-card.bad{ border-left-color:var(--bad); }
.analyst-card.info{ border-left-color:#7FB8FF; }
.analyst-card-main{ min-width:0; }
.analyst-card-top{ display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.analyst-verdict{
  padding:2px 6px; border-radius:5px; color:var(--txt-dim); background:rgba(255,255,255,.07);
  font-size:9px; font-weight:800; letter-spacing:.65px; text-transform:uppercase;
}
.analyst-card.good .analyst-verdict{ color:#BFFFCF; background:rgba(63,224,123,.1); }
.analyst-card.warn .analyst-verdict{ color:#FFE1A2; background:rgba(255,194,75,.1); }
.analyst-card.bad .analyst-verdict{ color:#FFB5BE; background:rgba(255,107,122,.1); }
.analyst-confidence{ color:var(--muted); font-size:9.5px; }
.analyst-card h4{ margin:6px 0 1px; color:#fff; font-size:12.5px; line-height:1.35; overflow-wrap:anywhere; }
.analyst-card .analyst-campaign{ color:var(--muted); font-size:10.5px; overflow-wrap:anywhere; }
.analyst-card .analyst-reason{ margin:8px 0 0; color:var(--txt-dim); font-size:11px; line-height:1.45; }
.analyst-card .analyst-action{ grid-column:1 / -1; margin:0; color:var(--pf-200); font-size:11px; line-height:1.45; }
.analyst-card .analyst-open{ align-self:start; white-space:nowrap; }
.analyst-card-buttons{ display:flex; flex-direction:column; align-items:stretch; gap:6px; }
.analyst-card-buttons .btn{ white-space:nowrap; }
.analyst-details-modal{ width:min(880px,100%); }
.analyst-detail-heading{ padding-bottom:13px; border-bottom:1px solid var(--line); }
.analyst-detail-heading h4{ margin:8px 0 4px; color:#fff; font-size:16px; }
.analyst-detail-heading p{ margin:0; color:var(--pf-200); font-size:12px; }
.analyst-detail-rule,.analyst-detail-formula,.analyst-detail-quality{ margin-top:13px; padding:12px 13px; border:1px solid var(--line); border-radius:9px; background:rgba(255,166,0,.045); }
.analyst-detail-rule span,.analyst-detail-formula span,.analyst-detail-quality span{ display:block; margin-bottom:5px; color:var(--muted); font-size:9.5px; letter-spacing:.8px; text-transform:uppercase; }
.analyst-detail-rule b{ color:#fff; font-size:12px; line-height:1.55; }
.analyst-detail-formula code{ color:var(--pf-200); font-size:13px; }
.analyst-detail-quality p{ margin:0; color:var(--txt-dim); font-size:11.5px; line-height:1.5; }
.analyst-detail-indicators{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:13px; }
.analyst-detail-indicators article{ padding:11px 12px; border:1px solid var(--line); border-left:3px solid #7fb8ff; border-radius:9px; background:rgba(255,255,255,.025); }
.analyst-detail-indicators article.pass{ border-left-color:var(--ok); }
.analyst-detail-indicators article.alert{ border-left-color:var(--bad); }
.analyst-detail-indicators article.pending{ border-left-color:var(--warn); }
.analyst-detail-indicators span{ display:block; color:var(--muted); font-size:9.5px; letter-spacing:.7px; text-transform:uppercase; }
.analyst-detail-indicators b{ display:inline-block; margin-top:5px; color:#fff; font-size:16px; }
.analyst-detail-indicators em{ float:right; margin-top:7px; color:var(--pf-200); font-size:10.5px; font-style:normal; }
.analyst-detail-indicators p{ clear:both; margin:7px 0 0; color:var(--txt-dim); font-size:10.5px; line-height:1.45; }
.analyst-detail-notes{ margin:13px 0 0; padding-left:19px; color:var(--muted); font-size:10.5px; line-height:1.5; }
.analyst-detail-notes li + li{ margin-top:4px; }
@media(max-width:640px){ .analyst-detail-indicators{ grid-template-columns:1fr; } .analyst-card-buttons{ grid-column:1 / -1; flex-direction:row; } }
.analyst-empty{ padding:32px 18px; text-align:center; color:var(--muted); font-size:12px; }
.analyst-chat{ display:flex; flex-direction:column; }
.analyst-messages{ min-height:360px; max-height:560px; overflow:auto; padding:12px; display:flex; flex-direction:column; gap:9px; }
.analyst-message{ max-width:92%; padding:9px 11px; border-radius:10px; color:var(--txt-dim); background:rgba(255,255,255,.05); font-size:11.5px; }
.analyst-message.agent{ align-self:flex-start; border:1px solid rgba(255,166,0,.13); }
.analyst-message.user{ align-self:flex-end; color:#132007; background:var(--pf-200); }
.analyst-message.loading{ color:var(--muted); }
.analyst-message b{ display:block; margin-bottom:3px; color:var(--pf-300); font-size:9px; letter-spacing:.8px; text-transform:uppercase; }
.analyst-message.user b{ color:#7A3A00; }
.analyst-message p{ margin:0; white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.5; }
.analyst-message li{ overflow-wrap:anywhere; line-height:1.45; }
.analyst-message ul{ margin:7px 0 0; padding-left:17px; }
.analyst-message li + li{ margin-top:5px; }
.analyst-message small{ display:block; margin-top:8px; color:var(--muted); line-height:1.4; }
.analyst-prompts{ display:flex; gap:6px; flex-wrap:wrap; padding:10px 12px 0; margin-top:auto; }
.analyst-prompts button{
  border:1px solid var(--line); border-radius:999px; padding:5px 8px; color:var(--txt-dim);
  background:rgba(255,166,0,.035); font:inherit; font-size:9.5px; cursor:pointer;
}
.analyst-prompts button:hover{ color:var(--pf-200); border-color:var(--line-strong); }
.analyst-form{ display:flex; gap:8px; align-items:flex-end; padding:11px 12px 12px; border-top:1px solid var(--line); }
.analyst-form textarea{
  flex:1; min-height:58px; max-height:150px; resize:vertical; padding:9px 10px; border:1px solid var(--line); border-radius:8px;
  color:var(--txt); background:rgba(5,8,4,.8); font:inherit; font-size:11.5px; line-height:1.4; color-scheme:dark;
}
.analyst-form textarea:focus{ outline:none; border-color:var(--pf-400); box-shadow:0 0 0 3px rgba(255,166,0,.1); }
.analyst-form .btn{ min-height:38px; }

@media (max-width:1040px){ .analyst-layout{ grid-template-columns:1fr; } }
@media (max-width:720px){
  .analyst-head{ flex-direction:column; gap:11px; }
  .analyst-head-actions{ width:100%; justify-content:space-between; flex-wrap:wrap; }
  .analyst-summary{ grid-template-columns:repeat(2,minmax(110px,1fr)); }
  .analyst-layout{ padding:12px; }
  .analyst-card{ grid-template-columns:1fr; }
  .analyst-card .analyst-open{ justify-self:start; }
}

/* ─────────────── workspace da aba Anúncios ───────────────
 * Em desktop, a página deixa de ser a área de rolagem. Gerenciador e
 * Analista dividem a altura disponível; tabelas, palpites e conversa rolam
 * dentro dos próprios painéis, como no Gerenciador de Anúncios da Meta. */
@media (min-width:901px){
  body:has(.tab-panel[data-panel="anuncios"].active){
    height:100dvh; min-height:0; overflow:hidden; display:flex; flex-direction:column;
  }
  body:has(.tab-panel[data-panel="anuncios"].active) > :is(.topbar,.filters,.notice-stack,.tabs){ flex:0 0 auto; }
  body:has(.tab-panel[data-panel="anuncios"].active) > main{
    flex:1 1 auto; min-height:0; overflow:hidden; padding:10px 16px 12px;
  }
  body:has(.tab-panel[data-panel="anuncios"].active) > .foot{ display:none; }

  .tab-panel[data-panel="anuncios"].active{
    height:100%; min-height:0; gap:10px; overflow:hidden; animation:none;
  }
  [data-panel="anuncios"] > .card{
    flex:1 1 auto; min-height:230px; display:flex; flex-direction:column; overflow:hidden;
  }
  [data-panel="anuncios"]:has(> .analyst-shell:not(.is-collapsed)) > .card{ min-height:120px; }
  [data-panel="anuncios"] > .analyst-shell{
    flex:0 0 58%; height:58%; min-height:0; max-height:58%; margin:0; display:flex; flex-direction:column;
  }
  [data-panel="anuncios"] > .analyst-shell.is-collapsed{
    flex:0 0 auto; max-height:none; margin:0;
  }

  [data-panel="anuncios"] > .card > :is(.card-head,.ads-subtabs,.ads-optimizer-bar,.ads-optimizer-guardrails,.ads-optimizer-error,.ads-classification-toolbar,.ads-filters,#drillSummary){
    flex:0 0 auto;
  }
  [data-panel="anuncios"] .table-wrap{
    max-height:none; min-height:0; overscroll-behavior:contain;
  }
  /* O campo acompanha a rolagem vertical; o cabeçalho fica logo abaixo dele. */
  [data-panel="anuncios"] #drillCampaigns .drill-search{
    position:sticky; top:0; left:0; z-index:9; min-height:43px;
    padding:6px 14px; background:var(--bg-2); border-bottom:1px solid var(--line);
  }
  [data-panel="anuncios"] #drillCampaigns > thead,
  [data-panel="anuncios"] #drillCampaigns .data-table thead,
  [data-panel="anuncios"] #drillCampaigns .data-table th{ top:43px; }

  /* Controles mais compactos deixam a maior parte da janela para as linhas. */
  [data-panel="anuncios"] > .card > .card-head{ padding:7px 14px; gap:10px; }
  [data-panel="anuncios"] .ads-subtabs{ padding:1px 14px 0; }
  [data-panel="anuncios"] .ads-subtab{ padding:7px 12px; font-size:12px; }
  [data-panel="anuncios"] .ads-optimizer-bar{ margin:5px 14px 0; padding:6px 9px; }
  [data-panel="anuncios"] .ads-optimizer-guardrails{
    margin:4px 14px 0; flex-wrap:nowrap; overflow-x:auto; padding-bottom:1px;
  }
  [data-panel="anuncios"] .ads-optimizer-guardrails span{ flex:0 0 auto; padding:3px 6px; font-size:9px; }
  [data-panel="anuncios"] .data-table th,
  [data-panel="anuncios"] .data-table td{ padding-top:8px; padding-bottom:8px; }
  [data-panel="anuncios"] > .card > :is(#drillCampaigns,#drillAdsets,#drillCohorts):not([hidden]){
    display:block; flex:1 1 auto; min-height:0; overflow:auto;
  }
  [data-panel="anuncios"] > .card > #drillCreatives:not([hidden]){
    display:flex; flex:1 1 auto; min-height:0; overflow:hidden; flex-direction:column; padding:12px 18px;
  }
  [data-panel="anuncios"] #criativosTabela:not([hidden]),
  [data-panel="anuncios"] #criativosGrid:not([hidden]){
    flex:1 1 auto; min-height:0; overflow:auto;
  }
  [data-panel="anuncios"] .ads-optimizer-audit:not([hidden]){
    flex:0 1 34%; min-height:90px; overflow:auto;
  }

  .analyst-shell:not(.is-collapsed) .analyst-head{ padding:12px 16px 10px; }
  .analyst-shell:not(.is-collapsed) .analyst-head h2{ font-size:17px; }
  .analyst-shell:not(.is-collapsed) .analyst-summary > div{ padding:8px 14px; }
  .analyst-shell:not(.is-collapsed) .analyst-summary b{ font-size:16px; }
  .analyst-shell:not(.is-collapsed) .analyst-quality{ margin:8px 12px 0; padding:7px 10px; }
  .analyst-shell:not(.is-collapsed) .analyst-layout{
    flex:1 1 auto; min-height:0; padding:10px 12px 12px;
    grid-template-columns:minmax(0,1.18fr) minmax(280px,.82fr);
  }
  .analyst-shell:not(.is-collapsed) :is(.analyst-guesses,.analyst-chat){
    min-height:0; display:flex; flex-direction:column; overflow:hidden;
  }
  /* Palpites terminam junto ao conteúdo; somente a conversa ocupa toda a
   * altura disponível. A lista continua rolável quando ultrapassa o limite. */
  .analyst-shell:not(.is-collapsed) .analyst-guesses{
    align-self:start; width:100%; height:auto; max-height:100%;
  }
  .analyst-shell:not(.is-collapsed) :is(.analyst-cards,.analyst-messages){
    flex:1 1 auto; min-height:0; max-height:none; overflow:auto;
  }
  .analyst-shell:not(.is-collapsed) .analyst-guesses .analyst-cards{
    flex:0 1 auto; max-height:clamp(180px,calc(46dvh - 58px),522px);
  }
  .analyst-shell:not(.is-collapsed) .analyst-messages{ min-height:0; }
}

@media (min-width:901px) and (max-height:820px){
  body:has(.tab-panel[data-panel="anuncios"].active) .topbar{ padding-top:9px; padding-bottom:9px; }
  body:has(.tab-panel[data-panel="anuncios"].active) .filters{ padding-top:7px; padding-bottom:7px; }
  body:has(.tab-panel[data-panel="anuncios"].active) .tabs{ padding-top:6px; }
  body:has(.tab-panel[data-panel="anuncios"].active) .tabs button{ padding-top:7px; padding-bottom:7px; }
  [data-panel="anuncios"] > .analyst-shell{ height:64%; max-height:64%; flex-basis:64%; }
  .analyst-shell:not(.is-collapsed) .analyst-guesses .analyst-cards{
    max-height:clamp(180px,calc(52dvh - 58px),522px);
  }
}

/* Fluxo natural da página: sem divisão rígida da janela entre tabela e
 * Analista. Cada bloco cresce com seu conteúdo e a página faz a rolagem. */
@media (min-width:901px){
  body:has(.tab-panel[data-panel="anuncios"].active){
    height:auto; min-height:100%; overflow-y:auto; display:block;
  }
  body:has(.tab-panel[data-panel="anuncios"].active) > main{
    min-height:auto; overflow:visible; padding:14px 16px 28px;
  }
  body:has(.tab-panel[data-panel="anuncios"].active) > .foot{ display:flex; }
  .tab-panel[data-panel="anuncios"].active{
    height:auto; min-height:0; gap:12px; overflow:visible;
  }
  [data-panel="anuncios"] > .card{
    display:block; min-height:0; overflow:hidden; flex:none;
  }
  [data-panel="anuncios"] > .analyst-shell,
  [data-panel="anuncios"] > .analyst-shell.is-collapsed{
    display:block; flex:none; height:auto; min-height:0; max-height:none; margin:0;
  }
  [data-panel="anuncios"] .table-wrap,
  [data-panel="anuncios"] > .card > :is(#drillCampaigns,#drillAdsets,#drillCohorts):not([hidden]){
    display:block; max-height:none; min-height:0; overflow-x:auto; overflow-y:visible;
  }
  [data-panel="anuncios"] > .card > #drillCreatives:not([hidden]){
    display:block; min-height:0; overflow:visible; padding:10px 14px 14px;
  }
  [data-panel="anuncios"] #criativosTabela:not([hidden]),
  [data-panel="anuncios"] #criativosGrid:not([hidden]){ overflow:visible; }
  [data-panel="anuncios"] .ads-campaign-search{
    position:sticky; top:58px; z-index:9; min-height:0; padding:7px 14px;
    background:var(--bg-2); border-bottom:1px solid var(--line);
  }
  [data-panel="anuncios"] #drillCampaigns .data-table thead,
  [data-panel="anuncios"] #drillCampaigns .data-table th{ top:58px; }
  /* Dez registros visíveis por nível. O restante rola dentro da tabela. */
  [data-panel="anuncios"] > .card > #drillCampaigns:not([hidden]),
  [data-panel="anuncios"] #criativosTabela:not([hidden]){
    max-height:558px; overflow:auto; overscroll-behavior:contain;
  }
  [data-panel="anuncios"] > .card > #drillAdsets:not([hidden]){
    max-height:601px; overflow:auto; overscroll-behavior:contain;
  }
  [data-panel="anuncios"] #cohortTableWrap{
    max-height:518px; overflow:auto; overscroll-behavior:contain;
  }
  [data-panel="anuncios"] #drillCampaigns .data-table thead,
  [data-panel="anuncios"] #drillCampaigns .data-table th,
  [data-panel="anuncios"] #criativosTabela .data-table thead,
  [data-panel="anuncios"] #criativosTabela .data-table th{ top:0; }
  [data-panel="anuncios"] #drillAdsets .drill-search{
    position:sticky; top:0; left:0; z-index:9; min-height:43px;
    padding:6px 14px; background:var(--bg-2); border-bottom:1px solid var(--line);
  }
  [data-panel="anuncios"] #drillAdsets .data-table thead,
  [data-panel="anuncios"] #drillAdsets .data-table th{ top:43px; }
  [data-panel="anuncios"] #cohortTableWrap .data-table thead,
  [data-panel="anuncios"] #cohortTableWrap .data-table th{ top:0; }
  .analyst-shell:not(.is-collapsed) .analyst-layout{
    display:grid; min-height:0; padding:14px; grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr);
  }
  .analyst-shell:not(.is-collapsed) :is(.analyst-guesses,.analyst-chat){ overflow:hidden; }
  .analyst-shell:not(.is-collapsed) .analyst-guesses .analyst-cards{ max-height:522px; }
  .analyst-shell:not(.is-collapsed) .analyst-messages{ min-height:360px; max-height:560px; }
}

@media (max-width:760px){
  .ads-navigation-row{ align-items:stretch; flex-direction:column; padding:0 10px 9px; }
  .ads-navigation-row .ads-subtabs{ padding-left:0; }
  .ads-navigation-row .colunas-wrap{ flex-wrap:wrap; margin-left:0; }
  .ads-classification-toolbar{ align-items:stretch; }
  .ads-classification-title{ min-width:100%; }
  .ads-classification-toolbar :is(label,.filtro-campo),.ads-classification-toolbar select,.multi-dropdown-botao{ width:100%; min-width:0; }
}

/* ───────────────────────── central de otimização ───────────────────────── */
.ads-optimizer-bar{
  display:flex; align-items:center; justify-content:space-between; gap:14px;
  margin:10px 18px 0; padding:10px 12px; border:1px solid rgba(255,166,0,.17);
  border-radius:9px; background:linear-gradient(90deg,rgba(255,166,0,.07),rgba(7,11,6,.28));
}
.ads-optimizer-state,.ads-optimizer-actions{ display:flex; align-items:center; gap:9px; flex-wrap:wrap; }
.ads-optimizer-label{ color:var(--pf-200); font-size:11px; font-weight:750; letter-spacing:.8px; text-transform:uppercase; }
.ads-optimizer-bar .optimizer-mode{ padding:4px 8px; font-size:9.5px; }
.ads-optimizer-guardrails{ margin:7px 18px 0; }
.ads-optimizer-guardrails span{ padding:4px 7px; font-size:10px; }
.ads-optimizer-error{ margin:8px 18px 0; }
.ads-optimizer-audit{ margin:9px 18px 0; border:1px solid var(--line); border-radius:9px; overflow:hidden; background:rgba(7,11,6,.55); }
.ads-optimizer-audit-head{ display:flex; align-items:baseline; gap:10px; padding:10px 12px; border-bottom:1px solid var(--line); }
.ads-optimizer-audit-head b{ color:var(--pf-200); font-size:12px; }
.ads-optimizer-audit-head span{ color:var(--muted); font-size:10.5px; }
.data-table th.optimizer-budget-col,.data-table td.optimizer-budget-col{ min-width:132px; white-space:nowrap; }
.data-table th.optimizer-actions-col,.data-table td.optimizer-actions-col{ min-width:126px; white-space:nowrap; }
.inline-optimizer-actions{ display:flex; align-items:center; gap:5px; }
.inline-optimizer-actions .btn{ padding:5px 8px; font-size:10px; line-height:1.1; }
.inline-optimizer-loading{ color:var(--muted); font-size:10px; }
.optimizer-budget.inherited{ color:var(--txt-dim); }
.optimizer-budget .budget-edit{
  display:inline-flex; margin-left:6px; padding:1px 5px; border:0; border-radius:4px;
  color:var(--pf-300); background:rgba(255,166,0,.09); font:inherit; font-size:10px; cursor:pointer;
}
.optimizer-budget .budget-edit:hover{ background:rgba(255,166,0,.17); }
.optimizer-intro{
  display:flex; align-items:center; justify-content:space-between; gap:18px;
  margin-bottom:14px; padding:18px 20px; border:1px solid rgba(255,166,0,.16);
  border-radius:12px; background:linear-gradient(110deg,rgba(255,166,0,.075),rgba(16,25,18,.35));
}
.optimizer-intro h2{ margin:0 0 4px; font-size:18px; color:#fff; }
.optimizer-intro p{ margin:0; color:var(--txt-dim); font-size:12.5px; }
.optimizer-mode{
  flex:0 0 auto; padding:7px 11px; border-radius:7px; font-size:11px; font-weight:750;
  letter-spacing:.8px; text-transform:uppercase; border:1px solid rgba(255,194,75,.35);
  color:var(--warn); background:rgba(255,194,75,.08);
}
.optimizer-mode.live{ color:#ff9797; border-color:rgba(255,86,86,.42); background:rgba(255,86,86,.09); }
.optimizer-mode.simulation{ color:#aeeeff; border-color:rgba(84,200,255,.4); background:rgba(84,200,255,.08); }
.optimizer-guardrails{
  display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; color:var(--txt-dim); font-size:11.5px;
}
.optimizer-guardrails span{ padding:6px 9px; border:1px solid rgba(255,255,255,.08); border-radius:6px; background:rgba(255,255,255,.025); }
.optimizer-kpis{ display:grid; grid-template-columns:repeat(4,minmax(130px,1fr)); gap:10px; margin-bottom:14px; }
.optimizer-kpi{ padding:13px 15px; border:1px solid rgba(255,166,0,.11); border-radius:9px; background:var(--surface); }
.optimizer-kpi span{ display:block; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.9px; }
.optimizer-kpi b{ display:block; color:#fff; font-size:20px; margin-top:4px; }
.optimizer-toolbar{ display:flex; align-items:flex-end; gap:10px; flex-wrap:wrap; padding:14px; border-bottom:1px solid rgba(255,166,0,.08); }
.optimizer-toolbar .field{ min-width:190px; margin:0; }
.optimizer-toolbar .optimizer-search{ flex:1 1 240px; }
.optimizer-toolbar .btn{ margin-bottom:1px; }
.optimizer-error{ margin:10px 14px 0; }
.optimizer-name{ display:flex; flex-direction:column; gap:3px; max-width:360px; white-space:normal; }
.optimizer-name b{ color:var(--txt); font-weight:650; }
.optimizer-name code,.optimizer-hierarchy code{ color:var(--muted); font-size:10px; }
.optimizer-hierarchy{ display:flex; flex-direction:column; gap:2px; color:var(--txt-dim); font-size:11px; }
.optimizer-status{ display:inline-flex; align-items:center; gap:6px; font-size:10.5px; font-weight:700; }
.optimizer-status::before{ content:""; width:7px; height:7px; border-radius:50%; background:#777; }
.optimizer-status.active::before{ background:var(--pf-300); box-shadow:0 0 0 3px rgba(255,166,0,.1); }
.optimizer-status.paused::before{ background:var(--warn); }
.optimizer-status.problem::before{ background:#ff6969; }
.optimizer-budget{ color:#fff; font-variant-numeric:tabular-nums; }
.optimizer-budget small{ display:block; color:var(--muted); font-size:9.5px; margin-top:2px; }
.optimizer-tracking{ display:inline-flex; align-items:center; gap:5px; font-size:10.5px; }
.optimizer-tracking.ok{ color:var(--pf-300); }
.optimizer-tracking.warn{ color:var(--warn); }
.optimizer-actions{ display:flex; gap:6px; flex-wrap:wrap; }
.optimizer-actions .btn{ padding:5px 8px; font-size:10.5px; }
.optimizer-modal{ max-width:620px; }
.optimizer-modal [hidden]{ display:none !important; }
.optimizer-entity{ margin:2px 0 15px; padding:10px 12px; border-radius:7px; background:rgba(255,255,255,.035); color:var(--txt-dim); font-size:12px; }
.optimizer-modal > .field{ margin-top:12px; }
.optimizer-preview{ margin-top:15px; padding:13px; border:1px solid rgba(84,200,255,.25); border-radius:8px; background:rgba(84,200,255,.055); }
.optimizer-preview-grid{ display:grid; grid-template-columns:1fr auto 1fr; gap:10px; align-items:center; }
.optimizer-preview-grid > div{ min-width:0; }
.optimizer-preview-grid span{ display:block; color:var(--muted); font-size:9.5px; text-transform:uppercase; letter-spacing:.7px; }
.optimizer-preview-grid b{ display:block; margin-top:4px; color:#fff; font-size:12px; overflow-wrap:anywhere; }
.optimizer-preview-arrow{ color:var(--pf-300); font-size:18px; }
.optimizer-warnings{ margin:11px 0 0; padding-left:18px; color:var(--warn); font-size:11px; line-height:1.45; }
.optimizer-audit-result{ font-size:10px; padding:3px 7px; border-radius:5px; }
.optimizer-audit-result.ok{ color:var(--pf-300); background:rgba(255,166,0,.09); }
.optimizer-audit-result.preview{ color:#9edfff; background:rgba(84,200,255,.08); }
.optimizer-audit-result.error{ color:#ff9999; background:rgba(255,86,86,.08); }

@media (max-width:900px){
  .optimizer-kpis{ grid-template-columns:repeat(2,minmax(130px,1fr)); }
  .optimizer-intro{ align-items:flex-start; flex-direction:column; }
  .ads-optimizer-bar{ align-items:flex-start; flex-direction:column; }
}

/* ── coluna sem série completa no período ──────────────────────────
   O pixel só começou a disparar AddPaymentInfo em 06/09/2026. Quando o
   período aberto começa antes, a coluna leva um asterisco e um tom de aviso
   discreto: os dias anteriores contam zero por falta do evento, não por
   falta de recompra. O title de cada célula explica. */
th.sem-serie{ color:var(--warn); }
th.sem-serie .col-marca{
  font-style:normal; font-weight:600; margin-left:3px; font-size:11px; vertical-align:super; opacity:.85;
}
td.sem-serie{ position:relative; }
td.sem-serie::after{
  content:''; position:absolute; left:0; right:0; bottom:0; height:1px;
  background:repeating-linear-gradient(90deg, rgba(255,194,75,.5) 0 3px, transparent 3px 6px);
}

/* ── retenção: redepósito no funil do criativo ─────────────────────
   Fica depois do FTD mas fora da cadeia de conversão. Cor própria (âmbar,
   nem verde de conversão nem vermelho de vazamento) e um filete acima,
   separando a aquisição da retenção. */
.crf-linha.retencao{ margin-top:5px; padding-top:5px; border-top:1px dashed rgba(255,255,255,.09); }
.crf-linha.retencao .crf-nome{ color:var(--warn); }
.crf-linha.retencao .crf-barra i{ background:linear-gradient(90deg,#B8862B,#FFC24B); }
.retencao-row td{ color:#FFD98A; background:rgba(255,194,75,.04); }
.crf-valor{ font-style:normal; color:var(--warn); opacity:.8; font-size:9.5px; margin-left:4px; }
.cr-met b s{ text-decoration:none; color:var(--muted); margin:0 1px; }
/* etiqueta de fonte na área de recompra do card: casa (postback) ou pixel */
.cr-met span s{ text-decoration:none; color:var(--warn); opacity:.75; letter-spacing:.4px; }
.cr-met-sep{ padding-top:8px; border-top:1px solid var(--line); }
.cr-depositos{
  grid-column:1 / -1; display:flex; flex-direction:column;
  padding-top:9px; border-top:1px solid var(--line);
}
.cr-deposito-linha{
  display:grid; grid-template-columns:minmax(0,2fr) minmax(0,3fr);
  align-items:stretch; white-space:nowrap;
}
.cr-deposito-linha + .cr-deposito-linha{ border-top:1px solid rgba(248,208,106,.08); }
.cr-deposito-item{
  display:flex; align-items:baseline; justify-content:space-between; gap:5px;
  min-width:0; padding:7px 8px 7px 0;
}
.cr-deposito-item + .cr-deposito-item{
  border-left:1px solid var(--line); padding-left:8px; padding-right:0;
}
.cr-deposito-item span{
  font-size:9.5px; letter-spacing:.65px; text-transform:uppercase; color:var(--muted);
}
.cr-deposito-item span s{ text-decoration:none; color:var(--warn); opacity:.75; }
.cr-deposito-item b{
  flex:none; color:var(--pf-200); font-size:13px; font-weight:650; font-variant-numeric:tabular-nums;
}
.atribuicao-inline{
  display:flex; align-items:center; gap:8px; flex-wrap:wrap;
  padding:5px 7px; border:1px solid rgba(255,166,0,.12); border-radius:8px;
  background:rgba(255,166,0,.025);
}
.atribuicao-inline > span{
  color:var(--muted); font-size:9.5px; font-weight:750; letter-spacing:.75px; text-transform:uppercase;
}
.atribuicao-inline .seg button{ padding:6px 9px; font-size:10px; }
#avisoGoAtribuicao .notice{ margin:9px 0 2px; }
.data-table :is(th,td).go-attr-col{
  background:rgba(83,201,255,.035); border-left-color:rgba(83,201,255,.19);
}
.data-table th.go-attr-col{ color:#aeeeff; }
.data-table :is(th,td).go-attr-first{ border-left:2px solid rgba(83,201,255,.42); }
.cr-go-attribution{
  grid-column:1 / -1; display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  margin-top:2px; padding:8px 9px; border:1px solid rgba(83,201,255,.2); border-radius:7px;
  background:rgba(83,201,255,.055);
}
.cr-go-attribution span{ color:#aeeeff; font-size:9.5px; font-weight:750; letter-spacing:.55px; text-transform:uppercase; }
.cr-go-attribution b{ color:#fff; font-size:11px; font-variant-numeric:tabular-nums; }
/* criativo sem gasto no período: só retorno de jogador já adquirido */
.cr-sem-gasto{
  font-size:9.5px; letter-spacing:.3px; color:var(--warn); opacity:.85;
  padding:4px 0 0; border-top:1px dashed rgba(255,194,75,.25); margin-top:2px;
}

/* ── coorte individual por jogador (popup "Jogadores deste criativo") ── */
.depositors-view{ margin-top:12px; }
.depositor-row{ cursor:pointer; }
.depositors-cohort{ margin-top:12px; }
.cj{ display:flex; flex-direction:column; gap:10px; }
.cj-vazio{ padding:28px 8px; text-align:center; color:var(--muted); font-size:12.5px; }
.cj-legenda{ margin:0; font-size:12px; color:var(--muted); }
.cj-legenda b{ color:var(--pf-200); font-weight:650; }
.cj-tabela-wrap{ max-height:calc(100vh - 330px); min-height:200px; overflow:auto; }
.cj-tabela{ min-width:0; }
.cj-tabela th, .cj-tabela td{ white-space:nowrap; }
.cj-tabela .cj-jogador{ position:sticky; left:0; z-index:1; background:var(--bg-2); min-width:150px; max-width:220px; overflow:hidden; text-overflow:ellipsis; }
.cj-tabela thead th.cj-jogador{ z-index:3; }
.cj-tabela td.cj-antes{ color:var(--muted); opacity:.45; }
.cj-tabela td.cj-dia-ftd{ box-shadow:inset 0 0 0 1px var(--pf-400); background:rgba(255,166,0,.07); }
.cj-ftd-tag{ display:block; margin-bottom:2px; font-size:9px; font-weight:700; letter-spacing:.6px; color:var(--pf-200); }
.cj-tabela td.cj-voltou b{ color:var(--pf-200); }
.cj-tabela tr.ativo td{ background:rgba(255,166,0,.10); }
.cj-tabela tr.ativo td.cj-jogador{ box-shadow:inset 3px 0 0 var(--pf-400); }
.cj-tabela .totais-row td{ font-weight:650; color:var(--pf-200); }

/* ── aba Telegram: funil do canal próprio (layout com menu lateral, no estilo da Track4you) ── */
.tg-shell{ display:grid; grid-template-columns:220px minmax(0,1fr); gap:18px; align-items:start; }
.tg-nav{ position:sticky; top:78px; display:flex; flex-direction:column; gap:3px; padding:12px; border:1px solid var(--line); border-radius:var(--r); background:linear-gradient(180deg, rgba(58,6,5,.9), rgba(42,0,0,.8)); }
.tg-nav-head{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding:4px 6px 10px; margin-bottom:4px; border-bottom:1px solid var(--line); }
.tg-nav-title{ font-family:var(--font-display); font-size:15px; font-weight:650; color:var(--pf-200); letter-spacing:.4px; }
.tg-nav button{ display:flex; align-items:center; gap:10px; width:100%; padding:9px 10px; border:0; border-radius:9px; background:none; color:var(--txt-dim); font:inherit; font-size:13px; text-align:left; cursor:pointer; }
.tg-nav button i{ width:18px; text-align:center; font-style:normal; color:var(--muted); }
.tg-nav button:hover{ background:rgba(255,166,0,.07); color:var(--txt); }
.tg-nav button.active{ background:rgba(255,166,0,.14); color:var(--pf-200); font-weight:600; box-shadow:inset 3px 0 0 var(--pf-400); }
.tg-nav button.active i{ color:var(--pf-300); }
.tg-nav button:focus-visible{ outline:2px solid var(--pf-400); outline-offset:-2px; }
.tg-nav-sep{ margin:10px 6px 2px; font-size:10px; letter-spacing:1.2px; text-transform:uppercase; color:var(--muted); }
.tg-selo{ font-size:10px; letter-spacing:.6px; text-transform:uppercase; padding:3px 8px; border-radius:999px; border:1px solid var(--line); color:var(--muted); }
.tg-selo-shadow{ color:var(--warn); border-color:rgba(255,194,75,.35); background:rgba(255,194,75,.08); }
.tg-selo-live{ color:var(--ok); border-color:rgba(63,224,123,.35); background:rgba(63,224,123,.08); }
.tg-main{ display:flex; flex-direction:column; gap:16px; min-width:0; }
.tg-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:14px; flex-wrap:wrap; }
.tg-head h2{ margin:0; font-family:var(--font-display); font-size:22px; color:#fff; letter-spacing:.3px; }
.tg-head p{ margin:4px 0 0; color:var(--txt-dim); font-size:13px; }
.tg-head-acoes{ display:flex; gap:8px; }
.tg-filtros{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.tg-select{ display:flex; align-items:center; gap:8px; font-size:11px; letter-spacing:.8px; text-transform:uppercase; color:var(--muted); }
.tg-select select{ min-width:200px; }
.tg-kpis{ display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:12px; }
.tg-duas{ display:grid; grid-template-columns:repeat(auto-fit,minmax(min(340px,100%),1fr)); gap:16px; }
.tg-card{ border:1px solid var(--line); border-radius:var(--r); padding:16px 18px; background:linear-gradient(160deg, rgba(78,15,10,.7), rgba(42,0,0,.5)); display:flex; flex-direction:column; gap:10px; min-width:0; }
.tg-card h3{ margin:0; font-size:12px; letter-spacing:1.4px; text-transform:uppercase; color:var(--pf-200); }
.tg-card h4{ margin:8px 0 0; font-size:11px; letter-spacing:1.1px; text-transform:uppercase; color:var(--txt-dim); }
.tg-card-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; }
.tg-contador{ font-size:11px; padding:3px 9px; border:1px solid var(--line); border-radius:7px; color:var(--txt-dim); font-variant-numeric:tabular-nums; }
.tg-card .table-wrap{ overflow:auto; max-height:460px; }
.tg-texto{ margin:0; font-size:12.5px; color:var(--txt-dim); line-height:1.55; }
.tg-linha{ margin:0; display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.tg-aviso{ margin:0; padding:9px 12px; border-radius:9px; border:1px solid rgba(255,194,75,.28); background:rgba(255,194,75,.07); color:#F3DDA6; font-size:12px; line-height:1.5; }
.tg-vazio{ padding:26px 12px; text-align:center; color:var(--muted); font-size:13px; border:1px dashed var(--line); border-radius:10px; }
.tg-sub{ display:block; margin-top:2px; font-size:11px; color:var(--muted); }
.tg-mono{ font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:12px; }
.tg-badge{ display:inline-flex; align-items:center; gap:6px; padding:3px 9px; border-radius:7px; font-size:11.5px; font-weight:600; white-space:nowrap; border:1px solid; }
.tg-badge i{ width:6px; height:6px; border-radius:50%; background:currentColor; }
.tg-badge-ok{ color:var(--ok); border-color:rgba(63,224,123,.3); background:rgba(63,224,123,.08); }
.tg-badge-warn{ color:var(--warn); border-color:rgba(255,194,75,.3); background:rgba(255,194,75,.08); }
.tg-badge-bad{ color:var(--bad); border-color:rgba(255,107,122,.3); background:rgba(255,107,122,.08); }
.tg-badge-off{ color:var(--muted); border-color:var(--line); background:rgba(255,255,255,.02); }
.tg-acoes{ display:flex; align-items:center; gap:6px; justify-content:flex-end; white-space:nowrap; }
.tg-acoes-col{ text-align:right; }
.tg-checks{ list-style:none; margin:0; padding:0; display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:10px; }
.tg-checks li{ display:flex; gap:10px; align-items:flex-start; padding:10px 12px; border:1px solid var(--line); border-radius:10px; background:rgba(23,0,0,.35); }
.tg-checks li i{ flex:none; width:22px; height:22px; border-radius:50%; display:grid; place-items:center; font-style:normal; font-weight:700; font-size:12px; }
.tg-checks li.ok i{ background:rgba(63,224,123,.15); color:var(--ok); }
.tg-checks li.pendente i{ background:rgba(255,194,75,.14); color:var(--warn); }
.tg-checks li b{ display:block; font-size:12.5px; color:var(--txt); }
.tg-checks li span{ display:block; font-size:11.5px; color:var(--muted); overflow-wrap:anywhere; }
.tg-inline{ display:flex; gap:8px; flex-wrap:wrap; }
.tg-inline input{ flex:1 1 220px; min-width:0; }
.tg-copia{ display:flex; align-items:center; gap:8px; padding:8px 10px; border:1px solid var(--line); border-radius:9px; background:rgba(23,0,0,.55); min-width:0; }
.tg-copia code{ flex:1; min-width:0; overflow-x:auto; white-space:nowrap; font-size:12px; color:var(--pf-200); }
.tg-seg{ align-self:flex-start; }
.tg-lista-texto{ margin:0; padding-left:18px; display:flex; flex-direction:column; gap:4px; font-size:12px; color:var(--txt-dim); }
.tg-modal{ width:min(720px,100%); }
.tg-form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px 14px; margin-top:10px; }
.tg-form-grid select, .tg-form-grid input{ width:100%; }
.tg-span2{ grid-column:1 / -1; }
.tg-toggle{ display:flex; gap:10px; align-items:flex-start; font-size:12.5px; color:var(--txt-dim); }
.tg-toggle input{ margin-top:3px; accent-color:var(--pf-400); }
.tg-passos{ margin:6px 0 0; padding-left:20px; display:flex; flex-direction:column; gap:14px; }
.tg-passos li::marker{ color:var(--pf-300); font-weight:700; }
.tg-passos b{ color:var(--txt); font-size:13px; }
.tg-passos p{ margin:3px 0 6px; font-size:12px; color:var(--txt-dim); }
.tg-etapa{ max-width:760px; }
@media (max-width:900px){
  .tg-shell{ grid-template-columns:1fr; }
  .tg-nav{ position:static; flex-direction:row; flex-wrap:wrap; }
  .tg-nav-head{ width:100%; }
  .tg-nav button{ width:auto; }
  .tg-nav-sep{ display:none; }
  .tg-form-grid{ grid-template-columns:1fr; }
}

/* Track (17/09/2026): seções novas do painel próprio */
.tg-modal-largo{ width:min(920px,100%); }
.tg-form{ display:flex; flex-direction:column; gap:12px; }
.tg-form textarea{ width:100%; resize:vertical; background:var(--bg-0); color:var(--txt); border:1px solid var(--line); border-radius:8px; padding:8px 10px; font:inherit; }
.tg-form textarea:focus{ outline:none; border-color:var(--pf-400); box-shadow:0 0 0 3px rgba(255,166,0,.14); }
.tg-form input[type=color]{ padding:2px; height:36px; }
.tg-fieldset{ border:1px solid var(--line); border-radius:10px; padding:12px 14px; margin:4px 0 0; display:flex; flex-direction:column; gap:10px; }
.tg-fieldset legend{ padding:0 6px; font-size:11px; letter-spacing:1.1px; text-transform:uppercase; color:var(--pf-200); }
.tg-fieldset .tg-form-grid{ margin-top:0; }
.tg-grafico{ width:100%; height:auto; display:block; }
.tg-grafico .tg-bar-in{ fill:var(--pf-400); }
.tg-grafico .tg-bar-out{ fill:var(--bad); opacity:.75; }
.tg-grafico .tg-grade{ stroke:var(--line-strong); stroke-width:1; }
.tg-grafico .tg-grade-leve{ stroke:var(--line); stroke-dasharray:3 4; }
.tg-grafico .tg-eixo{ fill:var(--muted); font-size:10px; font-variant-numeric:tabular-nums; }
.tg-legenda{ display:flex; gap:14px; font-size:11.5px; color:var(--txt-dim); }
.tg-legenda span::before{ content:""; display:inline-block; width:10px; height:10px; border-radius:3px; margin-right:6px; vertical-align:-1px; }
.tg-leg-in::before{ background:var(--pf-400); }
.tg-leg-out::before{ background:var(--bad); opacity:.75; }
.tg-pre{ margin:0; padding:10px 12px; border-radius:9px; border:1px solid var(--line); background:rgba(23,0,0,.55); color:var(--pf-200); overflow-x:auto; font-size:11.5px; line-height:1.5; }
.tg-quebra{ overflow-wrap:anywhere; max-width:340px; }
.tg-erro-texto{ font-size:11.5px; color:var(--txt-dim); max-width:420px; overflow-wrap:anywhere; }
.tg-card td .tg-copia{ min-width:260px; padding:4px 6px; }
.tg-card td .tg-copia code{ font-size:11.5px; }
.tg-kpis .kpi-value{ font-variant-numeric:tabular-nums; }
@media (max-width:900px){ .tg-modal-largo{ width:100%; } .tg-card td .tg-copia{ min-width:200px; } }

/* Track: seção Canal no modelo da Track4you (17/09/2026) */
.tg-canal-vazio{ align-items:center; text-align:center; padding:56px 24px; gap:14px; }
.tg-canal-vazio h3{ font-size:18px; letter-spacing:.3px; text-transform:none; color:#fff; }
.tg-canal-vazio p{ margin:0; max-width:460px; color:var(--txt-dim); font-size:13px; line-height:1.6; }
.tg-canal-icone{ width:72px; height:72px; border-radius:50%; display:grid; place-items:center; font-size:28px; color:var(--pf-300); background:rgba(255,166,0,.1); border:1px solid var(--line); }
.tg-canal-titulo{ font-size:15px !important; letter-spacing:.2px !important; text-transform:none !important; color:#fff !important; }
.tg-passos-caixa{ padding:14px 16px 14px 34px; border:1px solid var(--line); border-radius:12px; background:rgba(23,0,0,.45); margin:10px 0 4px; }
.tg-ajuda{ display:inline-grid; place-items:center; width:18px; height:18px; margin-left:6px; border-radius:50%; font-size:11px; font-weight:700; color:var(--txt-dim); background:rgba(255,255,255,.08); cursor:help; vertical-align:1px; }
.tg-ajuda:focus-visible{ outline:2px solid var(--pf-400); outline-offset:2px; }
[data-tg-novo-canal] .tg-inline select{ flex:1 1 220px; min-width:0; }

/* Track: Novo Funil em duas etapas, no modelo da Track4you (17/09/2026) */
.tg-assistente{ padding:0; overflow:auto; }
.tg-assistente > .modal-head{ display:flex; align-items:center; gap:18px; padding:20px 24px; margin:0; border-bottom:1px solid var(--line); }
.tg-assistente > .tg-form, .tg-assistente > form{ padding:20px 24px 0; }
.tg-assistente-titulo{ display:flex; align-items:center; gap:14px; flex:1; min-width:0; }
.tg-assistente-titulo h3{ font-size:19px; letter-spacing:.2px; text-transform:none; color:#fff; }
.tg-assistente-titulo p{ margin:2px 0 0; font-size:13px; color:var(--txt-dim); }
.tg-assistente-icone{ flex:none; width:46px; height:46px; border-radius:12px; display:grid; place-items:center; font-size:20px; color:var(--pf-300); background:rgba(255,166,0,.1); border:1px solid var(--line); }
.tg-etapas{ list-style:none; margin:0; padding:0; display:flex; align-items:flex-start; gap:0; }
.tg-etapas li{ display:flex; flex-direction:column; align-items:center; gap:6px; width:92px; position:relative; font-size:11.5px; color:var(--muted); }
.tg-etapas li + li::before{ content:""; position:absolute; top:17px; right:62px; width:62px; height:2px; background:var(--line-strong); }
.tg-etapas li i{ width:34px; height:34px; border-radius:50%; display:grid; place-items:center; font-style:normal; font-weight:700; font-size:13px; color:var(--txt-dim); background:rgba(255,255,255,.08); position:relative; z-index:1; }
.tg-etapas li.feito i{ background:var(--pf-400); color:#10180a; }
.tg-etapas li.atual span{ color:#fff; font-weight:600; }
.tg-assistente-rodape{ margin:18px -24px 0; padding:16px 24px; border-top:1px solid var(--line); display:flex; justify-content:space-between; gap:10px; flex-wrap:wrap; }
.tg-assistente-rodape .btn-primary{ margin-left:auto; }
.tg-funil-form .field > span small{ text-transform:none; letter-spacing:0; color:var(--muted); font-weight:400; }
.tg-interruptor{ display:flex; align-items:center; gap:12px; min-height:40px; padding:6px 12px; border:1px solid var(--line); border-radius:8px; background:var(--bg-0); cursor:pointer; position:relative; }
.tg-interruptor input{ position:absolute; opacity:0; width:1px; height:1px; }
.tg-interruptor > i{ flex:none; width:40px; height:22px; border-radius:999px; background:rgba(255,255,255,.14); position:relative; transition:background .15s; }
.tg-interruptor > i::after{ content:""; position:absolute; top:3px; left:3px; width:16px; height:16px; border-radius:50%; background:#fff; transition:transform .15s; }
.tg-interruptor input:checked + i{ background:var(--pf-500); }
.tg-interruptor input:checked + i::after{ transform:translateX(18px); }
.tg-interruptor input:focus-visible + i{ outline:2px solid var(--pf-400); outline-offset:2px; }
.tg-interruptor > b{ flex:1; font-size:13px; font-weight:600; color:var(--txt); }
.tg-dica{ flex:none; position:relative; width:20px; height:20px; border-radius:50%; display:grid; place-items:center; font-size:11px; font-weight:700; color:#10180a; background:var(--pf-300); cursor:help; }
.tg-dica-balao{ display:none; position:absolute; right:-8px; bottom:calc(100% + 10px); width:270px; padding:10px 12px; border-radius:10px; border:1px solid var(--line-strong); background:var(--bg-2); box-shadow:0 12px 30px rgba(0,0,0,.45); font-size:12px; font-weight:400; color:var(--txt); text-align:left; z-index:5; line-height:1.5; }
.tg-dica-balao b{ display:block; margin-bottom:6px; font-weight:600; }
.tg-dica-balao span{ display:block; }
.tg-dica-balao .ok{ color:var(--ok); }
.tg-dica-balao .warn{ color:var(--warn); }
.tg-dica:hover .tg-dica-balao, .tg-dica:focus .tg-dica-balao, .tg-dica:focus-within .tg-dica-balao{ display:block; }
.tg-urls{ list-style:none; margin:8px 0 0; padding:0; display:flex; flex-direction:column; gap:6px; }
.tg-urls li{ display:flex; align-items:center; gap:8px; padding:6px 6px 6px 12px; border:1px solid var(--line); border-radius:8px; background:rgba(23,0,0,.45); font-size:12.5px; }
.tg-urls li span{ flex:1; min-width:0; overflow-wrap:anywhere; color:var(--pf-200); }
.tg-urls-lista{ margin:6px 0 0; padding-left:18px; font-size:12px; display:flex; flex-direction:column; gap:2px; }
@media (max-width:700px){ .tg-etapas{ display:none; } .tg-assistente > .modal-head{ padding:16px; } .tg-assistente > .tg-form, .tg-assistente > form{ padding:16px 16px 0; } .tg-assistente-rodape{ margin:18px -16px 0; padding:14px 16px; } }
.tg-funil-form .tg-interruptor, .tg-funil-form .tg-urls, .tg-funil-form select{ text-transform:none; letter-spacing:normal; font-size:13px; }
.tg-funil-form .tg-dica-balao{ font-size:12px; }

/* Track: todos os campos no mesmo visual escuro do painel (17/09/2026). O estilo global só pegava
   input[type=text|number|date]; campo sem type, senha, data/hora e textarea ficavam brancos. */
:is(.tg-main, .tg-modal) :is(input:not([type=checkbox]):not([type=radio]):not([type=color]):not([type=range]), select, textarea){
  width:100%; min-height:40px; box-sizing:border-box;
  font:inherit; font-size:13px; line-height:1.4; letter-spacing:normal; text-transform:none;
  color:var(--txt); background:rgba(23,0,0,.7); color-scheme:dark;
  border:1px solid var(--line); border-radius:9px; padding:9px 12px;
  transition:border-color .15s, box-shadow .15s, background .15s;
}
:is(.tg-main, .tg-modal) textarea{ min-height:96px; resize:vertical; }
:is(.tg-main, .tg-modal) :is(input, textarea)::placeholder{ color:var(--muted); opacity:1; }
:is(.tg-main, .tg-modal) :is(input:not([type=checkbox]):not([type=radio]), select, textarea):hover:not(:disabled){ border-color:var(--line-strong); }
:is(.tg-main, .tg-modal) :is(input:not([type=checkbox]):not([type=radio]), select, textarea):focus{
  outline:none; border-color:var(--pf-400); background:rgba(23,0,0,.9); box-shadow:0 0 0 3px rgba(255,166,0,.14);
}
:is(.tg-main, .tg-modal) :is(input, select, textarea):disabled{ opacity:.55; cursor:not-allowed; }
:is(.tg-main, .tg-modal) input[readonly]{ color:var(--txt-dim); background:rgba(255,255,255,.03); }
:is(.tg-main, .tg-modal) input[type=color]{ width:100%; height:40px; padding:4px; border:1px solid var(--line); border-radius:9px; background:rgba(23,0,0,.7); cursor:pointer; }
/* preenchimento automático do Chrome pinta o campo de branco/amarelo */
:is(.tg-main, .tg-modal) :is(input, textarea, select):-webkit-autofill{
  -webkit-text-fill-color:var(--txt); caret-color:var(--txt);
  -webkit-box-shadow:0 0 0 1000px #0b1008 inset; box-shadow:0 0 0 1000px #0b1008 inset;
  transition:background-color 9999s ease-out 0s;
}
:is(.tg-main, .tg-modal) .tg-inline{ align-items:stretch; }
:is(.tg-main, .tg-modal) .tg-inline :is(input, select){ flex:1 1 220px; width:auto; }
:is(.tg-main, .tg-modal) .tg-inline .btn{ flex:none; }
.tg-select select{ width:auto; min-width:200px; }

/* Track · Bot IA (17/09/2026) */
.tg-botia-etapas{ display:flex; flex-direction:column; gap:8px; }
.tg-botia-etapa{ display:grid; grid-template-columns:28px 1fr 1fr auto; gap:8px; align-items:start; }
.tg-botia-etapa .num{ font-weight:700; color:var(--txt-dim); padding-top:9px; text-align:center; }
.tg-botia-etapa textarea{ min-height:38px; }
.tg-chat{ display:flex; flex-direction:column; gap:8px; max-height:420px; overflow:auto; padding:6px 2px; }
.tg-chat .balao{ max-width:78%; padding:8px 12px; border-radius:14px; font-size:13px; line-height:1.4; white-space:pre-wrap; word-break:break-word; }
.tg-chat .balao.lead{ align-self:flex-end; background:var(--pf-400); color:#10180a; border-bottom-right-radius:4px; }
.tg-chat .balao.bot{ align-self:flex-start; background:rgba(255,255,255,.08); color:var(--txt); border-bottom-left-radius:4px; }
.tg-chat .balao small{ display:block; margin-top:4px; font-size:10.5px; opacity:.7; }
.tg-simulador{ display:flex; gap:8px; margin-top:10px; }
.tg-simulador input{ flex:1; }
@media (max-width:700px){ .tg-botia-etapa{ grid-template-columns:24px 1fr auto; } .tg-botia-etapa textarea:nth-child(3){ grid-column:2; } }

/* Track · três áreas (Bot Porteiro, Bot Atendimento, VSL Longa) e inbox com comprovante (17/09/2026) */
.tg-comprovante{ display:flex; justify-content:center; padding:6px 0; }
.tg-comprovante img{ max-width:100%; max-height:70vh; border-radius:10px; border:1px solid var(--line); background:#fff; }
.tg-lead{ padding:10px 12px; margin:6px 0 10px; border:1px solid var(--line); border-radius:10px; background:rgba(23,0,0,.35); }
.tg-lead .tg-acoes{ margin-top:6px; }
.tg-texto.tg-span2{ grid-column:1 / -1; margin:0; }

/* Bot Atendimento · roteiro Príncipe v3 (18/09/2026) */
.tg-midias{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; }
.tg-midia{ padding:12px 14px; border:1px solid var(--line); border-radius:12px; background:rgba(23,0,0,.35); }
.tg-midia b{ display:block; margin-bottom:6px; }
.tg-midia .tg-acoes{ display:flex; gap:8px; align-items:center; flex-wrap:wrap; }
.tg-midia label.btn{ cursor:pointer; }

/* Inbox · detalhe da conversa do roteiro: régua do funil, resumo e marcos no chat (19/09/2026) */
.tg-funil{ list-style:none; margin:8px 0 6px; padding:0; display:grid; grid-template-columns:repeat(6,1fr); gap:4px; }
.tg-funil li{ display:flex; flex-direction:column; align-items:center; gap:3px; padding:8px 4px; border-radius:8px; border:1px solid var(--line); background:rgba(255,255,255,.03); text-align:center; min-width:0; }
.tg-funil li .tg-funil-n{ width:22px; height:22px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; border:1px solid var(--line); color:var(--muted); }
.tg-funil li .tg-funil-nome{ font-size:11.5px; color:var(--txt-dim); line-height:1.2; }
.tg-funil li small{ font-size:10px; color:var(--muted); min-height:12px; }
.tg-funil li.feita{ border-color:rgba(163,230,53,.35); }
.tg-funil li.feita .tg-funil-n{ background:var(--pf-400); color:#10180a; border-color:transparent; }
.tg-funil li.feita .tg-funil-nome{ color:var(--txt); }
.tg-funil li.atual{ border-color:rgba(251,191,36,.6); background:rgba(251,191,36,.08); box-shadow:0 0 0 1px rgba(251,191,36,.25) inset; }
.tg-funil li.atual .tg-funil-n{ background:rgba(251,191,36,.9); color:#1a1200; border-color:transparent; }
.tg-funil li.atual .tg-funil-nome{ color:var(--txt); font-weight:600; }
.tg-funil li.futura{ opacity:.45; }
.tg-resumo{ margin:0 0 8px; font-size:12.5px; line-height:1.45; color:var(--txt-dim); }
.tg-chat.tg-chat-roteiro{ max-height:480px; }
.tg-chat .balao.sistema{ align-self:center; max-width:92%; padding:4px 10px; border-radius:999px; font-size:11.5px; background:rgba(255,255,255,.05); color:var(--txt-dim); border:1px solid var(--line); text-align:center; white-space:normal; }
.tg-chat .balao.sistema small{ display:inline; margin:0 0 0 6px; font-size:10px; }
.tg-chat .balao.sistema.etapa{ background:transparent; border-style:dashed; color:var(--muted); text-transform:uppercase; letter-spacing:.04em; font-size:10.5px; margin-top:4px; }
.tg-chat .balao.sistema.lead-acao{ border-color:rgba(163,230,53,.45); color:var(--txt); }
.tg-chat .balao.sistema.toque{ border-color:rgba(251,191,36,.45); }
.tg-chat .balao.sistema.link, .tg-chat .balao.sistema.casa{ border-color:rgba(96,165,250,.45); }
.tg-chat .balao.sistema.liberado{ border-color:rgba(163,230,53,.7); background:rgba(163,230,53,.12); color:var(--txt); }
.tg-chat .balao.sistema.erro{ border-color:rgba(248,113,113,.5); color:#fca5a5; }
.tg-chat .balao .tg-tag{ display:inline-block; font-size:10px; padding:1px 6px; border-radius:999px; background:rgba(255,255,255,.1); margin-bottom:4px; }
@media (max-width:700px){ .tg-funil{ grid-template-columns:repeat(3,1fr); } }

/* botões inline do Telegram desenhados no chat do Inbox (19/09/2026) */
.tg-chat .balao .tg-botoes-tg{ display:flex; flex-wrap:wrap; gap:6px; margin-top:8px; }
.tg-chat .balao .tg-botao-tg{ display:inline-flex; align-items:center; gap:6px; padding:5px 12px; border-radius:8px; font-size:12px; font-weight:600; background:rgba(96,165,250,.18); color:#bfdbfe; border:1px solid rgba(96,165,250,.45); }
.tg-chat .balao .tg-botao-tg small{ display:inline; margin:0; font-weight:400; font-size:10px; opacity:.75; }

/* Filtro de promoção com multi-seleção (20/09/2026). Nada marcado = todas.
 * Mesma cara do select de Plataforma/Funil; abre uma lista com caixas de marcar. */
.multi-dropdown{ position:relative; }
.multi-dropdown-botao{
  display:block; width:100%; min-width:155px; padding:7px 30px 7px 9px;
  font:inherit; font-size:12px; line-height:1.43; color:var(--txt); text-align:left;
  background:rgba(23,0,0,.7) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath d='M2.5 4.5 6 8l3.5-3.5' fill='none' stroke='%23E9F3DD' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 10px center;
  border:1px solid var(--line); border-radius:8px; cursor:pointer;
}
.multi-dropdown-texto{ display:block; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.multi-dropdown-botao:focus-visible,.multi-dropdown-botao[aria-expanded="true"]{
  outline:none; border-color:var(--pf-400); box-shadow:0 0 0 3px rgba(255,166,0,.14);
}
.multi-dropdown-lista{
  position:absolute; top:calc(100% + 4px); left:0; z-index:40; min-width:100%;
  display:grid; gap:1px; padding:4px; background:var(--bg-2);
  border:1px solid var(--line-strong); border-radius:8px; box-shadow:var(--shadow);
}
.multi-dropdown-lista[hidden]{ display:none; }
.multi-dropdown .multi-dropdown-item{
  display:flex; align-items:center; gap:8px; min-width:0; padding:6px 8px;
  border-radius:6px; font-size:12px; color:var(--txt); cursor:pointer; white-space:nowrap;
}
.multi-dropdown .multi-dropdown-item > span{ color:inherit; font-size:12px; text-transform:none; letter-spacing:normal; }
.multi-dropdown .multi-dropdown-item:hover{ background:rgba(255,166,0,.08); }
.multi-dropdown-item input{ width:14px; height:14px; margin:0; accent-color:var(--pf-300); cursor:pointer; }
