:root{font-family:system-ui,sans-serif;color:#23312d;background:#edf0ec;font-size:15px}*{box-sizing:border-box}body{margin:0}header{height:68px;background:#173d32;color:white;display:flex;align-items:center;gap:28px;padding:0 30px}header strong{letter-spacing:.17em;font-size:14px}header span{opacity:.7}main{display:grid;grid-template-columns:310px minmax(0,1fr);min-height:calc(100vh - 68px)}aside{padding:30px 25px;background:#fafbf8;border-right:1px solid #d9dfd7}h1{font-family:Georgia,serif;font-size:29px;font-weight:normal;margin:0 0 12px}.intro,.hint{color:#627069;line-height:1.55}.intro{margin-bottom:30px}form>label{display:block;margin-top:25px;font-weight:600}output{float:right;font-variant-numeric:tabular-nums;font-weight:normal}select{padding:9px;border:1px solid #bbc8bd;border-radius:5px;background:white;color:inherit}#score{width:100%;margin-top:8px}.check{display:flex;align-items:center;gap:8px}input[type=range]{width:100%;margin:13px 0 0;accent-color:#24634e}input[type=checkbox]{accent-color:#24634e;width:17px;height:17px}.hint{font-size:12px;margin-bottom:25px}button{width:100%;border:0;border-radius:5px;padding:12px;background:#24634e;color:white;font:inherit;cursor:pointer}.secondary{background:transparent;color:#24634e;margin-top:6px}button:disabled{opacity:.55;cursor:wait}#status{font-size:13px;line-height:1.5}#status.error{color:#a52e25}nav a{display:block;color:#24634e;margin:10px 0;font-size:13px}.preview{min-width:0;padding:20px 30px}.toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;gap:10px;color:#627069;font-size:13px}.toolbar select{margin-left:6px}#pages{width:100%}#pages img{display:block;width:100%;height:auto;margin:0 auto 24px;box-shadow:0 3px 16px #20332918;background:white}.empty{text-align:center;padding:100px 20px;color:#627069}@media(min-width:900px){aside{position:sticky;top:0;align-self:start;max-height:100vh;overflow:auto}#pages{max-width:1100px;margin:auto}}@media(max-width:700px){main{grid-template-columns:1fr}aside{border-right:0}h1{font-size:25px}.preview{padding:18px}header{padding:0 20px}}

#debug{margin-top:24px;font-size:12px}#debug summary{cursor:pointer;font-weight:600}#timings{padding-left:18px;overflow-wrap:anywhere;max-height:220px;overflow:auto}#timings li{margin:10px 0;font-variant-numeric:tabular-nums}

header a{color:#e2ede5;font-size:13px}header .header-links,header>a{margin-left:auto}header .header-links{display:flex;gap:20px}.catalog{max-width:1000px;margin:45px auto;padding:0 24px}.catalog h1{font-size:38px}.search-form>label{margin-top:0}.search-form>div{display:flex;gap:12px;margin-top:10px}.search-form input{flex:1;min-width:0;padding:14px;border:1px solid #bbc8bd;border-radius:5px;font:inherit}.search-form button{width:auto;padding:12px 28px}.result{background:#fafbf8;border:1px solid #d9dfd7;border-radius:6px;padding:20px;margin:14px 0}.result h2{font-size:20px;margin:0 0 10px}.result p{margin:8px 0}.result a,.catalog a,#score-info a{color:#24634e}.result h2 a{text-decoration:none}.pagination{display:flex;align-items:center;justify-content:center;gap:20px}.pagination button{width:auto}.pagination span{white-space:nowrap}#score-info{font-size:13px;margin-bottom:20px}
/* Browse page */
.catalog{max-width:1600px;margin:36px auto;padding:0 28px}.browse-heading{margin-bottom:26px}.eyebrow{font-size:11px;letter-spacing:.16em;color:#577c69}.browse-heading h1{font-size:40px;margin-bottom:10px}.search-row{display:flex;gap:10px;max-width:900px}.search-row input{flex:1;min-width:0;padding:15px;font:inherit;border:1px solid #bdcabf;border-radius:6px}.search-row button{width:auto;padding:12px 28px}.shortcuts{display:flex;gap:8px;flex-wrap:wrap;margin:17px 0}.shortcuts button,#active-filters button{width:auto;background:#f8faf7;color:#345b49;border:1px solid #cbd7cc;padding:8px 14px;border-radius:24px;font-size:13px}.shortcuts button[aria-pressed=true]{background:#24634e;color:white}#filters{border-top:1px solid #d5ddd3;border-bottom:1px solid #d5ddd3;padding:14px 0}#filters summary{cursor:pointer;color:#345b49}.filter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:14px;margin:18px 0}.filter-grid label{font-size:13px}.filter-grid select,.filter-grid input{display:block;width:100%;margin-top:6px;padding:10px;font:inherit;border:1px solid #bbc8bd;border-radius:5px;background:white}.apply-filters{width:auto;padding:10px 22px}#active-filters{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:16px 0}.section-heading,.results-heading{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:28px 0 15px}.section-heading h2,.results-heading h2{font-family:Georgia,serif;font-size:25px;font-weight:normal;margin:0}.section-heading span{font-size:13px;color:#627069}.results-heading p{margin:7px 0 0;font-size:13px;color:#627069}.score-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,390px),1fr));gap:20px;align-items:start}.score-card{min-width:0;background:white;border:1px solid #d8e0d7;border-radius:8px;overflow:hidden;position:relative;display:flex;flex-direction:column;padding:14px 16px 9px;cursor:pointer;transition:box-shadow .15s}.score-card:hover{box-shadow:0 4px 16px #25463318}.card-title{font-family:Georgia,serif;font-size:19px;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex-shrink:0}.card-composers{font-size:12px;color:#627069;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;flex-shrink:0}.card-composers a{color:#627069;text-decoration:none}.card-preview{display:flex;flex:none;min-height:0;align-items:center;justify-content:center;font-size:11px;color:#829084;text-decoration:none;margin-top:5px}.card-preview:not(:has(img)){min-height:70px}.card-preview img{width:100%;height:auto;display:block}.card-meta{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#758277;flex-shrink:0;padding-top:3px}.pagination{margin:28px 0}#empty-state{text-align:center;padding:50px 15px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #bf943f;outline-offset:3px}@media(max-width:700px){.catalog{padding:0 16px;margin-top:25px}.browse-heading h1{font-size:31px}.section-heading{display:block}.section-heading span{display:block;margin-top:7px}.filter-grid{grid-template-columns:1fr 1fr}.results-heading{gap:8px}.results-heading select{max-width:120px}.card-title{font-size:18px}}
.artist-list{display:flex;flex-direction:column;border:1px solid #d8e0d7;border-radius:8px;overflow:hidden;background:white}.artist-row{display:flex;justify-content:space-between;gap:16px;align-items:baseline;padding:14px 18px;color:#23312d;text-decoration:none;border-top:1px solid #e6ece4}.artist-row:first-child{border-top:0}.artist-row:hover{background:#f7faf6}.artist-name{font-family:Georgia,serif;font-size:18px}.artist-count{font-size:13px;color:#627069;white-space:nowrap}

/* Keep the transport outside the notation scroll area so it sticks to the viewport. */
#score-surface{width:100%;max-width:1100px;margin:auto}
#score-scroll{overflow-x:auto}
#score-surface #pages{width:100%;max-width:none;margin:0}
#playback{width:100%;margin:0 0 16px;padding:14px 16px;border:1px solid #d5dfd9;border-radius:8px;background:#fafbf8}
.transport-row{display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.playback-buttons{display:flex;gap:4px;align-items:center}
#playback .icon-button{width:40px;height:40px;padding:9px;margin:0;display:grid;place-items:center;flex:none}
#playback button:disabled{cursor:default}
.icon-button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.play-icon{fill:currentColor;stroke:none}.pause-icon{display:none;stroke-width:4}
#play-pause[data-playing=true] .play-icon{display:none}#play-pause[data-playing=true] .pause-icon{display:block}
.playback-position{flex:1;min-width:180px}
#playback input[type=range]{width:100%;margin:0;display:block}
.playback-progress{display:flex;justify-content:space-between;gap:10px;margin-top:8px;font-size:11px;color:#627069}
#playback output{float:none;font-variant-numeric:tabular-nums}
.playback-options{display:flex;align-items:center;gap:18px}
.playback-options label{font-size:11px;color:#627069;display:flex;align-items:center;gap:8px}
.playback-options select{padding:7px;font:inherit;font-size:12px}
#playback #play-volume{width:85px}
#play-midi{max-width:180px}
.playback-caption{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px 20px;color:#627069;font-size:11px;margin-top:12px}
.playback-caption a{color:#24634e}
@media(max-width:1050px){.transport-row{gap:14px}.playback-options{margin-left:auto}}
@media(max-width:700px){#playback{padding:12px}.transport-row{gap:14px}.playback-position{flex-basis:100%;order:2}.playback-options{flex:1;justify-content:flex-end;flex-wrap:wrap;gap:8px}.playback-options label{gap:5px}#playback #play-volume{width:65px}.playback-caption{margin-top:14px}}

#pages>svg{display:block;width:100%;height:auto;background:white;margin:0 0 24px;box-shadow:0 2px 12px #14291d12}
#pages [data-note-role=ink].playing,#pages [data-rest-id].playing{fill:#d97706!important}
#pages [data-tie-id].playing{fill:#d97706!important;stroke:#d97706!important}
#pages [data-note-id],#pages [data-rest-id],#pages [data-measure-id]{cursor:pointer}
#playback{position:sticky;top:8px;z-index:2;box-shadow:0 2px 8px #173d3210}
.follow-control{display:flex;align-items:center;gap:6px;font-size:12px;margin-top:10px}

/* Static published-score viewer. */
.published-main{height:calc(100vh - 68px);min-height:0}.published .published-list{padding:24px 0;display:flex;flex-direction:column;min-height:0;overflow:hidden}.published-list h1{padding:0 25px;margin-bottom:18px}.published-list nav{overflow:auto;padding:0 12px 20px;display:grid;gap:12px}.published-score{width:100%;color:#23312d;text-align:left;font:inherit}.published-score:hover,.published-score.selected{background:#e0ebe3}.published-score.selected{border-color:#24634e}.published-score .card-title{color:#173d32;border:0;background:none;padding:0;text-align:left;max-width:100%}.published-score .card-composers{display:block;margin-top:2px}.published-score .card-preview{display:block;width:100%;height:auto;margin-top:7px}.published-preview{min-height:0;display:flex;flex-direction:column;padding-bottom:0}.published-heading{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin:0 auto 15px;width:100%;max-width:1100px}.published-heading h1{font-size:24px;margin:0}.published-heading p{color:#627069;margin:5px 0 0;font-size:13px}.published-actions{display:flex;gap:14px;align-items:baseline}.published-heading a,#pdf-download{color:#24634e;white-space:nowrap}.published #playback,.published #published-status{flex:none;max-width:1100px;margin-left:auto;margin-right:auto}.published #published-status{width:100%;font-size:12px;color:#627069;margin-top:0;margin-bottom:8px}.published #published-status.error{color:#a52e25}.published #score-scroll{flex:1;min-height:0;overflow:auto;padding-right:12px}.published #pages{padding-bottom:24px}
.published header .brand{margin-left:0;color:white;text-decoration:none;letter-spacing:.17em;font-size:14px}
@media(max-width:700px){.published-main{height:auto;display:flex;flex-direction:column}.published .published-list{max-height:240px;padding:18px 0}.published-list h1{font-size:23px}.published-preview{padding:18px;min-height:calc(100vh - 308px)}.published-heading{align-items:flex-start}.published-heading h1{font-size:21px}.published #score-scroll{padding-right:0}.published #playback{position:static}.published #pages{padding-bottom:0}}