/* ===== v4 · Vidro neutro (iOS) — Etapa 1 (21/10/2026) =====
   Substitui o vidro arroxeado das janelas por vidro fosco neutro e translúcido,
   para as animações dos personagens aparecerem atrás. Carregado depois do <style>
   principal, então prevalece sobre o bloco "v3 · Glass". */
:root{
  --v-tint:linear-gradient(160deg,rgba(255,255,255,.13),rgba(255,255,255,.04) 55%,rgba(255,255,255,.07));
  --v-base:rgba(12,11,20,.24);          /* base escura mínima: mantém o texto branco legível */
  --v-blur:blur(18px) saturate(135%);
  --v-line:rgba(255,255,255,.24);
  --v-hi:inset 0 1px 0 rgba(255,255,255,.30),inset 0 0 0 1px rgba(255,255,255,.04);
  --v-card:rgba(255,255,255,.08);
  --v-card-line:rgba(255,255,255,.14);
}
#ov{background:rgba(6,4,18,.06)}
.pn,.md2 .bx{
  background:var(--v-tint),var(--v-base);
  -webkit-backdrop-filter:var(--v-blur);backdrop-filter:var(--v-blur);
  border:1px solid var(--v-line);
  box-shadow:var(--v-hi),0 24px 70px rgba(0,0,0,.32);
  text-shadow:0 1px 2px rgba(0,0,0,.28);
}
.md2{background:rgba(6,4,18,.08)}
/* cartões internos: vidro neutro um pouco mais denso que a janela */
.kc,.pc,.det,.col,.dy,.olf,.tb{background:var(--v-card);border-color:var(--v-card-line)}
.ol{background:rgba(255,255,255,.03);border-color:var(--v-line)}
.ml.on{background:rgba(255,255,255,.14);border-left:3px solid #A0F578}
.x,.tab{background:rgba(255,255,255,.10);border-color:var(--v-line)}
.fm input,.fm select,.fm textarea,.md2 input,.md2 textarea,.md2 select{background:rgba(255,255,255,.10);border-color:var(--v-line);color:#fff}
.fm select option,.md2 select option{color:#110939}
/* navegador sem desfoque: vidro mais opaco para não perder leitura */
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))){
  .pn,.md2 .bx{background:rgba(22,20,34,.88)}
}

/* ===== Estrela NORTHEA 3D sobre cada personagem (no lugar da lâmpada) =====
   Gema mint #A0F578 na forma da estrela do logo, girando como o plumbob do The Sims.
   A posição é aplicada por js/equipe.js a cada quadro, seguindo a cabeça no vídeo. */
.lamp{position:absolute;left:0;top:0;width:var(--tam,24px);height:var(--tam,24px);margin:calc(var(--tam,24px)/-2) 0 0 calc(var(--tam,24px)/-2);
  padding:0;border:0;background:none;cursor:pointer;z-index:6;will-change:transform}
.lamp::before{content:"";position:absolute;inset:-10px}           /* área de toque maior */
.lamp .gema{position:absolute;inset:0;background:url(../assets/estrela_sprite.webp) 0 0/600% 600% no-repeat;
  filter:drop-shadow(0 0 .8px rgba(22,10,58,.95)) drop-shadow(0 0 .8px rgba(22,10,58,.95)) drop-shadow(0 0 5px rgba(160,245,120,.8)) drop-shadow(0 2px 5px rgba(0,0,0,.4));   /* contorno escuro: aparece até sobre o verde do telão */transition:transform .2s}
.lamp .brilho{position:absolute;left:50%;top:50%;width:170%;height:170%;transform:translate(-50%,-50%);border-radius:50%;
  background:radial-gradient(circle,rgba(160,245,120,.38),rgba(160,245,120,0) 65%);pointer-events:none}
@media (prefers-reduced-motion:no-preference){
  .lamp .brilho{animation:estrelaPulso 2.6s ease-in-out infinite}
  .lamp:hover .gema{transform:scale(1.18)}
}
@keyframes estrelaPulso{0%,100%{opacity:.5}50%{opacity:1}}
.lamp:focus-visible{outline:2px solid #A0F578;outline-offset:4px;border-radius:8px}
.lamp .tip{position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%);white-space:nowrap;background:rgba(17,9,57,.85);
  border:1px solid rgba(160,245,120,.7);color:#fff;font:600 11px Poppins,Arial;padding:4px 9px;border-radius:999px;opacity:0;transition:opacity .2s;pointer-events:none}
.lamp:hover .tip,.lamp:focus-visible .tip{opacity:1}

/* ===== Ficha do funcionário (lida do Supabase) ===== */
.fx{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:18px;align-items:start}
@media (max-width:900px){.fx{grid-template-columns:minmax(0,1fr)}}
.fx-h{display:flex;gap:16px;align-items:center;margin-bottom:14px}
.fx-av{position:relative;width:84px;height:84px;flex:none}
.fx-av img,.fx-av .ph{width:84px;height:84px;border-radius:50%;object-fit:cover;display:block;box-shadow:0 0 0 3px rgba(255,255,255,.85),0 6px 18px rgba(0,0,0,.3);background:rgba(255,255,255,.12)}
.fx-av .ph{display:grid;place-items:center;font:700 28px Poppins,Arial}
.fx-av label{position:absolute;right:-4px;bottom:-4px;width:30px;height:30px;border-radius:50%;background:#6A41D8;border:2px solid #fff;display:grid;place-items:center;cursor:pointer;font-size:14px}
.fx-av input{display:none}
.fx-t b{font:800 22px Poppins,Arial;display:block}
.fx-t .cg{font:700 11px Poppins,Arial;letter-spacing:.12em;text-transform:uppercase;color:#C9B8FF}
.fx-t .mt{opacity:.8;font-size:13px}
.fx .bx2{background:var(--v-card);border:1px solid var(--v-card-line);border-radius:18px;padding:14px 16px;margin-bottom:12px}
.fx h4{font:700 11px Poppins,Arial;letter-spacing:.14em;text-transform:uppercase;opacity:.75;margin:0 0 8px}
.fx label.l{display:block;font-size:12px;opacity:.8;margin:8px 0 4px}
.fx input[type=text],.fx input[type=url],.fx textarea,.fx select{width:100%;background:rgba(255,255,255,.10);border:1px solid var(--v-line);border-radius:12px;color:#fff;font:14px Montserrat,Arial;padding:9px 12px}
.fx textarea{resize:vertical;min-height:84px}
.fx select option{color:#110939}
.fx ul{margin:0;padding-left:18px;display:grid;gap:4px;font-size:14px}
.fx .seg2{display:inline-flex;gap:4px;background:rgba(255,255,255,.08);border:1px solid var(--v-line);border-radius:999px;padding:3px;margin-bottom:8px}
.fx .seg2 button{border:0;background:none;color:#fff;font:600 13px Poppins,Arial;padding:6px 14px;border-radius:999px;cursor:pointer;opacity:.75}
.fx .seg2 button.on{background:rgba(160,245,120,.22);opacity:1;box-shadow:inset 0 0 0 1px rgba(160,245,120,.7)}
.fx .acts2{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.fx .mud{border-top:1px solid rgba(255,255,255,.10);padding:8px 0;font-size:13px}
.fx .mud:first-child{border-top:0}
.fx .mud .st{font:700 10.5px Poppins,Arial;letter-spacing:.06em;text-transform:uppercase;padding:2px 8px;border-radius:999px;margin-right:6px}
.fx .mud .st.p{background:rgba(255,214,90,.2);color:#FFE38A}.fx .mud .st.a{background:rgba(160,245,120,.2);color:#C9FFB0}
.fx details{margin-top:4px}.fx summary{cursor:pointer;font-weight:600}
.fx pre{white-space:pre-wrap;font:12.5px/1.5 ui-monospace,Menlo,Consolas,monospace;max-height:340px;overflow:auto;background:rgba(0,0,0,.18);border-radius:12px;padding:12px;margin:8px 0 0}
.fx .nota{font-size:12px;opacity:.75;margin-top:6px}
.fx .err{color:#FFB4A8}

/* Etapa 3 · selo do Supabase e resultado entregue pelo bot */
#live.off i{background:#e5a24a!important;box-shadow:0 0 8px #e5a24a!important}
#live.off{cursor:pointer}
.res{margin-top:6px;padding:6px 8px;border-radius:8px;background:rgba(120,220,190,.10);border:1px solid rgba(120,220,190,.28);font-size:12px;line-height:1.4}
.res b{font-weight:600;margin-right:4px;color:#8fe3c9}
.res a{color:#8fe3c9;text-decoration:underline}

/* ===== Central de inteligência: anexos, análise da Ana e decisão ===== */
.fx .anx-add{display:inline-flex;align-items:center;gap:6px;cursor:pointer;font:600 12.5px Poppins,Arial;padding:6px 12px;border-radius:999px;
  border:1px dashed rgba(160,245,120,.6);color:#C9FFB0;margin-top:2px}
.fx .anx-add input{display:none}
.fx .anx{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.fx .anx .ch{display:inline-flex;align-items:center;gap:6px;font-size:12px;padding:4px 10px;border-radius:999px;background:rgba(255,255,255,.08);
  border:1px solid var(--v-line);color:#fff;text-decoration:none;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fx .anx .ch button{border:0;background:none;color:#fff;opacity:.7;cursor:pointer;font-size:14px;padding:0 0 0 2px}
.fx .ana{margin-top:8px;padding:10px 12px;border-radius:12px;background:rgba(136,95,250,.14);border:1px solid rgba(136,95,250,.35);font-size:12.5px;line-height:1.45}
.fx .ana>div{margin-top:4px}
.fx .ana-h{font:700 11px Poppins,Arial;letter-spacing:.05em;text-transform:uppercase;opacity:.9}
.fx .ana pre{max-height:220px;overflow:auto}
.fx .mud .st.n{background:rgba(136,95,250,.28);color:#E2D6FF}.fx .mud .st.r{background:rgba(255,120,100,.2);color:#FFC2B6}
.fx .ana .st.a{background:rgba(160,245,120,.2);color:#C9FFB0}.fx .ana .st.n{background:rgba(255,214,90,.2);color:#FFE38A}.fx .ana .st.r{background:rgba(255,120,100,.2);color:#FFC2B6}
.fx .dec textarea{width:100%;margin-top:8px}
.fx .btn.off{opacity:.55;pointer-events:none}