.card-flip{--pointer-x: 50%;--pointer-y: 50%;--background-x: 50%;--background-y: 50%;--card-opacity: 0;--pointer-from-left: .5;--pointer-from-top: .5;--pointer-from-center: 0;--cosmosbg: center center;--card-radius: .375rem;--holo-inset: 12px;--holo-radius: max(0px, calc(var(--card-radius) - var(--holo-inset)));--tilt-x: 0deg;--tilt-y: 0deg}.card-flip .card-flip-tilt{width:100%;height:100%;transform:rotateX(var(--tilt-x, 0deg)) rotateY(var(--tilt-y, 0deg));transform-style:preserve-3d;transition:transform .12s ease-out}.card-flip .card__shine,.card-flip .card__shine:before,.card-flip .card__shine:after,.card-flip .card__glare,.card-flip .card__glare:after{outline:1px solid transparent}.card-flip .card__shine,.card-flip .card__glare{position:absolute;inset:9% 6% 49%}.card-flip .card__shine{display:block;overflow:hidden;border-radius:var(--holo-radius);pointer-events:none;background:transparent;background-size:cover;background-position:center;filter:brightness(.85) contrast(2.75) saturate(.65);mix-blend-mode:color-dodge;opacity:var(--card-opacity);transition:opacity .2s ease}.card-flip .card__shine{--space: 4%;background-image:url(/holo/cosmos-bottom.png),repeating-linear-gradient(82deg,#dbcc57 calc(var(--space) * 1),#78c738 calc(var(--space) * 2),#39c0b7 calc(var(--space) * 3),#4964d0 calc(var(--space) * 4),#aa47d1 calc(var(--space) * 5),#cc388c calc(var(--space) * 6) calc(var(--space) * 7),#aa47d1 calc(var(--space) * 8),#4964d0 calc(var(--space) * 9),#39c0b7 calc(var(--space) * 10),#78c738 calc(var(--space) * 11),#dbcc57 calc(var(--space) * 12)),radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),hsla(180,100%,89%,.5) 5%,hsla(180,14%,57%,.3) 40%,hsl(0,0%,0%) 130%);background-blend-mode:color-burn,multiply;background-position:var(--cosmosbg),calc(10% + (var(--pointer-from-left) * 80%)) calc(10% + (var(--pointer-from-top) * 80%)),center center;background-size:cover,400% 900%,cover;filter:brightness(1) contrast(1) saturate(.8);mix-blend-mode:color-dodge}.card-flip .card__shine:before{content:"";z-index:2;position:absolute;inset:0;border-radius:var(--holo-radius);background-image:url(/holo/cosmos-middle-trans.png),repeating-linear-gradient(82deg,#dbcc57 calc(var(--space) * 1),#78c738 calc(var(--space) * 2),#39c0b7 calc(var(--space) * 3),#4964d0 calc(var(--space) * 4),#aa47d1 calc(var(--space) * 5),#cc388c calc(var(--space) * 6) calc(var(--space) * 7),#aa47d1 calc(var(--space) * 8),#4964d0 calc(var(--space) * 9),#39c0b7 calc(var(--space) * 10),#78c738 calc(var(--space) * 11),#dbcc57 calc(var(--space) * 12));background-blend-mode:lighten,multiply;background-position:var(--cosmosbg),calc(15% + (var(--pointer-from-left) * 70%)) calc(15% + (var(--pointer-from-top) * 70%)),center center;background-size:cover,400% 900%,cover;filter:brightness(1.25) contrast(1.75) saturate(.8);mix-blend-mode:overlay}.card-flip .card__shine:after{content:"";z-index:3;position:absolute;inset:0;border-radius:var(--holo-radius);background-image:url(/holo/cosmos-top-trans.png),repeating-linear-gradient(82deg,#dbcc57 calc(var(--space) * 1),#78c738 calc(var(--space) * 2),#39c0b7 calc(var(--space) * 3),#4964d0 calc(var(--space) * 4),#aa47d1 calc(var(--space) * 5),#cc388c calc(var(--space) * 6) calc(var(--space) * 7),#aa47d1 calc(var(--space) * 8),#4964d0 calc(var(--space) * 9),#39c0b7 calc(var(--space) * 10),#78c738 calc(var(--space) * 11),#dbcc57 calc(var(--space) * 12));background-blend-mode:multiply,multiply;background-position:var(--cosmosbg),calc(20% + (var(--pointer-from-left) * 60%)) calc(20% + (var(--pointer-from-top) * 60%)),center center;background-size:cover,400% 900%,cover;filter:brightness(1.25) contrast(1.75) saturate(.8);mix-blend-mode:multiply}.card-flip .card__glare{display:block;overflow:hidden;border-radius:var(--holo-radius);pointer-events:none;transition:opacity .2s ease;background-image:radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),hsla(204,100%,95%,.8) 5%,hsla(250,15%,20%,1) 150%);filter:brightness(.75) contrast(2) saturate(2);mix-blend-mode:overlay;opacity:calc(var(--card-opacity) * (.25 + var(--pointer-from-center)))}.card-flip .card__glare:after{content:"";position:absolute;inset:0;border-radius:var(--holo-radius);background-image:radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),hsl(280,100%,96%) 5%,hsl(0,0%,10%) 60%);filter:brightness(.75) contrast(2.5) saturate(2);mix-blend-mode:soft-light;opacity:calc(1 - var(--pointer-from-top) * .75)}@media (max-width: 639px){.card-flip .card__shine{opacity:calc(var(--card-opacity) * .8)}.card-flip .card__shine:before{filter:brightness(1.17) contrast(1.64) saturate(.78)}.card-flip .card__shine:after{filter:brightness(1.17) contrast(1.64) saturate(.78)}.card-flip .card__glare{opacity:calc(var(--card-opacity) * (.25 + var(--pointer-from-center)) * .8)}.card-flip .card__glare:after{opacity:calc((1 - var(--pointer-from-top) * .75) * .8);filter:brightness(.71) contrast(2.35) saturate(1.88)}}@supports (-webkit-touch-callout: none){.card-flip .card__glare{background-image:radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),hsla(204,100%,95%,.72) 0%,hsla(208,85%,82%,.45) 12%,hsla(220,45%,52%,.28) 28%,hsla(250,28%,32%,.72) 52%,hsla(250,18%,22%,.95) 78%,hsla(250,15%,20%,1) 100%)}.card-flip .card__glare:after{background-image:radial-gradient(farthest-corner circle at var(--pointer-x) var(--pointer-y),hsl(280,100%,96%) 0%,hsl(280,72%,72%) 14%,hsl(280,45%,42%) 32%,hsl(280,22%,24%) 52%,hsl(0,0%,14%) 72%,hsl(0,0%,10%) 100%)}.card-flip .card__shine{filter:brightness(.98) contrast(.93) saturate(.76)}.card-flip .card__shine:before,.card-flip .card__shine:after{filter:brightness(1.12) contrast(1.45) saturate(.75)}}
