*{box-sizing:border-box}
body{margin:0;background:var(--fundo);color:var(--texto);font:16px/1.55 var(--fonte-texto);-webkit-font-smoothing:antialiased}
a{color:var(--sistema)}
.topo{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;max-width:1100px;margin:0 auto}
.logo{height:auto;max-width:40vw}
.entrar{color:var(--texto);text-decoration:none;font-weight:700;padding:8px 12px;border:1px solid var(--borda);border-radius:8px}
.entrar:hover,.entrar:focus-visible{border-color:var(--acao-b)}
.hero{position:relative;overflow:hidden;min-height:78vh;display:grid;align-items:center;padding:24px 16px 64px}
.hero-arte{position:absolute;inset:0;background:radial-gradient(120% 90% at 75% 10%,#2a2650,var(--fundo) 62%),radial-gradient(60% 50% at 20% 90%,#3a1a2a66,transparent 70%)}
.hero-gif,.hero-poster{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:right center}
.hero-poster{display:none}
.hero-arte::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--fundo) 0%,#0d0f1ae6 28%,#0d0f1a66 55%,transparent 80%),linear-gradient(0deg,var(--fundo) 0%,transparent 22%)}
.anel{position:absolute;border-radius:50%;border:2px solid #ff7a1a33;right:-10vw;top:10%;animation:pulso 7s ease-in-out infinite}
.a1{width:60vw;height:60vw;max-width:620px;max-height:620px}
.a2{width:40vw;height:40vw;max-width:420px;max-height:420px;right:0;top:20%;border-color:#2fd8f033;animation-delay:-2s}
.a3{width:22vw;height:22vw;max-width:230px;max-height:230px;right:7vw;top:32%;border-color:#ffd84a55;animation-delay:-4s}
@keyframes pulso{50%{transform:scale(1.06);opacity:.6}}
.hero-texto{position:relative;max-width:1100px;margin:0 auto;width:100%}
.hero-texto>*{max-width:560px}
h1{font:700 clamp(32px,7vw,58px)/1.1 var(--fonte-titulo);margin:16px 0 12px}
.destaque{background:linear-gradient(120deg,var(--acao-a),var(--acao-b));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero-texto p{color:var(--texto-suave);font-size:18px}
.acoes{margin-top:24px}
.secao{max-width:1100px;margin:0 auto;padding:40px 16px}
.secao h2{font:700 clamp(24px,5vw,34px) var(--fonte-titulo);margin:0 0 20px}
.grade{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:16px}
.melhoria{display:flex;flex-direction:column;min-width:0}
.midia{width:100%;aspect-ratio:16/9;object-fit:cover;background:var(--painel-2);display:block}
.midia-substituta{background:linear-gradient(120deg,var(--painel-2),#2d2a55,var(--painel-2));background-size:220% 100%;animation:varre 6s linear infinite}
@keyframes varre{to{background-position:-220% 0}}
.corpo{padding:16px;display:grid;gap:8px;align-content:start}
.corpo h3{margin:0;font:700 18px/1.3 var(--fonte-texto)}
.corpo p{margin:0;color:var(--texto-suave)}
.corpo .evidencia{color:var(--sistema);font-weight:700}
.em-breve .midia-substituta{animation:none;opacity:.5}
.aviso{max-width:1100px;margin:24px auto;padding:0 16px;color:var(--texto-suave)}
.rodape{padding:32px 16px;text-align:center;font:700 11px var(--fonte-texto);letter-spacing:.14em;text-transform:uppercase;color:var(--texto-suave)}
/* Moedas: cada sigla leva a cor da própria moeda (a mesma do HUD do jogo) */
:root{--moeda-coin:#ffcc00;--moeda-aura-1:#7df9ff;--moeda-aura-2:#c77dff;--moeda-aura-3:#ff7ad9;--moeda-ticket:#4cd3e6}
.moedas-lista{list-style:none;margin:0;padding:8px;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:8px}
.moeda{display:flex;gap:12px;align-items:flex-start;padding:12px;min-width:0}
.moeda h3{margin:0 0 4px;font:700 18px/1.3 var(--fonte-texto)}
.moeda p{margin:0;color:var(--texto-suave)}
.moeda-sigla{flex:none;min-width:44px;padding:4px 8px;text-align:center;font:700 14px/1.2 var(--fonte-texto);text-transform:uppercase;letter-spacing:.06em;border:1px solid currentColor;border-radius:8px}
.moeda-coin .moeda-sigla,.moeda-coin h3{color:var(--moeda-coin)}
.moeda-tc .moeda-sigla,.moeda-tc h3{color:var(--moeda-ticket)}
.moeda-ta .moeda-sigla,.moeda-ta h3{color:var(--moeda-aura-2)}
.moeda-aura .moeda-sigla,.moeda-aura h3{background:linear-gradient(100deg,var(--moeda-aura-1),var(--moeda-aura-2),var(--moeda-aura-3),var(--moeda-aura-1));background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:varre 3.2s linear infinite}
.moeda-aura .moeda-sigla{border-color:var(--moeda-aura-2)}
@media (prefers-reduced-motion:reduce){.anel,.midia-substituta,.moeda-aura .moeda-sigla,.moeda-aura h3{animation:none}.hero-gif{display:none}.hero-poster{display:block}}
