.holo-prism{--hp-s:260px;--hp-d:120px;--hp-h:calc(var(--hp-s) * .866025);--hp-r:calc(var(--hp-s) * .288675);width:var(--hp-s);height:var(--hp-s);perspective:1400px;filter:drop-shadow(0 30px 40px #0b122040);animation:6s ease-in-out infinite hp-float;position:relative}.holo-prism.is-paused,.holo-prism.is-paused *,.holo-prism.is-paused .hp-glass:after{animation-play-state:paused}.holo-prism .hp-spin{transform-style:preserve-3d;animation:14s linear infinite hp-spin;position:absolute;inset:0}.holo-prism.is-burst .hp-spin{animation-duration:2.4s}.holo-prism .hp-face{transform-style:preserve-3d;backface-visibility:visible;position:absolute;top:50%;left:50%}.holo-prism .hp-cap{width:var(--hp-s);height:var(--hp-h);margin:calc(var(--hp-h) * -.5) 0 0 calc(var(--hp-s) * -.5);clip-path:polygon(50% 0,100% 100%,0 100%)}.holo-prism .hp-cap.hp-front{transform:translateY(calc(var(--hp-h) * -.166667)) translateZ(calc(var(--hp-d) * .5))}.holo-prism .hp-cap.hp-back{transform:translateY(calc(var(--hp-h) * -.166667)) translateZ(calc(var(--hp-d) * -.5)) rotateY(180deg);filter:brightness(.85)}.holo-prism .hp-side{width:var(--hp-s);height:var(--hp-d);margin:calc(var(--hp-d) * -.5) 0 0 calc(var(--hp-s) * -.5)}.holo-prism .hp-side.hp-s0{transform:rotateZ(0deg) translateY(var(--hp-r)) rotateX(-90deg)}.holo-prism .hp-side.hp-s1{transform:rotateZ(120deg) translateY(var(--hp-r)) rotateX(-90deg)}.holo-prism .hp-side.hp-s2{transform:rotateZ(240deg) translateY(var(--hp-r)) rotateX(-90deg)}.holo-prism .hp-glass{background-blend-mode:screen,normal;background:linear-gradient(115deg,#ffffff47 0%,#ffffff0f 30%,#fff0 50%),#0b1220e6;overflow:hidden;box-shadow:inset 0 0 0 1.5px #ffffff59}.holo-prism .hp-glass:after{content:"";mix-blend-mode:screen;pointer-events:none;background:linear-gradient(100deg,#0000 40%,#ffffff59 50%,#0000 60%);animation:3.6s ease-in-out infinite hp-sheen;position:absolute;inset:-40%}.holo-prism .hp-side.hp-glass{background-blend-mode:screen,normal;background:linear-gradient(115deg,#ffffff47 0%,#ffffff0f 30%,#fff0 50%),#0b1220e6}.holo-prism .hp-mark{place-items:center;display:grid;position:absolute;inset:0}.holo-prism .hp-mark svg{width:78%;height:auto;margin-top:22%}.holo-prism .hp-trigger{cursor:pointer;background:0 0;border:0;border-radius:9999px;padding:0;position:absolute;inset:0}.holo-prism .hp-trigger:focus-visible{outline-offset:8px;outline:2px solid #2451e6}@keyframes hp-spin{0%{transform:rotateX(-8deg)rotateY(0)}to{transform:rotateX(-8deg)rotateY(360deg)}}@keyframes hp-float{0%,to{transform:translateY(-10px)}50%{transform:translateY(12px)}}@keyframes hp-sheen{0%{transform:translate(-60%)}60%,to{transform:translate(60%)}}@media (width<=640px){.holo-prism{--hp-s:200px;--hp-d:92px}}@media (prefers-reduced-motion:reduce){.holo-prism,.holo-prism .hp-spin,.holo-prism .hp-glass:after{animation:none!important}.holo-prism .hp-spin{transform:rotateX(-8deg)rotateY(24deg)}}.holo-prism.holo-prism--sm{--hp-s:54px;--hp-d:26px;filter:drop-shadow(0 6px 10px #0b122040);animation:5s ease-in-out infinite hp-float-sm}.holo-prism.holo-prism--sm .hp-glass{box-shadow:inset 0 0 0 1px #fff9}.holo-prism.holo-prism--sm .hp-mark svg{width:80%;margin-top:24%}.holo-prism.holo-prism--sm .hp-mark svg polyline{stroke-width:9px}.holo-prism.holo-prism--sm .hp-trigger{border-radius:8px}@keyframes hp-float-sm{0%,to{transform:translateY(-1.5px)}50%{transform:translateY(1.5px)}}@media (width<=640px){.holo-prism.holo-prism--sm{--hp-s:40px;--hp-d:18px}}
