/* =========================================================
   SUPER MARIO GALAXY - tema "espaço profundo"
   Tudo escopado em .galaxy / body[data-game="galaxy"]
   O céu estrelado é um <canvas> fixo com z-index -1 (atrás das seções,
   que são transparentes; rodapé e cabeçalho continuam opacos).
   ========================================================= */

body[data-game="galaxy"] { background: #070a1f; }

.galaxy {
  --gx-night: #070a1f;
  --gx-deep: #0e1240;
  --gx-violet: #5b2a9e;
  --gx-cyan: #3ad7ff;
  --gx-gold: #ffd84a;
  --gx-pink: #ff8ad8;
  --gx-teal: #7fe0d8;
  --gx-text: #e9ecff;
  --gx-muted: #b8c0ea;
  --gx-head: "Baloo 2", "Lilita One", system-ui, sans-serif;
  --gx-book: "Cormorant Garamond", Georgia, serif;
  display: block; position: relative; color: var(--gx-text);
  overflow-x: clip;
}
.galaxy .gx-sky { position: fixed; inset: 0; width: 100%; height: 100%; z-index: -1; display: block; pointer-events: none; background: radial-gradient(ellipse at 70% 20%, #1b1460 0%, #0b0d2e 45%, #050716 100%); }
.galaxy .gx-fx { position: fixed; inset: 0; width: 100%; height: 100%; z-index: 450; pointer-events: none; display: block; }
.galaxy .gx-sprites { position: absolute; width: 0; height: 0; overflow: hidden; }
.galaxy .gx-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; margin: 0; }
.galaxy .gx-wrap { max-width: 1200px; margin: 0 auto; padding: 0 20px; position: relative; }
.galaxy .gx-sec { position: relative; padding: 80px 0; overflow-x: clip; }

/* ---------- Ponteiro estelar (só dentro do <main>) ---------- */
html.gx-cursor-on .galaxy, html.gx-cursor-on .galaxy * { cursor: none; }
.galaxy .gx-cursor { position: fixed; left: 0; top: 0; z-index: 460; width: 42px; height: 42px; margin: -21px 0 0 -21px; pointer-events: none; display: none; filter: drop-shadow(0 0 6px rgba(120,220,255,.9)) drop-shadow(0 0 14px rgba(60,140,255,.6)); transition: width .15s, height .15s, margin .15s; will-change: transform; }
.galaxy .gx-cursor svg { width: 100%; height: 100%; animation: gx-twirl 6s linear infinite; }
html.gx-cursor-on .galaxy .gx-cursor.is-in { display: block; }
.galaxy .gx-cursor.is-hot { width: 54px; height: 54px; margin: -27px 0 0 -27px; }
.galaxy .gx-cursor.is-hot svg { animation-duration: 1.4s; }
.galaxy .gx-cursor.is-down svg { transform: scale(.8); }
@keyframes gx-twirl { to { transform: rotate(360deg); } }

/* ---------- HUD de Star Bits ---------- */
.galaxy .gx-hud {
  position: fixed; left: 16px; bottom: 16px; z-index: 460; display: flex; align-items: center; gap: 8px;
  padding: 6px 14px 6px 8px; border-radius: 999px; background: rgba(10,14,50,.82); border: 1.5px solid rgba(160,190,255,.45);
  font-family: var(--gx-head); font-weight: 700; color: #fff; box-shadow: 0 8px 20px rgba(0,0,0,.4);
  opacity: 0; transform: translateY(20px); transition: opacity .3s, transform .3s; pointer-events: none;
}
.galaxy .gx-hud.is-on { opacity: 1; transform: none; }
.galaxy .gx-hud.is-bump { animation: mbr-bump .3s ease; }
.galaxy .gx-hud i { width: 22px; height: 22px; background: conic-gradient(from 45deg, #ff6ad5, #ffd84a, #6aff9a, #3ad7ff, #b46aff, #ff6ad5); clip-path: polygon(50% 0, 100% 40%, 80% 100%, 20% 100%, 0 40%); }
.galaxy .gx-hud span { font-size: .85rem; color: var(--gx-muted); }
.galaxy .gx-hud b { font-size: 1.1rem; min-width: 1.6em; text-align: right; }

/* ---------- Tipografia e painéis ---------- */
.galaxy .gx-h2 {
  font-family: var(--gx-head); font-weight: 800; margin: 0 0 12px; line-height: 1.02;
  font-size: clamp(2.1rem, 5vw, 3.5rem); color: #fff; letter-spacing: .3px;
  text-shadow: 0 0 22px rgba(120,180,255,.65), 0 3px 0 #2a2fa0;
}
.galaxy .gx-eyebrow { margin: 0 0 4px; font-family: var(--gx-head); font-weight: 700; font-size: .92rem; letter-spacing: 3px; text-transform: uppercase; color: var(--gx-cyan); }
.galaxy .gx-sechead { text-align: center; max-width: 780px; margin: 0 auto 34px; }
.galaxy .gx-sechead > p:not(.gx-eyebrow) { margin: 0; color: var(--gx-muted); font-size: 1.08rem; }
.galaxy .gx-glass {
  position: relative; border-radius: 28px; padding: 28px 30px;
  background: linear-gradient(180deg, rgba(36,44,130,.5), rgba(12,14,52,.72));
  border: 1.5px solid rgba(160,190,255,.32);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 24px 60px rgba(0,0,0,.45);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
}
.galaxy .gx-glass p { line-height: 1.7; }
.galaxy strong { color: #fff; }

.galaxy .gx-btn {
  display: inline-flex; align-items: center; gap: 8px; text-decoration: none; border: 0;
  font-family: var(--gx-head); font-weight: 800; font-size: 1.05rem; color: #241600;
  padding: 11px 22px; border-radius: 999px;
  background: linear-gradient(180deg, #fff3a8, var(--gx-gold) 55%, #f0a800);
  box-shadow: 0 0 0 2px rgba(255,255,255,.5) inset, 0 0 22px rgba(255,216,74,.45), 0 6px 0 #a86a00;
  transition: transform .15s, box-shadow .15s;
}
.galaxy .gx-btn:hover { transform: translateY(-2px); box-shadow: 0 0 0 2px rgba(255,255,255,.5) inset, 0 0 34px rgba(255,216,74,.7), 0 8px 0 #a86a00; }
.galaxy .gx-btn:active { transform: translateY(4px); box-shadow: 0 0 0 2px rgba(255,255,255,.5) inset, 0 2px 0 #a86a00; }
.galaxy .gx-btn--ghost { color: #fff; background: rgba(255,255,255,.08); box-shadow: inset 0 0 0 2px rgba(160,200,255,.6), 0 0 18px rgba(80,160,255,.25); }
.galaxy .gx-btn--ghost:hover { box-shadow: inset 0 0 0 2px #bfe6ff, 0 0 28px rgba(80,160,255,.5); }
.galaxy .gx-btn[disabled] { opacity: .55; cursor: not-allowed; }

/* =========================================================
   HERO + sistema planetário
   ========================================================= */
.galaxy .gx-hero { min-height: clamp(620px, 90vh, 880px); display: flex; align-items: center; padding: 50px 0 70px; }
.galaxy .gx-hero__in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 30px; align-items: center; width: 100%; }
.galaxy .gx-kicker { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 10px; }
.galaxy .gx-kicker span { font-family: var(--mbr-font-pixel); font-size: 10px; letter-spacing: 1px; padding: 8px 10px; border-radius: 8px; background: rgba(255,255,255,.08); border: 1px solid rgba(160,190,255,.4); }
.galaxy .gx-kicker span:first-child { background: #fff; color: #0b0d2e; }
.galaxy .gx-hero__title { margin: 0; }
.galaxy .gx-hero__title img { width: min(100%, 560px); filter: drop-shadow(0 0 30px rgba(120,160,255,.5)) drop-shadow(0 10px 20px rgba(0,0,0,.5)); }
.galaxy .gx-hero__hook { font-family: var(--gx-head); font-weight: 700; font-size: clamp(1.3rem, 2.4vw, 1.85rem); line-height: 1.25; margin: 14px 0 14px; color: #fff; text-shadow: 0 0 18px rgba(120,180,255,.5); max-width: 580px; }
.galaxy .gx-hero__tip { display: flex; gap: 12px; align-items: center; max-width: 560px; margin: 0 0 22px; padding: 12px 16px; border-radius: 18px; background: rgba(255,255,255,.07); border: 1px solid rgba(160,190,255,.3); color: var(--gx-muted); }
.galaxy .gx-hero__tip svg { width: 38px; height: 38px; flex: none; filter: drop-shadow(0 0 8px rgba(120,220,255,.8)); animation: gx-twirl 8s linear infinite; }
.galaxy .gx-hero__cta { display: flex; flex-wrap: wrap; gap: 14px; }

.galaxy .gx-system { container-type: inline-size; position: relative; width: min(100%, 520px); aspect-ratio: 1; justify-self: center; }
.galaxy .gx-planet {
  position: absolute; left: 50%; top: 50%; width: 44cqw; height: 44cqw; margin: -22cqw 0 0 -22cqw; border-radius: 50%; z-index: 2;
  background: radial-gradient(circle at 34% 28%, #d8ff9a 0%, #7fd65a 22%, #3fa84a 50%, #23733a 75%, #0f3a22 100%);
  box-shadow: inset -3cqw -4cqw 6cqw rgba(0,0,0,.5), 0 0 8cqw rgba(110,230,150,.35);
}
.galaxy .gx-planet__surface {
  position: absolute; inset: 0; border-radius: 50%; overflow: hidden;
  background:
    radial-gradient(circle at 30% 70%, #ff8ad8 0 1.1cqw, transparent 1.3cqw),
    radial-gradient(circle at 70% 60%, #fff 0 .9cqw, transparent 1.1cqw),
    radial-gradient(circle at 55% 25%, #ffd84a 0 1cqw, transparent 1.2cqw),
    radial-gradient(circle at 20% 40%, rgba(255,255,255,.7) 0 .7cqw, transparent .9cqw),
    radial-gradient(ellipse at 62% 82%, #5ab0ff 0 4cqw, transparent 4.3cqw),
    radial-gradient(ellipse at 40% 45%, rgba(20,80,30,.35) 0 6cqw, transparent 6.5cqw);
  animation: gx-turn 40s linear infinite reverse;
}
.galaxy .gx-runner { position: absolute; inset: 0; border: 0; padding: 0; background: none; border-radius: 50%; animation: gx-turn 11s linear infinite; z-index: 3; }
.galaxy .gx-runner img { position: absolute; left: 50%; bottom: calc(100% - 1.2cqw); width: 10cqw; translate: -50% 0; transform-origin: 50% 100%; animation: gx-hop .5s ease-in-out infinite alternate; filter: drop-shadow(0 0 2cqw rgba(255,255,255,.35)); }
.galaxy .gx-runner.is-spin img { animation: gx-spinjump .7s ease-out; }
.galaxy .gx-runner:focus-visible { outline: 3px solid var(--mbr-yellow); outline-offset: 6px; }
@keyframes gx-turn { to { transform: rotate(360deg); } }
@keyframes gx-hop { from { transform: translateY(0) rotate(-4deg); } to { transform: translateY(-1.6cqw) rotate(4deg); } }
@keyframes gx-spinjump { 0% { transform: translateY(0) rotateY(0); } 50% { transform: translateY(-9cqw) rotateY(360deg); } 100% { transform: translateY(0) rotateY(720deg); } }

.galaxy .gx-orbit {
  --tilt: -14deg;
  position: absolute; left: 50%; top: 50%; width: var(--o); height: var(--o); margin: calc(var(--o) / -2) 0 0 calc(var(--o) / -2);
  border-radius: 50%; border: .35cqw dashed rgba(190,210,255,.28); transform: rotate(var(--tilt)) scaleY(var(--sy));
}
.galaxy .gx-orbit--a { --o: 74cqw; --sy: .3; --t: 9s; --m: 6cqw; }
.galaxy .gx-orbit--b { --o: 92cqw; --sy: .3; --t: 15s; --m: 4.4cqw; --tilt: 10deg; }
.galaxy .gx-orbit--c { --o: 96cqw; --sy: .62; --t: 24s; --m: 7cqw; --tilt: 4deg; z-index: 4; border-color: rgba(255,216,74,.18); }
.galaxy .gx-orbit--back { z-index: 1; clip-path: inset(0 0 50% 0); }
.galaxy .gx-orbit--front { z-index: 3; clip-path: inset(50% 0 0 0); }
.galaxy .gx-arm { position: absolute; inset: 0; animation: gx-turn var(--t) linear infinite; }
.galaxy .gx-orbit--b .gx-arm { animation-direction: reverse; }
.galaxy .gx-moon {
  position: absolute; left: 50%; top: 50%; width: var(--m); height: var(--m); margin: calc(var(--m) / -2) 0 0 calc(var(--m) / -2); border-radius: 50%;
  animation: gx-moon var(--t) linear infinite;
}
.galaxy .gx-orbit--b .gx-moon { animation-name: gx-moon-r; }
@keyframes gx-moon { from { transform: translateX(calc(var(--o) / 2)) rotate(0deg) scaleY(calc(1 / var(--sy))) rotate(calc(var(--tilt) * -1)); } to { transform: translateX(calc(var(--o) / 2)) rotate(-360deg) scaleY(calc(1 / var(--sy))) rotate(calc(var(--tilt) * -1)); } }
@keyframes gx-moon-r { from { transform: translateX(calc(var(--o) / 2)) rotate(0deg) scaleY(calc(1 / var(--sy))) rotate(calc(var(--tilt) * -1)); } to { transform: translateX(calc(var(--o) / 2)) rotate(360deg) scaleY(calc(1 / var(--sy))) rotate(calc(var(--tilt) * -1)); } }
.galaxy .gx-moon--rock { background: radial-gradient(circle at 35% 30%, #ffd2a0, #c06a3a 55%, #5a2412); box-shadow: inset -.8cqw -.8cqw 1.2cqw rgba(0,0,0,.4); }
.galaxy .gx-moon--ice { background: radial-gradient(circle at 35% 30%, #fff, #9fe6ff 50%, #2b7ad8); box-shadow: 0 0 2cqw rgba(140,220,255,.7); }
.galaxy .gx-moon--coin { display: grid; place-items: center; }
.galaxy .gx-moon--coin .mbr-coin { width: 5.4cqw; height: 6.4cqw; }
.galaxy .gx-system__star { position: absolute; z-index: 5; right: 4%; top: 4%; width: 17cqw; filter: drop-shadow(0 0 4cqw rgba(255,216,74,.9)); animation: gx-bob 3.6s ease-in-out infinite; }
.galaxy .gx-system__luma { position: absolute; z-index: 5; left: 3%; bottom: 8%; width: 14cqw; filter: drop-shadow(0 0 3cqw rgba(255,230,120,.8)); animation: gx-bob 3s ease-in-out infinite reverse; }
@keyframes gx-bob { 50% { transform: translateY(-2.4cqw) rotate(6deg); } }

/* =========================================================
   SOBRE
   ========================================================= */
.galaxy .gx-about { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, .9fr); gap: 34px; align-items: center; }
.galaxy .gx-about__txt p:not(.gx-eyebrow) { margin: 0 0 14px; font-size: 1.05rem; }
.galaxy .gx-about__art { margin: 0; text-align: center; }
.galaxy .gx-about__art img { width: min(100%, 420px); margin: 0 auto; filter: drop-shadow(0 0 40px rgba(255,120,60,.35)) drop-shadow(0 20px 30px rgba(0,0,0,.5)); }
.galaxy .gx-about__art figcaption { color: var(--gx-muted); font-style: italic; margin-top: 8px; }

/* =========================================================
   FICHA - constelação
   ========================================================= */
.galaxy .gx-spec { display: grid; grid-template-columns: 260px minmax(0, 1fr); gap: 34px; align-items: start; }
.galaxy .gx-spec__head img { width: 100%; max-width: 220px; border-radius: 10px; margin-top: 14px; box-shadow: 0 0 0 3px rgba(255,255,255,.15), 0 18px 40px rgba(0,0,0,.5); rotate: -3deg; }
.galaxy .gx-spec__list { margin: 0; position: relative; padding-left: 34px; display: grid; grid-template-columns: 1fr 1fr; gap: 6px 26px; }
.galaxy .gx-spec__list::before { content: ""; position: absolute; left: 9px; top: 12px; bottom: 12px; border-left: 2px dotted rgba(160,200,255,.5); }
.galaxy .gx-spec__list > div { position: relative; padding: 10px 0; }
.galaxy .gx-spec__list > div::before { content: ""; position: absolute; left: -31px; top: 14px; width: 14px; height: 14px; background: var(--gx-gold); clip-path: polygon(50% 0, 62% 38%, 100% 38%, 69% 60%, 80% 100%, 50% 75%, 20% 100%, 31% 60%, 0 38%, 38% 38%); filter: drop-shadow(0 0 6px var(--gx-gold)); }
.galaxy .gx-spec__list > div:first-child, .galaxy .gx-spec__list > div:nth-child(6), .galaxy .gx-spec__list > div:last-child { grid-column: 1 / -1; }
.galaxy .gx-spec__list dt { font-family: var(--gx-head); font-weight: 700; color: var(--gx-cyan); letter-spacing: 1px; text-transform: uppercase; font-size: .82rem; }
.galaxy .gx-spec__list dd { margin: 0; font-weight: 800; font-size: 1.04rem; }
.galaxy .gx-spec__coin .mbr-coin { width: 22px; height: 26px; vertical-align: middle; margin-left: 8px; }

/* =========================================================
   OBSERVATÓRIO - domos
   ========================================================= */
.galaxy .gx-domes { display: grid; grid-template-columns: repeat(6, 1fr); gap: 14px; margin-bottom: 24px; }
.galaxy .gx-dome { display: flex; flex-direction: column; align-items: center; gap: 4px; border: 0; padding: 10px 4px 12px; border-radius: 20px; background: transparent; color: #fff; transition: background .2s, transform .2s; }
.galaxy .gx-dome__glass {
  position: relative; width: 96px; height: 56px; border-radius: 96px 96px 8px 8px;
  background:
    radial-gradient(ellipse at 35% 25%, rgba(255,255,255,.85) 0 10%, rgba(255,255,255,0) 40%),
    linear-gradient(180deg, color-mix(in srgb, var(--d) 70%, #fff) 0%, var(--d) 55%, color-mix(in srgb, var(--d) 55%, #000) 100%);
  box-shadow: 0 0 0 3px rgba(255,255,255,.25) inset, 0 0 22px color-mix(in srgb, var(--d) 50%, transparent);
  opacity: .75; transition: opacity .2s, box-shadow .2s, transform .2s;
}
.galaxy .gx-dome__glass::after { content: ""; position: absolute; left: -8px; right: -8px; bottom: -10px; height: 12px; border-radius: 6px; background: linear-gradient(180deg, #d9dff0, #8a93b8); }
.galaxy .gx-dome b { font-family: var(--gx-head); font-weight: 700; font-size: 1.05rem; margin-top: 10px; line-height: 1.1; text-align: center; }
.galaxy .gx-dome small { font-size: .78rem; color: var(--gx-muted); letter-spacing: 1px; text-transform: uppercase; }
.galaxy .gx-dome:hover .gx-dome__glass { opacity: 1; transform: translateY(-3px); }
.galaxy .gx-dome[aria-selected="true"] { background: rgba(255,255,255,.07); }
.galaxy .gx-dome[aria-selected="true"] .gx-dome__glass { opacity: 1; transform: translateY(-4px) scale(1.06); box-shadow: 0 0 0 3px rgba(255,255,255,.4) inset, 0 0 40px var(--d), 0 0 80px color-mix(in srgb, var(--d) 50%, transparent); }
.galaxy .gx-panel { border-top: 4px solid var(--d); min-height: 280px; }
.galaxy .gx-panel[hidden] { display: none; }
.galaxy .gx-panel.is-in { animation: gx-fadeup .4s ease; }
@keyframes gx-fadeup { from { opacity: 0; transform: translateY(10px); } }
.galaxy .gx-panel h3 { font-family: var(--gx-head); font-weight: 800; font-size: 2rem; margin: 0 0 4px; color: var(--d); text-shadow: 0 0 18px color-mix(in srgb, var(--d) 60%, transparent); }
.galaxy .gx-panel > p { margin: 0 0 14px; color: var(--gx-muted); }
.galaxy .gx-galaxies { list-style: none; margin: 0 0 16px; padding: 0; display: grid; gap: 10px; }
.galaxy .gx-galaxies li { padding: 12px 16px 12px 44px; border-radius: 16px; background: rgba(255,255,255,.06); position: relative; }
.galaxy .gx-galaxies li::before { content: ""; position: absolute; left: 14px; top: 15px; width: 18px; height: 18px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #fff, var(--d) 60%, #000); box-shadow: 0 0 10px var(--d); }
.galaxy .gx-galaxies b { color: #fff; }
.galaxy .gx-boss { margin: 0; display: inline-block; padding: 8px 14px; border-radius: 999px; background: rgba(255,90,90,.14); border: 1px solid rgba(255,140,140,.4); font-weight: 800; }
.galaxy .gx-boss span { color: #ffb3b3; }
.galaxy .gx-panel__jar { position: absolute; right: 26px; bottom: 22px; width: 56px; height: 64px; border-radius: 14px 14px 18px 18px; background: linear-gradient(180deg, rgba(255,255,255,.35), rgba(255,255,255,.08)); border: 2px solid rgba(255,255,255,.45); display: grid; place-items: center; }
.galaxy .gx-panel__jar::before { content: ""; position: absolute; top: -10px; left: 8px; right: 8px; height: 10px; border-radius: 4px; background: #ffa64a; }
.galaxy .gx-panel__jar .mbr-coin { width: 26px; height: 30px; }

/* =========================================================
   POWER-UPS
   ========================================================= */
.galaxy .gx-pus { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.galaxy .gx-pu { border-radius: 22px; padding: 20px 18px; background: linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.03)); border: 1px solid rgba(160,190,255,.25); text-align: center; transition: transform .2s, box-shadow .2s; }
.galaxy .gx-pu:hover { transform: translateY(-6px); box-shadow: 0 0 30px rgba(120,180,255,.3); }
.galaxy .gx-pu svg, .galaxy .gx-pu img { width: 70px; height: 70px; object-fit: contain; margin: 0 auto 8px; filter: drop-shadow(0 0 10px rgba(255,255,255,.25)); }
.galaxy .gx-pu h3 { font-family: var(--gx-head); font-weight: 800; font-size: 1.2rem; margin: 0 0 4px; color: #fff; }
.galaxy .gx-pu p { margin: 0; font-size: .95rem; color: var(--gx-muted); }
.galaxy .gx-pu--rainbow img { animation: gx-rainbow 1.2s linear infinite; }
@keyframes gx-rainbow { to { filter: hue-rotate(360deg) drop-shadow(0 0 10px #fff); } }
.galaxy .gx-pu--red img { filter: hue-rotate(-48deg) saturate(1.8) drop-shadow(0 0 12px rgba(255,80,60,.7)); }
.galaxy .gx-mechs { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 22px; }
.galaxy .gx-mechs div { padding: 14px 16px; border-radius: 18px; border: 1px dashed rgba(160,200,255,.4); display: flex; flex-direction: column; gap: 2px; }
.galaxy .gx-mechs b { font-family: var(--gx-head); font-weight: 700; color: var(--gx-gold); font-size: 1.08rem; }
.galaxy .gx-mechs span { color: var(--gx-muted); font-size: .95rem; }

/* =========================================================
   LIVRO DA ROSALINA
   ========================================================= */
.galaxy .gx-storysec::before { content: ""; position: absolute; left: 50%; top: 55%; width: 90vw; max-width: 1100px; height: 70%; translate: -50% -50%; background: radial-gradient(ellipse, rgba(127,224,216,.18), transparent 65%); pointer-events: none; }
.galaxy .gx-book {
  position: relative; max-width: 1020px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr);
  border-radius: 10px 18px 18px 10px; color: #3a2814;
  box-shadow: 0 0 0 8px #3b2a6e, 0 0 0 11px #c9a74a, 0 0 60px rgba(170,230,255,.55), 0 0 140px rgba(120,160,255,.35), 0 30px 60px rgba(0,0,0,.5);
  animation: gx-glow 5s ease-in-out infinite;
}
@keyframes gx-glow { 50% { box-shadow: 0 0 0 8px #3b2a6e, 0 0 0 11px #c9a74a, 0 0 90px rgba(190,240,255,.75), 0 0 180px rgba(140,180,255,.45), 0 30px 60px rgba(0,0,0,.5); } }
.galaxy .gx-book__left, .galaxy .gx-book__right { position: relative; background: radial-gradient(ellipse at 50% 40%, #fffaf0 0%, #f6e7c6 70%, #e8d2a4 100%); }
.galaxy .gx-book__left { border-radius: 10px 0 0 10px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 26px; overflow: hidden; }
.galaxy .gx-book__left::after { content: ""; position: absolute; top: 0; bottom: 0; right: 0; width: 40px; background: linear-gradient(90deg, transparent, rgba(80,50,10,.25)); }
.galaxy .gx-book__left img:first-child { width: min(78%, 280px); filter: drop-shadow(0 0 20px rgba(127,224,216,.7)); }
.galaxy .gx-book__luma { position: absolute; right: 16%; top: 14%; width: 22%; animation: gx-bob 3s ease-in-out infinite; container-type: normal; }
.galaxy .gx-book__ornament { margin-top: 10px; color: #b08a2e; letter-spacing: 8px; font-size: 1.2rem; }
.galaxy .gx-book__right { border-radius: 0 18px 18px 0; padding: 40px 44px 28px; display: flex; flex-direction: column; perspective: 1400px; }
.galaxy .gx-book__right::before { content: ""; position: absolute; top: 0; bottom: 0; left: 0; width: 40px; background: linear-gradient(270deg, transparent, rgba(80,50,10,.25)); pointer-events: none; }
.galaxy .gx-chapter { flex: 1; font-family: var(--gx-book); font-size: 1.28rem; line-height: 1.55; transform-origin: 0 50%; }
.galaxy .gx-chapter[hidden] { display: none; }
.galaxy .gx-chapter.is-turn { animation: gx-turnpage .55s ease-out; }
@keyframes gx-turnpage { from { opacity: 0; transform: rotateY(-35deg); filter: blur(2px); } }
.galaxy .gx-chapter__num { margin: 0; font-family: var(--gx-head); font-weight: 700; font-size: .9rem; letter-spacing: 3px; text-transform: uppercase; color: #8a5fbf; }
.galaxy .gx-chapter__num em { text-transform: none; letter-spacing: 0; font-family: var(--gx-book); color: #b0503a; }
.galaxy .gx-chapter h3 { font-family: var(--gx-book); font-style: italic; font-weight: 600; font-size: 2.2rem; line-height: 1.1; margin: 4px 0 14px; color: #2f2160; }
.galaxy .gx-chapter p { margin: 0 0 12px; }
.galaxy .gx-chapter h3 + p::first-letter { float: left; font-size: 3.4em; line-height: .8; margin: 6px 8px 0 0; color: #b08a2e; font-weight: 600; }
.galaxy .gx-chapter__end { text-align: center; font-style: italic; font-size: 1.5rem; color: #8a5fbf; display: flex; align-items: center; justify-content: center; gap: 10px; }
.galaxy .gx-chapter__end .mbr-coin { width: 26px; height: 30px; }
.galaxy .gx-book__nav { display: flex; align-items: center; justify-content: space-between; margin-top: 16px; padding-top: 12px; border-top: 1px solid rgba(120,80,20,.25); }
.galaxy .gx-book__btn { width: 48px; height: 48px; border-radius: 50%; border: 2px solid #b08a2e; background: #fffaf0; color: #3b2a6e; font-size: 1.8rem; line-height: 1; display: grid; place-items: center; transition: background .2s, transform .2s; }
.galaxy .gx-book__btn:hover:not([disabled]) { background: #3b2a6e; color: #fff; transform: scale(1.06); }
.galaxy .gx-book__btn[disabled] { opacity: .35; }
.galaxy .gx-book__count { font-family: var(--gx-head); font-weight: 700; color: #8a5fbf; letter-spacing: 2px; }

/* =========================================================
   LUMAS
   ========================================================= */
.galaxy .gx-lumas { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; margin-bottom: 40px; }
.galaxy .gx-luma { position: relative; border: 0; padding: 40px 0 10px; background: none; display: grid; place-items: center; }
.galaxy .gx-luma img { width: min(120px, 100%); filter: hue-rotate(var(--h)) drop-shadow(0 0 16px color-mix(in srgb, #ffe27a 60%, transparent)); animation: gx-float 3.2s ease-in-out infinite; }
.galaxy .gx-luma:nth-child(2n) img { animation-delay: -1.1s; }
.galaxy .gx-luma:nth-child(3n) img { animation-delay: -2.1s; }
.galaxy .gx-luma.is-spin img { animation: gx-lumaspin .8s cubic-bezier(.3,1.4,.5,1); }
.galaxy .gx-luma:focus-visible { outline: 3px solid var(--mbr-yellow); border-radius: 20px; }
@keyframes gx-float { 50% { transform: translateY(-10px); } }
@keyframes gx-lumaspin { 0% { transform: rotate(0) scale(1); } 40% { transform: rotate(200deg) scale(1.15) translateY(-18px); } 100% { transform: rotate(360deg) scale(1); } }
.galaxy .gx-luma__say {
  position: absolute; left: 50%; top: -18px; translate: -50% 0; z-index: 2; width: max-content; max-width: 210px;
  background: #fff; color: #1d1650; font-weight: 800; font-size: .88rem; line-height: 1.3; padding: 8px 12px; border-radius: 14px;
  box-shadow: 0 6px 20px rgba(0,0,0,.35); opacity: 0; transform: translateY(8px) scale(.9); transition: opacity .2s, transform .2s; pointer-events: none; text-align: center;
}
.galaxy .gx-luma__say::after { content: ""; position: absolute; left: 50%; bottom: -8px; translate: -50% 0; border: 8px solid transparent; border-bottom: 0; border-top-color: #fff; }
.galaxy .gx-luma.is-talk .gx-luma__say { opacity: 1; transform: none; }
.galaxy .gx-luma:first-child .gx-luma__say { left: 0; translate: 0 0; }
.galaxy .gx-luma:first-child .gx-luma__say::after { left: 40px; }
.galaxy .gx-luma:last-child .gx-luma__say { left: auto; right: 0; translate: 0 0; }
.galaxy .gx-luma:last-child .gx-luma__say::after { left: auto; right: 30px; translate: 0 0; }

.galaxy .gx-hungry { display: grid; grid-template-columns: 240px minmax(0, 1fr); gap: 28px; align-items: center; max-width: 900px; margin: 0 auto; }
.galaxy .gx-hungry__stage { position: relative; width: 220px; height: 220px; display: grid; place-items: center; }
.galaxy .gx-hungry__luma { width: 170px; filter: hue-rotate(295deg) saturate(1.3) drop-shadow(0 0 22px rgba(255,138,216,.8)); animation: gx-float 2.6s ease-in-out infinite; transition: transform .8s cubic-bezier(.5,0,.5,1), opacity .5s; }
.galaxy .gx-hungry__luma.is-munch { animation: gx-munch .25s ease-in-out 4; }
@keyframes gx-munch { 50% { transform: scale(1.12, .9); } }
.galaxy .gx-hungry__planet { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; transform: scale(.2) rotate(-90deg); transition: opacity .6s .4s, transform 1s .4s cubic-bezier(.3,1.5,.5,1); filter: drop-shadow(0 0 20px rgba(255,180,240,.8)); pointer-events: none; }
.galaxy .gx-hungry__coin { position: absolute; right: 18px; top: 26px; width: 30px; height: 36px; visibility: hidden; }
.galaxy .gx-hungry.is-planet .gx-hungry__luma { transform: scale(0) rotate(720deg); opacity: 0; animation: none; }
.galaxy .gx-hungry.is-planet .gx-hungry__planet { opacity: 1; transform: none; }
.galaxy .gx-hungry.is-planet .gx-hungry__coin { visibility: visible; }
.galaxy .gx-hungry h3 { font-family: var(--gx-head); font-weight: 800; font-size: 1.8rem; margin: 0 0 6px; color: var(--gx-pink); text-shadow: 0 0 16px rgba(255,138,216,.6); }
.galaxy .gx-hungry__say { margin: 0 0 6px; font-size: 1.1rem; font-weight: 800; }
.galaxy .gx-hungry__count { margin: 0 0 14px; color: var(--gx-muted); }
.galaxy .gx-hungry__count b { color: var(--gx-gold); font-size: 1.2rem; }
.galaxy .gx-hungry__btns { display: flex; flex-wrap: wrap; gap: 12px; }
.galaxy .gx-hungry__status { margin: 14px 0 0; color: var(--gx-muted); font-size: .95rem; min-height: 3em; }

/* =========================================================
   CURIOSIDADES
   ========================================================= */
.galaxy .gx-facts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 16px 20px; counter-reset: gx; }
.galaxy .gx-facts li { counter-increment: gx; position: relative; padding: 18px 20px 18px 74px; border-radius: 22px; background: linear-gradient(90deg, rgba(91,42,158,.45), rgba(20,24,80,.5)); border: 1px solid rgba(180,160,255,.3); line-height: 1.6; }
.galaxy .gx-facts li::before { content: counter(gx); position: absolute; left: 18px; top: 16px; width: 42px; height: 42px; display: grid; place-items: center; font-family: var(--gx-head); font-weight: 800; color: #3a2a00; background: var(--gx-gold); clip-path: polygon(50% 0, 62% 35%, 100% 38%, 70% 60%, 80% 100%, 50% 78%, 20% 100%, 30% 60%, 0 38%, 38% 35%); padding-top: 4px; }
.galaxy .gx-facts b { color: #fff; font-family: var(--gx-head); font-weight: 700; font-size: 1.08rem; margin-right: 4px; }
.galaxy .gx-facts li:last-child { grid-column: 1 / -1; }

/* =========================================================
   GALAXY 2
   ========================================================= */
.galaxy .gx-g2::before { content: ""; position: absolute; inset: 10% 0; background: radial-gradient(ellipse at 70% 50%, rgba(90,200,120,.18), transparent 60%), radial-gradient(ellipse at 20% 40%, rgba(80,140,255,.18), transparent 55%); pointer-events: none; }
.galaxy .gx-g2__in { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: 30px; align-items: center; }
.galaxy .gx-g2__logo { margin: 0 0 8px; }
.galaxy .gx-g2__logo img { width: min(100%, 460px); filter: drop-shadow(0 0 24px rgba(120,220,140,.45)); }
.galaxy .gx-g2__meta { font-family: var(--gx-head); font-weight: 700; color: var(--gx-cyan); margin: 0 0 12px; }
.galaxy .gx-g2__txt > p { line-height: 1.7; margin: 0 0 12px; font-size: 1.04rem; }
.galaxy .gx-g2__stats { list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.galaxy .gx-g2__stats li { border-radius: 18px; padding: 12px 14px; background: rgba(255,255,255,.07); border: 1px solid rgba(160,230,180,.3); display: flex; flex-direction: column; }
.galaxy .gx-g2__stats b { font-family: var(--gx-head); font-weight: 800; font-size: 1.9rem; line-height: 1; color: #8dffa8; text-shadow: 0 0 14px rgba(120,255,160,.5); }
.galaxy .gx-g2__stats span { color: var(--gx-muted); font-size: .9rem; }
.galaxy .gx-g2__art { position: relative; display: grid; place-items: center; min-height: 380px; }
.galaxy .gx-ship-wrap { position: relative; width: min(74%, 300px); aspect-ratio: 240 / 220; animation: gx-bob 4s ease-in-out infinite; container-type: inline-size; }
.galaxy .gx-ship { width: 100%; height: 100%; filter: drop-shadow(0 0 30px rgba(255,180,120,.35)); }
.galaxy .gx-ship__coin { position: absolute; width: 11cqw; height: 13cqw; left: 50%; top: 31.8%; margin: -6.5cqw 0 0 -5.5cqw; }
.galaxy .gx-g2__yoshi { position: absolute; left: 0; bottom: 0; width: 110px; filter: drop-shadow(0 10px 18px rgba(0,0,0,.5)); }
.galaxy .gx-g2__cover { position: absolute; right: 0; bottom: 0; width: 140px; border-radius: 8px; rotate: 6deg; box-shadow: 0 16px 30px rgba(0,0,0,.5), 0 0 0 3px rgba(255,255,255,.2); }

/* =========================================================
   HOJE: SWITCH + FILME
   ========================================================= */
.galaxy .gx-today { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px; }
.galaxy .gx-today__card { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 22px; align-items: start; overflow: hidden; }
.galaxy .gx-today__cover { width: 100%; border-radius: 10px; box-shadow: 0 14px 30px rgba(0,0,0,.5); }
.galaxy .gx-today__card h3 { font-family: var(--gx-head); font-weight: 800; font-size: 1.45rem; line-height: 1.15; margin: 0 0 8px; color: #fff; }
.galaxy .gx-today__card p { margin: 0 0 14px; color: var(--gx-muted); }
.galaxy .gx-today__date { font-family: var(--gx-head); font-weight: 700; color: var(--gx-gold) !important; margin-bottom: 4px !important; letter-spacing: 1px; }
.galaxy .gx-today__card--film { grid-template-columns: 1fr; background: linear-gradient(160deg, rgba(120,40,160,.55), rgba(20,20,70,.75)); }
.galaxy .gx-today__logo { width: min(100%, 300px); margin: -6px auto 0; filter: drop-shadow(0 0 20px rgba(255,120,220,.45)); }
.galaxy .gx-film__coin { position: absolute; right: 22px; top: 18px; width: 22px; height: 26px; }
.galaxy .gx-film__coin::after { content: ""; position: absolute; right: 100%; top: 50%; width: 70px; height: 2px; background: linear-gradient(90deg, transparent, rgba(255,240,180,.8)); transform: rotate(-20deg); transform-origin: right center; }

/* =========================================================
   ONDE JOGAR
   ========================================================= */
.galaxy .gx-where { padding-bottom: 110px; }
.galaxy .gx-routes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.galaxy .gx-route { position: relative; padding: 70px 22px 22px; border-radius: 24px; background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02)); border: 1px solid rgba(160,190,255,.28); text-align: center; }
.galaxy .gx-route__star { position: absolute; left: 50%; top: 16px; width: 46px; height: 46px; translate: -50% 0; background: conic-gradient(from 0deg, #ffb02e, #ffe27a, #ffb02e); clip-path: polygon(50% 0, 62% 35%, 100% 38%, 70% 60%, 80% 100%, 50% 78%, 20% 100%, 30% 60%, 0 38%, 38% 35%); filter: drop-shadow(0 0 10px #ffb02e); animation: gx-twirl 10s linear infinite; }
.galaxy .gx-route::after { content: ""; position: absolute; left: 50%; top: 9px; width: 60px; height: 60px; translate: -50% 0; border-radius: 50%; border: 2px dashed rgba(255,200,90,.6); }
.galaxy .gx-route h3 { font-family: var(--gx-head); font-weight: 800; font-size: 1.35rem; margin: 0 0 6px; color: #fff; }
.galaxy .gx-route p { margin: 0 0 14px; color: var(--gx-muted); }
.galaxy .gx-route__tag { display: inline-block; font-family: var(--gx-head); font-weight: 800; font-size: .82rem; letter-spacing: 2px; padding: 4px 12px; border-radius: 8px; background: rgba(255,90,90,.18); color: #ffb3b3; text-transform: uppercase; }
.galaxy .gx-route__tag.is-on { background: rgba(110,255,160,.15); color: #8dffa8; }
body[data-game="galaxy"] .mbr-gamenav { background: #0b0d22; }

/* =========================================================
   Responsivo
   ========================================================= */
@media (max-width: 1060px) {
  .galaxy .gx-pus { grid-template-columns: repeat(2, 1fr); }
  .galaxy .gx-mechs { grid-template-columns: repeat(2, 1fr); }
  .galaxy .gx-domes { grid-template-columns: repeat(3, 1fr); }
  .galaxy .gx-today { grid-template-columns: 1fr; }
}
@media (max-width: 960px) {
  .galaxy .gx-hero { min-height: 0; padding-top: 30px; }
  .galaxy .gx-hero__in { grid-template-columns: minmax(0, 1fr); text-align: center; }
  .galaxy .gx-hero__title img { margin: 0 auto; width: min(88%, 460px); }
  .galaxy .gx-kicker, .galaxy .gx-hero__cta { justify-content: center; }
  .galaxy .gx-hero__hook, .galaxy .gx-hero__tip { margin-left: auto; margin-right: auto; }
  .galaxy .gx-hero__tip { text-align: left; }
  .galaxy .gx-system { width: min(100%, 420px); }
  .galaxy .gx-about, .galaxy .gx-g2__in, .galaxy .gx-spec { grid-template-columns: minmax(0, 1fr); }
  .galaxy .gx-about__art img { width: min(70%, 320px); }
  .galaxy .gx-spec__head { text-align: center; }
  .galaxy .gx-spec__head img { margin: 14px auto 0; max-width: 160px; }
  .galaxy .gx-book { grid-template-columns: minmax(0, 1fr); border-radius: 18px; }
  .galaxy .gx-book__left { border-radius: 18px 18px 0 0; flex-direction: row; gap: 14px; padding: 18px; }
  .galaxy .gx-book__left img:first-child { width: 120px; }
  .galaxy .gx-book__left::after { display: none; }
  .galaxy .gx-book__luma { position: static; width: 60px; }
  .galaxy .gx-book__right { border-radius: 0 0 18px 18px; }
  .galaxy .gx-book__right::before { display: none; }
  .galaxy .gx-lumas { grid-template-columns: repeat(3, 1fr); row-gap: 20px; }
  .galaxy .gx-luma:nth-child(3n+1) .gx-luma__say { left: 0; translate: 0 0; }
  .galaxy .gx-luma:nth-child(3n+1) .gx-luma__say::after { left: 40px; }
  .galaxy .gx-luma:nth-child(3n) .gx-luma__say { left: auto; right: 0; translate: 0 0; }
  .galaxy .gx-luma:nth-child(3n) .gx-luma__say::after { left: auto; right: 30px; translate: 0 0; }
  .galaxy .gx-routes { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .galaxy .gx-sec { padding: 60px 0; }
  .galaxy .gx-glass { padding: 22px 18px; border-radius: 22px; }
  .galaxy .gx-pus { grid-template-columns: 1fr 1fr; gap: 12px; }
  .galaxy .gx-pu { padding: 16px 12px; }
  .galaxy .gx-mechs { grid-template-columns: 1fr; }
  .galaxy .gx-domes { grid-template-columns: repeat(2, 1fr); gap: 8px; }
  .galaxy .gx-dome__glass { width: 80px; height: 46px; }
  .galaxy .gx-spec__list { grid-template-columns: 1fr; }
  .galaxy .gx-book__right { padding: 26px 20px 20px; }
  .galaxy .gx-chapter { font-size: 1.16rem; }
  .galaxy .gx-chapter h3 { font-size: 1.8rem; }
  .galaxy .gx-hungry { grid-template-columns: 1fr; justify-items: center; text-align: center; }
  .galaxy .gx-hungry__btns { justify-content: center; }
  .galaxy .gx-facts { grid-template-columns: 1fr; }
  .galaxy .gx-facts li { padding-left: 66px; }
  .galaxy .gx-g2__stats { grid-template-columns: 1fr 1fr; }
  .galaxy .gx-g2__stats li:last-child { grid-column: 1 / -1; }
  .galaxy .gx-g2__art { min-height: 320px; }
  .galaxy .gx-g2__cover { width: 100px; }
  .galaxy .gx-today__card { grid-template-columns: 1fr; text-align: center; }
  .galaxy .gx-today__cover { max-width: 160px; margin: 0 auto; }
  .galaxy .gx-hud { left: 10px; bottom: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  .galaxy .gx-book, .galaxy .gx-cursor svg { animation: none !important; }
}
