.draw-holo-cards{--card-width:min(17vw, 244px, 35svh);--card-height:calc(var(--card-width) * 1.4);--card-gap:clamp(4px, 1.1vw, 18px);--orbit-width:min(29vw, 410px);--orbit-height:min(13svh, 112px);perspective:1400px;pointer-events:none;margin:0;padding:0;list-style:none;position:absolute;inset:0}.draw-holo-card{--landing-x:calc(var(--card-column) * (var(--card-width) + var(--card-gap)));--landing-y:var(--card-dip);--landing-z:0px;--landing-angle:var(--card-angle);--frame-light:#8a8cbb;--frame-dark:#24264c;--window-light:#805cff;--window-dark:#281861;--card-ink:#fff;--art-pattern:repeating-linear-gradient(143deg, transparent 0 15px, #b59bff20 16px 17px, transparent 18px 30px);width:var(--card-width);height:var(--card-height);margin:calc(var(--card-height) / -2) 0 0 calc(var(--card-width) / -2);transform:translate3d(var(--landing-x), var(--landing-y), var(--landing-z)) rotateZ(var(--landing-angle));transform-style:preserve-3d;position:absolute;top:47%;left:50%}.draw-holo-card:nth-child(2){--frame-light:#597da8;--frame-dark:#101b4a;--window-light:#3862dc;--window-dark:#0b164f;--art-pattern:linear-gradient(26deg, #3432942d, transparent 75%)}.draw-holo-card:nth-child(3){--frame-light:#fff3e7;--frame-dark:#ffbe9e;--window-light:#ffcbad;--window-dark:#d98e71;--card-ink:#301c18;--art-pattern:repeating-radial-gradient(ellipse at 50% 65%, transparent 0 10px, #ffdcc533 12px 18px)}.draw-holo-card:nth-child(4){--frame-light:#fff2ad;--frame-dark:#dca33a;--window-light:#ffe375;--window-dark:#df5e92;--card-ink:#332410;--art-pattern:repeating-conic-gradient(from -5deg at 50% 58%, #f9a5444d 0deg 11deg, #ef4d962a 11deg 22deg)}.draw-holo-card:nth-child(5){--frame-light:#f2ffd3;--frame-dark:#a3cc81;--window-light:#5bae91;--window-dark:#205747;--card-ink:#183023;--art-pattern:repeating-linear-gradient(31deg, transparent 0 13px, #caffc52e 14px, transparent 15px), repeating-linear-gradient(146deg, transparent 0 13px, #caffc52e 14px, transparent 15px)}.draw-holo-cards[data-phase=opening] .draw-holo-card{animation:draw-holo-card-reveal 1.3s var(--card-start) both}.draw-holo-cards[data-phase=open] .draw-holo-card-hit{pointer-events:auto}.draw-holo-card:focus-within{z-index:3}.draw-holo-card:has([data-foil-active]){z-index:3}.draw-holo-card-hit{--foil-x:48%;--foil-y:32%;--foil-tilt-x:0deg;--foil-tilt-y:0deg;--foil-parallax-x:0px;--foil-parallax-y:0px;border-radius:calc(var(--card-width) * .055);width:100%;height:100%;transform-style:preserve-3d;touch-action:manipulation;outline:none}.draw-holo-card-hit:focus-visible{outline-offset:4px;outline:2px solid #4e72b8}.draw-holo-card-tilt{border-radius:inherit;pointer-events:none;width:100%;height:100%;transform-style:preserve-3d;transition:transform .22s cubic-bezier(.19,.85,.36,1);position:relative}.draw-holo-card-hit:is([data-foil-active],:focus-visible) .draw-holo-card-tilt{transform:translate3d(0, -9px, 62px) rotateX(var(--foil-tilt-x)) rotateY(var(--foil-tilt-y))}.draw-holo-card-tilt:before{border-radius:inherit;background:color-mix(in srgb, var(--frame-dark) 66%, #31283e);content:"";position:absolute;inset:0;transform:translate3d(0,2px,-3px);box-shadow:0 22px 37px -13px #1f173771,0 4px 12px #211e3432}.draw-holo-card-face{isolation:isolate;border-radius:inherit;color:var(--card-ink);background:linear-gradient(135deg, #fff7, transparent 32%), linear-gradient(157deg, color-mix(in srgb, var(--frame-light) 83%, var(--pack-paper)), color-mix(in srgb, var(--frame-dark) 86%, var(--pack-accent)));position:absolute;inset:0;overflow:hidden;box-shadow:inset 0 0 0 1px #fff7,inset 0 -2px 3px #29243d2b}.draw-holo-card-window{border-radius:calc(var(--card-width) * .034);background:var(--art-pattern), radial-gradient(ellipse at var(--foil-x) var(--foil-y), color-mix(in srgb, var(--window-light) 86%, var(--pack-accent)), var(--window-dark) 100%);height:61%;position:absolute;inset:4.5% 6% auto;overflow:hidden;box-shadow:inset 0 0 0 1px #35284228,inset 0 2px 5px #28203930}.draw-holo-card-window:after{mix-blend-mode:screen;opacity:.57;content:"";background-image:radial-gradient(circle at 18% 30%,#fff .6px,#0000 1.4px),radial-gradient(circle at 66% 46%,#fff9 .5px,#0000 1.2px),radial-gradient(circle at 71% 64%,#fff .8px,#0000 1.6px);background-position:0 0,7px 5px,-2px 6px;background-size:13px 17px,17px 19px,23px 21px;position:absolute;inset:0}.draw-holo-card-foil,.draw-holo-card-glaze{border-radius:inherit;pointer-events:none;transition:opacity .24s;position:absolute;inset:0}.draw-holo-card-foil{background:repeating-linear-gradient(112deg, #d18bf4 0%, #f9abc9 5%, #ffdc8a 10%, #aef0a6 15%, #90d6fc 20%, #d18bf4 25%) var(--foil-x) var(--foil-y) / 315% 290%;mix-blend-mode:color-dodge;opacity:.23}.draw-holo-card-glaze{background:radial-gradient(ellipse at var(--foil-x) var(--foil-y), #fff6, transparent 56%), linear-gradient(111deg, transparent 30%, #fff9 30.6%, #fff2 39%, transparent 40% 47%, #fff5 47.6%, transparent 52%) var(--foil-x) 0 / 200% 100%, linear-gradient(#fff5, transparent 14%);mix-blend-mode:screen;opacity:.42;transform:translateZ(18px);box-shadow:inset 0 1px 2px #fff9}.draw-holo-card-hit:is([data-foil-active],:focus-visible) .draw-holo-card-foil{opacity:.58}.draw-holo-card-hit:is([data-foil-active],:focus-visible) .draw-holo-card-glaze{opacity:.87}.draw-holo-card-art{height:55%;transform:translate3d(var(--foil-parallax-x), var(--foil-parallax-y), 14px);position:absolute;inset:7% 11% auto}.draw-holo-card-art img{object-fit:contain;filter:drop-shadow(1px 7px 6px #21182654);width:100%;height:100%}.draw-holo-card-copy{flex-direction:column;justify-content:space-between;gap:5px;min-width:0;display:flex;position:absolute;inset:69% 7% 7%}.draw-holo-card-copy strong{overflow-wrap:anywhere;font-size:clamp(8px, calc(var(--card-width) * .082), 22px);letter-spacing:-.025em;font-weight:800;line-height:1.03}.draw-holo-card-copy span{padding-top:calc(var(--card-width) * .038);border-top:1px solid color-mix(in srgb, currentColor 25%, transparent);font-size:clamp(6px, calc(var(--card-width) * .048), 12px);letter-spacing:.025em;text-overflow:ellipsis;white-space:nowrap;font-weight:650;line-height:1.05;overflow:hidden}@keyframes draw-holo-card-reveal{0%{opacity:0;transform:translate3d(0,45px,-155px)rotateX(-24deg)scale(.36)}9%{opacity:1}18%{transform:translate3d(calc(var(--orbit-x-0) * 26px), calc(var(--card-height) * -.58), 25px) rotateX(16deg) rotateZ(calc(var(--card-column) * 8deg)) scale(.63)}34%{transform:translate3d(calc(var(--orbit-x-0) * var(--orbit-width) * .76), calc(var(--orbit-y-0) * var(--orbit-height) - 45px), var(--orbit-z-0)) rotateY(calc(var(--orbit-x-0) * 40deg)) rotateZ(calc(var(--orbit-x-0) * 11deg)) scale(.83)}49%{transform:translate3d(calc(var(--orbit-x-1) * var(--orbit-width)), calc(var(--orbit-y-1) * var(--orbit-height)), var(--orbit-z-1)) rotateY(calc(var(--orbit-x-1) * 40deg)) rotateZ(calc(var(--orbit-x-1) * 12deg)) scale(.93)}64%{transform:translate3d(calc(var(--orbit-x-2) * var(--orbit-width) * .84), calc(var(--orbit-y-2) * var(--orbit-height)), var(--orbit-z-2)) rotateY(calc(var(--orbit-x-2) * 34deg)) rotateZ(calc(var(--orbit-x-2) * 9deg)) scale(.97)}77%{transform:translate3d(calc(var(--orbit-x-3) * var(--orbit-width) * .36 + var(--landing-x) * .6), calc(var(--orbit-y-3) * var(--orbit-height) * .36 + var(--landing-y) * .6), 22px) rotateY(calc(var(--orbit-x-3) * 18deg)) rotateZ(var(--landing-angle))}92%{transform:translate3d(var(--landing-x), calc(var(--landing-y) - 6px), var(--landing-z)) rotateZ(var(--landing-angle))}to{opacity:1;transform:translate3d(var(--landing-x), var(--landing-y), var(--landing-z)) rotateZ(var(--landing-angle))}}@media (width<=740px) and (aspect-ratio<=9/10){.draw-holo-cards{--card-width:min(calc((100vw - 36px) / 2), calc((100svh - 154px) / 3.75), 224px);--orbit-width:min(30vw, 120px);--orbit-height:min(12svh, 85px)}.draw-holo-card{--landing-x:calc(var(--phone-column) * (var(--card-width) / 2 + 5px));--landing-y:calc(var(--phone-row) * var(--card-height) * .84);--landing-angle:var(--phone-angle);top:47.5%}.draw-holo-card:nth-child(3){--landing-z:28px;z-index:1}.draw-holo-card:nth-child(3):focus-within{z-index:3}.draw-holo-card:nth-child(3):has([data-foil-active]){z-index:3}.draw-holo-card-hit:is([data-foil-active],:focus-visible) .draw-holo-card-tilt{transform:translate3d(0, -3px, 36px) rotateX(var(--foil-tilt-x)) rotateY(var(--foil-tilt-y))}}@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.draw-holo-cards[data-phase=open] .draw-holo-card-hit:not([data-foil-active],:focus-visible) .draw-holo-card-tilt{animation:draw-holo-card-drift 5s var(--card-start) ease-in-out infinite}}@keyframes draw-holo-card-drift{50%{translate:0 -2px;rotate:y .7deg}}@media (prefers-reduced-motion:reduce){.draw-holo-cards[data-phase=opening] .draw-holo-card{animation:none}.draw-holo-card .draw-holo-card-tilt,.draw-holo-card .draw-holo-card-art{transition:none;transform:none!important}.draw-holo-card-foil,.draw-holo-card-glaze{transition:none}}.holo-pouch-stage{--pouch-height:min(420px, 58svh, 118vw);--pouch-width:calc(var(--pouch-height) * .7);--pouch-base:color-mix(in oklab, var(--pouch-ink) 55%, var(--pouch-accent));--pouch-dark:color-mix(in oklab, var(--pouch-base) 66%, #102326);--pouch-light:color-mix(in oklab, var(--pouch-accent) 80%, #f9ffff);--pouch-tear-cutoff:calc(var(--pouch-progress) * 100%);--pouch-tear-origin:var(--pouch-tear-cutoff) 10.6%;--pouch-tear-gradient:to right;pointer-events:none;place-items:center;display:grid;position:absolute;inset:0}.holo-pouch-stage[data-direction="-1"]{--pouch-tear-origin:calc(100% - var(--pouch-tear-cutoff)) 10.6%;--pouch-tear-gradient:to left}.holo-pouch-hit{width:var(--pouch-width);height:var(--pouch-height);font:inherit;cursor:grab;perspective:1050px;pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;background:0 0;border:0;border-radius:5px;margin:0;padding:0;position:relative}.holo-pouch-hit:focus-visible{outline:2px solid var(--ring,var(--pouch-ink));outline-offset:8px}.holo-pouch-hit:active{cursor:grabbing}.holo-pouch-hit:disabled{pointer-events:none}.holo-pouch-shadow{width:calc(var(--pouch-width) * .96);height:calc(var(--pouch-height) * .12);filter:blur(8px);background:radial-gradient(#16170e45 0%,#16170e25 36%,#0000 73%);border-radius:50%;position:absolute;inset-block-start:calc(50% + var(--pouch-height) * .48)}.holo-pouch-wrapper,.holo-pouch-body,.holo-pouch-flap,.holo-pouch-material,.holo-pouch-torn-edge{pointer-events:none;position:absolute;inset:0}.holo-pouch-wrapper{transform:rotateX(var(--pouch-tilt-x,0deg)) rotateY(var(--pouch-tilt-y,0deg));transition:transform .14s ease-out}.holo-pouch-body{clip-path:var(--pouch-body-shape)}.holo-pouch-flap{clip-path:var(--pouch-flap-shape)}.holo-pouch-flap-attached{-webkit-mask-image:linear-gradient(var(--pouch-tear-gradient), transparent var(--pouch-tear-cutoff), #000 0);mask-image:linear-gradient(var(--pouch-tear-gradient), transparent var(--pouch-tear-cutoff), #000 0)}.holo-pouch-flap-loose{transform-origin:var(--pouch-tear-origin);transform:rotate(calc((3 + var(--pouch-progress) * 5) * var(--pouch-direction) * 1deg))}.holo-pouch-material{background:radial-gradient(ellipse 60% 63% at var(--pouch-light-x,50%) var(--pouch-light-y,42%), #fff7 0%, #fbe8ff23 22%, transparent 71%), linear-gradient(96deg, var(--pouch-dark) 0%, var(--pouch-light) 2.6%, var(--pouch-base) 4.1%, transparent 9%, transparent 91%, var(--pouch-base) 96.3%, var(--pouch-light) 97.3%, var(--pouch-dark) 100%), linear-gradient(154deg, var(--pouch-accent) -26%, var(--pouch-base) 34%, var(--pouch-dark) 129%)}.holo-pouch-material:after{opacity:.2;mix-blend-mode:soft-light;content:"";background:repeating-linear-gradient(97deg,#fff3 0 1px,#0000 1px 3px,#0002 3px 4px,#0000 4px 6px),linear-gradient(84deg,#0000 2%,#fff4 3.4%,#0000 5.7% 96%,#fff4 97%,#0000 99%);position:absolute;inset:0}.holo-pouch-crimp{opacity:.92;background:repeating-linear-gradient(90deg,#1324264d 0 1px,#ffffff28 1px 2px,#0000 2px 5px),linear-gradient(#16282a60,#0000 22%,#e1ffff3a 61%,#16282a40 84%,#0000);height:10.8%;position:absolute;inset-inline:0;box-shadow:inset 0 2px 6px #12222625}.holo-pouch-crimp-top{inset-block-start:0;-webkit-mask-image:linear-gradient(#000 0% 55%,#0007 82%,#0000 100%);mask-image:linear-gradient(#000 0% 55%,#0007 82%,#0000 100%)}.holo-pouch-crimp-bottom{inset-block-end:0;-webkit-mask-image:linear-gradient(#0000,#0007 22%,#000 46%);mask-image:linear-gradient(#0000,#0007 22%,#000 46%)}.holo-pouch-title{-webkit-line-clamp:2;color:#fffdf8;font-size:clamp(16px, calc(var(--pouch-height) * .085), 36px);text-align:start;text-wrap:balance;overflow-wrap:anywhere;text-shadow:0 1px 5px #18252255;-webkit-box-orient:vertical;font-weight:850;line-height:1.07;display:-webkit-box;position:absolute;inset:16.2% 8% auto;overflow:hidden}.holo-pouch-hero{filter:drop-shadow(2px 10px 6px #14232059);position:absolute;inset:33% 13% 13%}.holo-pouch-hero img{object-fit:contain;width:100%;height:100%;display:block}.holo-pouch-hero:after{background:radial-gradient(ellipse at var(--pouch-light-x,50%) var(--pouch-light-y,42%), #fff9, #b9efff54 17%, #f1b3ef33 31%, #d3ffcc1f 47%, transparent 74%);-webkit-mask:var(--pouch-hero) center / contain no-repeat;mask:var(--pouch-hero) center / contain no-repeat;mix-blend-mode:screen;content:"";position:absolute;inset:0}.holo-pouch-peel-label{color:#fffdf0e8;font-size:clamp(8px, calc(var(--pouch-height) * .024), 10px);letter-spacing:.08em;text-align:start;text-overflow:ellipsis;white-space:nowrap;font-weight:750;line-height:1.25;position:absolute;inset:6.25% 9% auto;overflow:hidden}.holo-pouch-flap-loose,.holo-pouch-torn-edge{-webkit-mask-image:linear-gradient(var(--pouch-tear-gradient), #000 var(--pouch-tear-cutoff), transparent 0);mask-image:linear-gradient(var(--pouch-tear-gradient), #000 var(--pouch-tear-cutoff), transparent 0)}.holo-pouch-tear-guide{-webkit-mask-image:linear-gradient(var(--pouch-tear-gradient), transparent var(--pouch-tear-cutoff), #000 0);mask-image:linear-gradient(var(--pouch-tear-gradient), transparent var(--pouch-tear-cutoff), #000 0);border-top:1px dashed #fff9;position:absolute;inset:11.3% 8% auto}.holo-pouch-torn-edge{clip-path:var(--pouch-edge-shape);background:linear-gradient(100deg,#dce8eb,#f9ffff 20%,#aebfc4 49%,#fff 77%,#dbe6e9)}.holo-pouch-stage[data-phase=opening] .holo-pouch-body{animation:.72s cubic-bezier(.48,.07,.72,.77) both holo-pouch-fall}.holo-pouch-stage[data-phase=opening] .holo-pouch-flap-loose{animation:.67s cubic-bezier(.24,.65,.35,1) both holo-pouch-fly}.holo-pouch-stage[data-phase=opening] .holo-pouch-shadow{animation:.53s ease-out both holo-pouch-shadow-out}.holo-pouch-stage[data-phase=open]{visibility:hidden}@keyframes holo-pouch-fall{0%{transform:translateY(0)rotate(0)}24%{transform:translateY(-3%) rotate(calc(var(--pouch-direction) * -4deg))}to{opacity:0;transform:translate(calc(var(--pouch-direction) * -26%), 118%) rotate(calc(var(--pouch-direction) * -24deg))}}@keyframes holo-pouch-fly{0%{transform:rotate(calc(var(--pouch-direction) * 8deg))}36%{opacity:1;transform:translate(calc(var(--pouch-direction) * 31%), -21%) rotate(calc(var(--pouch-direction) * 26deg))}to{opacity:0;transform:translate(calc(var(--pouch-direction) * 126%), -42%) rotate(calc(var(--pouch-direction) * 85deg))}}@keyframes holo-pouch-shadow-out{to{opacity:0;scale:.8}}@media (height<=550px){.holo-pouch-peel-label{display:none}}@media (prefers-reduced-motion:reduce){.holo-pouch-wrapper{transition:none;transform:none}.holo-pouch-stage[data-phase=opening]{visibility:hidden}.holo-pouch-stage[data-phase=opening] :is(.holo-pouch-body,.holo-pouch-flap,.holo-pouch-shadow){animation:none}}.draw-pack-burst{isolation:isolate;box-sizing:border-box;width:100%;max-width:none;height:100%;max-height:none;color:var(--foreground);background:radial-gradient(at 50% 38%,#f6f3ed,#ebe7df 61%,#ddd8ce);border:0;margin:0;padding:0;font-family:Nunito Variable,Nunito,PingFang SC,sans-serif;position:fixed;inset:0;overflow:hidden}.dark .draw-pack-burst{background:radial-gradient(at 50% 38%,#32362e,#232720 61%,#151812)}.draw-pack-burst::backdrop{background:var(--background)}:is(html:has(body>.draw-pack-burst[open]),body:has(>.draw-pack-burst[open])){overflow:hidden}.holo-opening-ribbons{z-index:1;pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.draw-pack-burst-close,.draw-pack-burst-sound,.draw-pack-burst-actions :is(button,a){border:1px solid var(--border);min-height:44px;color:inherit;background:var(--card);font:inherit;cursor:pointer;border-radius:12px;justify-content:center;align-items:center;padding:0 16px;font-size:13px;font-weight:700;text-decoration:none;display:inline-flex;box-shadow:0 6px 16px #0001}.draw-pack-burst-close,.draw-pack-burst-sound{z-index:12;top:max(14px, env(safe-area-inset-top));right:max(14px, env(safe-area-inset-right));border-radius:50%;width:44px;padding:0;position:absolute}.draw-pack-burst-sound{right:calc(max(14px, env(safe-area-inset-right)) + 52px)}.draw-pack-burst :is(button,a):focus-visible{outline:2px solid var(--ring);outline-offset:4px}.draw-pack-burst-instruction,.draw-pack-burst-actions{z-index:10;inset-inline:12px;bottom:max(16px, env(safe-area-inset-bottom));text-align:center;position:absolute}.draw-pack-burst-instruction{color:var(--muted-foreground);pointer-events:none;margin:0;font-size:13px;line-height:1.5}.draw-pack-burst-actions{pointer-events:none;flex-wrap:wrap;justify-content:center;gap:8px;display:flex}.draw-pack-burst-actions>*{pointer-events:auto}.draw-pack-burst-actions>a{border-color:var(--primary);color:var(--primary-foreground);background:var(--primary)}@media (prefers-reduced-motion:no-preference){.draw-pack-burst-actions{animation:.18s ease-out both draw-pack-actions-appear}}@keyframes draw-pack-actions-appear{0%{opacity:0;transform:translateY(6px)}}
