:root{--paper:#eef1f4;--sheet:#fff;--ink:#15181d;--ink-soft:#4d5560;--rule:#c9d0d8;--felt:#9e1b32;--felt-deep:#7c1427;--error-bg:#fbe9ec;--serif:"Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", serif;--sans:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-variant-numeric:tabular-nums;margin:0;font-size:1.0625rem;line-height:1.5}main{padding-block:32px 48px}h1,h2{font-family:var(--serif);text-wrap:balance;margin:0;font-weight:700;line-height:1.12}h1{max-width:18em;padding-inline:16px;font-size:clamp(2rem,1.5rem + 2.4vw,3.25rem)}h2{font-size:1.5rem}h3{text-wrap:balance;margin:0 0 4px;font-size:1.0625rem}.staff-motif{margin-block:24px;display:block}.motif-solid,.motif-landmark{stroke:var(--ink)}.motif-solid{stroke-width:1.25px}.motif-landmark{stroke:var(--felt);stroke-width:3px;stroke-dasharray:9 4}.motif-white rect{fill:var(--sheet);stroke:var(--ink)}.motif-black rect{fill:var(--ink)}.lede{max-width:62ch;margin:0;padding-inline:16px}h1,.lede,.piece-composer,.piece-level,.piece-description,.piece-head .hint{box-sizing:content-box}.upload{padding:24px 16px 0}.visually-hidden{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.button{max-width:100%;min-height:48px;font:inherit;cursor:pointer;white-space:nowrap;touch-action:manipulation;border:0;border-radius:3px;justify-content:center;align-items:center;padding:0 24px;font-weight:600;line-height:1;display:inline-flex}.button-text{text-overflow:ellipsis;line-height:1.3;overflow:hidden}.button-primary{background:var(--felt);color:#fff}.button-primary:hover{background:var(--felt-deep)}.button-quiet{color:var(--ink);box-shadow:inset 0 0 0 1.5px var(--ink);background:0 0}.button-quiet:hover{background:var(--sheet)}.button[disabled]{opacity:.6;cursor:progress}.button:focus-visible,#file:focus-visible+.button,.score:focus-visible{outline:3px solid var(--ink);outline-offset:2px}.hint,.summary,.status{color:var(--ink-soft)}.hint{max-width:62ch;margin:12px 0 0}.status{margin:12px 0 0}.error{background:var(--error-bg);border-left:4px solid var(--felt);overflow-wrap:anywhere;max-width:62ch;margin:16px 0 0;padding:12px 16px}.result{margin-top:32px}.result-bar{background:var(--paper);z-index:1;border-block:1px solid var(--rule);flex-direction:column;gap:12px;padding:12px 16px;display:flex;position:sticky;top:0}.result-heading{min-width:0}.result-heading h2,.summary{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.summary{margin:0;font-size:1rem}.score-controls{flex-wrap:wrap;align-items:center;gap:12px;padding:16px 16px 0;display:flex}.score-controls>*{flex:auto}.orientation:empty{grid-template-columns:1fr 1fr;display:grid}.orientation:empty:before,.orientation:empty:after{visibility:hidden}#orientation:empty:before{content:"Left to right"}#orientation:empty:after{content:"Top to bottom"}#staff-variant:empty:before{content:"Compact"}#staff-variant:empty:after{content:"Regular"}.score-controls-note{color:var(--ink-soft);flex-basis:100%;margin:0}.orientation-toggle{grid-template-columns:1fr 1fr;max-width:360px}.orientation-toggle,.speed-toggle{box-shadow:inset 0 0 0 1.5px var(--ink);border-radius:3px;display:grid}.orientation-option,.orientation:empty:before,.orientation:empty:after,.speed-option{min-height:44px;color:var(--ink);font:inherit;white-space:nowrap;cursor:pointer;touch-action:manipulation;background:0 0;border:0;border-radius:3px;padding:0 8px;font-weight:600;line-height:1}.orientation-option[aria-pressed=true],.speed-option[aria-pressed=true]{background:var(--ink);color:#fff}.orientation-option:focus-visible,.speed-option:focus-visible{outline:3px solid var(--felt);outline-offset:2px}.notes{max-width:calc(62ch + 32px);padding:16px 16px 0}.notes ul{margin:0;padding-left:20px}.notes li{overflow-wrap:anywhere}.notes li+li{margin-top:4px}.score{-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain;margin-top:16px;padding:0 16px 16px;overflow-x:auto}.page{background:var(--sheet);width:780px;box-shadow:0 0 0 1px var(--rule)}.page+.page{margin-top:16px}.page svg{width:100%;height:auto;display:block}.score-top-down .page{width:100%;margin-inline:auto}@media (width>=744px){.score-controls{gap:8px}.score-controls>*{flex:none}.score-controls .button{padding-inline:16px}.score-controls .score-controls-note{flex:96px;font-size:.875rem;line-height:1.25}}@media (width>=900px){h1,.lede,.upload,.result-bar,.score-controls,.notes,.score{padding-inline:max(32px,50vw - 490px)}.notes{max-width:none}.page{width:min(100%,980px)}}.button{text-decoration:none}.site-nav{border-bottom:1px solid var(--rule);background:var(--sheet);justify-content:space-between;align-items:center;gap:16px;padding:4px 16px;display:flex}.site-nav a{min-height:44px;color:var(--ink);white-space:nowrap;align-items:center;text-decoration:none;display:inline-flex}.site-brand{font-family:var(--serif);font-size:1.125rem;font-weight:700}.site-link{text-underline-offset:3px;text-decoration:underline!important}.crumb{margin:0 0 8px;padding-inline:16px}.crumb a,.licence a,.level-all{color:var(--felt-deep);text-underline-offset:3px}.crumb a{align-items:center;min-height:44px;display:inline-flex}.library{padding:8px 16px 0}.level-section+.level-section{margin-top:32px}.level-head{justify-content:space-between;align-items:center;gap:16px;margin-bottom:8px;display:flex}.level-all{white-space:nowrap;align-items:center;min-height:44px;display:inline-flex}.piece-list{border-top:1px solid var(--rule);margin:0;padding:0;list-style:none}.piece-list li{border-bottom:1px solid var(--rule)}.piece-row{min-height:56px;color:var(--ink);flex-direction:column;justify-content:center;padding:8px 0;text-decoration:none;display:flex}.piece-row:hover .piece-row-title{color:var(--felt-deep)}.piece-row-title{overflow-wrap:anywhere;font-weight:600}.piece-row-meta{color:var(--ink-soft);font-size:1rem}.convert-callout{margin-top:40px;padding:0 16px}.convert-callout p{margin:8px 0 12px}.piece-head{padding-bottom:8px}.piece-head h1{overflow-wrap:anywhere}.piece-composer,.piece-level,.piece-description{max-width:62ch;margin:8px 0 0;padding-inline:16px}.piece-composer{font-family:var(--serif);font-size:1.25rem}.piece-level{color:var(--ink-soft)}.piece-head .hint[hidden]{display:none}.piece-head .hint{margin-top:8px;padding-inline:16px}.player{z-index:2;background:var(--paper);border-block:1px solid var(--rule);flex-wrap:wrap;align-items:center;gap:8px;margin-top:16px;padding:8px 16px;display:flex;position:sticky;top:0}.player[hidden]{display:none}.player .button{flex:1 1 0;min-width:0}.player-speed{flex:100%}.speed-toggle{grid-template-columns:repeat(5,1fr)}.speed-option{padding-inline:2px}.player-time{color:var(--ink-soft);text-align:center;flex:100%;margin:0}.facts,.licence{max-width:calc(62ch + 32px);padding:24px 16px 0}.facts h2,.licence h2{margin-bottom:8px;font-size:1.25rem}.facts dl{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 16px;margin:0;display:grid}.facts dt{color:var(--ink-soft);font-size:1rem}.facts dd{margin:0;font-weight:600}.edition-notes{margin:16px 0 0;padding-left:20px}.licence p{overflow-wrap:anywhere;margin:0 0 8px}details.notes{padding:16px 16px 0}details.notes summary{cursor:pointer;align-items:center;min-height:44px;font-weight:600;display:flex}.score path.sounding[fill=\#000]{fill:var(--felt)}.score path.sounding[fill=none]{stroke:var(--felt)}.page{content-visibility:auto;contain-intrinsic-size:auto 1009px}.score-top-down .page{content-visibility:visible;contain-intrinsic-size:none}.site-footer{border-top:1px solid var(--rule);color:var(--ink-soft);padding:24px 16px 40px}.site-footer p{margin:0}@media (width>=640px){.player{flex-wrap:nowrap}.player .button{flex:none;width:140px}.player-speed{flex:0 300px}.player-time{text-align:right;flex:auto}}@media (width>=900px){.site-nav,.library,.crumb,.piece-composer,.piece-level,.piece-description,.piece-head .hint,.player,.facts,.licence,details.notes,.convert-callout,.site-footer{padding-inline:max(32px,50vw - 490px)}.facts,.licence{max-width:none}.facts dl{grid-template-columns:repeat(3,minmax(0,1fr))}}