.cube-vis{aspect-ratio:1;border-radius:var(--td-radius);border:1px solid var(--td-border);isolation:isolate;--cv-bass:0;--cv-bass-synth:0;--cv-bass-synth-pitch:.5;--cv-mid:0;--cv-energy:0;--cv-rot:0deg;--cv-c1:#1a1a26;--cv-c2:#2a1e3a;--cv-c3:#0a0f1c;--cv-unfold:0;background:#050508;width:100%;transition:--cv-unfold .8s cubic-bezier(.22,1,.36,1);position:relative;overflow:hidden}.cube-vis.is-playing{--cv-unfold:1}@property --cv-unfold{syntax:"<number>";inherits:true;initial-value:0}.cube-vis__flat{object-fit:cover;z-index:4;width:100%;height:100%;opacity:calc(1 - var(--cv-unfold));pointer-events:none;display:block;position:absolute;inset:0}.cube-vis__ambient{z-index:0;background:radial-gradient(ellipse calc(60% + var(--cv-bass) * 30%) calc(50% + var(--cv-bass) * 20%) at calc(30% + var(--cv-ax,0%) * 1) calc(35% + var(--cv-ay,0%) * 1), var(--cv-c1) 0%, transparent 65%), radial-gradient(ellipse calc(55% + var(--cv-mid) * 25%) calc(55% + var(--cv-mid) * 25%) at calc(70% - var(--cv-ax,0%) * .8) calc(60% - var(--cv-ay,0%) * .8), var(--cv-c2) 0%, transparent 60%), radial-gradient(ellipse 80% 80% at 50% 80%, var(--cv-c3) 0%, transparent 70%), #050508;filter:saturate(calc(1.1 + var(--cv-bass-synth) * 5.5 * (.3 + .7 * var(--cv-bass-synth-pitch)))) brightness(calc(1 + var(--cv-bass-synth) * 1.8 * (.3 + .7 * var(--cv-bass-synth-pitch)))) blur(8px);transform:scale(calc(1 + var(--cv-bass) * .05 + var(--cv-bass-synth) * .35));will-change:transform, background-position;opacity:var(--cv-unfold);transition:filter .4s ease-out;position:absolute;inset:-10%}.cube-vis.is-playing .cube-vis__ambient{animation:24s ease-in-out infinite alternate cube-vis-ambient-drift}@keyframes cube-vis-ambient-drift{0%{--cv-ax:0%;--cv-ay:0%}25%{--cv-ax:12%;--cv-ay:-8%}50%{--cv-ax:-6%;--cv-ay:10%}75%{--cv-ax:-14%;--cv-ay:-6%}to{--cv-ax:8%;--cv-ay:12%}}@property --cv-ax{syntax:"<percentage>";inherits:true;initial-value:0%}@property --cv-ay{syntax:"<percentage>";inherits:true;initial-value:0%}.cube-vis__glow{z-index:1;background:radial-gradient(circle at 50% 50%, color-mix(in oklab, var(--cv-c2) 70%, white) 0%, color-mix(in oklab, var(--cv-c1) 60%, transparent) 30%, transparent 60%);opacity:calc((.35 + var(--cv-energy) * .45 + var(--cv-bass-synth) * 1.6 * (.3 + .7 * var(--cv-bass-synth-pitch)) ) * var(--cv-unfold));transform:scale(calc(.95 + var(--cv-bass) * .18 + var(--cv-bass-synth) * .55 * (.3 + .7 * var(--cv-bass-synth-pitch))));filter:blur(20px);pointer-events:none;border-radius:50%;position:absolute;inset:10%}.cube-vis__stage{z-index:2;perspective:1400px;perspective-origin:50%;pointer-events:none;opacity:var(--cv-unfold);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.cube-vis__box-outer{width:100%;height:100%;position:relative}.cube-vis__box{--cv-half-z:0px;width:100%;height:100%;position:relative}.cube-vis__face{border:1px solid color-mix(in oklab, var(--cv-c2) 30%, #ffffff0f);box-shadow:inset 0 0 0 1px #ffffff0a, 0 0 calc(20px + var(--cv-bass) * 40px) color-mix(in oklab, var(--cv-c2) 60%, transparent);backface-visibility:hidden;background:#0a0a14;position:absolute;inset:0;overflow:hidden}.cube-vis__face-img{object-fit:cover;width:100%;height:100%;display:block;position:absolute;inset:0}.cube-vis__face--front{transform:translateZ(var(--cv-half-z))}.cube-vis__face--back{transform:rotateY(180deg) translateZ(var(--cv-half-z))}.cube-vis__face--right{transform:rotateY(90deg) translateZ(var(--cv-half-z))}.cube-vis__face--left{transform:rotateY(-90deg) translateZ(var(--cv-half-z))}.cube-vis__face--top{transform:rotateX(90deg) translateZ(var(--cv-half-z))}.cube-vis__face--bottom{transform:rotateX(-90deg) translateZ(var(--cv-half-z))}.cube-vis__face--right .cube-vis__face-img,.cube-vis__face--left .cube-vis__face-img,.cube-vis__face--back .cube-vis__face-img{filter:brightness(.65)saturate(.85)}.cube-vis__face--top .cube-vis__face-img,.cube-vis__face--bottom .cube-vis__face-img{filter:brightness(.4)saturate(.7)}.cube-vis__eq{z-index:3;pointer-events:none;width:92%;height:68%;opacity:calc(.71 * var(--cv-unfold));mix-blend-mode:screen;display:block;position:absolute;top:50%;left:4%;transform:translateY(-50%)}.cube-vis__eq-bar{fill:color-mix(in oklab, var(--cv-c2) 60%, white);transform-box:fill-box;transform-origin:50%}.cube-vis__eq-bar--reflect{fill:color-mix(in oklab, var(--cv-c1) 50%, white);opacity:.55}.cube-vis__eq-axis{stroke:#ffffff24;stroke-width:.5px;shape-rendering:crispedges}.cube-vis:not(.is-playing) .cube-vis__eq-bar{transition:transform .6s ease-out;transform:scaleY(.04)}.cube-vis__fs-toggle{z-index:10;color:#ffffffc7;cursor:pointer;-webkit-backdrop-filter:blur(6px);width:32px;height:32px;opacity:var(--cv-unfold,1);background:#00000073;border:1px solid #ffffff26;border-radius:6px;justify-content:center;align-items:center;padding:0;transition:background .16s ease-out,color .16s ease-out,border-color .16s ease-out;display:inline-flex;position:absolute;top:10px;right:10px}.cube-vis__fs-toggle:hover,.cube-vis__fs-toggle:focus-visible{color:#fff;background:#000000b3;border-color:#fff6;outline:none}.cube-vis__fs-toggle svg{width:16px;height:16px}.cube-vis:fullscreen{width:100vw;height:100vh;aspect-ratio:unset;background:#050508;border:none;border-radius:0;place-items:center;display:grid}.cube-vis:fullscreen::backdrop{background:#050508}.cube-vis:fullscreen .cube-vis__flat,.cube-vis:fullscreen .cube-vis__stage{grid-area:1/1;width:min(100vw,100vh);height:min(100vw,100vh);position:relative;inset:auto}.cube-vis:fullscreen .cube-vis__ambient,.cube-vis:fullscreen .cube-vis__glow,.cube-vis:fullscreen .cube-vis__backdrop{grid-area:unset;width:auto;height:auto;position:absolute;inset:0}.cube-vis:fullscreen .cube-vis__fs-toggle{width:44px;height:44px;top:max(16px, env(safe-area-inset-top));right:max(16px, env(safe-area-inset-right))}.cube-vis:fullscreen .cube-vis__fs-toggle svg{width:22px;height:22px}