.cardshowcase{justify-content:center;align-items:center;display:flex;position:absolute;inset:0;overflow:hidden;container-type:inline-size}.cardshowcase__stage{perspective:1100px;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative}.cardshowcase__card{width:100%;height:100%;transform-style:preserve-3d;will-change:transform;justify-content:center;align-items:center;transition:transform .45s cubic-bezier(.22,1,.36,1);display:flex;position:relative}.cardshowcase__shadow{filter:blur(3px);opacity:0;pointer-events:none;background:radial-gradient(#00000052 0%,#00000029 45%,#0000 72%);width:58%;height:7%;transition:opacity .4s,transform .4s;position:absolute;bottom:7%;left:50%;transform:translate(-50%)}.cardshowcase--classic .cardshowcase__card{transition:transform .5s cubic-bezier(.22,1,.36,1)}.group:hover .cardshowcase--classic .cardshowcase__card{transform:scale(1.04)}.cardshowcase--stand .cardshowcase__card{transform-origin:bottom;transform:translateY(-4%)rotateX(7deg)}.cardshowcase--stand .cardshowcase__shadow{opacity:.85;bottom:9%}.cardshowcase--stand .cardshowcase__prop,.cardshowcase--spinning .cardshowcase__prop{pointer-events:none;width:58%;height:10%;position:absolute;bottom:3.5%;left:50%;transform:translate(-50%)}.cardshowcase--stand .cardshowcase__prop:before,.cardshowcase--spinning .cardshowcase__prop:before{content:"";z-index:1;background:radial-gradient(at 50% 32%,#414249 0%,#232429 55%,#151619 100%);border-radius:50%;height:68%;position:absolute;top:0;left:0;right:0;box-shadow:inset 0 1px 1px #ffffff38,inset 0 -2px 4px #0000008c}.cardshowcase--stand .cardshowcase__prop:after,.cardshowcase--spinning .cardshowcase__prop:after{content:"";background:linear-gradient(#28292f 0%,#101114 80%);border-radius:50%;position:absolute;inset:34% 1% 0;box-shadow:0 2px 6px #00000073}.cardshowcase__plate{z-index:2;letter-spacing:.06em;white-space:nowrap;color:#ffffffeb;text-shadow:0 1px 2px #000c;font-size:9px;line-height:1;position:absolute;bottom:4%;left:50%;transform:translate(-50%)}.cardshowcase__plate>span{color:hsl(var(--primary))}@supports (font-size:1cqw){.cardshowcase__plate{font-size:clamp(7px,5.5cqw,15px)}}.cardshowcase--floating .cardshowcase__shadow{opacity:.7}.cardshowcase--floating.is-visible .cardshowcase__card{animation:4.5s ease-in-out infinite csFloat}.cardshowcase--floating.is-visible .cardshowcase__shadow{animation:4.5s ease-in-out infinite csFloatShadow}@keyframes csFloat{0%,to{transform:translateY(0)}50%{transform:translateY(-5%)}}@keyframes csFloatShadow{0%,to{opacity:.7;transform:translate(-50%)scale(1)}50%{opacity:.4;transform:translate(-50%)scale(.86)}}.cardshowcase--glass{background:radial-gradient(ellipse 70% 50% at 50% 0%, #ffffff29 0%, transparent 60%), linear-gradient(to bottom, hsl(var(--brand-charcoal)) 0%, #161d27 100%)}.cardshowcase--glass .cardshowcase__glass{pointer-events:none;background:linear-gradient(115deg,#0000 30%,#ffffff1a 44%,#ffffff05 50%,#0000 64%);position:absolute;inset:0}.cardshowcase--glass .cardshowcase__shadow{opacity:.55;background:radial-gradient(#00000080 0%,#0000 70%)}.cardshowcase--slab .cardshowcase__card{-webkit-backdrop-filter:blur(2px);background:linear-gradient(150deg,#ffffff38 0%,#ffffff0f 40%,#ffffff24 100%);border:1px solid #ffffff80;border-radius:10px;width:84%;height:92%;padding:9% 6% 5%;box-shadow:inset 0 1px 1px #fff9,inset 0 0 0 6px #ffffff0f,0 10px 24px #00000038}.cardshowcase--slab .cardshowcase__prop{pointer-events:none;background:linear-gradient(#ffffffd9,#ffffff73);border-radius:999px;width:64%;height:5%;position:absolute;top:4%;left:50%;transform:translate(-50%);box-shadow:0 1px 2px #0000001f}.cardshowcase--neon .cardshowcase__card{filter:drop-shadow(0 0 8px hsl(var(--primary) / .45)) drop-shadow(0 0 22px hsl(var(--primary) / .2))}.cardshowcase--neon.is-visible .cardshowcase__card{animation:3.4s ease-in-out infinite csNeonPulse}@keyframes csNeonPulse{0%,to{filter:drop-shadow(0 0 8px hsl(var(--primary) / .45)) drop-shadow(0 0 22px hsl(var(--primary) / .2))}50%{filter:drop-shadow(0 0 14px hsl(var(--primary) / .65)) drop-shadow(0 0 34px hsl(var(--primary) / .32))}}.cardshowcase--spotlight{background:linear-gradient(#11161d 0%,#1c2431 100%)}.cardshowcase--spotlight .cardshowcase__beam{pointer-events:none;background:radial-gradient(ellipse 55% 80% at var(--cs-beam,50%) 0%, #fffdf04d 0%, #fffdf01a 42%, transparent 70%);position:absolute;inset:0}.cardshowcase--spotlight.is-visible .cardshowcase__beam{animation:8s ease-in-out infinite csSpotlight}@keyframes csSpotlight{0%,to{--cs-beam:26%}50%{--cs-beam:74%}}@property --cs-beam{syntax:"<percentage>";inherits:false;initial-value:50%}.cardshowcase--spotlight .cardshowcase__shadow{opacity:.6;background:radial-gradient(#0000008c 0%,#0000 70%)}.cardshowcase--prism .cardshowcase__prism{pointer-events:none;mix-blend-mode:screen;opacity:.45;background:linear-gradient(115deg, transparent calc(var(--cs-prism,30%) - 18%), #ff6e6e66 calc(var(--cs-prism,30%) - 9%), #ffdc8266 calc(var(--cs-prism,30%) - 4%), #8cffbe66 var(--cs-prism,30%), #96d2ff66 calc(var(--cs-prism,30%) + 4%), #d296ff66 calc(var(--cs-prism,30%) + 9%), transparent calc(var(--cs-prism,30%) + 18%));position:absolute;inset:0}.cardshowcase--prism.is-visible .cardshowcase__prism{animation:7.5s ease-in-out infinite csPrism}@keyframes csPrism{0%,to{--cs-prism:20%;opacity:.35}50%{--cs-prism:80%;opacity:.55}}@property --cs-prism{syntax:"<percentage>";inherits:false;initial-value:30%}.cardshowcase--rotating .cardshowcase__stage{perspective:750px}.cardshowcase--rotating .cardshowcase__shadow{opacity:.55}.cardshowcase--rotating.is-visible .cardshowcase__card{animation:6.5s ease-in-out infinite csRotate}@keyframes csRotate{0%,to{transform:rotateY(-10deg)rotateX(1.25deg)}50%{transform:rotateY(10deg)rotateX(-1.25deg)}}.cardshowcase--rotating .cardshowcase__sheen{pointer-events:none;mix-blend-mode:screen;opacity:0;background:linear-gradient(100deg, transparent calc(var(--cs-sheen,50%) - 16%), #ffffff47 calc(var(--cs-sheen,50%) - 5%), #ffffff6b var(--cs-sheen,50%), #ffffff47 calc(var(--cs-sheen,50%) + 5%), transparent calc(var(--cs-sheen,50%) + 16%));position:absolute;inset:0}.cardshowcase--rotating.is-visible .cardshowcase__sheen{animation:6.5s ease-in-out infinite csRotateSheen}@keyframes csRotateSheen{0%,to{--cs-sheen:8%;opacity:0}25%{--cs-sheen:30%;opacity:.55}50%{--cs-sheen:92%;opacity:0}75%{--cs-sheen:70%;opacity:.55}}@property --cs-sheen{syntax:"<percentage>";inherits:false;initial-value:50%}.cardshowcase--rotating.is-visible .cardshowcase__shadow{animation:6.5s ease-in-out infinite csRotateShadow}@keyframes csRotateShadow{0%,to{opacity:.55;transform:translate(-46%)scaleX(.9)}25%,75%{opacity:.65;transform:translate(-50%)scaleX(1)}50%{opacity:.55;transform:translate(-54%)scaleX(.9)}}.cardshowcase--spinning .cardshowcase__stage{perspective:900px}.cardshowcase--spinning .cardshowcase__card{width:86%;height:82%;transform-style:preserve-3d;margin-bottom:11%}.cardshowcase--spinning.is-visible .cardshowcase__card{animation:10s linear infinite csSpin}@keyframes csSpin{0%{transform:rotateY(0)}to{transform:rotateY(360deg)}}.cardshowcase--spinning .cardshowcase__shadow{opacity:.55;width:46%;bottom:12%}.cardshowcase__face{backface-visibility:hidden;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.cardshowcase__face--back{transform:rotateY(180deg)}.cardshowcase__backcard{aspect-ratio:63/88;background:radial-gradient(circle at 50% 30%,#31333a 0%,#1c1d22 55%,#121317 100%);border:1px solid #ffffff24;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;gap:7%;max-width:96%;height:96%;display:flex;box-shadow:inset 0 0 0 5px #ffffff0d,inset 0 0 40px #00000080}.cardshowcase__backicon{width:26%;height:auto}.cardshowcase__backword{letter-spacing:.05em;color:#fffffff2;font-size:14px;line-height:1}.cardshowcase__backword>span{color:hsl(var(--primary))}@supports (font-size:1cqw){.cardshowcase__backword{font-size:clamp(11px,10cqw,28px)}}.cardshowcase--holographic .cardshowcase__card{transform:rotateX(var(--cs-rx,0deg)) rotateY(var(--cs-ry,0deg));transition:transform .2s ease-out}.cardshowcase--holographic .cardshowcase__holo{opacity:.5;mix-blend-mode:color-dodge;pointer-events:none;background-image:linear-gradient(115deg, transparent 0%, #fff9 calc(var(--cs-px,50%) - 8%), #ffffff1a var(--cs-px,50%), transparent calc(var(--cs-px,50%) + 14%)), repeating-linear-gradient(115deg, #ff5a968c 0%, #ffcd788c 7%, #78ffb48c 14%, #78cdff8c 21%, #c88cff8c 28%, #ff5a968c 35%);background-size:100% 100%,240% 240%;background-position:0 0, var(--cs-px,50%) 50%;background-blend-mode:screen;border-radius:8px;transition:opacity .3s;position:absolute;inset:0}.cardshowcase--holographic.is-pointing .cardshowcase__holo{opacity:.7}.cardshowcase--holographic.is-visible:not(.is-pointing) .cardshowcase__holo{animation:6s ease-in-out infinite csHolo}@keyframes csHolo{0%,to{--cs-px:30%;opacity:.4}50%{--cs-px:70%;opacity:.6}}.cardshowcase--holographic .cardshowcase__sparkle{pointer-events:none;mix-blend-mode:color-dodge;opacity:.3;background-image:radial-gradient(circle at 25% 35%,#ffffffe6 0 1px,#0000 2px),radial-gradient(circle at 75% 15%,#fffc 0 1px,#0000 2px),radial-gradient(circle at 55% 70%,#ffffffd9 0 1px,#0000 2px),radial-gradient(circle at 15% 85%,#ffffffb3 0 1px,#0000 2px);background-size:67px 67px,89px 89px,103px 103px,127px 127px;border-radius:8px;transition:opacity .3s;position:absolute;inset:0}.cardshowcase--holographic.is-pointing .cardshowcase__sparkle{opacity:.55}.cardshowcase--holographic.is-visible .cardshowcase__sparkle{animation:9s linear infinite csSparkle}@keyframes csSparkle{0%{background-position:0 0,0 0,0 0,0 0}to{background-position:67px 134px,-89px 89px,103px -103px,-127px -254px}}.cardshowcase--holographic .cardshowcase__glare{pointer-events:none;mix-blend-mode:overlay;opacity:0;background:radial-gradient(circle at var(--cs-px,50%) var(--cs-py,50%), #ffffff80 0%, #ffffff24 26%, transparent 55%);border-radius:8px;transition:opacity .3s;position:absolute;inset:0}.cardshowcase--holographic.is-pointing .cardshowcase__glare{opacity:.85}@property --cs-px{syntax:"<percentage>";inherits:false;initial-value:50%}@media (prefers-reduced-motion:reduce){.cardshowcase__card,.cardshowcase__holo,.cardshowcase__sparkle,.cardshowcase__glare,.cardshowcase__beam,.cardshowcase__prism,.cardshowcase__sheen,.cardshowcase__shadow{transition:none!important;animation:none!important}.cardshowcase--holographic .cardshowcase__card{transform:none}}
