/* =========================================================
   SUPER MARIO WORLD - Dinosaur Land
   Tudo escopado em .smw (cabeçalho/rodapé do portal intactos)
   ========================================================= */

.smw {
  --w-ink: #1a1a40;
  --w-navy: #101858;
  --w-sky1: #58b8f8;
  --w-sky2: #c8f0ff;
  --w-green: #3cbc4c;
  --w-green-d: #0a4a20;
  --w-purple: #5b4aa8;
  --w-lav: #c4c0e8;
  --w-a: #e4002b;
  --w-b: #f6c700;
  --w-x: #1d5fd6;
  --w-y: #1a9a4a;
  --w-round: "Fredoka", "Lilita One", system-ui, sans-serif;
  --w-pixel: "Press Start 2P", ui-monospace, monospace;
  background: #eaf9ff;
  color: var(--w-ink);
  overflow-x: clip;
  font-size: 17px;
}
.smw [hidden] { display: none !important; }
.smw p { margin: 0 0 14px; }
.smw h2, .smw h3 { font-weight: 700; }
.w-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.w-wrap { max-width: 1200px; margin: 0 auto; padding: 0 16px; position: relative; }
.w-sec { position: relative; padding: clamp(72px, 9vw, 120px) 0; overflow: hidden; }

/* ---------- Tipografia ---------- */
.smw .w-kicker {
  display: inline-block; margin: 0 0 14px; padding: 9px 12px 8px; border-radius: 8px;
  font-family: var(--w-pixel); font-size: 11px; letter-spacing: 1px; color: var(--w-purple);
  background: #fff; border: 3px solid var(--w-ink); box-shadow: 0 4px 0 var(--w-ink);
}
.smw .w-h2 {
  font-family: var(--w-round); font-size: clamp(38px, 6vw, 64px); line-height: 1.02; margin: 0 0 16px; color: #fff; letter-spacing: .5px;
  text-shadow:
    3px 0 var(--w-ink), -3px 0 var(--w-ink), 0 3px var(--w-ink), 0 -3px var(--w-ink),
    2px 2px var(--w-ink), -2px -2px var(--w-ink), 2px -2px var(--w-ink), -2px 2px var(--w-ink),
    0 7px 0 var(--w-ink);
}
.smw .w-h3 { font-family: var(--w-round); font-size: 27px; line-height: 1.1; margin: 0 0 10px; }
.smw .w-lead { font-size: 18px; font-weight: 700; max-width: 760px; }
.w-sechead { margin-bottom: 40px; }

/* ---------- Botões ABXY ---------- */
.smw .w-btn {
  display: inline-flex; align-items: center; gap: 8px; text-decoration: none; cursor: pointer;
  font-family: var(--w-round); font-weight: 700; font-size: 19px; line-height: 1; letter-spacing: .3px;
  padding: 14px 24px 13px; border-radius: 999px; color: #fff; background: var(--w-a);
  border: 3px solid var(--w-ink); box-shadow: inset 0 -5px 0 rgba(0,0,0,.18), 0 5px 0 var(--w-ink);
  text-shadow: 0 2px 0 rgba(0,0,0,.35); transition: transform .12s, box-shadow .12s;
}
.smw .w-btn:hover { transform: translateY(-2px); box-shadow: inset 0 -5px 0 rgba(0,0,0,.18), 0 7px 0 var(--w-ink); }
.smw .w-btn:active { transform: translateY(4px); box-shadow: inset 0 -5px 0 rgba(0,0,0,.18), 0 1px 0 var(--w-ink); }
.smw .w-btn--a { background: var(--w-a); }
.smw .w-btn--x { background: var(--w-x); }
.smw .w-btn--y { background: var(--w-y); }
.smw .w-btn--b { background: var(--w-b); color: var(--w-ink); text-shadow: none; }
.smw .w-btn--small { font-size: 16px; padding: 11px 18px 10px; }

/* ---------- Moedas Yoshi (Dragon Coins) ---------- */
.smw .smw-dcoin {
  display: inline-block; position: relative; width: 38px; height: 60px; border-radius: 50%; cursor: pointer; vertical-align: middle;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 34'%3E%3Cpath d='M5 25c-3-4-2-10 2-12 0-5 4-8 7-5 3 0 5 3 4 6 3 1 3 6-1 7-2 4-8 7-12 4z' fill='%23b07800'/%3E%3Ccircle cx='13' cy='12' r='1.6' fill='%23fff3b0'/%3E%3C/svg%3E") center / 64% auto no-repeat,
    radial-gradient(ellipse at 35% 28%, #fff7c0 0 10%, transparent 32%),
    linear-gradient(90deg, #b07800, #ffd84a 28%, #ffec90 50%, #f0b800 74%, #8a5a00);
  border: 3px solid #5a3a00; box-shadow: inset 0 0 0 3px #ffe680, 0 4px 0 rgba(0,0,0,.25);
  animation: w-dspin 1.8s linear infinite;
}
.smw .smw-dcoin--static { animation: none; cursor: default; }
@keyframes w-dspin { 0%, 100% { transform: scaleX(1); } 50% { transform: scaleX(.22); } }

/* =========================================================
   HERO
   ========================================================= */
.w-hero {
  position: relative; overflow: hidden; isolation: isolate;
  min-height: min(880px, calc(100vh - 70px));
  display: flex; flex-direction: column;
  background: linear-gradient(var(--w-sky1) 0%, #8ad4ff 42%, var(--w-sky2) 85%);
}
.w-sky-layer { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.smw .w-cloud {
  position: absolute; display: block; width: 150px; height: 64px; pointer-events: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 150 64'%3E%3Cpath d='M22 60C10 60 3 52 5 43S17 31 24 33C24 19 38 10 50 16 56 4 76 2 84 14 92 6 108 8 112 20 124 18 136 26 136 38 147 40 149 60 134 60Z' fill='%23fff' stroke='%23264a7a' stroke-width='4' stroke-linejoin='round'/%3E%3Cellipse cx='62' cy='38' rx='3.5' ry='7' fill='%23111'/%3E%3Cellipse cx='80' cy='38' rx='3.5' ry='7' fill='%23111'/%3E%3C/svg%3E") center / contain no-repeat;
}
.w-cloud--1 { top: 16%; left: -160px; animation: w-drift 46s linear infinite; }
.w-cloud--2 { top: 34%; left: -160px; transform: scale(.75); animation: w-drift 62s linear -24s infinite; }
.w-cloud--3 { top: 8%; left: -160px; transform: scale(.9); animation: w-drift 54s linear -40s infinite; }
@keyframes w-drift { to { left: calc(100% + 40px); } }
.smw .w-hero__coin { position: absolute; z-index: 3; top: 122px; right: 16%; }
.smw .w-cloud--hide { z-index: 4; top: 114px; right: calc(16% - 70px); width: 180px; height: 78px; animation: w-peek 7s ease-in-out infinite alternate; }
@keyframes w-peek { 0%, 35% { transform: translateX(0); } 65%, 100% { transform: translateX(150px); } }

.w-hills { position: absolute; left: 0; width: 100%; pointer-events: none; will-change: transform; }
.w-hills--far { z-index: 1; bottom: 60px; height: 64%; }
.w-hills--near { z-index: 2; bottom: 60px; height: 38%; }
.w-hill-far { fill: #9ae89a; }
.w-hill-near { fill: #3cbc4c; }

.smw .w-ground {
  position: relative; z-index: 3; height: 76px; flex: none;
  background:
    radial-gradient(circle, #8a4a18 0 3px, transparent 3.5px) 0 0 / 30px 26px,
    radial-gradient(circle, #a8622a 0 2px, transparent 2.5px) 15px 13px / 30px 26px,
    #d89048;
  border-top: 14px solid #48c848;
  box-shadow: 0 -5px 0 var(--w-green-d);
}

.w-hud {
  position: relative; z-index: 5; width: 100%; max-width: 1140px; margin: 22px auto 0; padding: 0 16px;
  display: flex; justify-content: space-between; align-items: center; gap: 12px;
  font-family: var(--w-pixel); font-size: 13px; color: #fff;
  text-shadow: 2px 2px 0 #000, -2px 0 0 #000, 0 -2px 0 #000, 2px 0 0 #000;
}
.w-hud__cell { display: flex; flex-direction: column; gap: 8px; }
.w-hud__mario { color: #ff4a5a; }
.w-hud__time { color: var(--w-b); }
.w-hud__lbl { font-size: 9px; color: #fff; }
.w-hud__slots { display: flex; gap: 5px; }
.w-hud__slots i { width: 14px; height: 22px; border-radius: 50%; background: rgba(0,0,0,.25); border: 2px solid #000; }
.w-hud__slots i.is-on { background: linear-gradient(90deg, #b07800, #ffe680 50%, #f0b800); animation: w-pop .4s ease; }
@keyframes w-pop { 50% { transform: scale(1.4); } }
.w-hud__reserve {
  width: 68px; height: 68px; display: grid; place-items: center; flex: none;
  background: rgba(16,24,88,.55); border: 4px solid #fff; border-radius: 6px; box-shadow: 0 0 0 3px #000, inset 0 0 0 3px #000;
}
.w-hud__reserve img { width: 44px; height: 44px; object-fit: contain; animation: w-float 2.2s ease-in-out infinite; }
@keyframes w-float { 50% { transform: translateY(-4px) rotate(-6deg); } }

.w-hero__in {
  position: relative; z-index: 4; flex: 1; width: 100%; max-width: 1200px; margin: 0 auto; padding: 20px 16px 30px;
  display: grid; grid-template-columns: 1.05fr .95fr; gap: 28px; align-items: center;
}
.w-logo { margin: 0 0 18px; line-height: 0; }
.w-logo img { width: min(540px, 100%); height: auto; filter: url(#w-key) drop-shadow(0 6px 0 rgba(26,26,64,.25)); }
.w-chips { list-style: none; margin: 0 0 18px; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
.w-chip {
  font-family: var(--w-round); font-weight: 700; font-size: 16px; color: #fff; padding: 6px 15px 7px; border-radius: 999px;
  border: 3px solid var(--w-ink); box-shadow: 0 4px 0 var(--w-ink); text-shadow: 0 2px 0 rgba(0,0,0,.3);
}
.w-chip--a { background: var(--w-a); } .w-chip--x { background: var(--w-x); } .w-chip--y { background: var(--w-y); }
.w-hook {
  font-size: 19px; font-weight: 800; max-width: 540px; background: rgba(255,255,255,.82); border: 3px solid var(--w-ink);
  border-radius: 18px; padding: 16px 20px; box-shadow: 0 6px 0 rgba(26,26,64,.25); margin-bottom: 24px !important;
}
.w-cta { display: flex; flex-wrap: wrap; gap: 14px; }
.w-hero__art { margin: 0; justify-self: center; }
.w-hero__art img { width: min(540px, 100%); height: auto; filter: drop-shadow(0 14px 0 rgba(10,74,32,.25)); animation: w-ride 2.6s ease-in-out infinite; }
@keyframes w-ride { 50% { transform: translateY(-12px); } }

/* =========================================================
   CAIXA DE MENSAGEM (estilo do jogo)
   ========================================================= */
.smw .w-msgbox {
  position: relative; background: var(--w-navy); color: #fff; border: 4px solid #fff; border-radius: 6px;
  box-shadow: 0 0 0 4px var(--w-navy), 0 0 0 7px var(--w-ink), 0 14px 0 7px rgba(26,26,64,.25);
  padding: 26px 26px 18px;
}
.w-msgbox__name { font-family: var(--w-pixel); font-size: 15px; line-height: 1.5; color: var(--w-b); margin-bottom: 8px !important; }
.w-msgbox__pt { font-family: var(--w-pixel); font-size: 9px; line-height: 1.6; color: #8ad4ff; }
.w-msgbox__txt { font-size: 17px; line-height: 1.6; }

/* =========================================================
   SOBRE
   ========================================================= */
.w-sobre { background: linear-gradient(var(--w-sky2), #f2fbff); }
.w-sobre__grid { display: grid; grid-template-columns: 1.35fr .75fr; gap: 56px; align-items: center; }
.w-msgbox--big { padding: 46px 40px 26px; }
.w-msgbox--big p { font-size: 17.5px; line-height: 1.65; }
.w-msgblock {
  position: absolute; top: -40px; right: 34px; width: 60px; height: 60px; border-radius: 6px;
  background: #e8a040; border: 4px solid var(--w-ink); box-shadow: inset 0 -6px 0 #b06a20, inset 0 6px 0 #ffd090;
  animation: w-bob 2s ease-in-out infinite;
}
.w-msgblock::before {
  content: ""; position: absolute; left: 10px; top: 11px; width: 32px; height: 22px; background: #fff; border-radius: 10px; border: 3px solid var(--w-ink);
}
.w-msgblock::after { content: ""; position: absolute; left: 18px; top: 36px; border: 7px solid transparent; border-top-color: var(--w-ink); }
@keyframes w-bob { 50% { transform: translateY(-6px); } }
.w-pad-art { margin: 0; text-align: center; }
.w-pad-art svg { width: 100%; max-width: 420px; margin: 0 auto 10px; filter: drop-shadow(0 10px 0 rgba(26,26,64,.18)); }
.w-pad-art figcaption { font-weight: 800; font-size: 15px; color: #3a3a6a; }
.w-pad-art__b { animation: w-press 4s ease-in-out infinite; transform-box: fill-box; transform-origin: center; }
.w-pad-art__b:nth-of-type(2) { animation-delay: 1s; } .w-pad-art__b:nth-of-type(3) { animation-delay: 2s; } .w-pad-art__b:nth-of-type(4) { animation-delay: 3s; }
@keyframes w-press { 0%, 20%, 100% { transform: none; } 10% { transform: scale(.82); } }

/* =========================================================
   FICHA (seleção de arquivo)
   ========================================================= */
.w-ficha {
  color: #fff;
  background:
    radial-gradient(circle, rgba(255,255,255,.5) 0 1px, transparent 1.6px) 0 0 / 70px 60px,
    linear-gradient(135deg, #22195a, var(--w-purple));
}
.w-ficha__grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 50px; align-items: center; }
.w-box { margin: 0; }
.w-box img { width: 100%; border-radius: 10px; border: 5px solid #fff; box-shadow: 0 0 0 4px var(--w-ink), 0 18px 34px rgba(0,0,0,.4); transform: rotate(-3deg); }
.w-file { background: #06061e; border: 4px solid #fff; border-radius: 8px; box-shadow: 0 0 0 4px #06061e, 0 0 0 7px #8ad4ff; padding: 26px 28px 14px; }
.w-file__top { font-family: var(--w-pixel); font-size: 10px; color: #8ad4ff; letter-spacing: 1px; }
.smw .w-file__t { font-family: var(--w-pixel); font-weight: 400; font-size: clamp(13px, 1.7vw, 17px); line-height: 1.6; margin: 0 0 14px; color: #fff; }
.w-file__cursor { color: var(--w-b); animation: w-blink 1s steps(1) infinite; }
.w-file__star { color: var(--w-b); white-space: nowrap; }
@keyframes w-blink { 50% { opacity: 0; } }
.w-file__dl { margin: 0; }
.w-file__dl div { display: grid; grid-template-columns: 210px 1fr; gap: 14px; padding: 11px 0; border-top: 2px dashed rgba(255,255,255,.18); align-items: baseline; }
.w-file__dl dt { font-family: var(--w-pixel); font-size: 9.5px; line-height: 1.6; color: var(--w-b); }
.w-file__dl dd { margin: 0; font-weight: 800; font-size: 16.5px; }

/* =========================================================
   MAPA
   ========================================================= */
.w-mapa {
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='40'%3E%3Cpath d='M0 26q20-12 40 0t40 0' fill='none' stroke='%234a7cf0' stroke-width='3'/%3E%3C/svg%3E"),
    linear-gradient(#2f63e0, #1d47b8);
  color: #fff;
}
.w-mapa .w-lead { color: #fff; }
.w-map { --land: #48c050; --land-d: #0a4a20; --hill: #98e898; --tree: #0a7a2a; --tree2: #3cbc4c; display: grid; grid-template-columns: 1.75fr 1fr; gap: 26px; align-items: start; }
.w-map.is-autumn { --land: #e8a040; --land-d: #7a3a08; --hill: #f8c870; --tree: #c84a18; --tree2: #f08a2a; }
.w-map__frame {
  position: relative; border: 6px solid #fff; border-radius: 16px; overflow: hidden; background: #2f63e0;
  box-shadow: 0 0 0 4px var(--w-ink), 0 16px 0 4px rgba(0,0,0,.25);
}
.w-map__svg { display: block; width: 100%; height: auto; }
.w-sea { fill: #2f63e0; }
.w-land { fill: var(--land); stroke: var(--land-d); stroke-width: 5; transition: fill .9s, stroke .9s; }
.w-choco { fill: #a0602a; stroke: #4a2208; stroke-width: 5; }
.w-valley { fill: #4a3f55; stroke: #111; stroke-width: 5; }
.w-starpanel { fill: #12124a; stroke: #fff; stroke-width: 4; }
.w-specialpanel { stroke: #fff; stroke-width: 4; }
.w-hillmini { fill: var(--hill); stroke: var(--land-d); stroke-width: 3; transition: fill .9s; }
.w-trees { fill: var(--tree); stroke: #063a14; stroke-width: 3; transition: fill .9s; }
.w-trees2 { fill: var(--tree2); transition: fill .9s; }
.w-smoke { animation: w-smoke 2.4s ease-out infinite; transform-box: fill-box; transform-origin: center; }
@keyframes w-smoke { 0% { transform: translateY(0) scale(.6); opacity: .9; } 100% { transform: translateY(-22px) scale(1.6); opacity: 0; } }
.w-seg { fill: none; stroke: #fff6c8; stroke-width: 7; stroke-linecap: round; stroke-dasharray: .1 15; }
.w-seg--star { stroke: #ffe000; stroke-width: 8; stroke-dasharray: .1 13; filter: drop-shadow(0 0 3px #fff6a0); }
.w-node { cursor: pointer; }
.w-node circle { fill: var(--w-b); stroke: var(--w-ink); stroke-width: 5; transition: r .2s; }
.w-node--boss circle { fill: #e4002b; }
.w-node--star circle { fill: #fff; }
.w-node:hover circle { r: 18; }
.w-node.is-on circle { animation: w-nodepulse 1s ease-in-out infinite; }
@keyframes w-nodepulse { 50% { stroke: #fff; } }
.w-node text {
  font-family: var(--w-pixel); font-size: 13px; fill: #fff; stroke: var(--w-ink); stroke-width: 5px; paint-order: stroke;
  text-anchor: middle; pointer-events: none;
}
.w-mario { pointer-events: none; }
.w-mario.is-walking .w-mario__b { animation: w-walk .22s steps(2) infinite; }
@keyframes w-walk { 50% { transform: translateY(-3px); } }
.smw .w-map__coin { position: absolute; z-index: 2; left: 17.6%; top: 44%; transform: scale(.72); }
.w-map__secret {
  position: absolute; z-index: 1; left: 10%; top: 39.5%; font-family: var(--w-pixel); font-size: 7px; line-height: 1.4; color: #fff;
  background: rgba(16,24,88,.75); padding: 3px 5px; border-radius: 3px; pointer-events: none;
}
.w-map__side { display: grid; gap: 22px; }
.w-map__msg { min-height: 220px; }
.w-map__msg .w-btn { margin-top: 4px; }
.w-places { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; counter-reset: lugar; }
.w-places li { counter-increment: lugar; }
.w-places button {
  width: 100%; display: flex; align-items: center; gap: 8px; text-align: left; cursor: pointer;
  font-family: var(--w-round); font-weight: 600; font-size: 15px; line-height: 1.15; color: var(--w-ink);
  background: #fff; border: 3px solid var(--w-ink); border-radius: 12px; padding: 8px 10px; box-shadow: 0 3px 0 var(--w-ink);
  transition: background .15s, transform .15s;
}
.w-places button::before {
  content: counter(lugar); flex: none; width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%;
  font-family: var(--w-pixel); font-size: 9px; background: var(--w-b); border: 2px solid var(--w-ink);
}
.w-places button:hover { transform: translateY(-2px); }
.w-places button[aria-pressed="true"] { background: var(--w-b); }
.w-places button[aria-pressed="true"]::before { background: #fff; }

/* =========================================================
   YOSHIS
   ========================================================= */
.w-yoshi {
  background:
    radial-gradient(circle at 30px 30px, #c4f4b4 0 13px, transparent 14px) 0 0 / 100px 100px,
    radial-gradient(circle at 80px 74px, #c4f4b4 0 9px, transparent 10px) 0 0 / 100px 100px,
    #dcf8cc;
}
.w-yoshi__grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 44px; align-items: center; margin-bottom: 70px; }
.w-ystage {
  position: relative; margin: 0; min-height: 440px; display: grid; place-items: end center; padding-bottom: 20px;
  background: radial-gradient(circle at 50% 55%, #fff 0 34%, rgba(255,255,255,0) 62%);
}
.w-ystage__img { position: relative; z-index: 1; height: 420px; width: auto; object-fit: contain; transition: filter .35s; filter: drop-shadow(0 8px 0 rgba(26,26,64,.15)); }
.w-ystage__shadow { position: absolute; bottom: 16px; left: 50%; width: 200px; height: 22px; transform: translateX(-50%); background: rgba(10,74,32,.25); border-radius: 50%; }
.w-ystage.is-hop .w-ystage__img { animation: w-yhop .5s cubic-bezier(.3,1.6,.5,1); }
@keyframes w-yhop { 40% { transform: translateY(-36px) scale(1.04, .96); } }
.w-ystage[data-color="vermelho"] .w-ystage__img { filter: hue-rotate(-113deg) saturate(2.6) brightness(.8) drop-shadow(0 8px 0 rgba(26,26,64,.15)); }
.w-ystage[data-color="azul"] .w-ystage__img { filter: hue-rotate(108deg) saturate(1.6) brightness(.8) drop-shadow(0 8px 0 rgba(26,26,64,.15)); }
.w-ystage[data-color="amarelo"] .w-ystage__img { filter: hue-rotate(-52deg) saturate(1.7) brightness(1.18) drop-shadow(0 8px 0 rgba(26,26,64,.15)); }

.w-pad {
  position: relative; width: 270px; height: 270px; margin: 0 auto 28px; border-radius: 50%;
  background: radial-gradient(circle at 40% 35%, #f0f0f6, #c4c4ce); border: 6px solid #6a6a7a; box-shadow: 0 10px 0 rgba(26,26,64,.2);
}
.w-pad__btn {
  position: absolute; width: 86px; height: 86px; border-radius: 50%; cursor: pointer; padding: 0;
  display: grid; place-items: center; align-content: center; gap: 0; color: #fff;
  background: var(--bc); border: 4px solid var(--w-ink); box-shadow: inset 0 -7px 0 rgba(0,0,0,.22), 0 6px 0 var(--w-ink);
  transition: transform .1s, box-shadow .1s;
}
.w-pad__btn b { font-family: var(--w-round); font-size: 30px; line-height: 1; text-shadow: 0 2px 0 rgba(0,0,0,.35); }
.w-pad__btn span { font-size: 11px; font-weight: 900; letter-spacing: .3px; }
.w-pad__btn--x { --bc: var(--w-x); top: 8px; left: calc(50% - 43px); }
.w-pad__btn--y { --bc: var(--w-y); top: calc(50% - 43px); left: 8px; }
.w-pad__btn--a { --bc: var(--w-a); top: calc(50% - 43px); right: 8px; }
.w-pad__btn--b { --bc: var(--w-b); bottom: 8px; left: calc(50% - 43px); color: var(--w-ink); }
.w-pad__btn--b b { text-shadow: none; }
.w-pad__btn:hover { transform: translateY(-2px); }
.w-pad__btn[aria-pressed="true"] { transform: translateY(5px); box-shadow: inset 0 5px 0 rgba(0,0,0,.25), 0 1px 0 var(--w-ink), 0 0 0 6px #fff; }
.w-yinfo { margin-bottom: 26px; min-height: 170px; }
.w-shells { width: 100%; border-collapse: separate; border-spacing: 0; background: #fff; border: 4px solid var(--w-ink); border-radius: 16px; font-size: 15.5px; }
.w-shells caption { caption-side: top; text-align: left; font-family: var(--w-round); font-weight: 700; font-size: 19px; padding: 0 0 10px; }
.w-shells th, .w-shells td { padding: 10px 14px; text-align: left; border-top: 2px solid #e4e4ee; }
.w-shells tr:first-child th, .w-shells tr:first-child td { border-top: 0; }
.w-shells th { font-weight: 900; display: flex; align-items: center; gap: 10px; }
.w-shells td { font-weight: 700; }
.w-shell { width: 26px; height: 20px; border-radius: 50% 50% 40% 40%; border: 3px solid var(--w-ink); box-shadow: inset 0 -5px 0 #fff; flex: none; }
.w-shell--r { background: #e4002b; } .w-shell--b { background: #1d5fd6; } .w-shell--y { background: #f6c700; }
.w-shell--f { background: linear-gradient(90deg, #e4002b, #f6c700, #1d5fd6); animation: w-flash .6s steps(1) infinite; }
@keyframes w-flash { 50% { filter: brightness(1.7) saturate(.4); } }

.w-baby {
  display: grid; grid-template-columns: 260px 1fr; gap: 40px; align-items: center;
  background: #fff; border: 4px solid var(--w-ink); border-radius: 26px; padding: 30px 36px; box-shadow: 0 12px 0 rgba(26,26,64,.18);
}
.w-baby__art { width: 100%; max-width: 260px; height: auto; margin: 0 auto; }
.w-baby__txt p { font-size: 17px; }
.w-eggbox { position: relative; display: flex; align-items: center; gap: 20px; flex-wrap: wrap; margin-top: 8px; }
.w-egg { width: 96px; height: 116px; padding: 0; border: 0; background: none; cursor: pointer; }
.w-egg svg { width: 100%; height: 100%; overflow: visible; }
.w-egg__top, .w-egg__bot { transition: transform .5s cubic-bezier(.3,1.6,.5,1); transform-box: fill-box; transform-origin: 50% 100%; }
.w-egg.is-shake svg { animation: w-shake .5s ease-in-out; }
@keyframes w-shake { 20%, 60% { transform: rotate(-10deg); } 40%, 80% { transform: rotate(10deg); } }
.w-egg.is-open .w-egg__top { transform: translate(-6px, -34px) rotate(-24deg); }
.w-egg.is-open .w-egg__bot { transform: translateY(4px); }
.smw .w-egg__coin { position: absolute; left: 30px; top: -6px; z-index: 2; }
.w-eggbox__msg { font-family: var(--w-pixel); font-size: 10px; line-height: 1.7; margin: 0 !important; max-width: 280px; }

/* =========================================================
   PODERES + VOO
   ========================================================= */
.w-poderes { background: #fff8e8; padding-bottom: clamp(90px, 10vw, 130px); }
.w-flight {
  position: relative; overflow: hidden; margin: 0 0 70px; padding: 46px 0;
  background: linear-gradient(var(--w-sky1), #bfe9ff); border-block: 6px solid var(--w-ink);
}
.w-cloud--f1 { top: 22px; left: 8%; animation: w-bob 5s ease-in-out infinite; }
.w-cloud--f2 { bottom: 40px; right: 34%; transform: scale(.7); }
.smw .w-flight__coin { position: absolute; z-index: 2; top: 34px; left: 58%; }
.w-flight__in { display: grid; grid-template-columns: 1.1fr .9fr; gap: 30px; align-items: center; }
.w-flight__txt { position: relative; z-index: 2; background: rgba(255,255,255,.88); border: 4px solid var(--w-ink); border-radius: 22px; padding: 26px 28px 24px; }
.w-flight__txt .w-h3 { display: flex; align-items: center; gap: 10px; }
.w-flight__txt .w-h3 img { width: 40px; height: 40px; object-fit: contain; }
.w-perch { position: relative; height: 300px; }
.w-perch__hill {
  position: absolute; left: 50%; bottom: -60px; width: 300px; height: 150px; transform: translateX(-50%);
  background: #3cbc4c; border: 5px solid var(--w-green-d); border-radius: 150px 150px 0 0;
}
.w-perch__hill::before, .w-perch__hill::after { content: ""; position: absolute; top: 34px; width: 12px; height: 24px; background: #111; border-radius: 50%; }
.w-perch__hill::before { left: 122px; } .w-perch__hill::after { left: 152px; }
.w-cape {
  position: absolute; z-index: 2; left: 50%; bottom: 76px; width: 190px; padding: 0; border: 0; background: none; cursor: pointer;
  transform: translateX(-50%); transition: opacity .2s;
}
.w-cape img { width: 100%; height: auto; filter: url(#w-key) drop-shadow(0 8px 0 rgba(26,26,64,.2)); animation: w-ride 2.2s ease-in-out infinite; }
.w-cape:hover img { animation-duration: .8s; }
.w-cape.is-away { opacity: 0; pointer-events: none; }
.w-flyer { position: fixed; z-index: 420; left: 0; top: 0; width: 150px; pointer-events: none; display: none; will-change: transform; }
.w-flyer.is-on { display: block; }
.w-flyer img { width: 100%; height: auto; filter: url(#w-key); }
.w-spark {
  position: fixed; z-index: 419; width: 18px; height: 18px; pointer-events: none; background: #fff6a0;
  clip-path: polygon(50% 0, 61% 35%, 100% 50%, 61% 65%, 50% 100%, 39% 65%, 0 50%, 39% 35%);
  animation: w-spark .7s ease-out forwards;
}
@keyframes w-spark { to { transform: scale(.2) rotate(90deg); opacity: 0; } }

.w-cards { list-style: none; margin: 0 0 70px; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; }
.w-card {
  position: relative; background: #fff; border: 4px solid var(--w-ink); border-radius: 20px; padding: 24px 24px 18px;
  box-shadow: 0 8px 0 var(--w-ink); border-top-width: 14px;
}
.w-card:nth-child(4n+1) { border-top-color: var(--w-a); } .w-card:nth-child(4n+2) { border-top-color: var(--w-b); }
.w-card:nth-child(4n+3) { border-top-color: var(--w-x); } .w-card:nth-child(4n+4) { border-top-color: var(--w-y); }
.w-card__ico { display: grid; place-items: center; width: 82px; height: 82px; margin-bottom: 12px; border-radius: 50%; background: #eaf6ff; border: 3px solid var(--w-ink); }
.w-card__ico img, .w-card__ico svg { width: 58px; height: 58px; object-fit: contain; }
.w-card__ico--trio { width: auto; padding: 0 12px; border-radius: 41px; display: inline-flex; align-items: center; gap: 4px; }
.w-card__ico--trio img { width: 42px; height: 42px; }
.w-card h3 { font-family: var(--w-round); font-size: 23px; margin: 0 0 6px; }
.w-card p { font-size: 15.5px; font-weight: 600; margin: 0; }
.w-spin { animation: w-rot 1.4s linear infinite; transform-origin: 40px 40px; }
@keyframes w-rot { to { transform: rotate(360deg); } }

.w-palace {
  display: grid; grid-template-columns: 1fr 1fr; gap: 26px 40px; align-items: center;
  background: #f0eefa; border: 4px solid var(--w-ink); border-radius: 26px; padding: 32px 36px; box-shadow: 0 10px 0 rgba(26,26,64,.18);
}
.w-switches { display: flex; flex-wrap: wrap; gap: 16px 22px; justify-content: center; }
.w-switch { display: grid; justify-items: center; gap: 22px; padding: 6px 4px 0; border: 0; background: none; cursor: pointer; }
.w-switch__btn {
  display: grid; place-items: center; width: 84px; height: 56px; color: #fff; font-family: var(--w-pixel); font-size: 22px;
  background: var(--c); border: 4px solid var(--w-ink); border-radius: 26px 26px 8px 8px; text-shadow: 2px 2px 0 rgba(0,0,0,.4);
  box-shadow: inset 0 -8px 0 var(--d), 0 10px 0 #9a9aa8, 0 14px 0 var(--w-ink);
  transform-origin: 50% 100%; transition: transform .18s cubic-bezier(.5,0,.3,1.6), box-shadow .18s;
}
.w-switch:hover .w-switch__btn { transform: translateY(-2px); }
.w-switch[aria-pressed="true"] .w-switch__btn { transform: translateY(10px) scaleY(.45); box-shadow: inset 0 -4px 0 var(--d), 0 3px 0 #9a9aa8, 0 6px 0 var(--w-ink); }
.w-switch__lbl { font-weight: 900; font-size: 14px; }
.w-oblocks { grid-column: 1 / -1; display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.w-oblocks i {
  width: 46px; height: 46px; border: 3px dashed var(--c); border-radius: 6px; transition: background .3s;
}
.w-oblocks i.is-on {
  background: var(--c); border: 3px solid var(--w-ink); box-shadow: inset 0 -6px 0 rgba(0,0,0,.2), inset 0 6px 0 rgba(255,255,255,.3);
  animation: w-pop .35s ease;
}

/* =========================================================
   96 SAÍDAS
   ========================================================= */
.w-saidas {
  color: #fff;
  background:
    radial-gradient(circle, #fff 0 1.2px, transparent 2px) 0 0 / 80px 70px,
    radial-gradient(circle, rgba(255,240,150,.8) 0 1.5px, transparent 2.2px) 30px 40px / 130px 120px,
    linear-gradient(#060a30, var(--w-navy));
}
.w-saidas__grid { display: grid; grid-template-columns: .8fr 1.2fr; gap: 40px; align-items: center; }
.w-saidas__big { position: relative; text-align: center; }
.w-saidas__star { position: absolute; left: 50%; top: 50%; font-size: clamp(220px, 30vw, 340px); line-height: 1; color: rgba(246,199,0,.16); transform: translate(-50%, -54%); animation: w-rot 30s linear infinite; }
.w-saidas__num {
  position: relative; display: block; font-family: var(--w-round); font-weight: 700; font-size: clamp(130px, 19vw, 230px); line-height: .9; color: var(--w-b);
  text-shadow: 5px 0 var(--w-ink), -5px 0 var(--w-ink), 0 5px var(--w-ink), 0 -5px var(--w-ink), 4px 4px var(--w-ink), -4px -4px var(--w-ink), 4px -4px var(--w-ink), -4px 4px var(--w-ink), 0 12px 0 var(--w-ink);
}
.smw .w-saidas__lbl { position: relative; font-family: var(--w-pixel); font-weight: 400; font-size: 22px; margin: 18px 0 0; letter-spacing: 3px; }
.w-saidas__txt p { font-size: 18px; line-height: 1.65; }
.w-red { color: #ff7a8a; font-weight: 900; }
.w-keyhole {
  position: relative; display: flex; align-items: center; gap: 24px; flex-wrap: wrap; margin-top: 18px;
  background: rgba(255,255,255,.08); border: 3px dashed rgba(255,255,255,.35); border-radius: 18px; padding: 18px 22px;
}
.w-key { width: 96px; height: 60px; padding: 0; border: 0; background: none; cursor: pointer; transition: transform .9s cubic-bezier(.5,0,.3,1); animation: w-bob 1.6s ease-in-out infinite; }
.w-key svg { width: 100%; height: 100%; }
.w-key.is-used { animation: none; }
.w-lock { width: 54px; height: 72px; }
.w-lock svg { width: 100%; height: 100%; }
.smw .w-keyhole__coin { position: absolute; right: 22px; top: 50%; margin-top: -30px; }
.w-keyhole__msg { flex-basis: 100%; font-family: var(--w-pixel); font-size: 10px; line-height: 1.7; margin: 0 !important; }
.w-keyiris { position: absolute; inset: 0; z-index: 6; pointer-events: none; display: none; }
.w-keyiris.is-on { display: block; }
.w-keyiris::before {
  content: ""; position: absolute; left: var(--kx, 50%); top: var(--ky, 50%); width: 60px; height: 80px; margin: -40px 0 0 -30px; background: #000;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 80'%3E%3Ccircle cx='30' cy='26' r='18'/%3E%3Cpath d='M18 34h24l10 46H8z'/%3E%3C/svg%3E") center / contain no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 60 80'%3E%3Ccircle cx='30' cy='26' r='18'/%3E%3Cpath d='M18 34h24l10 46H8z'/%3E%3C/svg%3E") center / contain no-repeat;
  animation: w-keyzoom 1.3s cubic-bezier(.6,0,.4,1) forwards;
}
@keyframes w-keyzoom { 0% { transform: scale(.2); opacity: 1; } 60% { transform: scale(40); opacity: 1; } 100% { transform: scale(46); opacity: 0; } }

/* =========================================================
   CURIOSIDADES
   ========================================================= */
.w-curios {
  background:
    repeating-linear-gradient(90deg, transparent 0 46px, rgba(91,74,168,.06) 46px 50px),
    #e9e8f2;
}
.w-facts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 26px; counter-reset: fato; }
.w-fact {
  position: relative; counter-increment: fato; background: #fff; border: 4px solid var(--w-ink); border-radius: 18px;
  padding: 30px 24px 18px; box-shadow: 0 8px 0 var(--w-purple);
}
.w-fact::before {
  content: counter(fato); position: absolute; top: -20px; left: 20px; width: 40px; height: 40px; display: grid; place-items: center;
  font-family: var(--w-pixel); font-size: 13px; color: #fff; background: var(--w-purple); border: 3px solid var(--w-ink); border-radius: 50%;
}
.w-fact:nth-child(4n+1)::before { background: var(--w-a); } .w-fact:nth-child(4n+2)::before { background: var(--w-b); color: var(--w-ink); }
.w-fact:nth-child(4n+3)::before { background: var(--w-x); } .w-fact:nth-child(4n+4)::before { background: var(--w-y); }
.w-fact h3 { font-family: var(--w-round); font-size: 22px; line-height: 1.15; margin: 0 0 8px; }
.w-fact p { font-size: 15.5px; font-weight: 600; margin: 0; }
.w-fact--wide { grid-column: 1 / -1; display: grid; grid-template-columns: 260px 1fr; gap: 26px; align-items: center; }
.w-fact--wide img { width: 100%; border-radius: 10px; border: 3px solid var(--w-ink); }

/* =========================================================
   ONDE JOGAR
   ========================================================= */
.w-onde {
  padding-bottom: 0;
  background: linear-gradient(var(--w-sky1), var(--w-sky2) 80%);
}
.smw .w-onde__q { position: absolute; top: -10px; right: 24px; width: 58px; height: 58px; animation: w-bob 2.4s ease-in-out infinite; }
.w-carts { list-style: none; margin: 0 0 80px; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 30px; }
.w-cart {
  position: relative; background: #8a8a98; border: 4px solid var(--w-ink); border-radius: 22px 22px 10px 10px; padding: 46px 18px 18px;
  box-shadow: inset 0 -10px 0 rgba(0,0,0,.18), 0 10px 0 rgba(26,26,64,.3);
}
.w-cart::before {
  content: ""; position: absolute; left: 22px; right: 22px; top: 12px; height: 20px; border-radius: 6px;
  background: repeating-linear-gradient(#6e6e7c 0 3px, #a4a4b2 3px 6px);
}
.w-cart__label {
  background: #fff; border: 3px solid var(--w-ink); border-radius: 8px; padding: 0 18px 16px; overflow: hidden;
}
.w-cart__label::before {
  content: ""; display: block; height: 46px; margin: 0 -18px 14px; border-bottom: 3px solid var(--w-ink);
  background:
    radial-gradient(circle at 20% 120%, #3cbc4c 0 34px, transparent 35px),
    radial-gradient(circle at 70% 130%, #9ae89a 0 40px, transparent 41px),
    linear-gradient(var(--w-sky1), #bfe9ff);
}
.w-cart:nth-child(2) .w-cart__label::before { background: radial-gradient(circle at 60% 120%, #a0602a 0 36px, transparent 37px), linear-gradient(#22195a, var(--w-purple)); }
.w-cart:nth-child(3) .w-cart__label::before { background: radial-gradient(circle at 30% 140%, #f6c700 0 40px, transparent 41px), linear-gradient(#e4002b, #ff7a8a); }
.smw .w-cart__tag { font-family: var(--w-pixel); font-size: 9px; line-height: 1.6; color: var(--w-purple); margin-bottom: 8px; }
.w-cart h3 { font-family: var(--w-round); font-size: 23px; line-height: 1.1; margin: 0 0 8px; }
.w-cart p { font-size: 15.5px; font-weight: 600; margin: 0; }
.w-ground--end { height: 64px; }

body[data-game="smw"] .mbr-gamenav { background: #22195a; }

/* =========================================================
   RESPONSIVO
   ========================================================= */
@media (max-width: 1100px) {
  .w-map { grid-template-columns: 1fr; }
  .w-places { grid-template-columns: repeat(3, 1fr); }
  .w-cards, .w-facts { grid-template-columns: repeat(2, 1fr); }
  .w-palace { grid-template-columns: 1fr; }
}
@media (max-width: 900px) {
  .w-hero__in, .w-sobre__grid, .w-ficha__grid, .w-yoshi__grid, .w-flight__in, .w-saidas__grid { grid-template-columns: 1fr; }
  .w-hero__in { text-align: center; }
  .w-logo img { margin: 0 auto; }
  .w-chips, .w-cta { justify-content: center; }
  .w-hook { margin-left: auto; margin-right: auto; }
  .w-hero__art img { width: min(380px, 80vw); }
  .w-pad-art { max-width: 420px; margin: 0 auto; }
  .w-box { max-width: 520px; margin: 0 auto; }
  .w-ystage { min-height: 360px; }
  .w-ystage__img { height: 340px; }
  .w-baby { grid-template-columns: 1fr; text-align: center; }
  .w-baby__art { max-width: 200px; }
  .w-eggbox { justify-content: center; }
  .w-carts { grid-template-columns: 1fr; max-width: 520px; margin-left: auto; margin-right: auto; }
  .w-fact--wide { grid-template-columns: 1fr; }
  .w-perch { height: 260px; }
}
@media (max-width: 700px) {
  .w-node text { display: none; }
  .w-map__secret { display: none; }
  .w-places { grid-template-columns: repeat(2, 1fr); }
  .w-file__dl div { grid-template-columns: 1fr; gap: 6px; }
}
@media (max-width: 600px) {
  .smw { font-size: 16px; }
  .w-hud { font-size: 9px; gap: 6px; margin-top: 14px; }
  .w-hud__cell:nth-child(4) { display: none; }
  .w-hud__lbl { font-size: 7px; }
  .w-hud__slots i { width: 10px; height: 16px; }
  .w-hud__reserve { width: 52px; height: 52px; }
  .w-hud__reserve img { width: 34px; height: 34px; }
  .w-hook { font-size: 17px; }
  .smw .w-hero__coin { top: auto; bottom: 104px; right: 8%; }
  .smw .w-cloud--hide { top: auto; bottom: 96px; right: calc(8% - 56px); width: 150px; height: 64px; }
  .smw .w-map__coin { transform: scale(.42); left: 15%; top: 40%; }
  .w-msgbox--big { padding: 44px 22px 20px; }
  .w-cards, .w-facts { grid-template-columns: 1fr; }
  .w-pad { width: 240px; height: 240px; }
  .w-pad__btn { width: 76px; height: 76px; }
  .w-pad__btn--x, .w-pad__btn--b { left: calc(50% - 38px); }
  .w-pad__btn--y, .w-pad__btn--a { top: calc(50% - 38px); }
  .w-palace, .w-baby { padding: 26px 18px; }
  .w-oblocks i { width: 36px; height: 36px; }
  .w-flight__txt { padding: 22px 18px; }
  .smw .w-flight__coin { left: 8%; top: auto; bottom: 120px; }
  .w-card { display: grid; grid-template-columns: 66px 1fr; gap: 0 16px; align-items: start; padding: 20px 18px 16px; }
  .w-card__ico { grid-row: span 2; width: 66px; height: 66px; margin: 0; }
  .w-card__ico img, .w-card__ico svg { width: 46px; height: 46px; }
  .w-card__ico--trio { grid-column: 1 / -1; grid-row: auto; width: auto; height: 60px; margin-bottom: 10px; justify-self: start; }
  .w-card h3 { font-size: 21px; }
  .w-card__ico--trio ~ h3, .w-card__ico--trio ~ p { grid-column: 1 / -1; }
  .w-switches { gap: 14px 10px; }
  .w-switch__btn { width: 62px; height: 48px; font-size: 18px; }
  .w-file { padding: 22px 18px 10px; }
  .w-keyhole { gap: 16px; }
  .smw .w-onde__q { top: -30px; right: 16px; width: 48px; height: 48px; }
}
@media (prefers-reduced-motion: reduce) {
  .w-cloud, .w-hero__art img, .w-cape img, .smw .smw-dcoin { animation: none !important; }
  .smw .w-cloud--hide { transform: translateX(150px); }
}
