.clip.svelte-1ejtv0b{display:flex;align-items:center;gap:14px;width:100%;max-width:520px;margin:0 auto;padding:10px 14px;border-radius:999px;background:linear-gradient(180deg,#ffffff0d,#00000059);border:1px solid var(--hd-line)}.clip.compact.svelte-1ejtv0b{max-width:240px;gap:10px;padding:6px 12px 6px 6px}.play.svelte-1ejtv0b{flex:none;width:52px;height:52px;display:grid;place-items:center;border-radius:50%;color:#0b0b10;background:radial-gradient(circle at 35% 30%,#fff,var(--hd-accent) 70%);box-shadow:0 0 18px color-mix(in srgb,var(--hd-accent) 45%,transparent);transition:transform .15s ease,box-shadow .2s ease}.compact.svelte-1ejtv0b .play:where(.svelte-1ejtv0b){width:36px;height:36px}.play.svelte-1ejtv0b:hover:not(:disabled){transform:scale(1.06)}.play.svelte-1ejtv0b:disabled{filter:grayscale(1) brightness(.5);cursor:not-allowed}.play.svelte-1ejtv0b svg:where(.svelte-1ejtv0b){width:46%;height:46%}.playing.svelte-1ejtv0b .play:where(.svelte-1ejtv0b){box-shadow:0 0 26px color-mix(in srgb,var(--hd-accent) 70%,transparent)}.body.svelte-1ejtv0b{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}.label.svelte-1ejtv0b{font-family:var(--hd-font-title);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--hd-text-dim)}.bar.svelte-1ejtv0b{position:relative;height:8px;border-radius:999px;background:#ffffff14;overflow:hidden}.unlocked.svelte-1ejtv0b,.played.svelte-1ejtv0b{position:absolute;inset:0 auto 0 0;border-radius:999px}.unlocked.svelte-1ejtv0b{background:color-mix(in srgb,var(--hd-accent) 45%,rgba(255,255,255,.1))}.played.svelte-1ejtv0b{background:var(--hd-accent)}.mark.svelte-1ejtv0b{position:absolute;top:0;bottom:0;width:2px;margin-left:-1px;background:#0009}.mark.open.svelte-1ejtv0b{background:#ffffff59}.times.svelte-1ejtv0b{display:flex;justify-content:space-between;font-size:13px;color:var(--hd-text-dim);font-variant-numeric:tabular-nums}.volume.svelte-1ejtv0b{flex:none;display:flex;align-items:center;gap:6px;color:var(--hd-text-dim)}.volume.svelte-1ejtv0b svg:where(.svelte-1ejtv0b){width:20px;height:20px}.volume.svelte-1ejtv0b input:where(.svelte-1ejtv0b){width:70px;accent-color:var(--hd-accent)}@media (max-width: 640px){.volume.svelte-1ejtv0b input:where(.svelte-1ejtv0b){width:52px}}