.kn-page{overflow-wrap:anywhere}.kn-page main{padding-bottom:3rem}.kn-tool{min-width:0}.kn-toolbar,.kn-actions{flex-wrap:wrap;align-items:end;gap:1rem;display:flex}.kn-actions{align-items:center;gap:.5rem;margin-block:1rem}.kn-field{font-size:var(--pr-type-ui-size);flex-direction:column;gap:.5rem;min-width:0;max-width:100%;font-weight:600;display:flex}.kn-field input,.kn-field select{border:1px solid var(--input);border-radius:var(--pr-radius-control);background:var(--background);min-height:2.75rem;color:var(--foreground);font:inherit;width:100%;max-width:100%;padding:.6rem .75rem}.kn-query{flex:1;align-items:end;gap:.5rem;min-width:0;display:flex}.kn-query .kn-field{flex:1}.kn-range,.kn-hint{color:var(--muted-foreground);margin-block:1rem;font-size:.875rem}.kn-result{margin-block:1.5rem}.kn-result h2{font-size:2rem}.kn-key-scroll,.kn-staff-scroll{overscroll-behavior-x:contain;background:var(--background);border-radius:var(--pr-radius-scroll);max-width:100%;padding:6px;overflow:auto}.kn-keyboard{height:var(--pr-piano-white-height);margin-bottom:.25rem;position:relative}.kn-key{border:1px solid var(--piano-key-border);border-radius:0 0 var(--pr-radius-key) var(--pr-radius-key);height:100%;font-size:var(--pr-type-key-label-size);color:var(--foreground);padding:0;line-height:1.4;position:absolute;top:0}.kn-white{background:var(--piano-key-white);z-index:1}.kn-black{background:var(--piano-key-black);color:var(--background);height:var(--pr-piano-black-height);z-index:2}.kn-key-text{text-align:center;position:absolute;bottom:2rem;left:0;right:0}.kn-key-text span{display:block}.kn-black .kn-key-text{top:.625rem;bottom:auto}.kn-selected-mark{text-align:center;position:absolute;bottom:.5rem;left:0;right:0}.kn-middle{font-size:10px;font-weight:700;position:absolute;bottom:.15rem;right:.2rem}.kn-selected.kn-white{background:var(--piano-note-selected);color:var(--primary)}.kn-key.kn-selected{box-shadow:inset 0 0 0 2px var(--primary)}.kn-key.kn-sounding{background:var(--piano-note-sounding);color:var(--piano-note-sounding-mark)}.kn-key.kn-sounding:after{content:"";border-bottom:3px solid;position:absolute;bottom:0;left:15%;right:15%}.kn-key:focus-visible{z-index:4;outline:var(--pr-focus-width) solid var(--ring);outline-offset:-4px}.kn-key:hover:not(:disabled){box-shadow:inset 0 0 0 2px var(--primary)}.kn-key:disabled{cursor:default}.kn-playback{margin-block:1rem}.kn-status{min-height:1.5em;color:var(--primary);font-size:.875rem}.kn-error{color:var(--error)}.kn-checkbox{align-items:center;gap:.75rem;min-height:2.75rem;display:flex}.kn-checkbox input{width:1.25rem;height:1.25rem;accent-color:var(--primary)}.kn-segment{border-top:1px solid var(--border);padding-block:1.5rem;scroll-margin-top:1rem}.kn-segment h2{margin-bottom:.75rem;font-size:1.25rem}.kn-label-steps{max-width:72ch;margin-block:2rem;padding-left:1.5rem}.kn-label-steps li{margin-block:.75rem}.kn-staff-block{margin-block:1rem}.kn-staff-block h3{margin-bottom:.5rem;font-size:1rem}.kn-staff{max-width:none;color:var(--foreground);display:block}.kn-staff-note[role=button]{cursor:pointer}.kn-staff-note.kn-active{color:var(--primary)}.kn-staff-note:hover .kn-note-hit{stroke:var(--input)}.kn-staff-note:focus-visible{outline:none}.kn-staff-note:focus-visible .kn-note-hit{stroke:var(--ring);stroke-width:2px}.kn-clef{font-family:Segoe UI Symbol,Apple Symbols,serif}.kn-print-only{display:none}@media (max-width:47.999rem){.kn-toolbar{align-items:stretch}.kn-toolbar>.kn-field,.kn-query{flex-basis:100%;width:100%}.kn-page .am-button{white-space:normal}.kn-page .am-site-nav{display:none}.kn-page .am-content-section{grid-template-columns:1fr}.kn-page .am-content-body{max-width:100%}}@media print{.kn-page .kn-screen,.kn-page .am-screen{display:none!important}.kn-page .kn-print-only{display:block}.kn-page .kn-print-sheet{break-after:page;break-inside:avoid;color:#000;padding:0}.kn-page .kn-print-sheet:last-child{break-after:auto}.kn-page .kn-print-title{font-size:20pt;font-weight:700}.kn-page .kn-print-sheet h2{font-size:12pt}.kn-page .kn-print-sheet p{margin:8pt 0;font-size:10pt}.kn-page .kn-key-scroll,.kn-page .kn-staff-scroll{padding:0;overflow:visible}.kn-page .kn-keyboard{max-width:100%;height:90pt;margin:12pt 0}.kn-page .kn-staff{max-width:100%;height:auto}.kn-page .kn-key{-webkit-print-color-adjust:exact;print-color-adjust:exact}.kn-page .kn-key-text{font-size:9pt}.kn-page .kn-black{color:#fff!important;background:#111!important}.kn-page .kn-selected{color:#000;box-shadow:inset 0 0 0 2px #000}.kn-page .kn-staff-note.kn-active{color:#000}.kn-page main{width:100%;max-width:none;padding:0}.kn-page .kn-print-sources{font-size:8pt}}.kn-staff-note text:last-child{font-size:.875rem}@media print{.kn-staff-note text:last-child{font-size:14px}}.kn-staff-frame{background:var(--background);min-width:0;display:flex}.kn-clef-anchor{flex:none;max-width:none;margin-top:6px}.kn-staff-frame>.kn-staff-scroll{flex:1;min-width:0}.kn-inline-clef{display:none}@media print{.kn-staff-frame{display:block}.kn-clef-anchor{display:none}.kn-inline-clef{display:block}}.kn-key.kn-marked:not(.kn-selected):not(.kn-sounding){background:var(--piano-note-selected)}.kn-key.kn-marked.kn-black:not(.kn-selected):not(.kn-sounding){background:var(--piano-key-black);box-shadow:inset 0 0 0 2px var(--piano-note-mark)}