@property --shine-angle{syntax:"<angle>";inherits:false;initial-value:0deg}@property --ratio-x{syntax:"<number>";inherits:true;initial-value:.5}@property --ratio-y{syntax:"<number>";inherits:true;initial-value:.5}@property --glow-x{syntax:"<number>";inherits:true;initial-value:.5}@property --glow-y{syntax:"<number>";inherits:true;initial-value:.5}.card-scene{perspective:1200px;--card-radius:0px;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;--sp1:#ff7a75;--sp2:#ffed61;--sp3:#a8ff61;--sp4:#85fff7;--sp5:#7a95ff;--sp6:#d875ff;--glitter:url(https://cdn.jsdelivr.net/gh/simeydotme/pokemon-cards-css@main/public/img/glitter.png);--grain:url(https://cdn.jsdelivr.net/gh/simeydotme/pokemon-cards-css@main/public/img/grain.webp);transition:--ratio-x .35s ease-out,--ratio-y .35s ease-out,--glow-x .5s ease-out,--glow-y .5s ease-out;display:inline-block;position:relative}.card-scene:not([data-revealed]){margin-bottom:2rem}.card-scene[data-revealed]{cursor:default}.card-tilt:before{content:"";border-radius:var(--card-radius);pointer-events:none;z-index:-1;box-shadow:0 0 12px 2px var(--accent), 0 0 30px 6px color-mix(in srgb, var(--accent) 45%, transparent), 0 0 50px 12px color-mix(in srgb, var(--accent) 15%, transparent);opacity:var(--hold-progress,0);position:absolute;inset:0}.card-scene[data-revealed] .card-tilt:before{box-shadow:0 0 15px 3px var(--rarity-color,var(--accent)), 0 0 35px 8px color-mix(in srgb, var(--rarity-color,var(--accent)) 45%, transparent), 0 0 60px 15px color-mix(in srgb, var(--rarity-color,var(--accent)) 15%, transparent);animation:.8s ease-out forwards hold-glow-reveal}@keyframes hold-glow-reveal{0%{opacity:1}to{opacity:0}}.card-scene{outline:none}.card-scene:focus-visible:after{content:"";border-radius:calc(var(--card-radius) + 3px);border:2px solid color-mix(in srgb, var(--accent) 60%, transparent);pointer-events:none;z-index:5;position:absolute;inset:-3px}.card-scene[data-size=sm]{width:100%}.card-scene[data-size=md]{width:240px}.card-scene[data-size=lg]{width:clamp(120px,58.3333dvh - 11.6667rem,220px)}@media (width>=640px){.card-scene[data-size=lg]{width:clamp(160px,58.3333dvh - 16.3333rem,320px)}}.card-tilt{transform-style:preserve-3d;position:relative}.card-flipper{aspect-ratio:350/600;transform-style:preserve-3d;border-radius:var(--card-radius);width:100%;transition:transform .8s cubic-bezier(.34,1.56,.64,1);position:relative}.card-scene[data-revealed] .card-flipper{transform:rotateY(180deg)}.card-edge{pointer-events:none;background:linear-gradient(to right, color-mix(in srgb, var(--accent) 15%, var(--card)) 0%, color-mix(in srgb, var(--accent) 25%, var(--card)) 45%, color-mix(in srgb, var(--accent) 25%, var(--card)) 55%, color-mix(in srgb, var(--accent) 15%, var(--card)) 100%);position:absolute}.card-edge-l,.card-edge-r{height:100%;width:var(--card-thickness,3px);top:0}.card-edge-l{transform-origin:0;transform:rotateY(-90deg) translateX(calc(var(--card-thickness,3px) / -2));left:0}.card-edge-r{transform-origin:100%;transform:rotateY(90deg) translateX(calc(var(--card-thickness,3px) / 2));right:0}.card-edge-t,.card-edge-b{width:100%;height:var(--card-thickness,3px);background:linear-gradient(to bottom, color-mix(in srgb, var(--accent) 15%, var(--card)) 0%, color-mix(in srgb, var(--accent) 25%, var(--card)) 45%, color-mix(in srgb, var(--accent) 25%, var(--card)) 55%, color-mix(in srgb, var(--accent) 15%, var(--card)) 100%);left:0}.card-edge-t{transform-origin:top;transform:rotateX(90deg) translateY(calc(var(--card-thickness,3px) / -2));top:0}.card-edge-b{transform-origin:bottom;transform:rotateX(-90deg) translateY(calc(var(--card-thickness,3px) / 2));bottom:0}.card-face{backface-visibility:hidden;border-radius:var(--card-radius);position:absolute;inset:0}.card-back{transform:translateZ(calc(var(--card-thickness,3px) / 2));background:radial-gradient(ellipse at calc(var(--glow-x,.5) * 100%) calc(var(--glow-y,.5) * 100%), color-mix(in srgb, var(--accent) 22%, transparent) 0%, transparent 65%), var(--card);border:1px solid color-mix(in srgb, var(--accent) 35%, transparent);justify-content:center;align-items:center;display:flex}.card-back:before{content:"";border-radius:var(--card-radius);pointer-events:none;background:radial-gradient(circle at calc(var(--glow-x,.5) * 100%) calc(var(--glow-y,.5) * 100%), #ffffff12 0%, transparent 55%);position:absolute;inset:0}.card-back-art{border:1px solid color-mix(in srgb, var(--accent) 25%, transparent);opacity:.6;background:repeating-linear-gradient(45deg, transparent 0px, transparent 10px, color-mix(in srgb, var(--accent) 10%, transparent) 10px, color-mix(in srgb, var(--accent) 10%, transparent) 11px), repeating-linear-gradient(-45deg, transparent 0px, transparent 10px, color-mix(in srgb, var(--accent) 10%, transparent) 10px, color-mix(in srgb, var(--accent) 10%, transparent) 11px);position:absolute;inset:10px}.card-back-sigil{color:color-mix(in srgb, var(--accent) 70%, transparent);-webkit-user-select:none;user-select:none;font-size:2.5rem}.card-scene[data-size=sm] .card-back-sigil{font-size:1.5rem}.card-scene[data-size=lg] .card-back-sigil{font-size:3rem}.card-front{transform:rotateY(180deg) translateZ(calc(var(--card-thickness,3px) / 2));border-radius:0}.card-front img{object-fit:cover;width:100%;height:100%;display:block}.card-scene[data-reversed] .card-front img{transform:rotate(180deg)}.card-shine,.card-shine:before,.card-shine:after,.card-glare,.card-glare:after{pointer-events:none;border-radius:0;position:absolute;inset:0;overflow:hidden}.card-shine{z-index:2;mix-blend-mode:color-dodge;opacity:0;will-change:transform, opacity, background-image, background-size, background-position, background-blend-mode, filter;transition:opacity .3s}.card-shine:before,.card-shine:after{content:""}.card-glare{z-index:3;mix-blend-mode:overlay;opacity:0;background-image:radial-gradient(farthest-corner circle at calc(var(--glow-x,.5) * 100%) calc(var(--glow-y,.5) * 100%), #fffc 10%, #ffffffa6 20%, #00000080 90%);will-change:transform, opacity, background-image;transition:opacity .3s}.card-scene[data-rarity="1"] .card-shine,.card-scene[data-rarity="1"] .card-glare{display:none}.card-scene[data-rarity="2"] .card-shine{background-image:repeating-linear-gradient(110deg, var(--sp1) 1%, var(--sp2) 3%, var(--sp3) 5%, var(--sp4) 7%, var(--sp5) 9%, var(--sp6) 11%, var(--sp1) 13%), repeating-linear-gradient(90deg, #8080800d 0px, #8080800d 1px, transparent 1px, transparent 3px);background-blend-mode:overlay;background-size:200% 700%,cover;background-position:calc(var(--ratio-x,.5) * 100%) calc(var(--ratio-y,.5) * 300%), center;filter:brightness(.85)contrast(2.75)saturate(.45)}.card-scene[data-rarity="2"][data-revealed]:hover .card-shine{opacity:calc(.04 + var(--pointer-from-center,0) * .15)}.card-scene[data-rarity="2"][data-revealed]:hover .card-glare{opacity:.1}@keyframes holo-rotate{to{--shine-angle:360deg}}.card-scene[data-rarity="3"] .card-shine{background-image:var(--glitter), conic-gradient(from var(--shine-angle,0deg), var(--sp1), var(--sp2), var(--sp3), var(--sp4), var(--sp5), var(--sp6), var(--sp1)), repeating-linear-gradient(-30deg, var(--sp1) 0%, var(--sp2) 3.5%, var(--sp3) 7%, var(--sp4) 10.5%, var(--sp5) 14%, var(--sp6) 17.5%, var(--sp1) 21%);background-blend-mode:soft-light, overlay;background-size:25%,200% 200%,350% 350%;background-position:calc(var(--ratio-x,.5) * 100%) calc(var(--ratio-y,.5) * 100%), calc(var(--ratio-x,.5) * 100%) calc(var(--ratio-y,.5) * 100%), calc(var(--ratio-x,.5) * 120% - 10%) calc(var(--ratio-y,.5) * 120% - 10%);filter:brightness(calc(.55 + var(--pointer-from-center,0) * .25)) contrast(2.2) saturate(.75);animation:6s linear infinite holo-rotate}.card-scene[data-rarity="3"][data-revealed] .card-shine{opacity:.15}.card-scene[data-rarity="3"][data-revealed]:hover .card-shine{opacity:calc(.25 + var(--pointer-from-center,0) * .55)}.card-scene[data-rarity="3"][data-revealed]:hover .card-glare{opacity:.4}.card-scene[data-rarity="3"] .card-shine:before{background-image:repeating-linear-gradient(133deg, var(--sp4) 0%, var(--sp5) 2%, var(--sp6) 4%, var(--sp1) 6%, var(--sp2) 8%, var(--sp3) 10%, var(--sp4) 12%);background-size:300% 300%;background-position:calc(100% - var(--ratio-x,.5) * 100%) calc(100% - var(--ratio-y,.5) * 100%);mix-blend-mode:difference;opacity:.35}.card-scene[data-rarity="4"] .card-shine{background-image:var(--glitter), repeating-linear-gradient(0deg, var(--sp1) 0%, var(--sp2) 2%, var(--sp3) 4%, var(--sp4) 6%, var(--sp5) 8%, var(--sp6) 10%, var(--sp1) 12%), repeating-linear-gradient(133deg, var(--sp4) 0%, var(--sp5) 2%, var(--sp6) 4%, var(--sp1) 6%, var(--sp2) 8%, var(--sp3) 10%, var(--sp4) 12%), radial-gradient(farthest-corner ellipse at calc(var(--ratio-x,.5) * 100%) calc(var(--ratio-y,.5) * 100%), #0000001a 0%, #00000080 90%);background-blend-mode:soft-light, hue, hard-light, overlay;background-size:25%,200% 700%,300% 300%,cover;background-position:calc(var(--ratio-x,.5) * 100%) calc(var(--ratio-y,.5) * 100%), calc(var(--ratio-x,.5) * 100%) calc(var(--ratio-y,.5) * 400%), calc(100% - var(--ratio-x,.5) * 100%) calc(100% - var(--ratio-y,.5) * 300%), center;filter:brightness(calc(.4 + var(--pointer-from-center,0) * .4)) contrast(1.4) saturate(2.25)}.card-scene[data-rarity="4"][data-revealed] .card-shine{opacity:.1}.card-scene[data-rarity="4"][data-revealed]:hover .card-shine{opacity:calc(.25 + var(--pointer-from-center,0) * .5)}.card-scene[data-rarity="4"][data-revealed]:hover .card-glare{opacity:.55}.card-scene[data-rarity="4"] .card-shine:before{mix-blend-mode:overlay;opacity:.6;background-image:repeating-linear-gradient(45deg,#ffffff12 0 1px,#0000 1px 5px),repeating-linear-gradient(-45deg,#ffffff12 0 1px,#0000 1px 5px)}@keyframes cosmos-drift{to{--shine-angle:360deg}}.card-scene[data-rarity="5"] .card-shine{background-image:var(--glitter), conic-gradient(from var(--shine-angle,0deg) at 50% 50%, #2f0d73 0%, #256af4 18%, #6ef7f7 28%, #c155f6 42%, #e830ab 57%, #3e09aa 72%, #477eeb 88%, #2f0d73 100%), radial-gradient(ellipse 130% 90% at calc(var(--ratio-x,.5) * 130% - 15%) calc(var(--ratio-y,.5) * 130% - 15%), #b3ccff 0%, #884cff 30%, #a112a1 60%, transparent 80%), radial-gradient(farthest-corner circle at calc(var(--ratio-x,.5) * 80% + 10%) calc(var(--ratio-y,.5) * 80% + 10%), #0000001a 0%, #000000b3 90%);background-blend-mode:soft-light, color-dodge, difference, overlay;background-size:25%,220% 220%,350% 350%,cover;background-position:calc(var(--ratio-x,.5) * 100%) calc(var(--ratio-y,.5) * 100%), calc(var(--ratio-x,.5) * 100%) calc(var(--ratio-y,.5) * 100%), calc(var(--ratio-x,.5) * 160% - 30%) calc(var(--ratio-y,.5) * 160% - 30%), center;filter:brightness(calc(.35 + var(--pointer-from-center,0) * .45)) contrast(1.9) saturate(1.6);animation:5s linear infinite cosmos-drift}.card-scene[data-rarity="5"][data-revealed] .card-shine{opacity:.3}.card-scene[data-rarity="5"][data-revealed]:hover .card-shine{opacity:calc(.45 + var(--pointer-from-center,0) * .45)}.card-scene[data-rarity="5"][data-revealed]:hover .card-glare{opacity:.65}.card-scene[data-rarity="5"] .card-shine:before{background-image:radial-gradient(circle at calc(var(--ratio-x,.5) * 70% + 15%) calc(var(--ratio-y,.5) * 70% + 15%), #e6eeff99 0%, #eeccff4d 20%, transparent 60%), repeating-linear-gradient(calc(var(--shine-angle,0deg) + 30deg), #9966ff26 0%, #ccddff4d 1.5%, transparent 2.5%, #ff66ff1a 4%, transparent 6%);mix-blend-mode:screen;background-size:cover,350% 350%;background-position:center, calc(var(--ratio-x,.5) * 100%) calc(var(--ratio-y,.5) * 100%)}.card-scene[data-rarity="5"] .card-shine:after{background-image:radial-gradient(ellipse 85% 65% at calc(30% + var(--ratio-x,.5) * 40%) calc(30% + var(--ratio-y,.5) * 40%), #dd99ff80 0%, #6699ff4d 35%, transparent 70%);mix-blend-mode:color-dodge;opacity:.7}.card-scene[data-rarity="5"][data-revealed]:hover .card-glare:after{content:"";background:radial-gradient(farthest-corner circle at calc(var(--ratio-x,.5) * 100%) calc(var(--ratio-y,.5) * 100%), #ccddff8c 0%, #cc66ff59 25%, transparent 65%);mix-blend-mode:screen}.card-subject{object-fit:cover;z-index:1;pointer-events:none;filter:drop-shadow(0 2px 8px #00000073);width:100%;height:100%;display:block;position:absolute;inset:0}.card-scene[data-reversed] .card-subject{transform:rotate(180deg)}.card-text-layer{object-fit:cover;z-index:1;pointer-events:none;width:100%;height:100%;display:block;position:absolute;inset:0;translate:0 0 .001px}.card-scene[data-rarity="5"] .card-text-layer{transform:translate(calc((var(--ratio-x,.5) - .5) * 10px), calc((var(--ratio-y,.5) - .5) * 10px))}.card-scene[data-rarity="5"][data-reversed] .card-text-layer{transform:rotate(180deg) translate(calc((var(--ratio-x,.5) - .5) * 10px), calc((var(--ratio-y,.5) - .5) * 10px))}.card-scene[data-rarity="4"] .card-subject{transform:translate(calc((var(--ratio-x,.5) - .5) * 5px), calc((var(--ratio-y,.5) - .5) * 5px))}.card-scene[data-rarity="4"][data-reversed] .card-subject{transform:rotate(180deg) translate(calc((var(--ratio-x,.5) - .5) * 5px), calc((var(--ratio-y,.5) - .5) * 5px))}.card-scene[data-rarity="5"] .card-subject{transform:translate(calc((var(--ratio-x,.5) - .5) * 10px), calc((var(--ratio-y,.5) - .5) * 10px));filter:drop-shadow(0 4px 14px #0009)}.card-scene[data-rarity="5"][data-reversed] .card-subject{transform:rotate(180deg) translate(calc((var(--ratio-x,.5) - .5) * 10px), calc((var(--ratio-y,.5) - .5) * 10px))}.card-scene[data-rarity="3"] .card-shine,.card-scene[data-rarity="4"] .card-shine,.card-scene[data-rarity="5"] .card-shine{-webkit-mask-image:var(--mask-url,none);-webkit-mask-size:cover;-webkit-mask-image:var(--mask-url,none);mask-image:var(--mask-url,none);-webkit-mask-size:cover;mask-size:cover;-webkit-mask-source-type:alpha;mask-mode:alpha}.card-scene[data-rarity="4"] .card-shine{transform:translate(calc((var(--ratio-x,.5) - .5) * 5px), calc((var(--ratio-y,.5) - .5) * 5px))}.card-scene[data-rarity="5"] .card-shine{transform:translate(calc((var(--ratio-x,.5) - .5) * 10px), calc((var(--ratio-y,.5) - .5) * 10px))}.card-name-foil,.card-top-foil{border-radius:var(--card-radius);z-index:2;pointer-events:none;mix-blend-mode:color-dodge;opacity:0;background:linear-gradient(calc(90deg + (var(--ratio-x,.5) - .5) * 60deg), transparent 15%, #c38e22 40%, #f7d56e 50%, #c38e22 60%, transparent 85%);background-size:200% 100%;background-position:calc(var(--ratio-x,.5) * 100%) 0;filter:brightness(.8)contrast(2)saturate(1.2);transition:opacity .3s;position:absolute;inset:0}.card-name-foil{-webkit-mask-image:var(--name-mask-url,none);-webkit-mask-size:cover;-webkit-mask-image:var(--name-mask-url,none);mask-image:var(--name-mask-url,none);-webkit-mask-size:cover;mask-size:cover;-webkit-mask-source-type:alpha;mask-mode:alpha}.card-top-foil{-webkit-mask-image:var(--top-mask-url,none);-webkit-mask-size:cover;-webkit-mask-image:var(--top-mask-url,none);mask-image:var(--top-mask-url,none);-webkit-mask-size:cover;mask-size:cover;-webkit-mask-source-type:alpha;mask-mode:alpha}.card-scene[data-rarity="3"][data-revealed]:hover .card-name-foil,.card-scene[data-rarity="3"][data-revealed]:hover .card-top-foil{opacity:.3}.card-scene[data-rarity="4"][data-revealed] .card-name-foil,.card-scene[data-rarity="4"][data-revealed] .card-top-foil{opacity:.25}.card-scene[data-rarity="4"][data-revealed]:hover .card-name-foil,.card-scene[data-rarity="4"][data-revealed]:hover .card-top-foil{opacity:.5}.card-scene[data-rarity="4"] .card-name-foil,.card-scene[data-rarity="4"] .card-top-foil{transform:translate(calc((var(--ratio-x,.5) - .5) * 5px), calc((var(--ratio-y,.5) - .5) * 5px))}.card-scene[data-rarity="5"][data-revealed] .card-name-foil,.card-scene[data-rarity="5"][data-revealed] .card-top-foil{opacity:.4}.card-scene[data-rarity="5"][data-revealed]:hover .card-name-foil,.card-scene[data-rarity="5"][data-revealed]:hover .card-top-foil{opacity:.65}.card-scene[data-rarity="5"] .card-name-foil,.card-scene[data-rarity="5"] .card-top-foil{transform:translate(calc((var(--ratio-x,.5) - .5) * 10px), calc((var(--ratio-y,.5) - .5) * 10px))}@keyframes radiant-hue{to{filter:hue-rotate(360deg)}}.card-scene[data-radiant][data-revealed] .card-front{animation:1.2s ease-out .35s both reveal-glow,8s linear infinite radiant-hue}@keyframes reveal-glow{0%{box-shadow:0 0 #0000}40%{box-shadow:0 0 50px var(--rarity-color,#ffffff4d), 0 0 100px #ffffff1a}to{box-shadow:0 0 18px var(--rarity-color,#ffffff1a)}}@keyframes reveal-pop{0%{transform:scale(1)}40%{transform:scale(1.05)}to{transform:scale(1)}}.card-scene[data-revealed] .card-front{animation:1.2s ease-out .35s both reveal-glow}.card-scene[data-revealed]{animation:.25s ease-out both reveal-pop}.card-reveal-hint{text-align:center;letter-spacing:.15em;text-transform:uppercase;color:var(--muted-foreground);opacity:.35;pointer-events:none;font-size:.65rem;animation:2s ease-in-out infinite hint-pulse;position:absolute;bottom:-2rem;left:0;right:0}@keyframes hint-pulse{0%,to{opacity:.35}50%{opacity:.6}}@media (prefers-reduced-motion:reduce){.card-scene,.card-scene:before,.card-flipper,.card-shine,.card-glare,.card-reveal-hint{transition:none!important;animation:none!important}.card-scene[data-revealed] .card-flipper{transform:rotateY(180deg)!important}.card-scene[data-rarity="5"][data-revealed] .card-shine{opacity:.25}.card-scene[data-rarity="3"][data-revealed] .card-shine{opacity:.15}}