.container.s-vuon27{background:radial-gradient(circle at 50% 20%, hsla(var(--system-color-dark-hsl), .05), transparent 60%), var(--system-color-light);width:100%;height:100%;color:var(--system-color-light-contrast);border-radius:inherit;font-family:var(--system-font-family);grid-template-rows:2.5rem 1fr auto auto auto auto auto;justify-items:center;gap:.5rem;padding-bottom:1.2rem;display:grid;overflow:hidden}.titlebar.s-vuon27{opacity:.7;justify-content:center;align-self:stretch;align-items:center;font-size:.85rem;font-weight:600;display:flex}.art-wrap.s-vuon27{place-items:center;padding:.5rem;display:grid}.art.s-vuon27{border-radius:50%;width:9rem;height:9rem;position:relative;box-shadow:0 12px 30px #0000004d}.art.spinning.s-vuon27{animation:6s linear infinite s-vuon27-spin}.art-hole.s-vuon27{background:var(--system-color-light);border-radius:50%;width:2rem;height:2rem;position:absolute;inset:calc(50% - 1rem);box-shadow:inset 0 0 0 3px #00000026}.visualizer.s-vuon27{align-items:flex-end;gap:2px;width:80%;height:3rem;display:flex}.bar.s-vuon27{background:var(--accent);border-radius:2px;flex:1;min-height:3px;transition:height 90ms ease-out}.info.s-vuon27{text-align:center}.info.s-vuon27 h1:where(.s-vuon27){font-size:1.15rem;font-weight:700}.info.s-vuon27 p:where(.s-vuon27){opacity:.55;font-size:.85rem}.time.s-vuon27{opacity:.5;font-variant-numeric:tabular-nums;font-size:.8rem}.controls.s-vuon27{align-items:center;gap:1rem;display:flex}.controls.s-vuon27 button:where(.s-vuon27){color:inherit;place-items:center;transition:transform .12s;display:grid}.controls.s-vuon27 button:where(.s-vuon27):active{transform:scale(.9)}.controls.s-vuon27 button:where(.s-vuon27) svg{font-size:1.8rem}.controls.s-vuon27 .play:where(.s-vuon27){background:var(--accent);color:#fff;border-radius:50%;width:3.2rem;height:3.2rem;box-shadow:0 6px 16px #00000040}.controls.s-vuon27 .play:where(.s-vuon27) svg{font-size:2rem}.volume.s-vuon27{align-items:center;gap:.5rem;width:70%;display:flex}.volume.s-vuon27 svg{opacity:.6;font-size:1.1rem}.volume.s-vuon27 input:where(.s-vuon27){accent-color:var(--accent);flex:1}@keyframes s-vuon27-spin{to{transform:rotate(360deg)}}