/* Identidade do login de referência: névoa inferior preservada, abertura nova sem espera de API. */
body.sem-conta .topo,body.sem-conta #cristais,body.sem-conta #rotulos,body.sem-conta #guias{visibility:hidden}
body.sem-conta #ceu{visibility:hidden}
#entrar-conta,:root[data-tema="claro"] #entrar-conta{background:#080817;color:#eeeafb;backdrop-filter:none;-webkit-backdrop-filter:none;overflow-y:auto;overflow-x:hidden;padding:28px 20px;isolation:isolate}
.login-estrelas{position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 50% 25%,#29204b66,transparent 64%),radial-gradient(ellipse at 50% 110%,#14427140,transparent 55%),radial-gradient(1px 1px at 17% 23%,#d5d7ff90,transparent),radial-gradient(1px 1px at 80% 17%,#d5d7ff90,transparent),radial-gradient(1px 1px at 87% 65%,#d5d7ff70,transparent),radial-gradient(1px 1px at 8% 75%,#d5d7ff70,transparent),radial-gradient(1px 1px at 62% 9%,#d5d7ff90,transparent)}
#loginNeblina{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;mask-image:linear-gradient(transparent 15%,#0008 52%,black 100%);-webkit-mask-image:linear-gradient(transparent 15%,#0008 52%,black 100%)}
.neblina-sala{position:absolute;inset:-45px;background:url('/publico/login/fundo-referencia.jpg') center/cover no-repeat;filter:blur(24px);opacity:.27;transform:scale(1.08)}
#loginNeblina i{position:absolute;bottom:-24vh;left:-25vw;width:100vw;height:58vh;border-radius:50%;background:radial-gradient(ellipse at 48% 60%,#c5a4f277,transparent 63%);filter:blur(24px);opacity:.65;animation:neblinaDeriva 24s ease-in-out infinite alternate}
#loginNeblina i:nth-of-type(2){left:24vw;bottom:-22vh;background:radial-gradient(ellipse at 50% 65%,#6297da66,transparent 62%);animation-duration:29s;animation-delay:-10s}
#loginNeblina i:nth-of-type(3){left:-30vw;bottom:2vh;width:65vw;height:38vh;background:radial-gradient(ellipse at 50% 65%,#8961b755,transparent 64%);animation-duration:27s;animation-delay:-16s}
#loginNeblina i:nth-of-type(4){left:62vw;bottom:0;width:62vw;height:40vh;background:radial-gradient(ellipse at 40% 60%,#8d70c455,transparent 62%);animation-duration:23s;animation-delay:-7s}
#loginNeblina i:nth-of-type(5){left:-10vw;bottom:-15vh;width:65vw;height:42vh;background:radial-gradient(ellipse at 50% 60%,#d4c4ef66,transparent 62%);animation-duration:31s;animation-delay:-21s}
#loginNeblina i:nth-of-type(6){left:50vw;bottom:-16vh;width:70vw;height:36vh;background:radial-gradient(ellipse at 50% 60%,#bab7e266,transparent 64%);animation-duration:25s;animation-delay:-12s}
@keyframes neblinaDeriva{from{transform:translate3d(-3vw,4vh,0) scale(.92);opacity:.42}to{transform:translate3d(5vw,-6vh,0) scale(1.13);opacity:.75}}
#loginConteudo{width:min(460px,100%);margin:auto;display:flex;flex-direction:column;align-items:center;gap:22px;position:relative}
.login-marca{text-align:center;width:100%}
#logoDestino{position:relative;width:112px;height:112px;margin:0 auto 8px}
#loginLogo{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 4px 20px #7658f34d);animation:logoRespira 5s ease-in-out infinite}
@keyframes logoRespira{0%,100%{transform:translateY(2px) scale(.98);filter:drop-shadow(0 4px 16px #7658f349)}50%{transform:translateY(-3px) scale(1.025);filter:drop-shadow(0 4px 25px #7998ef80)}}
#logoTraco{position:absolute;inset:0;opacity:0;pointer-events:none;background:linear-gradient(155deg,#eee8ff,#aa8aff 48%,#59dcff);mask:url('/publico/b.png') center/contain no-repeat;-webkit-mask:url('/publico/b.png') center/contain no-repeat;filter:drop-shadow(0 0 12px #a98dff)}
.login-marca h1{margin:0;font:650 clamp(34px,5vw,44px)/1.1 var(--sans);letter-spacing:-1.5px;background:linear-gradient(105deg,#af94ff 15%,#7785ff 44%,#50b4ed 78%);background-clip:text;-webkit-background-clip:text;color:transparent}
.login-marca p{font-size:12px;letter-spacing:.03em;color:#aaa6c6;margin:12px 0 0;text-wrap:balance}
#conversaLogin{width:100%;padding:14px;background:#160f34ba;color:#eeeafb;border-radius:24px;border:1px solid #b899ff33;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);box-shadow:0 24px 70px #04021280}
.login-topo{display:flex;align-items:center;gap:11px;padding:2px 4px 12px;border-bottom:1px solid #b899ff20}
.login-avatar{width:38px;height:27px;flex:none;border-radius:52% 52% 16% 16% / 72% 72% 28% 28%;position:relative;background:url('/publico/cena/pedra-original.jpg') 45.3% 28.3% / 213.3% 195.5% no-repeat;filter:drop-shadow(0 0 7px #c9a2ff55)}
.login-avatar::after{content:'';position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;border-radius:50%;background:#43e0a0;border:2px solid #1b1340}
.login-quem strong{display:block;font-size:14px}.login-quem span{font-size:12px;color:#b3abce}
.login-selo{margin-left:auto;font-size:10px;letter-spacing:.04em;text-transform:uppercase;color:#b3abce;border:1px solid #b899ff40;border-radius:20px;padding:3px 8px}
#loginFio{height:225px;overflow-y:auto;display:flex;flex-direction:column;gap:8px;padding:16px 2px 8px;scrollbar-width:thin;scrollbar-color:#b899ff44 transparent}
#loginFio::before{content:'';flex:1}
.login-msg{max-width:86%;flex-shrink:0;padding:9px 13px;border-radius:18px;font-size:14px;line-height:1.45;overflow-wrap:anywhere;animation:loginBolha .24s ease-out both}
.login-msg.ela{align-self:flex-start;background:#281c5ccc;border:1px solid #b899ff29;border-bottom-left-radius:6px}
.login-msg.voce{align-self:flex-end;background:linear-gradient(135deg,#5b3bd0,#2f7fe0);border-bottom-right-radius:6px;color:white}
@keyframes loginBolha{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.login-atalhos{display:flex;flex-wrap:wrap;gap:6px;padding:4px 2px 10px}
.login-atalhos button{font-size:12px;color:#eeeafb;background:#b899ff19;border:1px solid #b899ff47;border-radius:24px;padding:6px 11px;min-height:36px;transition:background .15s,border-color .15s}
.login-atalhos button:hover{background:#b899ff30;border-color:#b899ff}
#formConta{width:100%;display:flex;flex-direction:row;align-items:center;gap:4px;padding:6px;background:#0a061c99;color:#eeeafb;box-shadow:none;border:1px solid #b899ff3d;border-radius:18px;animation:none}
#formConta:focus-within{border-color:#b899ff;box-shadow:0 0 0 3px #b899ff22}
#formConta input{flex:1;min-width:0;min-height:44px;background:none;color:#f5f1ff;border:0;border-radius:12px;padding:10px;font-size:14px;box-shadow:none;outline:none}
#formConta input::placeholder{color:#aaa1c3}
#formConta input:focus{outline:none;box-shadow:none}
#formConta #contaEnviar{display:grid;place-items:center;width:44px;height:44px;flex:none;padding:0;margin:0;border:0;border-radius:12px;color:white;background:linear-gradient(135deg,#6a3fd6,#2f8fe8 70%,#3cc8ff);transition:filter .15s,scale .15s}
#formConta svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#contaOlho{display:grid;place-items:center;width:40px;height:44px;padding:0;border:0;border-radius:12px;background:none;color:#bbb0d4;flex:none}
@media(hover:hover){#formConta #contaEnviar:hover:not(:disabled){filter:brightness(1.15)}.login-rever:hover{color:#d1c8f0}}
#formConta #contaEnviar:active:not(:disabled){scale:.96}
#formConta #contaEnviar:disabled{opacity:.4;cursor:var(--cursor-seta)}
.login-local{color:#c2b7d7;font-size:11px;text-align:center;margin:-5px 0 0}
#conversaLogin .erro-tela{color:#ffb6c5;font-size:12px;margin:4px 2px 10px}
.login-rever{display:flex;align-items:center;gap:7px;justify-content:center;min-height:40px;margin-top:-12px;background:none;border:0;color:#aaa1c3;font-size:15px;transition:color .15s}
.login-rever span{font-size:11px}
#aberturaLogin{position:fixed;inset:0;z-index:30;pointer-events:none;overflow:hidden}
#aberturaFundo{position:absolute;inset:0;background:#040612}
#aberturaVideo{position:absolute;width:100%;height:100%;inset:0;object-fit:cover;object-position:center;opacity:0}
#universoWebgl{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;opacity:0}
.universo-reserva{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 35%,#32225388,transparent 70%),radial-gradient(1px 1px at 28% 15%,white,transparent),radial-gradient(2px 2px at 71% 32%,#c4beff,transparent),radial-gradient(1px 1px at 13% 50%,white,transparent),#040612;overflow:hidden}
.terra-reserva{position:absolute;width:70vmin;height:70vmin;border-radius:50%;left:calc(50% - 35vmin);top:58%;background:radial-gradient(ellipse at 40% 20%,#426a9377,transparent 28%),radial-gradient(ellipse at 40% 25%,#2c748e,#172c61 30%,#070c25 62%);box-shadow:0 -2px 5px #85cbff,0 -8px 36px #55b4ff3b,inset 10px 14px 45px #2f7eac44}
#luzViajante{position:absolute;left:50%;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#fbf4ff;box-shadow:0 0 8px 2px #eee1ff,0 0 28px 8px #af86fd,0 0 76px 12px #49bbfa60;opacity:0}
#pularAbertura{position:absolute;right:max(20px,env(safe-area-inset-right));bottom:max(20px,env(safe-area-inset-bottom));min-height:44px;padding:8px 14px;background:#090916b3;color:#ddd5ee;border:1px solid #c7b3ec40;border-radius:24px;backdrop-filter:blur(12px);pointer-events:auto;font-size:12px}
#pularAbertura span{margin-left:8px}
@media(max-width:480px){#entrar-conta{padding:20px}#loginConteudo{gap:20px}#logoDestino{height:96px;width:96px}.login-marca p{font-size:11px}#loginFio{height:220px}.login-msg{font-size:13px}}
@media(max-height:740px){#entrar-conta{place-items:start center;padding-block:16px}#loginConteudo{gap:15px}#logoDestino{height:72px;width:72px;margin-bottom:2px}.login-marca h1{font-size:32px}.login-marca p{margin-top:6px}#loginFio{height:180px}}
@media(prefers-reduced-motion:reduce){#aberturaLogin{display:none!important}#loginNeblina i,.login-msg,#loginLogo{animation:none}#formConta input,#formConta #contaEnviar,.login-rever{transition:none}#formConta #contaEnviar:active:not(:disabled){scale:1}}
/* Portal (portal.js): na entrada a conversa e os textos saem e a marca fica para viajar até a pedra; na saída o
   login volta por cima só com fundo, estrelas, névoa e o lugar da marca, que chega voando da pedra. */
#entrar-conta.portal-abrindo #conversaLogin,#entrar-conta.portal-abrindo .login-marca h1,#entrar-conta.portal-abrindo .login-marca p,#entrar-conta.portal-abrindo .login-local,#entrar-conta.portal-abrindo .login-rever{opacity:0;transform:translateY(10px);transition:opacity .36s ease,transform .36s ease;pointer-events:none}
#entrar-conta.portal-saindo #loginConteudo>:not(.login-marca),#entrar-conta.portal-saindo .login-marca h1,#entrar-conta.portal-saindo .login-marca p,#entrar-conta.portal-saindo #loginLogo{opacity:0}
.portal-marca{position:fixed;z-index:60;pointer-events:none;object-fit:contain;transform-origin:50% 50%;will-change:transform,opacity}
body.saindo-da-conta{pointer-events:none}
/* A página depois de uma saída começa no último quadro dela (a marca no lugar); a conversa do login chega depois. */
html.pos-saida body>:not(#entrar-conta):not(dialog){visibility:hidden}
html.pos-saida #entrar-conta{display:grid!important}
html.pos-saida #aberturaLogin{display:none!important}
html.pos-saida #loginConteudo>:not(.login-marca),html.pos-saida .login-marca h1,html.pos-saida .login-marca p{opacity:0}
#loginConteudo>*,.login-marca h1,.login-marca p{transition:opacity .5s ease}
/* O véu do arranque (05/10/2026; o dono: "no início… tá dando um microcorte de milissegundo aparecendo os objetos"): a página nasce
   coberta desde o primeiro quadro (html.arranque, posto no <head> do index.html) e o véu só sai quando o programa sabe o que mostrar:
   o login com o vídeo de abertura (mesma cor do primeiro quadro dele) ou a cortina com a marca. Ver abertura-cena.js. */
#veuArranque{display:none}
html.arranque #veuArranque{display:block;position:fixed;inset:0;z-index:70;background:#040612;opacity:1}
html.arranque #veuArranque.saindo{opacity:0;transition:opacity .38s ease;pointer-events:none}
/* a espera longa (rede lenta) não fica no escuro: depois de 0,7 s um ponto de luz pulsa no meio — a mesma luz com que o vídeo de
   abertura começa, então a passagem para ele não tem corte; na chegada com conta, a luz se dissolve na cortina com a marca */
html.arranque #veuArranque::after{content:'';position:absolute;left:50%;top:50%;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:#fbf4ff;box-shadow:0 0 8px 2px #eee1ff,0 0 28px 8px #af86fd,0 0 76px 12px #49bbfa60;opacity:0;animation:veuLuz 1.7s ease-in-out .7s infinite}
@keyframes veuLuz{0%,100%{opacity:.22;transform:scale(.7)}50%{opacity:.95;transform:scale(1)}}
html.pos-saida #veuArranque{display:none!important}
/* A cortina da cena: com a conta já aberta, o login volta só como cortina (fundo, estrelas, névoa e a marca) enquanto a sala monta
   por baixo; a conversa do login não aparece e o vídeo de abertura não toca. */
#entrar-conta.so-marca #loginConteudo>:not(.login-marca),#entrar-conta.so-marca .login-marca h1,#entrar-conta.so-marca .login-marca p{opacity:0!important;pointer-events:none;transition:none}
#entrar-conta.so-marca #aberturaLogin{display:none!important}
/* A carga da marca (abertura-cena.js): a marca fica apagada e a luz sobe por ela conforme as peças da cena chegam (--carga, 0 a 1);
   cheia, ela desce até a pedra (portal.js). Só existe com a classe: fora da abertura a marca é a de sempre. */
#logoDestino.carregando #loginLogo{animation:none;filter:brightness(.42) saturate(.55) drop-shadow(0 4px 14px #7658f326)}
#logoDestino.carregando #logoTraco{opacity:1;clip-path:inset(calc((1 - var(--carga,0)) * 100%) 0 0 0);transition:clip-path .5s cubic-bezier(.3,.7,.2,1)}
#logoDestino.carregando::before{content:'';position:absolute;inset:-36%;border-radius:50%;background:radial-gradient(circle,#b899ff3d,#7998ef1c 44%,transparent 67%);animation:cargaPulso 1.7s ease-in-out infinite;pointer-events:none}
#logoDestino.carregando.cheia #logoTraco{filter:drop-shadow(0 0 16px #c9a8ff) brightness(1.2)}
#logoDestino.carregando.cheia::before{animation-duration:.6s}
@keyframes cargaPulso{0%,100%{transform:scale(.8);opacity:.3}50%{transform:scale(1.14);opacity:.85}}
@media(prefers-reduced-motion:reduce){#logoDestino.carregando::before{animation:none;opacity:.5}#logoDestino.carregando #logoTraco{transition:none}}
/* o botão de melhorias não aparece por cima do véu, do login, do vídeo de abertura nem da despedida */
html.arranque #melhoriasBotao,html.arranque #melhoriasFolha,html.pos-saida #melhoriasBotao,body.sem-conta #melhoriasBotao,body.sem-conta #melhoriasFolha,body.saindo-da-conta #melhoriasBotao,body.saindo-da-conta #melhoriasFolha,body.abrindo-cena #melhoriasBotao,body.abrindo-cena #melhoriasFolha{display:none!important}