/* LunaOps · Campo Operacional
   Camada visual modular: o arquivo principal mantém todos os contratos do painel. */

:root {
  --campo:#0d120f;
  --campo-2:#121914;
  --campo-3:#172019;
  --campo-linha:rgba(200,224,208,.13);
  --campo-linha-viva:rgba(66,176,122,.48);
  --campo-texto:#eef3ef;
  --campo-suave:#93a199;
  --campo-sinal:#20d989;
  --campo-alerta:#e2ad50;
  --campo-erro:#e0736a;
  --campo-raio:16px;
}

/* A órbita é uma ferramenta de navegação: ocupa o campo, sem padding de dashboard. */
.pag:has(.mapa-vista.on) { padding:0; }
.mapa-vista { min-height:calc(100dvh - var(--topo)); background:var(--campo); color:var(--campo-texto); }
.mapa-shell { min-height:calc(100dvh - var(--topo)); position:relative; overflow:hidden; isolation:isolate; }
.mapa-shell::before {
  content:""; position:absolute; inset:-28% -16%; pointer-events:none; opacity:.65; z-index:-1;
  background:
    radial-gradient(circle at 46% 48%, rgba(32,217,137,.075) 0 1px, transparent 2px),
    radial-gradient(circle at 78% 21%, rgba(238,243,239,.10) 0 1px, transparent 1.5px),
    radial-gradient(circle at 15% 73%, rgba(32,217,137,.12) 0 1px, transparent 1.5px);
  background-size:137px 139px,193px 211px,271px 233px;
  transform:rotate(-5deg);
}
.mapa-shell::after {
  content:""; position:absolute; width:min(72vw,1080px); aspect-ratio:1; border:1px solid rgba(66,176,122,.075);
  border-radius:50%; left:38%; top:52%; transform:translate(-50%,-50%); pointer-events:none; z-index:-1;
}

.mapa-cabeca { display:flex; align-items:flex-end; justify-content:space-between; gap:32px; padding:clamp(24px,3vw,44px) clamp(24px,4vw,64px) 22px; }
.mapa-cabeca > div:first-child { max-width:660px; }
.mapa-estado { display:flex; align-items:center; gap:9px; color:#75dba7; font:500 9px/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; }
.mapa-estado i { width:7px; height:7px; border-radius:50%; background:var(--campo-sinal); box-shadow:0 0 0 6px rgba(32,217,137,.10); animation:campoPulso 2.4s var(--ease-io) infinite; }
.mapa-cabeca h2 { margin-top:17px; font:500 clamp(2.35rem,4vw,4.9rem)/.94 var(--sans); letter-spacing:-.04em; text-wrap:balance; }
.mapa-cabeca p { max-width:58ch; margin-top:16px; color:#a8b4ac; font:400 clamp(.83rem,1vw,.98rem)/1.65 var(--sans); }
.mapa-controles { display:flex; align-items:center; padding:4px; border:1px solid var(--campo-linha); border-radius:999px; background:#101612; }
.mapa-controles button { border:0; border-radius:999px; background:none; padding:8px 13px; color:#8e9c93; cursor:pointer; font:500 10px/1 var(--mono); letter-spacing:.04em; }
.mapa-controles button.sel { background:#eaf0eb; color:#101511; }
.mapa-controles button:focus-visible { outline:2px solid var(--campo-sinal); outline-offset:2px; }

.mapa-metricas { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); border-block:1px solid var(--campo-linha); background:rgba(13,18,15,.82); }
.mapa-metrica { min-height:104px; padding:21px clamp(18px,2.4vw,34px); border-right:1px solid var(--campo-linha); position:relative; }
.mapa-metrica:last-child { border-right:0; }
.mapa-metrica .rot { display:block; color:#89978e; font:500 9px/1 var(--mono); letter-spacing:.1em; text-transform:uppercase; }
.mapa-metrica strong { display:inline-block; margin-top:12px; color:#f1f5f2; font:500 clamp(1.35rem,2vw,2.15rem)/1 var(--sans); letter-spacing:-.03em; }
.mapa-metrica .delta { margin-left:8px; color:#63d69c; font:500 9px/1 var(--mono); }
.mapa-metrica .pe { display:block; margin-top:8px; color:#829087; font-size:11px; }
.mapa-metrica.skeleton,.mapa-evento.skeleton { overflow:hidden; }
.mapa-metrica.skeleton::after,.mapa-evento.skeleton::after {
  content:""; position:absolute; inset:0; transform:translateX(-110%);
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.035),transparent); animation:campoCarrega 1.4s ease-in-out infinite;
}

.mapa-corpo { display:grid; grid-template-columns:minmax(0,1fr) minmax(270px,23vw); min-height:clamp(600px,calc(100dvh - 258px),780px); }
.mapa-palco { min-height:620px; position:relative; overflow:hidden; border-right:1px solid var(--campo-linha); }
.mapa-palco[data-modo="lista"] .mapa-conexoes,.mapa-palco[data-modo="lista"] .mapa-aneis,.mapa-palco[data-modo="lista"] .mapa-nucleo,.mapa-palco[data-modo="lista"] .mapa-nos { opacity:0; visibility:hidden; pointer-events:none; }
.mapa-palco[data-modo="lista"] .mapa-lista { opacity:1; visibility:visible; transform:none; }
.mapa-conexoes { position:absolute; inset:0; width:100%; height:100%; z-index:1; overflow:visible; }
.mapa-conexoes path { fill:none; stroke:rgba(112,139,120,.24); stroke-width:1; vector-effect:non-scaling-stroke; }
.mapa-conexoes path.viva { stroke:rgba(32,217,137,.48); stroke-dasharray:2 9; animation:campoSinal 14s linear infinite; }
.mapa-conexoes circle { fill:var(--campo-sinal); filter:drop-shadow(0 0 5px rgba(32,217,137,.6)); }

.mapa-aneis { position:absolute; width:min(65vw,760px); aspect-ratio:1; left:47%; top:51%; transform:translate(-50%,-50%); pointer-events:none; z-index:0; }
.mapa-aneis i { position:absolute; border:1px solid rgba(163,187,170,.11); border-radius:50%; inset:calc(var(--i,0) * 10%); }
.mapa-aneis i:nth-child(1){--i:0;border-style:dashed;animation:campoGiro 90s linear infinite}
.mapa-aneis i:nth-child(2){--i:1}
.mapa-aneis i:nth-child(3){--i:2;border-color:rgba(32,217,137,.15)}
.mapa-aneis i:nth-child(4){--i:3}

.mapa-nucleo { position:absolute; left:47%; top:51%; transform:translate(-50%,-50%); z-index:3; width:178px; height:178px; border:0; background:none; color:#edf3ef; cursor:pointer; display:flex; align-items:center; flex-direction:column; justify-content:center; }
.mapa-nucleo::before,.mapa-nucleo::after { content:""; position:absolute; border-radius:50%; pointer-events:none; }
.mapa-nucleo::before { inset:-25px; border:1px solid rgba(32,217,137,.27); }
.mapa-nucleo::after { inset:-12px; border:1px dashed rgba(32,217,137,.50); animation:campoGiro 30s linear infinite reverse; }
.mapa-lua { position:relative; width:88px; height:88px; border-radius:50%; overflow:hidden; display:block; box-shadow:0 12px 32px -12px #000,0 0 0 9px rgba(32,217,137,.035); }
.mapa-lua img { width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.07) brightness(1.2); }
.mapa-nucleo-k { margin-top:15px; color:#62d49a; font:500 8px/1 var(--mono); letter-spacing:.12em; }
.mapa-nucleo strong { margin-top:6px; font:500 17px/1 var(--sans); }
.mapa-nucleo > span:last-child { margin-top:6px; color:#86948b; font:400 9px/1 var(--mono); }
.mapa-nucleo:hover .mapa-lua { box-shadow:0 16px 38px -12px #000,0 0 0 11px rgba(32,217,137,.075); }
.mapa-nucleo:focus-visible { outline:2px solid var(--campo-sinal); outline-offset:28px; border-radius:50%; }

.mapa-nos { position:absolute; inset:0; z-index:4; }
.mapa-no { position:absolute; width:clamp(178px,17vw,228px); min-height:150px; transform:translate(-50%,-50%); text-align:left; border:1px solid rgba(179,201,185,.23); border-radius:16px; background:rgba(18,25,20,.94); color:#edf2ee; padding:17px 18px 16px; cursor:pointer; box-shadow:0 17px 40px -30px #000; transition:transform 520ms var(--ease),border-color 220ms var(--ease),background 220ms var(--ease),box-shadow 220ms var(--ease); }
.mapa-no::before { content:""; position:absolute; width:7px; height:7px; border-radius:50%; background:#6a786f; top:18px; right:18px; box-shadow:0 0 0 5px rgba(106,120,111,.08); }
.mapa-no.viva::before { background:var(--campo-sinal); box-shadow:0 0 0 5px rgba(32,217,137,.10); }
.mapa-no.roda::before { background:var(--campo-alerta); animation:campoPulso 1.8s var(--ease-io) infinite; }
.mapa-no:hover,.mapa-no:focus-visible { transform:translate(-50%,-50%) translateY(-5px); border-color:rgba(32,217,137,.55); background:#172119; box-shadow:0 24px 48px -26px #000; outline:none; }
.mapa-no.selecionada { border-color:var(--campo-sinal); }
.mapa-no-k { color:#64d69d; font:500 8px/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; }
.mapa-no h3 { margin:10px 24px 0 0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font:500 15px/1.15 var(--sans); }
.mapa-no-domain { display:block; margin-top:5px; color:#75837a; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font:400 9px/1 var(--mono); }
.mapa-no-dados { display:grid; grid-template-columns:1.2fr .8fr; gap:12px; margin-top:16px; padding-top:13px; border-top:1px solid rgba(190,211,196,.12); }
.mapa-no-dados span { min-width:0; color:#7e8d83; font-size:9px; }
.mapa-no-dados b { display:block; margin-top:4px; overflow:hidden; text-overflow:ellipsis; color:#f0f4f1; font:500 15px/1 var(--sans); }
.mapa-valor-indisponivel { cursor:help; text-decoration:underline dotted #9ba9a0; text-underline-offset:4px; }
.mapa-no-pe { display:flex; align-items:center; gap:7px; margin-top:12px; color:#839087; font:400 9px/1 var(--mono); }
.mapa-no-pe i { width:4px; height:4px; background:var(--campo-sinal); border-radius:50%; }

.mapa-lista { position:absolute; inset:32px; opacity:0; visibility:hidden; transform:translateY(12px); transition:opacity 180ms var(--ease),transform 240ms var(--ease); display:grid; align-content:start; gap:0; border-top:1px solid var(--campo-linha); }
.mapa-lista-linha { display:grid; grid-template-columns:minmax(190px,1.4fr) repeat(4,minmax(95px,.6fr)) 36px; align-items:center; gap:18px; min-height:82px; padding:13px 5px; border-bottom:1px solid var(--campo-linha); color:#a7b2aa; cursor:pointer; background:none; border-inline:0; border-top:0; text-align:left; }
.mapa-lista-linha:hover,.mapa-lista-linha:focus-visible { color:#edf3ef; background:rgba(255,255,255,.018); outline:none; }
.mapa-lista-linha .loja { display:flex; align-items:center; gap:13px; min-width:0; }
.mapa-lista-linha .fase { width:26px; height:26px; border-radius:50%; border:1px solid #647169; position:relative; flex:none; }
.mapa-lista-linha .fase::after { content:""; position:absolute; inset:5px; border-radius:50%; background:var(--campo-sinal); opacity:.75; }
.mapa-lista-linha strong { display:block; color:#edf3ef; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mapa-lista-linha small,.mapa-lista-linha span { display:block; color:#78867d; font:400 9px/1.25 var(--mono); }
.mapa-lista-linha b { display:block; margin-top:4px; color:#dfe6e1; font:500 13px/1 var(--sans); }
.mapa-lista-linha .seta { color:#58c88f; font-size:18px; }

.mapa-fluxo { min-width:0; background:#101612; display:flex; flex-direction:column; }
.mapa-fluxo-topo { min-height:94px; padding:24px 24px 17px; display:flex; justify-content:space-between; gap:12px; border-bottom:1px solid var(--campo-linha); }
.mapa-fluxo-topo span { color:#62d69b; font:500 8px/1 var(--mono); letter-spacing:.13em; }
.mapa-fluxo-topo h3 { margin-top:8px; font:500 15px/1.1 var(--sans); }
.mapa-fluxo-topo time { color:#728078; font:400 9px/1 var(--mono); }
.mapa-eventos { flex:1; min-height:0; }
.mapa-evento { position:relative; padding:20px 24px 21px 50px; border-bottom:1px solid var(--campo-linha); }
.mapa-evento::before { content:""; position:absolute; left:25px; top:25px; width:7px; height:7px; border-radius:50%; border:1px solid #66746b; }
.mapa-evento.ok::before { background:var(--campo-sinal); border-color:var(--campo-sinal); box-shadow:0 0 0 5px rgba(32,217,137,.08); }
.mapa-evento.atencao::before { background:var(--campo-alerta); border-color:var(--campo-alerta); }
.mapa-evento.erro::before { background:var(--campo-erro); border-color:var(--campo-erro); }
.mapa-evento .tipo { color:#718077; font:500 8px/1 var(--mono); letter-spacing:.1em; text-transform:uppercase; }
.mapa-evento strong { display:block; margin-top:8px; color:#e9efeb; font:500 13px/1.35 var(--sans); }
.mapa-evento p { margin-top:6px; color:#87958c; font:400 11px/1.45 var(--sans); }
.mapa-evento time { display:block; margin-top:9px; color:#65736a; font:400 8px/1 var(--mono); }
.mapa-ver-todas { flex:none; display:flex; align-items:center; justify-content:space-between; min-height:56px; padding:0 24px; border:0; border-top:1px solid var(--campo-linha); background:none; color:#a7b2aa; cursor:pointer; font-size:11px; text-align:left; }
.mapa-ver-todas:hover { color:#eef3ef; }
.mapa-ver-todas span { color:var(--campo-sinal); font-size:16px; }

.mapa-vazio { position:absolute; inset:0; z-index:8; display:flex; align-items:center; justify-content:flex-start; padding:clamp(24px,6vw,76px); pointer-events:none; }
.mapa-vazio[hidden] { display:none; }
.mapa-vazio-card{width:min(390px,46%);padding:30px;border:1px solid rgba(108,234,169,.22);border-radius:22px;background:rgba(8,14,11,.86);box-shadow:0 34px 90px -40px #000;backdrop-filter:blur(18px);pointer-events:auto;text-align:left}
.mapa-vazio-k{display:flex;align-items:center;gap:9px;color:#5ee29c;font:500 9px/1 var(--mono);letter-spacing:.12em}.mapa-vazio-k i{width:6px;height:6px;border-radius:50%;background:#42dd90;box-shadow:0 0 0 7px rgba(66,221,144,.09)}
.mapa-vazio strong{display:block;margin-top:22px;font:500 clamp(2.1rem,4vw,4rem)/.92 var(--sans);letter-spacing:-.055em;color:#eef6f1}.mapa-vazio p{max-width:34ch;margin-top:18px;color:#95a69c;font:400 13px/1.65 var(--sans)}
.mapa-vazio button,.mapa-luna-activation button{min-height:45px;display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:24px;padding:0 16px;border:0;border-radius:12px;background:#eaf3ed;color:#0b1610;cursor:pointer;font:600 12px/1 var(--sans);transition:transform .18s var(--ease),box-shadow .18s var(--ease)}.mapa-vazio button:hover,.mapa-luna-activation button:hover{transform:translateY(-2px);box-shadow:0 15px 32px -18px #69d99f}.mapa-vazio button:active,.mapa-luna-activation button:active{transform:scale(.97);box-shadow:none}.mapa-vazio small{display:block;margin-top:12px;color:#6f8077;font:400 9px/1.45 var(--mono)}
.mapa-shell.is-empty .mapa-fluxo,.mapa-shell.is-empty .mapa-analise,.mapa-shell.is-empty .mapa-comparar{display:none}.mapa-shell.is-empty .mapa-cockpit{grid-template-columns:1fr}.mapa-shell.is-empty .mapa-palco{min-height:650px}.mapa-shell.is-empty .mapa-nucleo{opacity:.92}.mapa-shell.is-empty .mapa-cabeca h2{font-size:clamp(1.6rem,2.4vw,2.4rem);line-height:1.02;letter-spacing:-.025em}
.mapa-luna-activation{position:absolute;right:34px;bottom:32px;z-index:10;width:min(330px,38%);padding:24px;border:1px solid rgba(74,219,144,.28);border-radius:18px;background:rgba(11,19,15,.9);box-shadow:0 26px 70px -38px #000;backdrop-filter:blur(18px)}.mapa-luna-activation[hidden]{display:none}.mapa-luna-activation>span{display:flex;gap:8px;align-items:center;color:#52dc94;font:500 8px/1 var(--mono);letter-spacing:.12em}.mapa-luna-activation>span i{width:6px;height:6px;border-radius:50%;background:#52dc94;box-shadow:0 0 16px #52dc94}.mapa-luna-activation strong{display:block;margin-top:15px;color:#edf5f0;font:600 20px/1.1 var(--sans)}.mapa-luna-activation p{margin-top:9px;color:#8fa096;font:400 11px/1.55 var(--sans)}.mapa-luna-activation button{width:100%;margin-top:18px}
.mapa-no-chegada{animation:mapaPlanetaChega 1.35s cubic-bezier(.16,1,.3,1) both!important}.mapa-chegada .mapa-conexoes .fluxo{stroke-dasharray:700;animation:mapaRotaChega 1.6s .45s var(--ease) both!important}@keyframes mapaPlanetaChega{0%{opacity:0;transform:translate(-50%,-50%) scale(.16) rotate(-18deg);filter:blur(10px)}65%{opacity:1;transform:translate(-50%,-50%) scale(1.08) rotate(2deg);filter:blur(0)}100%{transform:translate(-50%,-50%) scale(1)}}@keyframes mapaRotaChega{from{stroke-dashoffset:700}to{stroke-dashoffset:0}}
@media(max-width:720px){.mapa-vazio{align-items:flex-end;padding:18px}.mapa-vazio-card{width:100%}.mapa-luna-activation{right:16px;bottom:16px;width:calc(100% - 32px)}}

/* Detalhe da loja: entra como segunda escala do mapa, não como modal solto. */
.mapa-detalhe { position:fixed; z-index:30; right:0; top:var(--topo); bottom:0; width:min(760px,calc(100vw - var(--nav))); background:#101612; color:#edf3ef; border-left:1px solid rgba(183,205,189,.17); transform:translateX(102%); visibility:hidden; box-shadow:-28px 0 70px -48px #000; transition:transform 560ms var(--ease),visibility 0s linear 560ms; display:flex; flex-direction:column; }
.mapa-detalhe.aberto { transform:none; visibility:visible; transition:transform 560ms var(--ease),visibility 0s; }
.mapa-detalhe-topo { display:grid; grid-template-columns:42px minmax(0,1fr) auto; align-items:center; gap:14px; padding:22px 24px; border-bottom:1px solid var(--campo-linha); }
.mapa-voltar { width:38px; height:38px; border:1px solid var(--campo-linha); border-radius:50%; background:none; color:#dfe7e1; cursor:pointer; }
.mapa-voltar:hover { border-color:var(--campo-sinal); }
.mapa-detalhe-topo span { color:#5fd398; font:500 8px/1 var(--mono); letter-spacing:.12em; }
.mapa-detalhe-topo h2 { margin-top:5px; font:500 20px/1 var(--sans); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mapa-detalhe-topo p { margin-top:5px; color:#75847a; font:400 9px/1 var(--mono); }
.mapa-abrir-completo { border:1px solid var(--campo-linha); border-radius:999px; padding:10px 14px; background:none; color:#b3beb6; cursor:pointer; font-size:10px; }
.mapa-abrir-completo:hover { background:#edf3ef; color:#111712; }
.mapa-detalhe-abas { display:flex; gap:0; padding:0 24px; border-bottom:1px solid var(--campo-linha); overflow-x:auto; }
.mapa-detalhe-abas button { position:relative; flex:none; border:0; background:none; padding:17px 16px 15px; color:#7f8e84; cursor:pointer; font:500 10px/1 var(--mono); }
.mapa-detalhe-abas button::after { content:""; position:absolute; left:16px; right:16px; bottom:0; height:2px; transform:scaleX(0); background:var(--campo-sinal); transition:transform 180ms var(--ease); }
.mapa-detalhe-abas button.sel { color:#edf3ef; }
.mapa-detalhe-abas button.sel::after { transform:scaleX(1); }
.mapa-detalhe-corpo { flex:1; min-height:0; overflow-y:auto; padding:24px; }
.mapa-carregando { min-height:300px; display:grid; place-items:center; color:#829087; font-size:12px; }
.mapa-detalhe-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.mapa-bloco { border:1px solid var(--campo-linha); border-radius:14px; padding:18px; background:#131a15; }
.mapa-bloco.largo { grid-column:1/-1; }
.mapa-bloco .rot { color:#748279; font:500 8px/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; }
.mapa-bloco .valor { display:block; margin-top:13px; color:#f0f4f1; font:500 clamp(1.35rem,2vw,2rem)/1 var(--sans); letter-spacing:-.025em; }
.mapa-bloco .apoio { display:block; margin-top:7px; color:#7f8d84; font-size:10px; }
.mapa-bloco h3 { font:500 14px/1.2 var(--sans); }
.mapa-bloco p { margin-top:8px; color:#8d9b92; font-size:11px; line-height:1.55; }
.mapa-barra { height:4px; background:#273129; margin-top:14px; overflow:hidden; border-radius:9px; }
.mapa-barra i { display:block; width:var(--p,0%); height:100%; background:var(--campo-sinal); border-radius:9px; transition:width 720ms var(--ease); }
.mapa-pipeline { display:grid; grid-template-columns:repeat(4,1fr); margin-top:16px; border-top:1px solid var(--campo-linha); }
.mapa-etapa { position:relative; padding:16px 12px 8px 0; color:#748179; font:400 9px/1.3 var(--mono); }
.mapa-etapa::before { content:""; position:absolute; top:-4px; left:0; width:7px; height:7px; border-radius:50%; background:#445047; }
.mapa-etapa.ok { color:#cbd5ce; }
.mapa-etapa.ok::before { background:var(--campo-sinal); }
.mapa-etapa.roda::before { background:var(--campo-alerta); animation:campoPulso 1.7s infinite; }
.mapa-produtos-topo { display:flex; align-items:center; gap:10px; margin-bottom:16px; }
.mapa-busca { flex:1; min-width:0; padding:11px 13px; border:1px solid var(--campo-linha); border-radius:10px; background:#151d17; color:#eaf0eb; outline:none; }
.mapa-busca:focus { border-color:var(--campo-sinal); box-shadow:0 0 0 3px rgba(32,217,137,.08); }
.mapa-produtos { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.mapa-produto { overflow:hidden; border:1px solid var(--campo-linha); border-radius:12px; background:#131a15; }
.mapa-produto-img { aspect-ratio:1.2; background:#1b241d; display:grid; place-items:center; overflow:hidden; }
.mapa-produto-img img { width:100%; height:100%; object-fit:cover; }
.mapa-produto-img span { color:#627168; font-size:9px; }
.mapa-produto-corpo { padding:12px; }
.mapa-produto-corpo strong { display:block; min-height:2.6em; overflow:hidden; color:#e9efeb; font:500 11px/1.3 var(--sans); }
.mapa-produto-meta { display:flex; justify-content:space-between; gap:8px; margin-top:10px; color:#78867d; font:400 8px/1 var(--mono); }
.mapa-produto-status { color:#59ce94; }
.mapa-mais { width:100%; margin-top:14px; padding:12px; border:1px solid var(--campo-linha); border-radius:10px; background:none; color:#aab5ad; cursor:pointer; }
.mapa-mais:hover { border-color:var(--campo-sinal); color:#eef3ef; }
.mapa-estado-vazio { padding:48px 20px; text-align:center; color:#87948c; }
.mapa-estado-vazio strong { display:block; color:#e6ede8; font-size:14px; }
.mapa-estado-vazio span { display:block; margin-top:8px; font-size:11px; }

/* Uma linguagem compartilhada para as abas de precisão. */
.vista:not(.mapa-vista) { position:relative; isolation:isolate; }
.vista:not(.mapa-vista)::before { content:""; position:absolute; z-index:-1; width:min(48vw,560px); aspect-ratio:1; right:-11%; top:-170px; border-radius:50%; border:1px solid var(--linha); pointer-events:none; opacity:.55; }
.vista:not(.mapa-vista) > .secao h2::before,.vista:not(.mapa-vista) .colunas .secao h2::before { content:""; display:inline-block; width:6px; height:6px; margin-right:8px; border-radius:50%; border:1px solid var(--verde-vivo); vertical-align:1px; }
.vista:not(.mapa-vista) .cartao,.vista:not(.mapa-vista) .tabbox,.vista:not(.mapa-vista) .kpis { transition:border-color 160ms var(--ease),background-color 160ms var(--ease),transform 220ms var(--ease); }
.vista:not(.mapa-vista) .cartao:focus-within,.vista:not(.mapa-vista) .tabbox:focus-within { border-color:var(--borda-viva); }
.vista:not(.mapa-vista) .tab tbody tr { position:relative; }
.vista:not(.mapa-vista) .tab tbody tr:hover td:first-child { box-shadow:inset 2px 0 0 var(--verde-vivo); }
.vista:not(.mapa-vista) .seg button.sel { box-shadow:inset 0 -2px 0 var(--verde-vivo); }
.vista:not(.mapa-vista) .kpis { border-radius:14px; }
.vista:not(.mapa-vista) .kpi.heroi::before { width:1px; }
.vista[data-vista="luna"] iframe { border-radius:12px; }
.vista[data-vista="relatorios"] #relCorpo,.vista[data-vista="gerenciador"] #gerGrafico { position:relative; }
.vista[data-vista="dashboard"] .tabbox { overflow-x:auto; }

/* Primeiro acesso: uma central de ativação, com a mesma física do Campo Operacional. */
.pag:has(.onboard-vista.on) { padding:0 0 70px; }
.onboard-vista { --ob-verde:#20d989; --ob-campo:#0d120f; --ob-linha:rgba(200,224,208,.14); }
.onboard-vista::before { display:none; }
.ob-hero { position:relative; isolation:isolate; min-height:360px; overflow:hidden; display:grid; grid-template-columns:minmax(0,1fr) minmax(390px,.82fr); align-items:center; gap:50px; padding:clamp(38px,5vw,72px) clamp(28px,6vw,92px); background:var(--ob-campo); color:#edf3ef; border-bottom:1px solid var(--ob-linha); }
.ob-hero::before { content:""; position:absolute; z-index:-1; inset:-30%; opacity:.75; transform:rotate(-4deg); background:radial-gradient(circle at 20% 70%,rgba(32,217,137,.16) 0 1px,transparent 1.6px); background-size:153px 137px; }
.ob-hero::after { content:""; position:absolute; z-index:-1; width:54vw; height:54vw; max-width:790px; max-height:790px; right:-8%; top:50%; transform:translateY(-50%); border:1px solid rgba(32,217,137,.08); border-radius:50%; }
.ob-hero-copy { max-width:650px; }
.ob-sinal { display:flex; align-items:center; gap:10px; color:#75dba7; font:500 9px/1 var(--mono); letter-spacing:.13em; }
.ob-sinal i { width:7px; height:7px; border-radius:50%; background:var(--ob-verde); box-shadow:0 0 0 6px rgba(32,217,137,.10); animation:campoPulso 2.4s var(--ease-io) infinite; }
.ob-hero h2 { margin-top:24px; max-width:9ch; color:#f1f5f2; font:500 clamp(3.1rem,5.4vw,6rem)/.91 var(--sans); letter-spacing:-.04em; text-wrap:balance; }
.ob-hero-copy > p { max-width:61ch; margin-top:23px; color:#9daba2; font:400 clamp(.88rem,1.1vw,1rem)/1.65 var(--sans); }
.ob-meta { display:flex; flex-wrap:wrap; gap:18px; margin-top:25px; color:#738279; font:500 9px/1.2 var(--mono); }
.ob-meta span { display:flex; align-items:center; gap:7px; }
.ob-orbita { position:relative; justify-self:center; width:min(38vw,440px); aspect-ratio:1; }
.ob-anel { position:absolute; border:1px solid rgba(177,201,184,.15); border-radius:50%; }
.ob-anel.a1 { inset:3%; border-style:dashed; animation:campoGiro 70s linear infinite; }
.ob-anel.a2 { inset:18%; border-color:rgba(32,217,137,.21); }
.ob-anel.a3 { inset:32%; border-style:dotted; }
.ob-lua { position:absolute; width:34%; aspect-ratio:1; left:50%; top:50%; overflow:hidden; border-radius:50%; transform:translate(-50%,-50%); box-shadow:0 25px 55px -22px #000,0 0 0 12px rgba(32,217,137,.035); }
.ob-lua img { width:100%; height:100%; object-fit:cover; filter:grayscale(1) contrast(1.08) brightness(1.15); }
/* 7px a 3,25:1 era ilegível; #7A857E dá 4,8:1 sem mudar o matiz nem o tamanho */
.ob-orbita > b { position:absolute; left:50%; top:70%; transform:translateX(-50%); white-space:nowrap; color:#7A857E; font:500 7px/1 var(--mono); letter-spacing:.16em; }
.ob-satelite { position:absolute; display:flex; align-items:center; gap:7px; color:#8e9b92; font:500 8px/1 var(--mono); letter-spacing:.1em; }
.ob-satelite i { width:7px; height:7px; border-radius:50%; border:1px solid #6b796f; background:#151c17; }
.ob-satelite.shopify { left:1%; top:29%; }
.ob-satelite.luna { right:0; top:35%; flex-direction:row-reverse; }
.ob-satelite.dados { right:11%; bottom:13%; flex-direction:row-reverse; }
.ob-satelite.shopify i,.ob-satelite.luna i { border-color:var(--ob-verde); background:var(--ob-verde); box-shadow:0 0 0 5px rgba(32,217,137,.09); }

.ob-layout { width:min(1380px,100%); margin:0 auto; display:grid; grid-template-columns:300px minmax(0,1fr); gap:clamp(30px,4vw,64px); padding:clamp(30px,4vw,58px) clamp(20px,4vw,58px) 0; }
.ob-rail { position:sticky; top:20px; align-self:start; border-top:1px solid var(--borda); }
.ob-rail-topo { display:flex; justify-content:space-between; align-items:center; padding:19px 0 13px; color:var(--texto-3); font:500 8px/1 var(--mono); letter-spacing:.12em; }
.ob-rail-topo b { color:var(--texto); font-size:10px; letter-spacing:0; }
.ob-trilho { height:3px; overflow:hidden; background:var(--painel-3); }
.ob-trilho i { display:block; width:var(--p,0%); height:100%; background:var(--verde-vivo); transform-origin:left; transition:width 680ms var(--ease); }
.ob-navegacao { margin-top:18px; }
.ob-navegacao button { width:100%; min-height:66px; display:grid; grid-template-columns:30px minmax(0,1fr) auto; align-items:center; gap:12px; border:0; border-bottom:1px solid var(--borda); background:none; color:var(--texto-3); cursor:pointer; text-align:left; }
.ob-navegacao button > i { width:28px; height:28px; display:grid; place-items:center; border:1px solid var(--borda); border-radius:50%; color:var(--texto-3); font:500 9px/1 var(--mono); font-style:normal; }
.ob-navegacao button span { min-width:0; }
.ob-navegacao button span b { display:block; color:var(--texto-2); font:500 12px/1.15 var(--sans); }
.ob-navegacao button small { display:block; margin-top:5px; color:var(--texto-3); font:400 8px/1 var(--mono); }
.ob-navegacao button em { color:var(--texto-3); font:500 7px/1 var(--mono); font-style:normal; letter-spacing:.1em; }
.ob-navegacao button:hover span b,.ob-navegacao button.ativo span b { color:var(--texto); }
.ob-navegacao button.ativo > i { border-color:var(--verde-vivo); color:var(--verde-luz); box-shadow:0 0 0 5px var(--verde-veu); }
.ob-navegacao button.ativo em { color:var(--verde-luz); }
.ob-navegacao button.concluido > i { border-color:var(--verde-vivo); background:var(--verde-vivo); color:#0d120f; }
.ob-admin-link { min-height:52px; display:flex; justify-content:space-between; align-items:center; margin-top:22px; padding:0 15px; border:1px solid var(--borda); border-radius:12px; color:var(--texto-2); text-decoration:none; font-size:11px; }
.ob-admin-link:hover { border-color:var(--borda-viva); color:var(--texto); }
.ob-admin-link b { color:var(--verde-luz); font-size:15px; }
.ob-explorar { width:100%; padding:14px 0 4px; border:0; background:none; color:var(--texto-3); cursor:pointer; font-size:10px; }
.ob-explorar:hover { color:var(--texto-2); }

.ob-jornada { min-width:0; border-top:1px solid var(--borda); }
.ob-jornada-topo { min-height:98px; display:flex; align-items:center; justify-content:space-between; gap:30px; padding:16px 2px 19px; border-bottom:1px solid var(--borda); }
.ob-jornada-topo span { color:var(--verde-luz); font:500 8px/1 var(--mono); letter-spacing:.13em; }
.ob-jornada-topo h3 { margin-top:10px; color:var(--texto); font:500 clamp(1.45rem,2.4vw,2.15rem)/1.05 var(--sans); letter-spacing:-.025em; }
.ob-jornada-topo p { color:var(--texto-3); font-size:10px; }
.ob-domain-setup { display:grid; grid-template-columns:minmax(0,1fr) minmax(300px,.82fr); align-items:center; gap:30px; padding:22px 20px 23px; border-bottom:1px solid var(--borda); background:linear-gradient(105deg,var(--verde-veu),transparent 58%); }
.ob-domain-setup > div > span { color:var(--verde-luz); font:600 7px/1 var(--mono); letter-spacing:.14em; }
.ob-domain-setup > div > b { display:block; margin-top:8px; color:var(--texto); font:600 14px/1.2 var(--sans); }
.ob-domain-setup > div > p { max-width:50ch; margin-top:6px; color:var(--texto-3); font:400 10px/1.5 var(--sans); }
.ob-domain-setup .ob-campo > small.ok { color:var(--verde-luz); }
.ob-domain-setup .ob-campo > small.erro { color:var(--erro); }
.ob-etapa { border-bottom:1px solid var(--borda); transition:background-color 200ms var(--ease),border-color 200ms var(--ease); }
.ob-etapa.aberta { background:color-mix(in srgb,var(--painel-2) 70%,transparent); border-bottom-color:var(--borda-viva); }
.ob-etapa-cabeca { width:100%; min-height:91px; display:grid; grid-template-columns:42px minmax(0,1fr) auto 22px; align-items:center; gap:16px; padding:0 20px 0 4px; border:0; background:none; color:var(--texto); cursor:pointer; text-align:left; }
.ob-num { width:36px; height:36px; display:grid; place-items:center; border:1px solid var(--borda); border-radius:50%; color:var(--texto-3); font:500 10px/1 var(--mono); }
.ob-etapa-titulo small { display:block; color:var(--texto-3); font:500 7px/1 var(--mono); letter-spacing:.12em; }
.ob-etapa-titulo b { display:block; margin-top:7px; color:var(--texto); font:500 clamp(.94rem,1.4vw,1.08rem)/1.15 var(--sans); }
.ob-estado { padding:6px 8px; border:1px solid var(--borda); border-radius:999px; color:var(--texto-3); font:500 7px/1 var(--mono); letter-spacing:.08em; }
.ob-chevron { color:var(--texto-3); font-size:17px; transition:transform 220ms var(--ease); }
.ob-etapa.aberta .ob-chevron { transform:rotate(180deg); color:var(--verde-luz); }
.ob-etapa.aberta .ob-num { border-color:var(--verde-vivo); color:var(--verde-luz); box-shadow:0 0 0 5px var(--verde-veu); }
.ob-etapa.concluida .ob-num { border-color:var(--verde-vivo); background:var(--verde-vivo); color:#0d120f; }
.ob-etapa.concluida .ob-estado { border-color:transparent; background:var(--verde-veu); color:var(--verde-luz); }
.ob-etapa-corpo { display:none; padding:2px 20px 30px 62px; }
.ob-etapa.aberta .ob-etapa-corpo { display:block; animation:obRevela 420ms var(--ease) both; }
.ob-etapa-corpo > p { max-width:68ch; color:var(--texto-2); font:400 .8rem/1.65 var(--sans); }
.ob-etapa-corpo > p b { color:var(--texto); }
.ob-rota { display:flex; align-items:center; flex-wrap:wrap; gap:7px; margin-top:16px; }
.ob-rota span { padding:8px 10px; border:1px solid var(--borda); border-radius:9px; background:var(--painel); color:var(--texto-2); font:500 9px/1 var(--mono); }
.ob-rota i { color:var(--verde-luz); font-style:normal; }
.ob-instrucao,.ob-critico { display:flex; gap:14px; align-items:flex-start; max-width:760px; margin-top:20px; padding:17px 18px; border:1px solid var(--borda); border-radius:14px; background:var(--painel); }
.ob-icone,.ob-critico > span { flex:none; width:32px; height:32px; display:grid; place-items:center; border-radius:50%; background:#111713; color:#eef3ef; font:600 12px/1 var(--sans); }
.ob-icone.permissao { color:var(--verde-luz); }
.ob-instrucao b,.ob-critico b { display:block; color:var(--texto); font:600 12px/1.2 var(--sans); }
.ob-instrucao p,.ob-critico p { max-width:64ch; margin-top:6px; color:var(--texto-3); font:400 11px/1.55 var(--sans); }
.ob-critico { border-color:color-mix(in srgb,var(--ambar) 40%,var(--borda)); background:var(--ambar-veu); }
.ob-critico > span { border:1px solid color-mix(in srgb,var(--ambar) 58%,transparent); background:transparent; color:var(--ambar); }
.ob-acoes { display:flex; align-items:center; flex-wrap:wrap; gap:11px; margin-top:22px; }
.ob-marcar { min-height:38px; padding:0 14px; border:1px solid var(--borda); border-radius:10px; background:none; color:var(--texto-2); cursor:pointer; font-size:10px; }
.ob-marcar:hover { border-color:var(--verde-vivo); color:var(--texto); }
.ob-etapa.concluida .ob-marcar { color:var(--verde-luz); }

.ob-proxy-card { margin-top:20px; overflow:hidden; border:1px solid var(--borda); border-radius:15px; background:var(--painel); transition:border-color 220ms var(--ease),box-shadow 220ms var(--ease); }
.ob-proxy-card.pronto { border-color:color-mix(in srgb,var(--verde-vivo) 50%,var(--borda)); box-shadow:0 18px 44px -36px var(--verde-vivo); }
.ob-proxy-status { min-height:43px; display:flex; align-items:center; gap:9px; padding:0 15px; border-bottom:1px solid var(--borda); color:var(--texto-3); font:500 7px/1 var(--mono); letter-spacing:.1em; }
.ob-proxy-status i { width:7px; height:7px; border-radius:50%; background:var(--texto-3); }
.ob-proxy-card.pronto .ob-proxy-status i { background:var(--verde-vivo); box-shadow:0 0 0 5px var(--verde-veu); animation:campoPulso 2.4s var(--ease-io) infinite; }
.ob-proxy-status b { margin-left:auto; color:var(--texto-3); font:600 7px/1 var(--mono); letter-spacing:.08em; }
.ob-proxy-card.pronto .ob-proxy-status b { color:var(--verde-luz); }
.ob-proxy-values { display:grid; grid-template-columns:.7fr .9fr 2.3fr; }
.ob-proxy-values > div { min-width:0; padding:17px 16px; border-right:1px solid var(--borda); }
.ob-proxy-values > div:last-child { border-right:0; }
.ob-proxy-values span { display:block; color:var(--texto-3); font:500 8px/1 var(--mono); }
.ob-proxy-values code { display:block; min-height:15px; margin-top:9px; overflow:hidden; color:var(--texto); font:600 10px/1.4 var(--mono); text-overflow:ellipsis; white-space:nowrap; }
.ob-proxy-values button { margin-top:13px; padding:0; border:0; background:none; color:var(--verde-luz); cursor:pointer; font:600 7px/1 var(--mono); letter-spacing:.08em; }
.ob-proxy .ob-instrucao code { color:var(--texto-2); font-family:var(--mono); }

.ob-conectar .ob-etapa-corpo { padding-bottom:36px; }
.ob-conectar.conexao-pronta .ob-form,.ob-conectar.conexao-pronta .ob-conectar-rodape { display:none; }
.ob-form { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:21px; }
.ob-campo { min-width:0; }
.ob-campo > span:first-child { display:block; margin:0 0 8px 2px; color:var(--texto-2); font:500 9px/1 var(--mono); }
.ob-campo input { width:100%; height:47px; border:1px solid var(--borda); border-radius:11px; outline:none; background:var(--painel); color:var(--texto); padding:0 13px; font:400 11px/1 var(--mono); }
.ob-campo input::placeholder { color:var(--texto-3); }
.ob-campo input:focus { border-color:var(--verde-vivo); box-shadow:0 0 0 3px var(--verde-veu); }
.ob-campo > small { display:block; margin:7px 2px 0; color:var(--texto-3); font-size:9px; line-height:1.35; }
.ob-campo > small.ok { color:var(--verde-luz); }
.ob-campo > small.erro { color:var(--erro); }
.ob-input-wrap { position:relative; display:block; }
.ob-input-wrap input { padding-right:64px; }
.ob-input-wrap button { position:absolute; right:5px; top:5px; height:37px; padding:0 9px; border:0; border-radius:8px; background:var(--painel-2); color:var(--texto-3); cursor:pointer; font-size:9px; }
.ob-input-wrap button:hover { color:var(--texto); }
.ob-conectar-rodape { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:25px; padding-top:20px; border-top:1px solid var(--borda); }
.ob-conectar-rodape > div b { display:block; color:var(--texto); font:600 12px/1.2 var(--sans); }
/* `> div span` também alcançava o <span> dentro do botão «Ativar minha loja»
   (o .ob-botoes é irmão desta legenda): o rótulo do CTA principal saía cinza
   10px sobre o verde, 1,94:1 de contraste — ilegível na última etapa do
   cadastro. A legenda continua igual; o bloco dos botões fica de fora. */
.ob-conectar-rodape > div:not(.ob-botoes) span { display:block; margin-top:5px; color:var(--texto-3); font-size:10px; }
.ob-bt-conectar { min-width:188px; justify-content:space-between; }
.ob-bt-conectar i { font-style:normal; font-size:15px; }
.ob-bt-conectar:disabled { cursor:wait; opacity:.58; }
.ob-botoes { display:flex; align-items:center; gap:9px; }
.ob-bt-teste { min-height:39px; padding:0 15px; border:1px solid var(--borda-viva); border-radius:10px; background:var(--painel); color:var(--texto); cursor:pointer; font:600 10px/1 var(--sans); }
.ob-bt-teste:hover { border-color:var(--verde-vivo); }
.ob-bt-teste:disabled { cursor:wait; opacity:.58; }
.ob-diagnostico { margin-top:15px; padding:14px 16px; border:1px solid var(--borda-viva); border-radius:14px; background:var(--painel); }
.ob-diagnostico > span { display:block; margin-bottom:10px; color:var(--verde-luz); font:600 8px/1 var(--mono); letter-spacing:.11em; }
.ob-diagnostico b { display:flex; align-items:center; gap:9px; min-height:28px; color:var(--texto-2); font:500 10px/1.35 var(--sans); }
.ob-diagnostico b i { width:18px; height:18px; display:grid; place-items:center; flex:none; border-radius:50%; background:var(--verde-veu); color:var(--verde-luz); font:600 9px/1 var(--sans); font-style:normal; }
.ob-diagnostico b.falha { color:var(--erro); }
.ob-diagnostico b.falha i { background:var(--erro-veu); color:var(--erro); }
.ob-diagnostico > small { display:block; margin-top:9px; color:var(--texto-3); font:400 9px/1.45 var(--sans); }
.gi-msg { min-height:18px; margin-top:12px!important; color:var(--texto-3)!important; font-size:.75rem!important; }
.gi-msg.erro { color:var(--erro)!important; }
.gi-msg.ok { color:var(--verde-luz)!important; }
.gi-pronto { margin-top:20px; padding:0; overflow:hidden; border:1px solid var(--verde-vivo); border-radius:14px; background:var(--verde-veu); }
.ob-sucesso-topo { display:flex; align-items:center; justify-content:space-between; gap:18px; padding:19px 20px; border-bottom:1px solid color-mix(in srgb,var(--verde-vivo) 34%,transparent); }
.ob-sucesso-topo span { color:var(--verde-luz); font:500 8px/1 var(--mono); letter-spacing:.13em; }
.ob-sucesso-topo b { display:block; margin-top:7px; color:var(--texto); font:600 17px/1.15 var(--sans); }
.ob-sucesso-topo i { width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:var(--verde-vivo); color:#0d120f; font-style:normal; }
.ob-sucesso-corpo { padding:18px 20px 20px; }
.ob-credencial { min-height:43px; display:grid; grid-template-columns:126px minmax(0,1fr) auto; align-items:center; gap:12px; border-bottom:1px solid var(--borda); }
.ob-credencial > span { color:var(--texto-3); font-size:9px; }
.ob-credencial code,.ob-credencial a { min-width:0; overflow:hidden; text-overflow:ellipsis; color:var(--texto); font:500 10px/1 var(--mono); white-space:nowrap; text-decoration:none; }
.ob-credencial a:hover { color:var(--verde-luz); text-decoration:underline; text-underline-offset:3px; }
.ob-copiar { border:0; background:none; color:var(--verde-luz); cursor:pointer; font:500 8px/1 var(--mono); }
.ob-sucesso-acoes { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:18px; }
.ob-sucesso-acoes > span { color:var(--texto-3); font-size:10px; }
.ob-checklist-final { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-bottom:13px; }
.ob-checklist-final > span { min-width:0; padding:13px 12px; border:1px solid var(--borda); border-radius:11px; background:var(--painel); }
.ob-checklist-final i { width:19px; height:19px; display:grid; place-items:center; border-radius:50%; background:var(--verde-veu); color:var(--verde-luz); font:600 9px/1 var(--sans); font-style:normal; }
.ob-checklist-final b { display:block; margin-top:10px; color:var(--texto); font:600 10px/1.2 var(--sans); }
.ob-checklist-final small { display:block; margin-top:5px; color:var(--texto-3); font:400 8px/1.35 var(--sans); }
.ob-tema-final { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:15px 0; padding:16px; border:1px solid var(--borda); border-radius:14px; background:var(--painel); }
.ob-tema-final span,.ob-tour-final header span { color:var(--verde-luz); font:600 7px/1 var(--mono); letter-spacing:.12em; }
.ob-tema-final b { display:block; margin-top:7px; color:var(--texto); font:600 11px/1.2 var(--sans); }
.ob-tema-final p { max-width:58ch; margin-top:5px; color:var(--texto-3); font:400 9px/1.45 var(--sans); }
.ob-tema-final a { flex:none; padding:11px 13px; border:1px solid var(--borda-viva); border-radius:10px; color:var(--texto); text-decoration:none; font:600 9px/1 var(--sans); }
.ob-tema-final a:hover { border-color:var(--verde-vivo); color:var(--verde-luz); }
.ob-tour-final { margin-top:15px; overflow:hidden; border-top:1px solid var(--borda-viva); border-bottom:1px solid var(--borda); }
.ob-tour-final[hidden] { display:none; }
.ob-tour-final header { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:15px 2px; }
.ob-tour-final header b { display:block; margin-top:7px; color:var(--texto); font:600 12px/1.2 var(--sans); }
.ob-tour-final header button,.ob-rever-tour { border:0; background:none; color:var(--texto-3); cursor:pointer; font:500 9px/1 var(--sans); }
.ob-tour-final header button:hover,.ob-rever-tour:hover { color:var(--verde-luz); }
.ob-tour-final > div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
.ob-tour-final > div > button { min-width:0; min-height:76px; display:grid; grid-template-columns:25px minmax(0,1fr) auto; align-items:center; gap:10px; padding:11px 12px; border:0; border-top:1px solid var(--borda); border-right:1px solid var(--borda); background:none; color:var(--texto); cursor:pointer; text-align:left; }
.ob-tour-final > div > button:last-child { border-right:0; }
.ob-tour-final > div > button:hover { background:var(--verde-veu); }
.ob-tour-final > div i { width:23px; height:23px; display:grid; place-items:center; border:1px solid var(--borda-viva); border-radius:50%; color:var(--verde-luz); font:500 8px/1 var(--mono); font-style:normal; }
.ob-tour-final > div b { display:block; font:600 10px/1.2 var(--sans); }
.ob-tour-final > div small { display:block; margin-top:4px; color:var(--texto-3); font:400 8px/1.35 var(--sans); }
.ob-tour-final > div em { color:var(--verde-luz); font:600 7px/1 var(--mono); font-style:normal; }
.ob-tour-flutuante { position:fixed; z-index:1200; right:24px; bottom:24px; width:min(390px,calc(100vw - 32px)); overflow:hidden; border:1px solid var(--borda-viva); border-radius:16px; background:var(--painel); box-shadow:0 28px 70px -30px rgba(0,0,0,.72); animation:obRevela 360ms var(--ease) both; }
.ob-tour-flutuante header { display:flex; align-items:center; justify-content:space-between; padding:17px 18px; border-bottom:1px solid var(--borda); }
.ob-tour-flutuante header span { color:var(--verde-luz); font:600 7px/1 var(--mono); letter-spacing:.12em; }
.ob-tour-flutuante header b { display:block; margin-top:7px; color:var(--texto); font:600 13px/1.2 var(--sans); }
.ob-tour-flutuante header button { width:30px; height:30px; border:1px solid var(--borda); border-radius:50%; background:none; color:var(--texto-2); cursor:pointer; font-size:18px; }
.ob-tour-flutuante > div > button { width:100%; min-height:60px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 12px; align-items:center; padding:11px 18px; border:0; border-bottom:1px solid var(--borda); background:none; color:var(--texto); cursor:pointer; text-align:left; }
.ob-tour-flutuante > div > button:last-child { border-bottom:0; }
.ob-tour-flutuante > div > button:hover { background:var(--verde-veu); }
.ob-tour-flutuante b { font:600 11px/1.2 var(--sans); }
.ob-tour-flutuante small { color:var(--texto-3); font:400 9px/1.3 var(--sans); }
.ob-tour-flutuante em { grid-column:2; grid-row:1/3; color:var(--verde-luz); font:600 7px/1 var(--mono); font-style:normal; }
.onboarding-obrigatorio .ob-explorar{display:none}
.onboarding-obrigatorio #navInstalar{pointer-events:none}
.onboarding-obrigatorio #navInstalar::after{content:"OBRIGATÓRIO";margin-left:auto;color:var(--verde-vivo);font:600 7px/1 var(--mono);letter-spacing:.08em}

@keyframes obRevela { from{opacity:.72;transform:translateY(-7px);filter:blur(3px)} to{opacity:1;transform:none;filter:none} }
.cli-bem-vindo { display:flex; align-items:center; justify-content:space-between; gap:22px; padding:18px 20px; background:var(--verde-veu); }
.cli-bem-vindo .cc-k { color:var(--verde-luz); font:600 8px/1 var(--mono); letter-spacing:.12em; }
.cli-bem-vindo h3 { margin-top:7px; font:600 15px/1.2 var(--sans); }
.cli-bem-vindo p { max-width:68ch; margin-top:7px; white-space:pre-wrap; color:var(--texto-2); font-size:11px; line-height:1.5; }

@keyframes campoPulso { 0%,100%{opacity:1;transform:scale(1)} 50%{opacity:.45;transform:scale(.75)} }
@keyframes campoGiro { to{transform:rotate(360deg)} }
@keyframes campoSinal { to{stroke-dashoffset:-180} }
@keyframes campoCarrega { to{transform:translateX(110%)} }

@media (max-width:1180px) {
  .mapa-corpo { grid-template-columns:minmax(0,1fr) 290px; }
  .mapa-palco { min-height:600px; }
  .mapa-no { width:178px; }
}

@media (max-width:980px) {
  .mapa-cabeca { align-items:flex-start; }
  .mapa-cabeca h2 { font-size:clamp(2rem,6vw,3.5rem); }
  .mapa-metricas { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mapa-metrica:nth-child(2) { border-right:0; }
  .mapa-metrica:nth-child(-n+2) { border-bottom:1px solid var(--campo-linha); }
  .mapa-corpo { display:block; }
  .mapa-palco { border-right:0; min-height:600px; }
  .mapa-fluxo { border-top:1px solid var(--campo-linha); }
  .mapa-eventos { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mapa-evento { border-right:1px solid var(--campo-linha); }
  .mapa-detalhe { width:calc(100vw - var(--nav)); }
  .ob-hero { grid-template-columns:minmax(0,1fr) 300px; gap:22px; }
  .ob-orbita { width:300px; }
  .ob-layout { grid-template-columns:240px minmax(0,1fr); gap:28px; }
  .ob-domain-setup { grid-template-columns:1fr; gap:16px; }
  .ob-proxy-values { grid-template-columns:1fr 1fr; }
  .ob-proxy-values > div:nth-child(2) { border-right:0; }
  .ob-proxy-values > .url { grid-column:1/-1; border-top:1px solid var(--borda); }
  .ob-form { grid-template-columns:1fr; }
  .ob-conectar-rodape { align-items:flex-start; flex-direction:column; }
  .ob-botoes { width:100%; }
  .ob-botoes > * { flex:1; }
  .ob-tour-final > div { grid-template-columns:1fr; }
  .ob-tour-final > div > button { border-right:0; }
}

@media (max-width:760px) {
  .pag:has(.mapa-vista.on) { padding-bottom:72px; }
  .mapa-shell { min-height:auto; }
  .mapa-cabeca { display:block; padding:24px 18px 18px; }
  .mapa-cabeca h2 { margin-top:13px; font-size:2.55rem; }
  .mapa-cabeca p { font-size:12px; }
  .mapa-controles { display:none; }
  .mapa-metrica { min-height:88px; padding:17px 16px; }
  .mapa-metrica strong { font-size:1.3rem; }
  .mapa-palco { min-height:auto; padding:0 16px 20px; }
  .mapa-conexoes,.mapa-aneis,.mapa-nucleo,.mapa-nos { display:none; }
  .mapa-lista { position:relative; inset:auto; opacity:1; visibility:visible; transform:none; border-top:0; }
  .mapa-lista-linha { grid-template-columns:minmax(0,1fr) 88px 22px; gap:10px; min-height:76px; }
  .mapa-lista-linha > span:nth-of-type(2),.mapa-lista-linha > span:nth-of-type(3) { display:none; }
  .mapa-lista-linha > span:nth-of-type(4) { display:block; }
  .mapa-eventos { grid-template-columns:1fr; }
  .mapa-evento { border-right:0; }
  .mapa-detalhe { width:100vw; top:var(--topo); bottom:49px; z-index:80; border-left:0; }
  .mapa-detalhe-topo { grid-template-columns:38px minmax(0,1fr); padding:18px 16px; }
  .mapa-abrir-completo { grid-column:2; justify-self:start; margin-top:2px; }
  .mapa-detalhe-abas { padding-inline:8px; }
  .mapa-detalhe-corpo { padding:16px; }
  .mapa-detalhe-grid { grid-template-columns:1fr 1fr; }
  .mapa-produtos { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .mapa-pipeline { grid-template-columns:repeat(2,1fr); }
  .pag:has(.onboard-vista.on) { padding:0 0 82px; }
  .ob-hero { min-height:auto; grid-template-columns:1fr; gap:18px; padding:34px 20px 29px; }
  .ob-hero h2 { font-size:3.25rem; }
  .ob-hero-copy > p { font-size:12px; }
  .ob-orbita { position:absolute; width:260px; right:-92px; top:12px; opacity:.42; }
  .ob-layout { display:block; padding:25px 16px 0; }
  .ob-rail { position:relative; top:auto; }
  .ob-navegacao { display:grid; grid-template-columns:repeat(5,1fr); gap:0; border-bottom:1px solid var(--borda); }
  .ob-navegacao button { display:flex; min-height:62px; justify-content:center; border-bottom:0; }
  .ob-navegacao button span,.ob-navegacao button em { display:none; }
  .ob-admin-link { margin-top:16px; }
  .ob-explorar { margin-bottom:21px; }
  .ob-jornada-topo { min-height:88px; }
  .ob-jornada-topo p { display:none; }
  .ob-domain-setup { margin:0 -8px; padding:20px 14px; }
  .ob-etapa-cabeca { grid-template-columns:38px minmax(0,1fr) auto 18px; gap:12px; min-height:82px; padding-right:8px; }
  .ob-etapa-corpo { padding:0 8px 27px 50px; }
  .ob-rota { align-items:stretch; flex-direction:column; }
  .ob-rota i { align-self:center; transform:rotate(90deg); }
  .ob-rota span { text-align:center; padding:10px; }
  .ob-conectar-rodape { align-items:flex-start; flex-direction:column; }
  .ob-bt-conectar { width:100%; }
  .ob-proxy-values { grid-template-columns:1fr; }
  .ob-proxy-values > div,.ob-proxy-values > div:nth-child(2) { border-right:0; border-bottom:1px solid var(--borda); }
  .ob-proxy-values > .url { grid-column:auto; border-top:0; }
  .ob-checklist-final { grid-template-columns:1fr; }
  .ob-credencial { grid-template-columns:94px minmax(0,1fr) auto; }
  .cli-bem-vindo { align-items:flex-start; flex-direction:column; }
}

@media (max-width:430px) {
  .mapa-cabeca h2 { font-size:2.2rem; }
  .mapa-metricas { grid-template-columns:1fr 1fr; }
  .mapa-metrica { min-height:83px; padding:15px 13px; }
  .mapa-metrica .pe { display:none; }
  .mapa-metrica strong { font-size:1.12rem; }
  .mapa-detalhe-grid { grid-template-columns:1fr; }
  .mapa-bloco.largo { grid-column:auto; }
  .mapa-produtos { grid-template-columns:1fr 1fr; }
  .ob-hero h2 { font-size:2.75rem; }
  .ob-meta { display:block; }
  .ob-meta span + span { margin-top:9px; }
  .ob-estado { display:none; }
  .ob-etapa-cabeca { grid-template-columns:36px minmax(0,1fr) 18px; }
  .ob-etapa-corpo { padding-left:0; }
  .ob-instrucao,.ob-critico { padding:15px; }
  .ob-credencial { grid-template-columns:1fr auto; padding:9px 0; }
  .ob-credencial > span { grid-column:1/-1; }
}

@media (prefers-reduced-motion:reduce) {
  /* Quatro animacoes deste ficheiro corriam sob movimento reduzido e nao estavam nesta lista.
     Medido no browser, com este CSS, montando cada selector no contexto que ele exige:
       .mapa-no-chegada                      mapaPlanetaChega 1.35s x1
       .mapa-chegada .mapa-conexoes .fluxo   mapaRotaChega    1.6s  x1
       .mapa-etapa.roda::before              campoPulso       1.7s  x INFINITE
       .ob-tour-flutuante                    obRevela         0.36s x1
     A terceira e um quase-acerto de copiar-colar: a lista ja tinha `.mapa-no.roda::before`
     e a regra animada e `.mapa-etapa.roda::before` — outro elemento, um caracter de diferenca,
     e um pulso INFINITO a correr para quem pediu para nao ver nada mexer.
     Censo por EFEITO no browser, nao por presenca do @media: um guarda pode existir e nao
     pegar. Ver `aceite-campo-operacional-movimento-reduzido.js`, que traz tambem a contraprova
     de que SEM movimento reduzido as quatro continuam vivas. */
  .mapa-estado i,.mapa-aneis i,.mapa-nucleo::after,.mapa-conexoes path.viva,.mapa-no.roda::before,.mapa-metrica.skeleton::after,.mapa-evento.skeleton::after,.ob-sinal i,.ob-anel.a1,.ob-etapa.aberta .ob-etapa-corpo,
  .mapa-no-chegada,.mapa-chegada .mapa-conexoes .fluxo,.mapa-etapa.roda::before,.ob-tour-flutuante { animation:none !important; }
  .mapa-detalhe,.mapa-no,.mapa-barra i,.mapa-lista,.ob-trilho i,.ob-chevron { transition-duration:.01ms !important; }
}

/* Aviso da vista (Órbita) — «os números não são de agora». Nasce do JS porque o `index.html` não é
   meu hoje; o nó entra ANTES da grelha de métricas para não virar uma 5.ª célula. Discreto por
   desenho: não é erro do operador, é estado da leitura — e tem de se ler sem tapar o número. */
.mapa-aviso { margin:0; padding:10px clamp(18px,2.4vw,34px); border-block:1px solid var(--campo-linha);
  background:rgba(213,162,26,.07); color:#d8c48a; font:400 11px/1.5 var(--sans); }