.website-main{padding-top:76px}.website-hero{max-width:1100px;padding-bottom:48px}.website-hero h1{font-family:var(--font-display);letter-spacing:-.055em;margin:24px 0 28px;font-size:clamp(3.1rem,7.5vw,6.4rem);line-height:1.02}.website-title-accent{color:var(--accent)}.website-lead{max-width:720px;color:var(--muted);font-size:clamp(1.1rem,2vw,1.3rem);line-height:1.65}.website-actions{flex-wrap:wrap;gap:14px;margin:32px 0 18px;display:flex}.website-primary,.website-secondary{border:1px solid var(--border);border-radius:6px;justify-content:center;align-items:center;gap:32px;min-height:50px;padding:13px 22px;font-weight:650;display:inline-flex}.website-primary{background:var(--accent);color:var(--ink);border-color:var(--accent)}.website-secondary{color:var(--text)}.website-primary:hover,.website-secondary:hover{transform:translateY(-1px)}.website-note{color:var(--muted);font-size:.9rem;line-height:1.6}.website-role-strip{border-top:1px solid var(--border);border-bottom:1px solid var(--border);grid-template-columns:repeat(6,1fr);margin-top:54px;padding:0;list-style:none;display:grid}.website-role-strip li{font-family:var(--font-display);padding:18px 10px;font-size:1rem}.website-role-strip li:before{content:"";background:var(--accent);width:6px;height:6px;margin-right:12px;display:inline-block}.website-section{border-top:1px solid var(--border);padding:62px 0;scroll-margin-top:100px}.website-section h2{font-family:var(--font-display);letter-spacing:-.035em;margin:14px 0 26px;font-size:clamp(2rem,4vw,3.25rem);line-height:1.12}.website-section-heading{grid-template-columns:1.15fr 1fr;align-items:end;gap:70px;margin-bottom:26px;display:grid}.website-section-heading>p{color:var(--muted);margin-bottom:28px;line-height:1.65}.website-examples-grid,.website-workflow{grid-template-columns:repeat(3,1fr);gap:22px;display:grid}.website-example{border:1px solid var(--border);background:var(--brand-panel);border-radius:9px;min-width:0;padding:24px}.website-example-heading{justify-content:space-between;align-items:baseline;gap:10px;display:flex}.website-example h3{margin:0;font-size:1.4rem}.website-example-heading span,.website-example-meta,.website-example-detail{color:var(--muted);font-size:.85rem}.website-example-score{width:100%;height:auto;margin:18px 0 8px}.website-example-score text{fill:var(--muted);text-transform:capitalize;font-size:11px}.website-example-score line{stroke:var(--border);stroke-width:.6px}.website-example-score rect{fill:var(--brand-cyan)}.website-example-score .example-bass rect{fill:var(--brand-amber)}.website-example-score .example-arp rect{fill:var(--brand-violet)}.website-example-score .example-melody rect{fill:var(--brand-orange)}.website-example-score .example-piano rect{fill:#a6c9ef}.website-example-score .example-drums rect{fill:#d7dc9c}.website-example-actions{gap:8px;margin:18px 0;display:flex}.website-example button{min-height:44px;color:var(--text);border:1px solid var(--border);cursor:pointer;background:0 0;border-radius:5px;padding:9px 13px}.website-example-actions button:first-child{color:var(--accent)}.website-example-source{color:var(--muted);overflow-wrap:anywhere;font-size:.82rem;line-height:1.6}.website-example-source summary{cursor:pointer;min-height:44px;padding-top:10px;display:list-item}.website-workflow article{border-top:1px solid var(--border);padding:26px 0}.website-workflow span{letter-spacing:.08em;color:var(--accent);font-size:.75rem}.website-workflow h3{margin:20px 0 14px;font-size:1.3rem}.website-workflow p,.website-platforms p{color:var(--muted);line-height:1.7}.website-platforms{grid-template-columns:1.2fr 1fr;gap:80px;display:grid}.website-native{border:1px solid var(--border);border-radius:9px;padding:28px}.website-native h3{margin:0;font-size:1.2rem}.website-native small{color:var(--muted);margin-top:22px;line-height:1.6;display:block}.website-final{text-align:center;padding-bottom:92px}.website-final .website-secondary{margin:12px}@media (width<=900px){.website-main{padding-top:48px}.website-section-heading,.website-platforms{grid-template-columns:1fr;gap:14px}.website-examples-grid{grid-template-columns:1fr}.website-example-score{max-height:230px}.website-role-strip{grid-template-columns:repeat(3,1fr)}}@media (width<=560px){.website-workflow{grid-template-columns:1fr;gap:6px}.website-section{padding:42px 0}.website-role-strip li{padding:14px 6px;font-size:.85rem}.website-primary,.website-secondary{width:100%}.website-section-heading>p{margin-top:0}.website-example{padding:18px}.website-final .website-secondary{margin:12px 0}.mp-headerlinks{display:none}}
