.piano-container.svelte-1bjdl82.svelte-1bjdl82{padding:1rem;background:#0000004d;border-radius:12px;overflow-x:auto}.piano.svelte-1bjdl82.svelte-1bjdl82{position:relative;display:flex;height:180px;min-width:600px}.key.svelte-1bjdl82.svelte-1bjdl82{position:relative;border-radius:0 0 6px 6px;transition:all .2s;cursor:default;font-family:inherit}.key.interactive.svelte-1bjdl82.svelte-1bjdl82{cursor:pointer}.key.interactive.svelte-1bjdl82.svelte-1bjdl82:hover{filter:brightness(.95);transform:scale(1.02)}.key.white.svelte-1bjdl82.svelte-1bjdl82{flex:1;background:linear-gradient(to bottom,#fff,#e8e8e8);border:1px solid #ccc;margin-right:2px;z-index:1}.key.white.svelte-1bjdl82.svelte-1bjdl82:last-child{margin-right:0}.key.white.inactive.svelte-1bjdl82.svelte-1bjdl82{background:linear-gradient(to bottom,#9ca3af,#6b7280);border-color:#4b5563}.key.white.inactive.svelte-1bjdl82 .note-label.svelte-1bjdl82{color:#374151}.key.white.highlighted.svelte-1bjdl82.svelte-1bjdl82{background:linear-gradient(to bottom,#60a5fa,#3b82f6);border-color:#2563eb}.key.white.correct.svelte-1bjdl82.svelte-1bjdl82{background:linear-gradient(to bottom,#4ade80,#22c55e);border-color:#16a34a}.key.white.wrong.svelte-1bjdl82.svelte-1bjdl82{background:linear-gradient(to bottom,#f87171,#ef4444);border-color:#dc2626}.key.white.wrong-first.svelte-1bjdl82.svelte-1bjdl82{background:linear-gradient(to bottom,#fbbf24,#f59e0b);border-color:#d97706}.key.black.svelte-1bjdl82.svelte-1bjdl82{position:absolute;width:calc(100% / var(--white-key-count) * .6);height:110px;background:linear-gradient(to bottom,#333,#000);border:1px solid #000;z-index:2;transform:translate(-50%);padding:0}.key.black.inactive.svelte-1bjdl82.svelte-1bjdl82{background:linear-gradient(to bottom,#4b5563,#374151);border-color:#1f2937}.key.black.highlighted.svelte-1bjdl82.svelte-1bjdl82{background:linear-gradient(to bottom,#3b82f6,#1d4ed8);border-color:#1e40af}.key.black.correct.svelte-1bjdl82.svelte-1bjdl82{background:linear-gradient(to bottom,#22c55e,#16a34a);border-color:#15803d}.key.black.wrong.svelte-1bjdl82.svelte-1bjdl82{background:linear-gradient(to bottom,#ef4444,#dc2626);border-color:#b91c1c}.key.black.wrong-first.svelte-1bjdl82.svelte-1bjdl82{background:linear-gradient(to bottom,#f59e0b,#d97706);border-color:#b45309}.note-label.svelte-1bjdl82.svelte-1bjdl82{position:absolute;bottom:8px;left:50%;transform:translate(-50%);font-size:.7rem;color:#666;white-space:nowrap}.key.white.highlighted.svelte-1bjdl82 .note-label.svelte-1bjdl82,.key.white.correct.svelte-1bjdl82 .note-label.svelte-1bjdl82,.key.white.wrong.svelte-1bjdl82 .note-label.svelte-1bjdl82,.key.white.wrong-first.svelte-1bjdl82 .note-label.svelte-1bjdl82{color:#fff;font-weight:600}.ear-training.svelte-gdgn2g.svelte-gdgn2g{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.stage-info.svelte-gdgn2g.svelte-gdgn2g{text-align:center;width:100%;max-width:400px}.stage-header.svelte-gdgn2g.svelte-gdgn2g{margin-bottom:.75rem}.stage-label.svelte-gdgn2g.svelte-gdgn2g{font-size:.75rem;text-transform:uppercase;letter-spacing:.1em;color:#ffffff80}.stage-name.svelte-gdgn2g.svelte-gdgn2g{font-size:1.5rem;font-weight:600;margin:.25rem 0;background:linear-gradient(135deg,#a78bfa,#60a5fa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.stage-desc.svelte-gdgn2g.svelte-gdgn2g{font-size:.875rem;color:#fff9;margin:0}.progress-bar.svelte-gdgn2g.svelte-gdgn2g{position:relative;height:24px;background:#ffffff1a;border-radius:12px;overflow:hidden}.progress-fill.svelte-gdgn2g.svelte-gdgn2g{position:absolute;left:0;top:0;height:100%;background:linear-gradient(90deg,#6366f1,#a78bfa);border-radius:12px;transition:width .3s ease}.progress-text.svelte-gdgn2g.svelte-gdgn2g{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:.75rem;font-weight:600;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.3)}.controls.svelte-gdgn2g.svelte-gdgn2g{display:flex;gap:1rem}.play-btn.svelte-gdgn2g.svelte-gdgn2g{padding:1rem 2rem;font-size:1.25rem;font-weight:600;background:linear-gradient(135deg,#6366f1,#8b5cf6);border:none;border-radius:12px;color:#fff;cursor:pointer;transition:all .2s}.play-btn.svelte-gdgn2g.svelte-gdgn2g:hover{transform:translateY(-2px);box-shadow:0 4px 20px #6366f166}.play-btn.replay-btn.svelte-gdgn2g.svelte-gdgn2g{padding:.75rem 1.5rem;font-size:1rem;background:#ffffff1a;border:2px solid rgba(255,255,255,.2)}.play-btn.replay-btn.svelte-gdgn2g.svelte-gdgn2g:hover{background:#fff3;box-shadow:none}.type-toggle.svelte-gdgn2g.svelte-gdgn2g{padding:1rem 1.5rem;font-size:1rem;background:#ffffff1a;border:2px solid rgba(255,255,255,.2);border-radius:12px;color:#fff;cursor:pointer;transition:all .2s}.type-toggle.svelte-gdgn2g.svelte-gdgn2g:hover{background:#fff3}.instruction.svelte-gdgn2g.svelte-gdgn2g{color:#ffffffb3;font-size:1.1rem}.instruction.try-again.svelte-gdgn2g.svelte-gdgn2g{color:#fbbf24;font-weight:600}.feedback.svelte-gdgn2g.svelte-gdgn2g{padding:1rem 2rem;font-size:1.25rem;font-weight:600;border-radius:12px}.feedback.correct.svelte-gdgn2g.svelte-gdgn2g{background:#4ade8033;color:#86efac}.feedback.incorrect.svelte-gdgn2g.svelte-gdgn2g{background:#f8717133;color:#fca5a5}.advance-prompt.svelte-gdgn2g.svelte-gdgn2g{text-align:center;padding:1.5rem;background:#6366f11a;border:2px solid rgba(99,102,241,.3);border-radius:16px}.advance-prompt.svelte-gdgn2g p.svelte-gdgn2g{margin:0 0 1rem;font-size:1.1rem;color:#a5b4fc}.advance-btn.svelte-gdgn2g.svelte-gdgn2g{padding:.75rem 2rem;font-size:1rem;font-weight:600;background:linear-gradient(135deg,#6366f1,#8b5cf6);border:none;border-radius:12px;color:#fff;cursor:pointer;transition:all .2s}.advance-btn.svelte-gdgn2g.svelte-gdgn2g:hover{transform:translateY(-2px);box-shadow:0 4px 20px #6366f166}.restart-btn.svelte-gdgn2g.svelte-gdgn2g{padding:.5rem 1rem;font-size:.875rem;background:transparent;border:1px solid rgba(255,255,255,.2);border-radius:8px;color:#ffffff80;cursor:pointer;transition:all .2s}.restart-btn.svelte-gdgn2g.svelte-gdgn2g:hover{background:#ffffff0d;color:#fffc}.congratulations.svelte-gdgn2g.svelte-gdgn2g{display:flex;flex-direction:column;align-items:center;gap:1.5rem;text-align:center;padding:2rem 1rem}.congrats-title.svelte-gdgn2g.svelte-gdgn2g{font-size:2.5rem;font-weight:700;margin:0;background:linear-gradient(135deg,#f59e0b,#ef4444,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.congrats-subtitle.svelte-gdgn2g.svelte-gdgn2g{font-size:1.25rem;color:#fffc;margin:0}.stats-grid.svelte-gdgn2g.svelte-gdgn2g{display:grid;grid-template-columns:1fr 1fr;gap:1rem;width:100%;max-width:360px}.stat-card.svelte-gdgn2g.svelte-gdgn2g{display:flex;flex-direction:column;align-items:center;gap:.25rem;padding:1rem;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:12px}.stat-value.svelte-gdgn2g.svelte-gdgn2g{font-size:1.75rem;font-weight:700;color:#a78bfa}.stat-label.svelte-gdgn2g.svelte-gdgn2g{font-size:.8rem;color:#fff9}.play-again-btn.svelte-gdgn2g.svelte-gdgn2g{padding:1rem 2.5rem;font-size:1.25rem;font-weight:600;background:linear-gradient(135deg,#6366f1,#8b5cf6);border:none;border-radius:12px;color:#fff;cursor:pointer;transition:all .2s}.play-again-btn.svelte-gdgn2g.svelte-gdgn2g:hover{transform:translateY(-2px);box-shadow:0 4px 20px #6366f166}.score-display.svelte-w1sdlm{display:flex;align-items:center;gap:1rem;padding:.75rem 1.5rem;background:#ffffff1a;border-radius:12px;font-size:1.25rem}.score-main.svelte-w1sdlm{display:flex;align-items:center;gap:.25rem}.correct.svelte-w1sdlm{color:#4ade80;font-weight:600}.divider.svelte-w1sdlm{color:#ffffff80}.total.svelte-w1sdlm{color:#fffc}.percentage.svelte-w1sdlm{color:#60a5fa;font-weight:500;padding-left:.5rem;border-left:1px solid rgba(255,255,255,.2)}.reset-btn.svelte-w1sdlm{padding:.25rem .75rem;font-size:.875rem;background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:6px;color:#ffffffb3;cursor:pointer;transition:all .2s}.reset-btn.svelte-w1sdlm:hover{background:#fff3;color:#fff}main.svelte-k30cff{max-width:900px;margin:0 auto;padding:2rem;min-height:100vh;display:flex;flex-direction:column}header.svelte-k30cff{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem;margin-bottom:2rem}.header-controls.svelte-k30cff{display:flex;align-items:center;gap:1rem}.lang-selector.svelte-k30cff{display:flex;gap:.25rem}.lang-btn.svelte-k30cff{padding:.35rem .5rem;font-size:.75rem;font-weight:600;background:#ffffff0d;border:1px solid rgba(255,255,255,.1);border-radius:4px;color:#ffffff80;cursor:pointer;transition:all .2s}.lang-btn.svelte-k30cff:hover{background:#ffffff1a;color:#fffc}.lang-btn.active.svelte-k30cff{background:#6366f14d;border-color:#6366f1;color:#fff}h1.svelte-k30cff{font-size:1.75rem;font-weight:700;background:linear-gradient(135deg,#60a5fa,#a78bfa);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.content.svelte-k30cff{flex:1;padding:2rem;background:#ffffff08;border-radius:16px;border:1px solid rgba(255,255,255,.1)}footer.svelte-k30cff{margin-top:2rem;text-align:center;color:#fff6;font-size:.875rem}.version.svelte-k30cff{font-size:.75rem;color:#ffffff40}@media (max-width: 600px){header.svelte-k30cff{flex-direction:column;text-align:center}.header-controls.svelte-k30cff{flex-direction:column}h1.svelte-k30cff{font-size:1.5rem}}