.wv-list{--wv-a:#d73e89;--wv-b:#ff8336;gap:10px;display:grid}.wv{--p:0;border:1px solid var(--line,#f1f1f114);background:linear-gradient(#f1f1f106,#f1f1f103);border-radius:14px;grid-template-columns:44px minmax(0,1fr);align-items:center;gap:14px;padding:14px 16px 12px 14px;transition:border-color .2s,background-color .2s;display:grid}.wv.is-active{border-color:color-mix(in srgb, var(--wv-a) 32%, transparent);background:linear-gradient(180deg, color-mix(in srgb, var(--wv-a) 7%, transparent), #f1f1f103)}.wv__play{background:var(--paper,#f1f1f1);color:#0a0b17;cursor:pointer;width:44px;height:44px;transition:transform .16s var(--ease-out,ease), box-shadow .2s ease;border:0;border-radius:50%;place-items:center;padding:0;display:grid}.wv__play svg{width:17px;height:17px}.wv__play-icon{transform:translate(1px)}.wv__play:hover{transform:scale(1.06)}.wv__play:active{transform:scale(.96)}.wv__play:focus-visible{outline-offset:3px;outline:2px solid #ff9fca}.wv.is-active .wv__play{background:linear-gradient(135deg, var(--wv-a), var(--wv-b));color:#fff;box-shadow:0 8px 24px -10px color-mix(in srgb, var(--wv-a) 80%, transparent)}.wv__spin{border:2px solid;border-right-color:#0000;border-radius:50%;width:16px;height:16px;animation:.7s linear infinite wv-spin}@keyframes wv-spin{to{transform:rotate(1turn)}}.wv__body{gap:8px;min-width:0;display:grid}.wv__head{min-width:0;font-family:var(--font-interface), sans-serif;align-items:center;gap:10px;display:flex}.wv__index{letter-spacing:.08em;color:var(--text-3,#f1f1f17a);font-variant-numeric:tabular-nums;font-size:.7rem;font-weight:600}.wv__title{min-width:0;color:var(--paper,#f1f1f1);text-overflow:ellipsis;white-space:nowrap;flex:1;font-size:.9rem;font-weight:600;overflow:hidden}.wv__time{color:var(--text-3,#f1f1f17a);font-variant-numeric:tabular-nums;white-space:nowrap;margin-left:auto;font-size:.74rem}.wv.is-active .wv__now{color:var(--paper,#f1f1f1)}.wv__actions{gap:2px;display:inline-flex}.wv__wave{--hx:0;cursor:pointer;touch-action:none;border-radius:4px;height:46px;position:relative}.wv__wave:focus-visible{outline-offset:4px;outline:2px solid #ff9fca}.wv__layer{grid-template-rows:68% 32%;display:grid;position:absolute;inset:0}.wv__layer--played{clip-path:inset(0 calc((1 - var(--p)) * 100%) 0 0)}.wv__half{gap:2px;min-height:0;display:flex}.wv__half--top{align-items:flex-end;padding-bottom:1px}.wv__half--bottom{opacity:.38;align-items:flex-start}.wv__half i{min-width:1px;max-width:3px;height:var(--h);background:#f1f1f138;border-radius:1.5px;flex:1 1 0;transition:background-color .2s}.wv__half--top i{min-height:2px}.wv__layer--played .wv__half i{background:color-mix(in oklab, var(--wv-b) calc(var(--t) * 100%), var(--wv-a))}.wv:hover .wv__layer:not(.wv__layer--played) .wv__half i{background:#f1f1f14d}.wv__wave:after{content:attr(data-hint);top:-4px;left:calc(var(--hx) * 100%);color:var(--paper,#f1f1f1);font:600 .66rem var(--font-interface), sans-serif;font-variant-numeric:tabular-nums;opacity:0;pointer-events:none;background:#0a0b17;border:1px solid #f1f1f124;border-radius:5px;padding:2px 6px;transition:opacity .12s;position:absolute;transform:translate(-50%,-100%)}.wv__wave:before{content:"";top:0;bottom:32%;left:calc(var(--hx) * 100%);opacity:0;pointer-events:none;background:#f1f1f18c;width:1px;transition:opacity .12s;position:absolute}@media (hover:hover){.wv__wave:hover:after,.wv__wave:hover:before{opacity:1}}.wv__wave:not([data-hint]):after{display:none}@media (max-width:560px){.wv{grid-template-columns:38px minmax(0,1fr);gap:12px;padding:12px}.wv__play{width:38px;height:38px}.wv__wave{height:40px}}@media (prefers-reduced-motion:reduce){.wv__play,.wv__half i{transition:none}.wv__spin{animation-duration:1.6s}}@media (forced-colors:active){.wv__half i{background:canvastext}.wv__layer--played .wv__half i{background:highlight}}