:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;--bg-color: #ffffff;--text-main: #2c3e50;--text-sub: #6c757d;--text-dim: #666666;--bg-panel: #f8f9fa;--bg-card: #ffffff;--border-color: #dee2e6;--primary-color: #42b883;--primary-text: #ffffff;--secondary-bg: #6c757d;--secondary-text: #ffffff;--hover-bg: #f0fdf4;--hover-border: #42b883;--key-white-bg: #ffffff;--key-white-text: #000000;--key-black-bg: #333333;--key-black-text: #ffffff;--replay-btn-bg: #ffffff;--replay-btn-hover: #eeeeee;--replay-btn-border: #cccccc;--shadow-color: rgba(0,0,0,.1);--btn-default-bg: #1a1a1a;--btn-default-text: #ffffff;color:var(--text-main);background-color:var(--bg-color);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}#app{max-width:1280px;margin:0 auto;padding:2rem;text-align:center}@media (max-width: 900px){#app{padding:1.5rem}}@media (max-width: 600px){#app{padding:1rem}}@media (max-width: 480px){#app{padding:.75rem}}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:var(--btn-default-bg);color:var(--btn-default-text);cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: dark){:root{--bg-color: #242424;--text-main: rgba(255, 255, 255, .87);--text-sub: rgba(255, 255, 255, .6);--text-dim: rgba(255, 255, 255, .5);--bg-panel: #2f2f2f;--bg-card: #3a3a3a;--border-color: #444444;--primary-color: #42b883;--primary-text: #ffffff;--secondary-bg: #4a4a4a;--secondary-text: #ffffff;--hover-bg: #2f3e35;--hover-border: #42b883;--key-white-bg: #e0e0e0;--key-white-text: #000000;--key-black-bg: #111111;--key-black-text: #eeeeee;--replay-btn-bg: #3a3a3a;--replay-btn-hover: #4a4a4a;--replay-btn-border: #555555;--shadow-color: rgba(0,0,0,.5);--btn-default-bg: #1a1a1a;--btn-default-text: #ffffff}}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff;--btn-default-bg: #f9f9f9;--btn-default-text: #213547}}.timer[data-v-9e5c81cd]{font-weight:700;color:var(--text-main);font-variant-numeric:tabular-nums}.header[data-v-b6e3a514]{position:relative;display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;border-bottom:1px solid var(--border-color);padding-bottom:15px;gap:20px}.back-link[data-v-b6e3a514]{background:none;border:none;color:var(--text-dim);cursor:pointer;font-size:1rem;transition:color .2s;white-space:nowrap;flex-shrink:0}.back-link[data-v-b6e3a514]:hover{color:var(--text-main)}.stats[data-v-b6e3a514]{display:flex;gap:20px;font-weight:700;color:var(--text-main);align-items:center;flex-wrap:wrap;margin-left:auto}.note-grid-wrapper[data-v-d29ea1ba]{width:100%}.clear-button-container[data-v-d29ea1ba]{display:flex;justify-content:center;margin-bottom:15px}.clear-btn[data-v-d29ea1ba]{padding:8px 16px;background-color:var(--bg-panel);border:2px solid var(--border-color);border-radius:6px;cursor:pointer;font-size:.9rem;color:var(--text-main);transition:all .2s}.clear-btn[data-v-d29ea1ba]:hover{background-color:var(--hover-bg);border-color:var(--hover-border);transform:translateY(-1px)}.options-container[data-v-d29ea1ba]{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:700px;margin:0 auto}.note-btn[data-v-d29ea1ba]{width:70px;height:100px;border:1px solid var(--border-color);border-radius:0 0 5px 5px;background:var(--key-white-bg);color:var(--key-white-text);cursor:pointer;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:10px;font-weight:700;box-shadow:0 2px 5px var(--shadow-color);transition:all .1s;position:relative;-webkit-user-select:none;user-select:none}.note-btn.black[data-v-d29ea1ba]{background:var(--key-black-bg);color:var(--key-black-text);height:65px;border:none}.note-btn[data-v-d29ea1ba]:hover:not(:disabled){transform:translateY(2px)}.note-btn[data-v-d29ea1ba]:active:not(:disabled){transform:translateY(4px)}.note-btn.correct[data-v-d29ea1ba]{background-color:#4ed07d!important;color:#fff!important;border-color:#4ed07d}.note-btn.wrong[data-v-d29ea1ba]{background-color:#ff6b6b!important;color:#fff!important;border-color:#ff6b6b}.note-btn.correct-answer[data-v-d29ea1ba]{background-color:#9acd32!important;color:#fff!important;border-color:#7cb342;box-shadow:0 0 10px #9acd3280}.note-btn.dimmed[data-v-d29ea1ba]{opacity:.5}.note-btn.in-sequence[data-v-d29ea1ba]{border:2px solid var(--primary-color)}.sequence-badge[data-v-d29ea1ba]{position:absolute;top:5px;right:5px;min-width:24px;height:24px;padding:0 6px;border-radius:12px;background-color:var(--primary-color);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:700;white-space:nowrap}.note-name[data-v-d29ea1ba]{font-size:1rem}.note-val[data-v-d29ea1ba]{font-size:.8rem;margin-top:5px;opacity:.7}.chromatic-mode[data-v-d29ea1ba]{gap:8px}.chromatic-mode .note-btn[data-v-d29ea1ba]{font-size:.9rem;width:60px}.note-btn.special-btn[data-v-d29ea1ba]{background:var(--bg-panel);border:2px solid var(--border-color);border-radius:8px;height:100px}.note-btn.sustain-btn[data-v-d29ea1ba]{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.note-btn.rest-btn[data-v-d29ea1ba]{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff}.note-btn.special-btn[data-v-d29ea1ba]:hover:not(:disabled){opacity:.9;transform:translateY(2px)}.reference-toggle[data-v-7cc337bf]{display:flex;align-items:center;gap:10px;cursor:pointer;-webkit-user-select:none;user-select:none;padding:8px 12px;border-radius:6px;transition:background-color .2s}.reference-toggle[data-v-7cc337bf]:hover{background-color:var(--bg-panel)}.toggle-input[data-v-7cc337bf]{width:40px;height:20px;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:var(--border-color);border-radius:10px;position:relative;cursor:pointer;transition:background-color .3s}.toggle-input[data-v-7cc337bf]:checked{background-color:var(--primary-color)}.toggle-input[data-v-7cc337bf]:before{content:"";position:absolute;width:16px;height:16px;border-radius:50%;background-color:#fff;top:2px;left:2px;transition:transform .3s;box-shadow:0 1px 3px #0000004d}.toggle-input[data-v-7cc337bf]:checked:before{transform:translate(20px)}.toggle-label[data-v-7cc337bf]{font-size:.9rem;color:var(--text-main)}.game-result[data-v-d19af00f]{margin:20px 0}.final-score[data-v-d19af00f]{font-size:2rem;font-weight:700;color:var(--primary-color);margin:20px 0}.final-time[data-v-d19af00f]{font-size:1.2rem;color:var(--text-sub);margin-bottom:30px}.action-buttons[data-v-d19af00f]{margin-top:20px;display:flex;gap:15px;justify-content:center}.primary-btn[data-v-d19af00f],.secondary-btn[data-v-d19af00f]{padding:10px 25px;font-size:1.1rem;border-radius:5px;cursor:pointer;border:none;transition:all .2s}.primary-btn[data-v-d19af00f]{background-color:var(--primary-color);color:var(--primary-text)}.primary-btn[data-v-d19af00f]:hover{opacity:.9;transform:translateY(-1px)}.secondary-btn[data-v-d19af00f]{background-color:var(--secondary-bg);color:var(--secondary-text)}.secondary-btn[data-v-d19af00f]:hover{opacity:.9;transform:translateY(-1px)}.level-map[data-v-289d98b6]{position:relative;width:100%;max-width:600px;margin:10px auto;aspect-ratio:2 / 3;min-height:700px}@media (max-width: 900px){.level-map[data-v-289d98b6]{max-width:500px;min-height:620px;margin:8px auto}}@media (max-width: 600px){.level-map[data-v-289d98b6]{max-width:100%;min-height:560px;margin:6px auto}}@media (max-width: 480px){.level-map[data-v-289d98b6]{max-width:100%;min-height:500px;margin:4px auto}}.map-svg[data-v-289d98b6]{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none}.connection-line[data-v-289d98b6]{stroke:var(--border-color);stroke-width:2;opacity:.3;transition:all .3s ease}.connection-line.unlocked-path[data-v-289d98b6]{stroke:var(--primary-color);opacity:.6}.nodes-container[data-v-289d98b6]{position:relative;width:100%;height:100%}.level-node[data-v-289d98b6]{position:absolute;width:90px;height:60px;border-radius:8px;border:2px solid var(--border-color);background-color:var(--bg-panel);cursor:pointer;transition:all .3s ease;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:6px;box-sizing:border-box;color:var(--text-main)}.level-node.unlocked[data-v-289d98b6]{border-color:var(--primary-color);background-color:var(--bg-panel)}.level-node.unlocked[data-v-289d98b6]:hover{border-color:var(--hover-border);background-color:var(--hover-bg);transform:translate(-50%,-50%) scale(1.1);box-shadow:0 4px 12px #0003}.level-node.completed[data-v-289d98b6]{background-color:var(--primary-color);color:var(--primary-text);border-color:var(--primary-color)}.level-node.locked[data-v-289d98b6]{opacity:.4;cursor:not-allowed;background-color:var(--bg-panel);border-color:var(--border-color)}.node-number[data-v-289d98b6]{font-size:1rem;font-weight:700;margin-bottom:2px}.node-name[data-v-289d98b6]{font-size:.65rem;text-align:center;line-height:1.2;word-break:keep-all}@media (max-width: 900px){.level-node[data-v-289d98b6]{width:80px;height:55px}.node-number[data-v-289d98b6]{font-size:.9rem}.node-name[data-v-289d98b6]{font-size:.6rem}}@media (max-width: 600px){.level-node[data-v-289d98b6]{width:70px;height:50px;padding:4px}.node-number[data-v-289d98b6]{font-size:.85rem;margin-bottom:1px}.node-name[data-v-289d98b6]{font-size:.5rem}}@media (max-width: 480px){.level-node[data-v-289d98b6]{width:60px;height:45px;padding:3px}.node-number[data-v-289d98b6]{font-size:.75rem;margin-bottom:1px}.node-name[data-v-289d98b6]{font-size:.45rem}}.game-container[data-v-c213e819]{max-width:800px;margin:0 auto;padding:20px;text-align:center;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:var(--text-main)}@media (max-width: 900px){.game-container[data-v-c213e819]{padding:15px}}@media (max-width: 600px){.game-container[data-v-c213e819]{padding:10px}}@media (max-width: 480px){.game-container[data-v-c213e819]{padding:8px}}.menu[data-v-c213e819]{margin-top:40px}.menu p[data-v-c213e819]{margin-bottom:20px}.level-buttons[data-v-c213e819]{display:flex;flex-direction:column;align-items:center;gap:20px;justify-content:center;margin-top:30px}.level-btn[data-v-c213e819]{padding:20px;width:100%;max-width:300px;display:flex;flex-direction:column;align-items:center;background-color:var(--bg-panel);border:2px solid var(--border-color);border-radius:8px;cursor:pointer;transition:all .2s;color:var(--text-main)}.level-btn[data-v-c213e819]:hover{border-color:var(--hover-border);background-color:var(--hover-bg);transform:translateY(-2px)}.level-btn strong[data-v-c213e819]{font-size:1.5rem;margin-bottom:8px;color:var(--text-main)}.level-btn span[data-v-c213e819]{font-size:.9rem;color:var(--text-sub)}.intro[data-v-c213e819]{margin-top:50px;position:relative}.intro .back-link[data-v-c213e819]{position:absolute;top:-200px;left:0;background:none;border:none;color:var(--text-dim);cursor:pointer;font-size:1rem;transition:color .2s;padding:0}.intro .back-link[data-v-c213e819]:hover{color:var(--text-main)}.sub-text[data-v-c213e819]{color:var(--text-sub);font-size:.9rem;display:block;margin-top:10px}.intro-toggle[data-v-c213e819]{margin:20px 0}.action-buttons[data-v-c213e819]{margin-top:20px}.primary-btn[data-v-c213e819]{padding:10px 25px;font-size:1.1rem;border-radius:5px;cursor:pointer;border:none;background-color:var(--primary-color);color:var(--primary-text);transition:all .2s}.primary-btn[data-v-c213e819]:hover{opacity:.9;transform:translateY(-1px)}.play-area[data-v-c213e819]{margin-top:20px}.status-box[data-v-c213e819]{background:var(--bg-panel);border-radius:8px;padding:20px;margin-bottom:30px;display:flex;flex-direction:column;align-items:center;gap:15px}.status-text[data-v-c213e819]{font-size:1.4rem;font-weight:600;min-height:1.6em;margin:0;color:var(--text-main)}.replay-btn[data-v-c213e819]{background:var(--replay-btn-bg);border:1px solid var(--replay-btn-border);padding:8px 16px;border-radius:20px;cursor:pointer;font-size:.9rem;color:var(--text-main);transition:all .2s}.replay-btn[data-v-c213e819]:hover:not(:disabled){background:var(--replay-btn-hover)}.replay-btn[data-v-c213e819]:disabled{opacity:.5;cursor:not-allowed}.pitch-buttons[data-v-c213e819]{display:flex;gap:30px;justify-content:center;margin-top:40px}.pitch-btn[data-v-c213e819]{padding:30px 50px;font-size:1.3rem;font-weight:700;border-radius:10px;border:3px solid var(--border-color);background-color:var(--bg-panel);color:var(--text-main);cursor:pointer;transition:all .2s;min-width:200px}.pitch-btn[data-v-c213e819]:hover:not(:disabled){border-color:var(--primary-color);background-color:var(--hover-bg);transform:translateY(-2px)}.pitch-btn[data-v-c213e819]:active:not(:disabled){transform:translateY(0)}.pitch-btn[data-v-c213e819]:disabled{opacity:.5;cursor:not-allowed}