.holo-card{-moz-user-select:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;--pointer-x:50%;--pointer-y:50%;--rotate-x:0deg;--rotate-y:0deg;--background-x:50%;--background-y:50%;--pointer-from-center:0;--pointer-from-top:0.5;--pointer-from-left:0.5;--card-opacity:0;--holo-intensity:0.30;--sunpillar-1:hsl(2,100%,73%);--sunpillar-2:hsl(53,100%,69%);--sunpillar-3:hsl(93,100%,69%);--sunpillar-4:hsl(176,100%,76%);--sunpillar-5:hsl(228,100%,74%);--sunpillar-6:hsl(283,100%,73%);--card-thickness:4px;--card-corner-radius:8px;--edge-brightness-left:0;--edge-brightness-right:0;--edge-brightness-top:0;--edge-brightness-bottom:0;position:relative;width:100%;perspective:1000px}.holo-card__rotator{position:relative;width:100%;height:100%;transform:rotateY(var(--rotate-x)) rotateX(var(--rotate-y));transform-style:preserve-3d;transition:transform .5s cubic-bezier(.4,0,.2,1)}.holo-card.is-interacting .holo-card__rotator{transition:transform .05s ease-out;will-change:transform}.holo-card__flipper{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .45s cubic-bezier(.22,1,.36,1)}.holo-card.is-interacting .holo-card__flipper{will-change:transform}.holo-card__flipper.is-flipped{transform:rotateY(180deg)}@media (prefers-reduced-motion:reduce){.holo-card__flipper,.holo-card__rotator{transition:none}}@media (pointer:coarse){.holo-card__corner,.holo-card__edge{display:none}.holo-card{perspective:none}.holo-card__flipper,.holo-card__rotator{transform-style:flat;transform:none!important}.holo-card__face--back,.holo-card__face--front{transform:none!important;backface-visibility:visible;-webkit-backface-visibility:visible;transition:opacity .3s cubic-bezier(.4,0,.2,1)}.holo-card__face--front{opacity:1;z-index:2}.holo-card__face--back,.holo-card__flipper.is-flipped .holo-card__face--front{opacity:0;z-index:1;pointer-events:none}.holo-card__flipper.is-flipped .holo-card__face--back{opacity:1;pointer-events:auto;z-index:2}}.holo-card__face{position:absolute;inset:0;border-radius:inherit;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;isolation:isolate}.holo-card__face--front{transform:translateZ(calc(var(--card-thickness) / 2))}.holo-card__face--back{transform:rotateY(180deg) translateZ(calc(var(--card-thickness) / 2))}.holo-card__edge{position:absolute;background:linear-gradient(180deg,rgba(150,150,150,.95) 0,rgba(245,245,245,.98) 50%,rgba(150,150,150,.95));pointer-events:none}.holo-card__edge--top{top:calc(var(--card-thickness) / -2);transform:rotateX(90deg);filter:brightness(calc(.85 + var(--edge-brightness-top) * .9))}.holo-card__edge--bottom,.holo-card__edge--top{left:var(--card-corner-radius);right:var(--card-corner-radius);height:var(--card-thickness)}.holo-card__edge--bottom{bottom:calc(var(--card-thickness) / -2);transform:rotateX(-90deg);filter:brightness(calc(.85 + var(--edge-brightness-bottom) * .9))}.holo-card__edge--left{left:calc(var(--card-thickness) / -2);transform:rotateY(-90deg);filter:brightness(calc(.85 + var(--edge-brightness-left) * .9))}.holo-card__edge--left,.holo-card__edge--right{top:var(--card-corner-radius);bottom:var(--card-corner-radius);width:var(--card-thickness)}.holo-card__edge--right{right:calc(var(--card-thickness) / -2);transform:rotateY(90deg);filter:brightness(calc(.85 + var(--edge-brightness-right) * .9))}.holo-card__corner{position:absolute;width:calc(.7654 * var(--card-corner-radius));height:var(--card-thickness);background:linear-gradient(180deg,rgba(150,150,150,.95) 0,rgba(245,245,245,.98) 50%,rgba(150,150,150,.95));pointer-events:none;transform-origin:center center}.holo-card__corner--tl-1{top:calc(var(--card-corner-radius) * .076);left:calc(var(--card-corner-radius) * .617);transform:translate(-50%,-50%) rotate(157.5deg) rotateX(90deg);filter:brightness(calc(.85 + (var(--edge-brightness-top) * .75 + var(--edge-brightness-left) * .25) * .9))}.holo-card__corner--tl-2{top:calc(var(--card-corner-radius) * .617);left:calc(var(--card-corner-radius) * .076);transform:translate(-50%,-50%) rotate(112.5deg) rotateX(90deg);filter:brightness(calc(.85 + (var(--edge-brightness-top) * .25 + var(--edge-brightness-left) * .75) * .9))}.holo-card__corner--tr-1{top:calc(var(--card-corner-radius) * .076);left:calc(100% - var(--card-corner-radius) * .617);transform:translate(-50%,-50%) rotate(22.5deg) rotateX(90deg);filter:brightness(calc(.85 + (var(--edge-brightness-top) * .75 + var(--edge-brightness-right) * .25) * .9))}.holo-card__corner--tr-2{top:calc(var(--card-corner-radius) * .617);left:calc(100% - var(--card-corner-radius) * .076);filter:brightness(calc(.85 + (var(--edge-brightness-top) * .25 + var(--edge-brightness-right) * .75) * .9))}.holo-card__corner--bl-1,.holo-card__corner--tr-2{transform:translate(-50%,-50%) rotate(67.5deg) rotateX(90deg)}.holo-card__corner--bl-1{top:calc(100% - var(--card-corner-radius) * .617);left:calc(var(--card-corner-radius) * .076);filter:brightness(calc(.85 + (var(--edge-brightness-bottom) * .25 + var(--edge-brightness-left) * .75) * .9))}.holo-card__corner--bl-2{top:calc(100% - var(--card-corner-radius) * .076);left:calc(var(--card-corner-radius) * .617);transform:translate(-50%,-50%) rotate(22.5deg) rotateX(90deg);filter:brightness(calc(.85 + (var(--edge-brightness-bottom) * .75 + var(--edge-brightness-left) * .25) * .9))}.holo-card__corner--br-1{top:calc(100% - var(--card-corner-radius) * .617);left:calc(100% - var(--card-corner-radius) * .076);transform:translate(-50%,-50%) rotate(112.5deg) rotateX(90deg);filter:brightness(calc(.85 + (var(--edge-brightness-bottom) * .25 + var(--edge-brightness-right) * .75) * .9))}.holo-card__corner--br-2{top:calc(100% - var(--card-corner-radius) * .076);left:calc(100% - var(--card-corner-radius) * .617);transform:translate(-50%,-50%) rotate(157.5deg) rotateX(90deg);filter:brightness(calc(.85 + (var(--edge-brightness-bottom) * .75 + var(--edge-brightness-right) * .25) * .9))}.holo-card__face--front .holo-card__glare,.holo-card__face--front .holo-card__shine{display:none}.holo-card img{-webkit-user-drag:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:none}.holo-card__glare,.holo-card__shine{position:absolute;inset:0;pointer-events:none;border-radius:inherit;transform:translateZ(0)}.holo-card__shine{--space:5%;--angle:133deg;z-index:3;overflow:hidden;mix-blend-mode:color-dodge;opacity:calc(var(--card-opacity) * var(--holo-intensity));background-image:repeating-linear-gradient(0deg,var(--sunpillar-5) calc(var(--space) * 1),var(--sunpillar-6) calc(var(--space) * 2),var(--sunpillar-1) calc(var(--space) * 3),var(--sunpillar-2) calc(var(--space) * 4),var(--sunpillar-3) calc(var(--space) * 5),var(--sunpillar-4) calc(var(--space) * 6),var(--sunpillar-5) calc(var(--space) * 7)),repeating-linear-gradient(var(--angle),#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%,0%,.1) 12%,hsla(0,0%,0%,.15) 20%,hsla(0,0%,0%,.25) 120%);background-position:0 var(--background-y),calc(var(--background-x) + (var(--background-y) * .2)) var(--background-y),var(--background-x) var(--background-y);background-blend-mode:hue,hard-light;background-size:200% 700%,300% 100%,200% 100%;filter:brightness(calc((var(--pointer-from-center) * .4) + .4)) contrast(1.4) saturate(2.25)}.holo-card__shine:before{z-index:1;background-image:radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),hsla(0,0%,100%,.7) 0,hsla(0,0%,0%,0) 25%);background-position:50%;background-size:cover;mix-blend-mode:overlay;opacity:calc(var(--card-opacity) * var(--holo-intensity) * .2)}.holo-card__shine:after,.holo-card__shine:before{content:"";position:absolute;inset:0;border-radius:inherit}.holo-card__shine:after{background-image:repeating-linear-gradient(0deg,var(--sunpillar-6) calc(var(--space) * 1),var(--sunpillar-1) calc(var(--space) * 2),var(--sunpillar-2) calc(var(--space) * 3),var(--sunpillar-3) calc(var(--space) * 4),var(--sunpillar-4) calc(var(--space) * 5),var(--sunpillar-5) calc(var(--space) * 6),var(--sunpillar-6) calc(var(--space) * 7)),repeating-linear-gradient(var(--angle),#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-position:0 var(--background-y),calc((var(--background-x) + (var(--background-y) * .2)) * -1) calc(var(--background-y) * -1);background-blend-mode:hue;background-size:200% 400%,195% 100%;filter:brightness(calc((var(--pointer-from-center) * .4) + .8)) contrast(1.5) saturate(1.25);mix-blend-mode:exclusion}.holo-card__glare{z-index:4;overflow:hidden;background-image:radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),hsl(0,0%,50%) 5%,hsl(200,5%,30%) 60%,hsl(320,40%,10%) 150%);background-size:120% 150%;background-position:50%;mix-blend-mode:hard-light;filter:brightness(1) contrast(1.2) saturate(1);opacity:calc(var(--card-opacity) * var(--holo-intensity) * .25)}.holo-card-aura,.holo-card-aura__sparkle{--aura-intensity:0.55;--sparkle-intensity:0.35;--sunpillar-1:hsl(2,100%,73%);--sunpillar-2:hsl(53,100%,69%);--sunpillar-3:hsl(93,100%,69%);--sunpillar-4:hsl(176,100%,76%);--sunpillar-5:hsl(228,100%,74%);--sunpillar-6:hsl(283,100%,73%)}.holo-card-aura{top:50%;left:50%;width:220%;height:0;padding-bottom:220%;margin-left:-110%;margin-top:-110%;border-radius:50%;background:conic-gradient(from 0deg,color-mix(in oklab,var(--aura-color,#dc2626) 60%,white) 0deg,var(--aura-color,#dc2626) 70deg,color-mix(in oklab,var(--aura-color,#dc2626) 55%,black) 130deg,var(--aura-color,#dc2626) 180deg,color-mix(in oklab,var(--aura-color,#dc2626) 60%,white) 230deg,var(--aura-color,#dc2626) 290deg,color-mix(in oklab,var(--aura-color,#dc2626) 55%,black) 340deg,color-mix(in oklab,var(--aura-color,#dc2626) 60%,white) 1turn);-webkit-mask:radial-gradient(circle,transparent 30%,black 42%,black 54%,transparent 64%);mask:radial-gradient(circle,transparent 30%,black 42%,black 54%,transparent 64%);filter:blur(14px) saturate(1.5) brightness(1.3);opacity:var(--aura-intensity);transform:perspective(900px) rotateX(75deg) rotate(0deg);transform-origin:center center;animation:holo-card-aura-orbit 12s linear infinite,holo-card-aura-flicker 1.4s ease-in-out infinite alternate}@keyframes holo-card-aura-orbit{0%{transform:perspective(900px) rotateX(75deg) rotate(0deg)}to{transform:perspective(900px) rotateX(75deg) rotate(1turn)}}@keyframes holo-card-aura-flicker{0%{opacity:calc(var(--aura-intensity) * .7)}to{opacity:calc(var(--aura-intensity) * 1.2)}}.holo-card-aura__sparkle{background-image:radial-gradient(circle at 12% 18%,white 0 .8px,transparent 1.2px),radial-gradient(circle at 78% 24%,white 0 .6px,transparent 1px),radial-gradient(circle at 32% 62%,white 0 .7px,transparent 1.1px),radial-gradient(circle at 88% 80%,white 0 .9px,transparent 1.3px),radial-gradient(circle at 54% 38%,white 0 .5px,transparent .9px),radial-gradient(circle at 20% 92%,white 0 .7px,transparent 1px),radial-gradient(circle at 68% 8%,white 0 .6px,transparent 1px);filter:drop-shadow(0 0 2px hsl(0 0% 100%/.9));opacity:var(--sparkle-intensity);animation:holo-card-sparkle-twinkle 4s ease-in-out infinite alternate}@keyframes holo-card-sparkle-twinkle{0%{opacity:calc(var(--sparkle-intensity) * .45)}to{opacity:var(--sparkle-intensity)}}@media (prefers-reduced-motion:reduce){.holo-card-aura,.holo-card-aura__sparkle{animation:none}}.holo-card-noise{position:absolute;inset:0;pointer-events:none;border-radius:inherit;background-image:url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.5 0 0 0 0 0.5 0 0 0 0 0.5 1 0 0 0 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:180px 180px;opacity:.18;mix-blend-mode:multiply;z-index:5}html.dark .holo-card-noise{mix-blend-mode:overlay;opacity:.22}