.library-heading{margin:26px 0 22px;align-items:center}.library-heading h1{margin-bottom:4px;font-size:40px}.library-subtitle{font:20px/1.4 var(--serif);color:var(--muted)}
.instrument-filters{display:flex;gap:7px}.instrument-filters button{border:1px solid transparent;border-radius:5px;background:var(--hover);padding:7px 20px;min-height:36px;font-size:13px}.instrument-filters button[aria-pressed=true]{background:var(--primary-fill);border-color:var(--accent);color:var(--on-accent)}
.work-list{display:flex;flex-direction:column;gap:0}.work-row{display:grid;grid-template-columns:164px minmax(0,1fr) 112px;gap:24px;align-items:center;padding:13px 16px;border-bottom:1px solid var(--line);min-width:0}.work-row:last-child{border-bottom-color:transparent}.work-title{min-width:0}.work-row h2{font-size:25px;line-height:1.18;overflow-wrap:anywhere}.work-row h2 a{text-decoration:none}.work-row h2 a:hover{text-decoration:underline}.work-composer{font:16px/1.35 var(--serif);margin-top:4px}.work-row .work-count{font-size:12px;color:var(--muted);margin-top:5px}
.score-preview{display:grid;place-items:center;overflow:hidden;border:1px solid var(--line);border-radius:4px;background:linear-gradient(135deg,var(--surface),var(--hover));color:var(--muted);font:32px var(--serif);padding:6px}.score-preview svg{width:100%;height:100%;stroke:none;fill:none;opacity:.82;mix-blend-mode:multiply}.work-cover{height:56px;width:100%}.work-row.active .work-cover{height:76px}.work-row:not(.active) .work-composer{display:none}.work-row:not(.active) h2{font-size:23px}.work-row.active{background:var(--selection-fill);border-radius:7px;border-bottom-color:transparent;margin:0 0 1px}.work-row.active h2{font-weight:700}.work-row.active .work-cover{border-color:var(--selection-line)}
.work-action{display:flex;align-items:center;justify-content:flex-end;gap:8px;border:1px solid transparent;border-radius:6px;min-height:42px;padding:8px 10px;text-decoration:none;color:var(--muted);font-size:13px}.work-action>span{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.work-action svg{width:17px;height:17px}.work-action:hover{background:var(--hover);color:var(--accent)}.work-row.active .work-action{background:var(--primary-fill);border-color:var(--accent);color:var(--on-accent);justify-content:center;box-shadow:inset 0 1px 1px #ffffff33}.work-row.active .work-action>span{position:static;width:auto;height:auto;clip-path:none}
.library-tools{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:18px 0 0}.library-tools #collection-summary{margin-right:auto}.recording-filter select{font:12px 'Segoe UI',Arial,sans-serif;border:0;background:transparent;color:var(--muted);min-height:36px;max-width:160px}.library-tools .text-button{font-size:12px;color:var(--muted)}.library-tools .button{font-size:12px;min-height:36px;padding:6px 12px}.library-tools .button svg{width:16px;height:16px}
@media(max-width:760px){.work-row{grid-template-columns:130px minmax(0,1fr) 92px;gap:18px;padding:12px}.work-cover{height:54px}.work-row.active .work-cover{height:68px}.work-row h2{font-size:23px}.work-composer{font-size:15px}.library-heading h1{font-size:36px}.instrument-filters button{padding:7px 16px}}
@media(max-width:600px){.library-heading{margin:22px 0 18px;gap:17px}.library-subtitle{font-size:18px}.instrument-filters{width:100%}.instrument-filters button{min-height:38px;flex:1}.work-row{grid-template-columns:74px minmax(0,1fr) 26px;gap:13px;padding:14px 8px}.work-cover,.work-row.active .work-cover{height:57px;padding:4px}.work-row:not(.active) h2{font-size:21px}.work-row h2{font-size:21px}.work-composer{font-size:13px}.work-row .work-count{font-size:10px;line-height:1.5}.work-action{padding:0;min-width:26px;min-height:44px;justify-content:center}.work-row.active .work-action{background:none;border-color:transparent;color:var(--accent);box-shadow:none}.work-row.active .work-action>span{position:absolute;width:1px;height:1px;clip-path:inset(50%)}.library-tools{gap:10px 16px;padding-top:12px}.library-tools #collection-summary{flex-basis:100%}.library-tools #play-all{margin-left:auto}}
.arrangement-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.arrangement-card{min-width:0;background:var(--surface);padding:24px;border:1px solid var(--line);border-radius:6px;display:flex;flex-direction:column;gap:12px}.arrangement-card h2{font-size:25px;overflow-wrap:anywhere}.arrangement-card h2 a{text-decoration:none}.arrangement-card h2 a:hover{text-decoration:underline}.arrangement-card p{font-size:12px}.arrangement-actions{display:flex;gap:18px;align-items:center;margin-top:auto;padding-top:4px;flex-wrap:wrap;font-size:12px}.arrangement-card.unverified{background:var(--hover)}.recording-row{display:grid;grid-template-columns:minmax(0,1fr) 85px 110px;gap:22px;align-items:center;padding:23px 0;border-bottom:1px solid var(--line)}.recording-row:first-child{border-top:1px solid var(--line)}.recording-row h2{font-size:23px;overflow-wrap:anywhere}.recording-row p{font-size:12px;margin-top:8px}.recording-row time{font-size:12px;font-variant-numeric:tabular-nums;color:var(--muted)}.recording-row.active h2::before{content:'♪ ';color:var(--accent)}.recording-kind{font-size:10px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;display:block;margin-bottom:7px}
@media(max-width:760px){.arrangement-grid{grid-template-columns:1fr}.recording-row{grid-template-columns:minmax(0,1fr) 54px 100px;gap:14px}}
@media(max-width:650px){.recording-row{grid-template-columns:minmax(0,1fr) 100px;gap:12px}.recording-row>div{grid-column:1;grid-row:1}.recording-row time{grid-column:1;grid-row:2}.recording-row>.button{grid-column:2;grid-row:1/span 2}.arrangement-card{padding:20px}}
.recording-row.active{background:var(--selection-fill);border-radius:6px;padding-left:14px;padding-right:14px}
