/* The real 3D prop stays assembled around its rear hinge. */
.ball-stage{width:min(560px,150vw);height:auto;aspect-ratio:1;transform:translate(-50%,-45%);perspective:none;pointer-events:none}
.pokeball-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;opacity:0;pointer-events:none;transition:opacity .16s;mask-image:linear-gradient(transparent,#000 12%,#000 82%,transparent),linear-gradient(90deg,transparent,#000 10%,#000 90%,transparent);mask-composite:intersect}
.has-3d .pokeball-canvas{opacity:1}
.ball-stage .pokeball{inset:28% 24% 20%;width:52%;height:52%;animation:none;filter:none;transform:none;pointer-events:auto}
#open-pokeball:focus-visible{outline:none}
.poke-intro:has(#open-pokeball:focus-visible) .ball-hint{color:#fff9e8;text-decoration:underline;text-underline-offset:6px}
.poke-intro:focus{outline:none}
.ball-stage .ball-shadow{display:none}
.ball-hint{top:min(calc(50% + 295px),calc(100% - 52px))}
.ball-hint:before{display:none}
.poke-intro[data-stage=opening] .ball-stage{animation:hinged-ball-depart .45s ease-in 1.15s both}
.poke-intro[data-stage=opening] .ball-shadow{opacity:1}
.poke-intro[data-stage=opening] .trainer-invitation{--invitation-launch-y:clamp(32px,5.5vh,46px);animation:invitation-card-emerge 1s linear .95s both;transform-origin:50% 50%;backface-visibility:visible;will-change:transform,opacity;pointer-events:none}
/* A foil back covers the print only while the single turn faces away. */
.poke-intro[data-stage=opening] .trainer-invitation:after{content:'✦';position:absolute;inset:0;z-index:8;display:grid;place-items:center;border-radius:6px;color:#956727;font-size:62px;text-shadow:0 1px 0 #fff5c4;pointer-events:none;background:repeating-linear-gradient(135deg,transparent 0 20px,#fff7d322 21px 23px,transparent 24px 44px),linear-gradient(135deg,#eac15a,#fff0aa 48%,#d4a13c);box-shadow:inset 0 0 0 3px #b88b35,inset 0 0 0 9px #ffe395,inset 0 0 0 11px #b88b3566;animation:invitation-card-back 1s linear .95s both}
.poke-intro[data-stage=opening] .pokeball{pointer-events:none}
.intro-vignette{background:linear-gradient(180deg,#10243cfa,#14344cd9 57%,#122d42e8),url('assets/trainer-landscape.svg') center/cover}
.intro-vignette:after{box-shadow:inset 0 0 160px #06142465}
.poke-intro[open]{animation-duration:.3s}
@keyframes hinged-ball-depart{0%{opacity:1;filter:blur(0)}100%{opacity:0;filter:blur(7px)}}
@keyframes invitation-card-emerge{
  0%{opacity:0;transform:perspective(1000px) translate3d(0,var(--invitation-launch-y),-160px) rotateY(-360deg) rotateZ(-12deg) scale(.12);filter:blur(3px)}
  12%{opacity:1;transform:perspective(1000px) translate3d(0,26px,-120px) rotateY(-315deg) rotateZ(-10deg) scale(.22);filter:blur(2px)}
  32%{opacity:1;transform:perspective(1000px) translate3d(0,8px,-75px) rotateY(-235deg) rotateZ(6deg) scale(.38);filter:blur(.6px)}
  52%{opacity:1;transform:perspective(1000px) translate3d(0,-8px,-35px) rotateY(-135deg) rotateZ(8deg) scale(.57);filter:blur(.4px)}
  70%{opacity:1;transform:perspective(1000px) translate3d(0,-10px,0) rotateY(-38deg) rotateZ(-4deg) scale(.85);filter:blur(0)}
  86%{opacity:1;transform:perspective(1000px) translate3d(0,-3px,0) rotateY(5deg) rotateZ(.8deg) scale(1.015);filter:blur(0);animation-timing-function:cubic-bezier(.2,.8,.2,1)}
  100%{opacity:1;transform:perspective(1000px) translate3d(0,0,0) rotateY(0) rotateZ(0) scale(1);filter:blur(0)}
}
@keyframes invitation-card-back{0%,23.1%{opacity:0}23.3%,60.2%{opacity:1}60.4%,100%{opacity:0}}
@media(max-width:700px){.ball-stage{width:min(520px,145vw)}.ball-hint{top:min(calc(50% + 282px),calc(100% - 52px))}.intro-prelude{top:calc(50% - 245px)}}
@media(max-height:680px){.ball-stage{width:min(440px,135vw);transform:translate(-50%,-42%)}.ball-hint{top:min(calc(50% + 250px),calc(100% - 40px))}.intro-prelude{top:65px}}
@media(prefers-reduced-motion:reduce){.poke-intro[data-stage=opening] .ball-stage,.poke-intro[data-stage=opening] .trainer-invitation{animation:none!important}.poke-intro[data-stage=opening] .trainer-invitation:after{display:none!important;animation:none!important}.ball-stage{display:none}}
