.cyst{--cyst-rgb: linear-gradient(90deg, #FF0000, #FF7A00 30%, #FF2BD6 62%, #7B5CFF 85%, #2BB8FF);padding-block:var(--cyst-pt, 96px) var(--cyst-pb, 96px);background:rgb(var(--color-background));color:var(--cys-fg, rgb(var(--color-foreground)))}.cyst__head{max-inline-size:72rem;margin-inline:auto}.cyst__grid{display:grid;grid-template-columns:repeat(var(--n, 4),minmax(0,1fr));gap:1.6rem;margin-block-start:3.2rem}.cyst__card{position:relative;display:flex;flex-direction:column;gap:1.6rem;min-inline-size:0;padding:1.8rem;border-radius:var(--cy-radius-m, 12px);background:rgb(var(--color-foreground) / .04);box-shadow:inset 0 0 0 1px rgb(var(--color-foreground) / .1);transition:background .4s ease;isolation:isolate}.cyst__card:before,.cyst__card:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;background:var(--cyst-rgb);opacity:0;transition:opacity .4s ease;pointer-events:none}.cyst__card:before{padding:1px;-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}.cyst__card:after{z-index:-1;top:8%;right:8%;bottom:8%;left:8%;filter:blur(2.8rem)}.cyst__card.is-playing{background:rgb(var(--color-foreground) / .06)}.cyst__card.is-playing:before{opacity:1}.cyst__card.is-playing:after{opacity:calc(.18 + var(--lvl, 0) * .5);transition:none}.cyst__top{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:1.2rem}.cyst__play{display:grid;place-items:center;inline-size:4.4rem;block-size:4.4rem;padding:0;border:0;border-radius:var(--cy-radius-s, 8px);background:var(--cy-tint, #EB0201);color:#fff;cursor:pointer;transition:background var(--cy-dur-state, .2s) ease,transform var(--cy-dur-state, .2s) ease}.cyst__play:hover{background:var(--cy-tint-hover, #C80100)}.cyst__play:active{transform:scale(.96)}.cyst__play:focus-visible,.cyst__viz:focus-visible{outline:2px solid var(--cy-focus, #EB0201);outline-offset:3px}.cyst__play svg{inline-size:2rem;block-size:2rem}.cyst__i-pause,.cyst__card.is-playing .cyst__i-play{display:none}.cyst__card.is-playing .cyst__i-pause{display:block}.cyst__meta{min-inline-size:0}.cyst__name{margin:0;font-size:1.8rem;font-weight:700;line-height:1.2}.cyst__note{margin:.3rem 0 0;font-size:1.3rem;line-height:1.35;opacity:.65}.cyst__time{margin:0;font-size:1.3rem;font-variant-numeric:tabular-nums;opacity:.65;white-space:nowrap}.cyst__sep{margin-inline:.3rem;opacity:.6}.cyst__viz{position:relative;block-size:9.6rem;cursor:pointer;touch-action:pan-y;border-radius:var(--cy-radius-s, 8px)}.cyst__viz canvas{display:block;inline-size:100%;block-size:100%}.cyst__fine{max-inline-size:62rem;margin:2.4rem auto 0;text-align:center;font-size:1.3rem;opacity:.65}.cyst__fine p{margin:0}.cyst__empty{text-align:center;opacity:.6}@media(max-width:1149px){.cyst__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:767px){.cyst{padding-block:calc(var(--cyst-pt, 96px) * .6) calc(var(--cyst-pb, 96px) * .6)}.cyst__grid{grid-template-columns:minmax(0,1fr);gap:1.2rem;margin-block-start:2.4rem}.cyst__card{padding:1.4rem;gap:1.2rem}.cyst__viz{block-size:7.2rem}.cyst__name{font-size:1.7rem}}@media(prefers-reduced-motion:reduce){.cyst__card,.cyst__card:before,.cyst__card:after,.cyst__play{transition:none}.cyst__card.is-playing:after{opacity:.2}}.cyst{position:relative;overflow:hidden;isolation:isolate}.cyst>.hdt-container{position:relative;z-index:1}.cyst__scene{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none}.cyst__grid-bg{position:absolute;top:0;right:0;bottom:0;left:0;opacity:.5;background-image:linear-gradient(rgb(var(--color-foreground) / .07) 1px,transparent 1px),linear-gradient(90deg,rgb(var(--color-foreground) / .07) 1px,transparent 1px);background-size:5.6rem 5.6rem;background-position:center top;-webkit-mask-image:radial-gradient(ellipse 70% 65% at 50% 55%,#000 25%,transparent 75%);mask-image:radial-gradient(ellipse 70% 65% at 50% 55%,#000 25%,transparent 75%)}.cyst__glow{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(ellipse 55% 38% at 50% 108%,rgb(255 43 214 / .26),transparent 70%),radial-gradient(ellipse 40% 30% at 22% 104%,rgb(255 60 0 / .22),transparent 70%),radial-gradient(ellipse 40% 30% at 80% 104%,rgb(43 120 255 / .22),transparent 70%),radial-gradient(ellipse 35% 45% at 0% 0%,rgb(255 0 0 / .14),transparent 70%),radial-gradient(ellipse 35% 45% at 100% 0%,rgb(123 92 255 / .14),transparent 70%)}.cyst__wavebar{position:relative;block-size:14rem;margin-block:1.2rem .4rem;margin-inline:calc(50% - 50vw);inline-size:100vw;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}.cyst__amb{display:block;inline-size:100%;block-size:100%;opacity:.9;mix-blend-mode:screen}.cyst__card{background:rgb(var(--color-background) / .55);-webkit-backdrop-filter:blur(1.2rem);backdrop-filter:blur(1.2rem)}.cyst__card.is-playing{background:rgb(var(--color-background) / .45)}@media(max-width:767px){.cyst__grid-bg{background-size:4rem 4rem}.cyst__wavebar{block-size:9.6rem;margin-block:.4rem 0}.cyst__card{padding:1.2rem 1.2rem 1rem;gap:.8rem}.cyst__top{grid-template-columns:auto minmax(0,1fr);gap:1rem}.cyst__time{grid-column:2;grid-row:2;justify-self:start;font-size:1.2rem}.cyst__play{inline-size:4.4rem;block-size:4.4rem;grid-row:1 / span 2}.cyst__viz{block-size:5.6rem}.cyst__name{font-size:1.6rem}.cyst__note{font-size:1.2rem}}.cyst__card:before{padding:1.5px;background:conic-gradient(from var(--cys-spin, 0deg),transparent 0deg 170deg,#FF0000 215deg,#FF7A00 250deg,#FF2BD6 290deg,#7B5CFF 325deg,#2BB8FF 350deg,transparent 360deg)}.cyst__card.is-playing:before{animation:cysSpin 1.8s linear infinite}@media(prefers-reduced-motion:reduce){.cyst__card:before{background:var(--cyst-rgb)}.cyst__card.is-playing:before{animation:none}}
/*# sourceMappingURL=/cdn/shop/t/53/assets/cy-sound-test.css.map */