@import"https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,500;9..144,600&family=Inter:wght@400;500;600;700&display=swap";.mnq-quiz{--mnq-paper:#faf6ec;--mnq-paper-line:#e6dcc6;--mnq-ink:#2b2620;--mnq-ink-soft:#6b6255;--mnq-burgundy:#7a2e2e;--mnq-burgundy-dark:#5e2222;--mnq-gold:#c9a66b;--mnq-green:#3f7d53;--mnq-green-bg:#e6f0e7;--mnq-terracotta:#c1502e;--mnq-terracotta-bg:#f7e7e0;--mnq-piano-ink:#201e27;box-sizing:border-box;max-width:460px;margin:2rem auto;background:var(--mnq-paper);border:1px solid var(--mnq-paper-line);border-radius:6px;padding:1.75rem 1.5rem 2rem;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:var(--mnq-ink);-webkit-font-smoothing:antialiased}.mnq-quiz *,.mnq-quiz *:before,.mnq-quiz *:after{box-sizing:border-box}.mnq-top{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:1.1rem;flex-wrap:wrap}.mnq-title{font-family:Fraunces,Georgia,Times New Roman,serif;font-weight:600;font-size:1.15rem;letter-spacing:.01em;margin:0;color:var(--mnq-burgundy-dark)}.mnq-score{font-family:Fraunces,Georgia,serif;font-size:.95rem;color:var(--mnq-ink-soft);white-space:nowrap;margin:0}.mnq-score strong{color:var(--mnq-ink);font-weight:600}.mnq-stats{display:flex;align-items:center;gap:.9rem}.mnq-time{font-family:Fraunces,Georgia,serif;font-size:.95rem;font-weight:600;color:var(--mnq-burgundy);white-space:nowrap;margin:0;visibility:hidden;min-width:0}.mnq-time.is-visible{visibility:visible}.mnq-time.is-low{color:var(--mnq-terracotta)}.mnq-settings{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap;margin-bottom:1.25rem;padding-bottom:1rem;border-bottom:1px solid var(--mnq-paper-line)}.mnq-clef-group{display:inline-flex;border:1px solid var(--mnq-gold);border-radius:5px;overflow:hidden}.mnq-clef-btn{appearance:none;border:none;background:#fff0;color:var(--mnq-burgundy-dark);font-family:inherit;font-size:.82rem;font-weight:500;padding:.35rem .7rem;cursor:pointer;transition:background .15s ease,color .15s ease}.mnq-clef-btn+.mnq-clef-btn{border-left:1px solid var(--mnq-gold)}.mnq-clef-btn[aria-pressed=true]{background:var(--mnq-burgundy);color:#fff}.mnq-accidentals-toggle{display:inline-flex;align-items:center;gap:.4rem;font-size:.82rem;color:var(--mnq-ink-soft);cursor:pointer;user-select:none}.mnq-accidentals-toggle input{accent-color:var(--mnq-burgundy);width:15px;height:15px;cursor:pointer}.mnq-staff-outer{position:relative;margin-bottom:1.35rem}.mnq-staff-wrap{background:#fffdf8;border:1px solid var(--mnq-paper-line);border-radius:4px;padding:.75rem .5rem}.mnq-staff-outer .mnq-staff-wrap{margin-bottom:0}.mnq-staff-wrap svg{display:block;width:100%;height:auto}.mnq-ledger-line{stroke:var(--mnq-ink);stroke-width:1.6}.mnq-stem{stroke:var(--mnq-ink);stroke-width:2;transition:stroke .15s ease}.mnq-stem.is-correct{stroke:var(--mnq-green)}.mnq-stem.is-incorrect{stroke:var(--mnq-terracotta)}.mnq-notehead{fill:var(--mnq-ink);transition:fill .15s ease}.mnq-notehead.is-correct{fill:var(--mnq-green)}.mnq-start-gate{display:none;position:absolute;inset:0;z-index:5;flex-direction:column;align-items:center;justify-content:center;gap:.75rem;background:#0c160ff0;border-radius:4px}.mnq-start-gate.is-visible{display:flex}.mnq-ready-btn{display:none;appearance:none;border:none;background:#22c55e;color:#fff;font-family:inherit;font-weight:700;font-size:1.15rem;letter-spacing:.03em;padding:.85rem 2.6rem;border-radius:999px;cursor:pointer;box-shadow:0 0 #22c55e8c;animation:mnq-ready-pulse 1.6s ease-out infinite}.mnq-ready-btn.is-visible{display:inline-block}.mnq-ready-btn:hover{background:#16a34a}.mnq-ready-btn:focus-visible{outline:2px solid #fff;outline-offset:3px}.mnq-start-gate-hint{display:none;color:#d7f5df;font-size:.8rem;letter-spacing:.02em}.mnq-start-gate-hint.is-visible{display:block}.mnq-countdown-number{display:none;font-family:Fraunces,Georgia,serif;font-weight:800;font-size:4.5rem;line-height:1;color:#39ff6a;text-shadow:0 0 12px rgb(57 255 106 / .85),0 0 30px rgb(57 255 106 / .5)}.mnq-countdown-number.is-visible{display:block;animation:mnq-countdown-pop .5s ease-out}@keyframes mnq-ready-pulse{0%{box-shadow:0 0 #22c55e8c}70%{box-shadow:0 0 0 16px #fff0}to{box-shadow:0 0 #fff0}}@keyframes mnq-countdown-pop{0%{transform:scale(.4);opacity:0}60%{transform:scale(1.18);opacity:1}to{transform:scale(1);opacity:1}}@media(prefers-reduced-motion:reduce){.mnq-ready-btn,.mnq-countdown-number{animation:none}}@media(max-width:420px){.mnq-countdown-number{font-size:3.4rem}.mnq-ready-btn{font-size:1rem;padding:.7rem 2rem}}.mnq-notehead.is-incorrect{fill:var(--mnq-terracotta)}.mnq-accidental{fill:var(--mnq-ink);font-family:Fraunces,Georgia,serif}.mnq-feedback{min-height:1.4em;text-align:center;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1rem;margin-bottom:.9rem;visibility:hidden}.mnq-feedback.is-visible{visibility:visible}.mnq-feedback.is-correct{color:var(--mnq-green)}.mnq-feedback.is-incorrect{color:var(--mnq-terracotta)}.mnq-splash{display:flex;align-items:center;justify-content:center;min-height:220px;padding:2rem 0;opacity:1;transition:opacity .3s ease}.mnq-splash.is-hiding{opacity:0}.mnq-splash-logo{display:block;height:120px;width:auto;max-width:80%}.mnq-logo{display:block;height:88px;width:auto;margin:0 auto .85rem}.mnq-piano-wrap{line-height:0}.mnq-piano{display:block;width:100%;height:auto;touch-action:manipulation;overflow:visible}.mnq-piano-frame{fill:var(--mnq-piano-ink)}.mnq-key-rect{transition:fill .12s ease,stroke .12s ease}.mnq-key-white{cursor:pointer}.mnq-key-white .mnq-key-rect{fill:#fffdf8;stroke:var(--mnq-piano-ink);stroke-width:1.5}.mnq-key-white:hover:not(.is-disabled) .mnq-key-rect{fill:#fff6e0}.mnq-key-white:active:not(.is-disabled) .mnq-key-rect{fill:#f3e8cf}.mnq-key-white.is-disabled{cursor:default}.mnq-key-white.is-correct .mnq-key-rect{fill:var(--mnq-green-bg);stroke:var(--mnq-green);stroke-width:2}.mnq-key-white.is-incorrect .mnq-key-rect{fill:var(--mnq-terracotta-bg);stroke:var(--mnq-terracotta);stroke-width:2}.mnq-key-label{font-family:Fraunces,Georgia,serif;font-weight:500;font-size:15px;fill:var(--mnq-ink-soft);pointer-events:none;user-select:none}.mnq-quiz.mnq-labels-hidden .mnq-key-label{display:none}.mnq-key-white.is-correct .mnq-key-label{fill:var(--mnq-green);font-weight:600}.mnq-key-white.is-incorrect .mnq-key-label{fill:var(--mnq-terracotta);font-weight:600}.mnq-key-black{cursor:pointer}.mnq-key-black .mnq-key-rect{fill:var(--mnq-piano-ink)}.mnq-key-black:hover:not(.is-disabled) .mnq-key-rect{fill:#3a3648}.mnq-key-black.is-disabled{cursor:default}.mnq-key-black.is-correct .mnq-key-rect{fill:var(--mnq-green);stroke:var(--mnq-green-bg);stroke-width:2}.mnq-key-black.is-incorrect .mnq-key-rect{fill:var(--mnq-terracotta);stroke:var(--mnq-terracotta-bg);stroke-width:2}.mnq-key-white:focus-visible .mnq-key-rect,.mnq-key-black:focus-visible .mnq-key-rect{stroke:var(--mnq-burgundy);stroke-width:3}.mnq-clef-btn:focus-visible{outline:2px solid var(--mnq-burgundy);outline-offset:2px}.mnq-round-over{display:none;flex-direction:column;align-items:center;gap:.85rem;margin-top:1.1rem;padding:1.1rem 1rem;background:#fffaf0;border:1px solid var(--mnq-gold);border-radius:6px;text-align:center}.mnq-round-over.is-visible{display:flex}.mnq-round-over-message{margin:0;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.05rem;color:var(--mnq-burgundy-dark)}.mnq-play-again-btn{appearance:none;border:none;background:var(--mnq-burgundy);color:#fff;font-family:inherit;font-weight:600;font-size:.9rem;padding:.55rem 1.4rem;border-radius:5px;cursor:pointer;transition:background .15s ease}.mnq-play-again-btn:hover{background:var(--mnq-burgundy-dark)}.mnq-play-again-btn:focus-visible{outline:2px solid var(--mnq-burgundy-dark);outline-offset:2px}@media(prefers-reduced-motion:reduce){.mnq-answer-btn,.mnq-notehead{transition:none}}@media(max-width:420px){.mnq-quiz{margin:1rem auto;padding:1.25rem 1rem 1.5rem}.mnq-settings{flex-direction:column;align-items:flex-start}}.mnq-copyright{max-width:480px;margin:.5rem auto 1.5rem;text-align:center;font-size:.75rem;color:var(--mnq-burgundy-dark,#6b2d3c);opacity:.7}.mnq-mode-select,.mnq-gate{display:flex;flex-direction:column;align-items:stretch;gap:.9rem;padding:1rem .25rem .5rem;text-align:center}.mnq-mode-title{font-family:Fraunces,Georgia,Times New Roman,serif;font-weight:600;font-size:1.15rem;color:var(--mnq-burgundy-dark);margin:0 0 .25rem}.mnq-mode-btn{appearance:none;border:1px solid var(--mnq-gold);background:#fff;color:var(--mnq-burgundy-dark);font-family:inherit;font-weight:600;font-size:.95rem;padding:.85rem 1rem;border-radius:6px;cursor:pointer;transition:background .15s ease,color .15s ease}.mnq-mode-btn:hover{background:var(--mnq-burgundy);color:#fff}.mnq-mode-btn-practise{background:var(--mnq-burgundy);color:#fff;border-color:var(--mnq-burgundy)}.mnq-mode-btn-practise:hover{background:var(--mnq-burgundy-dark)}.mnq-mode-hint{display:block;font-weight:400;font-size:.72rem;opacity:.75;margin-top:.2rem}.mnq-gate-form{display:flex;flex-direction:column;gap:.6rem}.mnq-gate-input{appearance:none;border:1px solid var(--mnq-paper-line);background:#fff;color:var(--mnq-ink);font-family:inherit;font-size:.95rem;padding:.65rem .75rem;border-radius:5px}.mnq-gate-input:focus-visible{outline:2px solid var(--mnq-burgundy);outline-offset:1px}.mnq-gate-error{min-height:1.1em;margin:0;color:var(--mnq-terracotta);font-size:.8rem}.mnq-gate-back{appearance:none;border:none;background:#fff0;color:var(--mnq-ink-soft);font-family:inherit;font-size:.82rem;padding:.3rem;cursor:pointer;text-decoration:underline}.mnq-compete-bar{display:flex;flex-direction:column;gap:.5rem;margin:-.3rem 0 1rem;padding:.65rem .75rem;background:var(--mnq-green-bg);border:1px solid var(--mnq-green);border-radius:6px}.mnq-compete-who{margin:0;font-weight:600;font-size:.85rem;color:var(--mnq-burgundy-dark)}.mnq-compete-actions{display:flex;flex-wrap:wrap;gap:.5rem}.mnq-scoreboard-btn,.mnq-finish-btn{appearance:none;border:1px solid var(--mnq-burgundy);background:#fff;color:var(--mnq-burgundy-dark);font-family:inherit;font-weight:600;font-size:.78rem;padding:.4rem .7rem;border-radius:5px;cursor:pointer;transition:background .15s ease,color .15s ease}.mnq-scoreboard-btn:hover,.mnq-finish-btn:hover{background:var(--mnq-burgundy);color:#fff}.mnq-finish-btn{display:none}.mnq-finish-btn.is-visible{display:inline-block}.mnq-score-submitted{margin:0;font-size:.78rem;color:var(--mnq-green);min-height:1em}.mnq-scoreboard-overlay{position:absolute;inset:0;background:#2b26208c;display:flex;align-items:center;justify-content:center;padding:1rem;z-index:20;border-radius:6px}.mnq-quiz{position:relative}.mnq-scoreboard-panel{position:relative;width:100%;max-width:380px;max-height:85%;overflow-y:auto;background:var(--mnq-paper);border:1px solid var(--mnq-paper-line);border-radius:6px;padding:1.5rem 1.25rem 1.25rem}.mnq-scoreboard-close{position:absolute;top:.6rem;right:.6rem;appearance:none;border:none;background:#fff0;color:var(--mnq-ink-soft);font-size:1rem;line-height:1;padding:.3rem;cursor:pointer}.mnq-scoreboard-body{display:flex;flex-direction:column;gap:1rem;font-size:.85rem;color:var(--mnq-ink-soft)}.mnq-scoreboard-section{border-top:1px solid var(--mnq-paper-line);padding-top:.6rem}.mnq-scoreboard-section:first-child{border-top:none;padding-top:0}.mnq-scoreboard-heading{margin:0 0 .4rem;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:.95rem;color:var(--mnq-burgundy-dark)}.mnq-scoreboard-empty{margin:0;font-size:.8rem;font-style:italic}.mnq-scoreboard-list{list-style:decimal;margin:0;padding-left:1.2rem;display:flex;flex-direction:column;gap:.3rem}.mnq-scoreboard-list li{display:flex;justify-content:space-between;gap:.5rem;font-size:.85rem;color:var(--mnq-ink)}.mnq-scoreboard-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mnq-scoreboard-score{flex-shrink:0;font-weight:600;color:var(--mnq-burgundy-dark)}.mnq-gate-warning,.mnq-compete-warning{margin:0;font-size:.78rem;font-weight:600;color:var(--mnq-terracotta)}.mnq-gate-warning{text-align:center}.mnq-exit-btn{appearance:none;border:1px solid var(--mnq-paper-line);background:#fff;color:var(--mnq-ink-soft);font-family:inherit;font-weight:600;font-size:.72rem;padding:.3rem .6rem;border-radius:5px;cursor:pointer;order:-1;transition:background .15s ease,color .15s ease,border-color .15s ease}.mnq-exit-btn:hover{background:var(--mnq-terracotta);border-color:var(--mnq-terracotta);color:#fff}