/* =========================================================
   SUPER MARIO BROS. WONDER - tema "Reino das Flores"
   Tudo escopado em .wonder / body[data-game="wonder"]
   ========================================================= */

body[data-game="wonder"] { background: #2b0b57; }
body[data-game="wonder"] .mbr-gamenav { background: #2b0b57; }
body[data-game="wonder"] .mbr-gamenav__link { background: #3c1475; border-color: #5a2a9c; }

.wonder {
  --wd-purple: #7b2ff7;
  --wd-violet: #4a148c;
  --wd-deep: #2b0b57;
  --wd-pink: #ff4fa3;
  --wd-hotpink: #e91e7a;
  --wd-cyan: #1ec8ff;
  --wd-yellow: #ffd23f;
  --wd-lime: #7fdc3a;
  --wd-orange: #ff8a3d;
  --wd-cream: #fff6e0;
  --wd-ink: #2a1450;
  --wd-font: "Baloo 2", "Lilita One", system-ui, sans-serif;
  color: var(--wd-ink);
  overflow-x: clip;
  position: relative;
}
.wonder img { max-width: 100%; }
.wd-wrap { max-width: 1240px; margin: 0 auto; padding: 0 16px; position: relative; z-index: 2; }

/* ---------- Tipografia ---------- */
.wd-h2 {
  font-family: var(--wd-font); font-weight: 800; line-height: 1.02;
  font-size: clamp(2rem, 4.6vw, 3.4rem); letter-spacing: -.5px;
  margin: 6px 0 14px; color: var(--wd-violet);
  text-shadow: 0 4px 0 rgba(74, 20, 140, .14);
}
.wd-eyebrow {
  display: inline-block; margin: 0; padding: 4px 14px 2px; border-radius: 999px;
  font-family: var(--wd-font); font-weight: 800; font-size: .9rem; letter-spacing: 1.2px; text-transform: uppercase;
  background: var(--wd-pink); color: #fff; box-shadow: 0 3px 0 var(--wd-hotpink);
}
.wd-sechead { max-width: 760px; margin: 0 auto 40px; text-align: center; }
.wd-sechead p:not(.wd-eyebrow) { font-size: 1.08rem; margin: 0; }
.wd-sechead--light .wd-h2 { color: #fff; text-shadow: 0 4px 0 rgba(0,0,0,.25); }
.wd-sechead--light p:not(.wd-eyebrow) { color: #f3e9ff; }
.wd-sechead--light .wd-eyebrow { background: var(--wd-yellow); color: #4a2a00; box-shadow: 0 3px 0 #c99a00; }

.wd-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 0;
  font-family: var(--wd-font); font-weight: 800; font-size: 1.05rem; line-height: 1.1;
  padding: 12px 20px 10px; border-radius: 999px; background: var(--wd-purple); color: #fff;
  box-shadow: 0 5px 0 var(--wd-violet); transition: transform .15s, box-shadow .15s, opacity .2s;
}
.wd-btn small { font-weight: 600; opacity: .85; }
.wd-btn:hover { transform: translateY(-2px); box-shadow: 0 7px 0 var(--wd-violet); }
.wd-btn:active { transform: translateY(3px); box-shadow: 0 2px 0 var(--wd-violet); }
.wd-btn[disabled] { opacity: .45; cursor: not-allowed; transform: none; }
.wd-btn--pink { background: var(--wd-pink); box-shadow: 0 5px 0 #b3135f; }
.wd-btn--pink:hover { box-shadow: 0 7px 0 #b3135f; }
.wd-btn--ghost { background: #fff; color: var(--wd-violet); box-shadow: 0 5px 0 #c9b4ee; }
.wd-btn--ghost:hover { box-shadow: 0 7px 0 #c9b4ee; }

.wd-blob {
  background: #fff; padding: clamp(24px, 4vw, 44px);
  border-radius: 46px 64px 52px 72px / 60px 44px 70px 50px;
  box-shadow: 0 12px 0 rgba(74, 20, 140, .16), 0 24px 50px rgba(43, 11, 87, .14);
}
.wd-blob p { font-size: 1.05rem; }
.wd-card { background: #fff; border-radius: 32px; box-shadow: 0 10px 0 rgba(74,20,140,.16), 0 20px 40px rgba(43,11,87,.14); }

/* ---------- Seções com borda "bolhuda" ---------- */
.wd-sec { position: relative; padding: clamp(72px, 9vw, 120px) 0; background: var(--bg); overflow-x: clip; }
.wd-sec::before {
  content: ""; position: absolute; left: 0; right: 0; top: -27px; height: 28px; pointer-events: none;
  background: radial-gradient(circle at 50% 100%, var(--bg) 69%, transparent 71%) 0 0 / 64px 28px repeat-x;
}

/* ===================== HERÓI ===================== */
.wd-hero {
  position: relative; overflow: hidden; isolation: isolate;
  background:
    radial-gradient(circle at 18% 22%, rgba(255,255,255,.55) 0 60px, transparent 61px),
    linear-gradient(180deg, #62d4ff 0%, #9fb6ff 38%, #c7a2ff 62%, #ffb0de 100%);
}
.wd-hero__sky { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.wd-cloud {
  position: absolute; width: 120px; height: 44px; border-radius: 44px; background: #fff;
  box-shadow: 30px -22px 0 4px #fff, 64px -6px 0 0 #fff, 0 6px 0 rgba(120,80,200,.12);
  animation: wd-drift 26s linear infinite alternate;
}
.wd-cloud--1 { top: 12%; left: 6%; transform: scale(.9); }
.wd-cloud--2 { top: 9%; right: 9%; }
.wd-cloud--3 { top: 46%; left: 44%; transform: scale(.7); opacity: .85; animation-duration: 34s; }
@keyframes wd-drift { to { translate: 60px 0; } }
.wd-dot { position: absolute; border-radius: 50%; background: rgba(255,255,255,.28); }
.wd-dot--1 { width: 90px; height: 90px; left: 38%; top: 8%; }
.wd-dot--2 { width: 40px; height: 40px; left: 52%; top: 30%; background: rgba(255,255,255,.45); }
.wd-dot--3 { width: 160px; height: 160px; right: -40px; top: 40%; background: rgba(255,79,163,.18); }
.wd-dot--4 { width: 60px; height: 60px; left: 3%; top: 58%; background: rgba(255,255,255,.3); }

.wd-coin-cloud { position: absolute; top: calc(9% - 46px); right: calc(9% + 44px); z-index: 3; }

.wd-hero__in {
  position: relative; z-index: 2; max-width: 1240px; margin: 0 auto;
  padding: clamp(28px, 5vw, 56px) 16px 210px;
  display: grid; grid-template-columns: 1.05fr .95fr; gap: 28px; align-items: center;
}
.wd-kicker { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 6px; }
.wd-kicker span {
  font-family: var(--wd-font); font-weight: 800; font-size: .95rem; line-height: 1;
  padding: 8px 14px 6px; border-radius: 999px; background: #fff; color: var(--wd-violet);
  box-shadow: 0 4px 0 rgba(74,20,140,.2);
}
.wd-kicker span:first-child { background: var(--wd-yellow); color: #4a2a00; }
.wd-hero__logo { margin: 0; }
.wd-hero__logo img { width: min(560px, 100%); filter: drop-shadow(0 8px 0 rgba(74,20,140,.25)); animation: wd-float 4s ease-in-out infinite; }
@keyframes wd-float { 50% { transform: translateY(-8px) rotate(-1deg); } }
.wd-hook { font-family: var(--wd-font); font-weight: 600; font-size: clamp(1.1rem, 1.8vw, 1.35rem); line-height: 1.35; color: #2e0e6b; max-width: 560px; margin: 10px 0 22px; }
.wd-hook strong { color: #b3135f; }
.wd-hint { margin: 12px 0 0; font-size: .95rem; color: #3a1a6e; max-width: 460px; }

/* --- Botão da Flor Wonder --- */
.wd-trigger { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.wd-wonderbtn {
  position: relative; display: inline-flex; align-items: center; gap: 12px; border: 0; cursor: pointer;
  padding: 10px 26px 10px 10px; border-radius: 999px;
  background: linear-gradient(135deg, #8a3ffc, #e14bd0 55%, #ff8a3d); color: #fff;
  box-shadow: 0 6px 0 #4a148c, 0 14px 30px rgba(74,20,140,.35);
  transition: transform .2s cubic-bezier(.3,1.6,.5,1), box-shadow .2s;
}
.wd-wonderbtn:hover { transform: translateY(-3px) scale(1.03); }
.wd-wonderbtn:active { transform: translateY(3px); box-shadow: 0 2px 0 #4a148c; }
.wd-wonderbtn img {
  width: 84px; height: 84px; object-fit: contain; padding: 8px; border-radius: 50%;
  background: radial-gradient(circle, #fff 0 55%, #ffe9fb 56% 100%);
  animation: wd-bob 2.2s ease-in-out infinite; position: relative; z-index: 1;
}
@keyframes wd-bob { 50% { transform: translateY(-5px) rotate(6deg); } }
.wd-wonderbtn__label { font-family: var(--wd-font); font-weight: 800; font-size: 1.3rem; line-height: 1.05; text-align: left; text-shadow: 0 2px 0 rgba(74,20,140,.5); }
.wd-wonderbtn__ring {
  position: absolute; left: 4px; top: 50%; width: 96px; height: 96px; margin-top: -48px; border-radius: 50%; z-index: 0;
  background: conic-gradient(var(--wd-yellow) calc(var(--p, 0) * 1turn), transparent 0);
  -webkit-mask: radial-gradient(circle, transparent 0 44px, #000 45px); mask: radial-gradient(circle, transparent 0 44px, #000 45px);
}
.wd-wonderbtn[aria-disabled="true"] { cursor: default; filter: saturate(1.3); }
.wd-wonderbtn--sm img { width: 70px; height: 70px; }
.wd-wonderbtn--sm .wd-wonderbtn__ring { width: 82px; height: 82px; margin-top: -41px; }
.wd-wonderbtn--sm .wd-wonderbtn__ring { -webkit-mask: radial-gradient(circle, transparent 0 37px, #000 38px); mask: radial-gradient(circle, transparent 0 37px, #000 38px); }
.wd-wonderbtn--sm .wd-wonderbtn__label { font-size: 1.1rem; }

/* Semente Wonder (moeda escondida que nasce no fim do efeito) */
.wd-seedslot { display: inline-flex; min-width: 0; }
.wd-seed {
  width: 58px; height: 70px; border: 0; padding: 0; cursor: pointer; position: relative;
  border-radius: 50% 50% 46% 46% / 58% 58% 42% 42%;
  background:
    radial-gradient(circle at 34% 28%, rgba(255,255,255,.9) 0 7px, transparent 8px),
    radial-gradient(circle at 50% 60%, #b8ff5c, #39c33f 55%, #1b7f2a 100%);
  box-shadow: inset 0 -6px 0 rgba(0,0,0,.18), 0 0 0 4px #fff, 0 0 24px 8px rgba(255,255,140,.75);
  animation: wd-seedpop .6s cubic-bezier(.3,1.7,.5,1) both, wd-bob 2s ease-in-out .6s infinite;
}
.wd-seed::before, .wd-seed::after { content: ""; position: absolute; top: -12px; width: 16px; height: 22px; border-radius: 50% 50% 0 50%; background: #7fdc3a; box-shadow: inset -2px -3px 0 rgba(0,0,0,.15); }
.wd-seed::before { left: 12px; transform: rotate(-30deg); }
.wd-seed::after { right: 12px; transform: scaleX(-1) rotate(-30deg); }
@keyframes wd-seedpop { from { transform: scale(0) translateY(30px); } }

/* --- Arte do herói --- */
.wd-hero__art { position: relative; min-height: 480px; }
.wd-cover {
  width: min(290px, 58%); margin: 0 12% 0 auto; transform: rotate(5deg);
  border-radius: 20px; overflow: hidden; border: 7px solid #fff;
  box-shadow: 0 12px 0 rgba(74,20,140,.25), 0 30px 60px rgba(43,11,87,.35);
}
.wd-cover img { width: 100%; }
.wd-hero__ele { position: absolute; left: -2%; bottom: -24px; width: min(340px, 64%); filter: drop-shadow(0 10px 0 rgba(74,20,140,.22)); }
.wd-tflower--hero { right: 2%; bottom: -36px; }

/* --- Chão com canos --- */
.wd-ground {
  position: absolute; left: 0; right: 0; bottom: 0; height: 120px; z-index: 1;
  background:
    radial-gradient(circle at 50% 0, #9be86b 0 26px, transparent 27px) 0 -14px / 56px 40px repeat-x,
    linear-gradient(#5cc93d 0 18px, #3fa52f 18px 26px, #c77b3b 26px) ;
}
.wd-ground::after { /* manchinhas de terra */
  content: ""; position: absolute; inset: 40px 0 0;
  background: radial-gradient(circle, rgba(0,0,0,.12) 0 5px, transparent 6px) 0 0 / 46px 30px;
}
.wd-pipe { position: absolute; bottom: 92px; width: 104px; z-index: 2; transform-origin: 50% 100%; }
.wd-pipe__img { position: relative; z-index: 2; width: 100%; }
.wd-pipe--1 { left: 3%; }
.wd-pipe--2 { left: 21%; width: 78px; }
.wd-pipe--3 { right: 30%; width: 90px; }
.wd-piranha { position: absolute; z-index: 1; left: 16%; width: 68%; bottom: 82%; height: 150%; overflow: hidden; pointer-events: none; }
.wd-piranha img { position: absolute; bottom: 0; width: 100%; transform: translateY(105%); transition: transform .6s cubic-bezier(.3,1.5,.5,1); transform-origin: 50% 100%; }

/* ===================== FLOR FALANTE ===================== */
.wd-tflower {
  position: absolute; z-index: 4; width: 70px; height: 116px; padding: 0; border: 0; background: none; cursor: pointer;
  isolation: isolate; transform-origin: 50% 100%;
}
.wd-tflower__stem { position: absolute; left: 50%; bottom: 0; width: 7px; height: 64px; margin-left: -3.5px; background: #3fa52f; border-radius: 4px; }
.wd-tflower__stem::before, .wd-tflower__stem::after { content: ""; position: absolute; bottom: 10px; width: 26px; height: 14px; background: #5cc93d; border-radius: 0 100% 0 100%; }
.wd-tflower__stem::before { right: 5px; transform: rotate(-12deg); border-radius: 100% 0 100% 0; }
.wd-tflower__stem::after { left: 5px; transform: rotate(12deg); }
.wd-tflower__head {
  position: absolute; left: 50%; top: 8px; width: 46px; height: 46px; margin-left: -23px; border-radius: 50%;
  transition: transform .25s cubic-bezier(.3,1.8,.5,1);
}
.wd-tflower__head::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: radial-gradient(circle at 40% 35%, #fffbe6, #ffe28a); box-shadow: inset 0 -4px 0 rgba(200,120,0,.25); }
.wd-tflower__head i, .wd-tflower__head b { z-index: 1; }
.wd-tflower__head::before {
  content: ""; position: absolute; left: 50%; top: 50%; width: 30px; height: 30px; margin: -15px 0 0 -15px; border-radius: 50%;
  background: #ff5fa8;
  box-shadow: 0 -24px 0 #ff5fa8, 23px -8px 0 #ff5fa8, 14px 20px 0 #ff5fa8, -14px 20px 0 #ff5fa8, -23px -8px 0 #ff5fa8;
}
.wd-tflower__head i { position: absolute; top: 13px; width: 6px; height: 11px; border-radius: 50%; background: #1b1036; }
.wd-tflower__head i:first-child { left: 13px; } .wd-tflower__head i:nth-child(2) { right: 13px; }
.wd-tflower__head b { position: absolute; left: 50%; bottom: 8px; width: 16px; height: 8px; margin-left: -8px; background: #b3134f; border-radius: 0 0 10px 10px; transform-origin: 50% 0; transition: transform .15s; }
.wd-tflower__bubble {
  position: absolute; bottom: calc(100% - 4px); left: 50%; translate: -50% 0; white-space: nowrap; z-index: 2;
  font-family: var(--wd-font); font-weight: 800; font-size: 1.05rem; color: var(--wd-violet); line-height: 1;
  background: #fff; padding: 10px 14px 7px; border-radius: 18px; box-shadow: 0 4px 0 rgba(74,20,140,.25);
  transform: scale(0); transform-origin: 50% 120%; transition: transform .3s cubic-bezier(.3,1.7,.5,1);
}
.wd-tflower__bubble::after { content: ""; position: absolute; left: 50%; bottom: -8px; margin-left: -8px; border: 8px solid transparent; border-bottom: 0; border-top-color: #fff; }
.wd-tflower.is-talking .wd-tflower__bubble { transform: scale(1); }
.wd-tflower.is-talking .wd-tflower__head { animation: wd-chatter .22s ease-in-out 4 alternate; }
.wd-tflower.is-talking .wd-tflower__head b { transform: scaleY(1.8); }
.wd-tflower:hover .wd-tflower__head, .wd-tflower:focus-visible .wd-tflower__head { transform: rotate(-10deg) scale(1.08); }
@keyframes wd-chatter { to { transform: rotate(8deg) translateY(-3px); } }
.wd-tflower--sobre { left: 3%; bottom: -14px; }
.wd-peek { position: fixed; left: 12px; bottom: -140px; z-index: 300; pointer-events: none; cursor: default; transition: bottom .45s cubic-bezier(.3,1.5,.5,1); }
.wd-peek.is-up { bottom: -24px; }
.wd-peek .wd-tflower__bubble { left: 14px; translate: 0 0; transform-origin: 10% 120%; }
.wd-peek .wd-tflower__bubble::after { left: 22px; }
.wd-tflower--trivia { right: 4%; bottom: -10px; }

/* ===================== SOBRE ===================== */
.wd-sobre {
  --bg: var(--wd-cream);
  background:
    radial-gradient(circle, rgba(255,79,163,.12) 0 6px, transparent 7px) 0 0 / 44px 44px,
    radial-gradient(circle, rgba(123,47,247,.10) 0 4px, transparent 5px) 22px 22px / 44px 44px,
    var(--bg);
}
.wd-sobre__grid { display: grid; grid-template-columns: 1.5fr 1fr; gap: 36px; align-items: start; }
.wd-sobre__txt .wd-h2 { font-size: clamp(2rem, 4vw, 3rem); }
.wd-ficha { padding: 26px 26px 22px; border: 5px solid var(--wd-yellow); position: relative; transform: rotate(1.2deg); }
.wd-ficha__top { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.wd-ficha__top h3 { font-family: var(--wd-font); font-weight: 800; font-size: 1.7rem; margin: 0; color: var(--wd-violet); }
.wd-ficha__seed { width: 34px; height: 40px; border-radius: 50% 50% 46% 46% / 58% 58% 42% 42%; background: radial-gradient(circle at 50% 60%, #b8ff5c, #39c33f 55%, #1b7f2a); box-shadow: inset 0 -4px 0 rgba(0,0,0,.18); flex-shrink: 0; }
.wd-ficha dl { margin: 0; display: grid; gap: 2px; }
.wd-ficha dl div { display: grid; grid-template-columns: 132px 1fr; gap: 10px; padding: 8px 0; border-bottom: 2px dashed #eadcff; }
.wd-ficha dt { font-weight: 900; font-size: .74rem; text-transform: uppercase; letter-spacing: .5px; color: var(--wd-hotpink); padding-top: 2px; }
.wd-ficha dd { margin: 0; font-weight: 700; }
.wd-ficha dd small { display: block; font-weight: 600; color: #6b5a8a; }
.wd-ficha__award { margin: 14px 0 0; font-family: var(--wd-font); font-weight: 800; font-size: 1.05rem; color: #4a2a00; background: var(--wd-yellow); padding: 8px 14px 6px; border-radius: 16px; }

/* ===================== FLOR WONDER ===================== */
.wd-flower {
  --bg: #7b2ff7; color: #fff;
  background:
    radial-gradient(circle at 12% 18%, rgba(255,255,255,.14) 0 80px, transparent 81px),
    radial-gradient(circle at 88% 70%, rgba(255,79,163,.35) 0 140px, transparent 141px),
    linear-gradient(160deg, #7b2ff7 0%, #9b3cf0 45%, #c443d8 100%);
}
.wd-flower .wd-h2 { color: #fff; text-shadow: 0 4px 0 rgba(43,11,87,.4); }
.wd-flower .wd-sechead p:not(.wd-eyebrow) { color: #f6ecff; }
.wd-flower .wd-eyebrow { background: var(--wd-yellow); color: #4a2a00; box-shadow: 0 3px 0 #c99a00; }
.wd-effects { display: grid; grid-template-columns: repeat(4, 1fr); gap: 22px; }
.wd-effect {
  background: #fff; color: var(--wd-ink); padding: 18px 18px 22px;
  border-radius: 36px 28px 40px 30px; box-shadow: 0 10px 0 rgba(43,11,87,.35);
}
.wd-effect:nth-child(2) { border-radius: 28px 40px 30px 38px; }
.wd-effect:nth-child(3) { border-radius: 40px 30px 36px 28px; }
.wd-effect h3 { font-family: var(--wd-font); font-weight: 800; font-size: 1.35rem; line-height: 1.1; margin: 14px 0 6px; color: var(--wd-violet); }
.wd-effect p { margin: 0; font-size: .98rem; }
.wd-effect__art {
  height: 130px; border-radius: 24px; position: relative; overflow: hidden;
  background: linear-gradient(180deg, #8fe3ff, #d6c6ff);
  display: flex; align-items: flex-end; justify-content: center; gap: 10px; padding-bottom: 0;
}
.wd-effect__art::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 18px; background: #5cc93d; box-shadow: inset 0 4px 0 #9be86b; }
/* canos-lagarta */
.wd-art-pipes i {
  position: relative; z-index: 1; width: 34px; height: 64px; margin-bottom: 14px; border-radius: 4px 4px 0 0;
  background: linear-gradient(90deg, #0b7a1e, #3fd14f 35%, #19a02b 70%, #0a6a18);
  transform-origin: 50% 100%; animation: wd-inch 1.6s ease-in-out infinite;
}
.wd-art-pipes i::before { content: ""; position: absolute; left: -6px; right: -6px; top: -12px; height: 16px; border-radius: 4px; background: inherit; box-shadow: 0 2px 0 #075a12; }
.wd-art-pipes i:nth-child(2) { height: 84px; animation-delay: -.5s; }
.wd-art-pipes i:nth-child(3) { height: 54px; animation-delay: -1s; }
@keyframes wd-inch { 0%,100% { transform: scaleY(1) skewX(0); } 30% { transform: scaleY(1.25) skewX(10deg); } 65% { transform: scaleY(.82) skewX(-8deg); } }
/* musical */
.wd-art-music { background: linear-gradient(180deg, #ffb3e0, #ffe08a); }
.wd-art-music img { position: relative; z-index: 1; width: 42px; margin-bottom: 14px; transform-origin: 50% 100%; animation: wd-sing 1s ease-in-out infinite alternate; }
.wd-art-music img:nth-child(2) { width: 50px; animation-delay: -.5s; }
.wd-art-music::before { content: "♪ ♫ ♪"; position: absolute; top: 10px; left: 0; right: 0; text-align: center; font-size: 26px; color: #b3135f; letter-spacing: 18px; animation: wd-bob 1.4s ease-in-out infinite; }
@keyframes wd-sing { from { transform: rotate(-9deg) scaleY(.94); } to { transform: rotate(9deg) scaleY(1.06); } }
/* goomba */
.wd-art-goomba { background: radial-gradient(circle at 50% 60%, #fff7a8 0 30px, #ffd23f 31px 46px, #ff9ad2 47px 64px, #c79bff 65px); }
.wd-art-goomba img { position: relative; z-index: 1; width: 82px; margin-bottom: 12px; animation: wd-bob 1.8s ease-in-out infinite; }
/* estouro de Bulrushes */
.wd-art-stampede { background: linear-gradient(180deg, #ffd08a, #ff9e7a); justify-content: flex-start; }
.wd-art-stampede i {
  position: absolute; bottom: 16px; width: 58px; height: 38px; border-radius: 20px 24px 10px 10px; z-index: 1;
  background: linear-gradient(#6f7fb8, #4b5a91); animation: wd-run 2.4s linear infinite;
}
.wd-art-stampede i::before { content: ""; position: absolute; right: -8px; top: 6px; border: 8px solid transparent; border-left: 14px solid #f5ecd2; border-right: 0; transform: rotate(-24deg); }
.wd-art-stampede i::after { content: ""; position: absolute; right: 10px; top: 10px; width: 6px; height: 6px; border-radius: 50%; background: #fff; box-shadow: inset 2px 0 0 #111; }
.wd-art-stampede i:nth-child(2) { animation-delay: -.6s; bottom: 22px; }
.wd-art-stampede i:nth-child(3) { animation-delay: -1.2s; }
.wd-art-stampede i:nth-child(4) { animation-delay: -1.8s; bottom: 20px; }
@keyframes wd-run { from { left: -70px; transform: translateY(0); } 25% { transform: translateY(-6px); } 50% { transform: translateY(0); } 75% { transform: translateY(-6px); } to { left: 105%; } }

.wd-seedinfo {
  margin-top: 40px; display: flex; align-items: center; gap: 28px; justify-content: space-between;
  background: rgba(255,255,255,.14); border: 3px dashed rgba(255,255,255,.45);
  border-radius: 40px; padding: 24px 28px;
}
.wd-seedinfo h3 { font-family: var(--wd-font); font-weight: 800; font-size: 1.6rem; margin: 0 0 6px; }
.wd-seedinfo p { margin: 0; color: #f6ecff; max-width: 700px; }
.wd-trigger--inline { flex-shrink: 0; }

/* ===================== MARIO ELEFANTE ===================== */
.wd-ele {
  --bg: #5fd3ff;
  background:
    radial-gradient(ellipse 60% 40% at 10% 100%, #7fdc3a 0 60%, transparent 61%),
    radial-gradient(ellipse 50% 34% at 92% 100%, #5cc93d 0 60%, transparent 61%),
    linear-gradient(180deg, #5fd3ff, #a7e8ff 70%, #c9f2ff);
}
.wd-eleplay { display: grid; grid-template-columns: 1.6fr 1fr; gap: 24px; align-items: stretch; }
.wd-stage {
  --b: 58px; --g: 6px;
  position: relative; min-height: 330px; border-radius: 34px; overflow: hidden;
  background: linear-gradient(180deg, #ffd5ef, #fff1c9);
  border: 6px solid #fff; box-shadow: 0 10px 0 rgba(0,90,140,.25);
}
.wd-stage__sky {
  position: absolute; inset: 0;
  background:
    radial-gradient(circle at 20% 24%, #fff 0 22px, transparent 23px),
    radial-gradient(circle at 26% 20%, #fff 0 28px, transparent 29px),
    radial-gradient(circle at 32% 26%, #fff 0 20px, transparent 21px),
    radial-gradient(circle at 78% 18%, rgba(255,255,255,.8) 0 18px, transparent 19px),
    radial-gradient(circle at 83% 15%, rgba(255,255,255,.8) 0 24px, transparent 25px);
}
.wd-stage__ground {
  position: absolute; left: 0; right: 0; bottom: 0; height: 56px;
  background:
    radial-gradient(circle at 50% 0, #9be86b 0 14px, transparent 15px) 0 -8px / 30px 24px repeat-x,
    linear-gradient(#5cc93d 0 12px, #c77b3b 12px);
}
.wd-sprite { position: absolute; left: 6%; bottom: 56px; height: 230px; width: 190px; z-index: 2; transition: transform .35s cubic-bezier(.3,1.4,.5,1); }
.wd-sprite__img { position: absolute; bottom: 0; left: 0; height: 100%; width: 100%; object-fit: contain; object-position: 50% 100%; transition: opacity .25s; transform-origin: 30% 100%; }
.wd-sprite.is-elephant .wd-sprite__img { transform: scale(1.12); }
.wd-sprite.is-smack .wd-sprite__img { animation: wd-smack .35s ease; }
@keyframes wd-smack { 30% { transform: scale(1.12) rotate(-6deg) translateX(-8px); } 60% { transform: scale(1.12) rotate(5deg) translateX(14px); } }
.wd-sprite.is-bump .wd-sprite__img { animation: wd-hop .3s ease; }
@keyframes wd-hop { 50% { transform: translateY(-26px); } }
.wd-sprite.is-ghost .wd-sprite__img { opacity: .08; }
.wd-poof { position: absolute; left: 50%; top: 50%; width: 10px; height: 10px; margin: -5px; border-radius: 50%; pointer-events: none; opacity: 0; }
.wd-poof.is-on { animation: wd-poof .6s ease-out; }
@keyframes wd-poof { 0% { opacity: 1; box-shadow: 0 0 0 0 #fff, 0 0 0 0 rgba(255,210,63,.9); } 100% { opacity: 0; box-shadow: 0 0 0 120px rgba(255,255,255,0), 0 0 0 70px rgba(255,210,63,0); } }

.wd-bricks { position: absolute; right: 5%; bottom: 56px; display: flex; gap: var(--g); z-index: 1; }
.wd-brick {
  width: var(--b); height: var(--b); padding: 0; border: 0; border-radius: 6px; position: relative;
  background:
    linear-gradient(#0000 46%, #6b2a07 46% 54%, #0000 54%),
    linear-gradient(90deg, #0000 47%, #6b2a07 47% 53%, #0000 53%) 0 0 / 100% 50% no-repeat,
    linear-gradient(90deg, #0000 22%, #6b2a07 22% 28%, #0000 28% 72%, #6b2a07 72% 78%, #0000 78%) 0 100% / 100% 50% no-repeat,
    linear-gradient(#e2883c, #c4621c);
  box-shadow: inset 0 4px 0 #ffb066, inset 0 -4px 0 #8a3a0c, 0 4px 0 rgba(0,0,0,.18);
  transition: transform .15s;
}
.wd-brick:hover { transform: translateY(-3px); }
.wd-brick.is-bumped { animation: mbr-blockhit .3s ease; }
.wd-brick.is-broken { visibility: hidden; }
.wd-brickcoin {
  position: absolute; left: calc(2 * (var(--b) + var(--g)) + (var(--b) - 34px) / 2); bottom: 10px;
  opacity: 0; pointer-events: none; translate: 0 0;
  transition: opacity .2s, translate .5s cubic-bezier(.3,1.6,.5,1);
}
.wd-brickcoin.is-revealed { opacity: 1; pointer-events: auto; translate: 0 -74px; }
.wd-brickcoin.is-revealed.was-collected { opacity: .18; }
.wd-frag { position: absolute; width: 18px; height: 18px; border-radius: 3px; background: #d4742c; box-shadow: inset 0 3px 0 #ffb066; z-index: 3; pointer-events: none; animation: wd-frag .7s cubic-bezier(.2,.6,.4,1) forwards; }
@keyframes wd-frag { to { transform: translate(var(--dx), var(--dy)) rotate(var(--r)); opacity: 0; } }

.wd-elepanel {
  display: flex; flex-direction: column; gap: 14px; justify-content: center;
  background: #fff; border-radius: 34px; padding: 22px; box-shadow: 0 10px 0 rgba(0,90,140,.25);
}
.wd-fruitbtn {
  display: flex; align-items: center; gap: 14px; border: 0; padding: 10px 18px 10px 10px; border-radius: 26px; text-align: left;
  background: linear-gradient(135deg, #ff5f6d, #ff9a5a); color: #fff; box-shadow: 0 6px 0 #b8323d;
  font-family: var(--wd-font); font-weight: 800; font-size: 1.3rem; line-height: 1.1; transition: transform .2s cubic-bezier(.3,1.6,.5,1);
}
.wd-fruitbtn img { width: 76px; height: 64px; object-fit: contain; filter: drop-shadow(0 3px 0 rgba(0,0,0,.2)); animation: wd-bob 2s ease-in-out infinite; }
.wd-fruitbtn:hover { transform: translateY(-3px) rotate(-1deg); }
.wd-fruitbtn[disabled] { opacity: .5; cursor: default; transform: none; }
.wd-fruitbtn[disabled] img { animation: none; }
.wd-elemsg { margin: 0; min-height: 3em; font-weight: 800; color: var(--wd-violet); background: #f4ecff; border-radius: 18px; padding: 10px 14px; font-size: .98rem; }

.wd-powerups { margin-top: 30px; display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.wd-pu { display: flex; gap: 14px; align-items: flex-start; background: rgba(255,255,255,.88); border-radius: 28px; padding: 16px; box-shadow: 0 6px 0 rgba(0,90,140,.18); }
.wd-pu img, .wd-pu > span { width: 60px; height: 60px; object-fit: contain; flex-shrink: 0; }
.wd-pu h3 { font-family: var(--wd-font); font-weight: 800; font-size: 1.2rem; margin: 0 0 2px; color: var(--wd-violet); }
.wd-pu p { margin: 0; font-size: .93rem; }
.wd-pu__bubble { border-radius: 50%; background: radial-gradient(circle at 32% 30%, #fff 0 7px, rgba(190,240,255,.7) 8px, rgba(120,200,255,.45) 60%, rgba(80,140,255,.7) 100%); box-shadow: inset 0 0 0 3px rgba(255,255,255,.9), 0 4px 0 rgba(0,90,140,.18); }
.wd-pu__drill { position: relative; }
.wd-pu__drill::before { content: ""; position: absolute; left: 12px; right: 12px; top: 4px; bottom: 18px; clip-path: polygon(50% 0, 100% 100%, 0 100%); background: repeating-linear-gradient(160deg, #c9ced8 0 6px, #8b93a5 6px 10px); }
.wd-pu__drill::after { content: ""; position: absolute; left: 6px; right: 6px; bottom: 4px; height: 16px; border-radius: 10px 10px 6px 6px; background: radial-gradient(circle at 30% 50%, #fff 0 3px, transparent 4px), radial-gradient(circle at 70% 50%, #fff 0 3px, transparent 4px), #e4262b; }

/* ===================== INSÍGNIAS ===================== */
.wd-badges {
  --bg: #2b0b57; color: #fff;
  background:
    radial-gradient(circle, rgba(255,255,255,.5) 0 1.5px, transparent 2px) 0 0 / 70px 70px,
    radial-gradient(circle, rgba(255,210,63,.5) 0 2px, transparent 3px) 35px 35px / 90px 90px,
    linear-gradient(180deg, #2b0b57, #3e1180);
}
.wd-badgewrap { display: grid; grid-template-columns: 1.5fr 1fr; gap: 32px; align-items: start; }
.wd-badgegrid { display: grid; grid-template-columns: repeat(5, 1fr); gap: 18px 12px; }
.wd-badge {
  display: flex; flex-direction: column; align-items: center; gap: 8px; border: 0; background: none; padding: 4px; color: #fff;
  font-family: var(--wd-font); font-weight: 700; font-size: .92rem; line-height: 1.1; text-align: center;
}
.wd-badge svg {
  width: 88px; height: 88px; padding: 18px; border-radius: 50%;
  background: radial-gradient(circle at 35% 30%, var(--b1), var(--b2));
  box-shadow: inset 0 -6px 0 rgba(0,0,0,.2), 0 0 0 5px #fff, 0 7px 0 5px rgba(0,0,0,.3);
  transition: transform .25s cubic-bezier(.3,1.8,.5,1), box-shadow .2s;
}
.wd-badge--action { --b1: #ff8cc6; --b2: #d61f72; }
.wd-badge--boost { --b1: #7fe3ff; --b2: #0a7fd1; }
.wd-badge--expert { --b1: #c08cff; --b2: #4a148c; }
.wd-badge:hover svg, .wd-badge:focus-visible svg { transform: translateY(-4px) rotate(-6deg) scale(1.05); }
.wd-badge[aria-pressed="true"] svg { box-shadow: inset 0 -6px 0 rgba(0,0,0,.2), 0 0 0 5px var(--wd-yellow), 0 0 0 10px rgba(255,210,63,.35), 0 7px 0 8px rgba(0,0,0,.3); transform: scale(1.08); }
.wd-badge[aria-pressed="true"] span::after { content: " ✓"; color: var(--wd-yellow); }
.wd-badgeinfo { position: relative; background: #fff; color: var(--wd-ink); border-radius: 36px 28px 40px 30px; padding: 26px 26px 24px; box-shadow: 0 10px 0 rgba(0,0,0,.3); min-height: 240px; }
.wd-badgeinfo__tag { display: inline-block; font-weight: 900; font-size: .78rem; letter-spacing: 1px; text-transform: uppercase; padding: 4px 12px; border-radius: 999px; background: #eee6ff; color: var(--wd-violet); }
.wd-badgeinfo[data-cat="action"] .wd-badgeinfo__tag { background: #ffd6ea; color: #a3104f; }
.wd-badgeinfo[data-cat="boost"] .wd-badgeinfo__tag { background: #d3f2ff; color: #05558f; }
.wd-badgeinfo[data-cat="expert"] .wd-badgeinfo__tag { background: #ead9ff; color: #4a148c; }
.wd-badgeinfo h3 { font-family: var(--wd-font); font-weight: 800; font-size: 1.8rem; margin: 10px 0 6px; color: var(--wd-violet); line-height: 1.05; }
.wd-badgeinfo p { margin: 0; }
.wd-qblock { position: absolute; right: -14px; top: -30px; width: 56px; height: 56px; }
/* Sensor equipada: moedas escondidas brilham */
body.wd-sensor .wonder [data-coin]:not(.was-collected):not(.is-collected) { animation: wd-sense 1s ease-in-out infinite; outline: 3px dashed var(--wd-yellow); outline-offset: 6px; border-radius: 50%; }
body.wd-sensor .wonder .wd-brickcoin:not(.is-revealed) { animation: none; outline: 0; }
@keyframes wd-sense { 50% { filter: drop-shadow(0 0 12px #ffd23f) brightness(1.3); } }
body.wd-invisible .wonder .wd-sprite__img, body.wd-invisible .wonder .wd-hero__ele { opacity: .1; }

/* ===================== MUNDOS ===================== */
.wd-worlds {
  --bg: #19b5e6;
  background:
    radial-gradient(ellipse 30px 8px at 50% 50%, rgba(255,255,255,.2) 0 60%, transparent 62%) 0 0 / 120px 60px,
    radial-gradient(ellipse 22px 6px at 50% 50%, rgba(255,255,255,.14) 0 60%, transparent 62%) 60px 30px / 120px 60px,
    linear-gradient(180deg, #19b5e6, #0f8fd0);
}
.wd-worlds .wd-h2 { color: #fff; text-shadow: 0 4px 0 rgba(8,60,110,.4); }
.wd-worlds .wd-sechead p:not(.wd-eyebrow) { color: #fff; text-shadow: 0 1px 2px rgba(8,60,110,.6); font-weight: 700; }
.wd-islands { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 26px 22px; }
.wd-isle {
  position: relative; background: #fff; padding: 0 0 18px; overflow: visible;
  border-radius: 48px 36px 44px 30px / 40px 46px 34px 48px;
  box-shadow: 0 10px 0 rgba(8,60,110,.3);
}
.wd-isle:nth-child(even) { border-radius: 36px 50px 30px 46px / 46px 34px 48px 38px; transform: translateY(18px); }
.wd-isle h3 { font-family: var(--wd-font); font-weight: 800; font-size: 1.35rem; margin: 12px 18px 4px; color: var(--wd-violet); line-height: 1.1; }
.wd-isle p { margin: 0 18px; font-size: .95rem; }
.wd-isle__art { display: block; height: 120px; border-radius: inherit; border-bottom-left-radius: 30% 24px; border-bottom-right-radius: 30% 24px; position: relative; overflow: hidden; }
.wd-isle--petal .wd-isle__art { background:
  radial-gradient(circle at 25% 60%, #ff8cc6 0 12px, transparent 13px), radial-gradient(circle at 33% 52%, #ff8cc6 0 12px, transparent 13px), radial-gradient(circle at 29% 56%, #ffe066 0 7px, transparent 8px),
  radial-gradient(ellipse 50% 30% at 30% 70%, #7fdc3a 0 60%, transparent 61%), radial-gradient(ellipse 40% 26% at 76% 64%, #5cc93d 0 60%, transparent 61%),
  linear-gradient(#a8ecff, #34c7f0); }
.wd-isle--pipe .wd-isle__art { background:
  linear-gradient(90deg, transparent 18%, #1ca331 18% 30%, transparent 30%) 0 40px / 100% 80px no-repeat,
  linear-gradient(90deg, transparent 14%, #2fd14a 14% 34%, transparent 34%) 0 30px / 100% 14px no-repeat,
  linear-gradient(90deg, transparent 62%, #1ca331 62% 76%, transparent 76%) 0 60px / 100% 60px no-repeat,
  linear-gradient(90deg, transparent 58%, #2fd14a 58% 80%, transparent 80%) 0 50px / 100% 14px no-repeat,
  linear-gradient(#ffd9a0 0 70%, #d98c4a 70%); }
.wd-isle--fluff .wd-isle__art { background:
  radial-gradient(circle at 20% 80%, #fff 0 26px, transparent 27px), radial-gradient(circle at 36% 86%, #fff 0 30px, transparent 31px), radial-gradient(circle at 70% 84%, #fff 0 28px, transparent 29px), radial-gradient(circle at 86% 80%, #fff 0 22px, transparent 23px),
  conic-gradient(from 150deg at 52% 20%, #e8f1ff 0 60deg, transparent 0) ,
  linear-gradient(#9ec3ff, #d8e6ff); }
.wd-isle--falls .wd-isle__art { background:
  repeating-linear-gradient(90deg, rgba(255,255,255,.55) 0 6px, transparent 6px 16px) 40% 0 / 34% 100% no-repeat,
  radial-gradient(circle at 80% 30%, #fff 0 3px, transparent 4px), radial-gradient(circle at 18% 40%, #fff 0 3px, transparent 4px),
  linear-gradient(90deg, #3fb5ff 0 36%, #74d6ff 36% 72%, #3fb5ff 72%); }
.wd-isle--desert .wd-isle__art { background:
  radial-gradient(circle at 78% 30%, #fff3a6 0 18px, #ffd23f 19px 24px, transparent 25px),
  radial-gradient(ellipse 60% 40% at 25% 100%, #f2a33b 0 70%, transparent 72%), radial-gradient(ellipse 60% 44% at 80% 105%, #e08a2a 0 70%, transparent 72%),
  linear-gradient(#ffb36b, #ffe1a6); }
.wd-isle--fungi .wd-isle__art { background:
  radial-gradient(ellipse 22px 14px at 28% 58%, #ff6fd8 0 70%, transparent 72%), linear-gradient(90deg, transparent 26.5%, #f2e6d0 26.5% 29.5%, transparent 29.5%) 0 66px / 100% 54px no-repeat,
  radial-gradient(ellipse 30px 18px at 68% 46%, #6ff0ff 0 70%, transparent 72%), linear-gradient(90deg, transparent 66.5%, #f2e6d0 66.5% 69.5%, transparent 69.5%) 0 56px / 100% 64px no-repeat,
  radial-gradient(circle at 50% 50%, #5a2a9c, #2a0f52 80%); }
.wd-isle--magma .wd-isle__art { background:
  radial-gradient(circle at 30% 78%, #ffd23f 0 8px, transparent 9px), radial-gradient(circle at 62% 70%, #ffd23f 0 6px, transparent 7px),
  radial-gradient(ellipse 80% 40% at 50% 100%, #ff6a00 0 60%, transparent 62%),
  linear-gradient(#4a0e1a, #a3201f); }
.wd-isle--special .wd-isle__art { background:
  radial-gradient(circle at 20% 30%, #fff 0 2px, transparent 3px), radial-gradient(circle at 70% 20%, #fff 0 2px, transparent 3px), radial-gradient(circle at 85% 60%, #fff 0 2px, transparent 3px),
  radial-gradient(circle at 50% 120%, transparent 0 60px, #ff4fa3 61px 68px, #ffd23f 69px 76px, #7fdc3a 77px 84px, #1ec8ff 85px 92px, #7b2ff7 93px 100px, transparent 101px),
  linear-gradient(#1a0840, #3e1180); }
.wd-flowercoin {
  position: absolute; right: 16px; top: 12px; width: 46px; height: 46px; border: 0; padding: 0; border-radius: 50%;
  background: radial-gradient(circle at 50% 50%, #d9a6ff 0 30%, #9b3cf0 31% 64%, #6a1bb8 65%);
  box-shadow: inset 0 -4px 0 rgba(0,0,0,.25), 0 0 0 3px #fff; color: #fff; font-family: var(--wd-font); font-weight: 800; font-size: .95rem;
  animation: mbr-spin 2.2s linear infinite;
}
.wd-flowercoin span { position: relative; top: 2px; }

/* ===================== ELENCO ===================== */
.wd-cast {
  --bg: #ffe3f1;
  background:
    radial-gradient(circle, rgba(123,47,247,.10) 0 10px, transparent 11px) 0 0 / 60px 60px,
    var(--bg);
}
.wd-castgrid { list-style: none; margin: 0 0 40px; padding: 0; display: grid; grid-template-columns: repeat(8, 1fr); gap: 14px; }
.wd-char { position: relative; text-align: center; padding-top: 8px; }
.wd-char::before { content: ""; position: absolute; left: 50%; top: 40px; width: 110px; height: 110px; margin-left: -55px; border-radius: 50%; background: var(--c); opacity: .9; box-shadow: 0 0 0 8px #fff; }
.wd-char img, .wd-char svg { position: relative; height: 170px; width: 100%; object-fit: contain; filter: drop-shadow(0 6px 0 rgba(0,0,0,.12)); transition: transform .3s cubic-bezier(.3,1.8,.5,1); }
.wd-char:hover img, .wd-char:hover svg { transform: translateY(-8px) rotate(-3deg); }
.wd-char span { position: relative; display: inline-block; margin-top: 8px; font-family: var(--wd-font); font-weight: 800; font-size: 1.1rem; background: #fff; color: var(--wd-violet); padding: 4px 14px 2px; border-radius: 999px; box-shadow: 0 3px 0 rgba(74,20,140,.18); }
.wd-char__tag { position: absolute; top: 0; right: 0; font-style: normal; font-size: .7rem; font-weight: 900; text-transform: uppercase; letter-spacing: .5px; background: var(--wd-yellow); color: #4a2a00; padding: 3px 8px; border-radius: 999px; transform: rotate(8deg); z-index: 1; }
.wd-duo { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; }
.wd-duo__card { display: flex; gap: 18px; align-items: center; background: #fff; border-radius: 40px 30px 44px 34px; padding: 20px 24px; box-shadow: 0 10px 0 rgba(74,20,140,.14); }
.wd-duo__card h3 { font-family: var(--wd-font); font-weight: 800; font-size: 1.5rem; margin: 0 0 4px; color: var(--wd-violet); }
.wd-duo__card p { margin: 0; }
.wd-duo__card img { width: 120px; height: 120px; object-fit: contain; flex-shrink: 0; }
.wd-florian__art { position: relative; width: 120px; height: 100px; flex-shrink: 0; }
.wd-florian__art i { position: absolute; bottom: 10px; width: 40px; height: 40px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, #b8ff7a, #3fb83a); box-shadow: inset 0 -4px 0 rgba(0,0,0,.15); }
.wd-florian__art i:nth-child(1) { left: 0; width: 32px; height: 32px; }
.wd-florian__art i:nth-child(2) { left: 26px; }
.wd-florian__art i:nth-child(3) { left: 58px; bottom: 26px; width: 54px; height: 54px; background: radial-gradient(circle at 35% 30%, #c8ff8a, #46c240); }
.wd-florian__art i:nth-child(3)::before, .wd-florian__art i:nth-child(3)::after { content: ""; position: absolute; top: 18px; width: 8px; height: 12px; border-radius: 50%; background: #1b1036; }
.wd-florian__art i:nth-child(3)::before { left: 16px; } .wd-florian__art i:nth-child(3)::after { right: 12px; }
.wd-florian__art b { position: absolute; left: 70px; top: 0; width: 32px; height: 22px; background: var(--wd-yellow); clip-path: polygon(0 100%, 0 20%, 25% 60%, 50% 0, 75% 60%, 100% 20%, 100% 100%); }

/* ===================== ONLINE ===================== */
.wd-online {
  --bg: #3a0ca3; color: #fff;
  background:
    radial-gradient(circle, rgba(255,255,255,.6) 0 1.5px, transparent 2px) 0 0 / 50px 50px,
    linear-gradient(180deg, #3a0ca3, #7209b7 70%, #b5179e);
}
.wd-online__in { display: flex; justify-content: flex-end; }
.wd-online .wd-blob { max-width: 640px; }
.wd-blob--dark { background: rgba(20, 4, 50, .72); color: #fff; box-shadow: 0 12px 0 rgba(0,0,0,.25); border: 3px solid rgba(255,255,255,.18); }
.wd-blob--dark .wd-h2 { color: #fff; text-shadow: 0 4px 0 rgba(0,0,0,.35); }
.wd-list { margin: 14px 0 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.wd-list li { position: relative; padding-left: 30px; }
.wd-list li::before { content: ""; position: absolute; left: 0; top: 4px; width: 18px; height: 18px; border-radius: 50%; background: radial-gradient(circle at 50% 50%, #ffe066 0 30%, #ff4fa3 31%); box-shadow: 0 0 0 3px rgba(255,255,255,.3); }
.wd-shadows { position: absolute; inset: auto 0 40px 0; height: 180px; z-index: 1; pointer-events: none; }
.wd-shadows img { position: absolute; bottom: 0; height: 150px; width: auto; opacity: .32; filter: saturate(.4) brightness(1.6) drop-shadow(0 0 10px rgba(200,170,255,.8)); animation: wd-ghostrun 14s linear infinite; }
.wd-shadows img:nth-child(2) { height: 130px; animation-delay: -3.5s; animation-duration: 16s; }
.wd-shadows img:nth-child(3) { height: 100px; animation-delay: -8s; animation-duration: 12s; }
.wd-shadows img:nth-child(4) { height: 140px; animation-delay: -11s; animation-duration: 15s; }
@keyframes wd-ghostrun { 0% { left: -12%; transform: translateY(0); } 20% { transform: translateY(-50px); } 25% { transform: translateY(0); } 60% { transform: translateY(-34px); } 65% { transform: translateY(0); } 100% { left: 108%; transform: translateY(0); } }
.wd-coin-shadow { position: absolute; left: calc(8% + 150px); top: 22%; z-index: 3; opacity: .75; }
.wd-standee { position: absolute; left: 8%; top: 18%; width: 170px; z-index: 2; transform: rotate(-4deg); }
.wd-standee img { width: 100%; filter: drop-shadow(0 0 0 #fff) drop-shadow(5px 0 0 #fff) drop-shadow(-5px 0 0 #fff) drop-shadow(0 5px 0 #fff) drop-shadow(0 -5px 0 #fff) drop-shadow(0 12px 10px rgba(0,0,0,.35)); }
.wd-standee::after { content: ""; position: absolute; left: 50%; bottom: -16px; width: 110px; height: 22px; margin-left: -55px; border-radius: 50%; background: radial-gradient(#d9c39a, #a8875a); box-shadow: 0 6px 0 rgba(0,0,0,.25); z-index: -1; }
.wd-standee figcaption { position: absolute; left: 50%; bottom: -54px; translate: -50% 0; white-space: nowrap; font-family: var(--wd-font); font-weight: 800; font-size: .9rem; background: #fff; color: var(--wd-violet); padding: 4px 12px 2px; border-radius: 999px; transform: rotate(4deg); }

/* ===================== CURIOSIDADES ===================== */
.wd-trivia {
  --bg: #ffe066;
  background:
    radial-gradient(circle, rgba(255,255,255,.45) 0 14px, transparent 15px) 0 0 / 80px 80px,
    radial-gradient(circle, rgba(255,138,61,.18) 0 8px, transparent 9px) 40px 40px / 80px 80px,
    var(--bg);
}
.wd-trivia .wd-h2 { color: #6a1bb8; }
.wd-facts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px 28px; }
.wd-fact { display: flex; gap: 14px; align-items: flex-end; }
.wd-fact:last-child:nth-child(odd) { grid-column: 1 / -1; max-width: 640px; margin: 0 auto; }
.wd-fact p { position: relative; margin: 0; background: #fff; padding: 16px 20px; border-radius: 28px 28px 28px 6px; box-shadow: 0 6px 0 rgba(180,110,0,.25); font-size: 1rem; }
.wd-fact p strong:first-child { font-family: var(--wd-font); font-weight: 800; color: var(--wd-hotpink); font-size: 1.15rem; }
.wd-fact__flower { position: relative; flex-shrink: 0; width: 40px; height: 40px; margin: 0 6px 8px; }
.wd-fact__flower::after {
  content: ""; position: absolute; inset: 0; border-radius: 50%;
  background: radial-gradient(circle at 36% 40%, #1b1036 0 3px, transparent 4px), radial-gradient(circle at 64% 40%, #1b1036 0 3px, transparent 4px), radial-gradient(ellipse 7px 4px at 50% 68%, #b3134f 0 80%, transparent 90%), radial-gradient(circle at 40% 35%, #fffbe6, #ffe28a);
}
.wd-fact__flower::before { content: ""; position: absolute; left: 50%; top: 50%; width: 24px; height: 24px; margin: -12px; border-radius: 50%; background: #ff5fa8; box-shadow: 0 -20px 0 #ff5fa8, 19px -6px 0 #ff5fa8, 12px 17px 0 #ff5fa8, -12px 17px 0 #ff5fa8, -19px -6px 0 #ff5fa8; }
.wd-fact:nth-child(3n+2) .wd-fact__flower::before { background: #8a5cff; box-shadow: 0 -20px 0 #8a5cff, 19px -6px 0 #8a5cff, 12px 17px 0 #8a5cff, -12px 17px 0 #8a5cff, -19px -6px 0 #8a5cff; }
.wd-fact:nth-child(3n) .wd-fact__flower::before { background: #1ec8ff; box-shadow: 0 -20px 0 #1ec8ff, 19px -6px 0 #1ec8ff, 12px 17px 0 #1ec8ff, -12px 17px 0 #1ec8ff, -19px -6px 0 #1ec8ff; }

/* ===================== ONDE JOGAR ===================== */
.wd-play {
  --bg: #45c45a; color: #fff; padding-bottom: 0;
  background: linear-gradient(180deg, #45c45a 0%, #2f9e44 100%);
}
.wd-playgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; max-width: 1000px; margin: 0 auto; }
.wd-platform { background: #fff; color: var(--wd-ink); border-radius: 36px 28px 40px 30px; padding: 24px; box-shadow: 0 10px 0 rgba(10,70,20,.35); }
.wd-platform h3 { font-family: var(--wd-font); font-weight: 800; font-size: 1.45rem; line-height: 1.1; margin: 12px 0 6px; color: var(--wd-violet); }
.wd-platform p { margin: 0; }
.wd-platform__chip { display: inline-block; font-weight: 900; font-size: .78rem; letter-spacing: 1px; text-transform: uppercase; padding: 5px 12px; border-radius: 999px; background: #e60012; color: #fff; }
.wd-platform--ns2 .wd-platform__chip { background: #1b1b1f; }
.wd-endpipe { position: relative; display: flex; justify-content: center; margin-top: 70px; z-index: 2; }
.wd-endpipe img { width: 150px; margin-bottom: -14px; position: relative; z-index: 1; }
.wd-play::after {
  content: ""; display: block; height: 48px; position: relative;
  background:
    linear-gradient(#0000 22px, #00000040 22px 24px, #0000 24px) 0 0 / 48px 24px,
    linear-gradient(90deg, #0000 46px, #00000040 46px) 0 0 / 48px 24px,
    #c77b3b;
  box-shadow: inset 0 6px 0 #5cc93d, inset 0 10px 0 #3fa52f;
}
.wd-coin-pipe { position: absolute; left: 50%; top: -52px; margin-left: -17px; z-index: 0; animation: mbr-spin 1.6s linear infinite; }

/* ===================== EFEITO WONDER ===================== */
.wd-fx { position: fixed; inset: 0; z-index: 450; pointer-events: none; overflow: hidden; opacity: 0; transition: opacity .6s; }
body.wd-is-wonder .wd-fx { opacity: 1; }
.wd-tint {
  position: fixed; inset: 0; z-index: 449; pointer-events: none; mix-blend-mode: hue; opacity: 0; visibility: hidden;
  background: linear-gradient(90deg, #ff00b8, #ffe600, #00d9ff, #8a00ff, #ff00b8) 0 0 / 200vw 100% repeat-x;
  transition: opacity .6s, visibility 0s .6s;
}
body.wd-is-wonder .wd-tint { opacity: .85; visibility: visible; transition: opacity .6s; animation: wd-tint 2.6s linear infinite; }
@keyframes wd-tint { to { background-position: 200vw 0; } }
.wd-spark {
  position: absolute; width: var(--s, 18px); height: var(--s, 18px); left: var(--x); top: var(--y);
  background: var(--c, #fff); clip-path: polygon(50% 0, 61% 39%, 100% 50%, 61% 61%, 50% 100%, 39% 61%, 0 50%, 39% 39%);
  animation: wd-sparkfly var(--d, 4s) ease-in infinite; animation-delay: var(--dl, 0s);
  filter: drop-shadow(0 0 6px #fff);
}
@keyframes wd-sparkfly { 0% { transform: translateY(40px) scale(0) rotate(0); opacity: 0; } 20% { opacity: 1; transform: translateY(0) scale(1) rotate(45deg); } 100% { transform: translateY(-260px) scale(.4) rotate(220deg); opacity: 0; } }

body.wd-is-wonder .wonder > section { animation: wd-tilt 1.3s ease-in-out infinite alternate; }
body.wd-is-wonder .wonder > section:nth-child(even) { animation-direction: alternate-reverse; }
@keyframes wd-tilt { from { transform: rotate(-.7deg); } to { transform: rotate(.7deg); } }
body.wd-is-wonder .wonder [data-wobble],
body.wd-is-wonder .wonder .wd-effect,
body.wd-is-wonder .wonder .wd-isle,
body.wd-is-wonder .wonder .wd-char,
body.wd-is-wonder .wonder .wd-badge,
body.wd-is-wonder .wonder .wd-pu,
body.wd-is-wonder .wonder .wd-fact,
body.wd-is-wonder .wonder .wd-h2 { animation: wd-wobble .8s ease-in-out infinite alternate; }
body.wd-is-wonder .wonder :is(.wd-effect, .wd-isle, .wd-char, .wd-badge, .wd-pu, .wd-fact):nth-child(odd) { animation-delay: -.4s; }
body.wd-is-wonder .wonder :is(.wd-effect, .wd-isle, .wd-char, .wd-badge, .wd-pu, .wd-fact):nth-child(3n) { animation-duration: .65s; }
@keyframes wd-wobble { from { transform: rotate(-2deg) translateY(0) scale(1); } to { transform: rotate(2deg) translateY(-6px) scale(1.02); } }
body.wd-is-wonder .wonder .wd-pipe { animation: wd-inch .9s ease-in-out infinite; }
body.wd-is-wonder .wonder .wd-pipe--2 { animation-delay: -.3s; }
body.wd-is-wonder .wonder .wd-pipe--3 { animation-delay: -.6s; }
body.wd-is-wonder .wonder .wd-piranha img { transform: translateY(0); animation: wd-sing .45s ease-in-out .6s infinite alternate; }
body.wd-is-wonder .wonder .wd-hero__sky { animation: wd-skyspin 2s linear infinite; }
@keyframes wd-skyspin { to { filter: hue-rotate(360deg); } }
body.wd-is-wonder .wonder .wd-hero__logo img { animation: wd-wobble .5s ease-in-out infinite alternate; }

/* ===================== RESPONSIVO ===================== */
@media (max-width: 1100px) {
  .wd-effects { grid-template-columns: repeat(2, 1fr); }
  .wd-powerups { grid-template-columns: repeat(2, 1fr); }
  .wd-islands { grid-template-columns: repeat(2, 1fr); }
  .wd-castgrid { grid-template-columns: repeat(4, 1fr); row-gap: 26px; }
  .wd-badgegrid { grid-template-columns: repeat(4, 1fr); }
}
@media (max-width: 900px) {
  .wd-hero__in { grid-template-columns: 1fr; padding-bottom: 150px; }
  .wd-hero__art { min-height: 0; height: 420px; max-width: 560px; width: 100%; margin: 0 auto; }
  .wd-sobre__grid, .wd-badgewrap, .wd-eleplay, .wd-duo, .wd-playgrid { grid-template-columns: 1fr; }
  .wd-ficha { transform: none; }
  .wd-seedinfo { flex-direction: column; align-items: flex-start; }
  .wd-online__in { justify-content: center; }
  .wd-standee { left: auto; right: 4%; top: auto; bottom: 24px; width: 110px; opacity: .9; }
  .wd-online { padding-bottom: 200px; }
  .wd-pipe--3 { right: 6%; }
}
@media (max-width: 600px) {
  .wd-sec { padding: 64px 0 72px; }
  .wd-hero__art { height: 340px; }
  .wd-cover { width: 52%; margin-right: 4%; }
  .wd-hero__ele { width: 62%; bottom: -12px; }
  .wd-tflower--hero { right: auto; left: 44%; bottom: -30px; }
  .wd-wonderbtn img { width: 70px; height: 70px; }
  .wd-wonderbtn__ring { width: 82px; height: 82px; margin-top: -41px; -webkit-mask: radial-gradient(circle, transparent 0 37px, #000 38px); mask: radial-gradient(circle, transparent 0 37px, #000 38px); }
  .wd-wonderbtn__label { font-size: 1.12rem; }
  .wd-pipe { width: 76px; }
  .wd-pipe--2 { left: 30%; width: 60px; }
  .wd-facts { grid-template-columns: 1fr; }
  .wd-effects, .wd-powerups {
    grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 84%; gap: 14px;
    overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 -16px; padding: 6px 16px 22px; scrollbar-width: none;
  }
  .wd-effects::-webkit-scrollbar, .wd-powerups::-webkit-scrollbar { display: none; }
  .wd-effect, .wd-pu { scroll-snap-align: center; }
  .wd-effects + .wd-seedinfo { margin-top: 18px; }
  .wd-islands { gap: 16px 12px; }
  .wd-isle h3 { font-size: 1.08rem; margin: 10px 12px 4px; }
  .wd-isle p { margin: 0 12px; font-size: .84rem; line-height: 1.45; }
  .wd-isle__art { height: 84px; }
  .wd-flowercoin { right: 8px; top: 6px; width: 38px; height: 38px; font-size: .8rem; }
  .wd-isle:nth-child(even) { transform: none; }
  .wd-castgrid { grid-template-columns: repeat(3, 1fr); gap: 18px 6px; }
  .wd-char::before { width: 80px; height: 80px; margin-left: -40px; top: 34px; box-shadow: 0 0 0 5px #fff; }
  .wd-char img, .wd-char svg { height: 124px; }
  .wd-char span { font-size: .92rem; padding: 3px 10px 1px; }
  .wd-char__tag { font-size: .6rem; padding: 2px 6px; }
  .wd-badgegrid { grid-template-columns: repeat(3, 1fr); gap: 16px 6px; }
  .wd-badge svg { width: 72px; height: 72px; padding: 14px; }
  .wd-badge { font-size: .82rem; }
  .wd-stage { --b: 44px; --g: 4px; min-height: 290px; }
  .wd-sprite { height: 180px; width: 140px; left: 3%; }
  .wd-bricks { right: 3%; }
  .wd-duo__card { flex-direction: column; text-align: center; }
  .wd-ficha dl div { grid-template-columns: 1fr; gap: 0; }
  .wd-tflower--sobre, .wd-peek { display: none; }
  .wd-fact__flower { display: none; }
  .wd-fact p { border-radius: 24px; }
  .wd-coin-cloud { top: auto; bottom: 500px; right: 12px; }
  .wd-shadows { bottom: 10px; height: 120px; }
  .wd-standee { display: none; }
  .wd-coin-shadow { left: auto; right: 16px; top: 40px; }
  .wd-shadows img { height: 96px; }
  .wd-shadows img:nth-child(n+2) { height: 84px; }
}

/* ===================== MOVIMENTO REDUZIDO ===================== */
@media (prefers-reduced-motion: reduce) {
  .wonder :not([data-coin]), .wonder :not([data-coin])::before, .wonder :not([data-coin])::after { animation: none !important; }
  body.wd-is-wonder .wonder > section { transform: none; }
  body.wd-is-wonder .wd-tint { animation: none !important; opacity: .6; }
  .wd-spark { animation: none !important; opacity: .85; }
}