:root,html[data-theme=beige]{--bg-main: #f7f5f0;--bg-gradient-start: #eae5d6;--bg-gradient-end: #fdfbf7;--accent: #d97706;--text-main: #4a4036;--text-muted: #85786f;--card-bg: #ffffff;--card-border: #e5e7eb;--tab-track-bg: rgba(243, 244, 246, .8);--tab-active-bg: #ffffff;--tab-active-text: #000000;--nav-bg-scrolled: rgba(255, 255, 255, .9)}html[data-theme=dark]{--bg-main: #0f172a;--bg-gradient-start: #1e293b;--bg-gradient-end: #020617;--accent: #38bdf8;--text-main: #f8fafc;--text-muted: #94a3b8;--card-bg: #1e293b;--card-border: #334155;--tab-track-bg: rgba(30, 41, 59, .8);--tab-active-bg: #38bdf8;--tab-active-text: #0f172a;--nav-bg-scrolled: rgba(15, 23, 42, .9)}html[data-theme=silver]{--bg-main: #ffffff;--bg-gradient-start: #f1f5f9;--bg-gradient-end: #ffffff;--accent: #475569;--text-main: #1e293b;--text-muted: #64748b;--card-bg: #f8fafc;--card-border: #e2e8f0;--tab-track-bg: rgba(241, 245, 249, .8);--tab-active-bg: #ffffff;--tab-active-text: #1e293b;--nav-bg-scrolled: rgba(255, 255, 255, .9)}.font-serif{font-family:Playfair Display,serif}@keyframes fadeInUp{0%{opacity:0}to{opacity:1}}.dot-grid{background-image:radial-gradient(var(--text-main) 1px,transparent 1px);background-size:32px 32px;opacity:.12;mask-image:linear-gradient(to bottom,black 40%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,black 40%,transparent 100%)}::selection{background-color:var(--accent);color:#fff}.container[data-v-1081e563]{width:100%;text-align:center;flex:1;background-color:#1a202c;min-height:100vh;padding:20px;font-family:Noto Sans,Arial,sans-serif;color:#e2e8f0;box-sizing:border-box;overflow:hidden}canvas[data-v-1081e563]{max-width:100%;height:200px;display:block;margin:20px auto;border:2px solid #4a5568;box-sizing:border-box}h1[data-v-1081e563]{font-size:24px;margin-bottom:20px}canvas[data-v-1081e563]{border:2px solid #4a5568;width:908px;height:200px;display:block;margin:20px auto}select[data-v-1081e563],button[data-v-1081e563]{margin:10px;padding:8px;font-size:16px;background-color:#2d3748;color:#e2e8f0;border:1px solid #4a5568;border-radius:4px;cursor:pointer}.distinct[data-v-1081e563]{background-color:#1a202c}select[data-v-1081e563]:disabled{cursor:not-allowed;opacity:.7}button[data-v-1081e563]:hover{background-color:#4a5568}.distinct[data-v-1081e563]:hover{background-color:#2f3748}.controls[data-v-1081e563]{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.options-row[data-v-1081e563]{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:10px}.options-group[data-v-1081e563]{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.hidden[data-v-1081e563]{display:none}#chordNotes[data-v-1081e563]{margin:10px 0;font-size:24px;display:flex;flex-wrap:wrap;gap:8px;justify-content:center}#chordNotes .normal[data-v-1081e563]{background-color:#4299e1;color:#fff;padding:4px 8px;width:60px;height:60px;line-height:50px;text-align:center;border:4px solid #000000;border-radius:50%;margin:0 6px;display:inline-block;transition:transform .3s ease-in-out,background-color .3s ease-in-out,border-color .3s ease-in-out}#chordNotes .highlight[data-v-1081e563]{background-color:#ed7000;color:#fff;padding:4px;width:60px;height:60px;line-height:50px;text-align:center;border:4px solid #000000;border-radius:50%;margin:0 6px;display:inline-block;transform:translateY(-8px) scale(1);animation:slidePulse-1081e563 .4s ease-in-out}@keyframes slidePulse-1081e563{0%{transform:translateY(0) scale(1)}50%{transform:translateY(-10px) scale(1.3)}to{transform:translateY(-8px) scale(1)}}#exercise[data-v-1081e563]{margin-top:14px;font-size:20px;font-style:italic}#score[data-v-1081e563]{margin-top:10px;font-size:18px;color:#e2e8f0}#progress[data-v-1081e563]{margin-top:20px;font-size:16px;color:#a0aec0}footer[data-v-1081e563]{margin-top:20px;padding:10px;font-size:14px;color:#a0aec0;text-align:center}.mute-x[data-v-1081e563]{color:#e53e3e;font-size:16px;font-weight:700}@media(max-width:600px){canvas[data-v-1081e563]{width:100%;height:auto}.container[data-v-1081e563]{padding:10px}select[data-v-1081e563],button[data-v-1081e563]{font-size:14px;padding:6px}#chordNotes[data-v-1081e563]{font-size:16px}#chordNotes .normal[data-v-1081e563],#chordNotes .highlight[data-v-1081e563]{width:40px;height:40px;line-height:32px;padding:2px 4px}}.home-container[data-v-decb3d85]{padding:40px 20px;text-align:center;font-family:Noto Sans,Arial,sans-serif;background-color:#f7fafc;min-height:100vh;display:flex;flex-direction:column;align-items:center}h1[data-v-decb3d85]{font-size:28px;color:#2d3748;margin-bottom:30px;font-weight:700}.grid[data-v-decb3d85]{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;max-width:450px;width:100%}.grid-item[data-v-decb3d85]{background-color:#d3dbe3;width:100px;height:100px;line-height:100px;text-decoration:none;color:#2d3748;font-size:22px;font-weight:500;box-shadow:0 2px 4px #0000001a;border:1px solid #e2e8f0;border-radius:4px;transition:transform .2s,background-color .2s}.grid-item[data-v-decb3d85]:hover{background-color:#edf2f7;transform:translateY(-4px)}@media(max-width:600px){.grid[data-v-decb3d85]{grid-template-columns:repeat(2,1fr);gap:10px;max-width:300px}.grid-item[data-v-decb3d85]{width:80px;height:80px;line-height:80px;font-size:18px}}.about-overlay[data-v-3b502a35]{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.about-modal[data-v-3b502a35]{background:#2d3748;padding:20px;border-radius:0;max-width:400px;width:90%;text-align:center;color:#e2e8f0}.qrcode[data-v-3b502a35]{width:150px;height:150px;margin:20px auto;display:block}.close-button[data-v-3b502a35]{padding:8px 16px;background-color:#4299e1;color:#fff;border:none;border-radius:4px;cursor:pointer}.close-button[data-v-3b502a35]:hover{background-color:#3182ce}h2[data-v-3b502a35]{font-size:24px;margin-bottom:10px}p[data-v-3b502a35]{font-size:16px;color:#a0aec0;margin:10px 0}@media(max-width:768px){.about-modal[data-v-3b502a35]{width:95%}}.container[data-v-d35c794f]{width:100%;text-align:center;flex:1;background-color:#1a202c;min-height:100vh;padding:20px;font-family:Noto Sans,Arial,sans-serif;color:#e2e8f0}h1[data-v-d35c794f]{font-size:24px;margin-bottom:20px}canvas[data-v-d35c794f]{border:2px solid #4a5568;width:908px;height:200px;display:block;margin:20px auto}select[data-v-d35c794f],button[data-v-d35c794f]{margin:10px;padding:8px;font-size:16px;background-color:#2d3748;color:#e2e8f0;border:1px solid #4a5568;border-radius:4px;cursor:pointer}button[data-v-d35c794f]:hover{background-color:#4a5568}.controls[data-v-d35c794f]{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.melody-display[data-v-d35c794f]{display:flex;justify-content:center;gap:16px;margin:20px 0}.melody-display .bar[data-v-d35c794f]{padding:8px;background-color:#2d3748;border-radius:4px;min-width:150px;text-align:left}.melody-display .bar.active[data-v-d35c794f]{background-color:#4299e1;animation:pulse-d35c794f .5s}.melody-display .chord[data-v-d35c794f]{font-weight:700;color:#e53e3e}.melody-display .note-container[data-v-d35c794f]{display:inline-block;text-align:center;margin-right:4px}.melody-display .note[data-v-d35c794f]{display:inline-block;width:16px;margin:0;text-align:center}.melody-display .eighth-note-group[data-v-d35c794f]{display:inline-flex;margin-right:4px;gap:0;align-items:center}.melody-display .eighth-note-group-rhythm1[data-v-d35c794f]{border-bottom:2px solid #e2e8f0;padding-left:0;padding-right:10px}.melody-display .eighth-note-group-rhythm2[data-v-d35c794f]{border-bottom:2px solid #a0aec0;padding-left:15px;padding-right:12px}.melody-display .eighth-note-group-rhythm3[data-v-d35c794f]{border-bottom:2px solid #4299e1;padding-left:12px;padding-right:8px}.melody-display .eighth-note[data-v-d35c794f]{text-decoration:none}.melody-display .last-eighth-note-underline[data-v-d35c794f]{border-bottom:2px solid #ffffff;padding-left:4px;padding-right:4px;padding-bottom:2px}.melody-display .rhythm[data-v-d35c794f]{font-size:12px;color:#a0aec0;margin-top:4px}#exercise[data-v-d35c794f]{margin-top:14px;font-size:20px;font-style:italic}#progress[data-v-d35c794f]{margin-top:20px;font-size:16px;color:#a0aec0}@keyframes pulse-d35c794f{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}@media(max-width:600px){canvas[data-v-d35c794f]{width:100%;height:auto}.melody-display[data-v-d35c794f]{flex-direction:column;align-items:center}.melody-display .bar[data-v-d35c794f]{width:100%}}.container[data-v-0aea55cf]{width:100%;text-align:center;flex:1;background-color:#1a202c;min-height:100vh;padding:20px;font-family:Noto Sans,Arial,sans-serif;color:#e2e8f0}h1[data-v-0aea55cf]{font-size:24px;margin-bottom:20px}canvas[data-v-0aea55cf]{border:2px solid #4a5568;width:908px;height:200px;display:block;margin:20px auto}select[data-v-0aea55cf],button[data-v-0aea55cf]{margin:10px;padding:8px;font-size:16px;background-color:#2d3748;color:#e2e8f0;border:1px solid #4a5568;border-radius:4px;cursor:pointer}.distinct[data-v-0aea55cf]{background-color:#1a202c}select[data-v-0aea55cf]:disabled{cursor:not-allowed;opacity:.7}button[data-v-0aea55cf]:hover{background-color:#4a5568}.distinct[data-v-0aea55cf]:hover{background-color:#2f3748}.controls[data-v-0aea55cf]{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.options-row[data-v-0aea55cf]{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:10px}.options-group[data-v-0aea55cf]{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.hidden[data-v-0aea55cf]{display:none}#chordNotes[data-v-0aea55cf]{margin:10px 0;font-size:24px;display:flex;flex-wrap:wrap;gap:8px;justify-content:center}#chordNotes .normal[data-v-0aea55cf]{background-color:#4299e1;color:#fff;padding:4px 8px;width:60px;height:60px;line-height:50px;text-align:center;border:4px solid #000000;border-radius:50%;margin:0 6px;display:inline-block;transition:transform .3s ease-in-out,background-color .3s ease-in-out,border-color .3s ease-in-out}#chordNotes .highlight[data-v-0aea55cf]{background-color:#4299e1;color:#fff;padding:4px;width:60px;height:60px;line-height:50px;text-align:center;border:4px solid #000000;border-radius:50%;margin:0 6px;display:inline-block;transform:translateY(-8px) scale(1);animation:slidePulse-0aea55cf .4s ease-in-out}@keyframes slidePulse-0aea55cf{0%{transform:translateY(0) scale(1)}50%{transform:translateY(-10px) scale(1.3)}to{transform:translateY(-8px) scale(1)}}#exercise[data-v-0aea55cf]{margin-top:14px;font-size:20px;font-style:italic}#score[data-v-0aea55cf]{margin-top:10px;font-size:18px;color:#e2e8f0}#progress[data-v-0aea55cf]{margin-top:20px;font-size:16px;color:#a0aec0}footer[data-v-0aea55cf]{margin-top:20px;padding:10px;font-size:14px;color:#a0aec0;text-align:center}.mute-x[data-v-0aea55cf]{color:#e53e3e;font-size:16px;font-weight:700}@media(max-width:600px){canvas[data-v-0aea55cf]{width:100%;height:auto}.container[data-v-0aea55cf]{padding:10px}select[data-v-0aea55cf],button[data-v-0aea55cf]{font-size:14px;padding:6px}#chordNotes[data-v-0aea55cf]{font-size:16px}#chordNotes .normal[data-v-0aea55cf],#chordNotes .highlight[data-v-0aea55cf]{width:40px;height:40px;line-height:32px;padding:2px 4px}}.container[data-v-2309bb88]{width:100%;text-align:center;flex:1;background-color:#1a202c;min-height:100vh;padding:20px;font-family:Noto Sans,Arial,sans-serif;color:#e2e8f0}h1[data-v-2309bb88]{font-size:24px;margin-bottom:20px}canvas[data-v-2309bb88]{border:2px solid #4a5568;width:908px;height:200px;display:block;margin:20px auto}select[data-v-2309bb88],button[data-v-2309bb88]{margin:10px;padding:8px;font-size:16px;background-color:#2d3748;color:#e2e8f0;border:1px solid #4a5568;border-radius:4px;cursor:pointer}.distinct[data-v-2309bb88]{background-color:#1a202c}select[data-v-2309bb88]:disabled{cursor:not-allowed;opacity:.7}button[data-v-2309bb88]:hover{background-color:#4a5568}.distinct[data-v-2309bb88]:hover{background-color:#2f3748}.controls[data-v-2309bb88]{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.options-row[data-v-2309bb88]{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:10px}.options-group[data-v-2309bb88]{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.hidden[data-v-2309bb88]{display:none}#chordNotes[data-v-2309bb88]{margin:10px 0;font-size:24px;display:flex;flex-wrap:wrap;gap:8px;justify-content:center}#chordNotes .normal[data-v-2309bb88]{background-color:#4299e1;color:#fff;padding:4px 8px;width:60px;height:60px;line-height:50px;text-align:center;border:4px solid #000000;border-radius:50%;margin:0 6px;display:inline-block;transition:transform .3s ease-in-out,background-color .3s ease-in-out,border-color .3s ease-in-out}#chordNotes .highlight[data-v-2309bb88]{background-color:#ed8936;color:#fff;padding:4px;width:60px;height:60px;line-height:50px;text-align:center;border:4px solid #000000;border-radius:50%;margin:0 6px;display:inline-block;transform:translateY(-8px) scale(1);animation:slidePulse-2309bb88 .4s ease-in-out}@keyframes slidePulse-2309bb88{0%{transform:translateY(0) scale(1)}50%{transform:translateY(-10px) scale(1.3)}to{transform:translateY(-8px) scale(1)}}#exercise[data-v-2309bb88]{margin-top:14px;font-size:20px;font-style:italic}#score[data-v-2309bb88]{margin-top:10px;font-size:18px;color:#e2e8f0}#progress[data-v-2309bb88]{margin-top:20px;font-size:16px;color:#a0aec0}footer[data-v-2309bb88]{margin-top:20px;padding:10px;font-size:14px;color:#a0aec0;text-align:center}.mute-x[data-v-2309bb88]{color:#e53e3e;font-size:16px;font-weight:700}@media(max-width:600px){canvas[data-v-2309bb88]{width:100%;height:auto}.container[data-v-2309bb88]{padding:10px}select[data-v-2309bb88],button[data-v-2309bb88]{font-size:14px;padding:6px}#chordNotes[data-v-2309bb88]{font-size:16px}#chordNotes .normal[data-v-2309bb88],#chordNotes .highlight[data-v-2309bb88]{width:40px;height:40px;line-height:32px;padding:2px 4px}}.container[data-v-20bb3fd0]{width:100%;text-align:center;flex:1;background-color:#1a202c;min-height:100vh;padding:20px;font-family:Noto Sans,Arial,sans-serif;color:#e2e8f0}h1[data-v-20bb3fd0]{font-size:24px;margin-bottom:20px}canvas[data-v-20bb3fd0]{border:2px solid #4a5568;width:908px;height:200px;display:block;margin:20px auto}select[data-v-20bb3fd0],button[data-v-20bb3fd0]{margin:10px;padding:8px;font-size:16px;background-color:#2d3748;color:#e2e8f0;border:1px solid #4a5568;border-radius:4px;cursor:pointer}.distinct[data-v-20bb3fd0]{background-color:#1a202c}select[data-v-20bb3fd0]:disabled{cursor:not-allowed;opacity:.7}button[data-v-20bb3fd0]:hover{background-color:#4a5568}.distinct[data-v-20bb3fd0]:hover{background-color:#2f3748}.controls[data-v-20bb3fd0]{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.options-row[data-v-20bb3fd0]{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:10px}.options-group[data-v-20bb3fd0]{display:flex;flex-wrap:wrap;justify-content:center;gap:10px}.hidden[data-v-20bb3fd0]{display:none}#chordNotes[data-v-20bb3fd0]{margin:10px 0;font-size:24px;display:flex;flex-wrap:wrap;gap:8px;justify-content:center}#chordNotes .normal[data-v-20bb3fd0]{background-color:#4299e1;color:#fff;padding:4px 8px;width:60px;height:60px;line-height:50px;text-align:center;border:4px solid #000000;border-radius:50%;margin:0 6px;display:inline-block;transition:transform .3s ease-in-out,background-color .3s ease-in-out,border-color .3s ease-in-out}#chordNotes .highlight[data-v-20bb3fd0]{background-color:#4299e1;color:#fff;padding:4px;width:60px;height:60px;line-height:50px;text-align:center;border:4px solid #000000;border-radius:50%;margin:0 6px;display:inline-block;transform:translateY(-8px) scale(1);animation:slidePulse-20bb3fd0 .4s ease-in-out}@keyframes slidePulse-20bb3fd0{0%{transform:translateY(0) scale(1)}50%{transform:translateY(-10px) scale(1.3)}to{transform:translateY(-8px) scale(1)}}#exercise[data-v-20bb3fd0]{margin-top:14px;font-size:20px;font-style:italic}#score[data-v-20bb3fd0]{margin-top:10px;font-size:18px;color:#e2e8f0}#progress[data-v-20bb3fd0]{margin-top:20px;font-size:16px;color:#a0aec0}footer[data-v-20bb3fd0]{margin-top:20px;padding:10px;font-size:14px;color:#a0aec0;text-align:center}.mute-x[data-v-20bb3fd0]{color:#e53e3e;font-size:16px;font-weight:700}@media(max-width:600px){canvas[data-v-20bb3fd0]{width:100%;height:auto}.container[data-v-20bb3fd0]{padding:10px}select[data-v-20bb3fd0],button[data-v-20bb3fd0]{font-size:14px;padding:6px}#chordNotes[data-v-20bb3fd0]{font-size:16px}#chordNotes .normal[data-v-20bb3fd0],#chordNotes .highlight[data-v-20bb3fd0]{width:40px;height:40px;line-height:32px;padding:2px 4px}}.animate-pulse[data-v-2456fba3]{animation:pulse-2456fba3 .5s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse-2456fba3{0%,to{opacity:1}50%{opacity:.5}}.hx-container[data-v-e0444bf5]{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;width:100vw;background-color:#f7fafc;color:#2d3748;font-family:Arial,sans-serif;box-sizing:border-box;margin:0;padding:0}.title[data-v-e0444bf5]{font-size:1.5rem;font-weight:700;margin-bottom:1.5rem}.controls[data-v-e0444bf5]{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem}.select[data-v-e0444bf5]{padding:.5rem;font-size:.875rem;background-color:#e2e8f0;color:#2d3748;border:1px solid #A8DADC;border-radius:0}.label[data-v-e0444bf5]{font-size:.875rem;color:#2d3748}.checkbox[data-v-e0444bf5]{margin-left:.25rem}.start-btn[data-v-e0444bf5]{padding:.5rem 1rem;font-size:.875rem;background-color:#e2e8f0;color:#2d3748;border:1px solid #A8DADC;border-radius:0;transition:background-color .2s ease}.start-btn[data-v-e0444bf5]:hover{background-color:#a8dadc}.start-btn[data-v-e0444bf5]:disabled{opacity:.5;cursor:not-allowed}.canvas[data-v-e0444bf5]{margin-bottom:1.25rem;border:2px solid #A8DADC;background-color:#fff}.progress[data-v-e0444bf5]{font-size:1.125rem;color:#2d3748;margin-bottom:.75rem}.chord-name[data-v-e0444bf5]{font-size:1.5rem;color:#2d3748;margin-bottom:1.25rem}.correct[data-v-e0444bf5]{color:#2ecc71!important;font-weight:700}.wrong[data-v-e0444bf5]{color:#e74c3c!important;font-weight:700}.next-btn-container[data-v-e0444bf5]{margin-bottom:.75rem}.next-btn[data-v-e0444bf5]{padding:.5rem 1rem;font-size:.875rem;background-color:#e2e8f0;color:#2d3748;border:1px solid #A8DADC;border-radius:0;transition:background-color .2s ease}.next-btn[data-v-e0444bf5]:hover{background-color:#a8dadc}.options[data-v-e0444bf5]{display:flex;gap:.75rem;flex-wrap:wrap;justify-content:center}.option-btn[data-v-e0444bf5]{width:4rem;height:4rem;font-size:1rem;background-color:#e2e8f0;color:#2d3748;border:1px solid #A8DADC;display:flex;align-items:center;justify-content:center;transition:transform .2s ease,background-color .2s ease}.option-btn[data-v-e0444bf5]:hover{transform:scale(1.1);background-color:#a8dadc}.option-btn[data-v-e0444bf5]:active{transform:scale(.95);background-color:#80c4de}.footer[data-v-e0444bf5]{font-size:.875rem;color:#2d3748;margin-top:1.5rem}[data-v-788bb0b7],[data-v-788bb0b7]:before,[data-v-788bb0b7]:after{box-sizing:border-box}.page[data-v-788bb0b7]{min-height:100vh;width:100%;background:#faf8f5;padding:24px 16px;font-family:PingFang SC,-apple-system,system-ui,sans-serif;color:#2d2621;display:flex;flex-direction:column}.header-section[data-v-788bb0b7]{text-align:center;margin-bottom:24px}.logo-title[data-v-788bb0b7]{font-size:20px;font-weight:700;color:#1c130d;letter-spacing:3px;margin-bottom:4px}.logo-sub[data-v-788bb0b7]{font-size:9px;color:#8c7f73;letter-spacing:2px;font-family:JetBrains Mono,monospace}.mode-tabs[data-v-788bb0b7]{display:flex;justify-content:center;gap:8px;margin-bottom:20px}.tab-btn[data-v-788bb0b7]{padding:8px 20px;background:#f8fafc;border:1px solid #cbd5e1;color:#475569;font-size:13px;font-weight:500;cursor:pointer;border-radius:0;transition:all .2s cubic-bezier(.16,1,.3,1)}.tab-btn.active[data-v-788bb0b7]{background:#2563eb;color:#fff;border-color:#2563eb;box-shadow:2px 2px #93c5fd}.controls[data-v-788bb0b7]{width:100%;max-width:500px;margin:0 auto 16px}.panel-box[data-v-788bb0b7]{background:#fff;border:1px solid #e7dfd5;padding:16px;margin-bottom:12px;box-shadow:0 1px 3px #00000005}.text-center[data-v-788bb0b7]{text-align:center}.game-options[data-v-788bb0b7]{display:flex;flex-flow:row wrap;align-items:center;justify-content:space-between;gap:12px;background:#faf7f2;border:1px solid #cbd5e1;padding:8px 12px;margin-bottom:16px;border-radius:4px}.opt-group[data-v-788bb0b7]{display:flex;align-items:center;gap:6px}.opt-label[data-v-788bb0b7]{font-size:11px;font-weight:700;color:#475569;width:auto;min-width:unset}.sel-difficulty[data-v-788bb0b7]{padding:4px 6px;border:1px solid #cbd5e1;background:#fff;color:#c2410c;font-size:11px;border-radius:3px;font-weight:600;outline:none;cursor:pointer}.hint-checkbox-label[data-v-788bb0b7]{display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:700;color:#475569;cursor:pointer}.opt-btn[data-v-788bb0b7]{padding:4px 10px;background:#fff;border:1px solid #cbd5e1;color:#475569;font-size:11px;cursor:pointer;border-radius:0;transition:all .15s ease}.opt-btn.active[data-v-788bb0b7]{background:#2563eb;color:#fff;border-color:#2563eb}.opt-btn[data-v-788bb0b7]:disabled{opacity:.5;cursor:not-allowed}.q-text-container[data-v-788bb0b7]{display:flex;justify-content:center;align-items:center;width:100%}.q-text-single-line[data-v-788bb0b7]{white-space:nowrap;overflow-x:auto;font-size:13.5px;display:inline-flex;align-items:center;justify-content:center;gap:4px;margin:0;width:100%}.choices-outside[data-v-788bb0b7]{margin:15px 0}.choices-grid[data-v-788bb0b7]{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;max-width:360px;margin:0 auto}.choice-btn[data-v-788bb0b7]{padding:10px 4px;background:#fff;border:1px solid #cbd5e1;color:#1e293b;font-size:13px;font-weight:600;border-radius:0;cursor:pointer;transition:all .14s ease}.choice-btn[data-v-788bb0b7]:hover{background:#f1f5f9;border-color:#2563eb;color:#2563eb}.choice-btn[data-v-788bb0b7]:active{transform:scale(.97)}.sound-helper-row[data-v-788bb0b7]{margin:10px 0 4px;display:flex;justify-content:center}.sound-helper-btn[data-v-788bb0b7]{background:#f0fdf4;border:1px solid #bbf7d0;color:#16a34a;padding:5px 12px;font-size:11px;font-weight:700;border-radius:0;cursor:pointer;transition:background .15s}.sound-helper-btn[data-v-788bb0b7]:hover{background:#dcfce7}.sel[data-v-788bb0b7]{border:1px solid #cbd5e1;padding:6px 12px;border-radius:0;background:#fff;font-size:13px;color:#1e293b;font-family:inherit;outline:none}.sel[data-v-788bb0b7]:focus{border-color:#2563eb}.btn-retro[data-v-788bb0b7]{background:#2563eb;color:#fff;border:1px solid #2563eb;padding:8px 20px;font-size:13px;font-weight:500;cursor:pointer;border-radius:0;box-shadow:2px 2px #93c5fd;transition:all .2s cubic-bezier(.16,1,.3,1)}.btn-retro[data-v-788bb0b7]:hover{background:#1d4ed8;border-color:#1d4ed8}.btn-retro[data-v-788bb0b7]:active{transform:translate(1px,1px);box-shadow:1px 1px #93c5fd}.btn-outline[data-v-788bb0b7]{background:#fff;color:#475569;border:1px solid #cbd5e1;padding:8px 16px;font-size:13px;font-weight:500;cursor:pointer;border-radius:0;transition:all .2s ease}.btn-outline[data-v-788bb0b7]:hover{background:#f8fafc;border-color:#94a3b8;color:#1e293b}.btn-outline[data-v-788bb0b7]:active{transform:scale(.98)}.q-progress[data-v-788bb0b7]{font-size:11px;text-transform:uppercase;color:#8c7f73;letter-spacing:1.5px;margin-bottom:2px;font-family:JetBrains Mono,monospace}.q-text[data-v-788bb0b7]{font-size:14px;line-height:1.6;color:#2d2621;margin:0}.hl-base[data-v-788bb0b7]{color:#1a56db;border-bottom:1px dashed #1a56db;padding:0 2px}.hl-interval[data-v-788bb0b7]{color:#c2410c;background:#fff7ed;border:1px solid #ffedd5;padding:1px 5px;font-weight:700}.feedback-area[data-v-788bb0b7]{min-height:38px;display:flex;align-items:center;justify-content:center;margin:6px 0}.fb-ok[data-v-788bb0b7]{color:#15803d;font-weight:600;font-size:14px;margin:0}.fb-err[data-v-788bb0b7]{color:#b91c1c;font-weight:600;font-size:14px;margin:0}.menu-action-row[data-v-788bb0b7]{display:flex;justify-content:center;margin-top:4px}.settlement-card[data-v-788bb0b7]{padding:12px 6px 4px}.settlement-title[data-v-788bb0b7]{font-size:16px;font-weight:700;color:#32261f;margin:0 0 16px;letter-spacing:1px}.settlement-scores[data-v-788bb0b7]{display:flex;justify-content:center;gap:20px;margin-bottom:14px}.score-item[data-v-788bb0b7]{display:flex;flex-direction:column;align-items:center;background:#fbfaf8;border:1px solid #e8e3dc;padding:8px 16px;min-width:72px}.score-label[data-v-788bb0b7]{font-size:10px;color:#8c7f73;margin-bottom:2px}.score-val[data-v-788bb0b7]{font-size:18px;font-weight:700;color:#2d2621}.text-green[data-v-788bb0b7]{color:#16a34a!important}.text-red[data-v-788bb0b7]{color:#dc2626!important}.evaluation-box[data-v-788bb0b7]{padding:12px 14px;text-align:left;line-height:1.5;font-size:12px;margin-bottom:16px}.eval-warn[data-v-788bb0b7]{background:#fff8f8;border-left:3px solid #dc2626;color:#7f1d1d}.eval-perfect[data-v-788bb0b7]{background:#f0fdf4;border-left:3px solid #16a34a;color:#14532d}.eval-status[data-v-788bb0b7]{font-size:13px;font-weight:700;margin:0 0 4px}.eval-desc[data-v-788bb0b7]{margin:0}.weakness-section[data-v-788bb0b7]{text-align:left;background:#f8fafc;border:1px solid #e2e8f0;padding:12px 16px;border-radius:0;margin-bottom:16px}.weakness-title[data-v-788bb0b7]{font-size:12px;font-weight:700;color:#1e293b;margin:0}.weakness-subtitle[data-v-788bb0b7]{font-size:10px;color:#64748b;margin:2px 0 10px}.weakness-grid[data-v-788bb0b7]{display:flex;flex-direction:column;gap:8px}.weakness-row[data-v-788bb0b7]{display:flex;align-items:center;font-size:11px}.w-name[data-v-788bb0b7]{width:55px;color:#475569;font-weight:700}.w-bar-bg[data-v-788bb0b7]{flex:1;height:8px;background:#e2e8f0;border-radius:0;overflow:hidden;margin:0 12px}.w-bar[data-v-788bb0b7]{height:100%;background:#ef4444;border-radius:0}.w-val[data-v-788bb0b7]{font-size:10px;color:#64748b;width:55px;text-align:right;font-family:JetBrains Mono,monospace}.settlement-actions[data-v-788bb0b7]{display:flex;justify-content:center;align-items:center}.fb-outer-horizontal[data-v-788bb0b7]{display:none!important}.fb-outer-vertical[data-v-788bb0b7]{width:100%;display:flex;justify-content:center;margin-top:8px}@media(min-width:769px){.page[data-v-788bb0b7]{padding:30px 16px}.fb-outer-horizontal[data-v-788bb0b7]{display:block!important;width:fit-content!important;max-width:686px;margin:20px auto;background:#eae2d5;border:1px solid #d2c5b1;padding:12px 14px 8px}.fb-outer-vertical[data-v-788bb0b7]{display:none!important}}.fb-inner-horizontal[data-v-788bb0b7]{display:block;width:fit-content;margin:0 auto}.str-row-horizontal[data-v-788bb0b7]{display:flex;align-items:center;margin-bottom:2px}.str-name-horizontal[data-v-788bb0b7]{width:32px;flex-shrink:0;text-align:center;font-weight:700;font-size:13px;color:#374151}.fret-nums-horizontal[data-v-788bb0b7]{display:flex;align-items:center;margin-top:4px;margin-bottom:4px}.str-name-ph-horizontal[data-v-788bb0b7]{width:32px;flex-shrink:0}.fnum-horizontal[data-v-788bb0b7]{width:48px;flex-shrink:0;text-align:center;font-size:10px;font-family:JetBrains Mono,monospace;color:#8c7f73}.fb-inner-vertical[data-v-788bb0b7]{display:block;margin:0 auto;width:fit-content;background:#f3ece3;border:1px solid #c2b5a3;padding:8px;box-shadow:0 4px 6px -1px #00000008}.str-header[data-v-788bb0b7]{display:flex;align-items:center;background:#eae2d5;border-bottom:1px solid #c2b5a3;padding-bottom:6px;margin-bottom:4px}.fret-num-ph[data-v-788bb0b7]{width:30px;flex-shrink:0}.str-name-vertical[data-v-788bb0b7]{width:48px;flex-shrink:0;text-align:center;display:flex;justify-content:center;align-items:center}.str-letter[data-v-788bb0b7]{font-weight:700;font-size:13px;color:#3c322b;font-family:JetBrains Mono,monospace}.fret-row[data-v-788bb0b7]{display:flex;align-items:center;border-bottom:1px solid #eae2d5}.fret-row[data-v-788bb0b7]:last-child{border-bottom:none}.fnum-col[data-v-788bb0b7]{width:30px;flex-shrink:0;text-align:center;font-weight:400;font-size:10px;color:#8c7f73;border-right:1px solid #c2b5a3;height:48px;display:flex;align-items:center;justify-content:center;background:#f7f4ee;font-family:JetBrains Mono,monospace}.fret[data-v-788bb0b7]{width:48px;height:48px;flex-shrink:0;border:1px solid #eae2d5;border-radius:0;background:#fff;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;transition:background .11s ease;-webkit-tap-highlight-color:transparent;padding:2px;overflow:hidden}.fret[data-v-788bb0b7]:hover{background:#fbfaf8}.iv-label[data-v-788bb0b7]{font-size:9px;font-weight:600;color:#1c130d;line-height:1.1;pointer-events:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:44px;text-align:center}.note-txt[data-v-788bb0b7]{font-size:9px;pointer-events:none;color:#5c4e43;line-height:1}.sel-txt[data-v-788bb0b7]{color:#fff!important}.sel-note[data-v-788bb0b7]{background:#3b82f6!important}.bg-blue[data-v-788bb0b7]{background:#bfdbfe}.bg-green-hit[data-v-788bb0b7]{background:#bbf7d0!important}.bg-red-hit[data-v-788bb0b7]{background:#fecaca!important}.bg-red-fret[data-v-788bb0b7]{background:#fee2e2!important}.bg-orange-fret[data-v-788bb0b7]{background:#ffedd5!important}.bg-amber-fret[data-v-788bb0b7]{background:#fef3c7!important}.bg-yellow-fret[data-v-788bb0b7]{background:#fef9c3!important}.bg-lime-fret[data-v-788bb0b7]{background:#ecfccb!important}.bg-teal-fret[data-v-788bb0b7]{background:#ccfbf1!important}.bg-sky-fret[data-v-788bb0b7]{background:#e0f2fe!important}.bg-blue-fret[data-v-788bb0b7]{background:#dbeafe!important}.bg-indigo-fret[data-v-788bb0b7]{background:#e0e7ff!important}.bg-violet-fret[data-v-788bb0b7]{background:#f3e8ff!important}.bg-fuchsia-fret[data-v-788bb0b7]{background:#fae8ff!important}.bg-purple-fret[data-v-788bb0b7]{background:#f5f3ff!important}.footer[data-v-788bb0b7]{margin-top:auto;padding:16px 0;text-align:center;font-size:11px;color:#8c7f73;border-top:1px solid #eae2d5}.warmup-section[data-v-788bb0b7]{background:#fdfaf2;border:1px dashed #d0c3ab;padding:12px;margin-top:12px;text-align:left}.warmup-title[data-v-788bb0b7]{font-size:11px;font-weight:700;color:#7c2d12;margin-bottom:8px;letter-spacing:.5px}.warmup-grid[data-v-788bb0b7]{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.warmup-btn[data-v-788bb0b7]{background:#fff;border:1px solid #e7dfd5;padding:6px 4px;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:all .1s ease;border-radius:0}.warmup-btn[data-v-788bb0b7]:hover{background:#fefbeb;border-color:#d97706}.warmup-btn[data-v-788bb0b7]:active{transform:scale(.96)}.w-name[data-v-788bb0b7]{font-size:11px;font-weight:700;color:#451a03;line-height:1.2}.w-notes[data-v-788bb0b7]{font-size:8px;color:#854d0e;font-family:JetBrains Mono,monospace;line-height:1;margin-top:2px}@media(max-width:768px){.page[data-v-788bb0b7]{padding:16px 10px 0;align-items:center}.controls[data-v-788bb0b7]{width:100%;display:flex;flex-direction:column;align-items:center}}@media(max-width:640px){.warmup-grid[data-v-788bb0b7]{grid-template-columns:repeat(4,1fr)}}@media(max-width:480px){.warmup-grid[data-v-788bb0b7]{grid-template-columns:repeat(3,1fr)}}.soundbank-status-bar[data-v-788bb0b7]{width:96%;max-width:580px;margin:0 auto 4px;background:transparent;border:none;padding:4px 6px;box-shadow:none}.sb-status[data-v-788bb0b7]{display:flex;align-items:center;justify-content:center;gap:8px;font-size:11px;color:#451a03}.sb-loading[data-v-788bb0b7]{color:#b45309}.sb-success[data-v-788bb0b7]{color:#15803d}.sb-fallback[data-v-788bb0b7]{color:#78716c}.sb-spinner[data-v-788bb0b7]{animation:pitch-bump-788bb0b7 1.5s infinite ease-in-out;display:inline-block}@keyframes pitch-bump-788bb0b7{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-3px) rotate(5deg)}}.zhp-container[data-v-83cb89eb]{min-height:100vh;display:flex;flex-direction:column;align-items:center;background:#f8f5f0;font-family:Arial,sans-serif;color:#333;position:relative;overflow:hidden;padding:20px;box-sizing:border-box;width:100%;max-width:1800px;margin:0 auto}.cloud-decoration[data-v-83cb89eb]{position:absolute;top:0;left:0;width:100%;height:150px;background:url(https://example.com/cloud-pattern.png) repeat-x top center;background-size:auto 100%;opacity:.3;z-index:0;animation:cloudSlide-83cb89eb 20s linear infinite}@keyframes cloudSlide-83cb89eb{0%{background-position:0 0}to{background-position:100% 0}}.music-bg[data-v-83cb89eb]{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.music-note[data-v-83cb89eb]{position:absolute;font-size:14px;color:#666;opacity:.7;animation:fadeUp-83cb89eb 5s ease-in-out infinite}@keyframes fadeUp-83cb89eb{0%{transform:translateY(100vh);opacity:0}20%{opacity:.7}50%{transform:translateY(50vh)}to{transform:translateY(-20px);opacity:0}}h1[data-v-83cb89eb]{font-size:36px;font-weight:700;color:#8b6f47;text-shadow:1px 1px 2px rgba(0,0,0,.1);margin:80px 0 30px;z-index:2;animation:fadeIn-83cb89eb 1s ease forwards}@keyframes fadeIn-83cb89eb{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}table[data-v-83cb89eb]{width:100%;max-width:1200px;margin:0 auto 80px;border-collapse:collapse;background:#fff;box-shadow:0 4px 12px #0000001a;border:2px solid #8b6f47;z-index:2}th[data-v-83cb89eb],td[data-v-83cb89eb]{padding:16px;text-align:left;border-bottom:1px solid #e0e0e0;color:#333;font-size:16px}th[data-v-83cb89eb]{background:#f8f5f0;color:#8b6f47;font-weight:600}tr[data-v-83cb89eb]:nth-child(odd){background:#fff}tr[data-v-83cb89eb]:nth-child(2n){background:#f8f5f0}tr[data-v-83cb89eb]:hover{background:#f0ece3;transition:background .2s ease}.table-link[data-v-83cb89eb]{color:#8b6f47;text-decoration:none;transition:color .2s ease}.table-link[data-v-83cb89eb]:hover{color:#6f5738;text-decoration:underline}footer[data-v-83cb89eb]{position:fixed;bottom:0;left:0;right:0;display:flex;justify-content:center;gap:15px;padding:12px 0;background:#fff;border-top:1px solid #e0e0e0;font-size:14px;color:#666;z-index:2}.footer-link[data-v-83cb89eb]{color:#8b6f47;text-decoration:none;transition:color .2s ease;font-size:15px;font-weight:500}.footer-link[data-v-83cb89eb]:hover{color:#6f5738}@media(max-width:768px){.zhp-container[data-v-83cb89eb]{padding:15px}h1[data-v-83cb89eb]{font-size:28px;margin:60px 0 20px}table[data-v-83cb89eb]{font-size:14px;margin-bottom:60px}th[data-v-83cb89eb],td[data-v-83cb89eb]{padding:12px}.cloud-decoration[data-v-83cb89eb]{height:100px}}@media(max-width:480px){.zhp-container[data-v-83cb89eb]{padding:10px}h1[data-v-83cb89eb]{font-size:24px;margin:50px 0 15px}table[data-v-83cb89eb]{font-size:12px;display:block;overflow-x:auto;white-space:nowrap;margin-bottom:50px}th[data-v-83cb89eb],td[data-v-83cb89eb]{padding:10px;min-width:100px}footer[data-v-83cb89eb]{flex-wrap:wrap;gap:10px;padding:10px}.cloud-decoration[data-v-83cb89eb]{height:80px}}body[data-v-4bbb0531]{font-family:Arial,sans-serif;margin:0;padding:20px;min-height:100vh;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(135deg,#a1c4fd,#c2e9fb);-webkit-user-select:none;user-select:none}.container[data-v-4bbb0531]{display:flex;align-items:flex-start;gap:20px;padding:10px;width:100%;max-width:1200px;margin:0 auto;box-sizing:border-box;flex-grow:1}.left-panel[data-v-4bbb0531],.right-panel[data-v-4bbb0531]{flex:1;padding:20px;box-sizing:border-box;background:#fffc;box-shadow:0 0 15px #0000001a;min-width:320px;border:2px solid rgba(0,0,0,.2)}.left-panel[data-v-4bbb0531]{display:flex;flex-direction:column}.right-panel[data-v-4bbb0531]{display:flex;flex-wrap:wrap;align-items:flex-start;gap:15px}table[data-v-4bbb0531]{margin:0 auto;border-collapse:collapse;background:#ffffffe6;width:100%}th[data-v-4bbb0531],td[data-v-4bbb0531]{padding:8px 12px;border:1px solid rgba(0,0,0,.2);color:#333;cursor:pointer;transition:all .3s ease;text-align:center}th[data-v-4bbb0531]{background:#ffeb3b;color:#333}tr:nth-child(odd) td[data-v-4bbb0531]{background:#ffffffb3}tr:nth-child(2n) td[data-v-4bbb0531]{background:#f0f0f0cc}td[data-v-4bbb0531]:hover{background:#c8c8c880}.highlight[data-v-4bbb0531]{background-color:#ff9800!important;transform:scale(1.05)}.fretboard[data-v-4bbb0531]{display:grid;grid-template-columns:repeat(6,40px);gap:5px;background-color:#ffffffe6;padding:15px;border:3px solid rgba(0,0,0,.2);box-shadow:0 4px 8px #0000001a;max-width:100%;width:fit-content}.fret[data-v-4bbb0531]{display:contents}.string[data-v-4bbb0531]{height:40px;display:flex;align-items:center;justify-content:center;border:1px solid rgba(0,0,0,.2);position:relative;background-color:#fff5e6cc}.string.headstock[data-v-4bbb0531]{background-color:#d3d3d3}.string[data-v-4bbb0531]:before{content:"";position:absolute;top:50%;left:0;right:0;height:3px;background-color:#0000004d}.string.headstock[data-v-4bbb0531]:after{content:attr(data-note);position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);font-size:12px;color:#333}.note[data-v-4bbb0531]{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;font-size:12px;z-index:1}.root-note[data-v-4bbb0531]{background-color:#8bc34a}.third-note[data-v-4bbb0531]{background-color:#ff9800}.fifth-note[data-v-4bbb0531]{background-color:#f44336}.seventh-note[data-v-4bbb0531]{background-color:#2196f3}.all-note[data-v-4bbb0531]{background-color:#c8c8c880;color:#333}.fret-number[data-v-4bbb0531]{position:absolute;top:50%;left:-25px;transform:translateY(-50%);font-size:11px;color:#cf3b11;z-index:2}.controls[data-v-4bbb0531]{display:flex;flex-direction:column;gap:8px;min-width:150px;color:#333}select[data-v-4bbb0531]{padding:6px;font-size:.9em;border:1px solid rgba(0,0,0,.2);background-color:#ffffffe6;color:#333;cursor:pointer}.chord-tabs[data-v-4bbb0531],.display-tabs[data-v-4bbb0531]{display:flex;gap:8px;margin-bottom:8px}.display-tabs[data-v-4bbb0531]{margin-top:15px}.chord-tab[data-v-4bbb0531],.display-tab[data-v-4bbb0531]{padding:4px 8px;background:#ffffffb3;cursor:pointer;color:#333}.chord-tab.active[data-v-4bbb0531],.display-tab.active[data-v-4bbb0531]{background:#ff9800;color:#fff}.show-all-notes[data-v-4bbb0531],.show-root-notes[data-v-4bbb0531]{padding:6px;font-size:.9em;border:1px solid rgba(0,0,0,.2);background-color:#ffffffe6;color:#333;cursor:pointer}.show-all-notes.active[data-v-4bbb0531],.show-root-notes.active[data-v-4bbb0531]{background-color:#ff9800;color:#fff}.chord-display[data-v-4bbb0531]{margin-top:auto;padding:15px;background:#fffc;box-shadow:0 4px 8px #0000001a;color:#333;font-size:1em;text-align:center}.chord-content[data-v-4bbb0531],.scale-content[data-v-4bbb0531]{display:none}.chord-content.active[data-v-4bbb0531],.scale-content.active[data-v-4bbb0531]{display:block}.flat-sign[data-v-4bbb0531]{font-size:.8em;vertical-align:super}.hidden[data-v-4bbb0531]{display:none}@media(max-width:768px){.container[data-v-4bbb0531]{flex-direction:column;align-items:stretch;padding:10px}.left-panel[data-v-4bbb0531],.right-panel[data-v-4bbb0531]{min-width:100%;padding:15px;border:2px solid rgba(0,0,0,.2)}.right-panel[data-v-4bbb0531]{flex-direction:column;align-items:center}.fretboard[data-v-4bbb0531]{grid-template-columns:repeat(6,32px);padding:12px;border:2px solid rgba(0,0,0,.2)}.string[data-v-4bbb0531]{height:32px}.note[data-v-4bbb0531]{width:20px;height:20px;font-size:10px}.fret-number[data-v-4bbb0531]{font-size:10px;left:-20px}.controls[data-v-4bbb0531]{margin-top:15px;width:100%;max-width:200px}.chord-display[data-v-4bbb0531]{font-size:.9em}}@media(max-width:480px){.fretboard[data-v-4bbb0531]{grid-template-columns:repeat(6,24px);padding:10px;border:2px solid rgba(0,0,0,.2)}.string[data-v-4bbb0531]{height:24px}.note[data-v-4bbb0531]{width:16px;height:16px;font-size:8px}.fret-number[data-v-4bbb0531]{font-size:9px;left:-15px}}footer[data-v-4bbb0531]{padding:10px 0;width:100%;text-align:center;color:#adad98;font-size:.9em;border-top:1px solid rgba(0,0,0,.2)}body[data-v-22faa83c]{font-family:Arial,sans-serif;background-color:#fff;color:#333;text-align:center;padding:20px}#container[data-v-22faa83c]{background-color:#fff;min-height:100vh}#container h1[data-v-22faa83c]{text-align:center;font-size:2em;margin-bottom:20px}#top[data-v-22faa83c]{margin-bottom:20px;display:flex;align-items:center;justify-content:center;gap:10px}select[data-v-22faa83c],button[data-v-22faa83c]{padding:10px;font-size:16px;background-color:#fff;border:1px solid #ccc;border-radius:5px;cursor:pointer}#fretboard[data-v-22faa83c]{display:grid;grid-template-rows:repeat(6,60px);grid-template-columns:60px repeat(14,60px);background-color:#fff;margin:20px auto;padding:10px;width:fit-content;box-sizing:border-box}.string-label[data-v-22faa83c]{display:flex;align-items:center;justify-content:center;font-weight:700;border-right:1px solid #ccc}.fret-cell[data-v-22faa83c]{border-right:1px solid #999;border-bottom:1px solid #999;border-top:1px solid #999;display:flex;align-items:center;justify-content:center;box-sizing:border-box;position:relative}.fret-cell.gray[data-v-22faa83c]{background-color:#e8e8e8;pointer-events:none}.fret-cell.correct[data-v-22faa83c]{animation:flash-22faa83c .5s alternate 3}.fret-cell.is-error[data-v-22faa83c]{background-color:red}@keyframes flash-22faa83c{0%{background-color:#87ceeb}to{background-color:#fff}}.fret-cell .note-display[data-v-22faa83c]{position:absolute;font-size:14px;color:#555;pointer-events:none}#fret-numbers[data-v-22faa83c]{display:grid;grid-template-columns:60px repeat(14,60px);margin:20px auto 0;width:fit-content;box-sizing:border-box}#fret-numbers div[data-v-22faa83c]{text-align:center;font-size:14px}#puzzle-area[data-v-22faa83c]{display:flex;flex-wrap:wrap;justify-content:center;margin:20px auto;max-width:600px}.note-block[data-v-22faa83c]{width:60px;height:50px;display:flex;align-items:center;justify-content:center;font-size:18px;font-weight:700;margin:5px;cursor:move;-webkit-user-select:none;user-select:none;box-sizing:border-box}.note-block.natural[data-v-22faa83c]{background-color:#fffacd}.note-block.sharp-flat[data-v-22faa83c]{background-color:#90ee90}.note-block.dragging[data-v-22faa83c]{opacity:.5}#flash[data-v-22faa83c]{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background-color:#000000b3;color:#fff;padding:20px;font-size:28px;font-weight:700;border:2px solid white;opacity:0;transition:opacity .5s ease-in-out;z-index:2000}#flash.show[data-v-22faa83c]{opacity:1}footer[data-v-22faa83c]{margin-top:20px;font-size:14px;color:#666;text-align:center}body[data-v-0c9f43db]{font-family:Arial,sans-serif;background-color:#fff;color:#333;text-align:center;padding:20px}#pyin-container[data-v-0c9f43db]{background-color:#fff;min-height:100vh;max-width:1000px;margin:0 auto;padding:20px;box-sizing:border-box}#pyin-container h1[data-v-0c9f43db]{text-align:center;font-size:2em;margin-bottom:20px}#pyin-top[data-v-0c9f43db]{margin-bottom:20px;display:flex;align-items:center;justify-content:center;gap:10px}select[data-v-0c9f43db],button[data-v-0c9f43db],input[type=checkbox][data-v-0c9f43db]{padding:10px;font-size:16px;background-color:#fff;border:1px solid #ccc;border-radius:5px;cursor:pointer}select[data-v-0c9f43db]:disabled,input[type=checkbox][data-v-0c9f43db]:disabled{background-color:#e8e8e8;cursor:not-allowed}#pyin-fretboard[data-v-0c9f43db]{display:grid;grid-template-rows:repeat(6,60px);grid-template-columns:60px repeat(14,60px);background-color:#fff;margin:20px auto;width:fit-content;box-sizing:border-box;position:relative}.pyin-string-label[data-v-0c9f43db]{display:flex;align-items:center;justify-content:center;font-weight:700;border-right:1px solid #ccc}.pyin-fret-cell[data-v-0c9f43db]{border-right:1px solid #999;border-bottom:1px solid #999;border-top:1px solid #999;display:flex;align-items:center;justify-content:center;box-sizing:border-box;position:relative;min-width:60px;min-height:60px}.pyin-fret-cell.pyin-gray[data-v-0c9f43db]{background-color:#e8e8e8;pointer-events:none}.pyin-fret-cell.pyin-highlighted[data-v-0c9f43db]{background-color:#87ceeb}.pyin-fret-cell .pyin-note-display[data-v-0c9f43db]{position:absolute;font-size:14px;color:#555;pointer-events:none}.pyin-fret-cell .pyin-solfege-display[data-v-0c9f43db]{position:absolute;font-size:14px;color:#d81b60;font-weight:700;pointer-events:none;top:10px}#pyin-fret-numbers[data-v-0c9f43db]{display:grid;grid-template-columns:60px repeat(14,60px);margin:0 auto;width:fit-content;box-sizing:border-box}#pyin-fret-numbers div[data-v-0c9f43db]{text-align:center;font-size:14px}footer[data-v-0c9f43db]{margin-top:20px;font-size:14px;color:#666;text-align:center}:where(#app[data-v-1552bc0f]){background-color:#fff!important}.zxpt-container[data-v-1552bc0f]{font-family:Arial,sans-serif;background-color:#fff;color:#333;text-align:center;padding:20px;min-height:100vh;width:100%;box-sizing:border-box;display:flex;flex-direction:column;align-items:center}.zxpt-container h1[data-v-1552bc0f]{font-size:2em;margin-bottom:20px}.zxpt-top[data-v-1552bc0f]{margin-bottom:20px;display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;width:100%;max-width:900px}.zxpt-top select[data-v-1552bc0f],.zxpt-top button[data-v-1552bc0f]{padding:10px;font-size:16px;background-color:#fff;border:1px solid #ccc;border-radius:0;cursor:pointer}.zxpt-result-text[data-v-1552bc0f]{font-size:16px;color:#333;margin-left:10px}.zxpt-fretboard[data-v-1552bc0f]{display:grid;grid-template-rows:repeat(6,60px);grid-template-columns:60px repeat(13,60px);background-color:#fff;margin:20px auto;padding:10px;width:fit-content;box-sizing:border-box;border:2px solid #ccc}.zxpt-string-label[data-v-1552bc0f]{display:flex;align-items:center;justify-content:center;font-weight:700;border-right:1px solid #ccc;background-color:#fff}.zxpt-fret-cell[data-v-1552bc0f]{border-right:1px solid #999;border-bottom:1px solid #999;border-top:1px solid #999;display:flex;align-items:center;justify-content:center;box-sizing:border-box;position:relative;background-color:#fff;min-height:60px}.zxpt-fret-cell.zxpt-gray[data-v-1552bc0f]{background-color:#e8e8e8;pointer-events:none}.zxpt-fret-cell.zxpt-correct[data-v-1552bc0f]{background-color:#87ceeb;animation:zxpt-flash-1552bc0f .5s alternate 3}.zxpt-fret-cell.zxpt-is-error[data-v-1552bc0f]{background-color:red}@keyframes zxpt-flash-1552bc0f{0%{background-color:#87ceeb}to{background-color:#fff}}.zxpt-fret-cell.zxpt-highlight[data-v-1552bc0f]{background-color:#ff0;animation:zxpt-blink-1552bc0f 1s infinite}@keyframes zxpt-blink-1552bc0f{0%{background-color:#fff}50%{background-color:#ff0}to{background-color:#fff}}.zxpt-fret-cell .zxpt-note-display[data-v-1552bc0f]{position:absolute;font-size:14px;color:#555;pointer-events:none}.zxpt-fret-numbers[data-v-1552bc0f]{display:grid;grid-template-columns:60px repeat(13,60px);margin:0 auto 20px;width:fit-content;box-sizing:border-box}.zxpt-fret-numbers div[data-v-1552bc0f]{text-align:center;font-size:14px}.zxpt-options-area[data-v-1552bc0f]{display:flex;flex-wrap:wrap;justify-content:center;margin:20px auto;max-width:600px}.zxpt-option-button[data-v-1552bc0f]{padding:15px 30px;margin:10px;font-size:20px;background-color:#f0f0f0;border:2px solid #ccc;border-radius:0;cursor:pointer;transition:all .3s}.zxpt-option-button[data-v-1552bc0f]:hover{background-color:#ddd}.zxpt-option-button.zxpt-selected.zxpt-correct[data-v-1552bc0f]{background-color:#87ceeb;border-color:#00f}.zxpt-option-button.zxpt-selected.zxpt-error[data-v-1552bc0f]{background-color:red;border-color:#900}.zxpt-footer[data-v-1552bc0f]{margin-top:20px;font-size:14px;color:#666;text-align:center}:where(#app[data-v-dec30ac5]){background-color:#fff!important}.zxpt-container[data-v-dec30ac5]{font-family:Arial,sans-serif;background-color:#fff;color:#333;text-align:center;padding:20px;min-height:100vh;width:100%;box-sizing:border-box;display:flex;flex-direction:column;align-items:center}.zxpt-container h1[data-v-dec30ac5]{font-size:2em;margin-bottom:20px}.zxpt-top[data-v-dec30ac5]{margin-bottom:20px;display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap;width:100%;max-width:900px}.zxpt-top select[data-v-dec30ac5],.zxpt-top button[data-v-dec30ac5],.zxpt-top input[data-v-dec30ac5]{padding:10px;font-size:16px;background-color:#fff;border:1px solid #ccc;border-radius:0;cursor:pointer}.zxpt-top input[type=checkbox][data-v-dec30ac5]{margin-right:5px}.zxpt-question-text[data-v-dec30ac5]{font-size:16px;color:#fff;background-color:#ff8c00;padding:5px 10px;margin-left:10px}.zxpt-fretboard[data-v-dec30ac5]{display:grid;grid-template-rows:repeat(6,60px);grid-template-columns:repeat(14,60px);background-color:#fff;margin:20px auto;padding:10px;width:fit-content;box-sizing:border-box;border:2px solid #ccc}.zxpt-fret-cell[data-v-dec30ac5]{border:1px solid #999;display:flex;align-items:center;justify-content:center;box-sizing:border-box;position:relative;background-color:#fff;min-height:60px;cursor:pointer}.zxpt-fret-cell.zxpt-gray[data-v-dec30ac5]{background-color:#e8e8e8;pointer-events:none;cursor:default}.zxpt-fret-cell.zxpt-hint[data-v-dec30ac5]{background-color:beige!important}.zxpt-fret-cell.zxpt-hint .zxpt-note-display[data-v-dec30ac5]{color:#000}.zxpt-fret-cell.zxpt-correct[data-v-dec30ac5]{background-color:#87ceeb!important;animation:zxpt-flash-dec30ac5 .5s alternate 3}.zxpt-fret-cell.zxpt-is-error[data-v-dec30ac5]{background-color:red!important}.zxpt-fret-cell.zxpt-fret-x[data-v-dec30ac5]{background-color:#e0e0e0;pointer-events:none}.zxpt-fret-cell.zxpt-fret-x .zxpt-note-display[data-v-dec30ac5]{color:red;font-weight:700}@keyframes zxpt-flash-dec30ac5{0%{background-color:#87ceeb}to{background-color:#fff}}.zxpt-fret-cell .zxpt-note-display[data-v-dec30ac5]{position:absolute;font-size:14px;color:#555;pointer-events:none}.zxpt-fret-numbers[data-v-dec30ac5]{display:grid;grid-template-columns:repeat(14,60px);margin:0 auto 20px;width:fit-content;box-sizing:border-box}.zxpt-fret-numbers div[data-v-dec30ac5]{text-align:center;font-size:14px}.zxpt-result-box[data-v-dec30ac5]{margin:20px auto;padding:10px;border:1px solid #ccc;background-color:#f9f9f9;max-width:600px;text-align:left}.zxpt-result-box h2[data-v-dec30ac5]{font-size:18px;margin-bottom:10px}.zxpt-result-box p[data-v-dec30ac5]{margin:5px 0}.zxpt-footer[data-v-dec30ac5]{margin-top:20px;font-size:14px;color:#666;text-align:center}.qtzs-container[data-v-b7913ae3]{max-width:800px;margin:0 auto;padding:20px;text-align:center;font-family:Arial,sans-serif;background-color:#fff;min-height:100vh}.qtzs-game-controls[data-v-b7913ae3]{margin:20px 0}.qtzs-string-selection[data-v-b7913ae3]{margin-bottom:20px}.qtzs-string-options[data-v-b7913ae3]{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.qtzs-string-options button[data-v-b7913ae3]{padding:5px 10px;border:1px solid #000;background:#fff;cursor:pointer;font-size:1em}.qtzs-string-options button.qtzs-selected[data-v-b7913ae3]{background:#000;color:#fff}.qtzs-timer[data-v-b7913ae3]{font-size:1.2em;margin-top:10px}.qtzs-message[data-v-b7913ae3]{font-size:1.1em;margin:20px 0;font-weight:700}.qtzs-fretboard[data-v-b7913ae3]{margin:20px 0;padding:10px}.qtzs-frets[data-v-b7913ae3]{display:flex;justify-content:center;gap:5px}.qtzs-frets button[data-v-b7913ae3]{width:40px;height:40px;border:1px solid #000;background:#fff;cursor:pointer;font-size:1em;line-height:40px;text-align:center}.qtzs-frets button.qtzs-highlighted[data-v-b7913ae3]{background:#ff0}.qtzs-controls[data-v-b7913ae3]{margin:20px 0}.qtzs-controls button[data-v-b7913ae3]{padding:10px 20px;margin:0 5px;background:#000;color:#fff;border:none;cursor:pointer;font-size:1em}.qtzs-controls button[data-v-b7913ae3]:hover{background:#333}.qtzs-instructions[data-v-b7913ae3]{text-align:left;margin-top:30px}.qtzs-instructions ul[data-v-b7913ae3]{list-style-type:disc;margin-left:20px}.qtzs-instructions p[data-v-b7913ae3]{margin-top:20px;font-size:.9em;color:#666}/*! tailwindcss v4.3.0 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){[data-v-12a134f1],[data-v-12a134f1]:before,[data-v-12a134f1]:after,[data-v-12a134f1]::backdrop{--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000}}}.fretmaster-page[data-v-12a134f1]{z-index:9999;-webkit-user-select:none;user-select:none;font-family:Segoe UI,system-ui,sans-serif;position:fixed;top:0;right:0;bottom:0;left:0;background:#1c1917!important}.fretboard-wrapper[data-v-12a134f1]{width:fit-content;margin:0 auto}.fretboard-scroll[data-v-12a134f1]{background:#2c241b!important;overflow:hidden!important}.marker[data-v-12a134f1]{z-index:50;height:calc(var(--spacing,.25rem) * 16);width:calc(var(--spacing,.25rem) * 16);font-size:var(--text-3xl,1.875rem);line-height:var(--tw-leading,var(--text-3xl--line-height, 1.2 ));--tw-font-weight:var(--font-weight-black,900);font-weight:var(--font-weight-black,900);color:var(--color-white,#fff);--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow);justify-content:center;align-items:center;transition:all .35s cubic-bezier(.34,1.56,.64,1);display:flex;position:absolute;transform:scale(0)}.marker.visible[data-v-12a134f1]{transform:scale(1)}.marker.correct[data-v-12a134f1]{background:#22c55e;box-shadow:0 0 40px #22c55e}.marker.wrong[data-v-12a134f1]{background:#ef4444;box-shadow:0 0 40px #ef4444}@keyframes pop-12a134f1{0%{opacity:0;transform:scale(0)rotate(-40deg)}to{opacity:1;transform:scale(1)rotate(0)}}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}.tm-wrapper[data-v-51a37ed5]{min-height:100vh;background:#faf9f7;font-family:霞鹜文楷,Noto Sans SC,system-ui,sans-serif}[data-v-51a37ed5] .tm-wrapper{background:#faf9f7!important}.tm-header[data-v-51a37ed5]{text-align:center;padding:3rem 1rem 2rem;background:linear-gradient(135deg,#fdfcf8,#f2efea)}.tm-title[data-v-51a37ed5]{margin:0;font-size:2.6rem;font-weight:400;color:#4a6e6a}.tm-container[data-v-51a37ed5]{max-width:1260px;margin:0 auto;padding:2rem 1rem}.tm-controls[data-v-51a37ed5]{text-align:center;margin-bottom:2rem;display:flex;flex-wrap:wrap;gap:1rem;justify-content:center;align-items:center}.tm-select[data-v-51a37ed5],.tm-btn[data-v-51a37ed5]{padding:.8rem 1.2rem;font-size:1rem;border:2px solid #4a6e6a;border-radius:0;cursor:pointer;background:#fff;color:#4a6e6a}.tm-btn[data-v-51a37ed5]{background:#4a6e6a;color:#fff}.tm-btn[data-v-51a37ed5]:hover{background:#2d3f3b}.tm-fretboard[data-v-51a37ed5]{background:#fdf9f0;padding:80px 40px 140px;border:6px solid #d4d0c8;position:relative;box-shadow:0 20px 60px #00000038}.tm-grid[data-v-51a37ed5]{position:relative;width:1160px;height:420px;margin:0 auto;background-color:#fdf9f0}.tm-strings-bg[data-v-51a37ed5]{position:absolute;top:0;bottom:0;left:118px;width:960px;z-index:2;pointer-events:none;background:linear-gradient(to bottom,transparent 34px,#b8b8b8 34px,#b8b8b8 36px,transparent 38px);background-size:100% 70px;background-repeat:repeat-y}.tm-grid[data-v-51a37ed5]{background:linear-gradient(to right,transparent 0px,#a8a8a8 3px,transparent 6px) 100px 0 / 80px 100% repeat-x}.tm-nut[data-v-51a37ed5]{position:absolute;left:100px;top:0;bottom:0;width:18px;background:#1a1a1a;z-index:5}.tm-double-fret[data-v-51a37ed5]{position:absolute;left:1060px;top:0;bottom:0;width:10px;background:#888;z-index:4}.tm-headstock[data-v-51a37ed5]{position:absolute;left:28px;top:50%;transform:translateY(-50%);font:700 25px/2.75 monospace;color:#222;letter-spacing:7px}.tm-cells[data-v-51a37ed5]{position:absolute;top:0;left:118px;width:960px;height:420px;display:grid;grid-template-columns:repeat(12,80px);grid-template-rows:repeat(6,70px);z-index:10}.tm-row[data-v-51a37ed5]{display:contents}.tm-cell[data-v-51a37ed5]{position:relative}.tm-dot[data-v-51a37ed5]{position:absolute;width:50px;height:50px;border-radius:50%;left:50%;top:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:16px;color:#fff;box-shadow:0 6px 22px #00000080;z-index:30}.tm-dot-root[data-v-51a37ed5]{background:#d9665a}.tm-dot-third[data-v-51a37ed5]{background:#4a6e6a}.tm-dot-fifth[data-v-51a37ed5]{background:#889896}.tm-fret-labels[data-v-51a37ed5]{position:absolute;bottom:-58px;left:118px;width:960px;display:flex;justify-content:space-between;font-weight:700;color:#444;font-size:19px}.tm-fl[data-v-51a37ed5]{width:80px;text-align:center;position:relative}.tm-fl[data-v-51a37ed5]:before{content:"";display:inline-block;width:13px;height:13px;border-radius:50%;background:#999;margin-right:8px;vertical-align:middle}.tm-fl[data-v-51a37ed5]:nth-child(3):before,.tm-fl[data-v-51a37ed5]:nth-child(5):before,.tm-fl[data-v-51a37ed5]:nth-child(7):before,.tm-fl[data-v-51a37ed5]:nth-child(9):before{background:#777}.tm-fl[data-v-51a37ed5]:nth-child(12):before{width:19px;height:19px;background:#555}.tm-legend[data-v-51a37ed5]{display:flex;justify-content:center;gap:3rem;margin-top:4rem}.tm-legend-item[data-v-51a37ed5]{display:flex;align-items:center;gap:.8rem;font-size:1.1rem}.tm-legend-dot[data-v-51a37ed5]{width:24px;height:24px;border-radius:50%}.tm-footer[data-v-51a37ed5]{width:100%;max-width:1200px;margin:4rem auto 2rem;text-align:center;color:#666}[data-v-5623704b]{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}.main-container[data-v-5623704b]{width:100%;min-height:100vh;background-color:#f5f5f5;color:#333;display:flex;justify-content:center;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}.content-wrapper[data-v-5623704b]{width:100%;max-width:1200px;padding:15px;display:flex;flex-direction:column}h1[data-v-5623704b]{text-align:center;margin-bottom:20px;color:#2c3e50;font-size:1.5rem}.game-container[data-v-5623704b]{background-color:#fff;box-shadow:0 4px 16px #0000000f;padding:20px;margin-bottom:20px;border-radius:8px}.controls-header[data-v-5623704b]{margin-bottom:20px;border-bottom:2px solid #eee;padding-bottom:10px}.main-mode-tabs[data-v-5623704b]{display:flex;gap:10px;justify-content:center}.mode-tab[data-v-5623704b]{padding:10px 20px;border:none;background:transparent;font-size:1rem;font-weight:700;color:#7f8c8d;cursor:pointer;border-bottom:3px solid transparent;transition:all .3s}.mode-tab.active[data-v-5623704b]{color:#3498db;border-bottom-color:#3498db}.mode-tab[data-v-5623704b]:disabled{opacity:.5;cursor:not-allowed}.controls[data-v-5623704b]{display:flex;flex-direction:column;gap:15px;margin-bottom:25px}@media(min-width:768px){.controls[data-v-5623704b]{flex-direction:row;justify-content:space-between;align-items:flex-end}}.control-group[data-v-5623704b]{display:flex;flex-direction:column;gap:15px;flex:1}.sub-selector[data-v-5623704b]{display:flex;flex-direction:column;gap:10px}.sub-selector label[data-v-5623704b],.mode-selector label[data-v-5623704b]{font-weight:700;font-size:.9rem;color:#555}.selector-options[data-v-5623704b]{display:flex;flex-wrap:wrap;gap:8px}.radio-option[data-v-5623704b]{position:relative}.radio-option input[type=radio][data-v-5623704b]{position:absolute;opacity:0;width:100%;height:100%;cursor:pointer;z-index:1}.radio-option label[data-v-5623704b]{display:block;padding:8px 12px;background-color:#f8f9fa;border:1px solid #dee2e6;border-radius:4px;text-align:center;font-size:.9rem;color:#495057;transition:all .2s;min-width:60px}.radio-option input[type=radio]:checked+label[data-v-5623704b]{background-color:#3498db;color:#fff;border-color:#2980b9;font-weight:600;box-shadow:0 2px 4px #3498db4d}.mode-selector[data-v-5623704b]{margin-top:5px}.toggle-option[data-v-5623704b]{position:relative;display:inline-block}.toggle-option input[type=checkbox][data-v-5623704b]{position:absolute;opacity:0;width:100%;height:100%;cursor:pointer;z-index:1}.toggle-option .checkbox-label[data-v-5623704b]{display:flex;align-items:center;gap:8px;padding:8px 15px;background-color:#f8f9fa;border:1px solid #dee2e6;border-radius:4px;color:#495057;transition:all .2s;cursor:pointer}.toggle-option input[type=checkbox]:checked+.checkbox-label[data-v-5623704b]{background-color:#9b59b6;color:#fff;border-color:#8e44ad}.timer[data-v-5623704b]{font-size:1.1em;font-weight:700;display:flex;align-items:center;justify-content:center;gap:8px;background-color:#fff3cd;color:#856404;padding:10px 20px;border-radius:4px;white-space:nowrap}.timer span[data-v-5623704b]{color:#e74c3c;font-size:1.2em}.progress[data-v-5623704b]{height:8px;background-color:#e9ecef;border-radius:4px;margin-bottom:20px;overflow:hidden}.progress-bar[data-v-5623704b]{height:100%;background-color:#2ecc71;width:0%;transition:width .3s ease-out}.status[data-v-5623704b]{text-align:center;font-size:1.1em;min-height:28px;margin-bottom:15px;font-weight:700}.status.success[data-v-5623704b]{color:#27ae60}.status.error[data-v-5623704b]{color:#e74c3c}.fretboard-wrapper[data-v-5623704b]{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-bottom:20px;padding-bottom:5px}.fretboard-container[data-v-5623704b]{min-width:340px}.fretboard[data-v-5623704b]{display:grid;grid-template-columns:30px repeat(13,1fr);gap:2px;background-color:#2c3e50;border:4px solid #2c3e50;border-radius:4px}.tuning-label[data-v-5623704b]{display:flex;align-items:center;justify-content:center;background-color:#34495e;color:#fff;font-weight:700;font-size:.85rem}.fret[data-v-5623704b]{aspect-ratio:1.1/1;background-color:#fcfcfc;display:flex;align-items:center;justify-content:center;position:relative;cursor:default;transition:background-color .2s}.fret.open-string[data-v-5623704b]{background-color:#ecf0f1;border-right:2px solid #bdc3c7}.fret.inactive-zone[data-v-5623704b]{background-color:#e0e0e0;opacity:.7;filter:grayscale(100%);background-image:repeating-linear-gradient(45deg,transparent,transparent 5px,rgba(0,0,0,.03) 5px,rgba(0,0,0,.03) 10px)}.fret.active[data-v-5623704b]{background-color:#3498db!important;opacity:1!important;z-index:2;box-shadow:0 0 10px #3498db99;animation:pulse-5623704b 1.5s infinite;border-radius:4px}@keyframes pulse-5623704b{0%{transform:scale(.95)}50%{transform:scale(.85)}to{transform:scale(.95)}}.fret.show-note[data-v-5623704b]:after{content:attr(data-note);font-size:12px;font-weight:700;color:#2c3e50}.fret.inactive-zone.show-note[data-v-5623704b]:after{color:#7f8c8d}.fret.revealed-target[data-v-5623704b]:after{content:attr(data-note);font-size:20px;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.4);animation:note-flash-5623704b .5s infinite alternate;z-index:10;display:block}@keyframes note-flash-5623704b{0%{transform:scale(1);opacity:.8}to{transform:scale(1.3);opacity:1}}.fret-numbers[data-v-5623704b]{display:grid;grid-template-columns:30px repeat(13,1fr);gap:2px;margin-top:5px}.fret-number[data-v-5623704b]{text-align:center;font-weight:700;color:#7f8c8d;font-size:.75rem}.options[data-v-5623704b]{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-top:20px}@media(min-width:600px){.options[data-v-5623704b]{grid-template-columns:repeat(4,1fr)}}.option[data-v-5623704b]{padding:16px;background-color:#fff;border:2px solid #e9ecef;border-radius:8px;text-align:center;font-size:1.25rem;font-weight:700;cursor:pointer;transition:all .2s;color:#495057;-webkit-user-select:none;user-select:none}.option[data-v-5623704b]:hover{background-color:#f8f9fa;border-color:#adb5bd}.option[data-v-5623704b]:active{transform:scale(.98)}.option.correct[data-v-5623704b]{background-color:#2ecc71;border-color:#27ae60;color:#fff;box-shadow:0 4px 6px #2ecc7133}.option.incorrect[data-v-5623704b]{background-color:#e74c3c;border-color:#c0392b;color:#fff;animation:shake-5623704b .4s}@keyframes shake-5623704b{10%,90%{transform:translate(-2px)}20%,80%{transform:translate(4px)}30%,50%,70%{transform:translate(-6px)}40%,60%{transform:translate(6px)}}.buttons[data-v-5623704b]{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:25px}button[data-v-5623704b]{padding:14px;border:none;border-radius:6px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .2s}#startBtn[data-v-5623704b]{background-color:#3498db;color:#fff}#startBtn[data-v-5623704b]:active{transform:translateY(2px)}#startBtn[data-v-5623704b]:disabled{background-color:#bdc3c7;cursor:not-allowed;transform:none}#showNotesBtn[data-v-5623704b]{background-color:#95a5a6;color:#fff}#showNotesBtn[data-v-5623704b]:hover{background-color:#7f8c8d}.instructions[data-v-5623704b]{background-color:#fff;padding:20px;border-left:5px solid #3498db;border-radius:4px;margin-top:30px;font-size:.9rem;color:#555;line-height:1.6;box-shadow:0 2px 8px #0000000d}.instructions li[data-v-5623704b]{margin-bottom:8px;list-style-position:inside}