/* ===== VARIABLES ===== */
:root {
  --bg:          #030C1E;
  --bg2:         #071428;
  --bg3:         #0A1A30;
  --primary:     #0066FF;
  --primary-glow:rgba(0,102,255,0.3);
  --cyan:        #00CCFF;
  --cyan-glow:   rgba(0,204,255,0.25);
  --gold:        #FFB800;
  --gold-glow:   rgba(255,184,0,0.25);
  --red:         #FF2D55;
  --red-glow:    rgba(255,45,85,0.25);
  --green:       #00FF88;
  --purple:      #A855F7;
  --purple-glow: rgba(168,85,247,0.25);
  --text:        #EDF4FF;
  --text-muted:  #6B87A5;
  --text-dim:    #9BB5CC;
  --card-bg:     rgba(0,100,255,0.05);
  --card-border: rgba(0,180,255,0.1);
  --font-title:  'Exo 2', sans-serif;
  --font-body:   'Inter', sans-serif;
  --font-mono:   'JetBrains Mono', monospace;
  --font-cta:    'Bebas Neue', cursive;
}

/* ===== RESET ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--bg);
  color:var(--text);
  font-family:var(--font-body);
  overflow-x:hidden;
  line-height:1.6;
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{cursor:pointer;border:none;background:none;font-family:inherit}
ul{list-style:none}

/* ===== ANIMATIONS ===== */
@keyframes float{
  0%,100%{transform:translateY(0px) rotate(-1deg)}
  50%{transform:translateY(-18px) rotate(1deg)}
}
@keyframes floatSlow{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-10px)}
}
@keyframes pulse-glow{
  0%,100%{opacity:.6}
  50%{opacity:1}
}
@keyframes scanlines{
  0%{transform:translateY(0)}
  100%{transform:translateY(4px)}
}
@keyframes glitch1{
  0%{clip-path:inset(0 0 98% 0)}
  10%{clip-path:inset(30% 0 50% 0)}
  20%{clip-path:inset(80% 0 5% 0)}
  30%{clip-path:inset(10% 0 85% 0)}
  40%{clip-path:inset(60% 0 30% 0)}
  50%,100%{clip-path:inset(0 0 0 0);opacity:0}
}
@keyframes glitch2{
  0%{clip-path:inset(50% 0 45% 0);transform:translateX(5px)}
  20%{clip-path:inset(20% 0 70% 0);transform:translateX(-5px)}
  40%{clip-path:inset(90% 0 5% 0);transform:translateX(3px)}
  60%,100%{opacity:0}
}
@keyframes typewriter{
  from{width:0}
  to{width:100%}
}
@keyframes blink{
  0%,100%{opacity:1}
  50%{opacity:0}
}
@keyframes fadeInUp{
  from{opacity:0;transform:translateY(30px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes fadeIn{
  from{opacity:0}
  to{opacity:1}
}
@keyframes ripple{
  0%{transform:scale(1);opacity:.8}
  100%{transform:scale(2.5);opacity:0}
}
@keyframes borderRotate{
  from{--angle:0deg}
  to{--angle:360deg}
}
@keyframes shimmer{
  0%{background-position:-200% center}
  100%{background-position:200% center}
}
@keyframes particle{
  0%{transform:translateY(0) translateX(0);opacity:0}
  10%{opacity:1}
  90%{opacity:.4}
  100%{transform:translateY(-100vh) translateX(var(--dx,20px));opacity:0}
}
@keyframes evolveFlash{
  0%{opacity:0;transform:scale(.8)}
  30%{opacity:1;transform:scale(1.1)}
  60%{opacity:1;transform:scale(1)}
  100%{opacity:1}
}
@keyframes nodePulse{
  0%,100%{box-shadow:0 0 0 0 var(--node-color,var(--cyan))}
  50%{box-shadow:0 0 0 6px transparent}
}
@keyframes linePulse{
  0%{opacity:.3}
  50%{opacity:1}
  100%{opacity:.3}
}
@keyframes countUp{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}
@keyframes stickySlide{
  from{transform:translateY(100%);opacity:0}
  to{transform:translateY(0);opacity:1}
}
@keyframes goldShine{
  0%{background-position:0% 50%}
  50%{background-position:100% 50%}
  100%{background-position:0% 50%}
}

/* ===== INTRO OVERLAY ===== */
#intro-overlay{
  position:fixed;inset:0;background:#000;z-index:9999;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:20px;padding:1.5rem;box-sizing:border-box;text-align:center;
}
#intro-overlay.hidden{opacity:0;pointer-events:none;transition:opacity .8s ease}
.intro-logo{
  font-family:var(--font-title);font-size:clamp(1.1rem,6vw,2rem);
  font-weight:900;letter-spacing:.18em;text-transform:uppercase;line-height:1.25;
  max-width:100%;text-align:center;overflow-wrap:break-word;
  background:linear-gradient(90deg,var(--cyan),var(--primary),var(--gold));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  opacity:0;transition:opacity .5s;
}
@media(max-width:480px){.intro-logo{letter-spacing:.1em}}
.intro-terminal{
  font-family:var(--font-mono);font-size:clamp(.7rem,2vw,.9rem);
  color:var(--cyan);text-align:center;min-height:80px;
  line-height:2;
}
.intro-terminal span{border-right:2px solid var(--cyan);animation:blink .7s infinite}
.intro-bar-wrap{width:min(360px,80vw);background:rgba(0,212,255,.15);border-radius:2px;overflow:hidden}
.intro-bar{height:3px;width:0%;background:linear-gradient(90deg,var(--cyan),var(--primary));transition:width .05s linear}
.intro-scanlines{
  position:absolute;inset:0;pointer-events:none;
  background:repeating-linear-gradient(transparent,transparent 2px,rgba(0,0,0,.15) 2px,rgba(0,0,0,.15) 4px);
  animation:scanlines 3s linear infinite;
}
.intro-vignette{
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at center,transparent 40%,rgba(0,0,0,.8) 100%);
}

/* ===== NAV ===== */
nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:1rem 2rem;
  background:rgba(6,10,24,0);
  transition:background .4s,backdrop-filter .4s;
}
nav.scrolled{
  background:rgba(6,10,24,.9);
  backdrop-filter:blur(20px);
  border-bottom:1px solid var(--card-border);
}
.nav-logo{
  font-family:var(--font-title);font-weight:900;font-size:1.1rem;
  letter-spacing:.1em;text-transform:uppercase;
  text-decoration:none;cursor:pointer;transition:filter .2s ease;
  background:linear-gradient(90deg,var(--cyan),var(--primary));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
a.nav-logo:hover{filter:brightness(1.25)}
.nav-cta{
  display:none;
  padding:.5rem 1.3rem;font-family:var(--font-cta);font-size:1rem;
  letter-spacing:.1em;border-radius:6px;color:#fff;
  border:1px solid rgba(124,137,255,.4);
  background:linear-gradient(135deg,#7289DA,#5865F2,#4752C4);
  box-shadow:0 0 18px rgba(88,101,242,.35);
  transition:transform .2s,box-shadow .3s,filter .25s;
}
.nav-cta:hover{
  transform:translateY(-1px);filter:brightness(1.08);
  box-shadow:0 0 32px rgba(88,101,242,.55);
}
@media(min-width:640px){.nav-cta{display:block}}
.nav-right{display:flex;align-items:center;gap:.6rem}
.lang-switch{display:flex;align-items:center;gap:.3rem}
.lang-flag{
  display:flex;align-items:center;line-height:0;padding:.2rem;border-radius:5px;
  background:transparent;border:1px solid transparent;opacity:.45;cursor:pointer;
  transition:opacity .2s,border-color .2s,background .2s,transform .15s;
}
.lang-flag img{display:block;width:26px;height:18px;border-radius:2px}
.lang-flag:hover{opacity:.9;transform:translateY(-1px)}
.lang-flag.active{opacity:1;border-color:rgba(124,137,255,.6);background:rgba(88,101,242,.16)}

/* ===== SECTIONS COMMON ===== */
section{position:relative;overflow:hidden}
.section-label{
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.25em;
  text-transform:uppercase;color:var(--cyan);opacity:.7;margin-bottom:.75rem;
}
.section-title{
  font-family:var(--font-title);font-weight:900;
  font-size:clamp(1.8rem,5vw,3.2rem);line-height:1.15;
  margin-bottom:1rem;
}
.section-sub{
  color:var(--text-dim);font-size:1rem;max-width:560px;
  margin:0 auto;line-height:1.7;
}

/* ===== DIGITAL GRID BG ===== */
.grid-bg{
  position:absolute;inset:0;pointer-events:none;
  background-image:
    linear-gradient(rgba(0,212,255,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(0,212,255,.04) 1px,transparent 1px);
  background-size:60px 60px;
}
.grid-bg::after{
  content:'';position:absolute;inset:0;
  background:radial-gradient(ellipse at 50% 0%,rgba(79,70,229,.12) 0%,transparent 70%);
}

/* ===== PARTICLES CANVAS ===== */
#particles-canvas{
  position:fixed;top:0;left:0;width:100%;height:100%;
  pointer-events:none;z-index:40;opacity:.85;
  mix-blend-mode:screen;
}

/* ===== HERO — DIVINE / CELESTIAL ===== */
#hero{
  min-height:100vh;min-height:100svh;
  display:flex;align-items:center;justify-content:center;
  text-align:center;padding:6rem 1.5rem 7rem;
  position:relative;z-index:2;overflow:hidden;
  background-image:url('/nextjs/Resources/LoginBackgrounds/login_bg.webp');
  background-size:cover;
  background-position:center top;
}
/* base crush — darken whole art uniformly */
#hero::before{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:rgba(2,8,20,.62);
}
#hero .grid-bg{opacity:.25;mix-blend-mode:overlay;z-index:0}
/* directional scrim: buries baked top logo + crushes busy periphery */
.hero-overlay{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(ellipse 75% 48% at 50% 0%,rgba(6,4,0,.9) 0%,transparent 100%),
    linear-gradient(to top,rgba(3,12,30,.96) 0%,rgba(3,12,30,.5) 40%,transparent 68%),
    radial-gradient(ellipse 88% 100% at 50% 50%,transparent 36%,rgba(2,6,18,.85) 100%);
}
/* divine warm halo behind the copy */
.hero-halo{
  position:absolute;inset:0;z-index:1;pointer-events:none;
  background:radial-gradient(ellipse 58% 52% at 50% 50%,
    rgba(255,184,0,.10) 0%,rgba(255,184,0,.045) 32%,transparent 70%);
}
/* crepuscular light shafts from crown */
.hero-rays{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
.hero-rays::before,.hero-rays::after{
  content:'';position:absolute;top:-10%;left:50%;height:130%;
  transform-origin:top center;filter:blur(34px);
  background:linear-gradient(to bottom,rgba(255,205,90,.13) 0%,rgba(255,205,90,.04) 55%,transparent 100%);
}
.hero-rays::before{width:190px;transform:translateX(-50%) rotate(-14deg)}
.hero-rays::after{width:150px;transform:translateX(-50%) rotate(14deg);opacity:.7}

.hero-inner{max-width:760px;width:100%;margin:0 auto;position:relative;z-index:2}
/* glass sanctuary — separates copy from art at any width */
.hero-inner::before{
  content:'';position:absolute;inset:-3rem -2.2rem;z-index:-1;
  border-radius:2rem;
  background:rgba(3,12,30,.42);
  backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  border:1px solid rgba(255,184,0,.08);
  box-shadow:0 0 90px rgba(255,184,0,.05),inset 0 0 0 1px rgba(255,255,255,.03);
}
/* legacy decorative — off */
.hero-creature-wrap,.hero-creature,.hero-aura,.hero-rings,.hero-ring{display:none}

.hero-eyebrow{
  display:inline-flex;align-items:center;gap:.7rem;
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.24em;
  text-transform:uppercase;color:var(--gold);opacity:.88;
  margin-bottom:1.6rem;
  animation:fadeInUp .8s ease both;animation-delay:.2s;
}
.hero-eyebrow::before,.hero-eyebrow::after{
  content:'';height:1px;width:34px;
  background:linear-gradient(to right,transparent,rgba(255,184,0,.55));
}
.hero-eyebrow::after{background:linear-gradient(to left,transparent,rgba(255,184,0,.55))}
.hero-title{
  font-family:var(--font-title);font-weight:700;
  line-height:1.12;letter-spacing:-.01em;
  margin-bottom:1.6rem;display:flex;flex-direction:column;gap:.45em;
  animation:fadeInUp .8s ease both;animation-delay:.4s;
}
.hero-title .line1{
  display:block;
  font-size:clamp(1.7rem,4.2vw,2.8rem);
  background:linear-gradient(90deg,
    #00CCFF 0%, #4F8CFF 20%, #A855F7 40%, #00CCFF 60%, #4F8CFF 80%, #A855F7 100%);
  background-size:220% auto;
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 10px rgba(0,204,255,.45)) drop-shadow(0 0 22px rgba(168,85,247,.3));
  animation:neonSweep 16s ease-in-out infinite;
}
@keyframes neonSweep{
  0%{background-position:0% center}
  100%{background-position:220% center}
}
.hero-title .line2{
  display:block;font-weight:600;font-style:italic;
  font-size:clamp(1.45rem,3.4vw,2.3rem);letter-spacing:.005em;
  background:linear-gradient(135deg,rgba(255,222,130,1) 0%,var(--gold) 46%,rgba(238,158,30,.92) 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 0 16px rgba(255,184,0,.26));
}
.hero-sub{
  color:var(--text-dim);font-size:clamp(.92rem,2vw,1.08rem);
  max-width:560px;margin:0 auto 2.4rem;line-height:1.7;
  animation:fadeInUp .8s ease both;animation-delay:.6s;
}
.hero-sub em{color:var(--text);font-style:normal;font-weight:500}
.hero-ctas{
  display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;
  animation:fadeInUp .8s ease both;animation-delay:.8s;
}
.btn-primary{
  display:inline-flex;align-items:center;gap:.55rem;
  padding:.9rem 2.2rem;
  font-family:var(--font-cta);font-size:1.25rem;letter-spacing:.1em;
  border-radius:6px;color:#0a0600;font-weight:700;
  background:linear-gradient(135deg,#C98B00 0%,var(--gold) 50%,#E8A500 100%);
  border:1px solid rgba(255,215,80,.4);
  box-shadow:0 0 28px rgba(255,184,0,.3),0 2px 8px rgba(0,0,0,.5),inset 0 0 0 1px rgba(255,230,120,.15);
  transition:transform .2s,box-shadow .3s,filter .25s;
}
.btn-primary:hover{
  transform:translateY(-2px);filter:brightness(1.07);
  box-shadow:0 0 44px rgba(255,184,0,.5),0 6px 20px rgba(0,0,0,.5),inset 0 0 0 1px rgba(255,230,120,.25);
}
.btn-secondary{
  display:inline-flex;align-items:center;gap:.55rem;
  padding:.9rem 1.8rem;
  font-family:var(--font-cta);font-size:1.2rem;letter-spacing:.1em;
  border-radius:6px;color:#fff;
  border:1px solid rgba(124,137,255,.4);
  background:linear-gradient(135deg,#7289DA,#5865F2,#4752C4);
  box-shadow:0 0 26px rgba(88,101,242,.35);
  transition:transform .2s,box-shadow .3s,filter .25s;
}
.btn-secondary:hover{
  transform:translateY(-2px);filter:brightness(1.08);
  box-shadow:0 0 44px rgba(88,101,242,.55);
}
.hero-badges{
  display:flex;gap:.65rem;justify-content:center;flex-wrap:wrap;
  margin-top:2rem;
  animation:fadeInUp .8s ease both;animation-delay:1s;
}
.hero-badge{
  display:flex;align-items:center;gap:.4rem;
  padding:.3rem .8rem;
  border:1px solid rgba(107,135,165,.2);
  border-radius:20px;background:rgba(255,255,255,.03);
  font-size:.7rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--text-muted);font-family:var(--font-mono);
  transition:border-color .2s,color .2s;
}
.hero-badge:hover{border-color:rgba(255,184,0,.25);color:var(--text-dim)}
.hero-badge .dot{width:6px;height:6px;border-radius:50%;background:var(--green);box-shadow:0 0 6px var(--green)}
.hero-scroll{
  position:absolute;bottom:2rem;left:50%;transform:translateX(-50%);z-index:2;
  display:flex;flex-direction:column;align-items:center;gap:.5rem;
  font-family:var(--font-mono);font-size:.6rem;letter-spacing:.24em;
  color:var(--gold);opacity:.5;animation:float 2s ease-in-out infinite;
}
.hero-scroll-line{width:1px;height:40px;background:linear-gradient(to bottom,rgba(255,184,0,.6),transparent)}

/* ===== QUIZ SECTION ===== */
#quiz{
  padding:6rem 1.5rem;
  background:linear-gradient(180deg,var(--bg) 0%,var(--bg2) 100%);
  z-index:2;
}
.quiz-inner{max-width:700px;margin:0 auto;text-align:center}
.quiz-header{margin-bottom:3rem}
.quiz-card{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;padding:2.5rem 2rem;
  backdrop-filter:blur(12px);
  position:relative;overflow:hidden;
}
.quiz-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
}
.quiz-progress{
  display:flex;gap:.4rem;justify-content:center;margin-bottom:2rem;
}
.quiz-dot{
  width:8px;height:8px;border-radius:50%;
  background:rgba(255,255,255,.1);
  transition:background .3s,box-shadow .3s;
}
.quiz-dot.active{background:var(--cyan);box-shadow:0 0 8px var(--cyan)}
.quiz-dot.done{background:var(--primary)}
.quiz-q{
  font-family:var(--font-title);font-weight:700;font-size:clamp(1.1rem,3vw,1.4rem);
  margin-bottom:2rem;line-height:1.4;
}
.quiz-options{
  display:grid;gap:.8rem;
  grid-template-columns:1fr;
}
@media(min-width:500px){.quiz-options{grid-template-columns:1fr 1fr}}
.quiz-opt{
  padding:1rem 1.2rem;
  border:1px solid rgba(255,255,255,.1);
  border-radius:10px;
  background:rgba(255,255,255,.03);
  font-size:.95rem;color:var(--text);
  text-align:left;cursor:pointer;
  transition:all .2s;
  display:flex;align-items:center;gap:.75rem;
}
.quiz-opt:hover{
  border-color:var(--cyan);
  background:rgba(0,212,255,.06);
  color:var(--cyan);
  transform:translateY(-1px);
}
.quiz-opt-icon{font-size:1.3rem;min-width:28px;text-align:center}

/* RESULT */
.quiz-result{display:none}
.quiz-result.visible{display:block;animation:fadeIn .6s ease}
.result-card{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;padding:2.5rem 2rem;
  backdrop-filter:blur(12px);
  position:relative;overflow:hidden;
}
.result-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}
.result-partner-img{
  width:clamp(120px,25vw,180px);height:clamp(120px,25vw,180px);
  object-fit:contain;margin:0 auto 1.2rem;
  filter:drop-shadow(0 0 24px rgba(255,184,0,.4));
  animation:floatSlow 3s ease-in-out infinite;
}
.result-name{
  font-family:var(--font-title);font-weight:900;font-size:clamp(1.8rem,5vw,2.6rem);
  background:linear-gradient(135deg,var(--gold),#ffd166);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  margin-bottom:.3rem;
}
.result-title{font-family:var(--font-mono);color:var(--cyan);font-size:.85rem;letter-spacing:.15em;margin-bottom:1.2rem}
.result-tags{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap;margin-bottom:1.5rem}
.result-tag{
  padding:.25rem .8rem;border-radius:20px;font-size:.75rem;
  font-family:var(--font-mono);border:1px solid;
}
.result-tag.elem{border-color:rgba(255,184,0,.4);color:var(--gold);background:rgba(255,184,0,.08)}
.result-tag.cls{border-color:rgba(0,212,255,.4);color:var(--cyan);background:rgba(0,212,255,.08)}
.result-tag.skill{border-color:rgba(168,85,247,.4);color:var(--purple);background:rgba(168,85,247,.08)}
.result-desc{color:var(--text-dim);font-size:.95rem;line-height:1.7;margin-bottom:2rem;max-width:420px;margin-left:auto;margin-right:auto}
.evo-chain{display:flex;align-items:center;justify-content:center;gap:.5rem;margin-bottom:2rem;flex-wrap:wrap}
.evo-node{
  display:flex;flex-direction:column;align-items:center;gap:.4rem;
  font-family:var(--font-mono);font-size:.65rem;color:var(--text-muted);
}
.evo-img{
  width:56px;height:56px;object-fit:contain;border-radius:8px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.03);padding:4px;
}
.evo-node.locked .evo-img{
  filter:brightness(0) invert(.1);
  border-color:rgba(255,255,255,.04);
  background:rgba(255,255,255,.02);
}
.evo-node.locked .evo-name{color:rgba(255,255,255,.2)}
.evo-lock-icon{font-size:.8rem;color:rgba(255,255,255,.2)}
.evo-arrow{color:rgba(255,255,255,.2);font-size:1rem;flex-shrink:0}
.result-unlock-note{
  font-family:var(--font-mono);font-size:.72rem;
  color:rgba(255,255,255,.3);margin-bottom:1.5rem;
}
.btn-discord{
  display:inline-flex;align-items:center;justify-content:center;gap:.7rem;
  padding:1rem 2rem;width:100%;max-width:380px;
  font-family:var(--font-cta);font-size:1.25rem;letter-spacing:.1em;
  border-radius:8px;color:#fff;
  background:linear-gradient(135deg,#5865F2,#7289da);
  box-shadow:0 0 30px rgba(88,101,242,.3);
  transition:transform .2s,box-shadow .3s;
}
.btn-discord:hover{transform:translateY(-2px);box-shadow:0 0 50px rgba(88,101,242,.5)}
.quiz-restart{
  display:block;margin-top:1rem;font-size:.8rem;
  color:var(--text-muted);cursor:pointer;
  font-family:var(--font-mono);
}
.quiz-restart:hover{color:var(--text)}

/* ===== WORLD SECTION ===== */
#world{
  padding:6rem 1.5rem;
  background:var(--bg2);
  z-index:2;
}
.world-inner{max-width:1100px;margin:0 auto}
.world-header{text-align:center;margin-bottom:3.5rem}
.world-copy{
  max-width:660px;margin:0 auto;text-align:center;
  color:var(--text-dim);font-size:1rem;line-height:2;
}
.world-copy p{margin-bottom:1rem}
.world-copy strong{color:var(--text);font-weight:600}
.world-biomes{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:1.2rem;margin-top:3rem;
}
.biome-card{
  border-radius:12px;overflow:hidden;position:relative;
  border:1px solid var(--card-border);
  height:200px;cursor:pointer;
  transition:transform .3s,box-shadow .3s;
}
.biome-card:hover{transform:translateY(-4px);box-shadow:0 12px 40px rgba(0,0,0,.4)}
.biome-bg{
  position:absolute;inset:0;
  display:flex;align-items:center;justify-content:center;
  font-size:80px;
}
.biome-card.ice .biome-bg{background:linear-gradient(135deg,#0a1628 0%,#0d2040 40%,#153560 70%,#1a4080 100%)}
.biome-card.fire .biome-bg{background:linear-gradient(135deg,#1a0a00 0%,#2d1000 40%,#501800 70%,#7a2200 100%)}
.biome-card.desert .biome-bg{background:linear-gradient(135deg,#1a1200 0%,#2d2000 40%,#503800 70%,#7a5a00 100%)}
.biome-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.9) 0%,rgba(0,0,0,.3) 60%,transparent 100%);
}
.biome-info{position:absolute;bottom:0;left:0;right:0;padding:1.2rem}
.biome-name{
  font-family:var(--font-title);font-weight:700;font-size:1.1rem;margin-bottom:.2rem;
}
.biome-card.ice .biome-name{color:#7dd3fc}
.biome-card.fire .biome-name{color:#fb923c}
.biome-card.desert .biome-name{color:#fbbf24}
.biome-desc{font-size:.78rem;color:var(--text-muted);font-family:var(--font-mono)}
.biome-creature{
  position:absolute;right:1rem;top:50%;transform:translateY(-50%);
  width:70px;height:70px;object-fit:contain;
  filter:drop-shadow(0 0 12px rgba(255,255,255,.2));
  animation:floatSlow 3s ease-in-out infinite;
}

/* ===== EGGS SECTION ===== */
#eggs{
  padding:5rem 1.5rem;
  background:linear-gradient(180deg,var(--bg2) 0%,var(--bg) 100%);
  z-index:2;
}
.eggs-inner{max-width:900px;margin:0 auto}
.eggs-header{text-align:center;margin-bottom:3rem}
.eggs-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:1.2rem;
}
.egg-card{
  border-radius:14px;padding:1.8rem 1rem 1.2rem;
  border:1px solid var(--card-border);
  background:var(--card-bg);
  backdrop-filter:blur(8px);
  text-align:center;
  transition:transform .3s,box-shadow .3s,border-color .3s;
  position:relative;overflow:hidden;
}
.egg-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:1px;
  background:linear-gradient(90deg,transparent,var(--egg-color),transparent);
}
.egg-card:hover{transform:translateY(-5px)}
.egg-card.azul{--egg-color:#3B82F6}
.egg-card.azul:hover{border-color:rgba(59,130,246,.5);box-shadow:0 8px 30px rgba(59,130,246,.15)}
.egg-card.dourado{--egg-color:#FFB800}
.egg-card.dourado:hover{border-color:rgba(255,184,0,.5);box-shadow:0 8px 30px rgba(255,184,0,.15)}
.egg-card.verde{--egg-color:#22C55E}
.egg-card.verde:hover{border-color:rgba(34,197,94,.5);box-shadow:0 8px 30px rgba(34,197,94,.15)}
.egg-card.vermelho{--egg-color:#FF2D55}
.egg-card.vermelho:hover{border-color:rgba(255,45,85,.5);box-shadow:0 8px 30px rgba(255,45,85,.15)}
.egg-img{width:80px;height:80px;object-fit:contain;margin:0 auto 1rem;animation:float 3s ease-in-out infinite}
.egg-card:nth-child(2) .egg-img{animation-delay:.7s}
.egg-card:nth-child(3) .egg-img{animation-delay:1.4s}
.egg-card:nth-child(4) .egg-img{animation-delay:2.1s}
.egg-name{
  font-family:var(--font-title);font-weight:700;font-size:1rem;
  color:var(--egg-color);margin-bottom:.3rem;
}
.egg-type{font-family:var(--font-mono);font-size:.72rem;color:var(--text-muted);margin-bottom:.6rem;letter-spacing:.08em}
.egg-desc{font-size:.82rem;color:var(--text-dim);line-height:1.6}
.egg-glow{
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 50% 100%,rgba(var(--egg-r),var(--egg-g),var(--egg-b),.06) 0%,transparent 70%);
}
.egg-card.azul{--egg-r:59;--egg-g:130;--egg-b:246}
.egg-card.dourado{--egg-r:255;--egg-g:184;--egg-b:0}
.egg-card.verde{--egg-r:34;--egg-g:197;--egg-b:94}
.egg-card.vermelho{--egg-r:255;--egg-g:45;--egg-b:85}

/* ===== EVOLUTION SECTION ===== */
#evolution{
  padding:6rem 1.5rem;
  background:var(--bg);
  z-index:2;
}
.evo-inner{max-width:1000px;margin:0 auto}
.evo-header{text-align:center;margin-bottom:4rem}
.evo-tree{
  display:flex;align-items:center;justify-content:center;
  gap:0;flex-wrap:nowrap;overflow-x:auto;padding-bottom:1rem;
}
.evo-stage{
  display:flex;flex-direction:column;align-items:center;
  gap:.6rem;flex-shrink:0;
}
.evo-connector{
  width:40px;height:2px;background:linear-gradient(90deg,var(--cyan),var(--primary));
  flex-shrink:0;margin:0 -2px;
  position:relative;top:-20px;
  animation:linePulse 2s ease-in-out infinite;
}
.evo-stage-node{
  width:80px;height:80px;border-radius:12px;
  border:1px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);
  display:flex;align-items:center;justify-content:center;
  position:relative;
  cursor:pointer;
  transition:transform .3s,box-shadow .3s,border-color .3s;
}
.evo-stage-node:hover{transform:scale(1.08);border-color:var(--cyan)}
.evo-stage-node img{width:60px;height:60px;object-fit:contain}
.evo-stage-node.locked-node{
  background:rgba(255,255,255,.02);
  border-color:rgba(255,255,255,.04);
  cursor:default;
}
.evo-stage-node.locked-node img{filter:brightness(0) opacity(.15)}
.evo-stage-node .evo-tooltip{
  position:absolute;bottom:calc(100% + 10px);left:50%;transform:translateX(-50%);
  background:rgba(11,18,36,.95);border:1px solid var(--card-border);
  border-radius:8px;padding:.7rem 1rem;
  min-width:160px;text-align:center;
  opacity:0;pointer-events:none;transition:opacity .2s;
  z-index:10;
  box-shadow:0 8px 24px rgba(0,0,0,.4);
}
.evo-stage-node:hover .evo-tooltip{opacity:1}
.evo-tooltip-name{font-family:var(--font-title);font-weight:700;font-size:.95rem;color:var(--cyan)}
.evo-tooltip-stage{font-family:var(--font-mono);font-size:.65rem;color:var(--text-muted);margin:.2rem 0}
.evo-tooltip-desc{font-size:.78rem;color:var(--text-dim);line-height:1.5}
.evo-stage-label{
  font-family:var(--font-mono);font-size:.65rem;letter-spacing:.1em;
  color:var(--text-muted);text-align:center;
}
.evo-stage-name{
  font-family:var(--font-title);font-weight:600;font-size:.8rem;
  text-align:center;
}
.locked-node .evo-stage-name{color:rgba(255,255,255,.2)}
.locked-q{
  font-size:1.5rem;color:rgba(255,255,255,.15);
  font-family:var(--font-title);font-weight:900;
}
.evo-disclaimer{
  text-align:center;margin-top:2.5rem;
  font-family:var(--font-mono);font-size:.78rem;color:var(--text-muted);
  line-height:1.8;
}
.evo-disclaimer strong{color:var(--cyan)}
.evo-node-glow{
  position:absolute;inset:-2px;border-radius:13px;
  background:conic-gradient(var(--cyan) 0deg,var(--primary) 120deg,var(--gold) 240deg,var(--cyan) 360deg);
  z-index:-1;animation:borderRotate 3s linear infinite;opacity:0;
  transition:opacity .3s;
}
.evo-stage-node:hover .evo-node-glow{opacity:.6}

/* ===== GALLERY SECTION ===== */
#gallery{
  padding:6rem 1.5rem;
  background:var(--bg2);
  z-index:2;
}
.gallery-inner{max-width:1100px;margin:0 auto}
.gallery-header{text-align:center;margin-bottom:1rem}
.gallery-rarity-legend{
  display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;
  margin-bottom:2.5rem;
}
.rarity-badge{
  display:flex;align-items:center;gap:.4rem;
  font-family:var(--font-mono);font-size:.7rem;
  padding:.25rem .7rem;border-radius:20px;border:1px solid;
}
.rarity-badge.comum{border-color:rgba(107,114,128,.4);color:#9CA3AF;background:rgba(107,114,128,.06)}
.rarity-badge.raro{border-color:rgba(59,130,246,.5);color:#60A5FA;background:rgba(59,130,246,.08)}
.rarity-badge.epico{border-color:rgba(168,85,247,.5);color:var(--purple);background:rgba(168,85,247,.08)}
.rarity-badge.lendario{border-color:rgba(255,184,0,.5);color:var(--gold);background:rgba(255,184,0,.08)}
.rarity-dot{width:8px;height:8px;border-radius:50%}
.rarity-badge.comum .rarity-dot{background:#6B7280}
.rarity-badge.raro .rarity-dot{background:#60A5FA}
.rarity-badge.epico .rarity-dot{background:var(--purple)}
.rarity-badge.lendario .rarity-dot{background:var(--gold)}
.gallery-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
  gap:1rem;
}
@media(min-width:600px){.gallery-grid{grid-template-columns:repeat(auto-fill,minmax(170px,1fr))}}
/* Card flip */
.g-card{height:220px;perspective:800px;cursor:pointer}
.g-card-inner{
  position:relative;width:100%;height:100%;
  transform-style:preserve-3d;
  transition:transform .6s cubic-bezier(.4,0,.2,1);
}
.g-card:hover .g-card-inner,.g-card.flipped .g-card-inner{transform:rotateY(180deg)}
.g-front,.g-back{
  position:absolute;inset:0;backface-visibility:hidden;
  border-radius:12px;overflow:hidden;
  display:flex;flex-direction:column;
  border:1px solid var(--card-border);
  background:var(--card-bg);
}
.g-back{transform:rotateY(180deg);padding:1rem;align-items:center;justify-content:center;text-align:center}
/* Rarity borders */
.g-card.comum .g-front,.g-card.comum .g-back{border-color:rgba(107,114,128,.3)}
.g-card.raro .g-front,.g-card.raro .g-back{border-color:rgba(59,130,246,.4);box-shadow:0 0 12px rgba(59,130,246,.1) inset}
.g-card.epico .g-front,.g-card.epico .g-back{border-color:rgba(168,85,247,.5);box-shadow:0 0 16px rgba(168,85,247,.12) inset;animation:nodePulse 2s infinite;--node-color:rgba(168,85,247,.5)}
.g-card.lendario .g-front,.g-card.lendario .g-back{border-color:rgba(255,184,0,.6);box-shadow:0 0 20px rgba(255,184,0,.15) inset}
.g-card.fundador .g-front,.g-card.fundador .g-back{border-color:var(--red);box-shadow:0 0 24px rgba(255,45,85,.2) inset}
.g-card.locked .g-front{border-color:rgba(255,255,255,.04)}
.g-img-wrap{flex:1;display:flex;align-items:center;justify-content:center;padding:1.2rem .8rem .5rem}
.g-img{width:80px;height:80px;object-fit:contain}
.g-card.lendario .g-img{filter:drop-shadow(0 0 12px rgba(255,184,0,.5))}
.g-card.epico .g-img{filter:drop-shadow(0 0 8px rgba(168,85,247,.4))}
.g-card.raro .g-img{filter:drop-shadow(0 0 8px rgba(59,130,246,.3))}
.g-card.locked .g-img{filter:brightness(0) opacity(.08)}
.g-footer{
  padding:.5rem .8rem .8rem;text-align:center;
  border-top:1px solid var(--card-border);
}
.g-name{font-family:var(--font-title);font-weight:700;font-size:.85rem;line-height:1.2}
.g-type{
  font-family:var(--font-mono);font-size:.62rem;margin-top:.2rem;
  letter-spacing:.08em;
}
.g-card.comum .g-type{color:#6B7280}
.g-card.raro .g-type{color:#60A5FA}
.g-card.epico .g-type{color:var(--purple)}
.g-card.lendario .g-type{color:var(--gold)}
.g-card.fundador .g-type{color:var(--red)}
.g-card.locked .g-name{color:rgba(255,255,255,.15)}
.g-card.locked .g-type{color:rgba(255,255,255,.08)}
.g-rarity-bar{
  height:2px;background:rgba(255,255,255,.05);
  border-radius:0 0 12px 12px;overflow:hidden;
}
.g-card.comum .g-rarity-bar .g-rarity-fill{background:#6B7280;width:25%}
.g-card.raro .g-rarity-bar .g-rarity-fill{background:#60A5FA;width:50%}
.g-card.epico .g-rarity-bar .g-rarity-fill{background:var(--purple);width:75%}
.g-card.lendario .g-rarity-bar .g-rarity-fill{
  background:linear-gradient(90deg,var(--gold),#ffd166,var(--gold));
  background-size:200% auto;animation:shimmer 2s linear infinite;width:95%;
}
.g-card.fundador .g-rarity-bar .g-rarity-fill{background:var(--red);width:100%}
/* Back face */
.g-back-skill{font-family:var(--font-mono);font-size:.65rem;color:var(--purple);margin-bottom:.5rem}
.g-back-lore{font-size:.78rem;color:var(--text-dim);line-height:1.6}
.g-back-discord{
  display:inline-block;margin-top:.8rem;padding:.35rem .9rem;
  background:rgba(88,101,242,.2);border:1px solid rgba(88,101,242,.4);
  border-radius:4px;font-family:var(--font-mono);font-size:.65rem;color:#7289da;
}
.gallery-cta{text-align:center;margin-top:2.5rem}
.gallery-note{font-family:var(--font-mono);font-size:.78rem;color:var(--text-muted);margin-bottom:1rem}

/* ===== MECHANICS SECTION ===== */
#mechanics{
  padding:6rem 1.5rem;
  background:var(--bg);
  z-index:2;
}
.mech-inner{max-width:1000px;margin:0 auto}
.mech-header{text-align:center;margin-bottom:3.5rem}
.mech-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:1.5rem}
.mech-card{
  border-radius:16px;padding:2rem;
  border:1px solid var(--card-border);
  background:var(--card-bg);
  backdrop-filter:blur(8px);
  transition:transform .3s,border-color .3s,box-shadow .3s;
  position:relative;overflow:hidden;
}
.mech-card:hover{transform:translateY(-4px)}
.mech-card.capture:hover{border-color:rgba(255,45,85,.4);box-shadow:0 8px 32px rgba(255,45,85,.1)}
.mech-card.evolve:hover{border-color:rgba(168,85,247,.4);box-shadow:0 8px 32px rgba(168,85,247,.1)}
.mech-card.dominate:hover{border-color:rgba(255,184,0,.4);box-shadow:0 8px 32px rgba(255,184,0,.1)}
.mech-icon{
  width:56px;height:56px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  font-size:1.6rem;margin-bottom:1.2rem;
}
.mech-card.capture .mech-icon{background:rgba(255,45,85,.12);color:var(--red)}
.mech-card.evolve .mech-icon{background:rgba(168,85,247,.12);color:var(--purple)}
.mech-card.dominate .mech-icon{background:rgba(255,184,0,.12);color:var(--gold)}
.mech-title{font-family:var(--font-title);font-weight:900;font-size:1.4rem;margin-bottom:.6rem}
.mech-card.capture .mech-title{color:var(--red)}
.mech-card.evolve .mech-title{color:var(--purple)}
.mech-card.dominate .mech-title{color:var(--gold)}
.mech-desc{color:var(--text-dim);font-size:.92rem;line-height:1.7}
.mech-creature{
  position:absolute;right:.5rem;bottom:.5rem;
  width:70px;height:70px;object-fit:contain;opacity:.25;
}
.mech-card:hover .mech-creature{opacity:.6;transition:opacity .3s}

/* ===== FOUNDER SECTION ===== */
#founder{
  padding:6rem 1.5rem;
  background:linear-gradient(135deg,var(--bg2) 0%,rgba(17,8,30,.8) 100%);
  z-index:2;
}
.founder-inner{max-width:920px;margin:0 auto;text-align:center}
.founder-card{
  border-radius:20px;padding:3rem 2.5rem;
  background:rgba(255,184,0,.04);
  border:1px solid rgba(255,184,0,.25);
  box-shadow:0 0 60px rgba(255,184,0,.08),0 0 120px rgba(255,184,0,.04);
  position:relative;overflow:hidden;
}
.founder-card::before{
  content:'';position:absolute;top:0;left:0;right:0;height:2px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent);
}
.founder-crown{font-size:2.5rem;margin-bottom:.8rem;display:block}
.founder-title{
  font-family:var(--font-title);font-weight:900;font-size:clamp(1.6rem,4vw,2.4rem);
  color:var(--gold);margin-bottom:.5rem;
}
.founder-sub{color:var(--text-muted);font-size:.95rem;margin-bottom:2rem}
.founder-benefits{list-style:none;text-align:left;display:inline-block;margin-bottom:2rem}
.founder-benefits li{
  display:flex;align-items:center;gap:.8rem;
  padding:.6rem 0;font-size:.95rem;
  border-bottom:1px solid rgba(255,184,0,.08);
}
.founder-benefits li:last-child{border-bottom:none}
.benefit-icon{font-size:1.2rem;min-width:28px}
.founder-limit{
  font-family:var(--font-mono);font-size:.78rem;
  color:rgba(255,184,0,.6);margin-bottom:1rem;
}
.founder-bar-wrap{
  background:rgba(255,255,255,.06);border-radius:4px;
  overflow:hidden;height:6px;margin-bottom:.5rem;
}
.founder-bar{
  height:100%;border-radius:4px;
  background:linear-gradient(90deg,var(--gold),#ffd166);
  transition:width 1.5s cubic-bezier(.4,0,.2,1);
  box-shadow:0 0 12px rgba(255,184,0,.4);
  width:0%;
}
.founder-bar-label{
  font-family:var(--font-mono);font-size:.72rem;color:var(--text-muted);
  margin-bottom:1.5rem;
}
.btn-founder{
  display:inline-flex;align-items:center;justify-content:center;gap:.7rem;
  padding:1.1rem 2.5rem;
  font-family:var(--font-cta);font-size:1.4rem;letter-spacing:.12em;
  border-radius:8px;color:var(--bg);
  background:linear-gradient(135deg,var(--gold),#ffd166,var(--gold));
  background-size:200% auto;
  box-shadow:0 0 40px rgba(255,184,0,.35);
  transition:transform .2s,box-shadow .3s,background-position .4s;
}
.btn-founder:hover{
  transform:translateY(-2px);
  box-shadow:0 0 60px rgba(255,184,0,.5);
  background-position:right center;
}

/* ===== SCREENSHOTS ===== */
#shots{padding:6rem 1.5rem;background:linear-gradient(180deg,var(--bg) 0%,var(--bg2) 100%);z-index:2}
.shots-inner{max-width:1100px;margin:0 auto}
.shots-header{text-align:center;margin-bottom:2.5rem}
.shots-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;
}
.shot{
  position:relative;aspect-ratio:16/9;border-radius:14px;overflow:hidden;cursor:pointer;
  border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.02);
  transition:transform .25s,border-color .25s,box-shadow .25s;
}
.shot:nth-child(1){grid-column:span 2;grid-row:span 2}
.shot img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s,opacity .3s}
.shot::after{
  content:'⤢';position:absolute;top:.6rem;right:.7rem;font-size:.9rem;color:#fff;
  opacity:0;transition:opacity .25s;text-shadow:0 1px 4px rgba(0,0,0,.6);
}
.shot:hover{transform:translateY(-3px);border-color:rgba(124,137,255,.5);box-shadow:0 12px 40px rgba(0,0,0,.45)}
.shot:hover img{transform:scale(1.06)}
.shot:hover::after{opacity:.9}
.shots-soon{
  text-align:center;color:var(--text-muted);font-family:var(--font-mono);
  font-size:.85rem;padding:2.5rem 1rem;border:1px dashed rgba(255,255,255,.12);
  border-radius:14px;background:rgba(255,255,255,.02);
}
/* lightbox */
.lightbox{
  position:fixed;inset:0;z-index:200;display:none;
  align-items:center;justify-content:center;padding:2rem;
  background:rgba(2,6,16,.92);backdrop-filter:blur(8px);cursor:zoom-out;
}
.lightbox.open{display:flex;animation:fadeInUp .25s ease}
.lightbox img{max-width:92vw;max-height:88vh;border-radius:12px;box-shadow:0 20px 80px rgba(0,0,0,.6);border:1px solid rgba(124,137,255,.3)}
.lightbox-close{position:absolute;top:1.2rem;right:1.4rem;font-size:2rem;color:#fff;cursor:pointer;line-height:1;opacity:.8}
.lightbox-close:hover{opacity:1}
@media(max-width:640px){
  .shots-grid{grid-template-columns:repeat(2,1fr)}
  .shot:nth-child(1){grid-column:span 2;grid-row:auto}
}

/* ===== BETA STATUS BAR (freeze) ===== */
.beta-bar{
  position:fixed;top:0;left:0;right:0;z-index:101;
  display:flex;align-items:center;justify-content:center;gap:.55rem;flex-wrap:wrap;
  padding:.42rem 1rem;
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.1em;
  text-transform:uppercase;color:#0a0600;font-weight:700;
  background:linear-gradient(90deg,#E8A500,var(--gold),#ffd76b,var(--gold),#E8A500);
  box-shadow:0 2px 16px rgba(255,184,0,.28);
}
.beta-bar a{color:#0a0600;text-decoration:underline;font-weight:700}
.beta-bar .b-pulse{width:7px;height:7px;border-radius:50%;background:#0a0600;animation:betaPulse 1.3s infinite}
@keyframes betaPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.25;transform:scale(.7)}}
body{padding-top:30px}
nav{top:30px}

/* ===== BETA CARGOS + VIP ===== */
.cargo-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;
  text-align:left;margin:2rem 0 1.5rem;
}
.cargo-card{
  position:relative;display:flex;flex-direction:column;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.09);
  border-radius:16px;padding:1.8rem 1.5rem;
}
.cargo-card.vip{
  border-color:rgba(255,184,0,.45);
  background:linear-gradient(180deg,rgba(255,184,0,.06),rgba(168,85,247,.05));
  box-shadow:0 0 40px rgba(255,184,0,.08);
}
.cargo-tag{
  position:absolute;top:-.7rem;right:1.2rem;
  font-family:var(--font-mono);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;
  padding:.25rem .7rem;border-radius:20px;color:#0a0600;font-weight:700;
  background:linear-gradient(135deg,var(--gold),#ffd166);
}
.cargo-head{display:flex;align-items:center;gap:.6rem;margin-bottom:.4rem}
.cargo-emoji{font-size:1.6rem}
.cargo-name{font-family:var(--font-title);font-weight:800;font-size:1.25rem;color:var(--text)}
.cargo-price{font-family:var(--font-mono);font-size:.78rem;color:var(--text-muted);margin-bottom:1rem}
.cargo-card.vip .cargo-price{color:var(--gold)}
.cargo-list{list-style:none;display:flex;flex-direction:column;gap:.6rem;margin-bottom:1.3rem;flex:1}
.cargo-list li{
  display:flex;gap:.55rem;align-items:flex-start;
  font-size:.88rem;color:var(--text-dim);line-height:1.45;
}
.cargo-list li b{color:var(--text);font-weight:600}
.cargo-list .ci{flex-shrink:0;color:var(--gold)}
.cargo-reward{
  margin:.2rem 0 1.3rem;padding:.9rem 1rem;border-radius:10px;
  background:rgba(0,0,0,.25);border:1px solid rgba(255,184,0,.18);
}
.cargo-reward .crh{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--gold);margin-bottom:.5rem}
.cargo-reward ul{list-style:none;display:flex;flex-direction:column;gap:.3rem}
.cargo-reward li{font-size:.84rem;color:var(--text-dim)}
.cargo-reward li::before{content:'◆ ';color:var(--gold);font-size:.6rem}
.cargo-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.8rem 1.2rem;border-radius:8px;
  font-family:var(--font-cta);font-size:1.1rem;letter-spacing:.1em;
  transition:transform .2s,box-shadow .3s,filter .25s;
}
.cargo-btn.free,.cargo-btn.paid{
  color:#fff;border:1px solid rgba(124,137,255,.4);
  background:linear-gradient(135deg,#7289DA,#5865F2,#4752C4);
  box-shadow:0 0 24px rgba(88,101,242,.35);
}
.cargo-btn.paid{font-weight:700;box-shadow:0 0 32px rgba(88,101,242,.45)}
.cargo-btn.free:hover,.cargo-btn.paid:hover{transform:translateY(-2px);filter:brightness(1.08);box-shadow:0 0 46px rgba(88,101,242,.6)}
.beta-note{
  margin-top:.5rem;padding:1rem 1.2rem;border-radius:12px;text-align:left;
  background:rgba(255,45,85,.06);border:1px solid rgba(255,45,85,.25);
  font-size:.84rem;color:var(--text-dim);line-height:1.55;
}
.beta-note strong{color:var(--text)}
@media(max-width:640px){
  .cargo-grid{grid-template-columns:1fr}
  body{padding-top:46px}
  nav{top:46px}
  .beta-bar{font-size:.6rem;letter-spacing:.04em;padding:.35rem .6rem;line-height:1.3;gap:.4rem}
}

/* ===== SOCIAL PROOF ===== */
#social{
  padding:5rem 1.5rem;
  background:var(--bg);
  z-index:2;
}
.social-inner{max-width:900px;margin:0 auto;text-align:center}
.social-stats{
  display:flex;gap:2rem;justify-content:center;flex-wrap:wrap;
  margin-bottom:3.5rem;
}
.stat-item{text-align:center}
.stat-num{
  font-family:var(--font-title);font-weight:900;
  font-size:clamp(2rem,5vw,3rem);
  background:linear-gradient(135deg,var(--cyan),var(--primary));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.stat-label{font-family:var(--font-mono);font-size:.72rem;color:var(--text-muted);letter-spacing:.15em}
.testimonials{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:1rem;text-align:left}
.testi{
  border-radius:12px;padding:1.2rem;
  border:1px solid var(--card-border);
  background:var(--card-bg);
}
.testi-text{font-size:.9rem;color:var(--text-dim);line-height:1.7;margin-bottom:.8rem}
.testi-user{display:flex;align-items:center;gap:.6rem}
.testi-avatar{
  width:32px;height:32px;border-radius:50%;
  background:linear-gradient(135deg,var(--primary),var(--cyan));
  display:flex;align-items:center;justify-content:center;
  font-size:.85rem;font-weight:700;
}
.testi-name{font-family:var(--font-mono);font-size:.75rem;color:var(--text-muted)}
.testi-platform{font-size:.65rem;color:rgba(255,255,255,.2)}
.live-feed{
  margin-top:2rem;
  border:1px solid var(--card-border);border-radius:12px;
  background:var(--card-bg);padding:1rem;max-width:500px;margin-left:auto;margin-right:auto;
}
.live-feed-header{
  font-family:var(--font-mono);font-size:.7rem;color:var(--green);
  display:flex;align-items:center;gap:.4rem;margin-bottom:.8rem;
}
.live-dot{width:6px;height:6px;border-radius:50%;background:var(--green);animation:pulse-glow 1s infinite}
.feed-item{
  font-family:var(--font-mono);font-size:.72rem;color:var(--text-muted);
  padding:.35rem 0;border-bottom:1px solid rgba(255,255,255,.04);
  display:flex;align-items:center;gap:.5rem;
}
.feed-item:last-child{border-bottom:none}
.feed-flag{font-size:.85rem}

/* ===== ROADMAP ===== */
#roadmap{
  padding:5rem 1.5rem;
  background:var(--bg2);
  z-index:2;
}
.roadmap-inner{max-width:600px;margin:0 auto;text-align:center}
.roadmap-header{margin-bottom:3rem}
.roadmap-list{text-align:left;display:inline-block;width:100%}
.rm-item{
  display:flex;align-items:flex-start;gap:1rem;
  padding:1rem 0;border-bottom:1px solid rgba(255,255,255,.05);
  position:relative;
}
.rm-item:last-child{border-bottom:none}
.rm-icon{font-size:1.2rem;min-width:28px;padding-top:.1rem}
.rm-text{}
.rm-title{font-family:var(--font-title);font-weight:700;font-size:.95rem}
.rm-desc{font-size:.82rem;color:var(--text-muted);margin-top:.15rem}
.rm-item.done .rm-title{color:var(--green)}
.rm-item.next .rm-title{color:var(--cyan)}
.rm-item.soon .rm-title{color:var(--text-muted)}
.rm-item.locked .rm-title,.rm-item.locked .rm-desc{color:rgba(255,255,255,.15)}
.rm-item.locked{opacity:.6}

/* ===== FINAL CTA ===== */
#final-cta{
  padding:7rem 1.5rem;
  background:linear-gradient(180deg,var(--bg) 0%,rgba(11,18,36,.8) 50%,var(--bg) 100%);
  text-align:center;position:relative;z-index:2;
}
.final-creature{
  width:clamp(160px,30vw,260px);margin:0 auto 2.5rem;
  filter:drop-shadow(0 0 50px rgba(79,70,229,.5)) drop-shadow(0 0 100px rgba(0,212,255,.2));
  animation:float 4.5s ease-in-out infinite;
}
.final-title{
  font-family:var(--font-title);font-weight:900;
  font-size:clamp(1.8rem,5vw,3.5rem);line-height:1.15;
  margin-bottom:1.2rem;
}
.final-title .accent{
  background:linear-gradient(135deg,var(--cyan),var(--primary));
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.final-copy{
  color:var(--text-dim);font-size:clamp(.95rem,2.5vw,1.1rem);
  max-width:520px;margin:0 auto 2.5rem;line-height:1.8;
}
.final-copy strong{color:var(--text);font-weight:500}
.btn-final{
  display:inline-flex;align-items:center;justify-content:center;gap:.8rem;
  padding:1.2rem 3rem;
  font-family:var(--font-cta);font-size:1.6rem;letter-spacing:.12em;
  border-radius:8px;color:#fff;
  background:linear-gradient(135deg,#5865F2,var(--primary));
  box-shadow:0 0 50px rgba(88,101,242,.4);
  transition:transform .2s,box-shadow .3s;
  margin-bottom:1.2rem;
}
.btn-final:hover{
  transform:translateY(-3px) scale(1.02);
  box-shadow:0 0 80px rgba(88,101,242,.6);
}
.final-disclaimer{
  font-family:var(--font-mono);font-size:.75rem;color:var(--text-muted);
}

/* ===== FOOTER ===== */
footer{
  padding:3rem 1.5rem;
  background:rgba(0,0,0,.4);
  border-top:1px solid var(--card-border);
  text-align:center;z-index:2;position:relative;
}
.footer-logo{
  font-family:var(--font-title);font-weight:900;font-size:1.2rem;
  letter-spacing:.1em;text-transform:uppercase;
  background:linear-gradient(90deg,var(--cyan),var(--primary));
  -webkit-background-clip:text;background-clip:text;color:transparent;
  margin-bottom:.8rem;
}
.footer-links{display:flex;gap:1.5rem;justify-content:center;flex-wrap:wrap;margin-bottom:.8rem}
.footer-links a{font-family:var(--font-mono);font-size:.75rem;color:var(--text-muted);transition:color .2s}
.footer-links a:hover{color:var(--text)}
.footer-copy{font-family:var(--font-mono);font-size:.7rem;color:rgba(255,255,255,.15)}

/* ===== MOBILE STICKY CTA ===== */
.sticky-cta{
  display:none;
  position:fixed;bottom:0;left:0;right:0;z-index:90;
  padding:.9rem 1.5rem;
  background:rgba(6,10,24,.95);
  border-top:1px solid rgba(88,101,242,.3);
  backdrop-filter:blur(16px);
  animation:stickySlide .4s ease;
}
.sticky-cta a{
  display:flex;align-items:center;justify-content:center;gap:.6rem;
  padding:.8rem;border-radius:6px;
  font-family:var(--font-cta);font-size:1.2rem;letter-spacing:.08em;color:#fff;
  background:linear-gradient(135deg,#5865F2,var(--primary));
  box-shadow:0 0 20px rgba(88,101,242,.3);
}
@media(max-width:640px){.sticky-cta.show{display:block}}

/* ===== SOUND BUTTON ===== */
.sound-btn{
  position:fixed;bottom:1.2rem;right:1.2rem;z-index:95;
  display:flex;align-items:center;gap:.5rem;
  padding:.5rem .9rem;border-radius:20px;
  background:rgba(3,12,30,.75);
  border:1px solid rgba(0,180,255,.2);
  font-size:.75rem;cursor:pointer;backdrop-filter:blur(12px);
  font-family:var(--font-mono);color:var(--text-muted);
  transition:background .2s,border-color .3s,color .2s;
  white-space:nowrap;
}
.sound-btn:hover{background:rgba(0,100,255,.15);border-color:rgba(0,204,255,.5);color:var(--cyan)}
.sound-btn.playing{border-color:rgba(0,204,255,.4);color:var(--cyan)}
/* invite click while muted/not yet audible */
.sound-btn:not(.playing){animation:soundPulse 1.6s ease-in-out infinite}
@keyframes soundPulse{
  0%,100%{box-shadow:0 0 0 0 rgba(0,204,255,.35)}
  50%{box-shadow:0 0 0 8px rgba(0,204,255,0)}
}
.sound-btn .sound-icon{font-size:.9rem;transition:transform .2s}
.sound-btn.playing .sound-icon{animation:pulse-glow 1.2s ease-in-out infinite}
.sound-bars{display:flex;align-items:flex-end;gap:2px;height:12px}
.sound-bar{width:3px;border-radius:1px;background:var(--cyan);opacity:.4;
  transition:opacity .3s;animation:none}
.sound-btn.playing .sound-bar{opacity:1}
.sound-btn.playing .sound-bar:nth-child(1){animation:barBounce .6s ease-in-out infinite}
.sound-btn.playing .sound-bar:nth-child(2){animation:barBounce .6s ease-in-out infinite .15s}
.sound-btn.playing .sound-bar:nth-child(3){animation:barBounce .6s ease-in-out infinite .3s}
@keyframes barBounce{
  0%,100%{height:4px}
  50%{height:12px}
}
.sound-bar:nth-child(1){height:4px}
.sound-bar:nth-child(2){height:8px}
.sound-bar:nth-child(3){height:4px}

/* ===== REVEAL ON SCROLL ===== */
/* ===== NOTAS DE ATUALIZACAO ===== */
#notas{padding:6rem 1.5rem;background:linear-gradient(180deg,var(--bg) 0%,var(--bg2) 100%);position:relative}
.pn-inner{max-width:1100px;margin:0 auto}
.pn-head{text-align:center;margin-bottom:2.5rem}
.pn-filters{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-bottom:2rem}
.pn-filter{
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;
  padding:.5rem 1rem;border-radius:999px;cursor:pointer;color:var(--text-dim);
  background:var(--card-bg);border:1px solid var(--card-border);transition:all .2s ease;
}
.pn-filter:hover{color:var(--text);border-color:rgba(0,204,255,.35)}
.pn-filter.on{color:var(--bg);background:var(--cyan);border-color:var(--cyan);font-weight:700}
.pn-list{display:flex;flex-direction:column;gap:1.25rem;position:relative}
.pn-list::before{
  content:'';position:absolute;left:7px;top:12px;bottom:12px;width:2px;
  background:linear-gradient(180deg,var(--cyan),transparent);opacity:.25;
}
.pn-card{
  position:relative;margin-left:2.25rem;padding:1.4rem 1.5rem;border-radius:14px;
  background:var(--card-bg);border:1px solid var(--card-border);
  transition:border-color .25s ease,transform .25s ease;
}
.pn-card:hover{border-color:rgba(0,204,255,.3);transform:translateY(-2px)}
.pn-card::before{
  content:'';position:absolute;left:-2.25rem;top:1.7rem;width:16px;height:16px;border-radius:50%;
  background:var(--bg);border:2px solid var(--cyan);box-shadow:0 0 12px var(--cyan-glow);
}
.pn-card.is-new::before{background:var(--cyan)}
.pn-meta{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem;margin-bottom:.6rem}
.pn-date{font-family:var(--font-mono);font-size:.72rem;color:var(--text-muted);letter-spacing:.08em}
.pn-badge{
  font-family:var(--font-mono);font-size:.63rem;letter-spacing:.14em;text-transform:uppercase;
  padding:.22rem .55rem;border-radius:5px;font-weight:700;
}
.pn-badge.update{background:rgba(0,204,255,.14);color:var(--cyan)}
.pn-badge.fix{background:rgba(0,255,136,.12);color:var(--green)}
.pn-badge.balance{background:rgba(255,184,0,.14);color:var(--gold)}
.pn-badge.compensation{background:rgba(168,85,247,.16);color:var(--purple)}
.pn-ver{font-family:var(--font-mono);font-size:.7rem;color:var(--text-muted);opacity:.8}
.pn-new{
  font-family:var(--font-mono);font-size:.6rem;letter-spacing:.16em;font-weight:700;
  background:var(--red);color:#fff;padding:.2rem .45rem;border-radius:4px;
}
.pn-title{font-family:var(--font-title);font-weight:800;font-size:1.15rem;line-height:1.3;color:var(--text)}
.pn-body{
  position:relative;margin-top:.9rem;color:var(--text-dim);font-size:.93rem;line-height:1.75;
  max-height:190px;overflow:hidden;transition:max-height .35s ease;
}
.pn-body.open{max-height:none}
.pn-body:not(.open)::after{
  content:'';position:absolute;left:0;right:0;bottom:0;height:70px;pointer-events:none;
  background:linear-gradient(180deg,transparent,var(--bg2));
}
.pn-body h3{font-family:var(--font-title);font-size:1rem;color:var(--text);margin:1.1rem 0 .4rem}
.pn-body h4{font-family:var(--font-mono);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--cyan);margin:.9rem 0 .35rem}
.pn-body p{margin:.5rem 0}
.pn-body strong{color:var(--text)}
.pn-body code{font-family:var(--font-mono);font-size:.85em;background:rgba(0,0,0,.35);padding:.1rem .35rem;border-radius:4px;color:var(--cyan)}
.pn-body ul{margin:.45rem 0 .45rem 1.1rem;padding:0;list-style:none}
.pn-body li{position:relative;padding-left:.95rem;margin:.28rem 0}
.pn-body li::before{content:'▸';position:absolute;left:0;color:var(--cyan);opacity:.7}
.pn-body blockquote{
  margin:.6rem 0;padding:.5rem .9rem;border-left:2px solid var(--gold);
  background:rgba(255,184,0,.06);color:var(--text-dim);border-radius:0 6px 6px 0;
}
.pn-more{
  margin-top:.75rem;background:none;border:0;cursor:pointer;padding:0;
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;color:var(--cyan);
}
.pn-more:hover{text-decoration:underline}
.pn-foot{display:flex;justify-content:center;margin-top:2.25rem}
.pn-load{
  font-family:var(--font-mono);font-size:.75rem;letter-spacing:.14em;text-transform:uppercase;
  padding:.8rem 1.8rem;border-radius:999px;cursor:pointer;color:var(--cyan);
  background:transparent;border:1px solid rgba(0,204,255,.35);transition:all .2s ease;
}
.pn-load:hover{background:rgba(0,204,255,.1);border-color:var(--cyan)}
.pn-empty{text-align:center;color:var(--text-muted);font-size:.9rem;padding:2rem 0}
@media(max-width:640px){
  #notas{padding:4rem 1rem}
  .pn-card{margin-left:1.75rem;padding:1.15rem 1.1rem}
  .pn-card::before{left:-1.75rem;width:13px;height:13px;top:1.5rem}
  .pn-list::before{left:5px}
}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
.reveal-delay-1{transition-delay:.1s}
.reveal-delay-2{transition-delay:.2s}
.reveal-delay-3{transition-delay:.3s}

/* ===== MOBILE (≤ 639px) ===== */
@media(max-width:639px){
  /* Nav */
  nav{padding:.75rem 1rem}

  /* Hero */
  #hero{
    align-items:center;
    padding:6rem 1rem 7rem;
  }
  .hero-inner::before{
    inset:-1.8rem -1rem;border-radius:1.25rem;
    backdrop-filter:none;-webkit-backdrop-filter:none;
    background:rgba(3,12,30,.55);
  }
  .hero-eyebrow{font-size:.65rem;letter-spacing:.16em;margin-bottom:1.1rem}
  .hero-eyebrow::before,.hero-eyebrow::after{width:18px}
  .hero-title .line1{font-size:clamp(1.45rem,6.5vw,1.9rem)}
  .hero-title .line2{font-size:clamp(1.2rem,5.5vw,1.55rem)}
  .hero-sub{font-size:.88rem;margin-bottom:1.8rem}
  .hero-ctas{flex-direction:column;align-items:stretch}
  .btn-primary,.btn-secondary{
    width:100%;justify-content:center;
    font-size:1.15rem;padding:.9rem 1.2rem;
  }
  .hero-badges{gap:.4rem}
  .hero-badge{font-size:.65rem;padding:.22rem .55rem}
  .hero-scroll{bottom:1.2rem}

  /* Quiz */
  #quiz{padding:4rem 1rem}
  .quiz-card,.result-card{padding:1.5rem 1rem}

  /* World */
  #world{padding:4rem 1rem}
  .world-biomes{grid-template-columns:1fr}

  /* Eggs */
  #eggs{padding:4rem 1rem}
  .eggs-grid{grid-template-columns:1fr 1fr}

  /* Evolution */
  #evolution{padding:4rem 1rem}
  .evo-tree{justify-content:flex-start;padding-bottom:1rem}

  /* Gallery */
  #gallery{padding:4rem 1rem}
  .gallery-grid{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}

  /* Mechanics */
  #mechanics{padding:4rem 1rem}
  .mech-grid{grid-template-columns:1fr}

  /* Founder */
  #founder{padding:4rem 1rem}
  .founder-card{padding:2rem 1.2rem}
  .founder-benefits{display:block;width:100%;text-align:left}

  /* Social */
  #social{padding:4rem 1rem}
  .social-stats{gap:1rem}
  .stat-num{font-size:clamp(1.6rem,10vw,2.4rem)}

  /* Roadmap */
  #roadmap{padding:4rem 1rem}

  /* Final CTA */
  #final-cta{padding:5rem 1rem}
  .btn-final{
    width:100%;font-size:1.25rem;
    padding:1rem 1.2rem;
  }

  /* Footer */
  footer{padding:2rem 1rem}

  /* Sound button: sobe acima do sticky CTA */
  .sound-btn{bottom:5rem;right:.8rem}

  /* Seções com section-sub: evita texto muito largo */
  .section-sub{font-size:.9rem}
}
/* =====================================================================
   [+] LIVE SITE — nav, hero media, download, account, footer
   ===================================================================== */

/* ---- NAV ---- */
.nav-links{display:none;gap:1.5rem;align-items:center;margin-left:2rem}
.nav-links a{
  font-family:var(--font-mono);font-size:.72rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--text-dim);transition:color .2s;
}
.nav-links a:hover,.nav-links a:focus-visible{color:var(--cyan)}
@media(min-width:1020px){.nav-links{display:flex}}
.nav-left{display:flex;align-items:center;min-width:0}
.nav-ico{
  width:36px;height:36px;flex:none;border-radius:7px;
  display:grid;place-items:center;
  color:#c3ccff;border:1px solid rgba(124,137,255,.35);
  background:rgba(88,101,242,.14);
  transition:background .2s,transform .2s,color .2s;
}
.nav-ico:hover,.nav-ico:focus-visible{background:rgba(88,101,242,.3);transform:translateY(-1px);color:#fff}
.nav-ico svg{width:19px;height:19px}
.nav-login{
  padding:.45rem .9rem;border-radius:6px;
  font-family:var(--font-mono);font-size:.7rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--text-dim);
  border:1px solid var(--card-border);background:transparent;
  cursor:pointer;transition:color .2s,border-color .2s;
}
.nav-login:hover,.nav-login:focus-visible{color:var(--cyan);border-color:rgba(0,204,255,.4)}
.nav-signup{
  padding:.5rem 1.1rem;border-radius:6px;cursor:pointer;
  font-family:var(--font-cta);font-size:.95rem;letter-spacing:.1em;color:#fff;
  border:1px solid rgba(90,160,255,.45);
  background:linear-gradient(135deg,#0052CC,var(--primary),#3D8BFF);
  box-shadow:0 0 18px rgba(0,102,255,.35);
  transition:transform .2s,box-shadow .3s,filter .25s;
}
.nav-signup:hover,.nav-signup:focus-visible{transform:translateY(-1px);filter:brightness(1.08);box-shadow:0 0 30px rgba(0,102,255,.5)}
/* logged-in chip */
.nav-account{
  display:none;align-items:center;gap:.55rem;cursor:pointer;
  padding:.35rem .5rem .35rem .35rem;border-radius:99px;
  border:1px solid var(--card-border);background:var(--card-bg);
  max-width:190px;
}
.nav-account.show{display:flex}
.nav-account .av{
  width:26px;height:26px;flex:none;border-radius:50%;
  display:grid;place-items:center;
  font-family:var(--font-title);font-weight:700;font-size:.78rem;color:#04121f;
  background:linear-gradient(135deg,var(--cyan),var(--primary));
}
.nav-account .em{
  font-family:var(--font-mono);font-size:.68rem;color:var(--text-dim);
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
.auth-hide{display:none !important}

/* ---- HERO: two-column with trailer ---- */
.hero-media{
  position:relative;width:100%;margin:2.4rem auto 0;max-width:560px;
  animation:fadeInUp .8s ease both;animation-delay:.9s;
}
.hero-player{
  position:relative;display:block;width:100%;aspect-ratio:16/9;
  border-radius:12px;overflow:hidden;cursor:pointer;
  border:1px solid rgba(0,180,255,.22);
  background:#050f24;
  box-shadow:0 22px 60px rgba(0,0,0,.55),0 0 46px rgba(0,102,255,.12);
  transition:transform .25s,box-shadow .3s;
}
.hero-player:hover,.hero-player:focus-visible{transform:translateY(-3px);box-shadow:0 28px 70px rgba(0,0,0,.6),0 0 60px rgba(0,204,255,.22)}
.hero-player img,.hero-player iframe{
  position:absolute;inset:0;width:100%;height:100%;border:0;
  object-fit:cover;
}
.hero-player .veil{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(3,12,30,.15),rgba(3,12,30,.72));
}
.hero-player .play{
  position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:70px;height:70px;border-radius:50%;
  display:grid;place-items:center;
  border:2px solid rgba(237,244,255,.9);background:rgba(3,12,30,.4);
  backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);
  transition:transform .25s,background .25s;
}
.hero-player:hover .play{transform:translate(-50%,-50%) scale(1.08);background:rgba(0,102,255,.45)}
.hero-player .play::after{
  content:'';width:0;height:0;margin-left:6px;
  border-left:20px solid #fff;
  border-top:12px solid transparent;border-bottom:12px solid transparent;
}
.hero-player .tag{
  position:absolute;left:.85rem;bottom:.75rem;
  font-family:var(--font-mono);font-size:.62rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--text-dim);
  background:rgba(3,12,30,.72);padding:.25rem .6rem;border-radius:4px;
}
.hero-player.soon{cursor:default}
.hero-player.soon .play{display:none}

.hero-status{
  display:inline-flex;align-items:center;gap:.5rem;
  font-family:var(--font-mono);font-size:.68rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--green);
  border:1px solid rgba(0,255,136,.28);background:rgba(0,255,136,.06);
  padding:.3rem .75rem;border-radius:99px;margin-bottom:1.1rem;
  animation:fadeInUp .8s ease both;animation-delay:.15s;
}
.hero-status i{
  width:6px;height:6px;border-radius:50%;background:var(--green);
  box-shadow:0 0 8px var(--green);font-style:normal;
}
@media(prefers-reduced-motion:no-preference){
  .hero-status i{animation:betaPulse 1.8s ease-in-out infinite}
}
.hero-meta{
  margin-top:1rem;font-family:var(--font-mono);font-size:.68rem;
  letter-spacing:.1em;color:var(--text-muted);
  animation:fadeInUp .8s ease both;animation-delay:1s;
}
.btn-play{
  display:inline-flex;align-items:center;gap:.55rem;
  padding:.9rem 2.2rem;cursor:pointer;
  font-family:var(--font-cta);font-size:1.25rem;letter-spacing:.1em;
  border-radius:6px;color:#04121f;font-weight:700;
  background:linear-gradient(135deg,#00A8D6 0%,var(--cyan) 52%,#7FE4FF 100%);
  border:1px solid rgba(140,235,255,.45);
  box-shadow:0 0 28px rgba(0,204,255,.32),0 2px 8px rgba(0,0,0,.5);
  transition:transform .2s,box-shadow .3s,filter .25s;
}
.btn-play:hover,.btn-play:focus-visible{
  transform:translateY(-2px);filter:brightness(1.07);
  box-shadow:0 0 46px rgba(0,204,255,.55),0 6px 20px rgba(0,0,0,.5);
}
.btn-dl{
  display:inline-flex;align-items:center;gap:.55rem;
  padding:.9rem 1.8rem;
  font-family:var(--font-cta);font-size:1.2rem;letter-spacing:.1em;
  border-radius:6px;color:var(--text);
  border:1px solid rgba(0,180,255,.3);background:rgba(0,100,255,.07);
  transition:transform .2s,box-shadow .3s,border-color .25s;
}
.btn-dl:hover,.btn-dl:focus-visible{
  transform:translateY(-2px);border-color:rgba(0,204,255,.6);
  box-shadow:0 0 30px rgba(0,204,255,.2);
}
@media(min-width:980px){
  .hero-inner{max-width:1160px}
  .hero-grid{
    display:grid;grid-template-columns:1.02fr .98fr;
    gap:3rem;align-items:center;text-align:left;
  }
  .hero-grid .hero-sub{margin-left:0;margin-right:0;max-width:none}
  .hero-grid .hero-ctas,.hero-grid .hero-badges{justify-content:flex-start}
  .hero-grid .hero-title{align-items:flex-start}
  .hero-media{margin:0;max-width:none}
}

/* ---- DOWNLOAD SECTION ---- */
#baixar{position:relative;padding:7rem 2rem;background:var(--bg2)}
.dl-inner{max-width:1100px;margin:0 auto;position:relative;z-index:2}
.dl-grid{
  display:grid;grid-template-columns:1fr;gap:1.6rem;margin-top:3rem;
}
@media(min-width:900px){.dl-grid{grid-template-columns:.9fr 1.1fr;align-items:start}}
.dl-card{
  border:1px solid var(--card-border);border-radius:14px;padding:2rem;
  background:linear-gradient(160deg,rgba(0,102,255,.13),rgba(0,204,255,.03));
  display:flex;flex-direction:column;gap:1.1rem;align-items:flex-start;
}
.dl-os{
  font-family:var(--font-mono);font-size:.68rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--cyan);
  border:1px solid rgba(0,204,255,.3);border-radius:99px;padding:.28rem .8rem;
}
.dl-file{font-family:var(--font-mono);font-size:.72rem;color:var(--text-muted);line-height:1.8}
.dl-steps{
  list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.7rem;
  counter-reset:dlstep;width:100%;
}
.dl-steps li{
  display:flex;gap:.8rem;align-items:flex-start;
  color:var(--text-dim);font-size:.9rem;line-height:1.6;
}
.dl-steps li::before{
  counter-increment:dlstep;content:counter(dlstep);
  flex:none;width:22px;height:22px;border-radius:50%;
  display:grid;place-items:center;margin-top:.1rem;
  font-family:var(--font-mono);font-size:.68rem;color:var(--cyan);
  border:1px solid rgba(0,204,255,.35);background:rgba(0,204,255,.07);
}
.dl-sep{width:100%;height:1px;background:linear-gradient(90deg,var(--card-border),transparent)}
.spec-wrap{overflow-x:auto;border:1px solid var(--card-border);border-radius:14px}
.spec-tbl{border-collapse:collapse;width:100%;font-size:.88rem;min-width:460px}
.spec-tbl th,.spec-tbl td{
  padding:.75rem 1rem;text-align:left;border-bottom:1px solid rgba(0,180,255,.07);
}
.spec-tbl thead th{
  font-family:var(--font-mono);font-size:.66rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--text-muted);
  background:var(--bg3);white-space:nowrap;
}
.spec-tbl thead th.rec{color:var(--cyan)}
.spec-tbl tbody tr:last-child td{border-bottom:none}
.spec-tbl td:first-child{color:var(--text-dim)}
.spec-tbl td.rec{color:var(--cyan)}
.spec-note{
  margin-top:.9rem;font-size:.78rem;color:var(--text-muted);line-height:1.6;
}

/* ---- ACCOUNT MODAL ---- */
.auth-backdrop{
  position:fixed;inset:0;z-index:400;display:none;
  align-items:center;justify-content:center;padding:1.2rem;
  background:rgba(2,7,18,.82);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);
}
.auth-backdrop.open{display:flex}
.auth-modal{
  width:100%;max-width:420px;max-height:92vh;overflow-y:auto;
  border:1px solid var(--card-border);border-radius:16px;padding:2rem;
  background:linear-gradient(165deg,var(--bg3),var(--bg));
  box-shadow:0 30px 90px rgba(0,0,0,.7);
  display:flex;flex-direction:column;gap:1.1rem;position:relative;
}
.auth-close{
  position:absolute;top:.9rem;right:.9rem;width:32px;height:32px;
  border-radius:8px;border:1px solid var(--card-border);background:transparent;
  color:var(--text-muted);font-size:1.1rem;line-height:1;cursor:pointer;
  transition:color .2s,border-color .2s;
}
.auth-close:hover,.auth-close:focus-visible{color:var(--text);border-color:rgba(0,204,255,.4)}
.auth-title{
  font-family:var(--font-title);font-weight:700;font-size:1.5rem;
  letter-spacing:.01em;color:var(--text);padding-right:2rem;
}
.auth-sub{font-size:.86rem;color:var(--text-dim);line-height:1.6}
.auth-field{display:flex;flex-direction:column;gap:.35rem}
.auth-field label{
  font-family:var(--font-mono);font-size:.64rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--text-muted);
}
.auth-field input{
  width:100%;padding:.7rem .85rem;border-radius:7px;
  border:1px solid var(--card-border);background:rgba(3,12,30,.7);
  color:var(--text);font-family:var(--font-body);font-size:.92rem;
  transition:border-color .2s,box-shadow .2s;
}
.auth-field input:focus{
  outline:none;border-color:rgba(0,204,255,.55);
  box-shadow:0 0 0 3px rgba(0,204,255,.12);
}
.auth-field input::placeholder{color:var(--text-muted)}
.auth-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.auth-btn{
  width:100%;padding:.85rem 1rem;border-radius:7px;cursor:pointer;
  font-family:var(--font-cta);font-size:1.15rem;letter-spacing:.1em;color:#fff;
  border:1px solid rgba(90,160,255,.45);
  background:linear-gradient(135deg,#0052CC,var(--primary),#3D8BFF);
  box-shadow:0 0 22px rgba(0,102,255,.3);
  transition:filter .25s,box-shadow .3s,opacity .2s;
}
.auth-btn:hover:not(:disabled),.auth-btn:focus-visible:not(:disabled){filter:brightness(1.08);box-shadow:0 0 34px rgba(0,102,255,.5)}
.auth-btn:disabled{opacity:.55;cursor:wait}
.auth-alt{
  display:flex;flex-wrap:wrap;gap:.4rem .8rem;justify-content:space-between;
  font-size:.8rem;color:var(--text-muted);
}
.auth-link{
  color:var(--cyan);cursor:pointer;background:none;border:0;padding:0;
  font-family:inherit;font-size:inherit;text-decoration:underline;
  text-underline-offset:3px;
}
.auth-link:hover,.auth-link:focus-visible{color:var(--text)}
.auth-msg{
  font-size:.82rem;line-height:1.6;padding-left:.75rem;
  border-left:2px solid var(--red);color:#FF9DB0;
}
.auth-msg.ok{border-left-color:var(--green);color:var(--green)}
.auth-msg.hidden{display:none}
.auth-fine{font-size:.72rem;color:var(--text-muted);line-height:1.6}
.auth-pane{display:none;flex-direction:column;gap:1.1rem}
.auth-pane.on{display:flex}

/* ---- VIP PACKAGE ---- */
#vip{position:relative;padding:7rem 2rem;background:var(--bg);overflow:hidden}
#vip::before{
  content:'';position:absolute;inset:0;z-index:0;
  background:radial-gradient(70% 55% at 50% 0%,rgba(255,184,0,.09),transparent 70%);
  pointer-events:none;
}
.vip-inner{max-width:1140px;margin:0 auto;position:relative;z-index:2}
.vip-head{text-align:center;margin-bottom:3rem}
.vip-stage{
  display:grid;grid-template-columns:1fr;gap:2rem;align-items:center;margin-bottom:3.5rem;
}
@media(min-width:900px){.vip-stage{grid-template-columns:.85fr 1.15fr;gap:3rem}}
.vip-model{
  position:relative;width:100%;aspect-ratio:3/4;max-height:520px;
  border:1px solid rgba(255,184,0,.22);border-radius:16px;overflow:hidden;
  background:
    radial-gradient(65% 55% at 50% 78%,rgba(255,184,0,.16),transparent 70%),
    linear-gradient(180deg,#071a33,#03101f);
}
.vip-model model-viewer{width:100%;height:100%;--poster-color:transparent}
.vip-model .mv-fallback{
  position:absolute;inset:0;display:grid;place-items:center;padding:2rem;
  text-align:center;color:var(--text-muted);font-family:var(--font-mono);font-size:.75rem;
}
.vip-model .mv-tag{
  position:absolute;left:.9rem;bottom:.85rem;z-index:3;
  font-family:var(--font-mono);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--gold);background:rgba(3,12,30,.75);padding:.3rem .65rem;border-radius:4px;
  border:1px solid rgba(255,184,0,.25);
}
.vip-pitch{display:flex;flex-direction:column;gap:1.2rem}
.vip-pitch h3{
  font-family:var(--font-title);font-weight:700;
  font-size:clamp(1.4rem,3vw,2rem);line-height:1.2;color:var(--text);
}
.vip-pitch p{color:var(--text-dim);line-height:1.7;font-size:.95rem}
.vip-loot{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(128px,1fr));gap:.6rem;
}
.loot{
  display:flex;align-items:center;gap:.6rem;padding:.55rem .7rem;
  border:1px solid var(--card-border);border-radius:9px;background:var(--card-bg);
}
.loot img{width:34px;height:34px;flex:none;object-fit:contain;image-rendering:auto}
.loot .lt{display:flex;flex-direction:column;min-width:0;line-height:1.25}
.loot .ln{font-size:.74rem;color:var(--text-dim);overflow-wrap:anywhere}
.loot .lq{
  font-family:var(--font-mono);font-size:.72rem;color:var(--cyan);
  font-variant-numeric:tabular-nums;
}
.loot.gold{border-color:rgba(255,184,0,.35);background:rgba(255,184,0,.06)}
.loot.gold .lq{color:var(--gold)}
.vip-extra-label{
  display:flex;align-items:center;gap:.8rem;margin:1.6rem 0 .8rem;
  font-family:var(--font-mono);font-size:.68rem;letter-spacing:.18em;
  text-transform:uppercase;color:var(--gold);
}
.vip-extra-label::after{content:'';flex:1;height:1px;background:linear-gradient(90deg,rgba(255,184,0,.35),transparent)}

.vip-plans{display:grid;grid-template-columns:1fr;gap:1.2rem}
@media(min-width:860px){.vip-plans{grid-template-columns:1fr 1fr}}
.plan{
  position:relative;display:flex;flex-direction:column;gap:1rem;
  border:1px solid var(--card-border);border-radius:16px;padding:1.8rem;
  background:linear-gradient(165deg,var(--bg3),var(--bg2));
}
.plan.premium{
  border-color:rgba(255,184,0,.4);
  background:linear-gradient(165deg,rgba(255,184,0,.09),var(--bg2) 60%);
  box-shadow:0 0 44px rgba(255,184,0,.09);
}
.plan-tag{
  position:absolute;top:-11px;left:50%;transform:translateX(-50%);
  font-family:var(--font-mono);font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;
  background:var(--gold);color:#1a1200;font-weight:700;
  padding:.22rem .7rem;border-radius:99px;white-space:nowrap;
}
.plan-name{
  font-family:var(--font-title);font-weight:700;font-size:1.35rem;color:var(--text);
}
.plan-price{display:flex;align-items:baseline;gap:.6rem;flex-wrap:wrap}
.plan-brl{font-family:var(--font-cta);font-size:2.2rem;letter-spacing:.03em;color:var(--gold);line-height:1}
.plan-usd{font-family:var(--font-mono);font-size:.78rem;color:var(--text-muted)}
.plan-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.45rem}
.plan-list li{
  display:flex;gap:.55rem;align-items:flex-start;
  font-size:.86rem;color:var(--text-dim);line-height:1.55;
}
.plan-list .pk{color:var(--green);flex:none}
.plan-list .pk.star{color:var(--gold)}
.plan-btn{
  margin-top:auto;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.85rem 1.4rem;border-radius:8px;
  font-family:var(--font-cta);font-size:1.15rem;letter-spacing:.1em;
  border:1px solid rgba(0,180,255,.35);background:rgba(0,100,255,.1);color:var(--text);
  transition:transform .2s,box-shadow .3s,border-color .25s;
}
.plan-btn:hover,.plan-btn:focus-visible{transform:translateY(-2px);border-color:rgba(0,204,255,.6);box-shadow:0 0 28px rgba(0,204,255,.2)}
.plan-btn.gold{
  color:#1a1200;border-color:rgba(255,215,80,.45);
  background:linear-gradient(135deg,#C98B00,var(--gold) 50%,#E8A500);
  box-shadow:0 0 26px rgba(255,184,0,.28);
}
.plan-btn.gold:hover,.plan-btn.gold:focus-visible{filter:brightness(1.07);box-shadow:0 0 42px rgba(255,184,0,.48)}
.vip-note{
  margin-top:1.6rem;text-align:center;font-size:.78rem;color:var(--text-muted);line-height:1.7;
}

/* ---- RANK ---- */
#rank{position:relative;padding:7rem 2rem;background:var(--bg2)}
.rank-inner{max-width:960px;margin:0 auto;position:relative;z-index:2}
.rank-bar{
  display:flex;align-items:center;justify-content:space-between;
  gap:1rem;flex-wrap:wrap;margin:2.4rem 0 1rem;
}
.rank-tabs{display:flex;gap:.5rem;flex-wrap:wrap}
.rank-tab{
  font-family:var(--font-mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;
  padding:.4rem .9rem;border:1px solid var(--card-border);border-radius:99px;
  color:var(--text-muted);background:transparent;cursor:pointer;
  transition:color .2s,border-color .2s,background .2s;
}
.rank-tab:hover,.rank-tab:focus-visible{color:var(--text-dim);border-color:rgba(0,204,255,.35)}
.rank-tab.on{color:#04121f;background:var(--cyan);border-color:var(--cyan);font-weight:700}
.rank-fresh{font-family:var(--font-mono);font-size:.68rem;letter-spacing:.08em;color:var(--text-muted)}
.rank-wrap{overflow-x:auto;border:1px solid var(--card-border);border-radius:14px}
.rank-tbl{border-collapse:collapse;width:100%;font-size:.88rem;min-width:520px}
.rank-tbl th,.rank-tbl td{padding:.7rem 1rem;text-align:left;border-bottom:1px solid rgba(0,180,255,.07)}
.rank-tbl thead th{
  font-family:var(--font-mono);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--text-muted);background:var(--bg3);white-space:nowrap;
}
.rank-tbl tbody tr:last-child td{border-bottom:none}
.rank-tbl td.n{font-family:var(--font-mono);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.rank-pos{font-family:var(--font-title);font-weight:700;width:3rem;color:var(--text-muted)}
.rank-pos.p1{color:var(--gold)} .rank-pos.p2{color:#cfe0f0} .rank-pos.p3{color:#c88a4a}
.rank-who{display:flex;align-items:center;gap:.6rem;min-width:0}
.rank-av{
  width:28px;height:28px;flex:none;border-radius:6px;display:grid;place-items:center;
  font-family:var(--font-title);font-weight:700;font-size:.74rem;color:#04121f;
  background:linear-gradient(135deg,var(--cyan),var(--primary));
}
.rank-nm{display:flex;flex-direction:column;line-height:1.25;min-width:0}
.rank-nm b{font-weight:600;color:var(--text);overflow-wrap:anywhere}
.rank-guild{font-family:var(--font-mono);font-size:.66rem;color:var(--text-muted)}
.rank-msg{padding:2rem;text-align:center;color:var(--text-muted);font-size:.88rem}

/* ---- PERFIL DO TREINADOR ---- */
.prof-card{
  border:1px solid var(--card-border);border-radius:12px;padding:1rem;
  background:var(--card-bg);display:flex;flex-direction:column;gap:.8rem;
}
.prof-top{display:flex;align-items:center;gap:.7rem;flex-wrap:wrap}
.prof-name{font-family:var(--font-title);font-weight:700;font-size:1.05rem;color:var(--text)}
.prof-lv{
  font-family:var(--font-mono);font-size:.68rem;letter-spacing:.1em;color:var(--cyan);
  border:1px solid rgba(0,204,255,.3);border-radius:99px;padding:.15rem .55rem;
}
.prof-stars{color:var(--gold);font-size:.8rem;letter-spacing:.1em}
.prof-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.5rem}
.pstat{
  border:1px solid var(--card-border);border-radius:8px;padding:.5rem .6rem;
  display:flex;flex-direction:column;gap:.15rem;background:rgba(3,12,30,.4);
}
.pstat .pv{
  font-family:var(--font-mono);font-size:.9rem;color:var(--text);
  font-variant-numeric:tabular-nums;display:flex;align-items:center;gap:.3rem;
}
.pstat .pv img,.pstat .pv svg{width:15px;height:15px}
.pstat .pl{font-family:var(--font-mono);font-size:.58rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-muted)}
.pstat.coin .pv{color:var(--gold)}
.prof-digis{display:flex;flex-direction:column;gap:.35rem;max-height:230px;overflow-y:auto}
.pd{
  display:flex;align-items:center;gap:.55rem;padding:.35rem .5rem;border-radius:7px;
  background:rgba(3,12,30,.45);border:1px solid transparent;
}
.pd.squad{border-color:rgba(0,204,255,.25);background:rgba(0,204,255,.06)}
.pd img{width:28px;height:28px;flex:none;object-fit:contain}
.pd .pdn{flex:1;font-size:.78rem;color:var(--text-dim);overflow-wrap:anywhere;min-width:0}
.pd .pdl{font-family:var(--font-mono);font-size:.72rem;color:var(--cyan);font-variant-numeric:tabular-nums}
.pd .pds{font-family:var(--font-mono);font-size:.56rem;letter-spacing:.1em;color:var(--text-muted);text-transform:uppercase}
.prof-empty{font-size:.82rem;color:var(--text-muted);line-height:1.6}
.prof-fresh{font-family:var(--font-mono);font-size:.62rem;color:var(--text-muted);letter-spacing:.06em}

/* ---- DIGITAL COIN ---- */
#coins{position:relative;padding:7rem 2rem;background:var(--bg2);overflow:hidden}
#coins::before{
  content:'';position:absolute;inset:0;z-index:0;pointer-events:none;
  background:radial-gradient(60% 50% at 50% 0%,rgba(255,184,0,.08),transparent 70%);
}
.coins-inner{max-width:1040px;margin:0 auto;position:relative;z-index:2}
.coins-head{text-align:center;display:flex;flex-direction:column;align-items:center;gap:.6rem}
.coin-hero{
  width:64px;height:64px;object-fit:contain;margin-bottom:.4rem;
  filter:drop-shadow(0 0 18px rgba(255,184,0,.45));
}
@media(prefers-reduced-motion:no-preference){.coin-hero{animation:coinBob 3.4s ease-in-out infinite}}
@keyframes coinBob{50%{transform:translateY(-7px)}}
.packs{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:.8rem;margin:2.6rem 0 1.4rem}
.pack{
  position:relative;border:1px solid var(--card-border);border-radius:12px;
  padding:1.2rem .9rem;text-align:center;background:var(--bg3);
  display:flex;flex-direction:column;gap:.35rem;align-items:center;
  cursor:pointer;transition:transform .2s,border-color .25s,box-shadow .3s;
}
.pack:hover,.pack:focus-visible{transform:translateY(-3px);border-color:rgba(255,184,0,.4)}
.pack.on{
  border-color:var(--gold);box-shadow:0 0 0 1px rgba(255,184,0,.3) inset,0 0 32px rgba(255,184,0,.15);
  background:linear-gradient(165deg,rgba(255,184,0,.1),var(--bg3) 70%);
}
.pack img,.pack svg{width:32px;height:32px;object-fit:contain}
.pack .amt{font-family:var(--font-cta);font-size:1.75rem;color:var(--gold);letter-spacing:.02em;line-height:1}
.pack .cur{font-family:var(--font-mono);font-size:.8rem;color:var(--text)}
.pack .usd{font-family:var(--font-mono);font-size:.64rem;color:var(--text-muted)}
.pack-ribbon{
  position:absolute;top:-9px;left:50%;transform:translateX(-50%);
  font-family:var(--font-mono);font-size:.56rem;letter-spacing:.14em;text-transform:uppercase;
  background:var(--gold);color:#1a1200;font-weight:700;padding:.16rem .55rem;border-radius:99px;white-space:nowrap;
}
.pay-row{display:flex;gap:.8rem;flex-wrap:wrap;justify-content:center;margin-top:.5rem}
.pay-btn{
  display:inline-flex;align-items:center;gap:.5rem;padding:.8rem 1.7rem;border-radius:8px;cursor:pointer;
  font-family:var(--font-cta);font-size:1.1rem;letter-spacing:.09em;
  border:1px solid rgba(0,180,255,.35);background:rgba(0,100,255,.1);color:var(--text);
  transition:transform .2s,box-shadow .3s,border-color .25s,opacity .2s;
}
.pay-btn:hover:not(:disabled),.pay-btn:focus-visible:not(:disabled){transform:translateY(-2px);border-color:rgba(0,204,255,.6);box-shadow:0 0 26px rgba(0,204,255,.2)}
.pay-btn.gold{color:#1a1200;border-color:rgba(255,215,80,.45);background:linear-gradient(135deg,#C98B00,var(--gold) 50%,#E8A500)}
.pay-btn:disabled{opacity:.5;cursor:wait}
.coins-note{margin-top:1.6rem;text-align:center;font-size:.78rem;color:var(--text-muted);line-height:1.7}
.coins-msg{
  max-width:520px;margin:1.4rem auto 0;text-align:center;font-size:.86rem;
  color:var(--text-dim);line-height:1.6;
}
.coins-msg.err{color:#FF9DB0}
.pixbox{
  max-width:420px;margin:1.6rem auto 0;border:1px solid rgba(255,184,0,.3);border-radius:14px;
  padding:1.4rem;background:var(--bg3);display:flex;flex-direction:column;gap:.9rem;align-items:center;
}
.pixbox img{width:190px;height:190px;background:#fff;border-radius:8px;padding:.35rem}
.pix-code{
  width:100%;font-family:var(--font-mono);font-size:.66rem;color:var(--text-dim);
  background:rgba(3,12,30,.7);border:1px solid var(--card-border);border-radius:7px;
  padding:.6rem;overflow-wrap:anywhere;max-height:76px;overflow-y:auto;
}
.codebox{
  max-width:460px;margin:1.6rem auto 0;border:1px solid rgba(255,184,0,.45);border-radius:14px;
  padding:1.5rem;background:linear-gradient(165deg,rgba(255,184,0,.1),var(--bg3));
  display:flex;flex-direction:column;gap:.8rem;align-items:center;text-align:center;
}
.codebox .cd{
  font-family:var(--font-mono);font-size:1.15rem;letter-spacing:.16em;color:var(--gold);
  background:rgba(3,12,30,.6);border:1px solid rgba(255,184,0,.3);border-radius:8px;
  padding:.7rem 1rem;width:100%;overflow-wrap:anywhere;
}

/* ---- CAMPANHA: 1ª RECARGA DOBRADA ---- */
.dc-camp{
  position:relative;overflow:hidden;
  max-width:640px;margin:0 auto 2.2rem;
  border:1px solid rgba(255,184,0,.45);border-radius:14px;
  padding:1.1rem 1.4rem;text-align:center;
  background:linear-gradient(135deg,rgba(255,184,0,.16),rgba(168,85,247,.1));
  box-shadow:0 0 40px rgba(255,184,0,.14);
}
.dc-camp::after{
  content:'';position:absolute;top:0;left:-60%;width:45%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.16),transparent);
  pointer-events:none;
}
@media(prefers-reduced-motion:no-preference){
  .dc-camp::after{animation:campShine 4.5s ease-in-out infinite}
}
@keyframes campShine{0%{left:-60%}55%{left:120%}100%{left:120%}}
.dc-camp .cx{
  display:inline-block;font-family:var(--font-cta);font-size:2.2rem;line-height:1;
  letter-spacing:.04em;color:var(--gold);
  text-shadow:0 0 22px rgba(255,184,0,.5);
}
.dc-camp .ct{
  font-family:var(--font-title);font-weight:700;font-size:1.15rem;color:var(--text);
  margin-top:.2rem;
}
.dc-camp .cs{font-size:.84rem;color:var(--text-dim);margin-top:.35rem;line-height:1.6}
.dc-camp .cstate{
  display:inline-block;margin-top:.7rem;
  font-family:var(--font-mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;
  padding:.3rem .8rem;border-radius:99px;border:1px solid currentColor;
}
.dc-camp .cstate.on{color:var(--green)}
.dc-camp .cstate.off{color:var(--text-muted)}
.dc-camp .cstate.anon{color:var(--cyan)}
.dc-camp.spent{
  border-color:var(--card-border);background:var(--card-bg);box-shadow:none;
}
.dc-camp.spent .cx,.dc-camp.spent .ct{color:var(--text-muted);text-shadow:none}
.dc-camp.spent::after{display:none}

/* valor dobrado dentro do card do pacote */
.pack .base{
  font-family:var(--font-mono);font-size:.72rem;color:var(--text-muted);
  text-decoration:line-through;
}
.pack .bonus{
  font-family:var(--font-mono);font-size:.64rem;letter-spacing:.06em;color:var(--green);
}
.packs.nobonus .base,.packs.nobonus .bonus{display:none}
.packs.nobonus .amt{color:var(--gold)}
.pack .amt.dobrado{color:var(--green)}

.hb-camp{
  color:var(--gold);border-color:rgba(255,184,0,.45);
  background:rgba(255,184,0,.08);
  transition:transform .2s,box-shadow .3s,background .25s;
}
.hb-camp:hover,.hb-camp:focus-visible{
  transform:translateY(-2px);background:rgba(255,184,0,.16);
  box-shadow:0 0 22px rgba(255,184,0,.28);
}

/* ---- FOOTER ---- */
.footer-note{
  margin-top:.6rem;font-family:var(--font-mono);font-size:.68rem;
  letter-spacing:.08em;color:var(--text-muted);
}

/* Visita que ja viu a abertura nao mostra o overlay nem por um quadro. */
html.sem-intro #intro-overlay{display:none !important}