:root{color:#171b20;font-synthesis:none;background:#f1f3f5;font-family:Hiragino Sans,Yu Gothic UI,Yu Gothic,system-ui,sans-serif}*{box-sizing:border-box}body{min-width:320px;min-height:100vh;margin:0}button,select{font:inherit}button:focus-visible,select:focus-visible,.status:focus-visible{outline-offset:3px;outline:3px solid #f2a900}button,select{color:#171b20;background:#fff;border:1px solid #aab2bc;border-radius:8px;min-height:44px}button{color:#fff;cursor:pointer;background:#164f86;border-color:#164f86;padding:.7rem 1.2rem;font-weight:700}button.secondary{color:#164f86;background:#fff}button:disabled,select:disabled{cursor:not-allowed;opacity:.55}select{padding:.6rem 2.2rem .6rem .75rem}.app-shell{width:min(1120px,100% - 2rem);margin:0 auto;padding:2rem 0 3rem}.app-header{margin-bottom:1.5rem}.eyebrow{color:#54616f;letter-spacing:.12em;margin:0 0 .35rem;font-size:.85rem;font-weight:700}h1,h2,p{margin-top:0}h1{margin-bottom:.5rem;font-size:clamp(1.6rem,4vw,2.3rem)}.status{color:#35414c;background:#fff;border:1px solid #cbd3db;border-left:5px solid #60758a;border-radius:8px;align-items:baseline;gap:.65rem;min-height:48px;margin-bottom:0;padding:.7rem .85rem;display:flex}.status-label{flex:none;font-size:.82rem;font-weight:800}.status[data-state=loading],.status[data-state=preparing],.status[data-state=waiting]{background:#fff8e8;border-left-color:#a86d00}.status[data-state=playing]{background:#edf5fc;border-left-color:#164f86}.status[data-state=completed],.status[data-state=ready]{background:#edf8f0;border-left-color:#2c7440}.status[data-state=stopped]{background:#f6f1f6;border-left-color:#6c596e}.status[data-state=error]{color:#9e2525;background:#fff0f0;border-left-color:#9e2525;font-weight:700}.controls,.score-panel{background:#fff;border:1px solid #d4d9df;border-radius:12px;box-shadow:0 8px 28px #222b3514}.controls{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));align-items:end;gap:1rem;margin-bottom:1rem;padding:1rem;display:grid}.controls label{color:#3d4853;gap:.35rem;min-width:0;font-size:.9rem;font-weight:700;display:grid}.button-row{align-self:end;gap:.65rem;display:flex}.mode-controls{grid-column:1/-1;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));align-items:end;gap:1rem;min-width:0;display:grid}.mode-controls[hidden]{display:none}.exam-step-status{color:#44515e;grid-column:1/-1;margin:0;font-weight:700}.exam-guidance{color:#6d4d00;background:#fff8e8;border:1px solid #d9b45b;border-radius:8px;grid-column:1/-1;margin:0;padding:.7rem .85rem}.exam-guidance[hidden]{display:none}.score-panel{min-width:0;padding:1rem}.score-panel[hidden]{display:none}.score-heading{justify-content:space-between;align-items:center;gap:1rem;display:flex}.score-heading h2{margin-bottom:.75rem;font-size:1.1rem}.key-badge{color:#164f86;text-align:center;background:#e8f0f8;border-radius:999px;min-width:2.25rem;padding:.25rem .7rem;font-weight:700}.score{background:#fff;border:1px solid #e1e5e9;border-radius:8px;max-width:100%;min-height:240px;padding:.75rem;overflow-x:auto}.score svg{width:100%;min-width:700px;height:auto;display:block}.placeholder{color:#687480}.shortcut-help{color:#596673;margin:-.25rem 0 .35rem;font-size:.85rem}.compatibility-note{color:#596673;margin-bottom:1rem;font-size:.85rem}@media (width<=640px){.app-shell{width:min(100% - 1rem,1120px);padding-top:1rem}.controls{grid-template-columns:1fr;align-items:stretch}.mode-controls{grid-template-columns:1fr}.controls label,.controls select,.button-row,.button-row button{width:100%}.button-row{grid-template-columns:1fr;display:grid}.status{flex-direction:column;align-items:flex-start;gap:.2rem}.score-panel{padding:.65rem}}