:root{color-scheme:dark;--bg: #0b0d12;--panel: #141820;--text: #e8ecf4;--muted: #8b93a7;--accent: #5b8cff;--ok: #22c870;--warn: #ffb347;--danger: #ff6b6b;--border: rgba(255, 255, 255, .08);font-family:Segoe UI,system-ui,-apple-system,sans-serif}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%;height:100%;background:var(--bg);color:var(--text)}body{overflow:hidden}.muted{color:var(--muted)}.btn{appearance:none;border:1px solid var(--border);background:var(--panel);color:var(--text);border-radius:8px;padding:.45rem .8rem;font:inherit;cursor:pointer}.btn:disabled{opacity:.45;cursor:not-allowed}.btn.primary{background:var(--accent);border-color:transparent;color:#fff}.btn.ghost{background:transparent}.btn.active{background:var(--accent);border-color:transparent;color:#fff}.catalog-screen,.load-error-screen{height:100%;overflow:auto;padding:1rem 1.25rem 2rem}.catalog-header{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:1rem}.catalog-header h1{margin:0 0 .25rem;font-size:1.4rem}.soundfont-panel{margin-bottom:1rem;padding:.75rem 1rem;border:1px solid var(--border);border-radius:10px;background:var(--panel)}.soundfont-panel__row{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.75rem}.soundfont-panel__meta{margin:.2rem 0 0;font-size:.85rem}.soundfont-panel__actions{display:flex;flex-wrap:wrap;gap:.5rem}.status-error-inline{margin:.5rem 0 0;color:var(--danger);font-size:.85rem}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.play-sf2-meta{margin:0 0 .5rem;padding:0 .25rem;font-size:.8rem}.genre-row{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:.75rem}.chip{appearance:none;border:1px solid var(--border);background:var(--panel);color:var(--text);border-radius:999px;padding:.35rem .75rem;font:inherit;cursor:pointer}.chip.active{background:#5b8cff40;border-color:var(--accent)}.catalog-count{margin:0 0 .75rem;font-size:.85rem}.song-list{list-style:none;margin:0;padding:0;display:grid;gap:.5rem}.song-row{width:100%;display:flex;align-items:center;justify-content:space-between;gap:.75rem;text-align:left;appearance:none;border:1px solid var(--border);background:var(--panel);color:inherit;border-radius:12px;padding:.75rem .9rem;font:inherit;cursor:pointer}.song-row:disabled{opacity:.55;cursor:not-allowed}.song-row__main{display:flex;flex-direction:column;gap:.2rem;min-width:0}.badge{flex-shrink:0;font-size:.75rem;font-weight:700;letter-spacing:.04em;padding:.25rem .5rem;border-radius:6px}.badge.ok{background:#22c8702e;color:var(--ok)}.badge.warn{background:#ffb3472e;color:var(--warn)}.status-line,.status-error{padding:1rem 0}.status-error{color:var(--danger)}.play-screen{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:.5rem;padding:.5rem;position:relative}.play-hud{width:100%;max-width:1100px;display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .75rem;z-index:2}.play-hud__title{display:flex;flex-direction:column;min-width:10rem;flex:1}.play-hud__stats{display:flex;gap:.75rem;font-variant-numeric:tabular-nums}.mode-toggle{display:flex;gap:.25rem;border:none;margin:0;padding:0;min-inline-size:0}.play-frame-wrap{position:relative;overflow:hidden;border-radius:16px;border:1px solid var(--border);background:#000;box-shadow:0 12px 40px #00000073}.play-frame{position:relative;display:flex;flex-direction:column;background:#0a0c10}.play-falling{position:relative;touch-action:none}.play-keyboard{touch-action:none;border-top:1px solid rgba(255,255,255,.08)}.judgement-flash{position:absolute;left:50%;top:42%;transform:translate(-50%,-50%);font-size:1.6rem;font-weight:800;letter-spacing:.06em;text-shadow:0 2px 12px rgba(0,0,0,.6);pointer-events:none}.auto-pause-hint{position:absolute;right:12px;top:12px;font-size:.8rem;color:var(--warn);pointer-events:none}.play-done{margin:0;font-size:.9rem}.rotate-overlay{position:fixed;inset:0;z-index:50;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;background:#0b0d12f5;text-align:center;padding:1.5rem}.rotate-overlay p{margin:0;font-size:1.2rem}.load-error-screen h1{margin-top:0}