/* =========================================================
   Paper Mario: The Thousand-Year Door - tema "papelaria"
   Papel kraft, papelão, bordas rasgadas, fita adesiva,
   figurinhas e um palco de teatro de papel.
   Tudo escopado em .pp / body[data-game="paper"].
   ========================================================= */

body[data-game="paper"] {
  --pp-kraft: #cfa56c;
  --pp-kraft-d: #a97b45;
  --pp-card: #fffaf0;
  --pp-ink: #2a1b12;
  --pp-red: #c8102e;
  --pp-red-d: #8e0b20;
  --pp-gold: #ffcf33;
  --pp-blue: #2a5aa8;
  --pp-night: #1e1030;
  --pp-hand: "Patrick Hand", "Gochi Hand", "Comic Sans MS", cursive;
  --pp-scribble: "Gochi Hand", "Patrick Hand", cursive;
  --pp-display: "Luckiest Guy", "Lilita One", "Arial Black", sans-serif;
  --pp-noise: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='240' height='240'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 .32 0 0 0 0 .2 0 0 0 0 .08 0 0 0 .5 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --pp-fibers: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.012 .35' numOctaves='2' seed='4'/%3E%3CfeColorMatrix values='0 0 0 0 .45 0 0 0 0 .3 0 0 0 0 .14 0 0 0 .28 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E");
  --pp-torn: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 12' preserveAspectRatio='none'%3E%3Cpath d='M0 12V5l8 3 7-6 9 5 7-4 9 6 7-5 9 4 7-7 9 5 8-3 8 6 8-5 8 3 8-5 8 6 8-5 8 6 8-4 8 3 8-6 8 5 8-3 8 5 8-6 8 3v6z' fill='%23fffaf0'/%3E%3C/svg%3E");
  background: var(--pp-kraft);
}

.pp {
  position: relative;
  color: var(--pp-ink);
  background-color: var(--pp-kraft);
  background-image: var(--pp-noise), var(--pp-fibers);
  overflow-x: clip;
  font-size: 17px;
}
.pp ::selection { background: var(--pp-gold); color: var(--pp-ink); }
.pp a { color: var(--pp-red); }
.pp-wrap { max-width: 1180px; margin: 0 auto; padding: 0 16px; position: relative; }
.pp-sec { position: relative; padding: 76px 0; }

/* ---------- Tipografia ---------- */
.pp-h2 {
  margin: 0 0 22px; font-family: var(--pp-display); font-weight: 400; line-height: 1.05;
  font-size: clamp(30px, 4.6vw, 54px); letter-spacing: .5px;
  filter: drop-shadow(5px 6px 0 rgba(60, 30, 10, .28));
}
.pp-h2 span {
  display: inline-block; background: var(--pp-card); color: var(--pp-red);
  padding: .26em .7em .12em; rotate: -1.5deg;
  clip-path: polygon(0 4%, 100% 0, 98.6% 22%, 100% 44%, 98.4% 64%, 100% 84%, 98.8% 100%, 0 96%, 1.4% 78%, 0 58%, 1.6% 38%, 0 18%);
}
.pp-h2--dark span { background: var(--pp-ink); color: var(--pp-gold); }
.pp-h2--night span { background: #2d1a4a; color: #f3d6ff; }
.pp-h3 { font-family: var(--pp-display); font-weight: 400; font-size: clamp(24px, 3vw, 32px); margin: 48px 0 16px; color: #f3d6ff; letter-spacing: .5px; }
.pp-sechead { max-width: 820px; margin: 0 auto 34px; text-align: center; }
.pp-sechead p { font-size: 18px; margin: 0; background: rgba(255, 250, 240, .78); padding: 14px 18px; border-radius: 4px; box-shadow: 3px 4px 0 rgba(60, 30, 10, .16); rotate: .4deg; }
.pp-sechead--light p { background: rgba(255, 255, 255, .08); color: #efe6ff; box-shadow: none; }
.pp-note { font-family: var(--pp-hand); font-size: 20px; text-align: center; margin: 22px auto 0; max-width: 760px; }
.pp-hint { font-family: var(--pp-hand); font-size: 19px; color: #6b3f1f; }
.pp-list { padding-left: 1.1em; margin: 0 0 12px; }
.pp-list li { margin: 6px 0; }
.pp-list li::marker { content: "✦ "; color: var(--pp-red); }

/* ---------- Peças de papelaria ---------- */
.pp-tape {
  position: absolute; width: 110px; height: 30px; z-index: 3; pointer-events: none;
  background: linear-gradient(rgba(255, 255, 255, .35), rgba(255, 255, 255, .1)), rgba(240, 225, 170, .72);
  clip-path: polygon(0 8%, 6% 0, 12% 10%, 18% 0, 82% 0, 88% 10%, 94% 0, 100% 8%, 100% 92%, 94% 100%, 88% 90%, 82% 100%, 18% 100%, 12% 90%, 6% 100%, 0 92%);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .1);
}
.pp-tape--tl { top: -12px; left: -22px; rotate: -32deg; }
.pp-tape--tr { top: -12px; right: -22px; rotate: 30deg; }
.pp-tape--top { top: -16px; left: 50%; translate: -50% 0; rotate: -3deg; }

.pp-sheet {
  position: relative; background: var(--pp-card); padding: 40px clamp(20px, 4vw, 44px) 36px;
  box-shadow: 0 1px 0 #e8dcc4, 10px 14px 0 rgba(60, 30, 10, .22);
  background-image: linear-gradient(transparent 31px, rgba(42, 90, 168, .08) 32px);
  background-size: 100% 32px;
}
.pp-torn::before, .pp-torn::after {
  content: ""; position: absolute; left: 0; right: 0; height: 12px; background: var(--pp-torn) 0 0 / 180px 12px repeat-x;
}
.pp-torn::before { top: -11px; }
.pp-torn::after { bottom: -11px; transform: scaleY(-1); }
.pp-sheet p { margin: 0 0 14px; }

.pp-sticker {
  display: inline-block; padding: 5px 14px 3px; border-radius: 999px;
  background: var(--c, var(--pp-red)); color: #fff; border: 3px solid #fff;
  font-family: var(--pp-hand); font-size: 20px; line-height: 1.2;
  box-shadow: 2px 3px 0 rgba(0, 0, 0, .22); rotate: var(--r, -2deg);
}
.pp-sticker--red { --c: var(--pp-red); --r: -3deg; }
.pp-sticker--blue { --c: var(--pp-blue); --r: 2deg; }
.pp-sticker--yellow { --c: var(--pp-gold); --r: -1deg; color: var(--pp-ink); }

.pp-btn {
  display: inline-flex; align-items: center; gap: 8px; text-decoration: none; border: 3px solid #fff;
  font-family: var(--pp-display); font-size: 21px; letter-spacing: .8px; color: #fff !important;
  background: var(--pp-red); padding: 10px 22px 6px; border-radius: 10px;
  box-shadow: 0 5px 0 var(--pp-red-d), 4px 9px 0 rgba(0, 0, 0, .18);
  transition: transform .15s, box-shadow .15s; cursor: pointer;
}
.pp-btn:hover { transform: translateY(-3px) rotate(-1deg); box-shadow: 0 8px 0 var(--pp-red-d), 4px 12px 0 rgba(0, 0, 0, .18); }
.pp-btn:active { transform: translateY(3px); box-shadow: 0 2px 0 var(--pp-red-d); }
.pp-btn--alt { background: var(--pp-blue); box-shadow: 0 5px 0 #173a75, 4px 9px 0 rgba(0, 0, 0, .18); }
.pp-btn--alt:hover { box-shadow: 0 8px 0 #173a75, 4px 12px 0 rgba(0, 0, 0, .18); }
.pp-btn--small { font-size: 17px; padding: 8px 16px 5px; }
.pp-btn[disabled] { opacity: .45; cursor: default; transform: none; }

.pp-chip {
  font-family: var(--pp-hand); font-size: 20px; border: 3px solid var(--pp-ink); background: var(--pp-card);
  border-radius: 12px; padding: 6px 16px 4px; box-shadow: 3px 3px 0 var(--pp-ink); transition: transform .12s, box-shadow .12s, background .2s;
}
.pp-chip:hover { transform: translate(-1px, -2px); box-shadow: 4px 5px 0 var(--pp-ink); }
.pp-chip[aria-pressed="true"] { background: var(--pp-gold); }

/* ---------- Botão flutuante "Modo papel" ---------- */
.pp-modebtn {
  position: fixed; right: 16px; bottom: 18px; z-index: 450;
  display: flex; align-items: center; gap: 10px; padding: 8px 16px 8px 10px;
  border: 3px solid #fff; border-radius: 16px; background: var(--pp-ink); color: #fff;
  box-shadow: 0 6px 0 #000, 0 10px 24px rgba(0, 0, 0, .3); rotate: -2deg;
  transition: transform .2s, background .2s;
}
.pp-modebtn:hover { transform: translateY(-3px) rotate(2deg); }
.pp-modebtn svg { width: 38px; height: 38px; transition: transform .5s cubic-bezier(.3, 1.6, .5, 1); }
.pp-modebtn__txt { display: flex; flex-direction: column; line-height: 1.05; text-align: left; }
.pp-modebtn small { font-family: var(--pp-hand); font-size: 15px; opacity: .85; }
.pp-modebtn b { font-family: var(--pp-display); font-weight: 400; font-size: 18px; letter-spacing: .6px; color: var(--pp-gold); }
.pp-modebtn[aria-pressed="true"] { background: var(--pp-red); }
.pp-modebtn[aria-pressed="true"] svg { transform: rotate(-20deg) scale(1.15); }

/* ===================== HERÓI ===================== */
.pp-hero {
  position: relative; overflow: hidden; isolation: isolate;
  min-height: clamp(560px, 78vh, 760px); padding: 74px 0 120px;
  background:
    radial-gradient(ellipse 46% 60% at 50% 46%, rgba(255, 246, 210, .9), rgba(255, 246, 210, 0) 70%),
    linear-gradient(#9fd3ef, #cdeaf5 55%, #f3e1b5);
}
.pp-hero::before { /* fundo pintado em papel: morros recortados */
  content: ""; position: absolute; left: 0; right: 0; bottom: 70px; height: 220px; z-index: -1;
  background:
    radial-gradient(ellipse 30% 70% at 18% 100%, #79c35a 98%, transparent 100%),
    radial-gradient(ellipse 34% 80% at 78% 100%, #5fae4e 98%, transparent 100%),
    radial-gradient(ellipse 26% 50% at 50% 100%, #8fd16e 98%, transparent 100%);
  filter: drop-shadow(0 -4px 0 #fffaf0);
}
.pp-hero__clouds i {
  position: absolute; z-index: -1; width: 120px; height: 40px; border-radius: 40px; background: #fff;
  box-shadow: 30px -18px 0 4px #fff, 64px -6px 0 0 #fff, 4px 4px 0 3px rgba(80, 120, 150, .2);
  animation: pp-cloud 14s ease-in-out infinite alternate;
}
.pp-hero__clouds i:nth-child(1) { left: 14%; top: 22%; }
.pp-hero__clouds i:nth-child(2) { left: 64%; top: 14%; scale: .8; animation-delay: -5s; }
.pp-hero__clouds i:nth-child(3) { left: 80%; top: 42%; scale: .6; animation-delay: -9s; }
@keyframes pp-cloud { to { translate: 40px 0; } }

.pp-hero__valance {
  position: absolute; left: 0; right: 0; top: 0; height: 58px; z-index: 4;
  background:
    radial-gradient(circle at 50% 0, #c4183a 0 34px, #8e0d22 35px 38px, transparent 39px) 0 14px / 76px 44px repeat-x,
    linear-gradient(#a5102a 0 22px, #ffcf33 22px 28px, transparent 28px);
  filter: drop-shadow(0 6px 4px rgba(0, 0, 0, .25));
}
.pp-hero__curtain, .pp-theater__curtain {
  position: absolute; top: 0; bottom: 0; z-index: 3; width: clamp(34px, 9vw, 150px);
  background: repeating-linear-gradient(90deg, #7d0b1e 0, #b5112f 9px, #e0274a 16px, #c4183a 22px, #8e0d22 30px);
  box-shadow: inset -10px 0 18px rgba(0, 0, 0, .35), 6px 0 12px rgba(0, 0, 0, .25);
}
.pp-hero__curtain--l, .pp-theater__curtain--l { left: 0; border-bottom-right-radius: 70% 26%; }
.pp-hero__curtain--r, .pp-theater__curtain--r { right: 0; border-bottom-left-radius: 70% 26%; transform: scaleX(-1); }
.pp-hero__tassel.mbr-coin { position: absolute; z-index: 5; left: calc(clamp(34px, 9vw, 150px) - 20px); top: 52%; width: 28px; height: 34px; }
.pp-hero__spot { position: absolute; inset: 0; z-index: -1; background: radial-gradient(circle at 50% 120%, rgba(255, 255, 255, .35), transparent 50%); }

.pp-hero__in {
  position: relative; z-index: 2; max-width: 1120px; margin: 0 auto; padding: 0 clamp(44px, 10vw, 160px);
  display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); align-items: center; gap: 24px;
}
.pp-hero__card {
  position: relative; background: var(--pp-card); padding: 26px clamp(18px, 3vw, 34px) 28px; rotate: -1.5deg;
  box-shadow: 0 1px 0 #e7dcc4, 10px 14px 0 rgba(60, 30, 10, .25);
}
.pp-hero__card::after { content: ""; position: absolute; left: 0; right: 0; bottom: -11px; height: 12px; background: var(--pp-torn) 0 0 / 180px 12px repeat-x; transform: scaleY(-1); }
.pp-hero__logo { margin: 0 0 10px; }
.pp-hero__logo img { width: min(420px, 100%); margin: 0 auto; filter: drop-shadow(3px 4px 0 rgba(0, 0, 0, .2)); }
.pp-hero__hook { font-family: var(--pp-hand); font-size: clamp(21px, 2.3vw, 26px); line-height: 1.3; margin: 0 0 14px; text-align: center; }
.pp-hero__hook em { color: var(--pp-red); font-style: normal; text-decoration: underline wavy var(--pp-gold) 2px; text-underline-offset: 4px; }
.pp-hero__tags { list-style: none; margin: 0 0 18px; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; }
.pp-hero__cta { display: flex; flex-wrap: wrap; gap: 14px; justify-content: center; }
.pp-hero__mario { margin: 0; justify-self: center; transform-origin: 50% 90%; transition: transform .6s cubic-bezier(.3, 1.4, .5, 1); }
.pp-hero__mario img { width: min(380px, 100%); filter: drop-shadow(10px 14px 0 rgba(40, 20, 10, .25)); animation: pp-bob 3.2s ease-in-out infinite; }
@keyframes pp-bob { 50% { transform: translateY(-12px) rotate(2deg); } }
.pp-hero__floor {
  position: absolute; left: 0; right: 0; bottom: 0; height: 96px; z-index: 1;
  background: repeating-linear-gradient(90deg, #b07a45 0 118px, #8e5d31 118px 121px), linear-gradient(#c58c52, #8e5d31);
  background-blend-mode: multiply;
  box-shadow: inset 0 6px 0 #6b4220;
}

/* Plateia de silhuetas (TTYD) */
.pp-crowd {
  position: absolute; left: 0; right: 0; bottom: -14px; z-index: 5; height: 74px;
  display: flex; justify-content: center; align-items: flex-end; gap: 2px; pointer-events: none;
}
.pp-fan {
  position: relative; flex: none; width: 50px; height: 62px; margin: 0 -2px;
  background: #1b1020; border-radius: 24px 24px 8px 8px; translate: 0 var(--y, 0);
}
.pp-fan::after {
  content: ""; position: absolute; left: 0; right: 0; top: 18px; height: 16px;
  background: radial-gradient(circle at 36% 50%, #fff 0 4px, transparent 5px), radial-gradient(circle at 64% 50%, #fff 0 4px, transparent 5px);
}
.pp-fan--toad::before { content: ""; position: absolute; left: -8px; right: -8px; top: -10px; height: 34px; background: #1b1020; border-radius: 50% 50% 40% 40%; }
.pp-fan--toad::after { top: 26px; }
.pp-fan--koopa { border-radius: 26px 18px 8px 8px; }
.pp-fan--koopa::before { content: ""; position: absolute; right: -10px; bottom: 6px; width: 30px; height: 26px; background: #1b1020; border-radius: 50% 50% 20% 20%; }
.pp-fan--boo { border-radius: 50% 50% 30% 30%; width: 44px; height: 50px; }
.pp-fan--shy::after { background: radial-gradient(circle at 50% 50%, #3d2a40 0 15px, transparent 16px), radial-gradient(circle at 38% 45%, #fff 0 3px, transparent 4px); top: 10px; height: 34px; }
.pp-fan--tall { height: 72px; }
.pp-crowd.is-cheer .pp-fan { animation: pp-cheer .42s ease var(--d, 0s) 3; }
.pp-crowd.is-boo .pp-fan { animation: pp-shake .3s ease var(--d, 0s) 2; }
@keyframes pp-cheer { 50% { transform: translateY(-16px); } }
@keyframes pp-shake { 25% { transform: translateX(-3px) rotate(-3deg); } 75% { transform: translateX(3px) rotate(3deg); } }
.pp-fan.is-leaving { transition: opacity .6s, transform .6s; opacity: 0; transform: translateY(30px); }

/* ===================== SOBRE ===================== */
.pp-about__grid { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 40px; align-items: center; }
.pp-tattle { position: relative; display: grid; justify-items: center; }
.pp-tattle__pic { margin: 0; width: min(240px, 70%); rotate: 4deg; }
.pp-tattle__pic img { filter: drop-shadow(8px 10px 0 rgba(60, 30, 10, .25)); }
.pp-bubble { position: relative; background: var(--pp-card); border: 3px solid var(--pp-ink); border-radius: 22px; padding: 16px 18px 12px; margin-top: 18px; box-shadow: 6px 7px 0 rgba(60, 30, 10, .22); font-family: var(--pp-hand); font-size: 19px; line-height: 1.35; }
.pp-bubble::before { content: ""; position: absolute; top: -18px; left: 46%; border: 16px solid transparent; border-bottom-color: var(--pp-ink); border-top: 0; }
.pp-bubble::after { content: ""; position: absolute; top: -12px; left: calc(46% + 3px); border: 13px solid transparent; border-bottom-color: var(--pp-card); border-top: 0; }
.pp-bubble p { margin: 0 0 6px; }
.pp-bubble__tag { font-family: var(--pp-display); color: var(--pp-red); font-size: 24px; letter-spacing: 1px; }

/* ===================== FICHA ===================== */
.pp-folder {
  position: relative; background: #f1c98a; padding: 50px clamp(16px, 3vw, 40px) 40px; border-radius: 4px 14px 14px 14px;
  box-shadow: inset 0 -6px 0 #d9ad69, 10px 14px 0 rgba(60, 30, 10, .22);
  background-image: var(--pp-noise);
}
.pp-folder__tab {
  position: absolute; left: 0; top: -34px; background: #f1c98a; padding: 6px 22px 4px; border-radius: 12px 12px 0 0;
  font-family: var(--pp-hand); font-size: 19px; color: #6b3f1f;
}
.pp-ficha__list { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(250px, 100%), 1fr)); gap: 18px; margin: 0; }
.pp-card {
  background: var(--pp-card); padding: 14px 16px 12px; border-radius: 3px; box-shadow: 3px 4px 0 rgba(60, 30, 10, .18);
  border-top: 6px solid var(--pp-red);
}
.pp-card:nth-child(3n+1) { rotate: -1deg; border-top-color: var(--pp-blue); }
.pp-card:nth-child(3n+2) { rotate: .8deg; border-top-color: #3fa34d; }
.pp-card dt { font-family: var(--pp-hand); font-size: 17px; color: #8a5a2b; text-transform: uppercase; letter-spacing: .5px; }
.pp-card dd { margin: 2px 0 0; font-weight: 800; line-height: 1.35; }
.pp-stamp {
  position: absolute; right: clamp(10px, 4vw, 40px); top: -28px; rotate: 12deg;
  border: 4px double var(--pp-red); color: var(--pp-red); border-radius: 10px; padding: 6px 12px; text-align: center;
  font-family: var(--pp-display); font-size: 16px; letter-spacing: 1px; line-height: 1.15; background: rgba(255, 250, 240, .7); opacity: .9;
}

/* ===================== LIVRO DE CAPÍTULOS ===================== */
.pp-book {
  position: relative; max-width: 1060px; margin: 0 auto; padding: 56px 18px 18px; border-radius: 16px;
  background: linear-gradient(135deg, #7a3b1d, #5a2a12); box-shadow: inset 0 0 0 4px #9b5a2e, inset 0 0 0 7px #ffcf33, 12px 16px 0 rgba(60, 30, 10, .3);
}
.pp-book__tabs { position: absolute; top: -16px; left: 22px; right: 22px; display: flex; gap: 6px; justify-content: center; flex-wrap: nowrap; }
.pp-book__tabs button {
  flex: 1 1 0; max-width: 92px; min-width: 0; border: 0; padding: 22px 4px 18px; color: #fff;
  font-family: var(--pp-display); font-size: 17px; letter-spacing: .5px; line-height: 1;
  background: var(--tc, var(--pp-red));
  clip-path: polygon(0 0, 100% 0, 100% 100%, 50% 82%, 0 100%);
  transition: padding .25s, filter .2s; filter: brightness(.82);
}
.pp-book__tabs button:nth-child(3n+1) { --tc: var(--pp-red); }
.pp-book__tabs button:nth-child(3n+2) { --tc: var(--pp-blue); }
.pp-book__tabs button:nth-child(3n) { --tc: #3fa34d; }
.pp-book__tabs button[aria-selected="true"] { padding-top: 30px; filter: none; }
.pp-book__tabs button:hover { filter: brightness(1.05); }
.pp-book__tabs button:focus-visible { outline-offset: -4px; }

.pp-book__body { position: relative; perspective: 2000px; }
.pp-page {
  position: relative; display: grid; grid-template-columns: 1fr 1fr; min-height: 440px;
  background: var(--pp-card); border-radius: 6px; box-shadow: 0 0 0 3px #e7dcc4, 0 8px 0 #d8c9a8, 0 12px 0 #c4b28c;
}
.pp-page[hidden] { display: none; }
.pp-page:focus-visible { outline-offset: 4px; }
.pp-page::before {
  content: ""; position: absolute; left: 50%; top: 0; bottom: 0; width: 60px; translate: -50% 0; z-index: 2; pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(80, 50, 20, .14) 40%, rgba(80, 50, 20, .3) 50%, rgba(80, 50, 20, .14) 60%, transparent);
}
.pp-page__l, .pp-page__r { position: relative; padding: 28px clamp(16px, 2.6vw, 34px); backface-visibility: hidden; background: var(--pp-card); border-radius: 6px; }
.pp-page__l { display: grid; place-items: center; transform-origin: right center; }
.pp-page__r { transform-origin: left center; }
.pp-scene { width: 100%; max-width: 440px; border-radius: 6px; box-shadow: 0 0 0 6px #fff, 0 0 0 7px #e2d6bd, 6px 10px 0 7px rgba(60, 30, 10, .15); rotate: -1deg; overflow: visible; }
.pp-scene .pop > * { stroke: #fffaf0; stroke-width: 4; paint-order: stroke; stroke-linejoin: round; }
.pp-scene .pop { transform-box: fill-box; transform-origin: 50% 100%; filter: drop-shadow(3px 4px 0 rgba(0, 0, 0, .22)); }
.pp-page.is-active .pop { animation: pp-popup .7s cubic-bezier(.3, 1.6, .5, 1) both; animation-delay: calc(.32s + var(--i, 0) * .14s); }
@keyframes pp-popup { 0% { transform: scaleY(0) skewX(8deg); } 100% { transform: none; } }
.pp-scene__coin.mbr-coin { position: absolute; left: 49%; top: 64%; width: 26px; height: 31px; }
.pp-page.is-in-next .pp-page__l { animation: pp-leaf-next .75s cubic-bezier(.4, .1, .3, 1) both; }
.pp-page.is-in-prev .pp-page__r { animation: pp-leaf-prev .75s cubic-bezier(.4, .1, .3, 1) both; }
@keyframes pp-leaf-next { 0% { transform: rotateY(-180deg); } 100% { transform: rotateY(0); } }
@keyframes pp-leaf-prev { 0% { transform: rotateY(180deg); } 100% { transform: rotateY(0); } }
.pp-page__kicker { font-family: var(--pp-hand); color: #8a5a2b; font-size: 20px; margin: 0; text-transform: uppercase; letter-spacing: 1px; }
.pp-page__r h3 { font-family: var(--pp-display); font-weight: 400; font-size: clamp(26px, 3vw, 38px); line-height: 1.05; margin: 4px 0 2px; color: var(--pp-red); letter-spacing: .5px; }
.pp-page__pt { font-family: var(--pp-scribble); font-size: 21px; margin: 0 0 12px; color: var(--pp-blue); }
.pp-page__r > p:not([class]) { margin: 0 0 14px; }
.pp-page__facts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 0; }
.pp-page__facts div { background: #f5ecd8; border-radius: 6px; padding: 6px 10px; border-left: 4px solid var(--pp-gold); }
.pp-page__facts dt { font-family: var(--pp-hand); font-size: 15px; color: #8a5a2b; line-height: 1.1; }
.pp-page__facts dd { margin: 0; font-weight: 800; font-size: 15px; line-height: 1.25; }
.pp-book__nav { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 22px; }
.pp-book__count { margin: 0; font-family: var(--pp-display); color: var(--pp-gold); font-size: 20px; letter-spacing: 1px; text-align: center; }

/* ===================== PALCO / ACTION COMMAND ===================== */
.pp-theater {
  position: relative; overflow: hidden; border-radius: 14px; isolation: isolate;
  background: #2a0f1a; padding: 64px clamp(40px, 9vw, 150px) 0; min-height: 600px;
  box-shadow: 0 0 0 6px #4a2410, 0 0 0 9px #ffcf33, 12px 18px 0 9px rgba(60, 30, 10, .3);
}
.pp-theater__valance { position: absolute; left: 0; right: 0; top: 0; height: 56px; z-index: 6; background:
    radial-gradient(circle at 50% 0, #c4183a 0 30px, #8e0d22 31px 34px, transparent 35px) 0 14px / 66px 40px repeat-x,
    linear-gradient(#a5102a 0 20px, #ffcf33 20px 25px, transparent 25px); filter: drop-shadow(0 6px 4px rgba(0, 0, 0, .3)); }
.pp-theater__curtain { z-index: 5; width: clamp(30px, 8vw, 130px); }
.pp-theater__hud { position: relative; z-index: 4; display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-bottom: 10px; }
.pp-hud__box { display: flex; align-items: center; gap: 8px; background: rgba(255, 250, 240, .95); border: 3px solid var(--pp-ink); border-radius: 12px; padding: 4px 12px 2px; font-family: var(--pp-hand); font-size: 18px; }
.pp-hud__box b { font-family: var(--pp-display); font-weight: 400; color: var(--pp-red); font-size: 18px; letter-spacing: 1px; }
.pp-hud__sp { display: inline-block; width: 110px; height: 14px; border-radius: 8px; background: #3d2a40; overflow: hidden; border: 2px solid var(--pp-ink); }
.pp-hud__sp i { display: block; height: 100%; width: 0; background: linear-gradient(90deg, #ffcf33, #ff7ac8, #7ad7ff); transition: width .4s; }

.pp-theater__stage {
  position: relative; z-index: 1; height: 300px; border-radius: 8px 8px 0 0; overflow: hidden;
  background:
    radial-gradient(ellipse 50% 50% at 50% 20%, rgba(255, 245, 200, .55), transparent 70%),
    linear-gradient(#ffd38a, #ffb0a0 60%, #f08aa0);
}
.pp-theater__stage::before { /* fundo de papelão com morros */
  content: ""; position: absolute; left: 0; right: 0; bottom: 60px; height: 140px;
  background: radial-gradient(ellipse 32% 70% at 22% 100%, #6fbf5a 98%, transparent 100%), radial-gradient(ellipse 36% 80% at 80% 100%, #4f9f45 98%, transparent 100%);
  filter: drop-shadow(0 -4px 0 #fffaf0);
}
.pp-theater__stage::after { /* tablado */
  content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 64px;
  background: repeating-linear-gradient(90deg, #b07a45 0 90px, #8e5d31 90px 93px), #a06b3a; box-shadow: inset 0 5px 0 #6b4220;
}
.pp-ac__mario, .pp-ac__foe { position: absolute; z-index: 2; bottom: 46px; filter: drop-shadow(5px 6px 0 rgba(40, 20, 10, .3)); }
.pp-ac__mario { left: 14%; width: 140px; transition: transform .25s; }
.pp-ac__foe { right: 16%; width: 96px; transform-origin: 50% 100%; }
.pp-ac__mario.is-jump { animation: pp-jumpatk .5s cubic-bezier(.3, .6, .4, 1); }
@keyframes pp-jumpatk { 0% { transform: none; } 45% { transform: translate(var(--jx, 220px), -120px) rotate(10deg); } 70% { transform: translate(var(--jx, 220px), -40px); } 100% { transform: none; } }
.pp-ac__foe.is-hit { animation: pp-squish .35s ease .18s; }
@keyframes pp-squish { 40% { transform: scale(1.3, .55); } 100% { transform: none; } }
.pp-ac__foe.is-ko { animation: pp-ko .9s ease-in forwards; }
@keyframes pp-ko { 30% { transform: translate(20px, -60px) rotate(40deg); } 100% { transform: translate(260px, -280px) rotate(720deg) scale(.4); opacity: 0; } }
.pp-ac__mario.is-hurt { animation: pp-hurt .5s ease; }
@keyframes pp-hurt { 20%, 60% { transform: translateX(-10px) rotate(-6deg); filter: brightness(1.6); } 40%, 80% { transform: translateX(8px) rotate(4deg); } }
.pp-ac__rating {
  position: absolute; z-index: 4; left: 50%; top: 30%; margin: 0; translate: -50% -50%; pointer-events: none;
  font-family: var(--pp-display); font-size: clamp(34px, 6vw, 64px); letter-spacing: 1px; color: var(--rc, var(--pp-gold)); white-space: nowrap;
  text-shadow: 3px 0 #fff, -3px 0 #fff, 0 3px #fff, 0 -3px #fff, 2px 2px #fff, -2px -2px #fff, 2px -2px #fff, -2px 2px #fff, 6px 8px 0 rgba(0, 0, 0, .3);
}
.pp-ac__rating.is-show { animation: pp-rating .9s cubic-bezier(.3, 1.6, .5, 1) both; }
@keyframes pp-rating { 0% { transform: scale(.2) rotate(-12deg); opacity: 0; } 25% { transform: scale(1.15) rotate(3deg); opacity: 1; } 80% { transform: scale(1) rotate(-2deg); opacity: 1; } 100% { transform: scale(1) translateY(-14px); opacity: 0; } }
.pp-ac__props { position: absolute; inset: 0; z-index: 3; pointer-events: none; }
.pp-ac__props img, .pp-ac__props .pp-rock { position: absolute; width: 40px; height: 40px; object-fit: contain; filter: drop-shadow(2px 3px 0 rgba(0, 0, 0, .25)); }
.pp-rock { border-radius: 40% 55% 45% 50%; background: radial-gradient(circle at 35% 30%, #a7a39b, #6e6a62); }
.pp-ac__coinholder { position: absolute; z-index: 5; pointer-events: auto; }
.pp-ac__coinholder .mbr-coin { display: block; }
.pp-ac__foe.is-enter { animation: pp-enter .6s cubic-bezier(.3, 1.5, .5, 1); }
@keyframes pp-enter { 0% { transform: translateY(-260px); opacity: 0; } 60% { opacity: 1; } }

.pp-crowd--theater { position: relative; bottom: auto; margin-top: -40px; height: 70px; z-index: 3; }
.pp-ac__ctrl { position: relative; z-index: 6; display: flex; align-items: center; justify-content: center; gap: 22px; padding: 22px 8px 26px; flex-wrap: wrap; background: #1b1020; margin: 0 calc(-1 * clamp(40px, 9vw, 150px)); padding-left: clamp(40px, 9vw, 150px); padding-right: clamp(40px, 9vw, 150px); }
.pp-ac__a {
  position: relative; flex: none; width: 104px; height: 104px; border-radius: 50%; border: 5px solid #fff;
  background: radial-gradient(circle at 35% 30%, #7ff08e, #1f9d3a 70%); box-shadow: 0 7px 0 #0d5a20, 0 12px 20px rgba(0, 0, 0, .4);
  transition: transform .08s, box-shadow .08s;
}
.pp-ac__a:active, .pp-ac__a.is-press { transform: translateY(5px); box-shadow: 0 2px 0 #0d5a20; }
.pp-ac__aface { font-family: var(--pp-display); font-size: 52px; color: #fff; line-height: 1; position: relative; top: 4px; text-shadow: 0 3px 0 #0d5a20; }
.pp-ac__ring { position: absolute; inset: -9px; border-radius: 50%; border: 6px solid var(--pp-gold); box-shadow: 0 0 12px rgba(255, 207, 51, .8); transform: scale(var(--s, 1)); opacity: var(--o, 0); pointer-events: none; }
.pp-ac__ring.is-good { border-color: #7dff9a; }
.pp-ac__side { max-width: 460px; color: #fff; }
.pp-ac__msg { font-family: var(--pp-hand); font-size: 23px; margin: 0 0 4px; color: var(--pp-gold); }
.pp-ac__help { margin: 0; font-size: 15px; color: #e6dcef; }

/* ===================== BAÚ PRETO ===================== */
.pp-curses__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 40px; align-items: center; }
.pp-chest { background: #1c1418; border-radius: 18px; padding: 16px; box-shadow: inset 0 0 0 4px #3a2a30, inset 0 0 0 7px #8a6a3a, 10px 14px 0 rgba(60, 30, 10, .3); }
.pp-chest__stage {
  position: relative; height: 300px; border-radius: 10px; overflow: hidden; perspective: 900px;
  background: radial-gradient(ellipse 60% 70% at 50% 40%, #fff7da, #f3d9a3 70%), #f3d9a3;
}
.pp-chest__stage::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 40px; background: repeating-linear-gradient(90deg, #b07a45 0 70px, #8e5d31 70px 72px); }
.pp-chest__mario { position: absolute; z-index: 2; left: 50%; bottom: 32px; width: 150px; translate: -50% 0; transition: transform .6s cubic-bezier(.3, 1.3, .5, 1), opacity .3s; filter: drop-shadow(5px 6px 0 rgba(40, 20, 10, .25)); }
.pp-chest__plane, .pp-chest__tube, .pp-chest__boat { position: absolute; z-index: 3; opacity: 0; transition: opacity .3s; pointer-events: none; filter: drop-shadow(4px 6px 0 rgba(40, 20, 10, .25)); }
.pp-chest__plane { width: 150px; left: 10%; top: 30%; }
.pp-chest__tube { width: 90px; left: 10%; bottom: 40px; }
.pp-chest__boat { width: 170px; left: 50%; bottom: 46px; translate: -50% 0; }
.pp-chest__bars { position: absolute; z-index: 3; left: 50%; bottom: 40px; width: 90px; height: 200px; translate: -50% 0; opacity: 0; transition: opacity .3s; background: repeating-linear-gradient(90deg, #4a4a55 0 10px, transparent 10px 30px); }
.pp-chest__water { position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; height: 0; transition: height .5s; background: repeating-radial-gradient(circle at 20px -6px, transparent 0 14px, #3f86c8 15px) 0 0 / 40px 100%, #3f86c8; }
.pp-chest__label { position: absolute; z-index: 4; left: 12px; top: 10px; margin: 0; font-family: var(--pp-hand); font-size: 21px; background: var(--pp-card); border: 2px solid var(--pp-ink); border-radius: 10px; padding: 2px 12px 0; }
.pp-chest__coin.mbr-coin { position: absolute; z-index: 5; right: 18px; top: 14px; }
.pp-chest__btns { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 16px; }
.pp-chest__progress { text-align: center; color: #e6dcef; font-family: var(--pp-hand); font-size: 18px; margin: 10px 0 0; }
.pp-chest[data-form="plane"] .pp-chest__mario,
.pp-chest[data-form="tube"] .pp-chest__mario,
.pp-chest[data-form="boat"] .pp-chest__mario { opacity: 0; transform: scale(.3) rotate(30deg); }
.pp-chest[data-form="plane"] .pp-chest__plane { opacity: 1; animation: pp-fly 3.2s ease-in-out infinite; }
@keyframes pp-fly { 0% { transform: translate(0, 0) rotate(-6deg); } 50% { transform: translate(min(22vw, 200px), 60px) rotate(8deg); } 100% { transform: translate(0, 0) rotate(-6deg); } }
.pp-chest[data-form="paper"] .pp-chest__bars { opacity: 1; }
.pp-chest[data-form="paper"] .pp-chest__mario { transform: rotateY(84deg); animation: pp-slip 3s ease-in-out infinite; }
@keyframes pp-slip { 0%, 100% { translate: -230% 0; } 50% { translate: 130% 0; } }
.pp-chest[data-form="tube"] .pp-chest__tube { opacity: 1; animation: pp-roll 3s ease-in-out infinite; }
@keyframes pp-roll { 0%, 100% { transform: translateX(0) rotate(0); } 50% { transform: translateX(min(28vw, 260px)) rotate(540deg); } }
.pp-chest[data-form="boat"] .pp-chest__water { height: 70px; }
.pp-chest[data-form="boat"] .pp-chest__boat { opacity: 1; animation: pp-bobboat 2.4s ease-in-out infinite; }
@keyframes pp-bobboat { 0%, 100% { transform: translateY(0) rotate(-4deg); } 50% { transform: translateY(-8px) rotate(4deg); } }

/* ===================== PARCEIROS ===================== */
.pp-album { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 26px; }
.pp-album > li { flex: 0 1 260px; }
.pp-partner {
  position: relative; background: #fff; border-radius: 22px; padding: 18px 18px 16px; text-align: center;
  box-shadow: 0 0 0 2px #e2d6bd, 8px 10px 0 rgba(60, 30, 10, .22);
}
.pp-partner:nth-child(odd) { rotate: -1.2deg; }
.pp-partner:nth-child(even) { rotate: 1.2deg; }
.pp-partner__pic { display: grid; place-items: center; width: 140px; height: 140px; margin: -2px auto 10px; border-radius: 50%; background: radial-gradient(circle, #fff3c4, #ffd98a); box-shadow: 0 0 0 5px #fff, 0 0 0 7px #e2d6bd; overflow: hidden; }
.pp-partner__pic svg { width: 86%; }
.pp-partner__pic--img img { width: 88%; height: 88%; object-fit: contain; }
.pp-partner h3 { font-family: var(--pp-display); font-weight: 400; color: var(--pp-red); font-size: 25px; letter-spacing: .5px; margin: 0; }
.pp-partner__role { font-family: var(--pp-hand); font-size: 19px; color: var(--pp-blue); margin: 0 0 6px; }
.pp-partner p:last-child, .pp-partner > p:not([class]) { font-size: 15.5px; margin: 0; }
.pp-peel { display: block; margin: 0 auto 10px; padding: 0; border: 0; background: none; position: relative; }
.pp-peel .pp-partner__pic { margin: 0 auto; transition: transform .6s cubic-bezier(.3, 1.4, .5, 1), box-shadow .6s; }
.pp-peel:hover .pp-partner__pic { transform: rotate(-8deg) translate(-4px, -4px); box-shadow: 0 0 0 5px #fff, 0 0 0 7px #e2d6bd, 10px 12px 0 rgba(60, 30, 10, .25); }
.pp-peel[aria-expanded="true"] .pp-partner__pic { transform: translate(-40px, -30px) rotate(-28deg) scale(.82); box-shadow: 0 0 0 5px #fff, 0 0 0 7px #e2d6bd, 16px 20px 0 rgba(60, 30, 10, .25); }
.pp-peel__hint { display: inline-block; margin-top: 6px; font-family: var(--pp-hand); font-size: 15px; color: #8a5a2b; text-decoration: underline dashed; }
.pp-partner__secret { display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 10px; font-family: var(--pp-hand); font-size: 17px; }
.pp-partner__secret[hidden] { display: none; }

/* ===================== PORTA MILENAR ===================== */
.pp-door {
  background:
    radial-gradient(circle at 20% 20%, rgba(255, 255, 255, .9) 0 1px, transparent 2px) 13px 7px / 97px 89px,
    radial-gradient(circle at 60% 70%, rgba(255, 255, 255, .6) 0 1px, transparent 2px) 41px 23px / 151px 137px,
    radial-gradient(circle at 40% 30%, #ffe9a8 0 1.5px, transparent 2.5px) 67px 51px / 233px 211px,
    radial-gradient(ellipse 60% 50% at 50% 40%, #4a2370, transparent 70%),
    var(--pp-night);
  color: #efe6ff;
}
.pp-door::before, .pp-door::after { content: ""; position: absolute; left: 0; right: 0; height: 12px; z-index: 1; background: var(--pp-torn) 0 0 / 180px 12px repeat-x; filter: brightness(.82) sepia(.5); }
.pp-door::before { top: -1px; transform: scaleY(-1); }
.pp-door::after { bottom: -1px; }
.pp-gate { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: 36px; align-items: center; }
.pp-gate__door { position: relative; width: min(340px, 100%); aspect-ratio: 340 / 420; margin: 40px auto 0; perspective: 1000px; }
.pp-gate__inside {
  position: absolute; inset: 0; border-radius: 170px 170px 6px 6px; display: grid; place-content: center; justify-items: center; gap: 12px; text-align: center; padding: 30px;
  background: radial-gradient(circle at 50% 55%, #f0c0ff, #a46bff 30%, #3a1260 70%, #12051e); box-shadow: inset 0 0 40px #000;
  font-family: var(--pp-hand); font-size: 22px; color: #fff;
}
.pp-gate__inside p { margin: 0; text-shadow: 0 2px 6px #000; opacity: 0; transition: opacity .6s .8s; }
.pp-gate__coin.mbr-coin { opacity: 0; transition: opacity .6s 1s; }
.pp-gate.is-open .pp-gate__inside p, .pp-gate.is-open .pp-gate__coin { opacity: 1; }
.pp-gate__coin.was-collected { opacity: .18 !important; }
.pp-gate__leaf {
  position: absolute; top: 0; bottom: 0; width: 50%; transition: transform 1.4s cubic-bezier(.5, 0, .2, 1);
  background:
    linear-gradient(90deg, rgba(0, 0, 0, .25), transparent 12%, transparent 88%, rgba(0, 0, 0, .3)),
    repeating-linear-gradient(90deg, #6a4b2e 0 26px, #5a3d24 26px 30px), #6a4b2e;
  box-shadow: inset 0 0 0 6px #3b2416;
}
.pp-gate__leaf::after { content: ""; position: absolute; top: 46%; width: 18px; height: 18px; border-radius: 50%; background: #ffcf33; box-shadow: 0 0 0 4px #8a6a1e; }
.pp-gate__leaf--l { left: 0; border-radius: 170px 0 0 6px / 170px 0 0 6px; transform-origin: left center; }
.pp-gate__leaf--r { right: 0; border-radius: 0 170px 6px 0 / 0 170px 6px 0; transform-origin: right center; }
.pp-gate__leaf--l::after { right: 14px; }
.pp-gate__leaf--r::after { left: 14px; }
.pp-gate.is-open .pp-gate__leaf--l { transform: rotateY(-105deg); }
.pp-gate.is-open .pp-gate__leaf--r { transform: rotateY(105deg); }
.pp-gate__sockets { position: absolute; left: 50%; top: 52%; width: 0; height: 0; z-index: 3; }
.pp-gate__sockets i {
  position: absolute; width: 34px; height: 34px; margin: -17px; border-radius: 50%;
  background: #1d0f2a; box-shadow: inset 0 3px 6px #000, 0 0 0 3px #8a6a1e;
  transform: rotate(calc(-90deg + (var(--k) - 3) * 30deg)) translateX(calc(min(340px, 82vw) * .62)) rotate(calc(90deg - (var(--k) - 3) * 30deg));
  transition: background .4s, box-shadow .4s;
}
.pp-gate__sockets i:nth-child(1) { --k: 0; } .pp-gate__sockets i:nth-child(2) { --k: 1; } .pp-gate__sockets i:nth-child(3) { --k: 2; }
.pp-gate__sockets i:nth-child(4) { --k: 3; } .pp-gate__sockets i:nth-child(5) { --k: 4; } .pp-gate__sockets i:nth-child(6) { --k: 5; } .pp-gate__sockets i:nth-child(7) { --k: 6; }
.pp-gate__sockets i.is-on { background: radial-gradient(circle, #fff, var(--c) 55%); box-shadow: 0 0 18px var(--c), 0 0 0 3px #ffcf33; animation: pp-twinkle 1.6s ease-in-out infinite; }
@keyframes pp-twinkle { 50% { filter: brightness(1.4); } }
.pp-gate__stars { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(200px, 100%), 1fr)); gap: 12px; }
.pp-cstar {
  width: 100%; display: flex; align-items: center; gap: 10px; text-align: left; padding: 10px 12px; border-radius: 14px;
  background: rgba(255, 255, 255, .07); border: 2px solid rgba(255, 255, 255, .18); color: #fff; transition: transform .2s, background .2s;
}
.pp-cstar:hover { transform: translateY(-3px); background: rgba(255, 255, 255, .14); }
.pp-cstar svg { flex: none; width: 40px; height: 40px; fill: var(--c); filter: drop-shadow(0 0 8px var(--c)); transition: transform .5s cubic-bezier(.3, 1.6, .5, 1), opacity .4s; }
.pp-cstar span { display: flex; flex-direction: column; line-height: 1.15; }
.pp-cstar b { font-family: var(--pp-display); font-weight: 400; letter-spacing: .5px; font-size: 18px; }
.pp-cstar small { font-family: var(--pp-hand); font-size: 15px; opacity: .85; }
.pp-cstar[aria-pressed="true"] { background: rgba(255, 207, 51, .12); border-color: #ffcf33; }
.pp-cstar[aria-pressed="true"] svg { transform: scale(.6) rotate(144deg); opacity: .5; }
.pp-gate__status { grid-column: 1 / -1; text-align: center; font-family: var(--pp-display); font-size: 20px; letter-spacing: 1px; color: #ffcf33; margin: 0; }
.pp-villains { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }
.pp-villains > li { flex: 1 1 200px; max-width: 290px; }
.pp-villain { background: #2d1a4a; border-radius: 12px; padding: 14px 16px; border-left: 6px solid #a46bff; box-shadow: 4px 6px 0 rgba(0, 0, 0, .3); }
.pp-villain b { display: block; font-family: var(--pp-display); font-weight: 400; letter-spacing: .5px; font-size: 20px; color: #f3d6ff; }
.pp-villain span { font-size: 15.5px; color: #ddd0ef; }

/* ===================== REMAKE ===================== */
.pp-versus { display: grid; grid-template-columns: minmax(0, .9fr) auto minmax(0, 1.1fr); gap: 20px; align-items: center; }
.pp-ticket {
  position: relative; background: var(--pp-card); padding: 26px 26px 22px; border-radius: 6px; box-shadow: 8px 10px 0 rgba(60, 30, 10, .22);
  border: 3px dashed #d2c3a2;
}
.pp-ticket--old { rotate: -1.5deg; background: #efe6d2; }
.pp-ticket--new { rotate: 1deg; }
.pp-ticket__year { position: absolute; top: -22px; right: 18px; margin: 0; font-family: var(--pp-display); font-size: 30px; color: #fff; background: var(--pp-red); padding: 4px 14px 0; border-radius: 8px; rotate: 4deg; border: 3px solid #fff; box-shadow: 2px 3px 0 rgba(0, 0, 0, .2); }
.pp-ticket--old .pp-ticket__year { background: #6a5a8a; }
.pp-ticket h3 { font-family: var(--pp-display); font-weight: 400; font-size: 28px; margin: 0 0 8px; letter-spacing: .5px; }
.pp-versus__vs { font-family: var(--pp-display); font-size: 44px; color: var(--pp-gold); text-shadow: 3px 0 var(--pp-ink), -3px 0 var(--pp-ink), 0 3px var(--pp-ink), 0 -3px var(--pp-ink), 4px 5px 0 rgba(0, 0, 0, .3); rotate: -8deg; }

/* ===================== CURIOSIDADES ===================== */
.pp-notes { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(250px, 100%), 1fr)); gap: 30px 24px; }
.pp-note-card {
  position: relative; padding: 30px 20px 20px; font-size: 16px; line-height: 1.45; background: #fff3a8;
  box-shadow: 2px 3px 0 rgba(0, 0, 0, .06), 8px 12px 14px -6px rgba(60, 30, 10, .35);
}
.pp-note-card::before { content: ""; position: absolute; top: -13px; left: 50%; width: 90px; height: 26px; translate: -50% 0; rotate: -4deg; background: rgba(240, 225, 170, .75); clip-path: polygon(0 10%, 8% 0, 92% 0, 100% 10%, 100% 90%, 92% 100%, 8% 100%, 0 90%); }
.pp-note-card b { display: block; font-family: var(--pp-hand); font-weight: 400; font-size: 23px; line-height: 1.1; margin-bottom: 6px; color: var(--pp-red); }
.pp-note-card:nth-child(4n+1) { rotate: -2deg; }
.pp-note-card:nth-child(4n+2) { rotate: 1.5deg; }
.pp-note-card:nth-child(4n+3) { rotate: -1deg; }
.pp-note-card:nth-child(4n) { rotate: 2deg; }
.pp-note-card--pink { background: #ffc9da; }
.pp-note-card--blue { background: #c6e7ff; }
.pp-note-card--green { background: #cdf2c0; }
.pp-note-card__coin.mbr-coin { position: absolute; top: -18px; right: 14px; width: 28px; height: 34px; z-index: 2; }

/* ===================== ONDE JOGAR ===================== */
.pp-stamps { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(380px, 100%), 1fr)); gap: 28px; }
.pp-stampcard {
  position: relative; display: grid; grid-template-columns: 120px 1fr; gap: 18px; align-items: center; padding: 22px;
  background: radial-gradient(circle at 50% 50%, var(--pp-kraft) 0 6px, transparent 6.5px) -10px -10px / 20px 20px, var(--pp-card);
  box-shadow: 8px 10px 0 rgba(60, 30, 10, .2); rotate: -1deg;
}
.pp-stampcard::before { content: ""; position: absolute; inset: 12px; background: var(--pp-card); z-index: 0; border: 2px solid #e2d6bd; }
.pp-stampcard > * { position: relative; z-index: 1; }
.pp-stampcard:nth-child(2) { rotate: 1.2deg; }
.pp-stampcard__img img { border-radius: 6px; box-shadow: 4px 6px 0 rgba(0, 0, 0, .2); }
.pp-stampcard__kicker { margin: 0; font-family: var(--pp-hand); color: #8a5a2b; font-size: 18px; }
.pp-stampcard h3 { margin: 0 0 6px; font-family: var(--pp-display); font-weight: 400; font-size: 23px; letter-spacing: .5px; color: var(--pp-red); line-height: 1.1; }
.pp-stampcard p { margin: 0; }
.pp-stampcard__disc { width: 110px; height: 110px; border-radius: 50%; margin: 0 auto; background: conic-gradient(from 20deg, #6a5a8a, #b9a7e6, #6a5a8a, #d9cdf5, #6a5a8a); box-shadow: 0 0 0 4px #4a3d66, 4px 6px 0 4px rgba(0, 0, 0, .2); display: grid; place-items: center; }
.pp-stampcard__disc span { width: 30px; height: 30px; border-radius: 50%; background: var(--pp-card); box-shadow: 0 0 0 6px #8c7bb8; }

/* ===================== MODO PAPEL ===================== */
.pp [data-paper] { transition: transform .55s cubic-bezier(.3, 1.3, .5, 1), opacity .7s ease, box-shadow .4s; }
.pp.is-papermode [data-paper] {
  transform: perspective(900px) rotateY(-24deg) rotateX(5deg);
  box-shadow: -7px 0 0 #e9dcc0, -8px 2px 0 #cbb990, 14px 18px 18px -6px rgba(60, 30, 10, .35);
}
.pp.is-papermode [data-paper]:hover, .pp.is-papermode [data-paper]:focus-within { transform: perspective(900px) rotateY(0) rotateX(0); }
.pp.is-papermode .pp-partner[data-paper], .pp.is-papermode .pp-note-card[data-paper] { transform: perspective(700px) rotateX(28deg) rotateZ(-2deg); transform-origin: 50% 100%; }
.pp.is-papermode .pp-partner[data-paper]:hover, .pp.is-papermode .pp-note-card[data-paper]:hover,
.pp.is-papermode .pp-partner[data-paper]:focus-within, .pp.is-papermode .pp-note-card[data-paper]:focus-within { transform: none; }
.pp.is-papermode [data-paper="thin"] { box-shadow: none; transform: perspective(700px) rotateY(78deg); }
.pp.is-papermode [data-paper="thin"]:hover { transform: perspective(700px) rotateY(0); }
.pp [data-paper].is-flip { animation: pp-flipwave .75s ease both; }
@keyframes pp-flipwave { 0% { transform: perspective(900px) rotateY(0); } 50% { transform: perspective(900px) rotateY(-90deg) scaleX(.6); } 100% { transform: perspective(900px) rotateY(-24deg) rotateX(5deg); } }
.pp-flyplane { position: fixed; z-index: 480; left: -140px; top: 40%; width: 120px; pointer-events: none; filter: drop-shadow(6px 10px 0 rgba(0, 0, 0, .2)); animation: pp-flyacross 3.2s cubic-bezier(.4, 0, .6, 1) forwards; }
@keyframes pp-flyacross {
  0% { transform: translate(0, 0) rotate(8deg); }
  40% { transform: translate(45vw, -18vh) rotate(-8deg); }
  70% { transform: translate(75vw, 6vh) rotate(10deg); }
  100% { transform: translate(calc(100vw + 280px), -26vh) rotate(-14deg); }
}

/* ===================== Gamenav combinando ===================== */
body[data-game="paper"] .mbr-gamenav { background: #2a1b12; }
body[data-game="paper"] .mbr-gamenav__link { background: #3a2718; border-color: #5a3d24; }

/* ===================== RESPONSIVO ===================== */
@media (max-width: 1024px) {
  .pp-hero__in { padding: 0 clamp(44px, 8vw, 90px); }
  .pp-gate { grid-template-columns: 1fr; }
}
@media (max-width: 860px) {
  .pp-hero { padding: 76px 0 110px; }
  .pp-hero__in { grid-template-columns: 1fr; padding: 0 44px; gap: 6px; }
  .pp-hero__mario { order: -1; }
  .pp-hero__mario img { width: 200px; }
  .pp-about__grid, .pp-curses__grid { grid-template-columns: 1fr; }
  .pp-tattle { grid-template-columns: 120px 1fr; align-items: center; gap: 14px; }
  .pp-tattle__pic { width: 120px; }
  .pp-bubble { margin-top: 0; }
  .pp-bubble::before { top: 40%; left: -18px; border: 14px solid transparent; border-right-color: var(--pp-ink); border-left: 0; }
  .pp-bubble::after { top: calc(40% + 3px); left: -12px; border: 11px solid transparent; border-right-color: var(--pp-card); border-left: 0; }
  .pp-page { grid-template-columns: 1fr; }
  .pp-page::before { display: none; }
  .pp-page__l { padding-bottom: 6px; }
  .pp-versus { grid-template-columns: 1fr; }
  .pp-versus__vs { justify-self: center; }
}
@media (max-width: 560px) {
  .pp { font-size: 16px; }
  .pp-sec { padding: 60px 0; }
  .pp-hero__in { padding: 0 40px; }
  .pp-hero__card .pp-tape { width: 76px; }
  .pp-book__nav .pp-btn { font-size: 15px; padding: 8px 10px 5px; white-space: nowrap; }
  .pp-album { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
  .pp-partner { padding: 12px 10px 12px; border-radius: 16px; }
  .pp-partner__pic { width: 92px; height: 92px; }
  .pp-partner h3 { font-size: 19px; }
  .pp-partner__role { font-size: 16px; line-height: 1.15; }
  .pp-partner p:last-child, .pp-partner > p:not([class]) { font-size: 13.5px; }
  .pp-partner--mowz { grid-column: 1 / -1; }
  .pp-theater__curtain { width: 16px; }
  .pp-hud__box { font-size: 15px; padding: 3px 8px 1px; gap: 5px; }
  .pp-hud__box b { font-size: 15px; }
  .pp-hero__card { padding: 22px 14px 22px; }
  .pp-btn { font-size: 18px; padding: 9px 16px 5px; }
  .pp-hero__tassel.mbr-coin { left: 4px; top: 22%; }
  .pp-tattle { grid-template-columns: 1fr; }
  .pp-bubble::before, .pp-bubble::after { display: none; }
  .pp-book { padding: 50px 10px 12px; }
  .pp-book__tabs { left: 6px; right: 6px; gap: 3px; }
  .pp-book__tabs button { font-size: 13px; padding: 18px 2px 16px; }
  .pp-book__tabs button:first-child { flex-grow: 2.2; }
  .pp-page__facts { grid-template-columns: 1fr; }
  .pp-theater { padding: 60px 20px 0; min-height: 0; }
  .pp-theater__stage { height: 250px; }
  .pp-ac__mario { width: 100px; left: 6%; }
  .pp-ac__foe { width: 70px; right: 8%; }
  .pp-ac__ctrl { margin: 0 -20px; padding: 18px 16px 22px; gap: 14px; text-align: center; }
  .pp-ac__a { width: 88px; height: 88px; }
  .pp-hud__sp { width: 70px; }
  .pp-stampcard { grid-template-columns: 84px 1fr; padding: 20px; }
  .pp-stampcard__disc { width: 80px; height: 80px; }
  .pp-modebtn { right: 10px; bottom: 10px; padding: 6px 12px 6px 8px; }
  .pp-modebtn svg { width: 30px; height: 30px; }
  .pp-chest__stage { height: 260px; }
  .pp-gate__door { width: min(260px, 70vw); }
  .pp-gate__sockets i { width: 26px; height: 26px; margin: -13px; transform: rotate(calc(-90deg + (var(--k) - 3) * 30deg)) translateX(calc(min(260px, 70vw) * .62)) rotate(calc(90deg - (var(--k) - 3) * 30deg)); }
  .pp-stamp { top: -36px; font-size: 13px; }
}

@media (prefers-reduced-motion: reduce) {
  .pp-hero__mario img, .pp-hero__clouds i { animation: none; }
  .pp-flyplane { display: none; }
  .pp [data-paper].is-flip { animation: none; }
}
