@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--bg:#f5f7f4;--paper:#fff;--ink:#10201d;--muted:#71817c;--line:#e6ece8;--green:#13855b;--mint:#69e3ae;--deep:#071614;--soft:#eafff3;--purple:#9e8bef;--amber:#efb052}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:14px/1.45 Manrope,Arial,sans-serif}.app-shell{min-height:100vh;display:grid;grid-template-columns:252px 1fr}.sidebar{background:var(--deep);color:#c1d1cb;padding:26px 18px 20px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.brand{color:#fff;text-decoration:none;display:flex;align-items:center;gap:11px;font-size:15px;line-height:1.05;letter-spacing:.03em}.brand b{font-weight:500;color:var(--mint)}.brand-mark{width:35px;height:35px;border-radius:11px;background:linear-gradient(135deg,#5de4aa,#0a7d55);display:grid;place-items:center;color:#062016;font-weight:800;font-size:20px;box-shadow:0 5px 18px #50d89d3a}.sidebar nav{margin-top:65px;display:grid;gap:7px}.nav-link,.settings{border:0;background:none;color:#94aaa2;text-align:left;font:600 14px Manrope;padding:12px 13px;border-radius:10px;text-decoration:none;transition:.2s}.nav-link span,.settings span{display:inline-block;width:25px;font-size:17px;color:#80a095}.nav-link:hover,.nav-link.active{background:#14332b;color:#fff}.nav-link.active span{color:var(--mint)}.sidebar-bottom{margin-top:auto}.team-card{border-top:1px solid #1d3b33;padding:18px 3px;display:flex;align-items:center;gap:9px}.avatar,.profile{display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#ffcda3,#e87d66);color:#4a1712;font-size:10px;font-weight:800;width:34px;height:34px}.team-card small{display:block;color:#7b968d;font-size:10px}.team-card b{font-size:12px;color:#e5f2ed}.more{margin-left:auto;color:#7b968d;border:0;background:none}.settings{width:100%;border-top:1px solid #1d3b33;margin-top:1px;padding-top:17px}main{padding:42px 52px 50px;max-width:1680px;width:100%;margin:auto}.topbar{display:flex;align-items:center;justify-content:space-between;gap:28px}.eyebrow{text-transform:uppercase;color:#7b9188;letter-spacing:.13em;font:500 10px DM Mono,monospace;margin:0 0 7px}.topbar h1{font-size:29px;letter-spacing:-1.4px;margin:0;font-weight:800}.top-actions{display:flex;align-items:center;gap:14px}.preview-pill,.small-pill{background:#e6faee;border:1px solid #cbf2db;color:#16855d;padding:8px 12px;border-radius:50px;font:600 11px Manrope}.preview-pill i{width:7px;height:7px;display:inline-block;background:#23d286;border-radius:50%;margin-right:6px;box-shadow:0 0 0 3px #baf4d7}.icon-button{position:relative;border:1px solid var(--line);background:var(--paper);border-radius:10px;width:38px;height:38px;color:#50655d;font-size:19px}.icon-button sup{background:#e5635a;color:#fff;font:700 9px Manrope;width:15px;height:15px;border-radius:50%;display:grid;place-items:center;position:absolute;top:-6px;right:-6px}.profile{border:0;width:36px;height:36px}.control-bar{margin:34px 0 12px;padding:11px 12px;background:#fff;border:1px solid var(--line);border-radius:14px;display:flex;align-items:center;gap:18px;box-shadow:0 7px 20px #12342108}.period-control{display:flex;align-items:center;gap:10px;border-right:1px solid var(--line);padding-right:20px}.period-control small,.filter-wrap label{color:var(--muted);display:block;font-size:10px}.period-control b{font-size:12px}.calendar{color:var(--green);background:#effaf4;border:0;border-radius:9px;width:32px;height:32px}.chevron,.panel-menu{border:0;background:none;color:#82928d}.filter-wrap{min-width:155px}.filter-wrap select{border:0;background:transparent;font:700 12px Manrope;color:#18342d;outline:0;padding:2px 15px 2px 0}.segmented{margin-left:auto;background:#f0f4f1;padding:3px;border-radius:8px}.segmented button{border:0;background:transparent;color:#7a8b85;font:700 11px Manrope;padding:7px 10px;border-radius:6px}.segmented button.selected{background:#fff;color:#193a31;box-shadow:0 1px 4px #173a2b12}.export{border:1px solid #b8ead0;background:#eafff3;color:#08784e;padding:10px 13px;border-radius:8px;font:700 11px Manrope}.demo-note{color:#84928d;margin:0 0 21px;font-size:11px}.metrics{display:grid;grid-template-columns:1.25fr 1fr 1fr 1fr;gap:16px}.metric-card,.panel{background:var(--paper);border:1px solid var(--line);border-radius:15px;box-shadow:0 8px 25px #12342107}.metric-card{min-height:178px;padding:19px;position:relative;overflow:hidden}.metric-card.featured{background:linear-gradient(140deg,#0a201a,#0e3025);border-color:#0a201a;color:#eefbf4}.metric-top{display:flex;justify-content:space-between;align-items:center;font-size:11px;font-weight:700;color:#7a8d86}.featured .metric-top{color:#a8c8ba}.metric-card strong{display:block;font-size:25px;letter-spacing:-1px;margin:14px 0 5px}.metric-card p{color:#81938c;margin:0;font-size:11px}.featured p{color:#a6c4b7}.positive{color:#29c581}.negative{color:#e27676}.glyph{color:#189567;background:#e7f8ef;border-radius:8px;padding:6px;font-size:15px}.purple{background:#f0edff;color:#8c73e8}.amber{background:#fff4df;color:#d58a1f}.metric-footer{position:absolute;bottom:16px;color:#7b8c86;font-size:10px}.dot{width:7px;height:7px;display:inline-block;border-radius:50%}.mint-dot{background:#34d891}.progress{height:7px;background:#f0f1ee;border-radius:10px;margin-top:21px;overflow:hidden}.progress span{display:block;width:78%;height:100%;background:linear-gradient(90deg,#1a9c69,#6de2ac);border-radius:10px}.sparkline{position:absolute;right:-6px;bottom:0;width:62%;height:58px;background:linear-gradient(180deg,#50dca74a,transparent);clip-path:polygon(0 80%,9% 69%,18% 72%,30% 48%,39% 54%,50% 29%,60% 43%,71% 13%,81% 30%,90% 4%,100% 12%,100% 100%,0 100%);opacity:.85}.dashboard-grid{display:grid;grid-template-columns:1.62fr 1fr;gap:16px;margin-top:16px}.panel{padding:22px}.panel header{display:flex;align-items:flex-start;justify-content:space-between}.panel h2{font-size:16px;letter-spacing:-.5px;margin:0}.chart-key{display:flex;gap:17px;margin:24px 0 4px;font-size:10px;color:#778982}.chart-key i{width:9px;height:9px;display:inline-block;border-radius:50%;margin-right:5px}.key-fill{background:#48d89b}.key-line{border:1px dashed #99aaa4;border-radius:0!important}.chart{display:flex;height:232px}.y-axis{width:52px;padding:11px 8px 30px 0;display:flex;flex-direction:column;justify-content:space-between;color:#94a29e;font:10px DM Mono}.plot{position:relative;flex:1}.grid-lines{position:absolute;inset:10px 0 30px;display:flex;flex-direction:column;justify-content:space-between}.grid-lines i{border-top:1px dashed #dce5e0}.goal-line{position:absolute;top:65px;left:0;right:0;border-top:1px dashed #95aaa1}.goal-line span{position:absolute;right:0;top:-17px;background:#eff4f1;color:#80918a;font:9px DM Mono;padding:2px 5px}.plot svg{position:absolute;inset:10px 0 30px;width:100%;height:calc(100% - 40px)}.x-axis{position:absolute;left:0;right:0;bottom:0;display:flex;justify-content:space-between;color:#94a29e;font:9px DM Mono}.status-panel{padding-bottom:13px}.connection-summary{background:#effbf4;margin:22px 0 11px;border-radius:11px;padding:12px;display:flex;gap:10px;align-items:center}.connection-summary b,.connection-summary small{display:block}.connection-summary b{font-size:12px}.connection-summary small{font-size:10px;color:#75877f}.pulse{width:9px;height:9px;border-radius:50%;background:#24d383;box-shadow:0 0 0 5px #c7f4da}.connection-list{list-style:none;padding:0;margin:0}.connection-list li{display:flex;align-items:center;gap:9px;padding:10px 0;border-bottom:1px solid #edf1ee}.connection-list li:last-child{border:0}.client-badge{width:28px;height:28px;display:grid;place-items:center;border-radius:8px;font-weight:800;font-size:9px}.junior{background:#d8f6e5;color:#0b7d52}.raphael{background:#eae3ff;color:#765ed5}.laundry{background:#fff0d5;color:#c27b12}.npd{background:#e7eef0;color:#52646b}.connection-list b,.connection-list small{display:block}.connection-list b{font-size:11px}.connection-list small{font-size:9px;color:#83918c}.status{margin-left:auto;font:700 9px Manrope;padding:5px 7px;border-radius:5px}.ok{background:#ddf8e8;color:#148055}.wait{background:#fff2d9;color:#bb7a1b}.text-button{border:0;background:none;color:#11855a;font:700 11px Manrope;padding:13px 0 0}.text-button span{margin-left:5px}.lower-grid{display:grid;grid-template-columns:1fr 1.62fr;gap:16px;margin-top:16px}.client-rows{margin-top:13px}.client-row{display:grid;grid-template-columns:28px 1fr auto;gap:9px;align-items:center;padding:10px 0;border-bottom:1px solid #edf1ee}.client-row b,.client-row small{display:block}.client-row b{font-size:11px}.client-row small{font-size:9px;color:#81918b}.client-value{text-align:right;font-size:11px}.client-value b{color:#11855a}.client-value small{font-size:9px}.table-wrap{margin-top:14px;overflow:auto}table{width:100%;border-collapse:collapse;text-align:left}th{font:500 9px DM Mono;text-transform:uppercase;color:#87958f;padding:0 8px 9px}td{font-size:11px;padding:11px 8px;border-top:1px solid #edf1ee;white-space:nowrap}td:nth-child(3){font-weight:800;color:#13855b}td:last-child{color:#82918c;font-size:10px}#toast{position:fixed;right:22px;bottom:22px;background:#102b23;color:#fff;padding:12px 15px;border-radius:9px;font-size:12px;box-shadow:0 10px 30px #05150e42;opacity:0;transform:translateY(12px);transition:.25s;pointer-events:none}#toast.visible{opacity:1;transform:none}@media(max-width:1100px){main{padding:32px}.metrics{grid-template-columns:repeat(2,1fr)}.dashboard-grid,.lower-grid{grid-template-columns:1fr}.sidebar{width:70px;padding:22px 10px}.app-shell{grid-template-columns:70px 1fr}.brand>span:last-child,.nav-link:not(.active)::after,.nav-link{font-size:0}.brand{justify-content:center}.nav-link{padding:13px;text-align:center}.nav-link span{width:auto;font-size:18px}.team-card div,.team-card .more,.settings{display:none}.team-card{justify-content:center}.topbar h1{font-size:25px}}@media(max-width:700px){.app-shell{display:block}.sidebar{position:static;width:auto;height:auto;display:flex;flex-direction:row;align-items:center;padding:14px 16px}.sidebar nav{margin:0 auto;display:flex}.sidebar-bottom{display:none}.brand{margin-right:12px}.nav-link{padding:8px}.nav-link.active{background:none}.topbar,.control-bar{align-items:flex-start;flex-direction:column}.top-actions{position:absolute;right:18px;top:18px}.preview-pill,.icon-button{display:none}main{padding:25px 16px}.topbar h1{max-width:230px;font-size:23px}.control-bar{gap:12px;padding:13px}.period-control{border:0;padding:0}.segmented{margin:0}.metrics{grid-template-columns:1fr}.metric-card{min-height:150px}.chart{height:210px}.panel{padding:17px}.connection-list li{gap:7px}.lower-grid{margin-top:16px}}

/* Anuncios (Meta Ads). Reusa metric-card, panel, control-bar, status e table-wrap.
   Nenhuma cor ou fonte nova: so as custom properties ja definidas no :root. */
.ads-section{margin-top:34px;scroll-margin-top:24px}
.section-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:2px}
.section-head h2{font-size:17px;letter-spacing:-.5px;margin:0}
.ads-section .control-bar{margin:14px 0 10px}
.ads-metrics{grid-template-columns:repeat(3,1fr)}
.ads-metrics .metric-card{min-height:124px}
.ads-metrics .metric-card strong{font-size:23px;margin:12px 0 5px}
.ads-metrics .metric-card p{min-height:26px}
.ads-metrics.loading .metric-card strong{color:var(--line);animation:ads-pulse 1.1s ease-in-out infinite}
@keyframes ads-pulse{0%,100%{opacity:1}50%{opacity:.45}}
.ads-panel{margin-top:16px}
.ads-panel td b{display:block;font-size:11px}
.ads-panel td small{display:block;color:#8b9a94;font-size:9px;margin-top:2px;font-weight:400}
.ads-panel td:nth-child(3){font-weight:800;color:var(--green)}
.ads-panel td:last-child{color:#82918c;font-size:10px}
.ads-state{text-align:center;color:var(--muted);font-size:11px;padding:26px 8px;white-space:normal}
.ads-state.loading{color:var(--green)}
.ads-error{background:#fdecec;border:1px solid #f6d2d2;color:#a33c3c;border-radius:12px;padding:12px 14px;font-size:11px;line-height:1.5;margin:0 0 14px}
.ads-error.warn{background:#fff6e3;border-color:#f2e0bb;color:#8a6318}
@media(max-width:1100px){.ads-metrics{grid-template-columns:repeat(2,1fr)}}
@media(max-width:700px){.ads-metrics{grid-template-columns:1fr}.section-head{flex-direction:column;gap:10px}}

/* Badge dentro da celula da tabela. Era style= inline, que a CSP bloqueia. */
.inline-badge{display:inline-grid;margin-right:7px;vertical-align:middle}

/* Paginas. O [hidden] precisa da regra explicita porque qualquer display de
   autor no seletor venceria a folha do navegador. */
.page[hidden]{display:none}
.single-grid{display:grid;grid-template-columns:1fr;gap:16px;margin-top:16px}
.page > .control-bar:first-child{margin-top:0}
/* Botao de alteracao na linha. Discreto de proposito: e uma acao que mexe na Meta. */
.row-action{border:1px solid var(--line);background:#fff;color:#18342d;font:700 10px Manrope;padding:6px 10px;border-radius:7px;cursor:pointer}
.row-action:hover{border-color:var(--green);color:var(--green)}

/* Blocos novos: resumo de anuncios, meta, cadastro de cliente, configuracoes. */
.resumo-linha{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:16px 0 4px;padding:14px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.resumo-linha small{display:block;color:var(--muted);font-size:10px;margin-bottom:4px}
.resumo-linha b{font-size:17px;letter-spacing:-.4px}
.meta-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:18px 0 12px}
.meta-grid small{display:block;color:var(--muted);font-size:10px;margin-bottom:4px}
.meta-grid b{font-size:22px;letter-spacing:-.6px}
.meta-progress{margin-bottom:18px}
.meta-form{display:flex;flex-wrap:wrap;align-items:flex-end;gap:10px;border-top:1px solid var(--line);padding-top:16px}
.meta-form label{display:block;width:100%;font:500 10px DM Mono,monospace;text-transform:uppercase;letter-spacing:.13em;color:#7b9188;margin-bottom:2px}
.meta-form input{border:1px solid var(--line);border-radius:9px;padding:10px 12px;font:700 13px Manrope;color:var(--ink);outline:0;background:#fbfdfb;min-width:180px}
.meta-form input:focus{border-color:var(--green);box-shadow:0 0 0 3px #13855b1f}
.meta-form button,.novo-cliente button,.segredo button{border:0;border-radius:9px;background:var(--deep);color:#eefbf4;font:700 12px Manrope;padding:11px 16px;cursor:pointer}
.meta-form button:disabled{opacity:.6}
.novo-cliente{margin-top:14px;border-top:1px solid var(--line);padding-top:14px}
.novo-cliente label{display:block;font:500 10px DM Mono,monospace;text-transform:uppercase;letter-spacing:.13em;color:#7b9188;margin:10px 0 4px}
.novo-cliente input,.novo-cliente select{width:100%;border:1px solid var(--line);border-radius:9px;padding:10px 12px;font:600 13px Manrope;color:var(--ink);outline:0;background:#fbfdfb}
.novo-cliente button{margin-top:14px;width:100%}
.segredo{background:#fff8e6;border:1px solid #f2e0bb;border-radius:12px;padding:14px}
.segredo b{font-size:13px}
.segredo p{color:#8a6318;font-size:11px;margin:6px 0 12px;line-height:1.5}
.segredo label{color:#8a6318}
.segredo code{display:block;background:#fff;border:1px solid #f2e0bb;border-radius:8px;padding:9px 10px;font:500 10px DM Mono,monospace;word-break:break-all;color:#3b2f12}
.client-value small{display:block;color:var(--muted);font-size:9px;font-weight:400}
.ads-state.muted code{background:#f0f4f1;border-radius:5px;padding:2px 6px;font:500 10px DM Mono,monospace}
a.small-pill,a.text-button,a.icon-button,a.profile,a.settings{text-decoration:none;display:inline-block}
a.settings{display:block}
.small-pill.wait{background:#fff2d9;border-color:#f2e0bb;color:#bb7a1b}
#cfgServer td{white-space:normal}
@media(max-width:900px){.resumo-linha{grid-template-columns:repeat(2,1fr)}.meta-grid{grid-template-columns:1fr}}

/* ---------------------------------------------------------------------------
   Tela de login. Tela inteira, dividida: marca à esquerda no verde escuro da
   casa, formulário à direita no claro. Sem cor nem fonte nova — as mesmas
   custom properties do painel.
--------------------------------------------------------------------------- */
.gate{position:fixed;inset:0;z-index:50;display:grid;grid-template-columns:1.05fr .95fr;background:var(--bg)}
.gate[hidden]{display:none}

/* --- lado da marca --- */
.gate-brand{position:relative;overflow:hidden;background:linear-gradient(150deg,#071614 0%,#0b241d 52%,#0e3025 100%);color:#eefbf4;padding:46px 52px;display:flex;flex-direction:column;justify-content:space-between}
/* Brilho suave atrás do texto, para o verde não ficar chapado. */
.gate-brand::before{content:"";position:absolute;top:-28%;right:-18%;width:70%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,#13855b55,transparent 68%);pointer-events:none}
.gate-logo{display:flex;align-items:center;gap:12px;font:700 15px Manrope;line-height:1.15;position:relative}
.gate-logo b{color:var(--mint)}
.gate-logo .brand-mark{width:38px;height:38px;display:grid;place-items:center;font-size:17px}
.gate-pitch{position:relative;max-width:26ch}
.gate-pitch h2{font-size:32px;line-height:1.18;letter-spacing:-1.1px;margin:0 0 14px;font-weight:800}
.gate-pitch p{color:#9fc4b5;font-size:13px;line-height:1.62;margin:0}
.gate-art{position:absolute;left:0;right:0;bottom:58px;width:100%;height:150px;opacity:.85;pointer-events:none}
.gate-foot{position:relative;color:#6d8f83;font:500 10px DM Mono,monospace;text-transform:uppercase;letter-spacing:.14em}

/* --- lado do formulário --- */
.gate-panel{display:grid;place-items:center;padding:40px 32px}
.gate-card{width:min(370px,100%);display:flex;flex-direction:column}
.gate-card .eyebrow{margin-bottom:9px}
.gate-card h1{font-size:27px;letter-spacing:-.9px;margin:0 0 7px;line-height:1.2}
.gate-card>p{color:var(--muted);font-size:12px;line-height:1.6;margin:0 0 26px}
.gate-card label{font:500 10px DM Mono,monospace;text-transform:uppercase;letter-spacing:.13em;color:#7b9188;margin-bottom:7px}
.gate-card label+input{margin-bottom:16px}
.gate-card input{border:1px solid var(--line);border-radius:11px;padding:13px 14px;font:600 13px Manrope;color:var(--ink);outline:0;background:var(--paper);transition:border-color .15s,box-shadow .15s}
.gate-card input:focus{border-color:var(--green);box-shadow:0 0 0 3px #13855b1f}
.gate-card button{margin-top:8px;border:0;border-radius:11px;background:var(--deep);color:#eefbf4;font:700 13px Manrope;padding:14px;cursor:pointer;transition:background .15s,transform .06s}
.gate-card button:hover:not(:disabled){background:#0d2b23}
.gate-card button:active:not(:disabled){transform:translateY(1px)}
.gate-card button:disabled{opacity:.55;cursor:default}
.gate-nota{color:#93a29c;font-size:10px;line-height:1.5;margin-top:16px;text-align:center}
.gate-error{background:#fdecec;border:1px solid #f6d2d2;color:#a33c3c;border-radius:10px;padding:11px 13px;font-size:11px;line-height:1.5;margin:2px 0 14px}

/* Empilha no celular: faixa da marca em cima, formulário embaixo. */
@media(max-width:860px){
  .gate{grid-template-columns:1fr;grid-template-rows:auto 1fr;overflow-y:auto}
  .gate-brand{padding:28px 26px 30px;gap:20px}
  .gate-pitch h2{font-size:23px}
  .gate-art,.gate-foot{display:none}
  .gate-panel{padding:32px 26px 44px;align-items:start}
}

/* ---------------------------------------------------------------------------
   Refino visual: cards de métrica, cabeçalho da tabela e barra de filtros.
--------------------------------------------------------------------------- */

/* O seletor de nível mora no cabeçalho da tabela que ele comanda, não na barra
   de filtros da página: ele muda as LINHAS, não o período nem a conta. */
.ads-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}
.ads-panel-tools{display:flex;align-items:center;gap:10px;margin-left:auto}
.ads-panel-tools .segmented{margin-left:0}
.ads-panel-tools .small-pill{white-space:nowrap}

/* Cards de anúncio: número em destaque, rótulo discreto, glifo alinhado. */
.ads-metrics .metric-card{min-height:132px;padding:18px 20px;display:flex;flex-direction:column;transition:border-color .15s,box-shadow .15s}
.ads-metrics .metric-card:hover{border-color:#d6e3db;box-shadow:0 10px 28px #1234210f}
.ads-metrics .metric-top{font-size:10px;letter-spacing:.04em;text-transform:uppercase;color:#8a9a94}
.ads-metrics .metric-card strong{font-size:26px;letter-spacing:-1px;margin:13px 0 6px;font-variant-numeric:tabular-nums}
.ads-metrics .metric-card p{font-size:10.5px;line-height:1.45;color:#8a9a94;margin-top:auto;min-height:30px}
.ads-metrics .glyph{width:28px;height:28px;display:grid;place-items:center;font-size:13px;border-radius:9px}

/* Linha de contexto acima dos cards: uma frase, não campos colados por ponto. */
#adsUpdated{color:#84928d;font-size:11px;margin:2px 0 18px;line-height:1.5}

/* Barra de filtros com mais ar e separador entre os campos. */
.ads-section .control-bar{padding:13px 16px;gap:0;flex-wrap:wrap}
.ads-section .control-bar .filter-wrap{min-width:200px;padding-right:22px;margin-right:22px;border-right:1px solid var(--line)}
.ads-section .control-bar .filter-wrap label{margin-bottom:3px;letter-spacing:.02em}
.ads-section .control-bar .filter-wrap select{font:700 13px Manrope;cursor:pointer;max-width:100%}
.ads-section .control-bar .export{margin-left:auto}
.ads-section .control-bar #adsSource{margin-left:10px}

/* Tabela: números alinhados pela vírgula e cabeçalho mais legível. */
.ads-panel th{font-size:9px;letter-spacing:.06em;padding-bottom:11px}
.ads-panel td{font-variant-numeric:tabular-nums}
.ads-panel tbody tr{transition:background .12s}
.ads-panel tbody tr:hover{background:#fafcfa}

/* Linhas de cliente: valor à direita alinhado, badge com menos peso. */
.client-row{padding:11px 0}
.client-row+.client-row{border-top:1px solid #f1f5f2}
.client-value{margin-left:auto;text-align:right}
.client-value b{font-variant-numeric:tabular-nums}

@media(max-width:760px){
  .ads-section .control-bar .filter-wrap{border-right:0;padding-right:0;margin-right:0;min-width:100%}
  .ads-section .control-bar .export,.ads-section .control-bar #adsSource{margin-left:0}
  .ads-panel-tools{margin-left:0;width:100%}
}

/* Modal de prévia de criativo. */
.preview-modal{position:fixed;inset:0;z-index:60;display:grid;place-items:center;background:rgba(7,22,20,.72);padding:24px}
.preview-modal[hidden]{display:none}
.preview-box{background:var(--paper);border-radius:18px;width:min(460px,100%);max-height:90vh;display:flex;flex-direction:column;padding:22px;box-shadow:0 26px 64px #04120e4d}
.preview-box header{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:14px}
.preview-box h2{font-size:16px;letter-spacing:-.4px;margin:0;overflow-wrap:anywhere}
.preview-box header button{border:0;background:#f0f4f1;color:#5c6f68;width:30px;height:30px;border-radius:9px;font-size:13px;cursor:pointer;flex-shrink:0}
.preview-box header button:hover{background:#e4ebe6;color:var(--ink)}
#previewFormatos{margin:0 0 14px;display:flex;flex-wrap:wrap;gap:2px}
#previewFormatos button{cursor:pointer}
/* O iframe da Meta traz altura própria; o quadro dá o limite e rola dentro. */
.preview-quadro{flex:1;min-height:340px;overflow:auto;border:1px solid var(--line);border-radius:12px;background:#fbfdfb;display:grid;place-items:center}
.preview-quadro iframe{width:100%;min-height:560px;border:0;display:block}
.preview-nota{color:#93a29c;font-size:10px;line-height:1.5;margin:12px 0 0;text-align:center}
@media(max-width:560px){.preview-box{padding:16px}.preview-quadro iframe{min-height:480px}}
/* Campanha ativa que nao entregou no periodo: presente, mas visivelmente sem
   numeros — some-la faria a conta parecer toda pausada. */
.ads-panel tr.sem-entrega{background:#fffdf4}
.ads-panel tr.sem-entrega td{color:#9aa6a1}
.ads-panel tr.sem-entrega td:first-child b{color:var(--ink)}
.ads-panel tr.sem-entrega td small{color:#bb7a1b}
.ads-panel tr.sem-entrega td:nth-child(3){color:#9aa6a1;font-weight:600}

/* ---------------------------------------------------------------------------
   Avisos: conta, verba e criativo.
--------------------------------------------------------------------------- */
.avisos-panel{margin-bottom:16px}
.status.erro{background:#fdecec;color:#a33c3c}

/* Verba por conta. O valor sozinho nao informa — os dias informam. */
.verba-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;margin:16px 0 6px}
.verba-card{border:1px solid var(--line);border-radius:12px;padding:13px 15px;background:#fbfdfb}
.verba-card small{display:block;color:var(--muted);font-size:10px;margin-bottom:5px}
.verba-card b{display:block;font-size:19px;letter-spacing:-.5px;font-variant-numeric:tabular-nums}
.verba-card span{display:block;color:#8a9a94;font-size:10px;margin-top:4px;line-height:1.45}
.verba-card .verba-fonte{color:#16855d;margin-top:6px}
/* Menos de tres dias de ritmo: o cartao passa a avisar sozinho. */
.verba-card.apertado{background:#fff6e3;border-color:#f2e0bb}
.verba-card.apertado b{color:#8a6318}
.verba-card.apertado span{color:#9c7527}

.avisos-lista{list-style:none;margin:10px 0 0;padding:0}
.avisos-lista li{display:flex;align-items:flex-start;gap:12px;padding:12px 0;border-top:1px solid #f1f5f2}
.avisos-lista li:first-child{border-top:0}
.avisos-lista b{display:block;font-size:12px;line-height:1.35}
.avisos-lista small{display:block;color:var(--muted);font-size:10.5px;line-height:1.5;margin-top:3px}
.avisos-lista .status{margin-left:auto;align-self:center;flex-shrink:0}
.aviso-marca{width:26px;height:26px;display:grid;place-items:center;border-radius:8px;font-size:12px;flex-shrink:0;background:#f0f4f1;color:#6b7d77}
.nivel-critico .aviso-marca{background:#fdecec;color:#a33c3c}
.nivel-aviso .aviso-marca{background:#fff2d9;color:#bb7a1b}
.nivel-info .aviso-marca{background:#e7f8ef;color:#189567}
@media(max-width:640px){.avisos-lista .status{display:none}}
/* De qual conta sao os avisos — sem isso o leitor atribui a conta que esta
   vendo um problema que e de outra. */
.escopo{text-transform:none;letter-spacing:0;color:#9aa6a1;font-weight:500}
.avisos-outras{margin:14px 0 0;padding-top:12px;border-top:1px solid #f1f5f2;color:#8a9a94;font-size:11px}
.avisos-outras a{color:var(--green);font-weight:700;text-decoration:none}
.avisos-outras a:hover{text-decoration:underline}

/* ---------------------------------------------------------------------------
   Avisos recolhidos. Seis linhas abertas empurram os números para baixo; o que
   precisa estar sempre visível é o SINAL, não a lista.
--------------------------------------------------------------------------- */
.avisos-panel{background:var(--paper);border:1px solid var(--line);border-radius:15px;box-shadow:0 8px 25px #12342107;margin-bottom:16px;overflow:hidden}
.avisos-panel[hidden]{display:none}
.avisos-resumo{display:flex;align-items:center;gap:12px;padding:14px 18px;cursor:pointer;list-style:none;user-select:none}
.avisos-resumo::-webkit-details-marker{display:none}
.avisos-resumo:hover{background:#fafcfa}
.avisos-sinal{width:26px;height:26px;display:grid;place-items:center;border-radius:50%;font:800 13px Manrope;flex-shrink:0;background:#e7f8ef;color:#189567}
.avisos-texto{display:flex;flex-direction:column;gap:2px;min-width:0}
.avisos-texto b{font-size:13px;letter-spacing:-.2px}
.avisos-texto small{color:var(--muted);font-size:10.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.avisos-abrir{margin-left:auto;display:flex;align-items:center;gap:5px;color:#7a8b85;font:700 10px Manrope;text-transform:uppercase;letter-spacing:.08em;flex-shrink:0}
.avisos-abrir i{font-style:normal;font-size:13px;transition:transform .18s}
.avisos-panel[open] .avisos-abrir i{transform:rotate(180deg)}
.avisos-panel[open] .avisos-resumo{border-bottom:1px solid var(--line)}

/* Com crítico o bloco chama atenção fechado — é a única coisa que precisa. */
.avisos-panel.tem-critico{border-color:#f6d2d2}
.avisos-panel.tem-critico .avisos-sinal{background:#fdecec;color:#a33c3c}
.avisos-panel.tem-critico .avisos-texto b{color:#a33c3c}

.avisos-corpo{padding:16px 18px 18px}
.avisos-ferramentas{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.avisos-ferramentas .segmented{margin-left:0}
.avisos-ferramentas .row-action{margin-left:auto}
.avisos-corpo .verba-grid{margin-top:14px}
.avisos-corpo .avisos-lista{margin-top:4px}
@media(max-width:560px){
  .avisos-abrir{font-size:0}
  .avisos-abrir i{font-size:14px}
  .avisos-ferramentas .row-action{margin-left:0}
}

/* Cliente: linha com vinculo de conta e acao de editar. */
.client-row{align-items:flex-start}
.client-info{min-width:0;flex:1}
.client-info small{display:block;color:var(--muted);font-size:10px;line-height:1.5}
.client-conta{color:#16855d !important}
.client-conta i{color:#9aa6a1;font-style:normal}
.client-row .row-action{margin-left:12px;align-self:center;flex-shrink:0}
.botao-perigo{background:#fdecec !important;color:#a33c3c !important;margin-top:8px}
.botao-perigo:hover{background:#f9dcdc !important}
.botao-texto{background:none !important;color:#7a8b85 !important;margin-top:4px;font-weight:600 !important}
.erro-texto{color:#a33c3c !important}
.novo-cliente form>button{width:100%}
