/*! (c) Keyz Music Lessons / Cobus van der Walt. All rights reserved. Copying, reuse or redistribution of this code without written permission is not allowed. */
/*! Music Notes Flashcards game styles - Copyright (c) 2026 Keyz Music Lessons. All rights reserved. Unauthorised copying or reuse is prohibited. */
@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-fit-wrapper{display:flex;justify-content:center;align-items:flex-start;width:100%;overflow:visible}.mnq-quiz{--mnq-paper:#ececec;--mnq-paper-line:#dcdcdc;--mnq-ink:#222222;--mnq-ink-soft:#5a5a5a;--mnq-burgundy:#4073a2;--mnq-burgundy-dark:#2f5578;--mnq-gold:#ad9337;--mnq-green:#3f7d53;--mnq-green-bg:#e6f0e7;--mnq-terracotta:#c1502e;--mnq-terracotta-bg:#f7e7e0;--mnq-piano-ink:#201e27;box-sizing:border-box;position:relative;transition:transform .18s ease;width:100%;max-width:460px;margin:1.25rem auto;background:var(--mnq-paper);border:1px solid var(--mnq-paper-line);border-radius:10px;box-shadow:0 1px 3px rgb(34 34 34 / .08);padding:1.1rem 1rem 1.35rem;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-top-left{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;min-width:0}.mnq-title{display:flex;align-items:center;justify-content:center;gap:.55rem;flex-wrap:wrap;text-align:center;margin:0 0 1.1rem}.mnq-title-text{font-family:Fraunces,Georgia,Times New Roman,serif;font-weight:600;font-size:1.6rem;letter-spacing:.015em;color:var(--mnq-burgundy-dark);text-shadow:0 1px 0 rgb(255 255 255 / .5)}.mnq-title-clef{font-size:2rem;font-weight:400;line-height:1;color:var(--mnq-gold)}.mnq-title-logo-img{display:block;height:auto;width:auto;max-width:min(90%,420px);max-height:70px;margin:0 auto}.mnq-score{font-family:Fraunces,Georgia,serif;font-size:1.35rem;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:1.35rem;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-streak{font-family:Fraunces,Georgia,serif;font-size:.85rem;font-weight:700;color:var(--mnq-terracotta);white-space:nowrap;margin:0;opacity:0;transform:scale(.9);transition:opacity .15s ease,transform .15s ease}.mnq-streak.is-visible{opacity:1;transform:scale(1)}.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:.95rem;font-weight:600;padding:.7rem 1rem;min-height:44px;cursor:pointer;transition:background .15s ease,color .15s ease}.mnq-clef-btn+.mnq-clef-btn{border-left:1px solid var(--mnq-gold)}.mnq-toggle-group{border:none;border-radius:0;overflow:visible;flex-wrap:wrap;gap:.5rem}.mnq-toggle-group .mnq-clef-btn{border:1px solid var(--mnq-gold);border-radius:5px}.mnq-clef-btn[aria-pressed=true]{background:var(--mnq-burgundy);color:#fff}.mnq-clef-btn-symbol{font-size:1.5rem;line-height:1;font-weight:400;padding-top:.35rem;padding-bottom:.35rem}.mnq-accidentals-btn{display:inline-flex;align-items:center;justify-content:center;gap:.15rem}.mnq-btn-note-icon{display:block;height:22px;width:auto}.mnq-timer-dropdown{position:relative}.mnq-timer-dropdown-btn{display:inline-flex;align-items:center;gap:.35rem;white-space:nowrap}.mnq-timer-dropdown-panel{position:absolute;top:calc(100% + .35rem);left:0;z-index:20;display:flex;flex-direction:column;gap:.15rem;width:100%;min-width:150px;background:#fff;border:1px solid var(--mnq-gold);border-radius:8px;box-shadow:0 4px 14px rgb(34 34 34 / .18);padding:.35rem}.mnq-timer-dropdown-panel[hidden]{display:none}.mnq-timer-option{appearance:none;border:none;background:#fff0;color:var(--mnq-burgundy-dark);font-family:inherit;font-size:.92rem;font-weight:600;text-align:left;padding:.6rem .7rem;min-height:40px;border-radius:5px;cursor:pointer;transition:background .15s ease,color .15s ease}.mnq-timer-option:hover{background:var(--mnq-terracotta-bg)}.mnq-timer-option[aria-pressed=true]{background:var(--mnq-burgundy);color:#fff}.mnq-timer-option:focus-visible{outline:2px solid var(--mnq-burgundy);outline-offset:-2px}.mnq-staff-outer{position:relative;margin-bottom:1.35rem}.mnq-staff-wrap{background:linear-gradient(135deg,#ffffff 0%,#ffffff 65%,#fafafa 100%);border:none;border-radius:16px;padding:.75rem .5rem;width:100%;box-shadow:0 10px 22px rgb(34 34 34 / .16),0 2px 6px rgb(34 34 34 / .08)}.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)}.mnq-feedback{min-height:2.6em;text-align:center;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:2rem;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-consent-overlay{position:absolute;inset:0;background:rgb(20 18 12 / .6);display:flex;align-items:center;justify-content:center;padding:1.25rem;z-index:60;border-radius:10px}.mnq-consent-box{background:var(--mnq-paper);border:1px solid var(--mnq-gold);border-radius:10px;box-shadow:0 10px 28px rgb(34 34 34 / .28);padding:1.1rem 1.2rem;max-width:340px;width:100%}.mnq-consent-title{margin:0 0 .5rem;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.05rem;color:var(--mnq-ink)}.mnq-consent-body{margin:0 0 .9rem;font-size:.82rem;line-height:1.45;color:var(--mnq-ink-soft)}.mnq-consent-agree{display:flex;align-items:center;gap:.5rem;margin:0 0 .9rem;font-size:.85rem;font-weight:600;color:var(--mnq-ink);cursor:pointer;user-select:none}.mnq-consent-checkbox{width:17px;height:17px;flex:none;accent-color:var(--mnq-burgundy);cursor:pointer}.mnq-consent-btn{display:block;width:100%;padding:.55rem 1rem;border:1px solid var(--mnq-burgundy);border-radius:6px;background:var(--mnq-burgundy);color:#fff;font-weight:600;font-size:.9rem;cursor:pointer}.mnq-consent-btn:hover{background:var(--mnq-burgundy-dark);border-color:var(--mnq-burgundy-dark)}.mnq-consent-btn:disabled{background:#b9b0a4;border-color:#b9b0a4;color:#f4f0ea;opacity:.75;cursor:not-allowed}.mnq-consent-btn:disabled:hover{background:#b9b0a4;border-color:#b9b0a4}.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-splash-title-card{height:auto;width:min(70%,280px);max-width:90%;border-radius:14px;box-shadow:0 10px 28px rgb(34 34 34 / .22)}.mnq-logo{display:block;height:36px;width:auto;margin:0;flex-shrink:0}.mnq-logo-bottom-wrap{margin:1.1rem auto 0;text-align:center}.mnq-logo-bottom-wrap .mnq-logo-bottom{margin:0 auto}.mnq-logo-img-wrap{position:relative;display:inline-block;overflow:hidden;cursor:pointer;border-radius:4px}.mnq-logo-img-wrap::after{content:"";position:absolute;top:0;left:-60%;width:45%;height:100%;background:linear-gradient(115deg,#fff0 0%,#fff0 30%,rgb(255 255 255 / .9) 50%,#fff0 70%,#fff0 100%);transform:skewX(-18deg);pointer-events:none;-webkit-mask-image:var(--mnq-logo-mask);mask-image:var(--mnq-logo-mask);-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:center;mask-position:center}.mnq-logo-img-wrap:hover::after{animation:mnqLogoShimmer 1s ease}.mnq-logo-img-wrap.mnq-logo-shimmer-auto::after{animation:mnqLogoShimmer 1.15s ease}@keyframes mnqLogoShimmer{0%{left:-60%}100%{left:130%}}@media (prefers-reduced-motion:reduce){.mnq-logo-img-wrap::after{display:none}}.mnq-piano-wrap{line-height:0}.mnq-piano-hidden .mnq-piano-wrap{display:none}.mnq-flash-x{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:clamp(3rem,24vw,7rem);font-weight:800;line-height:1;color:var(--mnq-terracotta);opacity:0;pointer-events:none;z-index:30;text-shadow:0 2px 12px rgb(34 34 34 / .25)}.mnq-flash-x.is-active{animation:mnqFlashX .55s ease}@keyframes mnqFlashX{0%{opacity:0;transform:scale(.6)}15%{opacity:1;transform:scale(1.15)}35%{opacity:1;transform:scale(1)}75%{opacity:1}100%{opacity:0}}.mnq-piano,.mnq-piano *,.mnq-quiz img,.mnq-quiz svg{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;-webkit-user-drag:none;user-drag:none}.mnq-piano{display:block;width:100%;height:auto;touch-action:manipulation;overflow:visible}.mnq-piano-trim{fill:var(--mnq-gold);opacity:.55;pointer-events:none}.mnq-piano-sheen{fill:#fff;opacity:.05;pointer-events:none}.mnq-key-rect{transition:fill .12s ease,stroke .12s ease}.mnq-key-white{cursor:pointer}.mnq-key-white .mnq-key-rect{stroke:var(--mnq-piano-ink);stroke-width:1.5}.mnq-key-crease{stroke:#d9cdb2;stroke-width:1;opacity:.7;pointer-events:none}.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-gloss{fill:#fff;opacity:.16;pointer-events:none}.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:#fff;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:700;font-size:1.05rem;padding:.85rem 2rem;min-height:48px;box-shadow:0 1px 3px rgb(34 34 34 / .15);border-radius:7px;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:.6rem auto;padding:.9rem .75rem 1.15rem}.mnq-settings{flex-direction:column;align-items:stretch}.mnq-fullscreen-btn{font-size:.8rem;padding:.55rem .8rem}.mnq-title-text{font-size:1.2rem}.mnq-title-clef{font-size:1.5rem}.mnq-title-logo-img{max-width:85%;max-height:48px}}.mnq-copyright{max-width:480px;margin:.35rem auto 0;text-align:center;font-size:.75rem;color:var(--mnq-burgundy-dark,#2f5578);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:700;font-size:1.05rem;padding:1.05rem 1.2rem;min-height:52px;border-radius:8px;box-shadow:0 1px 3px rgb(34 34 34 / .08);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:1rem;padding:.75rem .85rem;min-height:44px;border-radius:6px}.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:.9rem;padding:.6rem 1rem;min-height:42px;border-radius:6px;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-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-fullscreen-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:.85rem;padding:.55rem .9rem;min-height:40px;border-radius:7px;box-shadow:0 1px 2px rgb(34 34 34 / .06);cursor:pointer;display:inline-flex;align-items:center;gap:.35rem;transition:background .15s ease,color .15s ease,border-color .15s ease}.mnq-fullscreen-btn:hover{background:var(--mnq-burgundy);border-color:var(--mnq-burgundy);color:#fff}.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:.85rem;padding:.55rem .9rem;min-height:40px;border-radius:7px;box-shadow:0 1px 2px rgb(34 34 34 / .06);cursor:pointer;display:inline-flex;align-items:center;gap:.35rem;transition:background .15s ease,color .15s ease,border-color .15s ease}.mnq-help-btn{appearance:none;border:1px solid var(--mnq-paper-line);background:#fff;color:var(--mnq-ink-soft);font-family:inherit;font-weight:700;font-size:.95rem;width:40px;height:40px;padding:0;border-radius:50%;box-shadow:0 1px 2px rgb(34 34 34 / .06);cursor:pointer;display:inline-flex;align-items:center;justify-content:center;flex:none;transition:background .15s ease,color .15s ease,border-color .15s ease}.mnq-help-btn:hover{background:var(--mnq-gold);border-color:var(--mnq-gold);color:#fff}.mnq-help-overlay{position:absolute;inset:0;background:rgb(20 18 12 / .6);display:flex;align-items:center;justify-content:center;padding:1.25rem;z-index:65;border-radius:10px}.mnq-help-box{position:relative;background:var(--mnq-paper);border:1px solid var(--mnq-gold);border-radius:10px;box-shadow:0 10px 28px rgb(34 34 34 / .28);padding:1.2rem 1.3rem 1.3rem;max-width:420px;width:100%;max-height:80vh;overflow-y:auto}.mnq-help-close{appearance:none;position:absolute;top:.6rem;right:.6rem;border:none;background:#fff0;color:var(--mnq-ink-soft);font-size:1.1rem;line-height:1;width:32px;height:32px;border-radius:50%;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}.mnq-help-close:hover{background:rgb(34 34 34 / .08);color:var(--mnq-ink)}.mnq-help-title{margin:0 1.8rem .5rem 0;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.1rem;color:var(--mnq-ink)}.mnq-help-body{margin:0 0 .9rem;font-size:.85rem;line-height:1.5;color:var(--mnq-ink-soft)}.mnq-help-subtitle{margin:0 0 .55rem;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:.95rem;color:var(--mnq-ink)}.mnq-help-list{margin:0}.mnq-help-list dt{font-weight:700;font-size:.82rem;color:var(--mnq-ink);margin-top:.7rem}.mnq-help-list dt:first-child{margin-top:0}.mnq-help-list dd{margin:.15rem 0 0;font-size:.8rem;line-height:1.45;color:var(--mnq-ink-soft)}.mnq-exit-btn:hover{background:var(--mnq-terracotta,#b3552f);border-color:var(--mnq-terracotta,#b3552f);color:#fff}.mnq-fullscreen-icon{display:inline-block;width:14px;height:14px}.mnq-settings-bar{position:relative;display:flex;flex-direction:column;align-items:flex-end;gap:.5rem;margin-bottom:1rem;flex-wrap:wrap}.mnq-settings-bar .mnq-settings{display:flex;width:100%}.mnq-time-row{display:flex;justify-content:center;width:100%;flex:0 0 100%;order:2}.mnq-settings-bar .mnq-settings{order:1}@media(min-width:641px){.mnq-settings-bar{flex-direction:row;align-items:center}}@media(max-width:640px){.mnq-settings-bar .mnq-settings{flex-direction:column;align-items:stretch;gap:.5rem}.mnq-settings-bar .mnq-clef-group{width:100%}.mnq-settings-bar .mnq-clef-btn{flex:1 1 0%;text-align:center;padding:.5rem .6rem;min-height:38px}}.mnq-mic-status{width:100%;min-height:1.1em;margin:.3rem 0 0;font-size:.78rem;color:var(--mnq-ink-soft);transition:color .15s ease}.mnq-mic-status.is-active{color:var(--mnq-green);font-weight:600}.mnq-mic-status.is-error{color:var(--mnq-terracotta);font-weight:600}@media(min-width:600px){.mnq-quiz{max-width:600px;padding:1.5rem 1.5rem 1.75rem}}@media(min-width:900px){.mnq-quiz{max-width:760px;padding:1.75rem 2rem 2rem}}@media(min-width:1200px){.mnq-quiz{max-width:880px;padding:2rem 2.25rem 2.25rem}}.mnq-quiz:fullscreen{zoom:1;position:fixed;inset:0;margin:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;border-radius:0;box-shadow:none;box-sizing:border-box;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;display:block;padding:clamp(.3rem,1.2vh,1rem) clamp(.5rem,3vw,2.5rem) calc(clamp(.3rem,1.2vh,1rem) + env(safe-area-inset-bottom,0px));background:var(--mnq-paper);font-size:clamp(12px,1.4vh + 0.55vw,17px)}.mnq-quiz:-webkit-full-screen{zoom:1;position:fixed;inset:0;margin:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;border-radius:0;box-shadow:none;box-sizing:border-box;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;display:block;padding:clamp(.3rem,1.2vh,1rem) clamp(.5rem,3vw,2.5rem) calc(clamp(.3rem,1.2vh,1rem) + env(safe-area-inset-bottom,0px));background:var(--mnq-paper);font-size:clamp(12px,1.4vh + 0.55vw,17px)}.mnq-quiz:-ms-fullscreen{zoom:1;position:fixed;inset:0;margin:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;border-radius:0;box-shadow:none;box-sizing:border-box;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;display:block;padding:clamp(.3rem,1.2vh,1rem) clamp(.5rem,3vw,2.5rem) calc(clamp(.3rem,1.2vh,1rem) + env(safe-area-inset-bottom,0px));background:var(--mnq-paper);font-size:clamp(12px,1.4vh + 0.55vw,17px)}.mnq-quiz.mnq-is-fullscreen{zoom:1;position:fixed;inset:0;margin:0;width:100%;height:100%;height:100dvh;max-width:none;max-height:none;border-radius:0;box-shadow:none;box-sizing:border-box;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;display:block;padding:clamp(.3rem,1.2vh,1rem) clamp(.5rem,3vw,2.5rem) calc(clamp(.3rem,1.2vh,1rem) + env(safe-area-inset-bottom,0px));background:var(--mnq-paper);font-size:clamp(12px,1.4vh + 0.55vw,17px)}.mnq-quiz:fullscreen .mnq-piano-wrap{max-width:900px;width:100%;margin:0 auto}.mnq-quiz:-webkit-full-screen .mnq-piano-wrap{max-width:900px;width:100%;margin:0 auto}.mnq-quiz:-ms-fullscreen .mnq-piano-wrap{max-width:900px;width:100%;margin:0 auto}.mnq-quiz.mnq-is-fullscreen .mnq-piano-wrap{max-width:900px;width:100%;margin:0 auto}.mnq-quiz:fullscreen .mnq-staff-outer{max-width:560px;width:100%;margin-left:auto;margin-right:auto;margin-bottom:clamp(.3rem,.9vh,.6rem)}.mnq-quiz:-webkit-full-screen .mnq-staff-outer{max-width:560px;width:100%;margin-left:auto;margin-right:auto;margin-bottom:clamp(.3rem,.9vh,.6rem)}.mnq-quiz:-ms-fullscreen .mnq-staff-outer{max-width:560px;width:100%;margin-left:auto;margin-right:auto;margin-bottom:clamp(.3rem,.9vh,.6rem)}.mnq-quiz.mnq-is-fullscreen .mnq-staff-outer{max-width:560px;width:100%;margin-left:auto;margin-right:auto;margin-bottom:clamp(.3rem,.9vh,.6rem)}.mnq-quiz:fullscreen .mnq-staff-wrap{padding:clamp(.3rem,.9vh,.5rem) .4rem}.mnq-quiz:-webkit-full-screen .mnq-staff-wrap{padding:clamp(.3rem,.9vh,.5rem) .4rem}.mnq-quiz:-ms-fullscreen .mnq-staff-wrap{padding:clamp(.3rem,.9vh,.5rem) .4rem}.mnq-quiz.mnq-is-fullscreen .mnq-staff-wrap{padding:clamp(.3rem,.9vh,.5rem) .4rem}.mnq-quiz:fullscreen .mnq-logo{height:clamp(24px,4vh,40px);margin-bottom:0}.mnq-quiz:-webkit-full-screen .mnq-logo{height:clamp(24px,4vh,40px);margin-bottom:0}.mnq-quiz:-ms-fullscreen .mnq-logo{height:clamp(24px,4vh,40px);margin-bottom:0}.mnq-quiz.mnq-is-fullscreen .mnq-logo{height:clamp(24px,4vh,40px);margin-bottom:0}.mnq-quiz:fullscreen .mnq-splash{min-height:0;padding:1rem 0}.mnq-quiz:-webkit-full-screen .mnq-splash{min-height:0;padding:1rem 0}.mnq-quiz:-ms-fullscreen .mnq-splash{min-height:0;padding:1rem 0}.mnq-quiz.mnq-is-fullscreen .mnq-splash{min-height:0;padding:1rem 0}.mnq-quiz:fullscreen .mnq-splash-logo{height:clamp(56px,8vh,110px)}.mnq-quiz:-webkit-full-screen .mnq-splash-logo{height:clamp(56px,8vh,110px)}.mnq-quiz:-ms-fullscreen .mnq-splash-logo{height:clamp(56px,8vh,110px)}.mnq-quiz.mnq-is-fullscreen .mnq-splash-logo{height:clamp(56px,8vh,110px)}.mnq-quiz:fullscreen .mnq-splash-title-card{width:auto;height:clamp(90px,16vh,220px)}.mnq-quiz:-webkit-full-screen .mnq-splash-title-card{width:auto;height:clamp(90px,16vh,220px)}.mnq-quiz:-ms-fullscreen .mnq-splash-title-card{width:auto;height:clamp(90px,16vh,220px)}.mnq-quiz.mnq-is-fullscreen .mnq-splash-title-card{width:auto;height:clamp(90px,16vh,220px)}.mnq-quiz:fullscreen .mnq-top{margin-bottom:clamp(.15rem,.6vh,.4rem)}.mnq-quiz:-webkit-full-screen .mnq-top{margin-bottom:clamp(.15rem,.6vh,.4rem)}.mnq-quiz:-ms-fullscreen .mnq-top{margin-bottom:clamp(.15rem,.6vh,.4rem)}.mnq-quiz.mnq-is-fullscreen .mnq-top{margin-bottom:clamp(.15rem,.6vh,.4rem)}.mnq-quiz:fullscreen .mnq-title{margin-bottom:clamp(.15rem,.6vh,.4rem);gap:.35rem}.mnq-quiz:-webkit-full-screen .mnq-title{margin-bottom:clamp(.15rem,.6vh,.4rem);gap:.35rem}.mnq-quiz:-ms-fullscreen .mnq-title{margin-bottom:clamp(.15rem,.6vh,.4rem);gap:.35rem}.mnq-quiz.mnq-is-fullscreen .mnq-title{margin-bottom:clamp(.15rem,.6vh,.4rem);gap:.35rem}.mnq-quiz:fullscreen .mnq-title-text{font-size:clamp(.85rem,2vh,1.2rem)}.mnq-quiz:-webkit-full-screen .mnq-title-text{font-size:clamp(.85rem,2vh,1.2rem)}.mnq-quiz:-ms-fullscreen .mnq-title-text{font-size:clamp(.85rem,2vh,1.2rem)}.mnq-quiz.mnq-is-fullscreen .mnq-title-text{font-size:clamp(.85rem,2vh,1.2rem)}.mnq-quiz:fullscreen .mnq-title-clef{font-size:clamp(1rem,2.4vh,1.5rem)}.mnq-quiz:-webkit-full-screen .mnq-title-clef{font-size:clamp(1rem,2.4vh,1.5rem)}.mnq-quiz:-ms-fullscreen .mnq-title-clef{font-size:clamp(1rem,2.4vh,1.5rem)}.mnq-quiz.mnq-is-fullscreen .mnq-title-clef{font-size:clamp(1rem,2.4vh,1.5rem)}.mnq-quiz:fullscreen .mnq-title-logo-img{max-height:clamp(22px,3.6vh,42px)}.mnq-quiz:-webkit-full-screen .mnq-title-logo-img{max-height:clamp(22px,3.6vh,42px)}.mnq-quiz:-ms-fullscreen .mnq-title-logo-img{max-height:clamp(22px,3.6vh,42px)}.mnq-quiz.mnq-is-fullscreen .mnq-title-logo-img{max-height:clamp(22px,3.6vh,42px)}.mnq-quiz:fullscreen .mnq-fullscreen-btn{padding:clamp(.3rem,.8vh,.5rem) .6rem;min-height:clamp(28px,3.6vh,36px);font-size:clamp(.72rem,1.5vh,.82rem)}.mnq-quiz:-webkit-full-screen .mnq-fullscreen-btn{padding:clamp(.3rem,.8vh,.5rem) .6rem;min-height:clamp(28px,3.6vh,36px);font-size:clamp(.72rem,1.5vh,.82rem)}.mnq-quiz:-ms-fullscreen .mnq-fullscreen-btn{padding:clamp(.3rem,.8vh,.5rem) .6rem;min-height:clamp(28px,3.6vh,36px);font-size:clamp(.72rem,1.5vh,.82rem)}.mnq-quiz.mnq-is-fullscreen .mnq-fullscreen-btn{padding:clamp(.3rem,.8vh,.5rem) .6rem;min-height:clamp(28px,3.6vh,36px);font-size:clamp(.72rem,1.5vh,.82rem)}.mnq-quiz:fullscreen .mnq-score{font-size:clamp(1.05rem,2.4vh,1.3rem)}.mnq-quiz:-webkit-full-screen .mnq-score{font-size:clamp(1.05rem,2.4vh,1.3rem)}.mnq-quiz:-ms-fullscreen .mnq-score{font-size:clamp(1.05rem,2.4vh,1.3rem)}.mnq-quiz.mnq-is-fullscreen .mnq-score{font-size:clamp(1.05rem,2.4vh,1.3rem)}.mnq-quiz:fullscreen .mnq-time{font-size:clamp(1.05rem,2.4vh,1.3rem)}.mnq-quiz:-webkit-full-screen .mnq-time{font-size:clamp(1.05rem,2.4vh,1.3rem)}.mnq-quiz:-ms-fullscreen .mnq-time{font-size:clamp(1.05rem,2.4vh,1.3rem)}.mnq-quiz.mnq-is-fullscreen .mnq-time{font-size:clamp(1.05rem,2.4vh,1.3rem)}.mnq-quiz:fullscreen .mnq-settings-bar{margin-bottom:clamp(.2rem,.6vh,.4rem);gap:clamp(.18rem,.5vh,.3rem)}.mnq-quiz:-webkit-full-screen .mnq-settings-bar{margin-bottom:clamp(.2rem,.6vh,.4rem);gap:clamp(.18rem,.5vh,.3rem)}.mnq-quiz:-ms-fullscreen .mnq-settings-bar{margin-bottom:clamp(.2rem,.6vh,.4rem);gap:clamp(.18rem,.5vh,.3rem)}.mnq-quiz.mnq-is-fullscreen .mnq-settings-bar{margin-bottom:clamp(.2rem,.6vh,.4rem);gap:clamp(.18rem,.5vh,.3rem)}.mnq-quiz:fullscreen .mnq-settings-bar .mnq-settings{gap:clamp(.18rem,.5vh,.3rem)}.mnq-quiz:-webkit-full-screen .mnq-settings-bar .mnq-settings{gap:clamp(.18rem,.5vh,.3rem)}.mnq-quiz:-ms-fullscreen .mnq-settings-bar .mnq-settings{gap:clamp(.18rem,.5vh,.3rem)}.mnq-quiz.mnq-is-fullscreen .mnq-settings-bar .mnq-settings{gap:clamp(.18rem,.5vh,.3rem)}.mnq-quiz:fullscreen .mnq-clef-btn{padding:clamp(.2rem,.55vh,.4rem) .6rem;min-height:clamp(24px,3.2vh,32px);font-size:clamp(.72rem,1.5vh,.85rem)}.mnq-quiz:-webkit-full-screen .mnq-clef-btn{padding:clamp(.2rem,.55vh,.4rem) .6rem;min-height:clamp(24px,3.2vh,32px);font-size:clamp(.72rem,1.5vh,.85rem)}.mnq-quiz:-ms-fullscreen .mnq-clef-btn{padding:clamp(.2rem,.55vh,.4rem) .6rem;min-height:clamp(24px,3.2vh,32px);font-size:clamp(.72rem,1.5vh,.85rem)}.mnq-quiz.mnq-is-fullscreen .mnq-clef-btn{padding:clamp(.2rem,.55vh,.4rem) .6rem;min-height:clamp(24px,3.2vh,32px);font-size:clamp(.72rem,1.5vh,.85rem)}.mnq-quiz:fullscreen .mnq-clef-btn-symbol{font-size:clamp(1rem,2.2vh,1.3rem);padding-top:.15rem;padding-bottom:.15rem}.mnq-quiz:-webkit-full-screen .mnq-clef-btn-symbol{font-size:clamp(1rem,2.2vh,1.3rem);padding-top:.15rem;padding-bottom:.15rem}.mnq-quiz:-ms-fullscreen .mnq-clef-btn-symbol{font-size:clamp(1rem,2.2vh,1.3rem);padding-top:.15rem;padding-bottom:.15rem}.mnq-quiz.mnq-is-fullscreen .mnq-clef-btn-symbol{font-size:clamp(1rem,2.2vh,1.3rem);padding-top:.15rem;padding-bottom:.15rem}.mnq-quiz:fullscreen .mnq-accidentals-btn .mnq-btn-note-icon{height:clamp(22px,3.6vh,30px)}.mnq-quiz:-webkit-full-screen .mnq-accidentals-btn .mnq-btn-note-icon{height:clamp(22px,3.6vh,30px)}.mnq-quiz:-ms-fullscreen .mnq-accidentals-btn .mnq-btn-note-icon{height:clamp(22px,3.6vh,30px)}.mnq-quiz.mnq-is-fullscreen .mnq-accidentals-btn .mnq-btn-note-icon{height:clamp(22px,3.6vh,30px)}.mnq-quiz:fullscreen .mnq-mic-status{margin-top:0;font-size:clamp(.68rem,1.5vh,.78rem)}.mnq-quiz:-webkit-full-screen .mnq-mic-status{margin-top:0;font-size:clamp(.68rem,1.5vh,.78rem)}.mnq-quiz:-ms-fullscreen .mnq-mic-status{margin-top:0;font-size:clamp(.68rem,1.5vh,.78rem)}.mnq-quiz.mnq-is-fullscreen .mnq-mic-status{margin-top:0;font-size:clamp(.68rem,1.5vh,.78rem)}.mnq-quiz:fullscreen .mnq-feedback{margin-bottom:.3rem;font-size:clamp(1.5rem,3.2vh,1.9rem);min-height:2.2em}.mnq-quiz:-webkit-full-screen .mnq-feedback{margin-bottom:.3rem;font-size:clamp(1.5rem,3.2vh,1.9rem);min-height:2.2em}.mnq-quiz:-ms-fullscreen .mnq-feedback{margin-bottom:.3rem;font-size:clamp(1.5rem,3.2vh,1.9rem);min-height:2.2em}.mnq-quiz.mnq-is-fullscreen .mnq-feedback{margin-bottom:.3rem;font-size:clamp(1.5rem,3.2vh,1.9rem);min-height:2.2em}.mnq-quiz:fullscreen .mnq-logo{height:clamp(18px,3vh,28px)}.mnq-quiz:-webkit-full-screen .mnq-logo{height:clamp(18px,3vh,28px)}.mnq-quiz:-ms-fullscreen .mnq-logo{height:clamp(18px,3vh,28px)}.mnq-quiz.mnq-is-fullscreen .mnq-logo{height:clamp(18px,3vh,28px)}@media(orientation:landscape) and (max-height:500px){.mnq-quiz:fullscreen{padding-top:.4rem;padding-bottom:.4rem}.mnq-quiz:-webkit-full-screen{padding-top:.4rem;padding-bottom:.4rem}.mnq-quiz:-ms-fullscreen{padding-top:.4rem;padding-bottom:.4rem}.mnq-quiz.mnq-is-fullscreen{padding-top:.4rem;padding-bottom:.4rem}}@media (orientation:landscape) and (max-height:600px),(min-width:900px){.mnq-quiz.mnq-game-screen{display:grid;grid-template-columns:minmax(180px,240px) minmax(0,1fr);column-gap:1.25rem;row-gap:.5rem;align-items:start;grid-template-areas:"top top" "title title" "compete compete" "settings staff" "settings feedback" "logo piano" "roundover roundover"}.mnq-quiz.mnq-game-screen:fullscreen{display:grid;grid-template-columns:minmax(180px,240px) minmax(0,1fr);column-gap:1.25rem;row-gap:.5rem;align-items:start;grid-template-areas:"top top" "title title" "compete compete" "settings staff" "settings feedback" "logo piano" "roundover roundover"}.mnq-quiz.mnq-game-screen:-webkit-full-screen{display:grid;grid-template-columns:minmax(180px,240px) minmax(0,1fr);column-gap:1.25rem;row-gap:.5rem;align-items:start;grid-template-areas:"top top" "title title" "compete compete" "settings staff" "settings feedback" "logo piano" "roundover roundover"}.mnq-quiz.mnq-game-screen:-ms-fullscreen{display:grid;grid-template-columns:minmax(180px,240px) minmax(0,1fr);column-gap:1.25rem;row-gap:.5rem;align-items:start;grid-template-areas:"top top" "title title" "compete compete" "settings staff" "settings feedback" "logo piano" "roundover roundover"}.mnq-quiz.mnq-game-screen.mnq-is-fullscreen{display:grid;grid-template-columns:minmax(180px,240px) minmax(0,1fr);column-gap:1.25rem;row-gap:.5rem;align-items:start;grid-template-areas:"top top" "title title" "compete compete" "settings staff" "settings feedback" "logo piano" "roundover roundover"}.mnq-quiz.mnq-game-screen>.mnq-top{grid-area:top;margin-bottom:0;position:relative;z-index:2}.mnq-quiz.mnq-game-screen>.mnq-title{grid-area:title;margin-top:.35rem;margin-bottom:.4rem;position:relative;z-index:1}.mnq-quiz.mnq-game-screen .mnq-title-logo-img{max-height:64px}.mnq-quiz.mnq-game-screen>.mnq-compete-bar{grid-area:compete;margin:0}.mnq-quiz.mnq-game-screen>.mnq-settings-bar{grid-area:settings;flex-direction:column;align-items:stretch;margin-bottom:0}.mnq-quiz.mnq-game-screen>.mnq-settings-bar .mnq-settings{flex-direction:column;align-items:stretch;gap:.5rem}.mnq-quiz.mnq-game-screen>.mnq-settings-bar .mnq-clef-group,.mnq-quiz.mnq-game-screen>.mnq-settings-bar .mnq-difficulty-group{width:100%;flex-wrap:wrap;overflow:visible}.mnq-quiz.mnq-game-screen>.mnq-settings-bar .mnq-toggle-group{width:100%;flex-wrap:wrap;overflow:visible;justify-content:flex-start}.mnq-quiz.mnq-game-screen>.mnq-settings-bar .mnq-clef-btn{text-align:center;font-size:.8rem;padding:.4rem .55rem;min-height:34px;white-space:nowrap}.mnq-quiz.mnq-game-screen>.mnq-settings-bar .mnq-clef-group:not(.mnq-toggle-group) .mnq-clef-btn{flex:1 1 0%;min-width:0}.mnq-quiz.mnq-game-screen>.mnq-settings-bar .mnq-toggle-group .mnq-clef-btn{flex:0 0 auto}.mnq-quiz.mnq-game-screen>.mnq-settings-bar .mnq-clef-btn-symbol{font-size:1.15rem;padding-top:.25rem;padding-bottom:.25rem}.mnq-quiz.mnq-game-screen>.mnq-settings-bar .mnq-accidentals-btn .mnq-btn-note-icon{height:20px}.mnq-quiz.mnq-game-screen>.mnq-staff-outer{grid-area:staff;margin-bottom:0;align-self:end}.mnq-quiz.mnq-game-screen>.mnq-feedback{grid-area:feedback;margin-bottom:0}.mnq-quiz.mnq-game-screen>.mnq-piano-wrap{grid-area:piano;align-self:end}.mnq-quiz.mnq-game-screen>.mnq-logo-bottom-wrap{grid-area:logo;margin:.5rem 0 0;width:80%;max-width:190px;align-self:end;justify-self:start}.mnq-quiz.mnq-game-screen>.mnq-logo-bottom-wrap .mnq-logo-bottom{height:auto;width:100%}.mnq-quiz.mnq-game-screen>.mnq-logo-bottom-wrap .mnq-logo-img-wrap{display:block;width:100%}.mnq-quiz.mnq-game-screen>.mnq-round-over{grid-area:roundover;margin-top:.5rem}}.mnq-access-gate{display:flex;flex-direction:column;align-items:center;gap:.85rem;text-align:center;padding:2.4rem 1.2rem}.mnq-access-title{font-family:Fraunces,Georgia,Times New Roman,serif;font-weight:600;font-size:1.35rem;color:var(--mnq-burgundy-dark);margin:0}.mnq-access-sub{font-size:.9rem;color:var(--mnq-ink-soft);margin:0 0 .3rem;max-width:340px}.mnq-access-choice-row{display:flex;gap:.6rem;flex-wrap:wrap;justify-content:center;width:100%;max-width:360px}.mnq-access-choice-btn{appearance:none;border-radius:9px;font-family:inherit;font-weight:700;font-size:1rem;padding:.8rem .5rem;min-height:52px;flex:0 0 170px;box-sizing:border-box;cursor:pointer;transition:background .15s ease,color .15s ease,border-color .15s ease,transform .1s ease}.mnq-access-choice-btn:active{transform:scale(.97)}.mnq-access-choice-code{border:1px solid var(--mnq-burgundy);background:var(--mnq-burgundy);color:#fff}.mnq-access-choice-code:hover{background:var(--mnq-burgundy-dark);border-color:var(--mnq-burgundy-dark)}.mnq-access-choice-demo{border:1px solid var(--mnq-gold);background:#fff0;color:var(--mnq-burgundy-dark)}.mnq-access-choice-demo:hover{background:var(--mnq-gold);color:#fff}.mnq-access-back{appearance:none;align-self:flex-start;border:none;background:#fff0;color:var(--mnq-ink-soft);font-family:inherit;font-size:.8rem;font-weight:600;padding:.2rem .1rem;cursor:pointer;flex:0 0 100%;text-align:left}.mnq-access-back:hover{color:var(--mnq-ink);text-decoration:underline}.mnq-access-buy{display:inline-flex;align-items:center;justify-content:center;appearance:none;border:none;border-radius:9px;background:linear-gradient(135deg,var(--mnq-gold),#c99a2e);color:#fff;font-family:inherit;font-weight:700;font-size:1rem;padding:.8rem .5rem;width:170px;box-sizing:border-box;min-height:52px;white-space:nowrap;cursor:pointer;text-decoration:none;box-shadow:0 2px 6px rgb(34 34 34 / .15)}.mnq-access-buy:hover{filter:brightness(1.06)}.mnq-access-caption{font-size:.72rem;line-height:1.5;color:var(--mnq-ink-soft);margin:.1rem 0 0;max-width:320px}.mnq-access-caption strong{color:var(--mnq-ink)}.mnq-access-form{display:flex;gap:.5rem;flex-wrap:wrap;justify-content:center;width:100%;max-width:340px}.mnq-access-form[hidden],.mnq-access-choice-row[hidden]{display:none}.mnq-access-input{flex:1 1 180px;min-width:0;font-family:inherit;font-size:1rem;padding:.7rem .9rem;border:1px solid var(--mnq-paper-line);border-radius:8px;background:#fff;color:var(--mnq-ink);min-height:44px;text-align:center;letter-spacing:.04em}.mnq-access-input:focus{outline:2px solid var(--mnq-burgundy);outline-offset:1px}.mnq-access-submit{appearance:none;border:none;border-radius:8px;background:var(--mnq-burgundy);color:#fff;font-family:inherit;font-weight:600;font-size:.95rem;padding:.7rem 1.2rem;min-height:44px;cursor:pointer}.mnq-access-submit:disabled{opacity:.6;cursor:default}.mnq-access-error{min-height:1.2em;font-size:.85rem;color:var(--mnq-terracotta);margin:0}.mnq-clef-btn:disabled,.mnq-clef-btn.mnq-demo-locked{opacity:.4;cursor:not-allowed}.mnq-full-mode-btn{color:var(--mnq-terracotta)}.mnq-buy-btn{border:none!important;background:linear-gradient(135deg,var(--mnq-gold),#c99a2e)!important;color:#fff!important;text-decoration:none}.mnq-buy-btn:hover{filter:brightness(1.06)}@keyframes mnq-shimmer-sweep{0%{transform:translateX(-160%) skewX(-20deg)}55%,100%{transform:translateX(260%) skewX(-20deg)}}.mnq-shimmer{position:relative;overflow:hidden}.mnq-shimmer::after{content:"";position:absolute;top:0;left:0;width:35%;height:100%;background:linear-gradient(120deg,transparent,rgb(255 255 255 / .65),transparent);animation:mnq-shimmer-sweep 3.2s ease-in-out infinite;pointer-events:none}.mnq-welcome-flash{position:absolute;top:14px;left:50%;transform:translate(-50%,-10px);z-index:30;background:var(--mnq-burgundy);color:#fff;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1rem;padding:.6rem 1.3rem;border-radius:999px;box-shadow:0 4px 14px rgb(34 34 34 / .25);opacity:0;pointer-events:none;transition:opacity .35s ease,transform .35s ease;white-space:nowrap;max-width:88%;overflow:hidden;text-overflow:ellipsis}.mnq-welcome-flash.is-visible{opacity:1;transform:translate(-50%,0)}
.mnq-quiz.mnq-is-fullscreen .mnq-mic-fs-hint{display:none}

/* Fun buttons: chunky, pressable, same blue / gold / grey palette. Style only, sizes and layout are untouched. */
.mnq-quiz .mnq-clef-btn,.mnq-quiz .mnq-mode-btn,.mnq-quiz .mnq-access-choice-btn,.mnq-quiz .mnq-access-buy,.mnq-quiz .mnq-access-submit,.mnq-quiz .mnq-scoreboard-btn,.mnq-quiz .mnq-finish-btn,.mnq-quiz .mnq-fullscreen-btn,.mnq-quiz .mnq-exit-btn,.mnq-quiz .mnq-help-btn{transition:transform .14s cubic-bezier(.3,1.6,.5,1),box-shadow .14s ease,background .15s ease,color .15s ease,border-color .15s ease,filter .15s ease;-webkit-tap-highlight-color:transparent}
.mnq-quiz .mnq-clef-group:not(.mnq-toggle-group){border-radius:12px;background:#fff;box-shadow:0 3px 0 rgb(173 147 55 / .55),0 5px 10px rgb(34 34 34 / .1)}
.mnq-quiz .mnq-clef-group:not(.mnq-toggle-group) .mnq-clef-btn:not([aria-pressed=true]):not(:disabled):not(.mnq-demo-locked):hover{background:#f8f2d9;color:var(--mnq-burgundy-dark)}
.mnq-quiz .mnq-clef-btn[aria-pressed=true]{background:linear-gradient(180deg,#5b8fbd 0%,#4073a2 55%,#356491 100%);color:#fff;text-shadow:0 1px 0 rgb(0 0 0 / .18);box-shadow:inset 0 -2px 0 rgb(0 0 0 / .14),inset 0 1px 0 rgb(255 255 255 / .28)}
.mnq-quiz .mnq-toggle-group .mnq-clef-btn{border-radius:11px;background:linear-gradient(180deg,#fff 0%,#f0f0f0 100%);box-shadow:0 3px 0 rgb(173 147 55 / .55),0 5px 9px rgb(34 34 34 / .1)}
.mnq-quiz .mnq-toggle-group .mnq-clef-btn[aria-pressed=true]{background:linear-gradient(180deg,#5b8fbd 0%,#4073a2 55%,#356491 100%);border-color:var(--mnq-burgundy-dark);box-shadow:0 3px 0 var(--mnq-burgundy-dark),0 5px 9px rgb(47 85 120 / .35),inset 0 1px 0 rgb(255 255 255 / .28)}
.mnq-quiz .mnq-toggle-group .mnq-clef-btn:not(:disabled):not(.mnq-demo-locked):hover{transform:translateY(-2px) scale(1.03);box-shadow:0 5px 0 rgb(173 147 55 / .55),0 9px 14px rgb(34 34 34 / .16)}
.mnq-quiz .mnq-toggle-group .mnq-clef-btn[aria-pressed=true]:not(:disabled):hover{box-shadow:0 5px 0 var(--mnq-burgundy-dark),0 9px 14px rgb(47 85 120 / .4),inset 0 1px 0 rgb(255 255 255 / .28)}
.mnq-quiz .mnq-toggle-group .mnq-clef-btn:not(:disabled):not(.mnq-demo-locked):active{transform:translateY(2px) scale(.98);box-shadow:0 1px 0 rgb(173 147 55 / .55),0 2px 4px rgb(34 34 34 / .12)}
.mnq-quiz .mnq-clef-group:not(.mnq-toggle-group) .mnq-clef-btn:not(:disabled):not(.mnq-demo-locked):active{transform:scale(.96)}
.mnq-quiz .mnq-mode-btn,.mnq-quiz .mnq-access-choice-btn,.mnq-quiz .mnq-access-buy{border-radius:14px;box-shadow:0 4px 0 rgb(173 147 55 / .6),0 8px 14px rgb(34 34 34 / .14)}
.mnq-quiz .mnq-mode-btn-practise,.mnq-quiz .mnq-access-choice-code{background:linear-gradient(180deg,#5b8fbd 0%,#4073a2 55%,#356491 100%);text-shadow:0 1px 0 rgb(0 0 0 / .18);box-shadow:0 4px 0 var(--mnq-burgundy-dark),0 8px 14px rgb(47 85 120 / .35),inset 0 1px 0 rgb(255 255 255 / .28)}
.mnq-quiz .mnq-access-choice-demo{background:linear-gradient(180deg,#fff 0%,#f3f3f3 100%)}
.mnq-quiz .mnq-access-buy{background:linear-gradient(180deg,#c9ae4c 0%,var(--mnq-gold) 55%,#9b8230 100%);text-shadow:0 1px 0 rgb(0 0 0 / .2);box-shadow:0 4px 0 #7f6b26,0 8px 14px rgb(127 107 38 / .35),inset 0 1px 0 rgb(255 255 255 / .35)}
.mnq-quiz .mnq-mode-btn:hover,.mnq-quiz .mnq-access-choice-btn:hover,.mnq-quiz .mnq-access-buy:hover{transform:translateY(-3px) scale(1.03)}
.mnq-quiz .mnq-mode-btn:active,.mnq-quiz .mnq-access-choice-btn:active,.mnq-quiz .mnq-access-buy:active{transform:translateY(3px) scale(.98);box-shadow:0 1px 0 rgb(0 0 0 / .25),0 2px 4px rgb(34 34 34 / .15)}
.mnq-quiz .mnq-access-submit,.mnq-quiz .mnq-scoreboard-btn,.mnq-quiz .mnq-finish-btn{border-radius:12px;box-shadow:0 3px 0 rgb(47 85 120 / .55),0 6px 10px rgb(34 34 34 / .12)}
.mnq-quiz .mnq-access-submit:not(:disabled):hover,.mnq-quiz .mnq-scoreboard-btn:hover,.mnq-quiz .mnq-finish-btn:hover{transform:translateY(-2px)}
.mnq-quiz .mnq-access-submit:not(:disabled):active,.mnq-quiz .mnq-scoreboard-btn:active,.mnq-quiz .mnq-finish-btn:active{transform:translateY(2px);box-shadow:0 1px 0 rgb(47 85 120 / .55)}
.mnq-quiz .mnq-fullscreen-btn,.mnq-quiz .mnq-exit-btn{border-radius:999px;border:1px solid var(--mnq-gold);background:linear-gradient(180deg,#fff 0%,#f0f0f0 100%);color:var(--mnq-burgundy-dark);box-shadow:0 3px 0 rgb(173 147 55 / .55),0 5px 8px rgb(34 34 34 / .1)}
.mnq-quiz .mnq-fullscreen-btn:hover{background:linear-gradient(180deg,#5b8fbd 0%,#4073a2 100%);border-color:var(--mnq-burgundy-dark);color:#fff;transform:translateY(-2px)}
.mnq-quiz .mnq-exit-btn:hover{transform:translateY(-2px)}
.mnq-quiz .mnq-fullscreen-btn:active,.mnq-quiz .mnq-exit-btn:active{transform:translateY(2px);box-shadow:0 1px 0 rgb(173 147 55 / .55)}
.mnq-quiz .mnq-help-btn{border:none;background:linear-gradient(180deg,#c9ae4c 0%,var(--mnq-gold) 55%,#9b8230 100%);color:#fff;font-size:1.05rem;text-shadow:0 1px 0 rgb(0 0 0 / .2);box-shadow:0 3px 0 #7f6b26,0 5px 9px rgb(127 107 38 / .35),inset 0 1px 0 rgb(255 255 255 / .35)}
.mnq-quiz .mnq-help-btn:hover{transform:translateY(-2px) rotate(-8deg) scale(1.08);border:none}
.mnq-quiz .mnq-help-btn:active{transform:translateY(2px) scale(.96);box-shadow:0 1px 0 #7f6b26}
.mnq-quiz .mnq-buy-btn{border-radius:11px!important;text-shadow:0 1px 0 rgb(0 0 0 / .2);box-shadow:0 3px 0 #7f6b26,0 5px 9px rgb(127 107 38 / .35)!important}
.mnq-quiz .mnq-buy-btn:hover{filter:none;transform:translateY(-2px) scale(1.03)}
.mnq-quiz .mnq-buy-btn:active{transform:translateY(2px);box-shadow:0 1px 0 #7f6b26!important}
.mnq-quiz .mnq-manage-sub-btn{border-radius:11px!important;text-shadow:0 1px 0 rgb(0 0 0 / .18);box-shadow:0 3px 0 var(--mnq-burgundy-dark),0 5px 9px rgb(47 85 120 / .3)!important;background:linear-gradient(180deg,#5b8fbd 0%,#4073a2 55%,#356491 100%)!important;color:#fff!important}
.mnq-quiz .mnq-manage-sub-btn:hover{filter:none;transform:translateY(-2px) scale(1.03)}
.mnq-quiz .mnq-manage-sub-btn:active{transform:translateY(2px);box-shadow:0 1px 0 var(--mnq-burgundy-dark)!important}
.mnq-quiz .mnq-logout-btn{border-radius:11px!important;background:linear-gradient(180deg,#8a8f99 0%,#6b7078 100%)!important;color:#fff!important;text-shadow:0 1px 0 rgb(0 0 0 / .18);box-shadow:0 3px 0 #52565c,0 5px 9px rgb(34 34 34 / .25)!important}
.mnq-quiz .mnq-logout-btn:hover{filter:none;transform:translateY(-2px) scale(1.03)}
.mnq-quiz .mnq-logout-btn:active{transform:translateY(2px);box-shadow:0 1px 0 #52565c!important}
@media (prefers-reduced-motion:reduce){.mnq-quiz .mnq-clef-btn,.mnq-quiz .mnq-mode-btn,.mnq-quiz .mnq-access-choice-btn,.mnq-quiz .mnq-access-buy,.mnq-quiz .mnq-access-submit,.mnq-quiz .mnq-scoreboard-btn,.mnq-quiz .mnq-finish-btn,.mnq-quiz .mnq-fullscreen-btn,.mnq-quiz .mnq-exit-btn,.mnq-quiz .mnq-help-btn{transition:none}.mnq-quiz *:hover,.mnq-quiz *:active{transform:none!important}}
.mnq-quiz .mnq-clef-group:not(.mnq-toggle-group) .mnq-clef-btn:first-child{border-radius:11px 0 0 11px}
.mnq-quiz .mnq-clef-group:not(.mnq-toggle-group) .mnq-clef-btn:last-child{border-radius:0 11px 11px 0}
.mnq-quiz .mnq-clef-group:not(.mnq-toggle-group) .mnq-clef-btn:only-child{border-radius:11px}

/* Countdown time-remaining line indicator (replaces the analogue clock face) */
.mnq-time{line-height:1;width:100%}
.mnq-time-line{display:flex;align-items:center;gap:.55rem;width:100%}
.mnq-time-line-track{position:relative;flex:1 1 auto;height:8px;border-radius:999px;background:rgb(64 115 162 / .16);overflow:hidden}
.mnq-time-line-fill{position:absolute;top:0;left:0;bottom:0;width:0%;border-radius:999px;background:var(--mnq-burgundy);transition:width 1s linear,background-color .2s ease}
.mnq-time-line-label{flex:0 0 auto;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:.95rem;color:var(--mnq-burgundy);white-space:nowrap;min-width:2.6em;text-align:right}
.mnq-time.is-low .mnq-time-line-fill{background:var(--mnq-terracotta)}
.mnq-time.is-low .mnq-time-line-label{color:var(--mnq-terracotta)}
.mnq-time.is-low .mnq-time-line-track{animation:mnq-time-line-pulse 1s ease-in-out infinite}
@keyframes mnq-time-line-pulse{0%,100%{opacity:1}50%{opacity:.5}}
@media (prefers-reduced-motion:reduce){.mnq-time.is-low .mnq-time-line-track{animation:none}}
@media(min-width:641px){.mnq-time-line-track{height:11px}.mnq-time-line-label{font-size:1.1rem;min-width:3em}}
@media(min-width:900px){.mnq-time-line-track{height:14px}.mnq-time-line-label{font-size:1.3rem}}
.mnq-quiz:fullscreen .mnq-time-line-track,.mnq-quiz.mnq-is-fullscreen .mnq-time-line-track{height:clamp(8px,1.6vh,14px)}
/* Tidier button grid on narrow screens */
@media(max-width:640px){.mnq-settings-bar .mnq-toggle-group{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.4rem;width:100%}.mnq-settings-bar .mnq-toggle-group .mnq-clef-btn{width:100%;flex:none;padding:.5rem .3rem;font-size:.78rem}.mnq-settings-bar .mnq-toggle-group .mnq-clef-btn-symbol{font-size:1.3rem}}
.mnq-time-row{margin-top:.35rem}

/* Round length picker: a proper "dropdown" button and chip-style choices */
.mnq-quiz .mnq-timer-dropdown{width:100%}
.mnq-quiz .mnq-timer-dropdown .mnq-clef-group{display:flex;width:100%;border-color:var(--mnq-gold);background:linear-gradient(180deg,#fffdf4 0%,#f7f0d3 100%)}
.mnq-quiz .mnq-timer-dropdown-btn{flex:1 1 auto;justify-content:center;gap:.5rem;width:100%;font-weight:700;letter-spacing:.01em;background:transparent}
.mnq-quiz .mnq-timer-dropdown-btn[aria-expanded=true]{background:linear-gradient(180deg,#f3e9bd 0%,#ebdf9f 100%)}
.mnq-quiz .mnq-timer-dropdown-panel{display:grid;grid-template-columns:1fr 1fr;gap:.45rem;min-width:220px;padding:.55rem;border:1px solid var(--mnq-gold);border-radius:14px;background:#fffdf4;box-shadow:0 10px 24px rgb(34 34 34 / .22),0 3px 0 rgb(173 147 55 / .5)}
.mnq-quiz .mnq-timer-dropdown-panel[hidden]{display:none}
.mnq-quiz .mnq-timer-option{text-align:center;min-height:42px;padding:.5rem .4rem;border:1px solid rgb(173 147 55 / .55);border-radius:11px;background:linear-gradient(180deg,#fff 0%,#f2f2f2 100%);font-weight:700;box-shadow:0 2px 0 rgb(173 147 55 / .5);transition:transform .12s cubic-bezier(.3,1.6,.5,1),box-shadow .12s ease,background .15s ease,color .15s ease}
.mnq-quiz .mnq-timer-option:hover{background:#f8f2d9;transform:translateY(-2px);box-shadow:0 4px 0 rgb(173 147 55 / .5)}
.mnq-quiz .mnq-timer-option:active{transform:translateY(1px);box-shadow:0 1px 0 rgb(173 147 55 / .5)}
.mnq-quiz .mnq-timer-option[aria-pressed=true]{background:linear-gradient(180deg,#5b8fbd 0%,#4073a2 55%,#356491 100%);color:#fff;border-color:var(--mnq-burgundy-dark);box-shadow:0 2px 0 var(--mnq-burgundy-dark),inset 0 1px 0 rgb(255 255 255 / .28)}
@media (prefers-reduced-motion:reduce){.mnq-quiz .mnq-timer-option{transition:none}}
/* Feedback text stays a second longer, then fades out */
.mnq-feedback.is-fading{opacity:0;transition:opacity .45s ease}
@media (prefers-reduced-motion:reduce){.mnq-feedback.is-fading{transition:none}}

/* Flashcards-only maintenance mode notice (shown to non-admin visitors while admin > Flashcards game > Maintenance mode is on) */
.mnq-maint{max-width:460px;margin:1.25rem auto;padding:2.2rem 1.6rem;text-align:center;background:var(--mnq-paper,#ececec);border:1px solid var(--mnq-paper-line,#dcdcdc);border-radius:10px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}
.mnq-maint h3{margin:0 0 .5rem;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.3rem;color:var(--mnq-burgundy-dark,#2f5578)}
.mnq-maint p{margin:0;color:var(--mnq-ink-soft,#5a5a5a);font-size:.95rem;line-height:1.5}

/* ---- personal scoreboard ---- */
.mnq-quiz .mnq-scoreboard-open-btn{border-radius:11px!important;text-shadow:0 1px 0 rgb(0 0 0 / .18);box-shadow:0 3px 0 #2f5578,0 5px 9px rgb(47 85 120 / .3)!important;background:linear-gradient(180deg,#c9ae4c 0%,#ad9337 55%,#9b8230 100%)!important;color:#fff!important}
.mnq-quiz .mnq-scoreboard-open-btn:active{transform:translateY(2px);box-shadow:0 1px 0 #2f5578!important}
.mnq-sb-overlay{--sb-blue:#4073a2;--sb-navy:#2f5578;--sb-gold:#ad9337;--sb-ink:#222;--sb-soft:#5a5a5a;position:fixed;inset:0;z-index:2147483000;display:flex;align-items:flex-start;justify-content:center;padding:16px;overflow-y:auto;background:rgb(20 30 50 / .62);font-family:Inter,system-ui,Segoe UI,sans-serif;animation:mnq-sb-fade .2s ease}
.mnq-sb-card{position:relative;box-sizing:border-box;width:100%;max-width:520px;margin:auto;padding:18px 16px 16px;background:#f6f7f9;border:2px solid var(--sb-gold);border-radius:16px;box-shadow:0 18px 50px rgb(0 0 0 / .35);color:var(--sb-ink);animation:mnq-sb-pop .28s cubic-bezier(.2,1.3,.4,1)}
.mnq-sb-head{display:flex;align-items:center;gap:12px}
.mnq-sb-avatar{flex:none;width:58px;height:58px;display:flex;align-items:center;justify-content:center;font-size:2rem;background:linear-gradient(180deg,#5b8fbd,#356491);border-radius:50%;box-shadow:0 3px 0 var(--sb-navy)}
.mnq-sb-headtext{flex:1;min-width:0}
.mnq-sb-title{margin:0;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.35rem;color:var(--sb-navy)}
.mnq-sb-level{margin:.1rem 0 .35rem;font-weight:700;color:var(--sb-gold);font-size:.95rem}
.mnq-sb-xp{height:11px;background:#dfe3e8;border-radius:99px;overflow:hidden}
.mnq-sb-xp-fill{display:block;width:0;height:100%;border-radius:99px;background:linear-gradient(90deg,#c9ae4c,#e6cf6a);transition:width 1s cubic-bezier(.2,.8,.2,1)}
.mnq-sb-xp-label{margin:.25rem 0 0;font-size:.75rem;color:var(--sb-soft)}
.mnq-sb-close{flex:none;align-self:flex-start;appearance:none;border:none;width:36px;height:36px;border-radius:50%;background:#e5e8ec;color:var(--sb-navy);font-size:1rem;cursor:pointer}
.mnq-sb-close:hover{background:#d5dae0}
.mnq-sb-tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:14px 0 10px}
.mnq-sb-tile{display:flex;flex-direction:column;align-items:center;gap:1px;padding:9px 4px;background:#fff;border:1px solid #e0e3e8;border-radius:12px;text-align:center}
.mnq-sb-tile-ico{font-size:1.2rem}
.mnq-sb-tile-num{font-family:Fraunces,Georgia,serif;font-size:1.3rem;color:var(--sb-navy)}
.mnq-sb-tile-lab{font-size:.68rem;color:var(--sb-soft)}
.mnq-sb-empty,.mnq-sb-loading{margin:18px 0;text-align:center;color:var(--sb-soft);line-height:1.5}
.mnq-sb-tabs{display:flex;gap:6px;margin:6px 0 10px;padding:4px;background:#e5e8ec;border-radius:12px}
.mnq-sb-tab{flex:1;appearance:none;border:none;padding:.55rem .3rem;min-height:40px;border-radius:9px;background:transparent;color:var(--sb-navy);font-weight:600;font-size:.85rem;font-family:inherit;cursor:pointer}
.mnq-sb-tab.is-on{background:#fff;box-shadow:0 1px 4px rgb(0 0 0 / .15)}
.mnq-sb-pane[hidden]{display:none}
.mnq-sb-sub{margin:0 0 6px;font-size:.8rem;color:var(--sb-soft)}
.mnq-sb-chart{display:flex;align-items:flex-end;gap:5px;height:130px;padding:8px 6px 0;background:#fff;border:1px solid #e0e3e8;border-radius:12px}
.mnq-sb-bar{flex:1;height:100%;display:flex;align-items:flex-end;appearance:none;border:none;background:transparent;padding:0;cursor:pointer;min-width:0}
.mnq-sb-bar-fill{display:block;width:100%;border-radius:6px 6px 0 0;background:var(--c,#4073a2);transition:height .7s cubic-bezier(.2,.9,.3,1.2),filter .15s}
.mnq-sb-bar:hover .mnq-sb-bar-fill,.mnq-sb-bar.is-sel .mnq-sb-bar-fill{filter:brightness(1.15) saturate(1.2);outline:2px solid var(--sb-navy);outline-offset:1px}
.t30{--c:#e8735a}.t60{--c:#4073a2}.t120{--c:#22a06b}.tinfinite{--c:#a78bfa}
.mnq-sb-bar-info{min-height:2.4em;margin:8px 0 2px;font-size:.82rem;color:var(--sb-navy);font-weight:600;text-align:center}
.mnq-sb-legend{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 10px;margin:4px 0}
.mnq-sb-key{font-size:.72rem;color:var(--sb-soft)}
.mnq-sb-key:before{content:"";display:inline-block;width:9px;height:9px;margin-right:4px;border-radius:3px;background:var(--c)}
.mnq-sb-mini{margin:6px 0 0;text-align:center;font-size:.8rem;color:var(--sb-soft)}
.mnq-sb-cards{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.mnq-sb-best{display:flex;flex-direction:column;align-items:center;gap:2px;padding:14px 8px;background:#fff;border:1px solid #e0e3e8;border-radius:14px;text-align:center;transition:transform .15s}
.mnq-sb-best:hover{transform:translateY(-3px)}
.mnq-sb-best.is-top{border:2px solid var(--sb-gold);background:linear-gradient(180deg,#fffaf0,#fff)}
.mnq-sb-best.is-empty{opacity:.6}
.mnq-sb-best-lab{font-weight:700;font-size:.85rem;color:var(--sb-navy)}
.mnq-sb-best-num{font-family:Fraunces,Georgia,serif;font-size:2.1rem;line-height:1.1;color:var(--sb-gold)}
.mnq-sb-best-sub{font-size:.72rem;color:var(--sb-soft)}
.mnq-sb-badges{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.mnq-sb-badge{display:flex;flex-direction:column;align-items:center;gap:3px;appearance:none;border:1px solid #e0e3e8;padding:10px 4px;background:#fff;border-radius:12px;cursor:pointer;font-family:inherit;color:var(--sb-navy)}
.mnq-sb-badge-ico{font-size:1.9rem}
.mnq-sb-badge-name{font-size:.72rem;font-weight:700;line-height:1.15}
.mnq-sb-badge.is-earned{border-color:var(--sb-gold);background:linear-gradient(180deg,#fffaf0,#fff);animation:mnq-sb-pop .4s cubic-bezier(.2,1.5,.4,1) both}
.mnq-sb-badge.is-earned:hover{transform:rotate(-3deg) scale(1.05)}
.mnq-sb-badge.is-locked .mnq-sb-badge-ico{filter:grayscale(1);opacity:.4}
.mnq-sb-badge.is-locked{color:var(--sb-soft)}
.mnq-sb-badge-bar{display:block;width:80%;height:5px;background:#e3e6ea;border-radius:9px;overflow:hidden}
.mnq-sb-badge-bar span{display:block;height:100%;background:var(--sb-blue)}
.mnq-sb-lock{margin:12px 0 0;text-align:center;font-size:.75rem;color:var(--sb-soft)}
.mnq-sb-roundnote{display:flex;flex-direction:column;align-items:center;gap:4px;width:100%}
.mnq-sb-roundline{margin:0;font-weight:600;font-size:.95rem;color:var(--mnq-burgundy-dark,#2f5578);animation:mnq-sb-pop .35s ease both}
.mnq-sb-open-btn{appearance:none;margin-top:4px;padding:.55rem 1rem;min-height:40px;border:1px solid var(--mnq-gold,#ad9337);border-radius:9px;background:#fff;color:var(--mnq-burgundy-dark,#2f5578);font-weight:700;font-size:.9rem;font-family:inherit;cursor:pointer}
.mnq-round-over{position:relative;overflow:hidden}
.mnq-sb-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.mnq-sb-confetti span{position:absolute;top:-10px;width:8px;height:12px;border-radius:2px;animation:mnq-sb-fall 1.8s ease-in both}
@keyframes mnq-sb-fall{to{transform:translate(var(--dx),260px) rotate(540deg);opacity:0}}
@keyframes mnq-sb-pop{from{transform:scale(.85);opacity:0}to{transform:none;opacity:1}}
@keyframes mnq-sb-fade{from{opacity:0}to{opacity:1}}
@media (max-width:420px){.mnq-sb-tiles{grid-template-columns:repeat(2,1fr)}.mnq-sb-badges{grid-template-columns:repeat(2,1fr)}}
@media (prefers-reduced-motion:reduce){.mnq-sb-overlay,.mnq-sb-card,.mnq-sb-badge.is-earned,.mnq-sb-roundline,.mnq-sb-confetti span{animation:none}.mnq-sb-xp-fill,.mnq-sb-bar-fill{transition:none}}
/* round-over box: centred over the game screen instead of below the piano */
.mnq-quiz>.mnq-round-over,.mnq-quiz.mnq-game-screen>.mnq-round-over{grid-area:auto;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:60;box-sizing:border-box;width:min(88%,380px);margin:0;padding:1.4rem 1.2rem;border:2px solid var(--mnq-gold);border-radius:16px;box-shadow:0 0 0 9999px rgb(20 30 50 / .38),0 18px 44px rgb(0 0 0 / .3);overflow:hidden}
.mnq-quiz>.mnq-round-over.is-visible{animation:mnq-ro-pop .3s cubic-bezier(.2,1.3,.4,1)}
@keyframes mnq-ro-pop{from{transform:translate(-50%,-46%) scale(.9);opacity:0}to{transform:translate(-50%,-50%);opacity:1}}
@media (prefers-reduced-motion:reduce){.mnq-quiz>.mnq-round-over.is-visible{animation:none}}
/* cancel button in the round-over box, scoreboard name + clear */
.mnq-round-cancel-btn{appearance:none;border:none;background:transparent;color:var(--mnq-ink-soft,#5a5a5a);font-family:inherit;font-weight:600;font-size:.95rem;padding:.4rem 1rem;min-height:40px;border-radius:7px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.mnq-round-cancel-btn:hover{color:var(--mnq-burgundy-dark,#2f5578);background:rgb(47 85 120 / .08)}
.mnq-sb-name{margin:.05rem 0 .1rem;font-weight:700;font-size:1rem;color:var(--sb-ink)}
.mnq-sb-clear{margin:12px 0 0;text-align:center}
.mnq-sb-clear-btn{appearance:none;border:none;background:transparent;color:#b3552f;font-family:inherit;font-weight:600;font-size:.8rem;padding:.5rem .8rem;min-height:38px;border-radius:8px;cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.mnq-sb-clear-btn:hover{background:#fbeae4}
.mnq-sb-clear.is-warning{padding:14px;background:#fff4ef;border:2px solid #d9603a;border-radius:12px}
.mnq-sb-warn-title{margin:0 0 4px;font-weight:800;font-size:1rem;color:#b3400f}
.mnq-sb-warn-text{margin:0 0 12px;font-size:.9rem;line-height:1.4;color:#5a2a14;font-weight:600}
.mnq-sb-warn-row{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.mnq-sb-keep-btn,.mnq-sb-yes-btn{appearance:none;border:none;font-family:inherit;font-weight:700;font-size:.9rem;padding:.6rem 1rem;min-height:44px;border-radius:9px;cursor:pointer}
.mnq-sb-keep-btn{background:linear-gradient(180deg,#5b8fbd,#356491);color:#fff}
.mnq-sb-yes-btn{background:#fff;color:#b3400f;border:2px solid #d9603a}
.mnq-sb-yes-btn:hover:not(:disabled){background:#d9603a;color:#fff}
.mnq-sb-yes-btn:disabled{opacity:.6;cursor:default}
/* 3D card look + flip on next card */
.mnq-staff-wrap{position:relative;border:1px solid rgb(255 255 255 / .9);background:linear-gradient(145deg,#fff 0%,#fff 55%,#eee 100%);box-shadow:0 1px 0 #fff inset,0 -3px 0 rgb(34 34 34 / .07) inset,0 3px 0 #d9d9d9,0 6px 0 #c9c9c9,0 16px 26px rgb(34 34 34 / .28),0 4px 8px rgb(34 34 34 / .12)}
.mnq-staff-wrap::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(115deg,rgb(255 255 255 / .55) 0%,rgb(255 255 255 / 0) 35%,rgb(0 0 0 / 0) 70%,rgb(0 0 0 / .05) 100%)}
.mnq-staff-wrap.mnq-card-flip{animation:mnqCardFlip .5s cubic-bezier(.3,.7,.3,1) backwards}
@keyframes mnqCardFlip{0%{transform:perspective(900px) rotateX(-90deg);opacity:.2}60%{transform:perspective(900px) rotateX(12deg);opacity:1}100%{transform:perspective(900px) rotateX(0);opacity:1}}
@media (prefers-reduced-motion:reduce){.mnq-staff-wrap.mnq-card-flip{animation:none}}

/* Custom note-range picker */
.mnq-cr-overlay{--cr-blue:#4073a2;--cr-navy:#2f5578;--cr-gold:#ad9337;position:fixed;inset:0;z-index:2147483000;display:flex;align-items:flex-start;justify-content:center;padding:16px;overflow-y:auto;background:rgb(20 30 50 / .62);font-family:Inter,system-ui,Segoe UI,sans-serif}
.mnq-cr-card{position:relative;box-sizing:border-box;width:100%;max-width:640px;margin:auto;padding:16px;background:#f6f7f9;border:2px solid var(--cr-gold);border-radius:16px;box-shadow:0 18px 50px rgb(0 0 0 / .35);color:#222}
.mnq-cr-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.mnq-cr-title{margin:0;font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.3rem;color:var(--cr-navy)}
.mnq-cr-overlay .mnq-sb-close{flex:none;appearance:none;border:none;width:36px;height:36px;border-radius:50%;background:#e5e8ec;color:var(--cr-navy);font-size:1rem;cursor:pointer}
.mnq-cr-sub{margin:6px 0 10px;font-size:.85rem;color:#5a5a5a}
.mnq-cr-sec{margin:0 0 12px;padding:10px;background:#fff;border-radius:12px;box-shadow:0 1px 4px rgb(0 0 0 / .1)}
.mnq-cr-sech{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:4px 10px;color:var(--cr-navy)}
.mnq-cr-note{font-size:.75rem;color:#6a6a6a}
.mnq-cr-wrap{margin-top:6px}
.mnq-cr-piano{display:block;width:100%;height:auto;user-select:none;-webkit-user-select:none}
.mnq-cr-key{cursor:pointer;outline:none}
.mnq-cr-white{fill:#fffdf7;stroke:#8a8a8a;stroke-width:1}
.mnq-cr-key.is-in .mnq-cr-white{fill:#cfe1f3}
.mnq-cr-key.is-end .mnq-cr-white{fill:var(--cr-blue)}
.mnq-cr-key:hover .mnq-cr-white,.mnq-cr-key:focus-visible .mnq-cr-white{fill:#f3e6a8}
.mnq-cr-black{fill:#222;pointer-events:none}
.mnq-cr-black.is-in{fill:var(--cr-navy)}
.mnq-cr-lab{font-size:9px;fill:#555;pointer-events:none}
.mnq-cr-read{display:inline-block;margin:6px 10px 0 0;font-weight:700;font-size:.9rem;color:var(--cr-navy)}
.mnq-cr-reset{appearance:none;border:none;background:transparent;color:#5a5a5a;font-family:inherit;font-size:.8rem;text-decoration:underline;cursor:pointer;min-height:36px;padding:0 8px}
.mnq-cr-done{display:block;width:100%;appearance:none;border:none;font-family:inherit;font-weight:700;font-size:1rem;min-height:48px;border-radius:10px;cursor:pointer;background:linear-gradient(180deg,#5b8fbd,#356491);color:#fff}
.mnq-cr-done:disabled{opacity:.5;cursor:default}

.mnq-cr-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px}
@media (max-width:640px){.mnq-cr-piano{width:auto;min-width:640px}.mnq-cr-card{padding:12px}}

/* Burger menu: clef, difficulty and extra toggles tuck away; timer, mic, sound and scoreboard stay visible */
.mnq-burger-btn{display:flex;align-items:center;justify-content:center;gap:.5rem;width:100%}
.mnq-burger-group{width:100%}
.mnq-burger-ico{display:inline-flex;flex-direction:column;justify-content:space-between;width:18px;height:14px}
.mnq-burger-ico i{display:block;height:2px;border-radius:2px;background:currentColor;transition:transform .2s ease,opacity .2s ease}
.mnq-burger-btn.is-open .mnq-burger-ico i:nth-child(1){transform:translateY(6px) rotate(45deg)}
.mnq-burger-btn.is-open .mnq-burger-ico i:nth-child(2){opacity:0}
.mnq-burger-btn.is-open .mnq-burger-ico i:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
.mnq-burger-panel{display:flex;flex-direction:column;gap:.5rem;padding:.6rem;border:1px solid var(--mnq-gold);border-radius:10px;background:rgb(255 255 255 / .6)}
.mnq-burger-panel[hidden]{display:none}
.mnq-burger-panel .mnq-clef-group{width:100%}
.mnq-burger-opts{display:flex;flex-wrap:wrap;gap:.4rem}
.mnq-burger-opts .mnq-clef-btn{flex:1 1 auto}
.mnq-music-frame{position:fixed;left:-400px;top:0;width:200px;height:200px;border:0;opacity:0;pointer-events:none}

.mnq-music-now{order:5;flex:1 1 100%;display:flex;align-items:center;gap:.4rem;padding:.3rem .5rem;border:1px solid var(--mnq-gold);border-radius:8px;background:rgb(255 255 255 / .6)}
.mnq-music-now[hidden]{display:none}
.mnq-music-text{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.2}
.mnq-music-song{font-weight:700;font-size:.8rem;color:var(--mnq-burgundy-dark);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mnq-music-artist{font-size:.72rem;color:#666;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mnq-music-now .mnq-clef-btn{flex:none;min-height:36px;padding:.2rem .55rem;font-size:1.1rem;border:1px solid var(--mnq-gold);border-radius:6px}
.mnq-music-now .mnq-clef-btn+.mnq-clef-btn{border-left:1px solid var(--mnq-gold)}
.mnq-music-btn:disabled,.mnq-music-now .mnq-clef-btn:disabled{opacity:.4;cursor:not-allowed}
.mnq-music-frame{position:fixed;right:8px;bottom:8px;left:auto;top:auto;width:200px;height:200px;border:0;opacity:0;pointer-events:none;z-index:-1}
.mnq-music-frame.is-visible{opacity:1;pointer-events:auto;z-index:2147482000;border:2px solid #ad9337;border-radius:8px;box-shadow:0 6px 20px rgb(0 0 0 / .35)}
.mnq-music-frame.is-visible{opacity:0;pointer-events:none;z-index:-1;border:0;box-shadow:none}

.mnq-music-text{gap:.25rem}
.mnq-music-song{font-size:.7rem}
.mnq-music-artist{font-size:.62rem}

.mnq-music-now{flex-wrap:wrap;grid-column:1/-1}.mnq-music-vol{order:9;flex:1 1 100%;width:100%;height:20px;margin:0;accent-color:var(--mnq-gold);cursor:pointer}
.mnq-music-now .mnq-clef-btn{width:auto!important;flex:none!important;min-width:44px}.mnq-music-now .mnq-music-text{flex:1 1 0;min-width:0}
.mnq-music-now:not(.mnq-music-open){display:none!important}.mnq-music-info-btn{font-family:Georgia,serif;font-style:italic;font-weight:700}.mnq-music-info-btn.is-open{box-shadow:inset 0 0 0 2px var(--mnq-gold)}

/* Mobile layout (phones, max 640px): full-width, one screen with no scrolling, compact content-width buttons, flexible staff card, piano at the bottom */
@media(max-width:640px){
html:has(.mnq-quiz),body:has(.mnq-quiz){overflow:hidden!important;height:100%}
body:has(.mnq-quiz) .kz-seo-toggle{display:none!important}
.mnq-quiz{padding:8px!important;height:100vh;height:100dvh;overflow:hidden;display:flex!important;flex-direction:column;box-sizing:border-box}
.mnq-quiz .mnq-top{display:flex!important;flex-wrap:nowrap!important;align-items:center;justify-content:space-between;gap:6px;margin:0 0 2px!important}
.mnq-quiz .mnq-top-left{display:flex;gap:5px;flex:0 1 auto;width:auto!important}
.mnq-quiz .mnq-top-left button{padding:4px 10px!important}
.mnq-quiz .mnq-help-btn{width:28px!important;height:28px!important;min-width:0!important;padding:0!important}
.mnq-quiz .mnq-stats{flex:none}
.mnq-quiz .mnq-title{margin:0 0 6px!important}
.mnq-quiz .mnq-title-logo-img{height:30px!important;width:auto!important}
.mnq-quiz .mnq-settings-bar{margin:0 0 4px!important}
.mnq-quiz .mnq-settings{display:flex!important;flex-direction:row!important;flex-wrap:wrap;justify-content:center;align-items:center;gap:4px!important;margin:0 0 4px!important;padding-bottom:0!important}
.mnq-quiz .mnq-settings>.mnq-burger-group,.mnq-quiz .mnq-settings>.mnq-timer-dropdown{width:auto!important;flex:none}
.mnq-quiz .mnq-settings>.mnq-burger-panel{order:5;flex:1 1 100%}
.mnq-quiz .mnq-settings>.mnq-toggle-group{order:6;display:flex!important;flex-wrap:wrap;justify-content:center;gap:3px!important;width:100%!important}
.mnq-quiz .mnq-settings .mnq-clef-btn,.mnq-quiz .mnq-settings .mnq-timer-dropdown-btn{width:auto!important;flex:none!important;min-height:0!important;height:30px;padding:3px 7px!important;line-height:1.1;border-radius:9px;white-space:nowrap}
.mnq-quiz .mnq-settings .mnq-clef-btn-symbol{min-width:30px;padding:3px 5px!important}
.mnq-quiz .mnq-settings .mnq-buy-btn,.mnq-quiz .mnq-settings .mnq-full-mode-btn{display:inline-flex!important;align-items:center;justify-content:center;gap:4px}
.mnq-quiz .mnq-timer-dropdown-panel{grid-auto-flow:column;grid-template-columns:none!important;gap:4px;width:max-content!important;min-width:0!important;left:auto!important;right:0!important;transform:none!important;padding:6px!important}
.mnq-quiz .mnq-timer-option{width:auto!important;flex:none!important;min-height:0!important;height:28px;padding:3px 10px!important;font-size:.78rem!important;line-height:1.1;white-space:nowrap}
.mnq-quiz .mnq-burger-panel{padding:6px!important}
.mnq-quiz .mnq-burger-panel .mnq-clef-group{display:flex!important;flex-wrap:wrap;justify-content:center;gap:4px!important;width:100%!important;margin:0 0 4px!important}
.mnq-quiz .mnq-burger-panel .mnq-clef-group:not(.mnq-toggle-group){width:fit-content!important;max-width:100%;margin:0 auto 4px!important}
.mnq-quiz .mnq-burger-panel .mnq-clef-btn{width:auto!important;flex:none!important;min-height:0!important;height:28px;padding:3px 10px!important;line-height:1.1;white-space:nowrap}
.mnq-quiz .mnq-burger-panel .mnq-clef-btn-symbol{min-width:36px;padding:3px 8px!important}
.mnq-quiz .mnq-staff-outer{flex:0 0 auto;height:clamp(150px,30vh,260px);height:clamp(150px,30dvh,260px);display:flex;align-items:stretch;margin:6px 0!important}
.mnq-quiz .mnq-staff-outer .mnq-staff-wrap{display:flex;align-items:center;justify-content:center;width:100%;height:auto!important;min-height:0}
.mnq-quiz .mnq-staff-wrap svg{width:100%;height:auto;max-height:100%}
.mnq-quiz .mnq-feedback{min-height:0!important;margin:2px 0!important}
.mnq-quiz .mnq-piano-wrap{margin-top:auto!important}
.mnq-quiz .mnq-logo-bottom-wrap{display:none!important}
}

/* Music info (i) button: same width as the other icon buttons; stays readable when open */
.mnq-quiz .mnq-music-info-btn{min-width:44px}
.mnq-quiz .mnq-music-info-btn.is-open{color:#2f5578!important;background:#fff!important}

/* Desktop Settings (burger) panel: even, aligned buttons */
@media(min-width:641px){
.mnq-quiz .mnq-burger-panel{padding:8px!important}
.mnq-quiz .mnq-burger-panel .mnq-clef-group:not(.mnq-toggle-group){display:flex!important;width:100%!important;margin:0 0 6px!important}
.mnq-quiz .mnq-burger-panel .mnq-clef-group:not(.mnq-toggle-group) .mnq-clef-btn{flex:1 1 0!important;min-width:0!important;padding:8px 2px!important;font-size:.8rem!important;white-space:nowrap}
.mnq-quiz .mnq-burger-panel .mnq-toggle-group{display:grid!important;grid-template-columns:1fr 1fr;gap:6px!important;width:100%!important;margin:0!important}
.mnq-quiz .mnq-burger-panel .mnq-toggle-group .mnq-clef-btn{width:100%!important;min-width:0!important;padding:8px 4px!important;font-size:.8rem!important;white-space:nowrap}
.mnq-quiz .mnq-burger-panel .mnq-toggle-group>.mnq-clef-btn:last-child:nth-child(odd){grid-column:1/-1}
}
