:root{--holo-violet:#7C3AED;--holo-blue:#3B82F6;--holo-green:#10B981;--holo-yellow:#F59E0B;--holo-red:#EF4444;--holo-pink:#EC4899;--holo-cyan:#06B6D4;--holo-orange:#F97316;--sp-1:#ec9bb6;--sp-2:#ccac6f;--sp-3:#69e4a5;--sp-4:#73b1e0;--sp-5:#95adda;--sp-6:#c09de3}.holo-card{--pointer-x:50%;--pointer-y:50%;--pointer-from-center:0;--pointer-from-top:0.5;--pointer-from-left:0.5;--card-opacity:0;--rotate-x:0deg;--rotate-y:0deg;--background-x:50%;--background-y:50%;--card-scale:1;position:relative;z-index:1;isolation:isolate;outline:1px solid transparent}.holo-card.active{z-index:10}.holo-card__translater{display:grid;perspective:600px;transform-origin:center;will-change:transform}.holo-card__rotator{display:grid;grid-area:1/1;transform:rotateY(var(--rotate-x)) rotateX(var(--rotate-y));transform-style:preserve-3d;transform-origin:center;will-change:transform;transition:transform .15s ease-out;outline:1px solid transparent}.holo-card:not(.interacting) .holo-card__rotator{transition:transform .6s cubic-bezier(.23,1,.32,1)}.holo-card__back,.holo-card__front{grid-area:1/1;transform-style:preserve-3d}.holo-card__front{display:grid;position:relative}.holo-card__front>.holo-card__glare,.holo-card__front>.holo-card__shine,.holo-card__front>img{grid-area:1/1}.holo-card__front>img{width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.holo-card__shine{position:relative;transform:translateZ(1px);border-radius:inherit;mix-blend-mode:color-dodge;opacity:0;transition:opacity .3s ease;pointer-events:none;will-change:opacity,background}.holo-card.interacting .holo-card__shine{opacity:var(--card-opacity)}.holo-card__shine,.holo-card__shine:after,.holo-card__shine:before{width:100%;height:100%;position:absolute;top:0;left:0;border-radius:inherit}.holo-card__shine:after,.holo-card__shine:before{content:"";display:block}.holo-card__glare{position:relative;transform:translateZ(1.41px);border-radius:inherit;opacity:0;transition:opacity .3s ease;pointer-events:none;will-change:opacity;background-image:radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),hsla(0,0%,100%,.8) 10%,hsla(0,0%,100%,.65) 20%,hsla(0,0%,0%,.5) 90%);mix-blend-mode:overlay}.holo-card.interacting .holo-card__glare{opacity:var(--card-opacity)}.holo-card[data-effect=holo] .holo-card__shine{background-image:repeating-linear-gradient(110deg,var(--holo-violet) 0,var(--holo-blue) 10%,var(--holo-green) 20%,var(--holo-yellow) 30%,var(--holo-red) 40%,var(--holo-violet) 50%,var(--holo-blue) 60%,var(--holo-green) 70%,var(--holo-yellow) 80%,var(--holo-red) 90%,var(--holo-violet) 100%);background-position:calc(((50% - var(--background-x)) * 2.6) + 50%) calc(((50% - var(--background-y)) * 3.5) + 50%);background-size:400% 400%;filter:brightness(1.1) contrast(1.1) saturate(1.2)}.holo-card[data-effect=holo] .holo-card__shine:before{background-image:repeating-linear-gradient(90deg,transparent,rgba(255,255,255,.08) 3px,transparent 4px,transparent 8px,rgba(255,255,255,.12) 10px,transparent 11px,transparent 16px,rgba(255,255,255,.06) 18px,transparent 19px,transparent 25px),repeating-linear-gradient(90deg,transparent,rgba(255,255,255,.1) 5px,transparent 6px,transparent 14px,rgba(255,255,255,.08) 16px,transparent 17px,transparent 28px);background-position:calc((((50% - var(--background-x)) * 1.65) + 50%) + (var(--background-y) * .5)) var(--background-x),calc((((50% - var(--background-x)) * -.9) + 50%) - (var(--background-y) * .75)) var(--background-y);background-size:200% 200%,180% 180%;mix-blend-mode:hard-light}.holo-card[data-effect=holo] .holo-card__shine:after{background-image:radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),hsla(0,0%,90%,.8) 0,hsla(0,0%,78%,.1) 25%,hsl(0,0%,0%) 90%);mix-blend-mode:luminosity;filter:brightness(.6) contrast(4)}.holo-card[data-effect=fullart] .holo-card__shine{--space:5%;background-image:repeating-linear-gradient(0deg,var(--sp-1) calc(var(--space) * 1),var(--sp-2) calc(var(--space) * 2),var(--sp-3) calc(var(--space) * 3),var(--sp-4) calc(var(--space) * 4),var(--sp-5) calc(var(--space) * 5),var(--sp-6) calc(var(--space) * 6),var(--sp-1) calc(var(--space) * 7)),repeating-linear-gradient(133deg,#0e152e 0,hsl(180,10%,60%) 3.8%,hsl(180,29%,66%) 4.5%,hsl(180,10%,60%) 5.2%,#0e152e 10%,#0e152e 12%),radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),hsla(0,0%,90%,.9) 0,hsla(0,0%,50%,.3) 30%,transparent 70%);background-blend-mode:hue,hard-light;background-size:200% 700%,300% 100%,200% 100%;background-position:0 var(--background-y),var(--background-x) var(--background-y),var(--background-x) var(--background-y);filter:brightness(.8) contrast(2.95) saturate(.65)}.holo-card[data-effect=fullart] .holo-card__shine:before{background-image:radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),hsl(0,0%,100%) 0,hsla(0,0%,0%,0) 40%);mix-blend-mode:overlay;opacity:.75}.holo-card[data-effect=fullart] .holo-card__shine:after{--space:5%;background-image:repeating-linear-gradient(0deg,var(--sp-1) calc(var(--space) * 1),var(--sp-2) calc(var(--space) * 2),var(--sp-3) calc(var(--space) * 3),var(--sp-4) calc(var(--space) * 4),var(--sp-5) calc(var(--space) * 5),var(--sp-6) calc(var(--space) * 6),var(--sp-1) calc(var(--space) * 7)),repeating-linear-gradient(133deg,#0e152e 0,hsl(180,10%,60%) 3.8%,hsl(180,29%,66%) 4.5%,hsl(180,10%,60%) 5.2%,#0e152e 10%,#0e152e 12%);background-blend-mode:hue,hard-light;background-size:200% 400%,300% 100%;background-position:0 calc(100% - var(--background-y)),calc(100% - var(--background-x)) calc(100% - var(--background-y));mix-blend-mode:soft-light;filter:brightness(1.1) contrast(1.5)}.holo-card[data-effect=rainbow] .holo-card__shine{--r1:#ec9bb6;--r2:#ccac6f;--r3:#69e4a5;--r4:#73b1e0;--r5:#95adda;--r6:#c09de3;--r7:#ec9bb6;background-image:linear-gradient(-45deg,var(--r1),var(--r5)),linear-gradient(-30deg,var(--r1) 0,var(--r2) 8%,var(--r3) 16%,var(--r4) 24%,var(--r5) 32%,var(--r6) 40%,var(--r7) 48%,var(--r1) 56%,var(--r2) 64%,var(--r3) 72%,var(--r4) 80%,var(--r5) 88%,var(--r6) 96%,var(--r7) 100%);background-blend-mode:luminosity;background-size:200% 200%,400% 400%;background-position:calc(25% + (50% * var(--pointer-from-left))) calc(25% + (50% * var(--pointer-from-top))),calc(25% + (var(--pointer-x) / 2)) calc(25% + (var(--pointer-y) / 2));filter:brightness(calc((var(--pointer-from-center) * .25) + .6)) contrast(2.2) saturate(.75)}.holo-card[data-effect=rainbow] .holo-card__shine:before{background-image:repeating-linear-gradient(110deg,#0000,#0000 2px,rgba(255,255,255,.06) 0,rgba(255,255,255,.06) 3px,#0000 0,#0000 6px);mix-blend-mode:overlay;opacity:.5}.holo-card[data-effect=rainbow] .holo-card__shine:after{background-image:radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),hsla(0,0%,100%,.9) 0,hsla(0,0%,80%,.2) 20%,transparent 50%);mix-blend-mode:overlay;filter:brightness(.8) contrast(2)}.holo-card[data-effect=cosmos] .holo-card__shine{background-image:radial-gradient(ellipse at var(--pointer-x) var(--pointer-y),hsla(280,80%,70%,.6) 0,hsla(220,80%,60%,.4) 25%,transparent 60%),radial-gradient(ellipse at calc(100% - var(--pointer-x)) calc(100% - var(--pointer-y)),hsla(180,80%,60%,.5) 0,hsla(140,80%,50%,.3) 25%,transparent 60%),conic-gradient(from calc(var(--pointer-from-left) * 1turn) at 50% 50%,var(--sp-1),var(--sp-2),var(--sp-3),var(--sp-4),var(--sp-5),var(--sp-6),var(--sp-1));background-blend-mode:screen,screen;background-size:200% 200%,200% 200%,cover;background-position:var(--background-x) var(--background-y),calc(100% - var(--background-x)) calc(100% - var(--background-y)),50%;filter:brightness(.7) contrast(3) saturate(.6)}.holo-card[data-effect=cosmos] .holo-card__shine:before{background-image:repeating-linear-gradient(calc(var(--pointer-from-left) * 180deg),transparent 0,rgba(255,255,255,.04) 1px,transparent 2px,transparent 5px);mix-blend-mode:overlay;opacity:.8}.holo-card[data-effect=cosmos] .holo-card__shine:after{background-image:radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),hsla(0,0%,100%,.95) 0,hsla(0,0%,90%,.15) 20%,transparent 45%);mix-blend-mode:overlay;filter:brightness(.6) contrast(3)}