body{color:#1a1a1a;background:#f6f5f3;margin:0;font-family:system-ui,sans-serif}.app{box-sizing:border-box;justify-content:center;align-items:center;min-height:100vh;padding:24px 16px;display:flex}.panel{flex-direction:column;gap:16px;width:min(100%,28rem);display:flex}.player{flex-direction:column;gap:16px;display:flex}.title{margin:0;font-size:1.5rem;line-height:1.3}.transport{align-items:center;gap:12px;display:flex}.time{font-variant-numeric:tabular-nums}input[type=range]{width:100%;margin:0}button{font:inherit;color:inherit;cursor:pointer;background:#fff;border:1px solid #c4c0b8;border-radius:6px;padding:.55rem .9rem}button.secondary{color:#5c5852;background:0 0}button:disabled{opacity:.6;cursor:default}.loading{align-items:center;gap:12px;display:flex}.spinner{border:2px solid #d9d5ce;border-top-color:#1a1a1a;border-radius:50%;width:1.25rem;height:1.25rem;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.status,.message{margin:0}.status.error,.message{color:#8a1f1f}