:root{font-family:var(--scorepace-font-body);color:var(--scorepace-ink);background:var(--scorepace-paper);font-size:16px;line-height:1.6;font-synthesis:none}
*{box-sizing:border-box}
body{margin:0}
a{color:var(--scorepace-link);text-underline-offset:3px;text-decoration-thickness:1px;text-decoration-color:var(--scorepace-link-underline)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--scorepace-focus);outline-offset:4px}
.site-header{min-height:98px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px max(24px,calc((100vw - 1192px)/2));border-bottom:1px solid var(--scorepace-border);background:var(--scorepace-surface)}
.brand{display:inline-flex;align-items:center;gap:13px;font:700 36px/1 var(--scorepace-font-display);letter-spacing:-1px;text-decoration:none;color:var(--scorepace-ink)}
.brand-dot{color:#3a927b}
.brand-mark{position:relative;display:flex;gap:2px;width:33px;height:28px;flex:none}
.brand-mark span{width:10px;height:28px;border:1.5px solid var(--scorepace-heading);border-radius:2px}
.brand-mark i{position:absolute;top:0;left:8px;width:6px;height:17px;background:var(--scorepace-heading)}
.brand-mark i:last-child{left:19px}
.site-header nav{display:flex;gap:24px;font-size:14px}
main{max-width:1240px;margin:auto;padding:52px 24px 64px}
.hero{display:grid;grid-template-columns:1.05fr 1fr;gap:64px;align-items:center;padding:12px 0 36px}
.eyebrow{font-size:12px;letter-spacing:.16em;font-weight:650;color:var(--scorepace-muted);margin:0 0 12px}
.hero .eyebrow:before{content:'•';color:#55927a;margin-right:8px}
.hero h1{font:500 56px/1.05 var(--scorepace-font-display);letter-spacing:-2px;margin:16px 0 24px;color:var(--scorepace-ink)}
.hero em{color:#337d67}
.lead{font-size:18px;line-height:1.55;max-width:760px;margin:16px 0 24px}
.benefits{padding:0;list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:14px 20px;margin:26px 0}
.benefits li{display:flex;align-items:center;gap:10px;font-size:14px;line-height:1.4}
.benefits span{display:grid;place-items:center;flex:none;width:30px;height:30px;background:#e8f1e9;border-radius:8px;color:var(--scorepace-accent)}
.benefits svg{width:19px;height:19px}
.primary,.secondary{display:block;text-align:center;padding:13px 22px;border-radius:99px;text-decoration:none;font-size:15px;font-weight:650;min-height:48px}
.primary{background:var(--scorepace-accent);color:#fff;border:1px solid var(--scorepace-accent)}
.primary:hover{background:#246957}
.secondary{border:1px solid #bdd1c5;width:fit-content;background:#edf3ee;font-size:14px}
.secondary:hover{background:#e3eee6}
.inline{display:inline-flex;align-items:center;justify-content:center}
.sample{display:block;text-align:center;font-weight:600;font-size:14px;margin:16px 0;text-decoration:none}
.import{text-align:center;font-size:13px;margin-top:20px}
.import a{font-weight:600;margin-left:5px}
small{display:block;margin:6px 0;color:var(--scorepace-muted);font-size:12px}
.muted{color:var(--scorepace-muted);font-size:13px;line-height:1.55}
.hero .muted{margin-top:24px}
.preview{position:relative;margin:0;padding:20px 28px 20px 20px;background:var(--scorepace-soft);border:1px solid var(--scorepace-border);border-radius:var(--scorepace-radius)}
.preview img{display:block;width:94%;height:auto;border:1px solid var(--scorepace-border);border-radius:12px;box-shadow:0 12px 30px #29483c12}
.preview .phone{position:absolute;right:12px;bottom:12px;width:27%;height:auto;border:4px solid #29483c;border-radius:20px}
.section-heading{margin-bottom:24px}
.section-heading h2,.edition-panel h2{font-family:var(--scorepace-font-body);font-size:26px;line-height:1.25;font-weight:650;letter-spacing:-.5px;margin:0 0 14px;color:var(--scorepace-heading)}
.section-heading>p:not(.eyebrow){max-width:730px;color:var(--scorepace-muted);margin:0;line-height:1.65}
.getting-started{border-top:1px solid var(--scorepace-border);padding-top:48px;margin-top:32px}
.tutorial-cards{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;margin:28px 0}
.tutorial-cards>li{min-width:0;border:1px solid var(--scorepace-border);border-radius:var(--scorepace-radius);overflow:hidden;background:#fff}
.tutorial-cards img{display:block;width:100%;height:auto}
.tutorial-copy{padding:20px 22px 24px}
.step-number{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#e8f1e9;color:var(--scorepace-accent);font-size:13px;font-weight:700;margin-bottom:12px}
.tutorial-copy h3{font-size:17px;line-height:1.4;margin:0 0 8px;color:var(--scorepace-heading)}
.tutorial-copy p{margin:0;font-size:14px;color:var(--scorepace-muted)}
.musicxml-help{padding:0;margin:8px 0 0;text-align:center}
.musicxml-help summary{font-size:13px;font-weight:600;cursor:pointer;color:var(--scorepace-accent);min-height:32px;align-content:center}
.musicxml-help p{max-width:540px;text-align:left;font-size:14px;margin:10px auto 4px;padding:14px 16px;background:var(--scorepace-soft);border-radius:10px}
.page-title{font:500 40px/1.15 var(--scorepace-font-display);letter-spacing:-1px;margin:0 0 18px;color:var(--scorepace-heading);overflow-wrap:anywhere}
.catalog-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:32px}
.catalog-heading>div{max-width:800px}
.catalog-heading .secondary{flex:none;margin-top:4px}
.catalog-heading .lead{font-size:16px;max-width:670px;margin-bottom:16px}
.cards{list-style:none;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;margin:28px 0 36px}
.cards>li{min-width:0}
.score-card{display:block;height:100%;border:1px solid var(--scorepace-border);border-radius:var(--scorepace-radius);background:#fffefa;text-decoration:none;overflow:hidden;transition:border-color .15s,box-shadow .15s}
.score-card:hover{border-color:#8bae9b;box-shadow:0 4px 14px #214c3812}
.score-card-art{position:relative;background:#f5f7f1;overflow:hidden}
.score-card-art img{display:block;width:100%;height:auto;aspect-ratio:400/152;object-fit:cover}
.score-card-arrow{position:absolute;bottom:10px;right:12px;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--scorepace-accent);color:#fff;font-size:18px;box-shadow:0 2px 6px #1b4d3026}
.score-card-copy{padding:16px 17px 18px}
.score-card h2{font-family:var(--scorepace-font-body);font-size:16px;line-height:1.4;font-weight:650;letter-spacing:0;color:var(--scorepace-heading);margin:0 0 6px}
.score-card p{font-size:13px;line-height:1.45;color:var(--scorepace-muted);margin:0 0 12px}
.badge{display:inline-block;padding:3px 10px;border-radius:99px;background:#e8f1e9;color:#285a48;font-size:12px;font-weight:600}
.pagination{display:flex;gap:10px;flex-wrap:wrap}
.pagination a{padding:8px 16px;border:1px solid #bdd1c5;border-radius:9px;text-decoration:none;font-size:14px;min-width:44px;text-align:center}
.pagination [aria-current]{background:var(--scorepace-accent);color:#fff}
.breadcrumbs{display:flex;gap:10px;font-size:13px;margin-bottom:34px}
.breadcrumbs a{text-decoration:none}
.piece-hero{display:grid;grid-template-columns:1.2fr 1fr;align-items:center;gap:64px;margin-bottom:42px}
.composer{font-size:15px;color:var(--scorepace-muted);margin:0 0 12px}
.piece-intro{max-width:620px;font-size:16px;line-height:1.65;margin:22px 0}
.score-facts{display:flex;gap:28px;flex-wrap:wrap;margin:24px 0}
.score-facts dt{font-size:12px;color:var(--scorepace-muted);margin-bottom:7px}
.score-facts dd{font-size:14px;font-weight:600;margin:0;min-height:26px}
.piece-hero .muted{max-width:420px;margin:14px 0 0}
.piece-art{display:block;text-decoration:none;color:inherit;position:relative;border:1px solid var(--scorepace-border);border-radius:var(--scorepace-radius);background:#f5f7f1;padding:24px 10px 12px;overflow:hidden}
.piece-art>img{display:block;width:100%;height:auto}
.piece-art>p{font-size:12px;color:var(--scorepace-muted);margin:12px 14px 4px}
.piece-play{position:absolute;bottom:50px;right:24px;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:var(--scorepace-accent);color:white;border:5px solid #f5f7f1;font-size:18px}
.edition-panel{display:grid;grid-template-columns:1fr 1fr;gap:40px;border:1px solid var(--scorepace-border);border-radius:var(--scorepace-radius);background:var(--scorepace-soft);padding:24px 28px;margin-bottom:48px}
.edition-panel h2{font-size:18px;margin-bottom:12px}
.edition-panel p{font-size:14px;margin:6px 0;color:var(--scorepace-muted);overflow-wrap:anywhere}
.edition-panel summary{font-weight:600;font-size:14px;cursor:pointer;color:var(--scorepace-heading)}
.edition-panel details{align-self:center}
.related .section-heading{display:flex;align-items:center;justify-content:space-between;gap:20px}
.related .section-heading h2{font-size:23px;margin:0}
.related .section-heading>a{font-size:14px;flex:none}
footer{display:flex;flex-wrap:wrap;gap:16px;max-width:1240px;margin:auto;padding:24px;border-top:1px solid var(--scorepace-border);font-size:12px}
footer button{border:0;background:none;color:var(--scorepace-accent);font:inherit;text-decoration:underline;cursor:pointer;padding:0}
.skip{position:absolute;top:-100px}
.skip:focus{top:10px;left:10px;background:#fff;padding:10px;z-index:10}
.language-suggestion{display:block;padding:8px 24px;background:var(--scorepace-soft);text-align:center;font-size:14px}
@media(max-width:1050px){.hero{gap:36px}.benefits{grid-template-columns:1fr}.hero h1{font-size:50px}.cards{grid-template-columns:repeat(3,minmax(0,1fr))}.catalog-heading{display:block}.catalog-heading .secondary{margin-bottom:20px}.piece-hero{gap:36px}}
@media(max-width:800px){.hero{grid-template-columns:1fr}.preview{max-width:620px;width:100%;margin:0 auto}.tutorial-cards{gap:14px}.tutorial-copy{padding:16px}.cards{grid-template-columns:repeat(2,minmax(0,1fr))}.piece-hero{grid-template-columns:1fr;gap:28px}.piece-art{max-width:560px;width:100%}.edition-panel{grid-template-columns:1fr;gap:18px}.page-title{font-size:34px}.site-header nav{gap:18px}}
@media(max-width:550px){.site-header{min-height:66px;padding:14px 20px;gap:14px}.brand{font-size:32px}.site-header nav{font-size:13px}.site-header nav>a:first-child{display:none}.site-header .brand-mark{transform:scale(.9);transform-origin:left center;margin-right:-3px}main{padding:28px 20px 40px}.hero{padding-top:0;gap:28px}.hero h1{font-size:46px}.hero .lead{font-size:18px}.benefits{gap:12px}.benefits li{font-size:14px}.preview{padding:14px 22px 14px 14px}.section-heading h2{font-size:24px}.section-heading>p:not(.eyebrow){font-size:15px}.getting-started{padding-top:30px;margin-top:16px}.tutorial-cards{grid-template-columns:1fr;gap:20px}.tutorial-copy{padding:18px 20px 22px}.tutorial-cards img{max-height:200px;object-fit:cover}.cards{grid-template-columns:1fr;gap:18px}.score-card{display:grid;grid-template-columns:112px 1fr}.score-card-art{height:100%}.score-card-art img{height:100%;object-fit:cover;object-position:center;aspect-ratio:auto}.score-card-arrow{width:28px;height:28px;bottom:9px;right:9px}.score-card-copy{padding:16px}.score-card h2{font-size:15px}.page-title{font-size:30px}.catalog-heading .lead{font-size:15px}.catalog-heading .secondary{font-size:13px;padding:11px 18px}.piece-art{padding-top:12px}.score-facts{gap:20px}.edition-panel{padding:20px}.related .section-heading{align-items:flex-start}.related .section-heading>a{max-width:140px;text-align:right}.related .section-heading h2{font-size:22px}.breadcrumbs{margin-bottom:26px}footer{padding:22px 20px;gap:14px}}
@media(prefers-reduced-motion:reduce){.score-card{transition:none}}
.analytics-consent{position:fixed;z-index:100;inset:auto 20px max(20px,env(safe-area-inset-bottom)) 20px;display:flex;align-items:center;justify-content:space-between;gap:24px;max-width:920px;margin-inline:auto;padding:18px 20px;border:1px solid #c8d8cd;border-radius:18px;background:#fffef9;color:#29483c;box-shadow:0 12px 40px #183b2b33}
.analytics-consent-copy{min-width:0}.analytics-consent-copy strong{font-size:16px}.analytics-consent-copy p{margin:6px 0 0;font-size:14px;line-height:1.45}.analytics-consent-copy small{display:block;margin-top:6px;color:#68786e;font-size:12px}
.analytics-consent-actions{display:flex;flex:none;align-items:center;gap:8px}.analytics-consent-actions button{min-height:44px;padding:0 14px;border:1px solid #287b69;border-radius:10px;background:#fff;color:#285a48;font-weight:650}.analytics-consent-actions .analytics-consent-accept{background:#fff;color:#285a48}
@media(max-width:650px){.analytics-consent{inset:auto 10px max(10px,env(safe-area-inset-bottom)) 10px;display:block;padding:16px;border-radius:16px}.analytics-consent-actions{display:grid;grid-template-columns:1fr 1fr;margin-top:12px}.analytics-consent-actions button{padding-inline:8px;font-size:13px}.analytics-consent-actions .analytics-consent-close{grid-column:1/-1}}

/* Navigation is recognizable by placement; prose links keep a visible underline. */
.site-header nav a,footer a,footer button,.breadcrumbs a,.related .section-heading>a,.import a,.sample{color:var(--scorepace-link);text-decoration:none;border-radius:4px}
.site-header nav a,footer a,footer button,.breadcrumbs a,.related .section-heading>a{display:inline-flex;align-items:center;min-height:32px}
@media(hover:hover){
 a:not(.brand):not(.primary):not(.secondary):not(.score-card):not(.piece-art):not(.skip):not([aria-current]):hover,footer button:hover{color:var(--scorepace-link-hover);text-decoration:underline;text-decoration-thickness:1px;text-decoration-color:var(--scorepace-link-underline)}
}
a:not(.brand):not(.primary):not(.secondary):not(.score-card):not(.piece-art):not(.skip):not([aria-current]):active,footer button:active{color:var(--scorepace-link-hover);background:var(--scorepace-link-pressed);box-shadow:0 0 0 3px var(--scorepace-link-pressed)}
.site-header nav a:focus-visible,footer a:focus-visible,footer button:focus-visible,.breadcrumbs a:focus-visible,.related .section-heading>a:focus-visible,.import a:focus-visible,.sample:focus-visible{text-decoration:underline}

/* The account island loads separately from static public content. */
.site-header nav{align-items:center}
.public-account{display:flex;align-items:center;min-height:44px}
.public-account .account-control,.public-account .account-signed-in{display:flex;align-items:center;gap:8px;min-width:0}
.public-account .account-control{position:relative}
.public-account .google-sign-in{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 12px;border:1px solid var(--scorepace-border);border-radius:999px;background:var(--scorepace-surface);color:var(--scorepace-link);font:inherit;font-size:13px;cursor:pointer;white-space:nowrap}
.public-account .google-mark{width:20px;height:20px;flex:none}
.public-account .account-user-icon{width:20px;height:20px;flex:none}
.public-account .account-signed-in>span{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px}
.public-account .account-sign-out{min-height:44px;padding:0 4px;border:0;background:transparent;color:var(--scorepace-link);font:inherit;font-size:13px;cursor:pointer}
.public-account button:hover{background:var(--scorepace-soft)}
.public-account button:disabled{opacity:.5;cursor:default}
.public-account [role=alert]{position:absolute;top:100%;right:0;max-width:260px;padding:8px;background:var(--scorepace-paper);color:#9b362c;font-size:12px}
@media(max-width:800px){.site-header{gap:14px}.site-header nav{gap:14px}.public-account .account-signed-in>span{max-width:110px}}
@media(max-width:650px){
 .site-header .brand>span:last-child{display:none}
 .site-header nav>a:first-child{display:none}
 .public-account .google-sign-in{width:44px;padding:0}
 .public-account .google-sign-in>span{display:none}
 .public-account .account-signed-in>span{max-width:80px}
 .public-account-fallback{font-size:12px;max-width:110px}
}