:root{--text:#24272e;--bg:#fff;--surface:#f7f7f8;--surface-hover:#ececee;--border:#ddd;--border-subtle:#eee;--muted:#666;--accent:#3b82f6;--accent-text:#fff;--accent-soft-bg:#eaf2fe;--accent-soft-text:#1e3a5f;--danger-bg:#fde2e2;--danger-text:#7a1f1f;--warning-bg:#fff3cd;--warning-text:#7a5c00;--radius-sm:4px;--radius:8px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font:16px/145% system-ui,Segoe UI,Roboto,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--text:#d1d3d8;--bg:#16171d;--surface:#1e1f27;--surface-hover:#262733;--border:#34353f;--border-subtle:#292a33;--muted:#9a9ba5;--accent:#629bf8;--accent-text:#0f172a;--accent-soft-bg:#1c2b42;--accent-soft-text:#bcd6fb;--danger-bg:#3a1f1f;--danger-text:#f5a3a3;--warning-bg:#3a3018;--warning-text:#f0cf7a}}body{margin:0}input[type=radio],input[type=checkbox]{accent-color:var(--accent)}button,input,select{font:inherit}button,select{color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.45rem .9rem;transition:background-color .15s,border-color .15s}button:not(:disabled):hover,select:hover{background:var(--surface-hover)}button:not(:disabled){cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}.btn-primary{background:var(--accent);color:var(--accent-text);border-color:var(--accent);font-weight:600}.btn-primary:not(:disabled):hover{filter:brightness(1.08)}input[type=text],input[type=number]{background:var(--bg);color:var(--text);border:1px solid var(--border);border-radius:var(--radius-sm);padding:.3rem .5rem}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.app{max-width:900px;margin:0 auto;padding:1.5rem 1.5rem 6rem;font-family:system-ui,sans-serif}.panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin:1.25rem 0;padding:1rem 1.25rem}.panel>h2:first-child{margin-top:0}.practice-action-bar{z-index:10;background:var(--surface);color:var(--text);border-top:1px solid var(--border);justify-content:center;padding:.75rem 1.5rem;display:flex;position:fixed;bottom:0;left:0;right:0}.practice-action-bar .practice-controls{width:100%;max-width:900px;margin:0}.practice-action-bar .beat-indicator{margin:0}.practice-section-label{color:var(--muted);white-space:nowrap;font-size:.9rem}.practice-result-summary{align-items:center;gap:.5rem;display:flex}.practice-result-aborted{margin:0;padding:.2rem .5rem;font-size:.85rem}.practice-result-text{font-weight:600}.app-header{align-items:center;gap:1rem;display:flex}.app-title{align-items:center;gap:.5rem;margin:0;font-size:2rem;font-weight:700;display:inline-flex}.app-rename{color:var(--accent);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;padding:.15rem .35rem;font-size:1rem}.app-rename:hover{background:var(--accent-soft-bg)}.app-title-edit{align-items:center;gap:.5rem;display:inline-flex}.app-title-edit input{border-radius:var(--radius-sm);padding:.15rem .35rem;font-size:1.5rem;font-weight:700}.banner{border-radius:var(--radius-sm);margin:.5rem 0;padding:.5rem .75rem}.banner-error{background:var(--danger-bg);color:var(--danger-text)}.banner-warning{background:var(--warning-bg);color:var(--warning-text)}.input-source-list{border:none;align-items:center;gap:1rem;margin:0;padding:0;display:flex}.input-source-label{margin-right:.25rem;padding:0;font-weight:600}.input-source{cursor:pointer;align-items:center;gap:.4rem;display:inline-flex}.midi-selector .keyboard-legend,.midi-selector>button,.midi-selector>select{margin-top:.5rem}.keyboard-legend{flex-wrap:wrap;gap:.2rem;display:flex}.keyboard-key{border:1px solid var(--border);border-radius:var(--radius-sm);flex-direction:column;align-items:center;min-width:1.5rem;padding:.2rem .25rem;font-size:.75rem;line-height:1.1;display:inline-flex}.keyboard-key-note{color:var(--muted);font-size:.6rem}.score-viewer{scrollbar-color:var(--border) transparent;scrollbar-width:thin;min-height:100px;overflow-x:auto}.score-viewer-clickable{cursor:pointer}.beat-indicator{gap:.4rem;margin:.5rem 0;display:flex}.beat-dot{background:var(--border);border-radius:50%;width:.75rem;height:.75rem}.beat-dot-active{background:var(--accent)}.practice-controls{flex-wrap:wrap;align-items:center;gap:1rem;margin:1rem 0;display:flex}.tempo-control{align-items:center;gap:.75rem;display:flex}.tempo-control label{align-items:center;gap:.5rem;display:flex}.tempo-control input{width:4rem}.tempo-presets{gap:.25rem;display:flex}.tempo-preset-btn{padding:.25rem .5rem;font-size:.85rem}.tempo-preset-btn-active{background:var(--accent-soft-bg);color:var(--accent-soft-text);border-color:var(--accent)}.practice-hint{color:var(--muted);font-size:.9rem}.practice-status{font-weight:600}.hand-filter-control{border:none;align-items:center;gap:.6rem;margin:0;padding:0;display:flex}.hand-filter-control legend{margin-right:.15rem;padding:0;font-weight:600}.hand-filter-option{cursor:pointer;white-space:nowrap;align-items:center;gap:.3rem;font-size:.9rem;display:inline-flex}.hand-filter-control:disabled .hand-filter-option,.hand-filter-control[disabled] .hand-filter-option{cursor:default}.history-table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%}.history-table th{text-align:left;border-bottom:1px solid var(--border);color:var(--muted);padding:.4rem .6rem;font-size:.85rem;font-weight:600}.history-table td{text-align:left;border-bottom:1px solid var(--border-subtle);padding:.4rem .6rem}.history-table tbody tr:hover{background:var(--surface-hover)}.attempt-delete{color:var(--danger-text);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;padding:.2rem .5rem;font-size:.85rem}.attempt-delete:not(:disabled):hover{background:var(--danger-bg)}.history-empty{color:var(--muted)}.coach-suggestion{background:var(--accent-soft-bg);color:var(--accent-soft-text);border-left:3px solid var(--accent);border-radius:var(--radius-sm);margin:.5rem 0 1rem;padding:.5rem .75rem}.coach-headline{margin:0;font-weight:600}.coach-detail{margin:.25rem 0 0;font-size:.9rem}.piece-library ul{padding:0;list-style:none}.piece-library li{margin:.25rem 0}.piece-row{align-items:center;gap:.5rem;display:flex}.piece-select{text-align:left;border-radius:var(--radius-sm);background:0 0;border:none;flex:1;padding:.5rem .6rem}.piece-select:not(:disabled):hover{background:var(--surface-hover)}.piece-delete{color:var(--danger-text);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;padding:.25rem .5rem}.piece-delete:not(:disabled):hover{background:var(--danger-bg)}.piece-composer{color:var(--muted)}.piece-upload::file-selector-button{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);cursor:pointer;margin-right:.6rem;padding:.4rem .8rem;transition:background-color .15s}.piece-upload::file-selector-button:hover{background:var(--surface-hover)}