.staff-renderer[data-v-ef1611ff]{border-radius:8px;margin:20px 0;overflow-x:auto;padding:20px;width:100%}.vexflow-container[data-v-ef1611ff]{min-height:200px;width:100%}.loading-placeholder[data-v-ef1611ff]{align-items:center;background:#f0f0f0;border-radius:4px;color:#666;display:flex;font-size:16px;height:200px;justify-content:center;width:100%}@media(max-width:768px){.staff-renderer[data-v-ef1611ff]{margin:10px 0;padding:10px}.vexflow-container[data-v-ef1611ff]{min-height:150px}.loading-placeholder[data-v-ef1611ff]{font-size:14px;height:150px}}.mode-identification[data-v-57f15ef7]{background-color:#f8f9fa;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:24px;padding:24px}.question-header[data-v-57f15ef7]{margin-bottom:20px;text-align:center}.question-header h3[data-v-57f15ef7]{color:#2c3e50;font-size:1.5rem;margin-bottom:8px}.question-description[data-v-57f15ef7]{color:#666;font-size:.95rem}.difficulty-rating[data-v-57f15ef7]{align-items:center;display:flex;gap:8px;justify-content:center;margin-top:8px}.difficulty-label[data-v-57f15ef7]{color:#666;font-size:.9rem}.stars[data-v-57f15ef7]{display:flex;gap:2px}.stars i[data-v-57f15ef7]{color:#ffc107;font-size:.9rem}.melody-container[data-v-57f15ef7]{background-color:#fff;border-radius:8px;margin-bottom:24px;padding:20px;text-align:center}.play-melody-container[data-v-57f15ef7]{text-align:center}.play-button[data-v-57f15ef7]{align-items:center;background-color:#3ba868;border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:1.8rem;height:60px;justify-content:center;margin:0 auto;padding:15px 20px;transition:all .2s;width:80px}.play-button.playing[data-v-57f15ef7]{background-color:#ffb860}.play-button[data-v-57f15ef7]:hover{opacity:.8}.play-button[data-v-57f15ef7]:disabled{background-color:#6c757d;cursor:not-allowed}.play-hint[data-v-57f15ef7]{color:#666;font-size:.85rem;margin-bottom:0;margin-top:8px}.options-container[data-v-57f15ef7]{margin-bottom:24px}.options-wrapper[data-v-57f15ef7]{background-color:#fff;padding:20px}.options-grid[data-v-57f15ef7]{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}.option-item[data-v-57f15ef7]{align-items:center;background-color:transparent;border:none;border-radius:8px;display:flex;justify-content:space-between;padding:12px 16px;transition:all .2s}.option-item[data-v-57f15ef7]:hover:not(.selected):not(.correct):not(.incorrect){background-color:#f8f9fa}.option-item.selected[data-v-57f15ef7]{background-color:#e7f3ff}.option-item.correct[data-v-57f15ef7]{background-color:#d4edda}.option-item.incorrect[data-v-57f15ef7]{background-color:#f8d7da}.option-content[data-v-57f15ef7]{align-items:center;display:flex;justify-content:space-between;width:100%}.option-buttons[data-v-57f15ef7]{align-items:center;display:flex;gap:8px}.mode-name[data-v-57f15ef7]{color:#2c3e50;font-weight:600}.play-scale-button[data-v-57f15ef7]{align-items:center;background-color:#20acfd;border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;font-size:.9rem;height:40px;justify-content:center;padding:8px 12px;transition:all .2s;width:40px}.play-scale-button.playing[data-v-57f15ef7]{background-color:#ffb860}.play-scale-button[data-v-57f15ef7]:hover{opacity:.8}.play-scale-button[data-v-57f15ef7]:disabled{background-color:#6c757d;cursor:not-allowed}.test-section[data-v-57f15ef7]{background-color:#f0f8ff;border:1px solid #e0f0ff;border-radius:12px;margin-top:40px;padding:24px}.test-section h3[data-v-57f15ef7]{color:#2c3e50;margin-bottom:24px;text-align:center}.test-item[data-v-57f15ef7]{background-color:#fff;border-radius:8px;box-shadow:0 1px 4px #0000001a;margin-bottom:32px;padding:16px}.test-item h4[data-v-57f15ef7]{border-bottom:1px solid #e9ecef;color:#34495e;font-size:1.1rem;margin-bottom:12px;padding-bottom:8px}.select-button[data-v-57f15ef7]{background-color:#f96459;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem;font-weight:600;padding:8px 16px;transition:all .2s}.select-button[data-v-57f15ef7]:hover:not(:disabled){opacity:.8}.select-button[data-v-57f15ef7]:disabled{background-color:#adb5bd;cursor:not-allowed}.feedback[data-v-57f15ef7]{background-color:#fff;border-radius:8px;padding:20px;text-align:center}.correct-feedback[data-v-57f15ef7]{color:#28a745}.correct-feedback[data-v-57f15ef7],.incorrect-feedback[data-v-57f15ef7]{font-size:1.1rem;font-weight:600;margin-bottom:16px}.incorrect-feedback[data-v-57f15ef7]{color:#dc3545}.next-button[data-v-57f15ef7]{background-color:#007bff;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem;padding:10px 20px;transition:background-color .2s}.next-button[data-v-57f15ef7]:hover{background-color:#0056b3}@media(max-width:768px){.mode-identification[data-v-57f15ef7]{padding:16px}.question-header h3[data-v-57f15ef7]{font-size:1.3rem}.question-description[data-v-57f15ef7]{font-size:.9rem}.difficulty-rating[data-v-57f15ef7]{flex-direction:column;gap:4px}.play-button[data-v-57f15ef7]{font-size:1rem;height:50px;width:50px}.options-wrapper[data-v-57f15ef7]{border-radius:10px;padding:16px}.options-grid[data-v-57f15ef7]{gap:0;grid-template-columns:1fr}.option-item[data-v-57f15ef7]{padding:10px;text-align:center}.option-content[data-v-57f15ef7],.option-item[data-v-57f15ef7]{flex-direction:column;gap:10px}.option-buttons[data-v-57f15ef7]{gap:10px;justify-content:center}.mode-name[data-v-57f15ef7]{font-size:.95rem}.play-scale-button[data-v-57f15ef7]{font-size:.8rem;height:36px;width:36px}.select-button[data-v-57f15ef7]{font-size:.85rem;padding:8px 14px}.feedback[data-v-57f15ef7]{padding:16px}.correct-feedback[data-v-57f15ef7],.incorrect-feedback[data-v-57f15ef7]{font-size:1rem}.next-button[data-v-57f15ef7]{font-size:.9rem;padding:10px 18px}}@media(max-width:480px){.mode-identification[data-v-57f15ef7]{padding:12px}.question-header h3[data-v-57f15ef7]{font-size:1.2rem}.options-wrapper[data-v-57f15ef7]{border-radius:8px;padding:12px}.option-item[data-v-57f15ef7]{padding:14px 10px}.mode-name[data-v-57f15ef7]{font-size:.9rem}.option-buttons[data-v-57f15ef7]{flex-direction:row;gap:8px}.play-scale-button[data-v-57f15ef7]{height:32px;width:32px}.select-button[data-v-57f15ef7]{max-width:none;width:auto}}@media(max-width:1024px){.options-grid[data-v-57f15ef7]{gap:16px;grid-template-columns:1fr}}.melody-notes[data-v-57f15ef7]{background-color:#f8f9fa;border:1px solid #e9ecef;border-radius:6px;margin-top:16px;padding:16px}.melody-title[data-v-57f15ef7]{color:#2c3e50;font-size:1rem;font-weight:600;margin-bottom:8px}.notes-container[data-v-57f15ef7]{align-items:center;display:flex;flex-wrap:wrap;gap:4px}.note-item[data-v-57f15ef7]{color:#495057;font-family:Courier New,monospace;font-size:.9rem;font-weight:600}.test-mode-toggle[data-v-57f15ef7]{margin-top:10px;text-align:center}.test-mode-button[data-v-57f15ef7]{background-color:#6c757d;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem;font-weight:600;padding:8px 16px;transition:all .2s}.test-mode-button.active[data-v-57f15ef7]{background-color:#28a745}.test-mode-button[data-v-57f15ef7]:hover{opacity:.8}.test-mode-container[data-v-57f15ef7]{background-color:#f8f9fa;border:1px solid #e9ecef;border-radius:12px;margin-top:30px;padding:20px}.test-mode-container h4[data-v-57f15ef7]{color:#2c3e50;font-size:1.2rem;margin-bottom:20px;text-align:center}.test-mode-item[data-v-57f15ef7]{background-color:#fff;border-radius:8px;box-shadow:0 2px 4px #0000001a;margin-bottom:30px;padding:15px}.test-mode-item h5[data-v-57f15ef7]{border-bottom:2px solid #e9ecef;color:#2c3e50;font-size:1.1rem;margin-bottom:15px;padding-bottom:8px}.test-melody-line[data-v-57f15ef7]{background-color:#f8f9fa;border:1px solid #e9ecef;border-radius:6px;margin-bottom:20px;padding:15px}.melody-line-header[data-v-57f15ef7]{align-items:center;display:flex;justify-content:space-between;margin-bottom:10px}.melody-line-name[data-v-57f15ef7]{color:#495057;font-size:1rem;font-weight:600}.play-melody-button[data-v-57f15ef7]{align-items:center;background-color:#20acfd;border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;font-size:.9rem;height:40px;justify-content:center;padding:8px 12px;transition:all .2s;width:40px}.play-melody-button.playing[data-v-57f15ef7]{background-color:#ffb860}.play-melody-button[data-v-57f15ef7]:hover{opacity:.8}.melody-staff[data-v-57f15ef7]{display:flex;justify-content:center}@media(max-width:768px){.test-mode-container[data-v-57f15ef7]{padding:15px}.test-melody-line[data-v-57f15ef7],.test-mode-item[data-v-57f15ef7]{padding:10px}.melody-line-header[data-v-57f15ef7]{align-items:flex-start;flex-direction:column;gap:10px}}.interval-identification[data-v-3ac3bff4]{background-color:#f8f9fa;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:24px;padding:24px}.question-header[data-v-3ac3bff4]{margin-bottom:20px;text-align:center}.question-header h3[data-v-3ac3bff4]{color:#2c3e50;font-size:1.5rem;margin-bottom:8px}.question-description[data-v-3ac3bff4]{color:#666;font-size:.95rem}.difficulty-rating[data-v-3ac3bff4]{align-items:center;display:flex;gap:8px;justify-content:center;margin-top:8px}.difficulty-label[data-v-3ac3bff4]{color:#666;font-size:.9rem}.stars[data-v-3ac3bff4]{display:flex;gap:2px}.stars i[data-v-3ac3bff4]{color:#ffc107;font-size:.9rem}.reference-container[data-v-3ac3bff4]{background-color:#fff;border-radius:8px;margin-bottom:24px;padding:20px}.reference-playback[data-v-3ac3bff4]{text-align:center}.play-button-group[data-v-3ac3bff4]{align-items:center;display:flex;flex-direction:column;gap:8px}.play-interval-button[data-v-3ac3bff4]{align-items:center;background-color:#3ba868;border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:1.8rem;height:60px;justify-content:center;margin:0 auto;padding:15px 20px;transition:all .2s;width:80px}.play-interval-button.playing[data-v-3ac3bff4]{background-color:#ffb860}.play-interval-button[data-v-3ac3bff4]:hover{opacity:.8}.play-hint[data-v-3ac3bff4]{color:#666;font-size:.85rem;margin-bottom:0;margin-top:8px}.question-instruction[data-v-3ac3bff4]{margin-top:15px;text-align:center}.question-instruction p[data-v-3ac3bff4]{color:#2c3e50;font-size:1.2rem;font-weight:600;margin-bottom:10px}.question-instruction strong[data-v-3ac3bff4]{color:#e74c3c}.options-container[data-v-3ac3bff4]{margin-bottom:24px}.options-wrapper[data-v-3ac3bff4]{background-color:#fff;padding:20px}.options-grid[data-v-3ac3bff4]{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}.option-item[data-v-3ac3bff4]{align-items:center;background-color:transparent;border:none;border-radius:8px;display:flex;justify-content:space-between;padding:12px 16px;transition:all .2s}.option-item[data-v-3ac3bff4]:hover:not(.selected):not(.correct):not(.incorrect){background-color:#f8f9fa}.option-item.selected[data-v-3ac3bff4]{background-color:#e7f3ff}.option-item.correct[data-v-3ac3bff4]{background-color:#d4edda}.option-item.incorrect[data-v-3ac3bff4]{background-color:#f8d7da}.option-content[data-v-3ac3bff4]{align-items:center;display:flex;justify-content:space-between;width:100%}.option-buttons[data-v-3ac3bff4]{align-items:center;display:flex;gap:8px}.option-label[data-v-3ac3bff4]{color:#2c3e50;font-weight:600}.play-option-button[data-v-3ac3bff4]{align-items:center;background-color:#20acfd;border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;font-size:.9rem;height:40px;justify-content:center;padding:8px 12px;transition:all .2s;width:40px}.play-option-button.playing[data-v-3ac3bff4]{background-color:#ffb860}.play-option-button[data-v-3ac3bff4]:hover{opacity:.8}.play-option-button[data-v-3ac3bff4]:disabled{background-color:#6c757d;cursor:not-allowed}.select-button[data-v-3ac3bff4]{background-color:#f96459;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem;font-weight:600;padding:8px 16px;transition:all .2s}.select-button[data-v-3ac3bff4]:hover:not(:disabled){opacity:.8}.select-button[data-v-3ac3bff4]:disabled{background-color:#adb5bd;cursor:not-allowed}.feedback[data-v-3ac3bff4]{background-color:#fff;border-radius:8px;padding:20px;text-align:center}.correct-feedback[data-v-3ac3bff4]{color:#28a745}.correct-feedback[data-v-3ac3bff4],.incorrect-feedback[data-v-3ac3bff4]{font-size:1.1rem;font-weight:600;margin-bottom:16px}.incorrect-feedback[data-v-3ac3bff4]{color:#dc3545}.next-button[data-v-3ac3bff4]{background-color:#007bff;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem;padding:10px 20px;transition:background-color .2s}.next-button[data-v-3ac3bff4]:hover{background-color:#0056b3}.staff-container[data-v-3ac3bff4]{display:flex;justify-content:center;margin-top:20px}@media(max-width:768px){.interval-identification[data-v-3ac3bff4]{padding:16px}.question-header h3[data-v-3ac3bff4]{font-size:1.3rem}.question-description[data-v-3ac3bff4]{font-size:.9rem}.difficulty-rating[data-v-3ac3bff4]{flex-direction:column;gap:4px}.reference-playback[data-v-3ac3bff4]{flex-direction:column;gap:15px;text-align:center}.question-instruction p[data-v-3ac3bff4]{font-size:1.1rem}.play-interval-button[data-v-3ac3bff4]{font-size:1rem;height:50px;width:50px}.options-wrapper[data-v-3ac3bff4]{border-radius:10px;padding:16px}.options-grid[data-v-3ac3bff4]{gap:0;grid-template-columns:1fr}.option-item[data-v-3ac3bff4]{gap:10px;padding:10px;text-align:center}.option-content[data-v-3ac3bff4],.option-item[data-v-3ac3bff4]{flex-direction:column}}.chord-identification[data-v-f0626a43]{background-color:#f8f9fa;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:24px;padding:24px}.question-header[data-v-f0626a43]{margin-bottom:20px;text-align:center}.question-header h3[data-v-f0626a43]{color:#2c3e50;font-size:1.5rem;margin-bottom:8px}.question-description[data-v-f0626a43]{color:#666;font-size:.95rem}.difficulty-rating[data-v-f0626a43]{align-items:center;display:flex;gap:8px;justify-content:center;margin-top:8px}.difficulty-label[data-v-f0626a43]{color:#666;font-size:.9rem}.stars[data-v-f0626a43]{display:flex;gap:2px}.stars i[data-v-f0626a43]{color:#ffc107;font-size:.9rem}.reference-container[data-v-f0626a43]{background-color:#fff;border-radius:8px;margin-bottom:24px;padding:20px}.reference-playback[data-v-f0626a43]{text-align:center}.play-button-group[data-v-f0626a43]{align-items:center;display:flex;flex-direction:column;gap:8px}.play-chord-button[data-v-f0626a43]{align-items:center;background-color:#3ba868;border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:1.8rem;height:60px;justify-content:center;margin:0 auto;padding:15px 20px;transition:all .2s;width:80px}.play-chord-button.playing[data-v-f0626a43]{background-color:#ffb860}.play-chord-button[data-v-f0626a43]:hover{opacity:.8}.play-hint[data-v-f0626a43]{color:#666;font-size:.85rem;margin-bottom:0;margin-top:8px}.question-instruction[data-v-f0626a43]{margin-top:15px;text-align:center}.question-instruction p[data-v-f0626a43]{color:#2c3e50;font-size:1.2rem;font-weight:600;margin-bottom:10px}.question-instruction strong[data-v-f0626a43]{color:#e74c3c}.options-container[data-v-f0626a43]{margin-bottom:24px}.options-wrapper[data-v-f0626a43]{background-color:#fff;padding:20px}.options-grid[data-v-f0626a43]{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}.option-item[data-v-f0626a43]{align-items:center;background-color:transparent;border:none;border-radius:8px;display:flex;justify-content:space-between;padding:12px 16px;transition:all .2s}.option-item[data-v-f0626a43]:hover:not(.selected):not(.correct):not(.incorrect){background-color:#f8f9fa}.option-item.selected[data-v-f0626a43]{background-color:#e7f3ff}.option-item.correct[data-v-f0626a43]{background-color:#d4edda}.option-item.incorrect[data-v-f0626a43]{background-color:#f8d7da}.option-content[data-v-f0626a43]{align-items:center;display:flex;justify-content:space-between;width:100%}.option-buttons[data-v-f0626a43]{align-items:center;display:flex;gap:8px}.option-label[data-v-f0626a43]{color:#2c3e50;font-weight:600}.play-option-button[data-v-f0626a43]{align-items:center;background-color:#20acfd;border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;font-size:.9rem;height:40px;justify-content:center;padding:8px 12px;transition:all .2s;width:40px}.play-option-button.playing[data-v-f0626a43]{background-color:#ffb860}.play-option-button[data-v-f0626a43]:hover{opacity:.8}.play-option-button[data-v-f0626a43]:disabled{background-color:#6c757d;cursor:not-allowed}.select-button[data-v-f0626a43]{background-color:#f96459;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem;font-weight:600;padding:8px 16px;transition:all .2s}.select-button[data-v-f0626a43]:hover:not(:disabled){opacity:.8}.select-button[data-v-f0626a43]:disabled{background-color:#adb5bd;cursor:not-allowed}.feedback[data-v-f0626a43]{background-color:#fff;border-radius:8px;padding:20px;text-align:center}.correct-feedback[data-v-f0626a43]{color:#28a745}.correct-feedback[data-v-f0626a43],.incorrect-feedback[data-v-f0626a43]{font-size:1.1rem;font-weight:600;margin-bottom:16px}.incorrect-feedback[data-v-f0626a43]{color:#dc3545}.next-button[data-v-f0626a43]{background-color:#007bff;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem;padding:10px 20px;transition:background-color .2s}.next-button[data-v-f0626a43]:hover{background-color:#0056b3}.staff-container[data-v-f0626a43]{display:flex;justify-content:center;margin-top:20px}@media(max-width:768px){.chord-identification[data-v-f0626a43]{padding:16px}.question-header h3[data-v-f0626a43]{font-size:1.3rem}.question-description[data-v-f0626a43]{font-size:.9rem}.difficulty-rating[data-v-f0626a43]{flex-direction:column;gap:4px}.reference-playback[data-v-f0626a43]{flex-direction:column;gap:15px;text-align:center}.question-instruction p[data-v-f0626a43]{font-size:1.1rem}.play-chord-button[data-v-f0626a43]{font-size:1rem;height:50px;width:50px}.options-wrapper[data-v-f0626a43]{border-radius:10px;padding:16px}.options-grid[data-v-f0626a43]{gap:0;grid-template-columns:1fr}.option-item[data-v-f0626a43]{gap:10px;padding:10px;text-align:center}.option-content[data-v-f0626a43],.option-item[data-v-f0626a43]{flex-direction:column}}.restore-note[data-v-e2cdf470]{background-color:#f8f9fa;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:24px;padding:24px}.question-header[data-v-e2cdf470]{margin-bottom:20px;text-align:center}.question-header h3[data-v-e2cdf470]{color:#2c3e50;font-size:1.5rem;margin-bottom:8px}.question-description[data-v-e2cdf470]{color:#666;font-size:.95rem}.difficulty-rating[data-v-e2cdf470]{align-items:center;display:flex;gap:8px;justify-content:center;margin-top:8px}.difficulty-label[data-v-e2cdf470]{color:#666;font-size:.9rem}.stars[data-v-e2cdf470]{display:flex;gap:2px}.stars i[data-v-e2cdf470]{color:#ffc107;font-size:.9rem}.reference-container[data-v-e2cdf470]{background-color:#fff;border-radius:8px;margin-bottom:24px;padding:20px}.reference-playback[data-v-e2cdf470]{text-align:center}.play-button-group[data-v-e2cdf470]{align-items:center;display:flex;flex-direction:column;gap:8px}.play-sound-button[data-v-e2cdf470]{align-items:center;background-color:#3ba868;border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:1.8rem;height:60px;justify-content:center;margin:0 auto;padding:15px 20px;transition:all .2s;width:80px}.play-sound-button.playing[data-v-e2cdf470]{background-color:#ffb860}.play-sound-button[data-v-e2cdf470]:hover{opacity:.8}.play-hint[data-v-e2cdf470]{color:#666;font-size:.85rem;margin-bottom:0;margin-top:8px}.question-instruction[data-v-e2cdf470]{margin-top:15px;text-align:center}.question-instruction p[data-v-e2cdf470]{color:#2c3e50;font-size:1.2rem;font-weight:600;margin-bottom:10px}.options-container[data-v-e2cdf470]{margin-bottom:24px}.options-wrapper[data-v-e2cdf470]{background-color:#fff;padding:20px}.options-grid[data-v-e2cdf470]{display:grid;gap:16px;grid-template-columns:repeat(2,1fr)}.option-item[data-v-e2cdf470]{align-items:center;background-color:transparent;border:none;border-radius:8px;display:flex;justify-content:space-between;padding:12px 16px;transition:all .2s}.option-item[data-v-e2cdf470]:hover:not(.selected):not(.correct):not(.incorrect){background-color:#f8f9fa}.option-item.selected[data-v-e2cdf470]{background-color:#e7f3ff}.option-item.correct[data-v-e2cdf470]{background-color:#d4edda}.option-item.incorrect[data-v-e2cdf470]{background-color:#f8d7da}.option-item.correct-selected[data-v-e2cdf470]{background-color:#d4edda;border:2px solid #f78e96}.option-content[data-v-e2cdf470]{align-items:center;display:flex;justify-content:space-between;width:100%}.option-buttons[data-v-e2cdf470]{align-items:center;display:flex;gap:8px}.option-label[data-v-e2cdf470]{color:#2c3e50;font-weight:600}.play-option-button[data-v-e2cdf470]{align-items:center;background-color:#20acfd;border:none;border-radius:6px;color:#fff;cursor:pointer;display:flex;font-size:.9rem;height:40px;justify-content:center;padding:8px 12px;transition:all .2s;width:40px}.play-option-button.playing[data-v-e2cdf470]{background-color:#ffb860}.play-option-button[data-v-e2cdf470]:hover{opacity:.8}.play-option-button[data-v-e2cdf470]:disabled{background-color:#6c757d;cursor:not-allowed}.select-button[data-v-e2cdf470]{background-color:#f96459;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem;font-weight:600;padding:8px 16px;transition:all .2s}.select-button[data-v-e2cdf470]:hover:not(:disabled){opacity:.8}.select-button[data-v-e2cdf470]:disabled{background-color:#adb5bd;cursor:not-allowed}.feedback[data-v-e2cdf470]{background-color:#fff;border-radius:8px;padding:20px;text-align:center}.correct-feedback[data-v-e2cdf470]{color:#28a745}.correct-feedback[data-v-e2cdf470],.incorrect-feedback[data-v-e2cdf470]{font-size:1.1rem;font-weight:600;margin-bottom:16px}.incorrect-feedback[data-v-e2cdf470]{color:#dc3545}.submit-container[data-v-e2cdf470]{margin-top:20px;text-align:center}.submit-button[data-v-e2cdf470]{background-color:#3498db;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:1rem;font-weight:600;padding:12px 24px;transition:background-color .2s}.submit-button[data-v-e2cdf470]:hover:not(:disabled){background-color:#2f6baa}.submit-button[data-v-e2cdf470]:disabled{background-color:#adb5bd;cursor:not-allowed}.staff-container[data-v-e2cdf470]{display:flex;justify-content:center;margin-top:20px}@media(max-width:768px){.restore-note[data-v-e2cdf470]{padding:16px}.question-header h3[data-v-e2cdf470]{font-size:1.3rem}.question-description[data-v-e2cdf470]{font-size:.9rem}.difficulty-rating[data-v-e2cdf470]{flex-direction:column;gap:4px}.reference-playback[data-v-e2cdf470]{flex-direction:column;gap:15px;text-align:center}.question-instruction p[data-v-e2cdf470]{font-size:1.1rem}.play-sound-button[data-v-e2cdf470]{font-size:1rem;height:50px;width:50px}.options-wrapper[data-v-e2cdf470]{border-radius:10px;padding:16px}.options-grid[data-v-e2cdf470]{gap:12px;grid-template-columns:repeat(2,1fr)}.option-item[data-v-e2cdf470]{gap:10px;padding:10px;text-align:center}.option-content[data-v-e2cdf470],.option-item[data-v-e2cdf470]{flex-direction:column}}@media(max-width:480px){.restore-note[data-v-e2cdf470]{margin-bottom:12px;padding:12px}.question-header h3[data-v-e2cdf470]{font-size:1.2rem}.question-description[data-v-e2cdf470]{font-size:.85rem}.reference-container[data-v-e2cdf470]{padding:12px}.play-sound-button[data-v-e2cdf470]{font-size:.9rem;height:45px;width:45px}.options-wrapper[data-v-e2cdf470]{padding:12px}.options-grid[data-v-e2cdf470]{gap:10px;grid-template-columns:1fr}.option-item[data-v-e2cdf470]{gap:8px;padding:12px 8px}.option-label[data-v-e2cdf470]{font-size:1rem}.play-option-button[data-v-e2cdf470]{font-size:.8rem;height:35px;width:35px}.select-button[data-v-e2cdf470]{font-size:.85rem;padding:6px 12px}.feedback[data-v-e2cdf470]{padding:15px}.correct-feedback[data-v-e2cdf470],.incorrect-feedback[data-v-e2cdf470]{font-size:1rem}.submit-button[data-v-e2cdf470]{font-size:1rem;padding:10px 20px}}.restore-rhythm[data-v-5146530c]{background-color:#f8f9fa;border-radius:12px;box-shadow:0 2px 8px #0000001a;margin-bottom:24px;padding:24px}.question-header[data-v-5146530c]{margin-bottom:20px;text-align:center}.question-header h3[data-v-5146530c]{color:#2c3e50;font-size:1.5rem;margin-bottom:8px}.question-description[data-v-5146530c]{color:#666;font-size:.95rem}.difficulty-rating[data-v-5146530c]{align-items:center;display:flex;gap:8px;justify-content:center;margin-top:8px}.difficulty-label[data-v-5146530c]{color:#666;font-size:.9rem}.stars[data-v-5146530c]{display:flex;gap:2px}.stars i[data-v-5146530c]{color:#ffc107;font-size:.9rem}.reference-container[data-v-5146530c]{background-color:#fff;border-radius:8px;margin-bottom:24px;padding:20px}.reference-playback[data-v-5146530c]{text-align:center}.play-button-group[data-v-5146530c]{align-items:center;display:flex;flex-direction:column;gap:8px}.play-rhythm-button[data-v-5146530c]{align-items:center;background-color:#3ba868;border:none;border-radius:8px;color:#fff;cursor:pointer;display:flex;font-size:1.8rem;height:60px;justify-content:center;margin:0 auto;padding:15px 20px;transition:all .2s;width:80px}.play-rhythm-button.playing[data-v-5146530c]{background-color:#ffb860}.play-rhythm-button[data-v-5146530c]:hover{opacity:.8}.play-hint[data-v-5146530c]{color:#666;font-size:.85rem;margin-bottom:0;margin-top:8px}.question-instruction[data-v-5146530c]{margin-top:15px;text-align:center}.question-instruction p[data-v-5146530c]{color:#2c3e50;font-size:1.2rem;font-weight:600;margin-bottom:10px}.answer-area[data-v-5146530c]{background-color:#fff;border-radius:8px;margin-bottom:24px;padding:20px}.staff-container[data-v-5146530c]{display:flex;justify-content:center;margin-top:20px}.rhythm-buttons[data-v-5146530c]{text-align:center}.rhythm-buttons h4[data-v-5146530c]{color:#2c3e50;font-size:1.1rem;margin-bottom:15px}.rhythm-buttons-group[data-v-5146530c]{flex-wrap:wrap;gap:10px;margin-bottom:20px}.rhythm-btn[data-v-5146530c],.rhythm-buttons-group[data-v-5146530c]{display:flex;justify-content:center}.rhythm-btn[data-v-5146530c]{align-items:center;background:none;border:2px solid #e9ecef;border-radius:8px;cursor:pointer;padding:10px;transition:all .2s}.rhythm-btn[data-v-5146530c]:hover:not(:disabled){background-color:#f8f9fa;border-color:#007bff}.rhythm-btn[data-v-5146530c]:disabled{cursor:not-allowed;opacity:.5}.rhythm-btn img[data-v-5146530c]{height:40px;-o-object-fit:contain;object-fit:contain;width:40px}.control-buttons[data-v-5146530c]{display:flex;gap:10px;justify-content:center;margin-top:20px}.control-btn[data-v-5146530c]{background-color:#6c757d;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:.9rem;padding:10px 15px;transition:all .2s}.control-btn[data-v-5146530c]:hover:not(:disabled){opacity:.8}.control-btn[data-v-5146530c]:disabled{background-color:#adb5bd;cursor:not-allowed}.control-btn.undo-btn[data-v-5146530c]{background-color:#ffc107}.control-btn.redo-btn[data-v-5146530c]{background-color:#17a2b8}.control-btn.reset-btn[data-v-5146530c]{background-color:#dc3545}.control-btn.play-user-rhythm-btn[data-v-5146530c]{background-color:#20acfd}.control-btn.play-user-rhythm-btn.playing[data-v-5146530c]{background-color:#ffb860}.control-btn.submit-btn[data-v-5146530c]{background-color:#28a745}.feedback[data-v-5146530c]{background-color:#fff;border-radius:8px;padding:20px;text-align:center}.correct-feedback[data-v-5146530c]{color:#28a745}.correct-feedback[data-v-5146530c],.incorrect-feedback[data-v-5146530c]{font-size:1.1rem;font-weight:600;margin-bottom:16px}.incorrect-feedback[data-v-5146530c]{color:#dc3545}.correct-staff-container[data-v-5146530c]{display:flex;justify-content:center;margin-top:20px}.correct-staff-container h4[data-v-5146530c]{color:#2c3e50;margin-bottom:15px}@media(max-width:768px){.restore-rhythm[data-v-5146530c]{padding:16px}.question-header h3[data-v-5146530c]{font-size:1.3rem}.question-description[data-v-5146530c]{font-size:.9rem}.difficulty-rating[data-v-5146530c]{flex-direction:column;gap:4px}.rhythm-buttons-group[data-v-5146530c]{gap:8px}.rhythm-btn img[data-v-5146530c]{height:30px;width:30px}.control-buttons[data-v-5146530c]{flex-wrap:wrap}.control-btn[data-v-5146530c]{font-size:.8rem;padding:8px 12px}}