/* ---------- Tema ----------
   Escuro é o padrão. O claro vem por DOIS caminhos com as mesmas declarações:
   a preferência do sistema (quando o usuário não escolheu) e a escolha explícita no botão.
   Os dois blocos precisam ficar idênticos — há teste comparando, porque editar um e esquecer
   o outro daria um claro que só aparece para metade das pessoas.
   Por que media query em vez de resolver tudo no JS: o app.js é módulo (adiado) e a CSP proíbe
   script inline, então um tema decidido só no JS piscaria escuro antes de clarear.
   --tint/--tint-2 existem porque o escuro usa rgba(255,255,255,…) para borda e hover; no claro
   isso é invisível e precisa virar preto. --on-accent é o texto sobre os botões coloridos.
   --painel* e --grad-* vieram da segunda metade: eram fundos escuros cravados dentro de admin,
   triagem, matriz de manobra e perfil, que ficavam pretos num app claro.
   --blue/--cyan do claro são um tom mais escuros que a cor de marca: sobre branco o original
   dava 4,2 de contraste, abaixo do mínimo para texto pequeno. */
:root{
  --navy:#081321; --surface:#0E1E31; --surface-2:#152840;
  --ink:#E9F1FA; --muted:#7C93AC; --hairline:#213650;
  --blue:#3BA6F2; --cyan:#6FD0FF; --amber:#F2A63B; --red:#E0685E; --good:#3FBE77;
  --on-accent:#04121f;
  --red-ink:#f2a8a0; --amber-ink:#f2c879; --good-ink:#8ef0b6; --blue-ink:#9fd0f5;
  --tint:rgba(255,255,255,.07); --tint-2:rgba(255,255,255,.14);
  --shadow:rgba(0,0,0,.5); --shadow-forte:rgba(0,0,0,.75);
  --sidebar-grad:linear-gradient(180deg,#0B1A2E,#081018);
  --veu:rgba(4,10,18,.66);
  --flutuante:rgba(14,30,49,.92); --campo:#0b1a2e;
  --ink-soft:#B3C6DA; --roxo-ink:#C77DFF; --hairline-cyan:rgba(111,208,255,.22);
  --painel:rgba(10,26,44,.55); --painel-solido:#10253b; --painel-solido-2:#142d47; --surface-3:#12283f;
  --realce:brightness(1.15);
  --grad-pagina:linear-gradient(145deg,#091827,#0b1d30 55%,#081523);
  --grad-kpi:linear-gradient(155deg,#132b45,#0e2136);
  --grad-plano:linear-gradient(100deg,rgba(40,143,210,.13),rgba(9,25,41,.68));
  --grad-avatar:linear-gradient(155deg,#1d4468,#13304c);
  --grad-optica:linear-gradient(135deg,#123a5e,#0c2942);
  --grad-optica-forte:linear-gradient(135deg,#164a76,#0f3352);
  --auth-fundo:#06101b; --auth-brilho-1:rgba(26,94,143,.42); --auth-brilho-2:rgba(26,130,164,.18);
  --auth-shell:rgba(9,23,38,.82); --auth-card:rgba(14,30,49,.92);
  --auth-intro:linear-gradient(145deg,rgba(28,91,139,.34),rgba(8,25,42,.45));
  --font:"Segoe UI",system-ui,-apple-system,Arial,sans-serif;
  --mono:"Cascadia Code","Consolas",ui-monospace,monospace;
}
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    --navy:#F1F5FA; --surface:#FFFFFF; --surface-2:#E9EFF7;
    --ink:#14273B; --muted:#556B84; --hairline:#CBD8E8;
    --blue:#1A75BD; --cyan:#0C6FA6; --amber:#9A6207; --red:#C0392B; --good:#15803D;
    --on-accent:#FFFFFF;
    --red-ink:#A3261A; --amber-ink:#7C4A05; --good-ink:#12653A; --blue-ink:#0F5C8F;
    --tint:rgba(16,38,62,.05); --tint-2:rgba(16,38,62,.13);
    --shadow:rgba(16,38,62,.16); --shadow-forte:rgba(16,38,62,.26);
    --sidebar-grad:linear-gradient(180deg,#FFFFFF,#EEF3FA);
    --veu:rgba(20,39,59,.38);
    --flutuante:rgba(255,255,255,.94); --campo:#F3F7FC;
    --ink-soft:#34506E; --roxo-ink:#6B2FA8; --hairline-cyan:rgba(14,127,189,.28);
    --painel:rgba(16,38,62,.035); --painel-solido:#F6F9FC; --painel-solido-2:#E6EEF8; --surface-3:#F6FAFD;
    --realce:brightness(.96);
    --grad-pagina:linear-gradient(145deg,#F6F9FC,#EFF4FA 55%,#E8EFF7);
    --grad-kpi:linear-gradient(155deg,#FFFFFF,#F1F6FB);
    --grad-plano:linear-gradient(100deg,rgba(27,127,204,.12),rgba(255,255,255,.92));
    --grad-avatar:linear-gradient(155deg,#DCEBF8,#C6DCF2);
    --grad-optica:linear-gradient(135deg,#E4F1FC,#D3E6F7);
    --grad-optica-forte:linear-gradient(135deg,#1A75BD,#0C5F9E);
    --auth-fundo:#E8EFF7; --auth-brilho-1:rgba(27,127,204,.16); --auth-brilho-2:rgba(14,127,189,.10);
    --auth-shell:rgba(255,255,255,.92); --auth-card:#FFFFFF;
    --auth-intro:linear-gradient(145deg,rgba(27,127,204,.12),rgba(233,239,247,.9));
  }
}
:root[data-theme="light"]{
    --navy:#F1F5FA; --surface:#FFFFFF; --surface-2:#E9EFF7;
    --ink:#14273B; --muted:#556B84; --hairline:#CBD8E8;
    --blue:#1A75BD; --cyan:#0C6FA6; --amber:#9A6207; --red:#C0392B; --good:#15803D;
    --on-accent:#FFFFFF;
    --red-ink:#A3261A; --amber-ink:#7C4A05; --good-ink:#12653A; --blue-ink:#0F5C8F;
    --tint:rgba(16,38,62,.05); --tint-2:rgba(16,38,62,.13);
    --shadow:rgba(16,38,62,.16); --shadow-forte:rgba(16,38,62,.26);
    --sidebar-grad:linear-gradient(180deg,#FFFFFF,#EEF3FA);
    --veu:rgba(20,39,59,.38);
    --flutuante:rgba(255,255,255,.94); --campo:#F3F7FC;
    --ink-soft:#34506E; --roxo-ink:#6B2FA8; --hairline-cyan:rgba(14,127,189,.28);
    --painel:rgba(16,38,62,.035); --painel-solido:#F6F9FC; --painel-solido-2:#E6EEF8; --surface-3:#F6FAFD;
    --realce:brightness(.96);
    --grad-pagina:linear-gradient(145deg,#F6F9FC,#EFF4FA 55%,#E8EFF7);
    --grad-kpi:linear-gradient(155deg,#FFFFFF,#F1F6FB);
    --grad-plano:linear-gradient(100deg,rgba(27,127,204,.12),rgba(255,255,255,.92));
    --grad-avatar:linear-gradient(155deg,#DCEBF8,#C6DCF2);
    --grad-optica:linear-gradient(135deg,#E4F1FC,#D3E6F7);
    --grad-optica-forte:linear-gradient(135deg,#1A75BD,#0C5F9E);
    --auth-fundo:#E8EFF7; --auth-brilho-1:rgba(27,127,204,.16); --auth-brilho-2:rgba(14,127,189,.10);
    --auth-shell:rgba(255,255,255,.92); --auth-card:#FFFFFF;
    --auth-intro:linear-gradient(145deg,rgba(27,127,204,.12),rgba(233,239,247,.9));
}
*{box-sizing:border-box}
html,body{height:100%;margin:0}
body{font-family:var(--font);color:var(--ink);background:var(--navy);
  display:grid;grid-template-columns:280px 1fr;grid-template-rows:1fr;overflow:hidden}
/* Tela cheia do mapa: oculta a barra lateral e o mapa ocupa tudo */
body.map-full{grid-template-columns:1fr!important;grid-template-rows:1fr!important}
body.map-full #sidebar{display:none}
#mapFullBtn.on{background:var(--blue);border-color:var(--blue);color:var(--on-accent)}

/* Sidebar */
#sidebar{background:var(--sidebar-grad);border-right:1px solid var(--hairline);
  padding:18px 18px 14px;display:flex;flex-direction:column;gap:14px;overflow-y:auto}
.brand{display:flex;align-items:center;gap:11px}
/* O botão de tema vive na barra da marca, sempre visível com a lateral aberta. */
.theme-btn{margin-left:auto;flex:none;width:30px;height:30px;padding:0;line-height:1;
  display:inline-flex;align-items:center;justify-content:center;font-size:15px;
  background:transparent;border:1px solid var(--hairline);color:var(--muted);border-radius:8px}
.theme-btn:hover{border-color:var(--blue);color:var(--cyan)}
.brand-txt{font-weight:800;font-size:1.15rem;line-height:1}
.brand-txt span{color:var(--blue)}
.brand-txt small{display:block;font-size:.56rem;font-weight:600;letter-spacing:.14em;
  color:var(--muted);text-transform:uppercase;margin-top:4px}

.field{display:flex;flex-direction:column;gap:6px;font-size:.72rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted);font-weight:700}
select{font-family:var(--font);font-size:.92rem;color:var(--ink);background:var(--surface);
  border:1px solid var(--hairline);border-radius:8px;padding:9px 10px;text-transform:none;letter-spacing:0}

button{font-family:var(--font);cursor:pointer;border-radius:8px;border:1px solid transparent;
  font-size:.9rem;font-weight:600;padding:9px 12px;transition:.15s}
button:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}
.primary{background:var(--blue);color:var(--on-accent)}
.primary:hover{background:var(--cyan)}
.ghost{background:var(--surface);color:var(--ink);border-color:var(--hairline)}
.ghost:hover{border-color:var(--blue);color:var(--cyan)}
.ghost.on{background:var(--cyan);color:var(--on-accent);border-color:var(--cyan)}

.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;text-align:center}
.stats div{background:var(--surface);border:1px solid var(--hairline);border-radius:9px;padding:10px 4px}
.stats b{display:block;font-size:1.1rem;color:var(--cyan);font-variant-numeric:tabular-nums}
.stats span{font-size:.64rem;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}

.actions{display:flex;flex-direction:column;gap:8px}

/* Menu lateral agrupado. Eram 16 botões soltos, todos com o mesmo peso visual e centralizados:
   procurar um item exigia ler a lista inteira. Agora são itens de menu alinhados à esquerda,
   dentro de grupos que abrem e fecham. */
.sidenav{display:flex;flex-direction:column;gap:2px}
.sidegroup{border-radius:8px}
.sidegroup>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:8px;
  padding:8px 10px;border-radius:8px;color:var(--muted);font-size:.7rem;font-weight:700;
  text-transform:uppercase;letter-spacing:.07em;user-select:none}
.sidegroup>summary::-webkit-details-marker{display:none}
/* A seta é o único indicador de que o grupo abre; vive no ::after para não entrar na ordem
   de leitura de quem usa leitor de tela — o <details> já anuncia o estado. */
.sidegroup>summary::after{content:"▾";margin-left:auto;font-size:.8rem;transition:transform .15s}
.sidegroup[open]>summary::after{transform:rotate(-180deg)}
.sidegroup>summary:hover{background:var(--surface);color:var(--ink)}
.sidegroup>button{display:flex;align-items:center;gap:9px;width:100%;
  background:none;border:0;border-left:2px solid transparent;border-radius:0 7px 7px 0;
  padding:8px 10px 8px 14px;margin:0;cursor:pointer;
  font-family:var(--font);font-size:.84rem;font-weight:500;color:var(--ink);
  text-align:left;justify-content:flex-start;letter-spacing:0;text-transform:none}
.sidegroup>button:hover{background:var(--surface);border-left-color:var(--blue);color:var(--cyan)}
.sidegroup>button.on{background:rgba(59,166,242,.14);border-left-color:var(--cyan);color:var(--cyan)}
.sidegroup>button[hidden]{display:none}
/* Largura fixa no ícone: sem ela cada glifo tem uma largura e os rótulos saem desalinhados,
   que é justamente o que se quer evitar num menu alinhado à esquerda. */
.sg-ico{width:18px;flex:none;text-align:center;opacity:.75;font-size:.9rem}
.sidegroup>summary .sg-ico{opacity:.6}
/* Grupo cujos itens estão todos escondidos (por papel ou plano) não deve mostrar o título. */
.sidegroup[hidden]{display:none}
.hint{font-size:.8rem;color:var(--muted);margin:0;min-height:2.4em;
  background:var(--surface);border:1px dashed var(--hairline);border-radius:8px;padding:9px 11px}
.hint:empty{display:none} /* sem dica ativa (seleção/ferramentas simples) → não ocupa espaço */
.legend{display:flex;flex-wrap:wrap;gap:10px;font-size:.74rem;color:var(--muted)}
.legend span{display:flex;align-items:center;gap:5px}
.legend i{width:10px;height:10px;border-radius:50%;display:inline-block}
.save-state{font-family:var(--mono);font-size:.72rem;color:var(--muted);margin:auto 0 0}

/* Toolbar (floating over map) */
#toolbar{position:absolute;top:14px;left:calc(50% + 140px);transform:translateX(-50%);z-index:1000;
  display:flex;flex-wrap:wrap;justify-content:center;gap:2px;width:calc(100vw - 300px);max-width:1540px;
  background:var(--flutuante);backdrop-filter:blur(8px);
  border:1px solid var(--hairline);border-radius:12px;padding:5px;box-shadow:0 10px 30px -12px var(--shadow-forte)}
body.map-full #toolbar{left:50%;width:calc(100vw - 28px);max-width:1540px} /* sem sidebar: recentraliza e usa a tela toda */
.tool{background:transparent;color:var(--muted);border:none;white-space:nowrap;line-height:1;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;min-width:46px;padding:5px 7px}
.tool-lbl{font-size:.6rem;font-weight:600;letter-spacing:.01em}
.tool-ic{font-size:1.12rem;line-height:1}
.tool .equip-ic{width:20px;height:20px}
.tool:hover{color:var(--ink);background:var(--surface-2)}
.tool.active{background:var(--blue);color:var(--on-accent)}
.tool.ctrl{color:var(--ink);font-size:1.05rem;min-width:38px;padding:8px 7px} /* controles: só ícone */
.tool.ctrl:disabled{opacity:.35;cursor:not-allowed;background:transparent;color:var(--muted)}
.tool.ctrl.on{background:var(--cyan);color:var(--on-accent)}
.tool-sep{width:1px;align-self:stretch;background:var(--hairline);margin:4px 4px}

.shortcuts{font-size:.68rem;color:var(--muted);line-height:1.6;margin:0}
.shortcuts b{color:var(--ink-soft);font-family:var(--mono);font-weight:600}

/* Toasts */
.toast{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);z-index:3000;
  display:flex;flex-direction:column;gap:8px;align-items:center;pointer-events:none}
.toast-item{background:var(--surface);color:var(--ink);border:1px solid var(--hairline);
  border-left:3px solid var(--blue);border-radius:9px;padding:9px 16px;font-size:.86rem;font-weight:600;
  box-shadow:0 12px 30px -12px var(--shadow-forte);opacity:0;transform:translateY(8px);transition:.25s}
.toast-item.show{opacity:1;transform:translateY(0)}

/* Map */
#map{height:100%;width:100%;background:var(--navy)}
.leaflet-container{background:var(--navy);font-family:var(--font)}
/* O rótulo flutua sobre o mapa e precisa de fundo PRÓPRIO. O texto quase branco foi feito
   para aparecer direto sobre a imagem, mas a caixa branca padrão do Leaflet nunca foi
   removida — e sobre ela o texto sumia. Fundo escuro translúcido funciona nos dois modos,
   ruas e satélite, sem depender da cor do que está embaixo. */
.leaflet-tooltip.node-label{font-size:11px;font-weight:700;color:#eaf3ff;
  background:rgba(8,16,24,.85);border:1px solid rgba(111,208,255,.35);border-radius:7px;
  padding:3px 8px;box-shadow:0 2px 8px rgba(0,0,0,.5);text-shadow:none;white-space:nowrap}
/* A setinha do Leaflet é branca e fica órfã do novo fundo. */
.leaflet-tooltip.node-label::before{display:none}

/* markers */
.lg-marker{border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 2px rgba(0,0,0,.4)}
.lg-dot{border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 2px rgba(0,0,0,.45);box-sizing:border-box;cursor:pointer}
.lg-dot.sel{box-shadow:0 0 0 3px #6FD0FF,0 0 0 5px rgba(0,0,0,.35)}
.leaflet-marker-draggable .lg-dot{cursor:grab}
/* Poste: um ponto, não um badge. O contorno branco e a sombra garantem contraste tanto no
   mapa claro quanto no satélite; sem eles o ponto some sobre asfalto. */
.lg-poste{border-radius:50%;border:1.5px solid #fff;box-sizing:border-box;cursor:pointer;
  box-shadow:0 0 0 1px rgba(0,0,0,.5)}
.lg-poste.sel{border-color:#6FD0FF;box-shadow:0 0 0 3px #6FD0FF,0 0 0 5px rgba(0,0,0,.35)}
.leaflet-marker-draggable .lg-poste{cursor:grab}
.lg-vertex{width:12px;height:12px;border-radius:3px;background:#6FD0FF;border:2px solid #04121f;box-sizing:border-box;cursor:grab;box-shadow:0 0 0 2px rgba(0,0,0,.35)}
/* Vértice do meio: losango (emenda — arraste até uma caixa para dividir o cabo) */
.lg-vertex:not(.lg-vertex-end){transform:rotate(45deg);background:#F2A63B;border-radius:2px}
/* Pontas do cabo: maiores e circulares (arraste até uma caixa para conectar) */
.lg-vertex-end{width:18px;height:18px;border-radius:50%;background:#3FBE77;border:3px solid #04121f;box-shadow:0 0 0 3px rgba(63,190,119,.45),0 0 8px rgba(63,190,119,.6)}
/* Alça "+" no meio do segmento: arraste/clique para criar um ponto de conexão sobre o cabo */
.lg-addconn{width:15px;height:15px;border-radius:50%;background:rgba(94,234,212,.30);border:1.5px dashed #5EEAD4;color:var(--on-accent);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;line-height:1;cursor:grab;box-shadow:0 0 0 2px rgba(11,26,46,.45)}
.lg-addconn:hover{background:rgba(94,234,212,.85);border-style:solid}
/* Marcador com ícone de equipamento (CTO/CEO/POP) */
.lg-badge{display:flex;align-items:center;justify-content:center;box-sizing:border-box;cursor:pointer;filter:drop-shadow(0 1px 3px rgba(0,0,0,.55))}
.lg-badge.sel{filter:drop-shadow(0 0 3px #6FD0FF) drop-shadow(0 1px 3px rgba(0,0,0,.5))}
.leaflet-marker-draggable .lg-badge{cursor:grab}
/* Ícones de equipamento no menu/legenda */
.equip-ic{display:inline-block;vertical-align:middle}
.tool .equip-ic{margin-right:3px}
.legend .equip-ic{margin-right:5px}
/* Campo de cor no inspetor */
.insp-color>span{display:flex;align-items:center;gap:8px;margin-top:4px}
.insp-color input[type=color]{width:46px;height:28px;padding:0;border:1px solid var(--tint-2);border-radius:6px;background:transparent;cursor:pointer}
.ghost.small{padding:4px 9px;font-size:12px}
/* Modal de importação SGP */
.sgp-body{padding:16px 18px;display:flex;flex-direction:column;gap:12px}
.sgp-status{padding:10px 12px;border-radius:8px;background:var(--tint);font-size:13px;line-height:1.5}
.sgp-status.ok{background:rgba(63,190,119,.14);color:var(--good-ink)}
.sgp-status.warn{background:rgba(242,166,59,.14);color:var(--amber-ink)}
.sgp-status.err{background:rgba(224,104,94,.14);color:var(--red-ink)}
.sgp-status code,.sgp-hint code,.sgp-result code{background:var(--tint);padding:1px 5px;border-radius:4px;font-size:12px}
.sgp-actions{display:flex;gap:10px}
.sgp-result{padding:10px 12px;border-radius:8px;font-size:13px}
.sgp-result.ok{background:rgba(63,190,119,.14);color:var(--good-ink)}
.sgp-result.err{background:rgba(224,104,94,.14);color:var(--red-ink)}
.sgp-sample{max-height:320px;overflow:auto;background:var(--navy);border:1px solid var(--tint);border-radius:8px;padding:10px;font-size:11px;line-height:1.45;white-space:pre-wrap;word-break:break-word}
.sgp-hint{font-size:12px;color:var(--muted)}
.sgp-form{border:1px solid var(--tint-2);border-radius:10px;padding:12px 14px 14px;display:flex;flex-direction:column;gap:10px;margin:0}
.sgp-form legend{padding:0 6px;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.sgp-form label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}
.sgp-form input[type=text],.sgp-form input[type=password],.sgp-form input:not([type]){width:100%;padding:8px 10px;border-radius:7px;border:1px solid var(--tint-2);background:var(--campo);color:var(--ink);font-size:13px}
.sgp-form input:disabled,.sgp-form select:disabled,.sgp-form textarea:disabled{opacity:.55;cursor:not-allowed}
.sgp-form select,.sgp-form textarea{width:100%;padding:8px 10px;border-radius:7px;border:1px solid var(--tint-2);background:var(--campo);color:var(--ink);font-size:13px}
#sgpApiFields[hidden],.sgp-form label[hidden]{display:none}
.sgp-adv{font-size:12px}
.sgp-adv summary{cursor:pointer;color:var(--muted);margin-bottom:8px}
.sgp-adv label{margin-top:8px}
.sgp-check{flex-direction:row!important;align-items:center;gap:8px!important;color:var(--muted)!important}
.sgp-check input{width:auto!important}
.team-integrations{border-top:1px solid var(--tint-2);margin:6px 22px 18px;padding-top:14px}
.team-integrations h3{margin:0 0 10px;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.team-integrations .sgp-hint{margin-top:8px}
.team-role,.team-status{min-width:118px;padding:6px;border-radius:7px;border:1px solid var(--tint-2);background:var(--campo);color:var(--ink)}
.team-inactive{opacity:.62}.team-actions{display:flex;gap:6px;justify-content:flex-end;flex-wrap:wrap}
.audit-section{border:1px solid var(--tint-2);border-radius:12px;margin:4px 22px 20px;background:var(--painel);overflow:hidden}
.audit-section>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;cursor:pointer;list-style:none;color:var(--ink)}
.audit-section>summary::-webkit-details-marker{display:none}.audit-section>summary::after{content:'⌄';color:var(--cyan);font-size:18px;transition:transform .18s ease}.audit-section[open]>summary::after{transform:rotate(180deg)}
.audit-section>summary span:first-child{display:flex;flex-direction:column;gap:3px}.audit-section>summary small{color:var(--muted);font-size:12px;font-weight:400}.audit-summary-hint{margin-left:auto;color:var(--cyan);font-size:12px;font-weight:700}
.audit-body{border-top:1px solid var(--tint-2);padding:14px 16px 16px}.audit-head{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px}.audit-head p{margin:0;color:var(--muted);font-size:12px}.audit-head>div:last-child{display:flex;gap:8px}.audit-head select{padding:7px;border-radius:7px;background:var(--campo);color:var(--ink);border:1px solid var(--tint-2)}
.audit-meta{font-size:11px;color:var(--muted);max-width:300px;overflow-wrap:anywhere}.audit-ok{color:var(--good-ink)}.audit-bad{color:var(--red-ink)}.audit-denied{color:var(--amber-ink)}
/* Busca de cliente por CPF no inspetor */
.sgp-lookup{display:flex;flex-direction:column;gap:6px;padding:8px 10px;border:1px dashed var(--hairline-cyan);border-radius:8px;background:rgba(111,208,255,.06)}
.sgp-lookup .ghost.small{align-self:flex-start}
.sgp-lookup-msg{font-size:12px;color:var(--muted);min-height:14px}
.sgp-lookup-msg.ok{color:var(--good-ink)}
.sgp-lookup-msg.warn{color:var(--amber-ink)}
.sgp-lookup-msg.err{color:var(--red-ink)}
/* Badges de conexão do cliente no inspetor */
.insp-badges{display:flex;flex-wrap:wrap;gap:6px;margin:2px 0 2px}
.ibadge{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;padding:3px 8px;border-radius:999px;background:var(--tint);color:var(--muted);border:1px solid var(--tint-2);white-space:nowrap}
.ibadge.ok{background:rgba(63,190,119,.16);color:var(--good-ink);border-color:rgba(63,190,119,.32)}
.ibadge.warn{background:rgba(242,166,59,.16);color:var(--amber-ink);border-color:rgba(242,166,59,.32)}
.ibadge.bad{background:rgba(224,104,94,.16);color:var(--red-ink);border-color:rgba(224,104,94,.32)}
.ibadge.muted{opacity:.7;font-weight:500}
/* Menu de contexto (botão direito) */
.ctx-menu{position:fixed;z-index:4000;min-width:190px;background:var(--surface);border:1px solid var(--tint-2);border-radius:10px;padding:5px;box-shadow:0 10px 30px var(--shadow);display:flex;flex-direction:column;gap:2px}
.ctx-menu[hidden]{display:none}
.ctx-item{display:block;width:100%;text-align:left;padding:8px 12px;border:0;background:transparent;color:var(--ink);font-size:13px;border-radius:7px;cursor:pointer}
.ctx-item:hover{background:rgba(111,208,255,.16)}
.ctx-item.danger{color:var(--red-ink)}
.ctx-item.danger:hover{background:rgba(224,104,94,.18)}
.ctx-sep{height:1px;background:var(--tint-2);margin:3px 4px}
/* Dashboard */
.dash-body{display:flex;flex-direction:column;min-height:0;flex:1;overflow:hidden}
.modal-card:has(.dash-body){display:flex;flex-direction:column}
.dash-projects{display:flex;gap:8px;flex-wrap:wrap;padding:12px 20px;border-bottom:1px solid var(--tint);overflow-x:auto}
.dash-proj{white-space:nowrap;padding:8px 14px;border-radius:9px;border:1px solid var(--tint-2);background:var(--tint);color:var(--muted);font-size:13px;cursor:pointer}
.dash-proj:hover{background:rgba(111,208,255,.14)}
.dash-proj.active{background:var(--blue);border-color:var(--blue);color:var(--on-accent);font-weight:700}
.dash-content{padding:16px 20px 24px;overflow-y:auto;flex:1}
.dash-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:10px;margin-bottom:14px}
.dash-kpi{background:linear-gradient(160deg,var(--surface-3),var(--surface));border:1px solid var(--tint);border-radius:12px;padding:14px 16px;display:flex;flex-direction:column;gap:2px}
.dash-kpi b{font-size:24px;color:var(--ink);line-height:1.1}
.dash-kpi span{font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
.dash-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:14px}
.dash-card{background:var(--surface);border:1px solid var(--tint);border-radius:14px;padding:14px 16px;min-width:0}
.dash-card.dash-wide{grid-column:1/-1}
.dash-card h3{margin:0 0 10px;font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em}
.dash-donut{display:block;margin:0 auto}
.dash-cli{display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:center}
.dash-legend{display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--muted)}
.dash-legend i{display:inline-block;width:10px;height:10px;border-radius:3px;margin-right:7px;vertical-align:middle}
.dash-tbl{width:100%;border-collapse:collapse;font-size:13px}
.dash-tbl th{text-align:left;color:var(--muted);font-weight:600;font-size:11px;text-transform:uppercase;padding:4px 6px;border-bottom:1px solid var(--tint-2)}
.dash-tbl td{padding:6px;border-bottom:1px solid var(--tint);color:var(--ink)}
.dash-tbl tr:last-child td{border-bottom:0}
.dash-alerts{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.dash-alerts li{padding:9px 12px;border-radius:9px;font-size:13px;color:var(--ink);background:var(--tint);border-left:3px solid var(--muted)}
.dash-alerts li b{font-size:15px;margin-right:6px}
.dash-alerts li.al-warn{background:rgba(242,166,59,.12);border-left-color:var(--amber);color:var(--amber-ink)}
.dash-alerts li.al-bad{background:rgba(224,104,94,.12);border-left-color:var(--red);color:var(--red-ink)}
.dash-empty{color:var(--muted);text-align:center;padding:24px;font-size:13px}

/* O hover mantém #fff cravado: --on-accent é escuro no tema escuro, e no claro o gradiente de
   hover é azul forte. Branco é o único texto que serve nos dois. */
.optical{background:var(--grad-optica);color:var(--cyan);
  border:1px solid var(--blue)}
.optical:hover{background:var(--grad-optica-forte);color:#fff}

/* Caixa de usuário */
.userbox{display:flex;align-items:center;gap:10px;background:var(--surface);
  border:1px solid var(--hairline);border-radius:10px;padding:9px 11px}
.userbox[hidden]{display:none}
.avatar{width:34px;height:34px;border-radius:50%;flex:0 0 auto;display:grid;place-items:center;
  font-weight:800;color:var(--on-accent);background:linear-gradient(135deg,var(--blue),var(--cyan))}
.userinfo{flex:1;min-width:0;line-height:1.25}
.userinfo b{display:block;font-size:.9rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.userinfo span{font-size:.72rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:block}
.userlogout{background:transparent;border:1px solid var(--hairline);color:var(--muted);
  border-radius:8px;padding:6px 9px;cursor:pointer;font-size:1rem}
.userlogout:hover{border-color:var(--red);color:var(--red)}

/* Tela de autenticação */
.auth{position:fixed;inset:0;z-index:5000;background:
  radial-gradient(900px 560px at 8% 10%,var(--auth-brilho-1),transparent 68%),
  radial-gradient(760px 520px at 95% 100%,var(--auth-brilho-2),transparent 70%),var(--auth-fundo);
  display:flex;align-items:center;justify-content:center;padding:32px;overflow:auto}
.auth[hidden]{display:none}
.auth-shell{width:min(980px,100%);display:grid;grid-template-columns:minmax(300px,.9fr) minmax(430px,1.1fr);
  overflow:hidden;border:1px solid var(--tint-2);border-radius:22px;background:var(--auth-shell);
  box-shadow:0 35px 100px -28px var(--shadow-forte);backdrop-filter:blur(14px)}
.auth-intro{position:relative;display:flex;flex-direction:column;justify-content:center;padding:48px;
  background:var(--auth-intro);overflow:hidden}
.auth-intro::after{content:"";position:absolute;width:270px;height:270px;border:1px solid var(--hairline-cyan);
  border-radius:50%;right:-105px;bottom:-105px;box-shadow:0 0 0 44px rgba(111,208,255,.035),0 0 0 88px rgba(111,208,255,.02)}
.auth-intro-badge{align-self:flex-start;padding:6px 10px;border:1px solid var(--hairline-cyan);border-radius:999px;
  color:var(--cyan);font-size:.68rem;font-weight:800;letter-spacing:.11em;text-transform:uppercase}
.auth-intro h1{margin:22px 0 14px;font-size:clamp(1.8rem,3vw,2.55rem);line-height:1.08;color:var(--ink);letter-spacing:-.035em}
.auth-intro>p{margin:0;color:var(--muted);line-height:1.6;font-size:.95rem}
.auth-intro ul{list-style:none;padding:0;margin:30px 0 0;display:grid;gap:13px;color:var(--muted);font-size:.82rem}
.auth-intro li{display:flex;align-items:center;gap:10px}.auth-intro li span{display:grid;place-items:center;width:20px;height:20px;
  border-radius:50%;background:rgba(111,208,255,.12);color:var(--cyan);font-size:.72rem;font-weight:900}
.auth-card{width:100%;background:var(--auth-card);padding:36px 40px}
.auth-brand{display:flex;align-items:center;gap:12px;margin-bottom:28px;font-weight:800;font-size:1.25rem}
.auth-brand span{color:var(--blue)}
.auth-brand small{display:block;font-size:.58rem;font-weight:600;letter-spacing:.13em;
  color:var(--muted);text-transform:uppercase;margin-top:4px}
.auth-heading{margin-bottom:20px}.auth-heading h2{margin:0 0 6px;font-size:1.35rem;color:var(--ink)}
.auth-heading p{margin:0;color:var(--muted);font-size:.85rem}
.auth-tabs{display:flex;gap:4px;background:var(--surface-2);border-radius:9px;padding:4px;margin-bottom:18px}
.auth-tab{flex:1;background:transparent;border:none;color:var(--muted);font-weight:700;
  padding:8px;border-radius:6px;cursor:pointer;font-size:.9rem}
.auth-tab.active{background:var(--blue);color:var(--on-accent)}
.auth-form{display:flex;flex-direction:column;gap:13px}
.auth-form[hidden]{display:none}
.auth-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:13px}.auth-wide{grid-column:1/-1}
.auth-form label{display:flex;flex-direction:column;gap:5px;font-size:.72rem;letter-spacing:.04em;
  text-transform:uppercase;color:var(--muted);font-weight:700}
.auth-form input,.auth-form select{font-family:var(--font);font-size:.95rem;color:var(--ink);background:var(--surface-2);
  border:1px solid var(--hairline);border-radius:9px;padding:11px 12px;text-transform:none;letter-spacing:0}
.auth-form input:focus,.auth-form select:focus{outline:2px solid var(--cyan);border-color:transparent}
.auth-form .primary{margin-top:6px;padding:12px}
.auth-link{align-self:center;background:none;border:0;color:var(--cyan);font:600 .82rem var(--font);cursor:pointer;padding:3px}
.auth-link:hover{text-decoration:underline}
.auth-link:disabled{cursor:wait;opacity:.7;text-decoration:none}
.auth-privacy{margin:0;color:var(--muted);font-size:.72rem;line-height:1.5;text-align:center}
.auth-msg{margin:14px 0 0;font-size:.85rem;color:var(--red);min-height:1.2em;text-align:center}
.auth-msg.ok{color:var(--good)}
.auth-security{margin:12px -40px -36px;padding:13px 18px;border-top:1px solid var(--hairline);text-align:center;
  color:var(--muted);font-size:.68rem;background:var(--tint);border-radius:0 0 22px 0}
@media(max-width:800px){.auth{padding:16px}.auth-shell{display:block;max-width:520px}.auth-intro{display:none}.auth-card{padding:28px 24px}
  .auth-security{margin:12px -24px -28px;border-radius:0 0 22px 22px}}
@media(max-width:480px){.auth-form-grid{grid-template-columns:1fr}.auth-wide{grid-column:auto}.auth-heading h2{font-size:1.2rem}}

.team-remove{background:transparent;border:1px solid var(--hairline);color:var(--muted);
  border-radius:7px;padding:4px 9px;cursor:pointer;font-size:.78rem}
.team-remove:hover{border-color:var(--red);color:var(--red)}

/* Administração */
.admin-menu-btn{border-color:var(--hairline-cyan)!important;background:rgba(111,208,255,.07)!important;color:var(--cyan)!important}
/* Menu do administrador: barra fixa no topo da área de conteúdo (a lateral ocupa 280px).
   Fica acima das telas administrativas (z-index > .workspace-page) e, quando ativa, empurra
   essas telas 52px para baixo para não cobrir os cabeçalhos. */
.admin-nav{position:fixed;top:0;left:280px;right:0;height:52px;z-index:1600;display:flex;align-items:center;gap:16px;
  padding:0 18px;background:var(--surface);border-bottom:1px solid var(--hairline)}
.admin-nav[hidden]{display:none}
body.admin-shell .workspace-page{top:52px}
.admin-nav-brand{font-weight:800;font-size:.9rem;color:var(--ink);white-space:nowrap;flex:0 0 auto}
.admin-nav-list{display:flex;align-items:center;gap:4px;list-style:none;margin:0;padding:0;flex:1 1 auto;min-width:0}
.admin-nav-group{position:relative}
.admin-nav-link{background:transparent;border:1px solid transparent;border-radius:8px;color:var(--ink);
  font-family:var(--font);font-size:.85rem;font-weight:600;padding:7px 12px;cursor:pointer;white-space:nowrap}
.admin-nav-link:hover{background:var(--surface-2);border-color:var(--hairline)}
.admin-nav-group>.admin-nav-link::after{content:' ▾';color:var(--muted);font-size:.75rem}
.admin-nav-group>.admin-nav-link[aria-expanded="true"]{background:var(--surface-2);border-color:var(--hairline)}
.admin-nav-link.active{background:rgba(59,166,242,.16);border-color:rgba(59,166,242,.45);color:var(--blue)}
/* Admin não projeta: a lateral de projeto deixa de existir e o topo ocupa a largura toda.
   A coluna de 280px do grid também some, senão o mapa ficaria deslocado por trás. */
body.admin-shell{grid-template-columns:1fr}
body.admin-shell #sidebar{display:none}
body.admin-shell .admin-nav{left:0}
body.admin-shell .workspace-page{left:0}
/* A caixa do usuário é MOVIDA para cá (não duplicada), então herda .userbox e precisa encolher */
.admin-nav #userBox{margin-left:auto;flex:0 0 auto;max-width:280px;padding:4px 6px 4px 8px;gap:8px;background:transparent;border-color:transparent}
.admin-nav #userBox .avatar{width:28px;height:28px;font-size:.82rem}
.admin-nav #userBox .userinfo{flex:0 1 auto;max-width:170px}
.admin-nav #userBox .userinfo b{font-size:.82rem}
.admin-nav #userBox .userinfo span{font-size:.68rem}
/* No topo a caixa do usuário É o botão do menu da conta; o ícone de sair migra para dentro
   dele, então fica escondido aqui (mas permanece no DOM, com seu listener, para o mapa). */
.admin-nav #userBox{cursor:pointer}
.admin-nav #userBox .userlogout{display:none}
.admin-nav #userBox::after{content:"▾";color:var(--muted);font-size:.75rem;margin-left:2px}
.admin-user-menu{position:absolute;top:calc(100% + 6px);right:18px;z-index:7;min-width:200px;
  display:flex;flex-direction:column;gap:2px;padding:6px;
  background:var(--surface);border:1px solid var(--hairline);border-radius:10px;box-shadow:0 18px 40px -14px var(--shadow-forte)}
.admin-user-menu[hidden]{display:none}
.admin-user-menu button{width:100%;text-align:left;background:transparent;border:none;border-radius:7px;color:var(--ink);
  font-family:var(--font);font-size:.84rem;font-weight:500;padding:9px 10px;cursor:pointer;white-space:nowrap}
.admin-user-menu button:hover{background:var(--surface-2)}
.admin-user-menu .admin-user-exit{color:var(--red)}
.admin-user-menu .admin-user-exit:hover{background:var(--red);color:#fff}
/* Submenu: ancorado ao grupo, some por [hidden] — nada de display:flex sobrepondo o atributo */
.admin-nav-menu{position:absolute;top:calc(100% + 6px);left:0;min-width:230px;z-index:5;
  list-style:none;margin:0;padding:6px;display:flex;flex-direction:column;gap:2px;
  background:var(--surface);border:1px solid var(--hairline);border-radius:10px;box-shadow:0 18px 40px -14px var(--shadow-forte)}
.admin-nav-menu[hidden]{display:none}
.admin-nav-menu button{width:100%;text-align:left;background:transparent;border:none;border-radius:7px;color:var(--ink);
  font-family:var(--font);font-size:.84rem;font-weight:500;padding:8px 10px;cursor:pointer;white-space:nowrap}
.admin-nav-menu button:hover{background:var(--surface-2)}
@media(max-width:720px){.admin-nav{left:0;gap:8px;padding:0 10px}.admin-nav-brand{display:none}}
.workspace-page{position:fixed;inset:0 0 0 280px;z-index:1500;background:var(--grad-pagina);overflow:auto}
.workspace-page-card{width:100%;min-height:100%;display:flex;flex-direction:column}
.workspace-page-head{position:sticky;top:0;z-index:2;display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding:20px 24px;
  border-bottom:1px solid var(--hairline);background:var(--flutuante);backdrop-filter:blur(10px)}
.workspace-page-head h2{margin:0;font-size:1.25rem}.workspace-page-head p{margin:5px 0 0;color:var(--muted);font-size:.82rem}
.admin-page-card{max-width:1460px;margin:0 auto}
.plans-page-card{max-width:1200px;margin:0 auto}
.admin-subpage-card{max-width:1360px;margin:0 auto}.integrations-page-card{max-width:1080px;margin:0 auto}
.workspace-section-body{display:grid;gap:16px;padding:24px 28px 42px}
body.workspace-open #toolbar,body.workspace-open #layersPanel,body.workspace-open #toolOptions,body.workspace-open #inspector{visibility:hidden}
.admin-eyebrow,.admin-section-label{display:block;margin-bottom:5px;color:var(--cyan);font-size:.61rem;font-weight:800;letter-spacing:.1em;text-transform:uppercase}
.admin-head-actions{display:flex;align-items:flex-end;gap:8px}.admin-head-actions label{display:grid;gap:3px;color:var(--muted);font-size:.62rem;
  text-transform:uppercase;font-weight:700}.admin-head-actions select{font:inherit;color:var(--ink);background:var(--surface-2);border:1px solid var(--hairline);border-radius:7px;padding:7px 9px}
.admin-loading{min-height:calc(100vh - 96px);display:grid;place-content:center;justify-items:center;gap:18px;text-align:center;color:var(--muted)}
.admin-loading[hidden]{display:none}.admin-loading-spinner{width:42px;height:42px;border:3px solid var(--tint-2);border-top-color:var(--cyan);border-radius:50%;animation:session-spin .8s linear infinite}
.admin-loading div{display:grid;gap:5px}.admin-loading b{color:var(--ink);font-size:1rem}.admin-loading span:not(.admin-loading-spinner){font-size:.76rem}
.admin-loading.is-error .admin-loading-spinner{animation:none;border-color:rgba(255,107,107,.28);position:relative}
.admin-loading.is-error .admin-loading-spinner::after{content:"!";position:absolute;inset:0;display:grid;place-items:center;color:var(--red);font-weight:900}
.admin-loading.is-error b{color:var(--red-ink)}.admin-loading.is-error span{max-width:420px}
.admin-body{padding:24px 28px 42px;display:grid;gap:16px}.admin-block-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:14px}
.admin-block-head h3{margin:0;color:var(--ink);font-size:1rem}.admin-block-head p{margin:5px 0 0;color:var(--muted);font-size:.73rem}
.admin-overview,.admin-management-panel,.admin-section{border:1px solid var(--hairline);border-radius:15px;padding:18px;background:var(--tint)}
.admin-kpis{display:grid;grid-template-columns:repeat(5,minmax(130px,1fr));gap:10px}
.admin-kpi{position:relative;overflow:hidden;border:1px solid var(--hairline-cyan);border-radius:12px;padding:16px;background:var(--grad-kpi)}
.admin-kpi::before{content:"";position:absolute;inset:0 auto 0 0;width:3px;background:var(--blue)}
.admin-kpi b{display:block;color:var(--ink);font-size:1.55rem;line-height:1.1}.admin-kpi span{display:block;color:var(--muted);font-size:.65rem;
  text-transform:uppercase;letter-spacing:.05em;margin-top:7px}.admin-kpi small{display:block;color:var(--muted);font-size:.65rem;margin-top:5px}
.admin-plan-panel{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 18px;border-radius:14px;
  border:1px solid var(--hairline-cyan);background:var(--grad-plano)}
.admin-plan-panel h3{margin:0 0 5px;font-size:1rem;color:var(--ink)}.admin-plan-panel p{margin:0;color:var(--muted);font-size:.74rem}
.admin-plan-caption{color:var(--cyan);font-size:.66rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase}
.admin-quick-actions{display:grid;grid-template-columns:repeat(4,minmax(145px,1fr));gap:10px}
.admin-action-card{display:flex;align-items:center;gap:11px;min-height:68px;padding:12px;text-align:left;color:var(--ink);background:var(--painel-solido);border:1px solid var(--hairline);border-radius:11px;cursor:pointer}
.admin-action-card:hover{border-color:var(--blue);background:var(--painel-solido-2)}.admin-action-card:disabled{opacity:.5;cursor:not-allowed}
.admin-action-card>span:last-child{display:grid;gap:3px}.admin-action-card b{font-size:.76rem}.admin-action-card small{color:var(--muted);font-size:.63rem;font-weight:500}
.admin-action-icon{display:grid;place-items:center;width:30px;height:30px;flex:none;border-radius:9px;color:var(--cyan);background:rgba(111,208,255,.1);font-size:.9rem}
.admin-section table{font-size:.74rem}.admin-section .tablewrap{max-height:300px}.admin-login-section{padding-bottom:12px}
/* Gráficos do painel de negócio: barras horizontais rotuladas. Horizontais de propósito —
   nome de plano e "2026-10" não cabem sob barra vertical sem girar o texto. */
.admin-charts{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px;margin-top:12px}
.admin-chart-card{border:1px solid var(--hairline);border-radius:12px;padding:14px;background:var(--painel)}
.admin-chart-title{font-size:.72rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.admin-bars{display:flex;flex-direction:column;gap:8px}
.admin-bar{display:grid;grid-template-columns:92px 1fr auto;align-items:center;gap:9px;font-size:.78rem}
.admin-bar-label{color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.admin-bar-track{height:10px;border-radius:6px;background:rgba(148,163,176,.16);overflow:hidden}
.admin-bar-fill{height:100%;border-radius:6px;background:linear-gradient(90deg,var(--blue),var(--cyan));min-width:2px}
.admin-bar-value{color:var(--ink);font-weight:700;font-variant-numeric:tabular-nums}
.admin-bars-empty{color:var(--muted);font-size:.8rem;padding:6px 0}
.admin-login-chart{height:90px;display:flex;align-items:end;gap:3px;padding:8px 5px 0;margin-bottom:12px;border-bottom:1px solid var(--hairline)}
.admin-day{flex:1;min-width:3px;max-width:22px;display:flex;align-items:end;gap:1px;height:100%;position:relative}
.admin-day span{flex:1;min-height:2px;border-radius:3px 3px 0 0;background:var(--blue)}.admin-day span.fail{background:var(--red)}
.admin-day:hover::after{content:attr(data-tip);position:absolute;z-index:2;left:50%;bottom:100%;transform:translateX(-50%);white-space:nowrap;
  padding:5px 7px;border-radius:6px;background:var(--navy);border:1px solid var(--hairline);color:var(--ink);font-size:.65rem}
.admin-chart-legend{display:flex;gap:13px;color:var(--muted);font-size:.65rem}.admin-chart-legend span{display:flex;align-items:center;gap:5px}.admin-chart-legend i{width:8px;height:8px;border-radius:2px;background:var(--blue)}.admin-chart-legend i.fail{background:var(--red)}
.admin-lower-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}.admin-msg{min-height:1.2em;margin:0;color:var(--red);font-size:.8rem}.admin-status-ok{color:var(--good);font-weight:700}.admin-status-bad{color:var(--red);font-weight:700}
.admin-detail-card{border:1px solid var(--hairline);border-radius:15px;padding:20px;background:var(--tint)}
.admin-detail-card>p{margin:0;color:var(--muted)}.admin-detail-actions{display:flex;justify-content:flex-end}
.admin-detail-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.admin-detail-grid>div{display:grid;gap:6px;padding:16px;border:1px solid var(--hairline-cyan);border-radius:12px;background:var(--painel-solido)}
.admin-detail-grid span{color:var(--muted);font-size:.65rem;text-transform:uppercase;letter-spacing:.05em}.admin-detail-grid b{color:var(--ink);font-size:.92rem}.admin-detail-grid small{color:var(--muted);font-size:.67rem}
.reports-table-wrap{max-height:none;overflow:visible}.integrations-page-card .sgp-body{padding:24px 28px 42px}
@media(prefers-reduced-motion:reduce){.admin-loading-spinner{animation:none}}
@media(max-width:1180px){.admin-quick-actions{grid-template-columns:repeat(2,1fr)}.admin-lower-grid{grid-template-columns:1fr}.admin-detail-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.admin-kpis{grid-template-columns:repeat(2,1fr)}.admin-plan-panel{align-items:flex-start;flex-direction:column}.admin-quick-actions{grid-template-columns:repeat(2,1fr)}}
@media(max-width:620px){.admin-head-actions label,.admin-head-actions #adminRefresh{display:none}.admin-kpis,.admin-quick-actions,.admin-detail-grid{grid-template-columns:1fr}.admin-body,.workspace-section-body,.integrations-page-card .sgp-body{padding:14px}.workspace-page-head{padding:14px}.admin-overview,.admin-management-panel,.admin-section{padding:14px}.admin-chart-legend{display:none}}

/* Planos e limites */
.plans-toolbar{display:flex;align-items:flex-end;gap:10px;padding:18px 22px 8px}
.plans-toolbar label{display:grid;gap:5px;color:var(--muted);font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.plans-toolbar input,.plan-price{font:inherit;color:var(--ink);background:var(--surface-2);border:1px solid var(--hairline);border-radius:8px;padding:9px 11px}
.plans-toolbar input{width:130px}.plans-usage{margin:10px 22px 2px;padding:14px 16px;border:1px solid var(--hairline-cyan);
  border-radius:11px;background:rgba(111,208,255,.055);color:var(--ink);font-size:.84rem;display:flex;gap:24px;flex-wrap:wrap}
.plans-usage b{color:var(--cyan)}
.billing-status{margin:10px 22px 0;padding:13px 15px;border:1px solid var(--hairline);border-radius:10px;background:var(--tint)}
.billing-status h3{margin:0 0 5px;font-size:.82rem;color:var(--ink)}.billing-status p{margin:0;color:var(--muted);font-size:.72rem;line-height:1.5}
.billing-status .billing-ok{color:var(--good)}.billing-status .billing-warn{color:var(--amber-ink)}
.billing-payment-summary{display:flex;align-items:center;justify-content:space-between;gap:20px}
.billing-payment-summary>div{min-width:0}.billing-payment-summary>button{flex-shrink:0;white-space:nowrap}
.billing-status>p+.billing-payment-summary{margin-top:16px}
@media(max-width:760px){.billing-payment-summary{align-items:stretch;flex-direction:column;gap:14px}.billing-payment-summary>button{width:100%}}
.billing-title{display:flex;align-items:center;justify-content:space-between;gap:12px}.billing-title h3{margin:0}.billing-title button{padding:6px 10px;font-size:.68rem}
.billing-history{margin-top:10px;max-height:150px;overflow:auto}.billing-history table{width:100%;border-collapse:collapse;font-size:.68rem}.billing-history th,.billing-history td{padding:6px;border-top:1px solid var(--hairline);text-align:left}
.plans-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;padding:18px 22px}
.plan-card{position:relative;border:1px solid var(--hairline);border-radius:14px;padding:18px;background:var(--surface-2);cursor:pointer}
.plan-card:has(input[type=radio]:checked){border-color:var(--cyan);box-shadow:0 0 0 2px rgba(111,208,255,.12)}
.plan-card:has(input[type=radio]:disabled),.plan-card:has(input[type=radio]:disabled) .plan-choice{cursor:default}
.plan-card:has(input[type=radio]:disabled:not(:checked)){opacity:.65}
.plan-card.active-plan::after{content:"Plano atual";position:absolute;right:12px;top:12px;padding:4px 7px;border-radius:999px;
  color:var(--on-accent);background:var(--cyan);font-size:.6rem;font-weight:900;text-transform:uppercase;letter-spacing:.04em}
.plan-card h3{margin:0 0 13px;color:var(--ink);font-size:1rem}.plan-card ul{list-style:none;padding:0;margin:0 0 18px;display:grid;gap:8px;
  color:var(--muted);font-size:.78rem}.plan-card li::before{content:"✓";color:var(--good);font-weight:900;margin-right:7px}
.plan-card label{display:grid;gap:5px;color:var(--muted);font-size:.68rem;font-weight:700;text-transform:uppercase}
.plan-card .plan-choice{display:flex;align-items:center;gap:7px;margin-top:15px;color:var(--ink);text-transform:none;font-size:.78rem}
.plan-price{width:100%;box-sizing:border-box}.plans-actions{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:2px 22px 20px}
.plans-actions>p{margin:0;color:var(--muted);font-size:.72rem;max-width:430px}.plans-actions>div{display:flex;gap:9px}
.plans-msg{min-height:1.2em;margin:-8px 22px 20px;color:var(--red);font-size:.8rem}.plans-msg.ok{color:var(--good)}
@media(max-width:760px){.plans-grid{grid-template-columns:1fr}.plans-actions{align-items:stretch;flex-direction:column}.plans-actions>div{display:grid}}
@media(max-width:720px){.workspace-page{inset:0}.workspace-page-card{max-width:none}}

/* Botão de mapa base */
.basemap-btn{background:var(--flutuante);color:var(--ink);border:1px solid var(--hairline);
  border-radius:9px;padding:8px 12px;font-size:.82rem;font-weight:600;cursor:pointer;font-family:var(--font);
  box-shadow:0 6px 18px -8px var(--shadow);margin-top:84px!important}
.basemap-btn:hover{border-color:var(--blue);color:var(--cyan)}
/* Controles do mapa (zoom, bússola, enquadrar/GPS) no tema do app */
.leaflet-bar{border:1px solid var(--hairline)!important;border-radius:10px!important;box-shadow:0 6px 18px -8px var(--shadow)!important;overflow:hidden}
.leaflet-bar a{background:var(--flutuante)!important;color:var(--ink)!important;border-bottom:1px solid var(--tint)!important}
.leaflet-bar a:last-child{border-bottom:none!important}
.leaflet-bar a:hover{background:rgba(59,166,242,.22)!important;color:var(--ink)!important}
.leaflet-bar a.leaflet-disabled{background:var(--surface-2)!important;color:var(--muted)!important}
.leaflet-control-rotate-arrow{filter:brightness(0) invert(1);opacity:.92}
/* Legenda de cores dos cabos por bitola */
.cable-legend{background:var(--flutuante);border:1px solid var(--hairline);border-radius:9px;padding:8px 11px;font-size:11px;color:var(--muted);box-shadow:0 6px 18px -8px var(--shadow);line-height:1.7;margin:0 8px 8px 0}
.cable-legend .cl-title{font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-size:10px;margin-bottom:4px}
.cable-legend .cl-row{display:flex;align-items:center;gap:8px;white-space:nowrap}
.cable-legend .cl-line{display:inline-block;width:24px;border-radius:2px;flex:none}
/* Popup "conectar cabo à caixa?" */
.connect-prompt{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);z-index:3500;background:var(--surface);border:1px solid var(--blue);border-radius:12px;padding:14px 16px;box-shadow:0 14px 40px var(--shadow);max-width:min(460px,92vw)}
.connect-prompt .cp-msg{font-size:13px;color:var(--ink);line-height:1.5;margin-bottom:12px}
.connect-prompt .cp-actions{display:flex;gap:10px;justify-content:flex-end}
.connect-prompt .cp-actions button{padding:8px 16px;border-radius:8px;font-size:13px;cursor:pointer}
/* Prompt de texto no estilo do app */
#promptModal,#confirmModal,#fusionLinkModal{z-index:5000}
.prompt-body select{width:100%;padding:10px 12px;border-radius:9px;border:1px solid var(--tint-2);background:var(--campo);color:var(--ink);font-size:14px;font-family:var(--font)}
.confirm-msg{font-size:14px;color:var(--ink);line-height:1.55;margin:0}
.prompt-card{width:min(440px,94vw);padding:0;overflow:hidden}
.prompt-head{display:flex;align-items:center;gap:10px;padding:16px 20px;border-bottom:1px solid var(--tint);background:linear-gradient(160deg,var(--surface-3),var(--surface))}
.prompt-head h2{margin:0;font-size:16px;color:var(--ink);font-weight:800}
.prompt-body{padding:18px 20px 20px;display:flex;flex-direction:column;gap:8px}
.prompt-body label{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.03em}
.prompt-body input{width:100%;padding:11px 13px;border-radius:9px;border:1px solid var(--tint-2);background:var(--campo);color:var(--ink);font-size:14px;font-family:var(--font)}
.prompt-body input:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(59,166,242,.2)}
.prompt-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:12px}
.prompt-actions button{padding:9px 18px;border-radius:9px;font-size:13px;font-weight:600;cursor:pointer}
.prompt-actions .danger{background:var(--red);color:#fff;border:0}
.prompt-actions .danger:hover{filter:brightness(1.08)}
.measure-tip{background:var(--surface);color:var(--cyan);border:1px solid var(--blue);border-radius:6px;
  padding:2px 7px;font-size:.78rem;font-weight:700;white-space:nowrap;box-shadow:0 2px 8px -3px var(--shadow)}

/* Traço OTDR */
.otdr-chart{padding:16px 22px 22px;overflow-x:auto}
.otdr-chart svg{display:block;max-width:100%}
.otdr-summary{display:flex;flex-wrap:wrap;gap:10px;padding:0 22px 8px}
.otdr-btn{background:transparent;border:1px solid var(--hairline);color:var(--cyan);border-radius:6px;
  padding:2px 8px;cursor:pointer;font-size:.74rem;font-weight:700}
.otdr-btn:hover{border-color:var(--cyan);background:rgba(111,208,255,.12)}

/* Diagrama de fusão */
/* Cabeçalho do diagrama numa linha só: título + dados da caixa + ações.
   nowrap garante a linha única; quem cede espaço é o título, que trunca. */
.fusion-head{flex-wrap:nowrap;align-items:center;gap:9px;padding:12px 18px;overflow-x:auto}
/* o título é o único que cede: encolhe e trunca para os controles nunca serem cortados */
.fusion-head .fusion-title{min-width:0;flex:0 1 auto;overflow:hidden}
.fusion-head .fusion-title h2{font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fusion-head .fusion-title p{margin:2px 0 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* Em janela estreita o subtítulo sai: o nome da caixa já aparece no campo Nome ao lado. */
@media (max-width:1180px){ .fusion-head .fusion-title p{display:none} }
@media (max-width:1040px){ .fusion-head .fusion-title{display:none} }
.fusion-head .fh-field{display:flex;align-items:center;gap:5px;font-size:.6rem;letter-spacing:.05em;
  text-transform:uppercase;color:var(--muted);font-weight:700;white-space:nowrap;flex:0 0 auto}
.fusion-head .fh-field input,.fusion-head .fh-field select{font-family:var(--font);font-size:.82rem;color:var(--ink);
  background:var(--surface-2);border:1px solid var(--hairline);border-radius:7px;padding:5px 8px;text-transform:none;letter-spacing:0}
.fusion-head .fh-field input{width:118px}
.fusion-head .ghost{padding:6px 10px;font-size:.82rem;white-space:nowrap;flex:0 0 auto}
.fusion-head .fusion-zoom{flex:0 0 auto}
.fbb-spacer{flex:1 1 auto;min-width:4px}
.fusion-head .fb-danger{color:var(--red);border-color:rgba(224,104,94,.4)}
.fusion-head .fb-danger:hover{background:var(--red);color:#fff}

/* VFL aceso: o traço sobrevive ao fechar o diagrama, então o mapa precisa dizer por que há
   cabo vermelho nele — e dar onde desligar sem reabrir a caixa de origem.
   Flutua SOBRE as telhas, como o rótulo dos nós: fundo escuro e texto claro cravados, porque
   as telhas são as mesmas nos dois temas. Com --ink o texto escureceria e sumiria aqui. */
.vfl-chip{position:absolute;left:50%;transform:translateX(-50%);bottom:26px;z-index:650;
  display:flex;align-items:center;gap:9px;padding:7px 9px 7px 13px;border-radius:999px;
  background:rgba(8,16,24,.92);border:1px solid rgba(255,45,45,.55);color:#eaf3ff;
  font-size:.82rem;box-shadow:0 10px 30px var(--shadow);max-width:min(560px,92vw)}
.vfl-chip[hidden]{display:none}
.vfl-chip .vfl-dot{flex:none;width:9px;height:9px;border-radius:50%;background:#ff2d2d;
  box-shadow:0 0 0 0 rgba(255,45,45,.7);animation:vflPulso 1.6s ease-out infinite}
.vfl-chip span:not(.vfl-dot){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vfl-chip button{flex:none;background:rgba(255,45,45,.18);border:1px solid rgba(255,45,45,.5);
  color:#f2a8a0;border-radius:999px;padding:4px 11px;font-family:var(--font);font-size:.78rem;cursor:pointer}
.vfl-chip button:hover{background:rgba(255,45,45,.3)}
@keyframes vflPulso{to{box-shadow:0 0 0 9px rgba(255,45,45,0)}}
@media (prefers-reduced-motion:reduce){.vfl-chip .vfl-dot{animation:none}}

/* Ferramentas flutuantes: ficam sobre o canvas em vez de roubar altura dele.
   O painel abre AO LADO do botão, não por cima dele: empilhado, ele cobria o canto inferior
   esquerdo do desenho — justo onde ficam os cabos da coluna da esquerda. */
.fusion-toolbox{position:absolute;left:18px;bottom:18px;z-index:6;
  display:flex;flex-direction:row;align-items:flex-end;gap:10px;
  max-width:calc(100% - 36px)}
/* flex:none — o botão é a âncora da barra e não pode encolher para o painel caber */
.fusion-fab{flex:none;display:inline-flex;align-items:center;gap:7px;background:var(--blue);color:var(--on-accent);border:none;
  border-radius:999px;padding:10px 17px;font-family:var(--font);font-size:.86rem;font-weight:700;
  cursor:pointer;box-shadow:0 10px 26px -8px var(--shadow-forte)}
.fusion-fab:hover{filter:brightness(1.1)}
.fusion-toolbox .fusion-tools{display:none}
.fusion-toolbox.open .fusion-tools{display:flex;padding:10px;min-width:0;max-height:46vh;overflow:auto;
  background:var(--surface);border:1px solid var(--hairline);border-radius:12px;box-shadow:0 18px 44px -14px var(--shadow-forte)}
.fusion-tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:12px 22px 4px}
.fusion-tools select{font-family:var(--font);font-size:.85rem;color:var(--ink);background:var(--surface-2);
  border:1px solid var(--hairline);border-radius:8px;padding:7px 9px}
.fusion-tools .ghost{padding:7px 11px;font-size:.85rem}
/* Lista de "+ Splitter" e "+ DIO": ancorada no botão por JS (left/bottom em px), abre para cima.
   Fica dentro de .fusion-toolbox para continuar visível em tela cheia e para o clique nela
   não contar como "clique fora" do painel. */
.tool-menu{position:absolute;z-index:8;min-width:230px;overflow:auto;padding:6px;
  background:var(--surface);border:1px solid var(--hairline);border-radius:11px;
  box-shadow:0 18px 44px -12px var(--shadow-forte)}
.tool-menu[hidden]{display:none}
.tool-menu-grupo{padding:7px 10px 4px;font-size:.7rem;font-weight:700;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted)}
.tool-menu button+.tool-menu-grupo{border-top:1px solid var(--hairline);margin-top:4px}
.tool-menu button{display:flex;width:100%;align-items:baseline;justify-content:space-between;gap:14px;
  padding:7px 10px;background:transparent;border:0;border-radius:7px;cursor:pointer;
  font-family:var(--font);font-size:.85rem;color:var(--ink);text-align:left}
.tool-menu button:hover{background:var(--surface-2)}
.tool-menu button:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.tool-menu .tool-menu-nota{flex:none;font-size:.74rem;color:var(--muted);font-variant-numeric:tabular-nums}
/* A última escolhida fica marcada: adicionar vários iguais em sequência é o caso comum. */
.tool-menu button[data-ultimo] .tool-menu-nome::after{content:' ·  última';font-size:.7rem;color:var(--blue)}
.fusion-notes{display:flex;flex-wrap:wrap;gap:6px;padding:6px 22px 0}
.fusion-notes .note-chip{display:inline-flex;align-items:center;gap:6px;background:var(--surface-2);
  border:1px solid var(--hairline);border-left:3px solid var(--amber);border-radius:7px;padding:4px 6px 4px 10px;font-size:.8rem;color:var(--ink)}
.fusion-notes .note-chip button{background:transparent;border:none;color:var(--muted);cursor:pointer;font-size:.95rem;padding:0 2px}
.fusion-notes .note-chip button:hover{color:var(--red)}
#fusionSvgWrap .splitterport{cursor:grab}
#fusionSvgWrap .splitterport:hover{stroke:#0369A1;stroke-width:3}
/* Lixeira de projetos */
.trash-left{color:var(--muted);font-size:.78rem;margin-left:8px}
#trashList .popeq-item{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
#trashList .popeq-item button{margin-left:auto}
#trashList .popeq-item button+button{margin-left:6px}

/* overflow:hidden porque o zoom deixou de esticar o canvas: o SVG tem sempre o tamanho da
   área visível e o conteúdo se move dentro dele. Barra de rolagem aqui só apareceria por
   arredondamento de 1px, e atrapalharia o arraste. */
.fusion-canvas{padding:12px 22px 22px;overflow:hidden;max-height:58vh}
.fusion-zoom{display:inline-flex;align-items:center;gap:2px;border:1px solid var(--hairline);border-radius:9px;padding:2px}
.fusion-zoom button{padding:5px 8px;min-width:30px;font-weight:700}
.fusion-zoom #fusionZoomReset{min-width:52px;font-size:.8rem;font-weight:600}
/* diagrama de fusão em tela quase cheia: canvas ocupa a altura; elementos em tamanho natural */
/* position:relative ancora as ferramentas flutuantes; sem isso elas se prenderiam à viewport
   e não acompanhariam o popup (nem o modo tela cheia). */
.fusion-card-modal{display:flex;flex-direction:column;overflow:hidden;position:relative}
.fusion-card-modal .fusion-canvas{flex:1;min-height:0;max-height:none}
/* Tela cheia: o card ocupa a tela toda e o canvas cresce junto */
.fusion-card-modal:fullscreen{width:100vw!important;height:100vh!important;max-width:none!important;border-radius:0;background:var(--panel,var(--surface))}
.fusion-card-modal:fullscreen .fusion-canvas{max-height:none}
#fusionSvgWrap svg{display:block;border-radius:10px;border:1px solid var(--hairline);max-width:none}
#fusionSvgWrap .cable-label{cursor:grab}
#fusionSvgWrap .fusion-rot{cursor:grab}
#fusionSvgWrap .fusion-rot:hover{fill:#E0F2FE;stroke:#0369A1}
#fusionSvgWrap .splicebead{cursor:pointer}
#fusionSvgWrap .splicebead:hover{stroke:#E0685E;stroke-width:2}
#fusionSvgWrap .splice-fiber{cursor:pointer}
#fusionSvgWrap .splice-fiber:hover{stroke:#E0685E!important;stroke-width:2.4}
/* Modo emenda: a luva segue o cursor e o alvo é a fibra, não o arraste */
#fusionSvgWrap.splice-mode{cursor:crosshair}
#fusionSvgWrap.splice-mode .fiberdot{cursor:crosshair}
/* A barra do tubo seleciona as 12 fibras de uma vez para o Auto-fusão */
/* A barra do tubo É o feixe: arrastá-la até outro cabo emenda todas as fibras dele de uma vez.
   Por isso ela volta a ser agarrável, com cursor de agarrar em vez de cursor de clique. */
#fusionSvgWrap .tubebar{cursor:grab}
#fusionSvgWrap .tubebar:hover{stroke:#0369A1;stroke-width:2}
#fusionSvgWrap .tubebar.on{cursor:grabbing;stroke:#0369A1;stroke-width:2.4}
#fusionSvgWrap .fiberdot{cursor:grab}
#fusionSvgWrap .fiberdot:hover{stroke:#0369A1;stroke-width:3}
#fusionSvgWrap .notrm{cursor:pointer}
.note-hint{color:var(--muted);font-size:.8rem}
#fusionSvgWrap .dioport{cursor:grab}
#fusionSvgWrap .dioport:hover{stroke:#0369A1;stroke-width:3}
#fusionSvgWrap .fusionline{cursor:pointer}
#fusionSvgWrap .fusionline:hover{stroke-width:5}
/* Manobra: a marca da FRENTE da porta e o cordão que sai dela. O alvo do cordão é a faixa
   transparente larga por baixo do traço; o realce no hover é dela, porque um cordão de 2.4px
   não se acerta com o mouse. */
#fusionSvgWrap .patchport{cursor:grab}
#fusionSvgWrap .patchport:hover{stroke:#0369A1;stroke-width:3}
#fusionSvgWrap .patchcord:hover{stroke:#0369A1;stroke-opacity:.25}
/* Fibra iluminada: o tracejado CORRE, e é o movimento que diz "tem luz da OLT". O tracejado
   fixo da fusão automática continua querendo dizer outra coisa, então os dois convivem.
   O passo do dash e o deslocamento por volta têm de ser iguais (5+5=10), senão a emenda entre
   voltas aparece como um tranco. */
#fusionSvgWrap .litflow{animation:lumina-luz .55s linear infinite}
@keyframes lumina-luz{to{stroke-dashoffset:-10}}
/* Quem pediu menos movimento no sistema continua vendo QUEM está aceso, só sem a corrida. */
@media (prefers-reduced-motion:reduce){#fusionSvgWrap .litflow{animation:none}}
#fusionSvgWrap .fusion-card{cursor:grab}
#fusionSvgWrap .fusion-card:hover{filter:brightness(1.15)}
#fusionSvgWrap .fusion-card:active{cursor:grabbing}
.fusion-empty{color:var(--muted);text-align:center;padding:40px;font-size:.95rem}

/* Máscaras e validações: o erro aparece sob o campo, onde o olho já está. */
.campo-erro{display:block;min-height:0;color:var(--red);font-size:.76rem;line-height:1.35;margin-top:3px}
.campo-erro:empty{display:none}
input.campo-invalido,select.campo-invalido{border-color:var(--red);box-shadow:0 0 0 2px rgba(224,104,94,.18)}
/* Olho da senha: o botão fica dentro do campo, então o wrapper é que posiciona. */
.senha-wrap{position:relative;display:block}
.senha-wrap>input{width:100%;padding-right:38px}
.senha-olho{position:absolute;right:4px;top:50%;transform:translateY(-50%);background:none;border:0;
  cursor:pointer;font-size:1rem;line-height:1;padding:5px 7px;border-radius:6px;opacity:.55}
.senha-olho:hover{opacity:.95;background:rgba(148,163,184,.18)}
.senha-olho.on{opacity:1}

/* Triagem do KMZ */
.triage-tabs{display:flex;gap:6px;flex-wrap:wrap;padding:14px 22px 0}
.triage-tabs button{background:var(--painel);border:1px solid var(--hairline);border-radius:9px;
  padding:7px 12px;cursor:pointer;color:var(--muted);font-size:.8rem;display:flex;align-items:center;gap:7px}
.triage-tabs button.on{border-color:var(--blue);color:var(--ink);background:rgba(59,166,242,.14)}
.triage-tabs button span{font-size:.7rem;color:var(--muted);font-variant-numeric:tabular-nums}
.triage-tabs button.on span{color:var(--blue-ink)}
.triage-bar{display:flex;gap:10px;align-items:flex-end;flex-wrap:wrap;padding:12px 22px}
.triage-bar label{display:flex;flex-direction:column;gap:4px;font-size:.76rem;color:var(--muted)}
.triage-bar input,.triage-bar select{padding:7px 9px;border-radius:8px}
.triage-bar #triageSearch{min-width:210px}
.triage-list{max-height:44vh;overflow:auto;padding:0 22px}
.triage-check{width:34px;text-align:center}
#triageTable td{vertical-align:top}
#triageTable select{padding:4px 6px;border-radius:7px;font-size:.78rem;max-width:200px}
/* A linha fica marcada quando está selecionada mas sem modelo: é o que tranca a importação. */
#triageTable tr.triage-falta{background:rgba(242,166,59,.1)}
#triageTable tr.triage-falta select{border-color:var(--amber)}
.triage-chute{font-size:.66rem;font-weight:700;padding:1px 6px;border-radius:20px;
  background:rgba(199,125,255,.18);color:var(--roxo-ink);vertical-align:middle}
.triage-foot{display:flex;align-items:center;gap:14px;padding:14px 22px 18px;flex-wrap:wrap}
.triage-foot #triageImport{margin-left:auto}
.triage-pager{display:flex;align-items:center;gap:8px;font-size:.78rem;color:var(--muted)}
.triage-pager button{background:var(--painel);border:1px solid var(--hairline);border-radius:7px;
  width:28px;height:28px;cursor:pointer;color:var(--ink)}
.triage-pager button:disabled{opacity:.4;cursor:default}

/* Novo projeto: onde o mapa começa */
.np-form{padding:18px 22px;display:flex;flex-direction:column;gap:12px}
.np-form label{display:flex;flex-direction:column;gap:5px;font-size:.84rem;color:var(--muted)}
.np-form input{padding:8px 10px;border-radius:8px}
.np-busca{display:flex;gap:10px;align-items:flex-end}
.np-busca label{flex:1}
.np-results{list-style:none;margin:0;padding:0;max-height:150px;overflow:auto;
  border:1px solid var(--hairline);border-radius:9px;background:var(--painel)}
.np-results button{display:block;width:100%;text-align:left;background:none;border:0;cursor:pointer;
  padding:8px 11px;color:var(--ink);font-size:.82rem;line-height:1.35}
.np-results button:hover{background:rgba(111,208,255,.12)}
.np-results small{display:block;color:var(--muted);font-size:.7rem}
.np-status{margin:0;font-size:.78rem;min-height:1em;color:var(--muted)}
.np-status:empty{min-height:0}
.np-status.ok{color:var(--good)}
.np-status.warn{color:var(--amber)}
/* O mini mapa precisa de altura explícita: o Leaflet mede o contêiner, e num flex sem altura
   ele nasceria com 0px e nenhuma tile apareceria. */
.np-map{height:260px;border-radius:10px;overflow:hidden;border:1px solid var(--hairline)}
.np-actions{display:flex;gap:10px}

/* Balão do pino de falha: é onde o técnico pega a coordenada, então precisa ser legível e
   clicável no celular, não um rótulo decorativo. */
.leaflet-popup.fault-popup .leaflet-popup-content-wrapper{background:var(--campo);color:var(--ink);
  border:1px solid rgba(180,35,24,.5);border-radius:11px;box-shadow:0 8px 24px var(--shadow)}
.leaflet-popup.fault-popup .leaflet-popup-tip{background:var(--campo);border:1px solid rgba(180,35,24,.5)}
.leaflet-popup.fault-popup .leaflet-popup-content{margin:12px 14px;font-size:.84rem}
.leaflet-popup.fault-popup a.leaflet-popup-close-button{color:var(--muted)}
.fault-pop h4{margin:0 0 6px;font-size:.92rem;color:var(--ink)}
.fault-pop-coord{margin:0;font-variant-numeric:tabular-nums;color:var(--blue-ink);font-weight:700}
.fault-pop-rua{margin:2px 0 9px;color:var(--muted);font-size:.8rem}
.fault-pop dl{display:grid;grid-template-columns:auto 1fr;gap:3px 10px;margin:0 0 11px;font-size:.8rem}
.fault-pop dt{color:var(--muted)}
.fault-pop dd{margin:0}
/* Alvo de toque de 34px: isso é usado em pé no poste, com uma mão. */
.fault-pop-acoes{display:flex;flex-wrap:wrap;gap:6px}
.fault-pop-acoes button{background:rgba(59,166,242,.16);border:1px solid rgba(59,166,242,.45);
  color:var(--blue-ink);border-radius:8px;padding:8px 11px;min-height:34px;cursor:pointer;
  font-family:var(--font);font-size:.78rem;font-weight:600}
.fault-pop-acoes button:hover{background:rgba(59,166,242,.3);color:var(--ink)}

/* Localizar falha (OTDR) */
.fault-form{padding:18px 22px;display:flex;flex-direction:column;gap:12px}
.fault-form label{display:flex;flex-direction:column;gap:5px;font-size:.84rem;color:var(--muted)}
.fault-form input,.fault-form select{padding:8px 10px;border-radius:8px}
.fault-row{display:flex;gap:12px}
.fault-row label{flex:1}
.fault-actions{display:flex;gap:10px;margin-top:4px}
.fault-result{padding:0 22px 20px;max-height:46vh;overflow:auto}
.fault-card{border:1px solid rgba(148,163,184,.35);border-radius:10px;padding:14px 16px;margin-bottom:12px}
.fault-card h4{margin:0 0 6px;font-size:.95rem}
.fault-coords{margin:0 0 10px;font-size:.84rem;color:var(--muted);font-variant-numeric:tabular-nums}
.fault-card dl{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:0 0 10px;font-size:.86rem}
.fault-card dt{color:var(--muted)}
.fault-card dd{margin:0}
.fault-warn{background:rgba(242,166,59,.14);border:1px solid rgba(242,166,59,.45);border-radius:10px;
  padding:11px 14px;margin:0 0 12px;font-size:.87rem;line-height:1.45}
/* O pino é vermelho e sempre por cima: é o ponto que o técnico foi procurar no mapa. */
.fault-pin{width:26px;height:26px;border-radius:50%;background:#B42318;color:#fff;font-weight:800;
  display:flex;align-items:center;justify-content:center;font-size:.8rem;
  box-shadow:0 0 0 3px rgba(180,35,24,.3),0 2px 6px var(--shadow)}
.insp-fusion{background:rgba(59,166,242,.14);color:var(--blue);border:1px solid rgba(59,166,242,.4);
  border-radius:8px;padding:8px 12px;font-weight:600;cursor:pointer;font-family:var(--font);font-size:.86rem;width:100%}
.insp-fusion:hover{background:var(--blue);color:var(--on-accent)}
.insp-photos{background:rgba(148,163,176,.14);color:var(--ink);border:1px solid var(--hairline);
  border-radius:8px;padding:8px 12px;font-weight:600;cursor:pointer;font-family:var(--font);font-size:.86rem;width:100%}
.insp-photos:hover{background:var(--surface-2);border-color:var(--muted)}

/* Inspetor de elemento (edição/exclusão) */
.inspector{position:absolute;right:14px;bottom:14px;z-index:1200;width:284px;
  background:var(--surface);border:1px solid var(--hairline);border-radius:12px;
  box-shadow:0 16px 40px -16px var(--shadow-forte);overflow:hidden}
.inspector[hidden]{display:none}
.insp-head{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:12px 14px;border-bottom:1px solid var(--hairline)}
.insp-kind{display:flex;align-items:center;gap:8px;font-size:.72rem;font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.insp-kind i{width:11px;height:11px;border-radius:50%;border:2px solid var(--surface)}
.insp-close{background:transparent;border:none;color:var(--muted);font-size:1.1rem;cursor:pointer;padding:2px 6px;line-height:1}
.insp-close:hover{color:var(--ink)}
.insp-body{padding:12px 14px;display:flex;flex-direction:column;gap:11px}
.insp-body label{display:flex;flex-direction:column;gap:5px;font-size:.66rem;letter-spacing:.05em;
  text-transform:uppercase;color:var(--muted);font-weight:700}
.insp-body input,.insp-body select{font-family:var(--font);font-size:.9rem;color:var(--ink);
  background:var(--surface-2);border:1px solid var(--hairline);border-radius:8px;padding:8px 10px;text-transform:none;letter-spacing:0}
.insp-meta{font-size:.76rem;color:var(--muted);font-family:var(--mono);line-height:1.5}
.insp-meta b{color:var(--ink)}
.insp-actions{display:flex;gap:8px;margin-top:2px}
.insp-actions .danger{flex:1;background:rgba(224,104,94,.14);color:var(--red);border:1px solid rgba(224,104,94,.4)}
.insp-actions .danger:hover{background:var(--red);color:#fff}

/* Modal orçamento óptico */
.modal{position:absolute;inset:0;z-index:2000;background:var(--veu);
  display:flex;align-items:center;justify-content:center;padding:24px}
.modal[hidden]{display:none}
.modal-card{background:var(--surface);border:1px solid var(--hairline);border-radius:14px;
  width:min(900px,96vw);max-height:88vh;overflow:auto;box-shadow:0 24px 60px -20px var(--shadow-forte)}
.modal-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;
  padding:20px 22px;border-bottom:1px solid var(--hairline);position:sticky;top:0;background:var(--surface)}
.modal-head h2{margin:0;font-size:1.2rem}
.modal-head p{margin:4px 0 0;color:var(--muted);font-size:.85rem}

/* Fotos por elemento */
.photo-body{padding:18px 22px 22px}
.photo-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;margin-bottom:16px}
.photo-empty{color:var(--muted);text-align:center;padding:32px 12px;font-size:.9rem;grid-column:1/-1}
.photo-item{margin:0;display:flex;flex-direction:column;gap:6px;position:relative}
.photo-item img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px;border:1px solid var(--hairline);
  background:var(--surface-2);display:block;cursor:zoom-in}
.photo-cap{font-family:var(--font);font-size:.8rem;color:var(--ink);background:var(--surface-2);
  border:1px solid var(--hairline);border-radius:7px;padding:6px 8px}
.photo-del{position:absolute;top:6px;right:6px;background:rgba(4,10,18,.72);border:1px solid var(--hairline);
  color:#fff;border-radius:7px;width:28px;height:28px;cursor:pointer;font-size:.85rem;line-height:1;opacity:0;transition:opacity .12s}
.photo-item:hover .photo-del{opacity:1}
.photo-del:hover{background:var(--red);border-color:var(--red)}
.photo-add{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;
  border:1.5px dashed var(--hairline);border-radius:10px;padding:18px;cursor:pointer;color:var(--muted);
  font-weight:600;font-size:.9rem;transition:border-color .12s,color .12s}
.photo-add:hover{border-color:var(--blue);color:var(--blue)}
.photo-add small{font-weight:400;font-size:.72rem;opacity:.8}
.photo-add.busy{opacity:.55;pointer-events:none}
.photo-add.busy span::after{content:' — enviando…'}

.optics-form{display:flex;flex-wrap:wrap;gap:12px;align-items:end;padding:18px 22px;border-bottom:1px solid var(--hairline)}
.optics-form label{display:flex;flex-direction:column;gap:5px;font-size:.68rem;letter-spacing:.05em;
  text-transform:uppercase;color:var(--muted);font-weight:700}
.optics-form input,.optics-form select{font-family:var(--font);font-size:.9rem;color:var(--ink);
  background:var(--surface-2);border:1px solid var(--hairline);border-radius:8px;padding:8px 10px;width:120px;text-transform:none;letter-spacing:0}
.optics-form button{align-self:end}

.optics-summary{display:flex;flex-wrap:wrap;gap:10px;padding:16px 22px}
.sumcard{border:1px solid var(--hairline);border-radius:10px;padding:10px 14px;min-width:96px}
.sumcard b{display:block;font-size:1.3rem;font-variant-numeric:tabular-nums}
.sumcard span{font-size:.68rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em}
.sumcard.ok b{color:var(--good)} .sumcard.tight b{color:var(--amber)}
.sumcard em{display:block;font-size:.66rem;color:var(--muted);font-style:normal;margin-top:3px}

/* Análise de Rede (snapshot) */
.analysis-body{padding:16px 22px 24px}
.analysis-body h3{font-size:.82rem;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);
  margin:20px 0 8px;border-bottom:1px solid var(--hairline);padding-bottom:5px}
.analysis-body table{width:100%;border-collapse:collapse;font-size:.85rem}
.analysis-body th,.analysis-body td{padding:6px 10px;border-bottom:1px solid var(--hairline);text-align:left}
.analysis-body th{font-size:.68rem;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);font-weight:700}
.analysis-body td.num,.analysis-body th.num{text-align:right;font-variant-numeric:tabular-nums}
.analysis-body tfoot td{font-weight:700;border-top:2px solid var(--hairline);border-bottom:none}
.analysis-body .empty{text-align:center;color:var(--muted);padding:16px}
.an-bar{display:flex;height:8px;width:120px;border-radius:5px;overflow:hidden;background:var(--surface-2)}
.an-bar span{display:block;height:100%}

/* Catálogo editável */
/* São 13 tipos e tabelas largas. A janela ganha espaço, as abas QUEBRAM em vez de rolar na
   horizontal (a última ficava cortada e a barra de rolagem atravessava o card inteiro), e só
   o corpo rola: cabeçalho e abas parados é o que permite trocar de aba sem subir a página. */
#catalogModal .modal-card{width:min(1180px,97vw);max-height:92vh;
  display:flex;flex-direction:column;overflow:hidden}
#catalogModal .modal-head{position:static;flex:none}
.catalog-tabs{display:flex;gap:6px;padding:14px 22px 0;flex-wrap:wrap;flex:none}

.cat-tab{background:var(--surface-2);border:1px solid var(--hairline);border-bottom:none;color:var(--muted);
  border-radius:8px 8px 0 0;padding:8px 16px;cursor:pointer;font-family:var(--font);font-size:.85rem;font-weight:600}
.cat-tab.on{background:var(--surface);color:var(--ink)}
.catalog-body{padding:14px 22px 22px;flex:1;min-height:0;overflow:auto}
.cat-table{width:100%;border-collapse:collapse;font-size:.85rem}
.cat-table th{font-size:.66rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);text-align:left;padding:6px 8px}
.cat-table td{padding:4px 8px;border-bottom:1px solid var(--hairline)}
.cat-table input,.cat-table select{width:100%;box-sizing:border-box;font-family:var(--font);font-size:.84rem;color:var(--ink);
  background:var(--surface-2);border:1px solid var(--hairline);border-radius:6px;padding:6px 8px}
.cat-del{background:none;border:none;cursor:pointer;font-size:.95rem;opacity:.7}
.cat-del:hover{opacity:1}
.cat-add{margin-top:12px}
.catalog-body .empty{text-align:center;color:var(--muted);padding:16px}

/* Barra de opções da ferramenta ativa */
.tool-options{position:absolute;top:74px;left:calc(50% + 140px);transform:translateX(-50%);z-index:1001;
  display:flex;gap:16px;align-items:center;background:var(--flutuante);backdrop-filter:blur(8px);
  border:1px solid var(--hairline);border-radius:10px;padding:7px 14px;box-shadow:0 10px 30px -12px var(--shadow-forte)}
.tool-options[hidden]{display:none}
.topt{display:flex;align-items:center;gap:7px;font-size:.66rem;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;font-weight:700}
.topt select,.topt input{font-family:var(--font);font-size:.82rem;color:var(--ink);background:var(--surface-2);
  border:1px solid var(--hairline);border-radius:7px;padding:5px 8px;text-transform:none;letter-spacing:0}
@media (max-width:640px){ .tool-options{left:50%;top:auto;bottom:64px;flex-wrap:wrap;max-width:94vw} }

/* Equipamentos do POP */
/* Arrastar a ferramenta até o mapa: prévia seguindo o cursor.
   touch-action:none é o que permite o gesto no toque — sem isso o navegador trata o
   movimento como rolagem da barra e o arraste nunca começa. */
.tool-arrastavel{touch-action:none}
.tool-ghost{position:fixed;left:0;top:0;z-index:4000;pointer-events:none;
  margin:-16px 0 0 -16px;width:32px;height:32px;display:grid;place-items:center;
  background:var(--surface);border:1px solid var(--blue);border-radius:50%;
  box-shadow:0 8px 20px -6px var(--shadow-forte);opacity:.92;font-size:.62rem;font-weight:700;color:var(--ink)}
body.arrastando-ferramenta,body.arrastando-ferramenta #map{cursor:copy}
/* Durante o arraste o mapa não deve reagir a hover de elemento nem iniciar seleção. */
body.arrastando-ferramenta{user-select:none}

/* Matriz de Fusão do DIO: três colunas (cabos, splitters, bandejas). */
.dio-matrix-card{display:flex;flex-direction:column;overflow:hidden}
.dio-matrix-hint{margin:0;padding:11px 22px;font-size:.8rem;color:var(--muted);border-bottom:1px solid var(--hairline);
  display:flex;align-items:center;gap:14px;flex-wrap:wrap}
.dio-matrix-hint b{color:var(--ink)}
.dio-legend{display:flex;gap:12px;margin-left:auto}
.dio-legend span{display:inline-flex;align-items:center;gap:5px;font-size:.74rem}
.dio-legend i{width:11px;height:11px;border-radius:3px;border:1px solid var(--hairline)}
.dio-legend .st-livre{background:var(--surface-2)}
.dio-legend .st-conect{background:rgba(74,222,128,.5);border-color:var(--good-ink)}
.dio-legend .st-sel{background:rgba(59,166,242,.55);border-color:var(--blue)}
.dio-legend .st-fusao{background:rgba(242,166,59,.55);border-color:var(--amber)}
/* Marca de fusão: um ponto no canto da porta. A porta do DIO tem dois lados — fusão atrás,
   manobra na frente — e os dois estados precisam aparecer ao mesmo tempo. */
.dio-dot{position:relative}
.dio-dot.tem-fusao::after{content:"";position:absolute;top:-2px;right:-2px;width:7px;height:7px;
  border-radius:50%;background:var(--amber);border:1px solid var(--campo)}
.patch-slot-label{font-size:.64rem;font-weight:700;color:var(--muted);margin:7px 0 4px}
.dio-matrix-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:16px 22px 22px;overflow:auto;flex:1;min-height:0;align-items:start}
.dio-col-title{font-size:.7rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.dio-col{display:flex;flex-direction:column;gap:12px}
.dio-group{border:1px solid var(--hairline);border-radius:10px;padding:11px;background:var(--painel)}
.dio-group-head{display:flex;align-items:center;gap:8px;font-size:.8rem;font-weight:700;margin-bottom:9px}
.dio-group-head .dio-count{margin-left:auto;color:var(--muted);font-weight:500;font-size:.72rem;font-variant-numeric:tabular-nums}
.dio-tube{margin-bottom:9px}
.dio-tube-label{font-size:.66rem;font-weight:700;color:var(--muted);margin-bottom:5px;display:flex;align-items:center;gap:5px}
.dio-tube-label i{width:9px;height:9px;border-radius:2px;border:1px solid #64748B}
.dio-dots{display:flex;flex-wrap:wrap;gap:5px}
/* Fibra e porta compartilham o mesmo alvo clicável, para o olho tratar os dois igual. */
.dio-dot{width:27px;height:27px;border-radius:50%;border:2px solid #64748B;cursor:pointer;
  display:flex;align-items:center;justify-content:center;font-size:.66rem;font-weight:700;color:var(--ink);
  font-variant-numeric:tabular-nums;background:var(--surface-2)}
.dio-dot.port{border-radius:7px;color:var(--ink);background:var(--surface-2)}
.dio-dot.conectado{border-color:var(--good-ink);box-shadow:0 0 0 2px rgba(74,222,128,.25)}
.dio-dot.selecionado{border-color:var(--blue);box-shadow:0 0 0 3px rgba(59,166,242,.35)}
.dio-dot:hover{filter:var(--realce)}
.dio-empty{color:var(--muted);font-size:.8rem;padding:12px 2px;text-align:center}
@media(max-width:900px){.dio-matrix-grid{grid-template-columns:1fr}}

/* Vista frontal do rack: coluna de posições em U com os equipamentos instalados. */
.popeq-grid{display:grid;grid-template-columns:minmax(300px,1fr) minmax(260px,.85fr);gap:16px;padding:16px 22px 22px;align-items:start}
.popeq-col-title{font-size:.7rem;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);margin-bottom:8px}
.popeq-racks{display:flex;flex-direction:column;gap:14px}
.rack{border:1px solid var(--hairline);border-radius:10px;background:var(--painel);overflow:hidden}
.rack-head{display:flex;align-items:center;gap:8px;padding:9px 11px;border-bottom:1px solid var(--hairline);font-size:.84rem;font-weight:700}
.rack-head .rack-sub{color:var(--muted);font-weight:500;font-size:.74rem}
.rack-head button{margin-left:auto;background:transparent;border:1px solid var(--hairline);border-radius:7px;color:var(--muted);cursor:pointer;padding:3px 8px;font-size:.78rem}
.rack-head button:hover{border-color:var(--red);color:var(--red)}
.rack-body{display:flex;flex-direction:column;padding:8px}
/* Cada linha é 1U. A numeração desce (topo = maior U), como num rack de verdade. */
.rack-u{display:grid;grid-template-columns:30px 1fr;align-items:stretch;gap:6px;min-height:26px;margin-bottom:3px}
.rack-u-num{display:flex;align-items:center;justify-content:flex-end;color:var(--muted);font-size:.66rem;font-variant-numeric:tabular-nums}
.rack-slot{border:1px dashed var(--hairline);border-radius:6px;display:flex;align-items:center;padding:0 8px;font-size:.74rem;color:var(--muted)}
.rack-slot.livre{cursor:pointer}
.rack-slot.livre:hover{border-color:var(--blue);color:var(--blue)}
.rack-item{border:1px solid rgba(59,166,242,.45);background:rgba(59,166,242,.14);border-radius:6px;
  display:flex;align-items:center;gap:8px;padding:0 9px;font-size:.78rem;color:var(--ink);font-weight:600}
.rack-item.dio{border-color:rgba(242,166,59,.5);background:rgba(242,166,59,.14)}
.rack-item .rack-tag{font-size:.62rem;font-weight:800;letter-spacing:.04em;padding:1px 5px;border-radius:4px;background:var(--surface-2);color:var(--muted)}
.rack-item .rack-ports{color:var(--muted);font-weight:500;font-size:.72rem}
.rack-item button{margin-left:auto;background:transparent;border:none;color:var(--muted);cursor:pointer;font-size:.86rem;padding:0 2px}
.rack-item button:hover{color:var(--red)}
.rack-empty{color:var(--muted);font-size:.78rem;padding:10px 2px}
@media(max-width:820px){.popeq-grid{grid-template-columns:1fr}}
.popeq-add{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:16px 22px;border-bottom:1px solid var(--hairline)}
.popeq-add select{flex:1;min-width:120px;font-family:var(--font);font-size:.85rem;color:var(--ink);background:var(--surface-2);border:1px solid var(--hairline);border-radius:7px;padding:7px 9px}
.popeq-gap{width:10px}
.popeq-list{padding:14px 22px 22px;display:flex;flex-direction:column;gap:8px}
.popeq-item{display:flex;align-items:center;gap:8px;font-size:.88rem;color:var(--ink);background:var(--surface-2);border:1px solid var(--hairline);border-radius:8px;padding:9px 12px}
.popeq-tag{font-size:.66rem;font-weight:800;padding:2px 7px;border-radius:5px;letter-spacing:.04em}
.popeq-tag.olt{background:rgba(59,166,242,.18);color:var(--blue)}
.popeq-tag.dio{background:rgba(242,166,59,.18);color:var(--amber)}
.popeq-tag.ativo{background:rgba(63,190,119,.18);color:var(--good)}

/* Tópico 10: VFL na matriz e colunas arrastáveis */
.dio-legend .st-vfl{background:rgba(255,45,45,.65);border-color:#ff2d2d}
/* O VFL é vermelho e vence os outros estados no mesmo ponto: é o estado que se está
   investigando agora, e precisa ser visto por cima de "conectado" e "com fusão". */
#patchMatrixModal .dio-dot.vfl{background:rgba(255,45,45,.3);border-color:#ff2d2d;color:var(--ink);
  box-shadow:0 0 0 2px rgba(255,45,45,.35)}
.patch-coluna{display:flex;flex-direction:column;min-width:0}
.patch-coluna .dio-col-title{cursor:grab;user-select:none}
.patch-coluna.arrastando{opacity:.45}
.patch-coluna.alvo .dio-col-title{outline:2px dashed var(--blue);outline-offset:2px;border-radius:7px}

.popeq-del{margin-left:auto;background:none;border:none;cursor:pointer;opacity:.7}
.popeq-del:hover{opacity:1}
.popeq-empty{color:var(--muted);text-align:center;padding:24px;font-size:.9rem}

/* Painel de camadas (visibilidade por tipo) */
.layers-panel{position:absolute;top:58px;right:14px;z-index:1300;width:190px;
  background:var(--surface);border:1px solid var(--hairline);border-radius:12px;padding:8px;
  box-shadow:0 16px 40px -16px var(--shadow-forte)}
.layers-panel[hidden]{display:none}
.layers-head{display:flex;justify-content:space-between;align-items:center;padding:4px 6px 8px;
  border-bottom:1px solid var(--hairline);margin-bottom:6px;font-size:.72rem;letter-spacing:.06em;
  text-transform:uppercase;color:var(--muted)}
.layers-head button{background:none;border:none;color:var(--muted);font-size:1.1rem;cursor:pointer;line-height:1}
.layers-head button:hover{color:var(--ink)}
.layers-panel label{display:flex;align-items:center;gap:8px;padding:5px 6px;font-size:.85rem;
  color:var(--ink);border-radius:6px;cursor:pointer}
.layers-panel label:hover{background:var(--surface-2)}
.layers-panel input{accent-color:var(--cyan);width:15px;height:15px;cursor:pointer}

/* Busca global */
.search{position:relative;margin:2px 0 4px}
.search input{width:100%;box-sizing:border-box;font-family:var(--font);font-size:.85rem;color:var(--ink);
  background:var(--surface-2);border:1px solid var(--hairline);border-radius:8px;padding:9px 11px}
.search input:focus{outline:none;border-color:var(--cyan)}
.search-results{position:absolute;top:calc(100% + 4px);left:0;right:0;z-index:1400;max-height:260px;overflow:auto;
  background:var(--surface);border:1px solid var(--hairline);border-radius:8px;box-shadow:0 16px 40px -16px var(--shadow-forte)}
.search-results[hidden]{display:none}
.search-item{display:block;width:100%;text-align:left;background:none;border:none;color:var(--ink);
  font-family:var(--font);font-size:.83rem;padding:8px 11px;cursor:pointer;border-bottom:1px solid var(--hairline)}
.search-item:last-child{border-bottom:none}
.search-item:hover{background:var(--surface-2);color:var(--cyan)}
.search-empty{padding:10px 11px;font-size:.82rem;color:var(--muted)}
.sumcard.fail b{color:var(--red)} .sumcard.worst b{color:var(--cyan)}

.tablewrap{overflow-x:auto;padding:6px 22px 22px}
#opticalTable{border-collapse:collapse;width:100%;font-size:.86rem;min-width:640px}
#opticalTable th,#opticalTable td{padding:9px 12px;border-bottom:1px solid var(--hairline);text-align:right;font-variant-numeric:tabular-nums}
#opticalTable th:first-child,#opticalTable td:first-child{text-align:left}
#opticalTable thead th{font-size:.66rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:700;background:var(--surface-2)}
.pill{display:inline-block;font-size:.72rem;font-weight:700;padding:2px 9px;border-radius:20px}
.pill.ok{background:rgba(63,190,119,.18);color:var(--good)}
.pill.tight{background:rgba(242,166,59,.18);color:var(--amber)}
.pill.fail{background:rgba(224,104,94,.2);color:var(--red)}
.pill.disconnected{background:var(--surface-2);color:var(--muted)}
.pill.active{background:rgba(63,190,119,.18);color:var(--good)}
.pill.trial{background:rgba(199,125,255,.18);color:var(--roxo-ink)}
.pill.pending{background:rgba(242,166,59,.18);color:var(--amber)}
.pill.expired{background:rgba(224,104,94,.2);color:var(--red)}

/* Tópico 3: indicadores de negócio. Mesmo visual escuro e sóbrio do resto do painel — a
   referência era de conteúdo, não de estilo. */
.admin-kpi small.kpi-sobe{color:var(--good)}
.admin-kpi small.kpi-desce{color:var(--red)}
.admin-donut-wrap{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.admin-donut-legend{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:5px;font-size:.78rem;min-width:150px}
.admin-donut-legend li{display:flex;align-items:center;gap:7px;color:var(--muted)}
.admin-donut-legend i{width:9px;height:9px;border-radius:3px;flex:none}
.admin-donut-legend b{margin-left:auto;color:var(--ink)}
.admin-donut-legend span{color:var(--muted);min-width:34px;text-align:right}
.admin-recurring{display:flex;flex-direction:column;gap:10px}
.admin-recurring-big b{display:block;color:var(--ink);font-size:1.5rem;line-height:1.1}
.admin-recurring-big span{color:var(--muted);font-size:.72rem}
.admin-recurring-list{list-style:none;margin:4px 0 0;padding:0;color:var(--muted);font-size:.76rem;line-height:1.6}
.admin-latest-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:9px}
.admin-latest-list li{display:flex;align-items:center;gap:10px;font-size:.8rem}
.admin-avatar{width:30px;height:30px;border-radius:9px;flex:none;display:flex;align-items:center;justify-content:center;
  background:var(--grad-avatar);color:var(--blue-ink);font-weight:800;font-size:.85rem}
.admin-latest-nome{display:flex;flex-direction:column;min-width:0}
.admin-latest-nome b{color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.admin-latest-nome small,.admin-latest-meta small{color:var(--muted);font-size:.7rem}
.admin-latest-meta{margin-left:auto;display:flex;flex-direction:column;text-align:right;color:var(--muted);font-size:.74rem;flex:none}
/* A rosca dos testes fica ao lado da tabela; abaixo de 900px ela passa para cima. */
.admin-trials{display:grid;grid-template-columns:minmax(260px,320px) 1fr;gap:14px;align-items:start;margin-top:12px}
@media (max-width:900px){.admin-trials{grid-template-columns:1fr}}
.uso{display:flex;flex-direction:column;gap:3px;min-width:120px}
.uso-barra{height:6px;border-radius:4px;background:rgba(148,163,184,.22);overflow:hidden}
.uso-barra span{display:block;height:100%;border-radius:4px;background:var(--good)}
.uso-barra span.atencao{background:var(--amber)}
.uso-barra span.cheio{background:var(--red)}
.uso small{color:var(--muted);font-size:.68rem}
.uso-livre{color:var(--muted);font-size:.74rem}
#adminWalletSearch{min-width:200px}

@media (max-width:720px){
  body{grid-template-columns:1fr;grid-template-rows:auto 1fr}
  #sidebar{max-height:42vh}
  #toolbar{top:auto;bottom:14px;left:50%;flex-wrap:wrap;justify-content:center;max-width:94vw}
}

/* Visível desde o HTML inicial, até terminar a restauração da sessão. */
.session-loading{z-index:5100;flex-direction:column;gap:20px;color:var(--muted)}
.session-loading p{margin:0;font-size:.95rem}
.session-spinner{width:32px;height:32px;border:3px solid var(--tint-2);border-top-color:var(--cyan);border-radius:50%;animation:session-spin .85s linear infinite}
@keyframes session-spin{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){.session-spinner{animation:none}}

/* O estado hidden deve prevalecer sobre display:flex/grid dos componentes. */
[hidden]{display:none!important}
/* Usuários: tabela espaçada e cadastro em linhas independentes. */
#teamTable{width:100%;border-collapse:collapse;min-width:1080px;font-size:.88rem}
#teamTable th{text-align:left;padding:14px 12px;color:var(--muted);font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;border-bottom:1px solid var(--hairline)}
#teamTable td{padding:16px 12px;border-bottom:1px solid var(--hairline);vertical-align:middle;line-height:1.5}
#teamTable tbody tr:hover{background:rgba(111,208,255,.035)}
#teamTable td:nth-child(4){overflow-wrap:anywhere;min-width:200px}
#teamTable small{color:var(--muted)}
#teamTable .team-badge{display:inline-block;background:var(--surface-2);padding:5px 9px;border-radius:6px;white-space:nowrap}
#teamTable .team-actions{flex-wrap:nowrap}
#teamTable .team-actions button{background:var(--surface);color:var(--ink);border:1px solid var(--hairline);white-space:nowrap;font-size:.8rem}
#teamTable .team-actions .danger{color:var(--red-ink);border-color:#864841}
#addMemberForm.member-create-form{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 22px;margin:24px 22px;padding:22px;border:1px solid var(--hairline);border-radius:12px;background:var(--surface)}
#addMemberForm[hidden],#addMemberForm [hidden]{display:none!important}
#addMemberForm label{width:auto;min-width:0;display:flex;flex-direction:column;gap:7px}
#addMemberForm input,#addMemberForm select{width:100%;min-width:0}
#addMemberForm button[type=submit]{grid-column:1/-1;justify-self:start;padding:12px 22px}
.member-form-heading{grid-column:1/-1}.member-form-heading h3{margin:0 0 6px}.member-form-heading p{margin:0;color:var(--muted);font-size:.85rem}
.member-credentials{width:min(520px,95vw)}
.member-credentials-body{padding:22px;display:flex;flex-direction:column;gap:12px}
.member-credentials-body textarea{width:100%;resize:vertical;background:var(--surface-2);color:var(--ink);border:1px solid var(--hairline);border-radius:8px;padding:12px;font: .9rem var(--mono)}
.member-credentials-body p{margin:0;color:var(--muted);font-size:.85rem}
@media(max-width:1100px){#addMemberForm.member-create-form{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:650px){#addMemberForm.member-create-form{grid-template-columns:1fr}}
body.access-blocked #sidebar,body.access-blocked #map,body.access-blocked #toolbar,body.access-blocked #inspector,body.access-blocked #layersPanel{display:none!important}
body.access-blocked #plansPage{inset:0!important}
.plan-card .plan-price{width:100%;margin-bottom:12px}

.pix-qr{display:block;width:240px;max-width:100%;background:white;padding:12px;margin:16px 0;border-radius:12px}
.pix-payment{margin:16px 0}

#pixDocument{display:block;max-width:320px;width:100%;padding:12px;margin-top:8px;background:var(--campo);color:inherit;border:1px solid var(--hairline);border-radius:8px}

.profile-tabs{display:flex;gap:12px;padding:18px 24px;border-bottom:1px solid var(--hairline);flex-wrap:wrap}
.profile-tabs button{padding:12px 18px;border-radius:10px;background:transparent;color:inherit;border:1px solid var(--hairline);cursor:pointer}
.profile-tabs [aria-current=page]{background:var(--blue);color:var(--on-accent);border-color:var(--blue);font-weight:700}
.profile-content{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,1fr);gap:24px;padding:24px;align-items:start}
.profile-content[hidden]{display:none}
.profile-card{padding:22px;border:1px solid var(--hairline);border-radius:14px;background:var(--painel-solido);margin-bottom:16px}
.profile-card h3{margin:0 0 12px;font-size:1.1rem}.profile-card p{color:var(--muted);line-height:1.6}
.profile-details{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px;margin:24px 0 0}
.profile-details dt{color:var(--muted);font-size:.8rem;margin-bottom:6px}.profile-details dd{margin:0;overflow-wrap:anywhere}
#profilePasswordForm{display:grid;gap:16px}#profilePasswordForm label{display:grid;gap:8px;font-size:.9rem}
#profilePasswordForm input{width:100%;box-sizing:border-box;background:var(--campo);color:inherit;border:1px solid var(--hairline);border-radius:8px;padding:13px}
#profilePasswordForm p{margin:0}#profilePasswordForm button{justify-self:start}
.profile-history{width:100%;border-collapse:collapse;text-align:left}.profile-history th,.profile-history td{padding:12px;border-bottom:1px solid var(--hairline);white-space:nowrap}
@media(max-width:900px){.profile-content{grid-template-columns:1fr}.profile-details{grid-template-columns:1fr}.profile-tabs,.profile-content{padding:16px}}
/* Confirmação de recebimento no cadastro administrativo. */
.member-cash:not([hidden]){grid-column:1/-1;display:flex;align-items:center;gap:16px;padding:14px;border:1px solid var(--hairline);border-radius:10px;}
.member-cash button{flex-shrink:0;}
.member-cash small{color:var(--muted);font-size:13px;line-height:1.5;}
@media(max-width:600px){.member-cash:not([hidden]){align-items:flex-start;flex-direction:column;gap:8px;}}

.reports-filters{display:flex;flex-wrap:wrap;gap:16px;margin:18px 0}.reports-filters label{display:grid;gap:8px;min-width:200px}.reports-filters label:first-child{flex:1}.reports-filters input,.reports-filters select{width:100%}.reports-table-wrap{overflow-x:auto}#reportsTable{width:100%;min-width:760px;border-collapse:collapse}#reportsTable th,#reportsTable td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--hairline);vertical-align:top}#reportsTable small{display:block;margin-top:5px;color:var(--muted);overflow-wrap:anywhere}

.userlogout{display:inline-flex;align-items:center;justify-content:center}.userlogout svg{flex:none}
.password-rules{list-style:none;margin:-5px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:5px 14px;font-size:.74rem;line-height:1.4}.password-rules li{white-space:nowrap}.password-match{margin:-6px 0 0;font-size:.74rem;line-height:1.4}.password-rules .unmet,.password-match.unmet{color:var(--red-ink)}.password-rules .met,.password-match.met{color:var(--good-ink)}

.auth-form button[aria-busy="true"],.email-verification-actions button[aria-busy="true"]{display:flex;align-items:center;justify-content:center;gap:9px;cursor:wait;opacity:.85}.button-spinner{width:16px;height:16px;flex:none;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:session-spin .8s linear infinite}.plans-account-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex-shrink:0;margin-left:auto}.plans-account-actions .userlogout{width:42px;height:42px}.plans-account-actions [hidden]{display:none!important}@media(max-width:600px){.plans-page-card .workspace-page-head{flex-wrap:wrap;gap:16px}.plans-account-actions{width:100%;margin-left:0}}@media(prefers-reduced-motion:reduce){.button-spinner{animation:none}}

.plan-public-prices{display:grid;gap:10px;margin:18px 0}.plan-public-prices p{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px;margin:0;padding:10px 0;border-bottom:1px solid var(--hairline)}.plan-public-prices span{color:var(--muted);font-size:.82rem}.plan-public-prices strong{color:var(--cyan);font-size:.9rem}

#trialChoice.trial-selected{border-color:var(--cyan);background:var(--surface-2)}#trialChoice h3 label{display:flex;align-items:center;gap:10px;cursor:pointer}#trialPlanOption{accent-color:var(--cyan)}#plansPage [hidden]{display:none!important}

body.access-blocked #emailVerificationPage{inset:0!important}.email-verification-card{max-width:720px!important;margin:40px auto!important}.email-verification-actions{display:flex;flex-wrap:wrap;gap:12px;margin:24px 0}#emailVerificationPage [hidden]{display:none!important}

.plan-checkout-controls{display:flex;flex-wrap:wrap;align-items:flex-end;gap:12px}.plan-checkout-controls label{display:grid;gap:7px;font-size:.8rem;color:var(--muted)}.plan-checkout-controls select{min-width:210px}.plan-selection-page .plans-actions{align-items:center;border-top:1px solid var(--hairline);gap:20px}.plan-selection-page .plans-actions>p{max-width:480px}@media(max-width:700px){.plan-checkout-controls{width:100%}.plan-checkout-controls label,.plan-checkout-controls button{flex:1;min-width:200px}}

.plan-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;padding:18px 22px}.plan-options.with-trial{grid-template-columns:repeat(4,minmax(0,1fr))}.plan-options>.plans-grid{display:contents}#trialChoice>p{color:var(--muted);font-size:.82rem;line-height:1.5}#trialChoice .primary{margin-top:12px;width:100%}@media(max-width:1150px){.plan-options.with-trial{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.plan-options,.plan-options.with-trial{grid-template-columns:1fr}}

.plans-actions>.plan-checkout-controls{margin-left:auto;justify-content:flex-end;min-height:76px}#plansApply{min-width:240px}.plan-selection-page .plans-actions{min-height:98px}@media(max-width:760px){.plans-actions>.plan-checkout-controls{width:100%;margin-left:0}#plansApply{width:100%;min-width:0}}
.plan-selection-page .plans-actions{padding-top:20px;padding-bottom:20px;min-height:0}
.plan-selection-page .plan-checkout-controls{display:flex;align-items:flex-end;min-height:0}
.plan-selection-page .plan-checkout-controls select,.plan-selection-page #plansApply{min-height:44px}
@media(max-width:760px){.plan-selection-page .plan-checkout-controls{display:flex;flex-direction:column;align-items:stretch}.plan-selection-page .plan-checkout-controls label,.plan-selection-page .plan-checkout-controls button{flex:auto;min-width:0;width:100%}.plan-selection-page .plan-checkout-controls select{width:100%;min-width:0}}

#pixPaymentDialog,#cardPaymentDialog,#renewalReminderDialog{width:min(560px,calc(100vw - 32px));max-height:90dvh;box-sizing:border-box;overflow:auto;border:1px solid var(--hairline);border-radius:18px;padding:24px;color:var(--ink);background:var(--surface);box-shadow:0 24px 80px var(--shadow-forte)}#pixPaymentDialog::backdrop,#cardPaymentDialog::backdrop,#renewalReminderDialog::backdrop{background:var(--veu);backdrop-filter:blur(3px)}.pix-dialog-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:18px}.pix-dialog-head h2{margin:0;font-size:1.15rem}#pixDialogBody{text-align:center}#pixDialogBody .pix-qr{margin:20px auto;width:260px;box-sizing:border-box}#pixDialogBody p,#pixDialogMessage{font-size:.85rem;line-height:1.6;color:var(--muted)}#pixDialogBody button{margin:4px}#pixDialogBody .pix-payment h3{font-size:1rem}

#pixPaymentDialog button[aria-busy="true"]{display:inline-flex;align-items:center;justify-content:center;gap:9px;cursor:wait;opacity:.85}

#temporaryPasswordModal{position:fixed;z-index:100000;background:var(--navy);overflow:auto}
#temporaryPasswordModal .modal-card{width:min(480px,100%)}
#temporaryPasswordForm{display:grid;grid-template-columns:minmax(0,1fr);gap:16px;padding:24px;border-bottom:0}
#temporaryPasswordForm p{margin:0;line-height:1.5}
#temporaryPasswordForm label{font-size:.8rem;letter-spacing:0;text-transform:none;gap:8px;min-width:0}
#temporaryPasswordForm input{width:100%;min-width:0;box-sizing:border-box;padding:12px 42px 12px 12px}
#temporaryPasswordForm .senha-wrap{width:100%;min-width:0}
#temporaryPasswordForm .senha-olho{color:var(--muted);align-self:auto;width:36px;height:36px;padding:0}
#temporaryPasswordForm small{color:var(--muted);line-height:1.5;margin-top:-8px}
#temporaryPasswordMessage:empty{display:none}
#temporaryPasswordMessage{color:var(--red-ink);font-size:.85rem}
#temporaryPasswordSave,#temporaryPasswordLogout{width:100%;min-height:44px}
@media(max-width:520px){#temporaryPasswordModal{padding:16px}#temporaryPasswordForm{padding:20px}#temporaryPasswordModal .modal-head{padding:20px}}
#memberCredentialsWhatsapp{display:inline-block;text-align:center;text-decoration:none;margin:8px 0}

.team-filters{padding:18px 22px 6px}.team-filters label{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.85rem}.team-filters select{min-width:190px;padding:10px 12px;border:1px solid var(--hairline);border-radius:8px;background:var(--surface-2);color:var(--ink)}
#addMemberForm .member-form-section{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 22px;align-items:start;border-top:1px solid var(--hairline);padding-top:20px}
#addMemberForm .member-form-section h4{grid-column:1/-1;margin:0;font-size:.95rem}
#addMemberForm label{align-self:start;text-transform:none;letter-spacing:0;font-size:.8rem}
#addMemberForm input,#addMemberForm select{box-sizing:border-box;min-height:42px}
#addMemberForm label small{font-size:.78rem;line-height:1.5;font-weight:400;color:var(--muted)}
@media(max-width:640px){#addMemberForm .member-form-section{grid-template-columns:minmax(0,1fr)}}

#adminLoginAccordion>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;cursor:pointer;font-weight:700;padding:4px 0;list-style:none}
#adminLoginAccordion>summary::-webkit-details-marker{display:none}
#adminLoginAccordion>summary::after{content:'+';font-size:1.3rem;color:var(--cyan)}
#adminLoginAccordion[open]>summary::after{content:'−'}
.admin-login-toggle{margin-left:auto;color:var(--muted);font-size:.8rem;font-weight:400}
#adminLoginAccordion[open] .admin-login-toggle{display:none}
.admin-login-content{margin-top:22px}.admin-login-content>.admin-kpis{margin-bottom:22px}
#adminPage .admin-lower-grid{grid-template-columns:minmax(0,1fr)}

#sidebar #userBox{display:grid;grid-template-columns:42px minmax(0,1fr);gap:10px;padding:14px;margin-bottom:10px}
#mapAccountToggle{display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;padding:5px 0;border:0;text-align:left;font-size:.8rem;color:var(--cyan);background:transparent;cursor:pointer}
.account-chevron{flex:none;transition:transform .15s ease}
#mapAccountToggle[aria-expanded=true] .account-chevron{transform:rotate(180deg)}
#mapAccountMenu{grid-column:1/-1;display:grid;gap:4px;margin:4px -4px -4px;padding:10px 0 0;border:0;border-top:1px solid var(--hairline);border-radius:0;background:transparent}
#mapAccountMenu button{display:flex;align-items:center;justify-content:flex-start;gap:10px;min-height:40px;width:100%;text-align:left;padding:9px 10px;background:transparent;color:var(--ink);border:0;border-radius:6px;font-size:.85rem}
#mapAccountMenu button:hover{background:var(--tint)}
#mapAccountMenu .sg-ico,#mapAccountMenu svg{width:20px;flex:0 0 20px;text-align:center}
#mapAccountMenu #logoutBtn{color:var(--red-ink);height:auto}
#adminBtn{display:flex;align-items:center;justify-content:flex-start;gap:10px;width:100%;margin:0 0 18px;padding:12px 14px;color:var(--ink);border:1px solid var(--hairline);background:var(--surface);border-radius:10px;font-size:.8rem;font-weight:600;text-align:left}
#adminBtn svg{flex:none;color:var(--cyan)}
#adminBtn:hover{background:var(--surface-2);border-color:var(--cyan)}
.admin-shell #mapAccountToggle,.admin-shell #mapAccountMenu{display:none!important}
.team-filters{display:flex;flex-wrap:wrap;align-items:end;gap:18px}.team-search{display:flex;flex-wrap:wrap;align-items:end;gap:10px;flex:1}.team-search label{flex:1;min-width:220px;display:grid;gap:8px}.team-search input{width:100%;box-sizing:border-box;padding:10px 12px;border:1px solid var(--hairline);border-radius:8px;background:var(--surface-2);color:var(--ink)}

#cardPaymentDialog{width:min(560px,calc(100vw - 32px));max-height:90vh;overflow:auto} .card-recurring-consent{display:flex;align-items:flex-start;gap:10px;margin:16px 0} .card-recurring-consent input{width:auto;margin-top:3px}

#renewalReminderDialog h2{font-size:1.25rem;margin-top:0}#renewalReminderText{line-height:1.6}.renewal-reminder-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:12px;margin-top:24px}

/* Telas compartilhadas preservam o retorno apenas para o perfil cliente. */
.admin-shell #profileClose,.admin-shell #plansClose{display:none}

.team-pagination{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding:12px 22px;font-size:.85rem;color:var(--muted)}.team-pagination[hidden]{display:none}.team-pagination>div{display:flex;gap:8px}