.collection-card,.collection-generated-card,.battle-card{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.collection-card img,.collection-generated-card img,.battle-card img{-webkit-user-drag:none;user-drag:none;pointer-events:none}
.collection-generated-card{border:0!important}
.collection-card--visual-only{display:block;aspect-ratio:5/7;padding:0!important;border:0!important;border-radius:8px!important;background:transparent!important;box-shadow:none!important;overflow:visible!important}
.collection-card--visual-only>.collection-generated-card,.collection-card--visual-only>img{display:block;width:100%;height:100%;border-radius:8px;background:transparent!important;box-shadow:none!important;filter:drop-shadow(0 7px 8px rgba(0,0,0,.3))}
.collection-card--visual-only.is-locked{border:0!important;box-shadow:none!important}
.collection-card,.battle-card{--card-tilt-x:0deg;--card-tilt-y:0deg;--card-lift:0px;transform:perspective(900px) rotateX(var(--card-tilt-x)) rotateY(var(--card-tilt-y)) translateY(var(--card-lift));transform-style:preserve-3d;transition:transform .16s ease,filter .16s ease}
.collection-card.is-card-tilting,.battle-card.is-card-tilting{--card-lift:-5px;filter:drop-shadow(0 12px 11px rgba(0,0,0,.2));transition:transform .06s linear,filter .12s ease}
.collection-reveal-card__tilt{--card-tilt-x:0deg;--card-tilt-y:0deg;width:100%;height:100%;transform:perspective(900px) rotateX(var(--card-tilt-x)) rotateY(var(--card-tilt-y));transform-style:preserve-3d;transition:transform .08s linear}
.collection-reveal-stage{display:grid;justify-items:center;gap:15px;min-height:520px;padding:8px 0 4px;transition:min-height .45s ease}
.collection-booster-opening{display:grid;grid-area:1/1;place-items:center;align-content:center;gap:16px;min-height:490px;opacity:0;pointer-events:none;transition:opacity .3s ease,transform .45s ease;transform:scale(.94)}
.collection-reveal-stage.is-pack-ready .collection-booster-opening{opacity:1;pointer-events:auto;transform:scale(1)}
.collection-booster{position:relative;width:min(245px,64vw);aspect-ratio:5/7;padding:0;border:0;background:transparent;cursor:grab;filter:drop-shadow(0 22px 18px rgba(0,0,0,.48));touch-action:none;animation:booster-idle 2.5s ease-in-out infinite;transform-style:preserve-3d}
.collection-booster:active{cursor:grabbing}
.collection-booster__face{position:absolute;inset:0;display:grid;place-items:center;align-content:center;gap:8px;overflow:hidden;border:2px solid #f8df69;border-radius:9px;background:linear-gradient(145deg,#0e0e0e 0,#2b2110 28%,#111 55%,#5e4312 80%,#111 100%);color:#ffd944;text-transform:uppercase;letter-spacing:.12em;backface-visibility:hidden}
.collection-booster__face::before{content:"";position:absolute;inset:7px;border:1px solid rgba(255,218,68,.58);border-radius:5px;background:repeating-linear-gradient(105deg,transparent 0 20px,rgba(255,255,255,.07) 21px 23px,transparent 24px 42px);pointer-events:none}
.collection-booster__face img{width:100%;height:100%;object-fit:contain;pointer-events:none}
.collection-booster__face strong{font-size:1.35rem}.collection-booster__face small{font-size:.62rem;color:#fff}
.collection-booster__face--top{clip-path:polygon(0 0,100% 0,100% 23%,0 20%);z-index:3}.collection-booster__face--bottom{clip-path:polygon(0 20%,100% 23%,100% 100%,0 100%);z-index:2}
.collection-booster__tear{position:absolute;z-index:5;left:-5%;top:20%;width:110%;height:5px;background:linear-gradient(90deg,transparent,#fff 15%,#ffd944 50%,#fff 85%,transparent);box-shadow:0 0 14px #ffe45e;opacity:0;transform:rotate(1deg)}
.collection-booster.is-opening{animation:booster-rip .7s cubic-bezier(.2,.8,.2,1) forwards;pointer-events:none}.collection-booster.is-opening .collection-booster__face--top{animation:booster-top-rip .68s cubic-bezier(.2,.8,.2,1) forwards}.collection-booster.is-opening .collection-booster__face--bottom{animation:booster-bottom-rip .68s ease forwards}.collection-booster.is-opening .collection-booster__tear{animation:booster-tear-flash .35s ease forwards}
.collection-booster__instruction{font-size:.72rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#ffdf45;animation:booster-prompt 1.2s ease-in-out infinite}
.collection-reveal-stack{position:relative;width:min(240px,58vw);aspect-ratio:5/7;margin:18px 0 22px;cursor:pointer;perspective:1200px;outline:none;transition:opacity .3s ease,transform .45s ease,height .45s ease,margin .45s ease}
.collection-reveal-stage.is-pack-ready .collection-reveal-stack,.collection-reveal-stage.is-pack-ready .collection-reveal-next,.collection-reveal-stage.is-pack-ready .collection-reveal-grid{grid-area:1/1;opacity:0;pointer-events:none;visibility:hidden}
.collection-reveal-stage.is-revealing .collection-booster-opening{display:none}
.collection-reveal-stack:focus-visible{outline:3px solid var(--color-primary);outline-offset:12px;border-radius:12px}
.collection-reveal-stack .collection-card{position:absolute;inset:0;width:100%;height:100%;padding:8px;transform:translate3d(calc(var(--stack-index) * 3px),calc(var(--stack-index) * -3px),calc(var(--stack-index) * -5px)) rotateZ(calc((var(--stack-index) - 2) * .45deg));box-shadow:3px 3px 0 #111,calc(5px + var(--stack-index) * 2px) calc(7px + var(--stack-index) * 2px) 0 rgba(255,255,255,.16),calc(8px + var(--stack-index) * 2px) calc(10px + var(--stack-index) * 2px) 10px rgba(0,0,0,.42);transform-origin:50% 110%;transition:transform .28s cubic-bezier(.2,.8,.2,1),opacity .25s ease}
.collection-reveal-stack .collection-card>.collection-card__rarity,.collection-reveal-stack .collection-card>strong,.collection-reveal-stack .collection-card>small{display:none}
.collection-reveal-card{isolation:isolate;padding:0!important;border:0!important;border-radius:9px!important;background:transparent!important;box-shadow:none!important;overflow:visible!important;gap:0!important}
.collection-reveal-card__flipper{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .52s cubic-bezier(.2,.75,.25,1)}
.collection-reveal-card.is-face-down .collection-reveal-card__flipper{transform:rotateY(0)}.collection-reveal-card.is-face-up .collection-reveal-card__flipper,.collection-reveal-card.is-revealed .collection-reveal-card__flipper{transform:rotateY(180deg)}
.collection-reveal-card__back,.collection-reveal-card__front{position:absolute;inset:0;overflow:hidden;border-radius:8px;backface-visibility:hidden;-webkit-backface-visibility:hidden}
.collection-reveal-card__back{display:grid;place-items:center;align-content:center;gap:5px;border:3px solid #e7c43d;background:radial-gradient(circle at center,#4b3511 0,#151515 46%,#050505 100%);color:#ffdc43;font-size:2rem;font-weight:1000;letter-spacing:.08em;box-shadow:inset 0 0 0 7px #111,inset 0 0 0 9px #d9ad27,0 8px 18px rgba(0,0,0,.45)}
.collection-reveal-card__back::before{content:"";position:absolute;inset:13%;border:2px solid #d9ad27;transform:rotate(45deg);box-shadow:0 0 25px rgba(255,211,61,.32)}.collection-reveal-card__back span,.collection-reveal-card__back small{position:relative;z-index:1}.collection-reveal-card__back small{font-size:.55rem;color:#fff;text-transform:uppercase}
.collection-reveal-card__front{transform:rotateY(180deg)}
.collection-reveal-card__front>.collection-generated-card,.collection-reveal-card__front>img{display:block;width:100%;border-radius:8px;background:transparent!important;box-shadow:0 8px 18px rgba(0,0,0,.38)}
.collection-reveal-card{--reveal-color:#ffcf3d}.collection-reveal-card.family-fire{--reveal-color:#ff5a1f}.collection-reveal-card.family-water{--reveal-color:#3ca7ff}.collection-reveal-card.family-nature{--reveal-color:#68d64f}.collection-reveal-card.family-shadow{--reveal-color:#a36bff}.collection-reveal-card.family-light{--reveal-color:#ffe25a}.collection-reveal-card.family-stone{--reveal-color:#c69762}
.collection-card-burst{position:absolute;z-index:20;inset:50% auto auto 50%;width:1px;height:1px;pointer-events:none}.collection-card-burst i{position:absolute;width:7px;height:7px;border-radius:50%;background:var(--reveal-color);box-shadow:0 0 6px var(--reveal-color);opacity:0;transform:rotate(var(--particle-angle)) translateX(12px) scale(.2);animation:card-particle-burst .9s cubic-bezier(.1,.75,.25,1) var(--particle-delay) forwards}.collection-card-burst i:nth-child(3n){width:4px;height:4px}.collection-card-burst i:nth-child(4n){background:#fff}
.collection-reveal-stack .collection-card:not(:first-child){pointer-events:none}
.collection-reveal-stack .collection-card.is-dealing{transform:translate3d(-135%,25%,80px) rotateZ(-13deg) rotateY(-18deg);opacity:0}
.collection-reveal-next{border:2px solid #fff;border-radius:99px;background:var(--color-primary);color:#111;padding:9px 16px;font:inherit;font-size:.75rem;font-weight:900;text-transform:uppercase;cursor:pointer}
.collection-reveal-grid{display:flex;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:12px;width:min(100%,calc(var(--reveal-columns) * 205px + (var(--reveal-columns) - 1) * 12px));transition:transform .45s ease}
.collection-reveal-grid .collection-card{flex:0 0 min(193px,calc((100% - (var(--reveal-columns) - 1) * 12px) / var(--reveal-columns)));opacity:0;animation:reveal-card-arrive .36s ease forwards}
.collection-reveal-grid .collection-reveal-card{aspect-ratio:5/7}
.collection-reveal-stage.is-complete{min-height:0}.collection-reveal-stage.is-complete .collection-reveal-stack{height:0;aspect-ratio:auto;margin:0;opacity:0;transform:translateY(-35px) scale(.85);pointer-events:none}.collection-reveal-stage.is-complete .collection-reveal-grid{transform:translateY(-8px)}.collection-reveal-stage.is-complete .collection-reveal-next{background:#fff;color:#fff;border-color:transparent;opacity:.55;pointer-events:none}
.collection-generated-card.preview-card:not(.is-effect-visible)>.shine,.collection-generated-card.preview-card:not(.is-effect-visible)>.glare{display:none!important;will-change:auto!important}
.collection-generated-card.preview-card .shine,.collection-generated-card.preview-card .glare{will-change:auto!important}
.collection-card-grid .collection-card{content-visibility:auto;contain-intrinsic-size:auto 200px 280px}
.collection-card-grid .collection-card.is-card-visible:not(.is-card-tilting),.collection-reveal-card__tilt.is-card-visible:not(.is-card-tilting){animation:ytcg-card-idle-1 var(--card-idle-duration,9.5s) ease-in-out var(--card-idle-delay,0s) infinite;will-change:transform}
.collection-card-grid .collection-card.is-card-visible[data-idle-motion="2"]:not(.is-card-tilting),.collection-reveal-card__tilt.is-card-visible[data-idle-motion="2"]:not(.is-card-tilting){animation-name:ytcg-card-idle-2}
.collection-card-grid .collection-card.is-card-visible[data-idle-motion="3"]:not(.is-card-tilting),.collection-reveal-card__tilt.is-card-visible[data-idle-motion="3"]:not(.is-card-tilting){animation-name:ytcg-card-idle-3}
.collection-card-grid .collection-card.is-card-visible[data-idle-motion="4"]:not(.is-card-tilting),.collection-reveal-card__tilt.is-card-visible[data-idle-motion="4"]:not(.is-card-tilting){animation-name:ytcg-card-idle-4}
.battle-card.is-card-visible:not(.is-card-tilting):not(.is-attacking):not(.is-hit):not(.is-defeated)>.collection-generated-card,.battle-card.is-card-visible:not(.is-card-tilting):not(.is-attacking):not(.is-hit):not(.is-defeated)>.battle-card__complete{animation:ytcg-card-idle-1 var(--card-idle-duration,9.5s) ease-in-out var(--card-idle-delay,0s) infinite;will-change:transform}
@keyframes reveal-card-arrive{from{opacity:0;transform:translateY(-34px) scale(.82) rotateX(12deg)}to{opacity:1;transform:translateY(0) scale(1) rotateX(0)}}
@keyframes ytcg-card-idle-1{0%,100%{transform:perspective(900px) translate3d(0,0,0) rotateX(1.75deg) rotateY(-3.5deg)}25%{transform:perspective(900px) translate3d(0,-5px,0) rotateX(-3.75deg) rotateY(1.25deg)}50%{transform:perspective(900px) translate3d(0,-7.5px,0) rotateX(-1deg) rotateY(4.25deg)}75%{transform:perspective(900px) translate3d(0,-2.5px,0) rotateX(3.5deg) rotateY(.75deg)}}
@keyframes ytcg-card-idle-2{0%,100%{transform:perspective(900px) translate3d(0,-2px,0) rotateX(-2.25deg) rotateY(3.25deg)}30%{transform:perspective(900px) translate3d(0,-7px,0) rotateX(3.25deg) rotateY(1deg)}62%{transform:perspective(900px) translate3d(0,-4px,0) rotateX(1deg) rotateY(-4.5deg)}82%{transform:perspective(900px) translate3d(0,0,0) rotateX(-3.5deg) rotateY(-.5deg)}}
@keyframes ytcg-card-idle-3{0%,100%{transform:perspective(900px) translate3d(0,0,0) rotateX(2.75deg) rotateY(1.75deg)}22%{transform:perspective(900px) translate3d(0,-4px,0) rotateX(-.75deg) rotateY(-4.25deg)}55%{transform:perspective(900px) translate3d(0,-7.5px,0) rotateX(-3.75deg) rotateY(.5deg)}78%{transform:perspective(900px) translate3d(0,-3px,0) rotateX(1.25deg) rotateY(4deg)}}
@keyframes ytcg-card-idle-4{0%,100%{transform:perspective(900px) translate3d(0,-1.5px,0) rotateX(-1.5deg) rotateY(-3.75deg)}28%{transform:perspective(900px) translate3d(0,-6.5px,0) rotateX(4deg) rotateY(-.5deg)}58%{transform:perspective(900px) translate3d(0,-4.5px,0) rotateX(.75deg) rotateY(4.5deg)}85%{transform:perspective(900px) translate3d(0,0,0) rotateX(-3.25deg) rotateY(1.25deg)}}
@keyframes booster-idle{0%,100%{transform:translateY(0) rotateZ(-1deg)}50%{transform:translateY(-10px) rotateZ(1deg)}}
@keyframes booster-rip{0%{transform:translateY(0) scale(1)}35%{transform:translateY(6px) scale(1.03)}100%{transform:translateY(28px) scale(.92);opacity:0}}
@keyframes booster-top-rip{0%{transform:translate(0,0) rotate(0)}45%{transform:translate(7px,-12px) rotate(5deg)}100%{transform:translate(70px,-125px) rotate(24deg);opacity:0}}
@keyframes booster-bottom-rip{to{transform:translateY(26px);opacity:.15}}
@keyframes booster-tear-flash{0%{opacity:0;transform:scaleX(.2) rotate(1deg)}45%{opacity:1;transform:scaleX(1) rotate(1deg)}100%{opacity:0;transform:scaleX(1.15) rotate(1deg)}}
@keyframes booster-prompt{50%{transform:translateY(-4px);opacity:.65}}
@keyframes card-particle-burst{0%{opacity:0;transform:rotate(var(--particle-angle)) translateX(8px) scale(.2)}18%{opacity:1}100%{opacity:0;transform:rotate(var(--particle-angle)) translateX(var(--particle-distance)) scale(1.15)}}
@media(max-width:700px){.collection-reveal-stage{min-height:430px}.collection-reveal-stack{width:min(205px,62vw)}.collection-reveal-grid{gap:8px;width:100%}.collection-reveal-grid .collection-card{flex-basis:calc((100% - 8px)/2);max-width:185px}}
@media(prefers-reduced-motion:reduce){.collection-card,.battle-card,.collection-reveal-card__tilt,.battle-card>.collection-generated-card,.battle-card>.battle-card__complete{animation:none!important;transform:none!important;transition:none}.collection-card.is-card-tilting,.battle-card.is-card-tilting{filter:none}}
