:root{--piano-white-width: 4rem;--piano-white-height: 18rem;--piano-black-width: 2rem;--piano-black-height: 11.5rem;--piano-black-overlap: -1rem;--piano-label-size: .875rem}.piano-page-header{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:1rem}.piano-mode-switch{display:inline-flex;flex-shrink:0;gap:.25rem;padding:.25rem;border:1px solid rgb(209 213 219);border-radius:.75rem;background:#f9fafb}.piano-mode-button{min-height:2.5rem;padding:.5rem .9rem;border:0;border-radius:.55rem;background:transparent;color:#374151;font-size:.875rem;font-weight:700;cursor:pointer;transition:background-color .15s ease,color .15s ease,box-shadow .15s ease}.piano-mode-button:hover{background:#e5e7eb}.piano-mode-button[aria-pressed=true]{background:#059669;color:#fff;box-shadow:0 1px 3px #0000001f}.piano-mode-button:focus-visible{outline:2px solid rgb(16 185 129);outline-offset:2px}.piano-learning,.piano-learning-workflow-panel{width:100%;border:1px solid rgb(209 213 219);border-radius:.9rem;background:#f9fafb}.piano-learning{margin-top:.55rem;margin-bottom:.3rem;padding:.5rem}.piano-learning-workflow-panel{margin-top:.75rem;margin-bottom:.75rem;padding:.9rem}.piano-learning[hidden],.piano-learning-workflow-panel[hidden]{display:none}.piano-learning>.piano-note-track{margin-top:0}.piano-learning__top{display:flex;align-items:flex-start;justify-content:space-between;gap:1rem;margin-bottom:.75rem}.piano-learning__intro{margin-top:.1rem;color:#6b7280;font-size:.78rem;line-height:1.35}.piano-best-score{display:inline-flex;min-height:2rem;flex-shrink:0;align-items:center;gap:.35rem;padding:.3rem .65rem;border:1px solid rgb(209 213 219);border-radius:9999px;background:#fff;color:#6b7280;font-size:.7rem}.piano-best-score strong{color:#1f2937;font-size:.75rem;font-weight:800}.piano-session-bar{display:grid;min-height:3.55rem;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.75rem;padding:.45rem 0;border-bottom:1px solid rgb(229 231 235)}.piano-session-status{min-width:0}.piano-lesson-status,.piano-current-note{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.piano-lesson-status{min-height:1.2rem;color:#4b5563;font-size:.76rem;font-weight:700;line-height:1.3}.piano-current-note{min-height:1rem;margin-top:.15rem;color:#6b7280;font-size:.68rem;font-weight:600;line-height:1.3}.piano-playback-actions{display:flex;min-width:11rem;flex:0 0 auto;align-items:center;justify-content:flex-end;gap:.45rem}.piano-playback-action{display:inline-flex;min-height:2.6rem;align-items:center;justify-content:center;gap:.4rem;padding:.5rem .9rem;border:1px solid transparent;border-radius:.55rem;font-size:.78rem;font-weight:800;cursor:pointer;transition:border-color .15s ease,background-color .15s ease,color .15s ease,transform .1s ease}.piano-playback-action[data-visible=false]{visibility:hidden;pointer-events:none}.piano-playback-action:hover:not(:disabled){transform:translateY(-1px)}.piano-playback-action:disabled{cursor:default}.piano-playback-action:focus-visible{outline:2px solid rgb(16 185 129);outline-offset:2px}.piano-pause-action{border-color:#f59e0b;background:#fffbeb;color:#92400e}.piano-pause-action:hover:not(:disabled){border-color:#d97706;background:#fef3c7;color:#78350f}.piano-pause-action[aria-pressed=true]{border-color:#059669;background:#d1fae5;color:#065f46}.piano-stop-action{border-color:#ef4444;background:#fef2f2;color:#b91c1c}.piano-stop-action:hover:not(:disabled){border-color:#dc2626;background:#fee2e2;color:#991b1b}.piano-score{display:grid;min-height:2.5rem;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:.3rem;overflow:hidden;border:1px solid rgb(209 213 219);border-radius:.6rem;background:#fff}.piano-score[data-visible=false]{display:none}.piano-score[data-visible=true]+.piano-learning__top{margin-top:.65rem}.piano-score>div{display:flex;min-width:0;align-items:baseline;justify-content:center;gap:.3rem;padding:.45rem;border-right:1px solid rgb(229 231 235)}.piano-score>div:last-child{border-right:0}.piano-score span{color:#6b7280;font-size:.62rem;font-weight:700;text-transform:uppercase}.piano-score strong{color:#1f2937;font-size:.85rem;font-weight:800;font-variant-numeric:tabular-nums}.piano-learning-workflow,.piano-song-catalog{margin-top:.7rem}.piano-learning-section-title{color:#374151;font-size:.72rem;font-weight:800;letter-spacing:.035em;text-transform:uppercase}.piano-stage-bar{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.45rem;margin-top:.35rem}.piano-stage-button{display:flex;min-width:0;min-height:3.4rem;align-items:center;gap:.55rem;padding:.5rem .6rem;border:1px solid rgb(209 213 219);border-radius:.65rem;background:#fff;color:#1f2937;text-align:left;cursor:pointer;transition:border-color .15s ease,background-color .15s ease,color .15s ease}.piano-stage-button:hover:not(:disabled){border-color:#10b981;background:#ecfdf5}.piano-stage-button[aria-pressed=true]{border-color:#059669;background:#d1fae5;color:#065f46}.piano-stage-button:disabled{cursor:default;opacity:.45}.piano-stage-button[aria-pressed=true]:disabled{opacity:1}.piano-stage-button:focus-visible{outline:2px solid rgb(16 185 129);outline-offset:2px}.piano-stage-button__number{display:flex;width:1.55rem;height:1.55rem;flex:0 0 1.55rem;align-items:center;justify-content:center;border-radius:9999px;background:#e5e7eb;color:#374151;font-size:.68rem;font-weight:800}.piano-stage-button[aria-pressed=true] .piano-stage-button__number{background:#059669;color:#fff}.piano-stage-button__text{display:flex;min-width:0;flex-direction:column;line-height:1.15}.piano-stage-button__text strong{font-size:.8rem;font-weight:800}.piano-stage-button__text small{margin-top:.1rem;overflow:hidden;color:#6b7280;font-size:.63rem;text-overflow:ellipsis;white-space:nowrap}.piano-stage-button[aria-pressed=true] .piano-stage-button__text small{color:#047857}.piano-learning__controls{display:grid;grid-template-columns:minmax(0,1fr) minmax(11rem,15rem);gap:.65rem;align-items:start;margin-top:.35rem}.piano-field{min-width:0}.piano-field label{display:block;margin-bottom:.25rem;color:#374151;font-size:.75rem;font-weight:700}.piano-field select{display:block;width:100%;min-height:2.5rem;padding:.45rem 2.25rem .45rem .7rem;border:1px solid rgb(209 213 219);border-radius:.55rem;background:#fff;color:#111827;font-size:.82rem;font-weight:600}.piano-field select:focus{border-color:#10b981;outline:none;box-shadow:0 0 0 2px #10b98133}.piano-field select:disabled{cursor:not-allowed;opacity:.55}.piano-field__help{display:block;margin-top:.2rem;color:#6b7280;font-size:.65rem}.piano-note-track{width:100%;margin-top:.55rem;padding:.55rem;overflow:hidden;border:1px solid rgb(209 213 219);border-radius:.7rem;background:#fff}.piano-note-track__header{display:flex;min-height:2rem;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.25rem}.piano-note-track__meta{display:flex;min-width:0;align-items:center;gap:.6rem}.piano-note-track__title{overflow:hidden;color:#334155;font-size:.7rem;font-weight:800;letter-spacing:.04em;text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.piano-note-track__progress{flex-shrink:0;color:#64748b;font-size:.68rem;font-weight:600;font-variant-numeric:tabular-nums}.piano-notation-view{display:flex;flex-shrink:0;align-items:center;margin:0}.piano-notation-view__options{display:inline-flex;padding:.12rem;border:1px solid rgb(209 213 219);border-radius:.5rem;background:#f9fafb}.piano-notation-view__options label{display:block;padding:.28rem .52rem;border-radius:.35rem;color:#4b5563;font-size:.64rem;font-weight:700;cursor:pointer}.piano-notation-view__options input:checked+label{background:#059669;color:#fff}.piano-notation-view__options input:focus-visible+label{outline:2px solid rgb(16 185 129);outline-offset:1px}.piano-sheet-music{box-sizing:border-box;width:100%;min-height:9.5rem;overflow:hidden;border-radius:.45rem;background:#fff}.piano-sheet-music svg{display:block;width:100%;height:auto}.piano-sheet-music__message{display:flex;min-height:9.5rem;align-items:center;justify-content:center;margin:0;padding:1rem;color:#64748b;font-size:.8rem;font-weight:600;text-align:center}.piano-note-track[data-notation-view=letters] .piano-sheet-music,.piano-note-track[data-notation-view=sheet] .piano-note-track__notes,.piano-note-track[data-notation-view=both] .piano-note-track__notes{display:none}.piano-note-track__notes{display:grid;min-height:4.8rem;grid-template-columns:repeat(7,minmax(0,1fr));align-items:center;gap:.35rem}.piano-instrument{width:100%}.piano-instrument-toolbar{position:relative;display:flex;min-height:2.25rem;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.35rem}.piano-instrument-help,.piano-computer-keys,.piano-audio-status{margin:0;color:#6b7280;font-size:.7rem}.piano-computer-keys{position:relative;align-items:center;gap:.7rem}.piano-keyboard-guide{position:relative}.piano-keyboard-guide summary{list-style:none;color:#059669;font-weight:800;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.piano-keyboard-guide summary::-webkit-details-marker{display:none}.piano-keyboard-guide summary:hover{color:#047857}.piano-keyboard-guide summary:focus-visible{outline:2px solid rgb(16 185 129);outline-offset:2px;border-radius:.25rem}.piano-keyboard-guide__panel{position:absolute;top:calc(100% + .5rem);right:0;z-index:20;width:22rem;padding:.75rem;border:1px solid rgb(209 213 219);border-radius:.7rem;background:#fff;box-shadow:0 12px 28px #0f172a29}.piano-keyboard-guide__group+.piano-keyboard-guide__group{margin-top:.7rem}.piano-keyboard-guide__group>p{margin:0 0 .4rem;color:#4b5563;font-size:.64rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.piano-keyboard-guide__grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.3rem}.piano-keyboard-guide__grid>div{min-width:0;text-align:center}.piano-keyboard-guide kbd{display:block;margin-bottom:.15rem;padding:.25rem .2rem;border:1px solid rgb(209 213 219);border-bottom-width:2px;border-radius:.32rem;background:#f9fafb;color:#111827;font-family:inherit;font-size:.66rem;font-weight:800;line-height:1}.piano-keyboard-guide kbd+span{display:block;color:#6b7280;font-size:.58rem;font-weight:600}.piano-container{display:flex;width:100%;justify-content:center;overflow:hidden}.piano-keys-list{display:flex;justify-content:center;list-style:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.piano-keys{position:relative;flex:0 0 var(--piano-white-width);width:var(--piano-white-width);min-width:var(--piano-white-width);height:var(--piano-white-height);padding:0;cursor:pointer;border:1px solid rgb(17 24 39);border-radius:0 0 7px 7px;-webkit-appearance:none;-moz-appearance:none;appearance:none;touch-action:none;transition:background-color 80ms ease,transform 80ms ease}.white-key{background:#fff}.black-key{z-index:2;flex:0 0 var(--piano-black-width);width:var(--piano-black-width);min-width:var(--piano-black-width);height:var(--piano-black-height);margin-right:var(--piano-black-overlap);margin-left:var(--piano-black-overlap);border-color:#000;border-radius:0 0 5px 5px;background:#030712}.piano-keys:focus-visible{outline:none;box-shadow:inset 0 0 0 3px #10b981}.black-key:focus-visible{box-shadow:inset 0 0 0 2px #34d399}.white-key.is-pressed{background:#dbeafe;transform:translateY(2px)}.black-key.is-pressed{background:#1e40af;transform:translateY(2px)}.white-key.is-preview{background:#e0f2fe}.black-key.is-preview{background:#0369a1}.white-key.highlight{background:#fef08a}.black-key.highlight{background:#ca8a04}.white-key.correct{background:#bbf7d0}.black-key.correct{background:#16a34a}.piano-keys-list .piano-keys>span{display:none}.piano-keys:after{position:absolute;left:50%;bottom:.65rem;z-index:1;content:attr(data-note);transform:translate(-50%);color:#111827;font-size:var(--piano-label-size);font-weight:700;line-height:1;pointer-events:none;opacity:0;transition:opacity .15s ease}.black-key:after{bottom:.45rem;color:#fff;font-size:.55rem;font-weight:600}.piano-keys[data-note=B4]:after{content:"H4"}.piano-keys[data-note=B5]:after{content:"H5"}body:has(#piano-labels-c:checked) .piano-keys[data-note=C4]:after,body:has(#piano-labels-c:checked) .piano-keys[data-note=C5]:after{opacity:1}body:has(#piano-labels-all:checked) .piano-keys:after{opacity:1}@media(prefers-reduced-motion:reduce){.piano-keys:after{transition:none}}.piano-key-controls{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:.55rem;padding:.5rem .65rem;border:1px solid rgb(209 213 219);border-radius:.65rem;background:#f9fafb}.piano-key-label-control{display:flex;align-items:center;gap:.5rem;margin:0}.piano-key-controls__label{color:#374151;font-size:.7rem;font-weight:700}.piano-key-label-options{display:inline-flex;padding:.12rem;border:1px solid rgb(209 213 219);border-radius:.45rem;background:#fff}.piano-key-label-options label{display:block;padding:.28rem .5rem;border-radius:.32rem;color:#4b5563;font-size:.64rem;font-weight:700;cursor:pointer}.piano-key-label-options input:checked+label{background:#059669;color:#fff}.piano-key-label-options input:focus-visible+label{outline:2px solid rgb(16 185 129);outline-offset:1px}.piano-key-light-control{display:inline-flex;flex:0 0 auto;align-items:center;gap:.4rem;color:#374151;font-size:.68rem;font-weight:700;cursor:pointer}.piano-key-light-control input{width:1rem;height:1rem;border-radius:.25rem;accent-color:rgb(5 150 105)}.piano-key-light-control input:focus-visible{outline:2px solid rgb(16 185 129);outline-offset:2px}.piano-audio-status{min-width:6rem;color:#047857;font-weight:700;text-align:right}.piano-mobile-octaves{gap:.35rem}.piano-learning-tip{display:none;margin:0;color:#6b7280;font-size:.65rem;text-align:right}#piano-app[data-piano-mode=learn] .piano-learning-tip{display:flex;align-items:center;gap:.35rem}.piano-octave-button{min-height:2.1rem;padding:.3rem .65rem;border:1px solid rgb(209 213 219);border-radius:.45rem;background:#fff;color:#374151;font-size:.68rem;font-weight:700;cursor:pointer}.piano-octave-button[aria-pressed=true]{border-color:#047857;background:#059669;color:#fff}.piano-octave-button:focus-visible{outline:2px solid rgb(16 185 129);outline-offset:2px}@media(min-width:768px)and (max-width:1024px){:root{--piano-white-width: 3rem;--piano-white-height: 15rem;--piano-black-width: 1.5rem;--piano-black-height: 9.5rem;--piano-black-overlap: -.75rem}.piano-stage-button{gap:.4rem;padding-right:.45rem;padding-left:.45rem}}@media(max-width:767px){:root{--piano-white-height: clamp(12rem, 58vw, 15rem);--piano-black-width: clamp(1.75rem, 8vw, 2.15rem);--piano-black-height: clamp(7.5rem, 38vw, 10rem);--piano-label-size: .8rem}.piano-page-header{align-items:stretch;flex-direction:column;margin-bottom:.75rem}.piano-mode-switch{width:100%}.piano-mode-button{flex:1 1 0}.piano-learning{padding:.4rem}.piano-learning-workflow-panel{padding:.7rem}.piano-learning__top{align-items:center}.piano-learning__intro{display:none}.piano-learning__controls{grid-template-columns:minmax(0,1fr);gap:.5rem}.piano-field--tempo{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:0 .55rem}.piano-field--tempo label{margin:0}.piano-field--tempo .piano-field__help{display:none}.piano-stage-bar{grid-template-columns:repeat(2,minmax(0,1fr))}.piano-stage-button{min-height:3.15rem}.piano-session-bar{grid-template-columns:minmax(0,1fr);gap:.35rem}.piano-playback-actions{width:100%;min-width:0}.piano-playback-action{flex:1 1 0}.piano-score{grid-template-columns:repeat(2,minmax(0,1fr))}.piano-score>div:nth-child(2){border-right:0}.piano-score>div:nth-child(-n+2){border-bottom:1px solid rgb(229 231 235)}.piano-note-track__header{align-items:flex-start;flex-direction:column;gap:.35rem}.piano-note-track__meta{width:100%;justify-content:space-between}.piano-notation-view,.piano-notation-view__options{width:100%}.piano-notation-view__options>div{flex:1 1 0}.piano-notation-view__options label{text-align:center}.piano-sheet-music,.piano-sheet-music__message{min-height:8.25rem}.piano-note-track__notes{grid-template-columns:repeat(5,minmax(0,1fr));gap:.28rem}.piano-instrument-toolbar{display:grid;grid-template-columns:minmax(0,1fr);justify-content:center}.piano-instrument-help{display:none}.piano-mobile-octaves{display:flex;width:100%;justify-content:center}.piano-audio-status{min-height:1rem;text-align:center}.piano-keys-list{position:relative;display:flex;width:min(100%,28rem);height:var(--piano-white-height);justify-content:stretch;touch-action:none}.piano-keys-list[data-active-octave="4"] .piano-keys[data-octave="5"],.piano-keys-list[data-active-octave="5"] .piano-keys[data-octave="4"]{display:none}.piano-keys-list .white-key{position:relative;flex:1 1 0;width:auto;min-width:0;height:var(--piano-white-height);margin:0}.piano-keys-list .black-key{position:absolute;top:0;z-index:2;flex:none;width:var(--piano-black-width);min-width:var(--piano-black-width);height:var(--piano-black-height);margin:0;transform:translate(-50%)}.piano-keys-list .black-key.is-pressed{transform:translate(-50%) translateY(2px)}.piano-keys-list .black-key[data-note="C#4"],.piano-keys-list .black-key[data-note="C#5"]{left:14.285714%}.piano-keys-list .black-key[data-note="D#4"],.piano-keys-list .black-key[data-note="D#5"]{left:28.571429%}.piano-keys-list .black-key[data-note="F#4"],.piano-keys-list .black-key[data-note="F#5"]{left:57.142857%}.piano-keys-list .black-key[data-note="G#4"],.piano-keys-list .black-key[data-note="G#5"]{left:71.428571%}.piano-keys-list .black-key[data-note="A#4"],.piano-keys-list .black-key[data-note="A#5"]{left:85.714286%}.piano-key-controls{align-items:stretch;flex-direction:column;gap:.45rem}.piano-key-label-control{justify-content:space-between}.piano-key-light-control{justify-content:center}.piano-key-label-options label,.piano-notation-view__options label{display:flex;align-items:center;justify-content:center}.piano-key-label-options label,.piano-notation-view__options label,.piano-key-light-control,.piano-octave-button{min-height:2.75rem}.piano-learning-tip{justify-content:center;text-align:center}}@media(max-width:420px){.piano-stage-button{gap:.35rem;padding:.42rem}.piano-stage-button__number{width:1.4rem;height:1.4rem;flex-basis:1.4rem}.piano-stage-button__text small,.piano-key-controls__label{display:none}.piano-key-label-options{width:100%}.piano-key-label-options>div{flex:1 1 0}.piano-key-label-options label{text-align:center}}@media(prefers-color-scheme:dark){.piano-mode-switch,.piano-learning,.piano-learning-workflow-panel,.piano-key-controls{border-color:#374151;background:#1f2937}.piano-mode-button{color:#e5e7eb}.piano-mode-button:hover{background:#374151}.piano-mode-button[aria-pressed=true]{background:#059669;color:#fff}.piano-learning__intro,.piano-field__help,.piano-stage-button__text small,.piano-instrument-help,.piano-computer-keys,.piano-current-note{color:#9ca3af}.piano-best-score,.piano-field select,.piano-stage-button,.piano-stop-action,.piano-keyboard-guide__panel,.piano-key-label-options,.piano-octave-button{border-color:#4b5563;background:#111827;color:#e5e7eb}.piano-best-score strong,.piano-field label,.piano-key-controls__label,.piano-key-light-control,.piano-learning-section-title{color:#f3f4f6}.piano-stage-button:hover:not(:disabled){border-color:#34d399;background:#064e3b}.piano-stage-button[aria-pressed=true]{border-color:#34d399;background:#064e3b;color:#d1fae5}.piano-stage-button__number{background:#374151;color:#e5e7eb}.piano-stage-button[aria-pressed=true] .piano-stage-button__number{background:#10b981;color:#fff}.piano-stage-button[aria-pressed=true] .piano-stage-button__text small{color:#a7f3d0}.piano-session-bar{border-bottom-color:#374151}.piano-lesson-status{color:#d1d5db}.piano-audio-status{color:#6ee7b7}.piano-stop-action:hover{border-color:#6b7280;background:#1f2937;color:#fff}.piano-score{border-color:#4b5563;background:#111827}.piano-score>div{border-color:#374151}.piano-score span{color:#9ca3af}.piano-score strong{color:#f3f4f6}.piano-note-track{border-color:#374151;background:#111827}.piano-note-track__title{color:#e5e7eb}.piano-note-track__progress{color:#9ca3af}.piano-notation-view__options{border-color:#4b5563;background:#1f2937}.piano-notation-view__options label{color:#d1d5db}.piano-notation-view__options input:checked+label{background:#059669;color:#fff}.piano-keyboard-guide summary{color:#34d399}.piano-keyboard-guide__group>p{color:#d1d5db}.piano-keyboard-guide kbd{border-color:#4b5563;background:#1f2937;color:#f3f4f6}.piano-keyboard-guide kbd+span{color:#9ca3af}.piano-key-label-options label{color:#d1d5db}.piano-key-label-options input:checked+label{background:#059669;color:#fff}.piano-octave-button[aria-pressed=true]{border-color:#34d399;background:#059669;color:#fff}.piano-learning-tip{color:#9ca3af}}@media(prefers-reduced-motion:reduce){.piano-mode-button,.piano-stage-button,.piano-keys,.piano-keys:after{transition:none}}.piano-keys:after{content:attr(data-display-note)}.piano-sheet-music{width:100%;height:9.375rem;min-height:9.375rem;margin-bottom:0;overflow:hidden}.piano-sheet-music svg{display:block;width:100%;height:100%}.piano-sheet-music__message{height:9.375rem;min-height:9.375rem}.piano-note-track[data-notation-view=sheet] .piano-note-track__notes,.piano-note-track[data-notation-view=both] .piano-note-track__notes,.piano-note-track[data-notation-view=letters] .piano-sheet-music{display:none}.piano-note-track[data-notation-view=letters] .piano-note-track__notes{display:grid}.piano-note-track__notes{width:100%;height:9.375rem;min-height:9.375rem;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:0;overflow:hidden;border:1px solid rgb(71 85 105);border-radius:.6rem;background:#0f172a}.piano-letter-measure{position:relative;display:flex;min-width:0;height:100%;min-height:0;flex-direction:column;justify-content:center;padding:1.5rem 1rem 1rem;border-left:1px solid rgb(100 116 139)}.piano-letter-measure:first-child{border-left:0}.piano-letter-measure__number{position:absolute;top:.5rem;left:.65rem;font-size:.65rem;font-weight:600;color:#94a3b8}.piano-letter-measure__notes{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.45rem}.piano-letter-note{display:inline-flex;min-width:2.25rem;min-height:2.25rem;align-items:center;justify-content:center;border-radius:.4rem;color:#1e293b;font-size:1.15rem;font-weight:800;line-height:1}.piano-letter-note.is-current{background:#fef08a;color:#713f12;box-shadow:inset 0 0 0 1px #eab308}.piano-note-track[data-mode=listen] .piano-letter-note.is-current{background:#dbeafe;color:#1e40af;box-shadow:inset 0 0 0 1px #3b82f6}.piano-note-track[data-mode=challenge] .piano-letter-note.is-current{background:#ede9fe;color:#5b21b6;box-shadow:inset 0 0 0 1px #7c3aed}.piano-letter-measure__rest{color:#64748b;font-size:.7rem;font-style:italic}.piano-sheet-note.is-current,.piano-sheet-note.is-current path,.piano-sheet-annotation.is-current,.piano-sheet-annotation.is-current text{fill:#b45309;stroke:#b45309}.piano-note-track[data-mode=listen] .piano-sheet-note.is-current,.piano-note-track[data-mode=listen] .piano-sheet-note.is-current path,.piano-note-track[data-mode=listen] .piano-sheet-annotation.is-current,.piano-note-track[data-mode=listen] .piano-sheet-annotation.is-current text{fill:#2563eb;stroke:#2563eb}.piano-note-track[data-mode=challenge] .piano-sheet-note.is-current,.piano-note-track[data-mode=challenge] .piano-sheet-note.is-current path,.piano-note-track[data-mode=challenge] .piano-sheet-annotation.is-current,.piano-note-track[data-mode=challenge] .piano-sheet-annotation.is-current text{fill:#6d28d9;stroke:#6d28d9}@media(max-width:767px){.piano-note-track{margin-bottom:.4rem;padding:.4rem}.piano-note-track__header{min-height:1.8rem;margin-bottom:.2rem}.piano-sheet-music,.piano-sheet-music__message,.piano-note-track__notes{height:8.75rem;min-height:8.75rem}.piano-instrument-toolbar{min-height:2rem;margin-bottom:.25rem}.piano-key-controls{margin-top:.35rem}}@media(max-width:900px)and (max-height:520px)and (orientation:landscape){.piano-note-track{margin-bottom:.25rem;padding:.3rem .4rem}.piano-note-track__header{min-height:1.6rem;margin-bottom:.1rem}.piano-sheet-music,.piano-sheet-music__message,.piano-note-track__notes{height:7.75rem;min-height:7.75rem}.piano-instrument-toolbar{min-height:1.75rem;margin-bottom:.15rem}.piano-key-controls{margin-top:.25rem;padding-top:.3rem;padding-bottom:.3rem}}@media(prefers-color-scheme:dark){.piano-sheet-music{border:1px solid rgb(100 116 139);background:#e2e8f0}.piano-note-track__notes{border-color:#475569;background:#0f172a}.piano-letter-measure{border-left-color:#94a3b8}.piano-letter-measure:last-child{border-right-color:#94a3b8}.piano-letter-measure__number,.piano-letter-measure__rest{color:#94a3b8}.piano-letter-note{color:#e2e8f0}.piano-letter-note.is-current{background:#713f128c;color:#fef08a}.piano-note-track[data-mode=listen] .piano-letter-note.is-current{background:#1e40af73;color:#bfdbfe}.piano-note-track[data-mode=challenge] .piano-letter-note.is-current{background:#5b21b673;color:#ddd6fe}}