.preview-transport{margin-top:16px;color:var(--text-2,var(--muted));font-size:14px}
.preview-comparison{display:flex;gap:8px}
.preview-comparison button{min-height:44px;min-width:44px;background:transparent;border:1px solid var(--border);color:var(--text-2,var(--muted));padding:8px 14px}
.preview-comparison button[aria-pressed="true"]{background:var(--surface-raised,#29312b);border-color:var(--text-3,#7a877b);color:var(--text)}
.preview-timeline{display:flex;align-items:center;gap:12px;margin-top:6px}
.preview-timeline input{display:block;min-width:44px;min-height:44px;flex:1;width:100%;margin:0;accent-color:var(--text);cursor:pointer}
.preview-timeline output{font:12px var(--mono,monospace);white-space:nowrap;color:var(--text-2,var(--muted));font-variant-numeric:tabular-nums}
.preview-help{margin:2px 0 0;font-size:12px;line-height:1.5;color:var(--text-2,var(--muted))}
.preview-playhead{position:absolute;width:2px;background:var(--text,#edf2e8);box-shadow:0 0 0 1px #10151390;pointer-events:none;z-index:2}
.preview-playhead::before{content:"";position:absolute;top:0;left:-3px;width:8px;height:6px;background:inherit;border-radius:0 0 3px 3px}
#listen{min-height:44px;min-width:44px}
@media(max-width:640px){.preview-timeline{gap:8px}.preview-comparison button{flex:1}.preview-transport{margin-top:12px}.preview-help{font-size:12px}}