:root{color-scheme:light dark;--fg:#1c1e21;--bg:#f5f6f8;--card:#ffffff;--muted:#5b6470;--accent:#0a6b5c;--accent-contrast:#ffffff;--danger:#a4342a;--focus:#1b6ef3}@media (prefers-color-scheme:dark){:root{--fg:#e8eaed;--bg:#16181c;--card:#22252b;--muted:#a2abb6;--accent:#3ecfae;--accent-contrast:#08251f;--danger:#ff8a7a;--focus:#6ea8ff}}*{box-sizing:border-box}body,html{margin:0;padding:0}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;color:var(--fg);background:var(--bg);line-height:1.6}.page{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px 16px}.player-card,.status-card{width:100%;max-width:420px;background:var(--card);border-radius:16px;padding:28px 24px;box-shadow:0 8px 28px rgba(0,0,0,.08);text-align:center}h1{font-size:1.35rem;margin:0 0 8px;overflow-wrap:anywhere}.hint{color:var(--muted);font-size:.95rem;margin:8px 0 0}.status-icon{font-size:2.4rem;margin:0 0 8px}.cover{width:160px;height:160px;border-radius:12px;object-fit:cover;margin:0 auto 12px;display:block}.cover-placeholder{display:flex;align-items:center;justify-content:center;background:color-mix(in srgb,var(--accent) 14%,var(--card));font-size:3rem}.title{margin-bottom:16px}.controls{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.button{min-width:44px;min-height:44px;padding:10px 20px;font-size:1.05rem;font-family:inherit;border-radius:10px;border:1px solid color-mix(in srgb,var(--fg) 25%,transparent);background:var(--card);color:var(--fg);cursor:pointer}.button-primary{background:var(--accent);border-color:var(--accent);color:var(--accent-contrast);min-width:120px}.button:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.button:active{transform:translateY(1px)}.time{color:var(--muted);font-feature-settings:"tnum";font-variant-numeric:tabular-nums;margin:14px 0 0}.play-error{color:var(--danger);font-weight:600;margin:10px 0 0}.sr-status{margin:10px 0 0;font-size:.9rem;color:var(--muted)}.skeleton{border-radius:8px;background:color-mix(in srgb,var(--fg) 10%,var(--card));margin:0 auto 12px;animation:pulse 1.4s ease-in-out infinite}.skeleton-title{width:60%;height:28px}.skeleton-line{width:40%;height:18px}@keyframes pulse{0%,to{opacity:1}50%{opacity:.45}}@media (prefers-reduced-motion:reduce){.skeleton{animation:none}.button:active{transform:none}}