.mx-hero-grid{display:grid;gap:40px;grid-template-columns:1fr;align-items:end}.mx-hero h1{font-size:clamp(48px,6.2vw,100px);max-width:13ch}.m-hero .mx-status{margin:32px 0 0}.mx-scope{margin:0;border:1px solid var(--rule);background:var(--hull);position:relative}.mx-scope canvas{width:100%;height:150px}.mx-scope figcaption{position:absolute;left:12px;top:10px;color:var(--mute)}@media (min-width: 1100px){.mx-hero-grid{grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:56px}.mx-scope canvas{height:340px}}.channels{padding:var(--sec) 0}.ch-head .sec-head{margin-bottom:32px}.ch-beats{list-style:none;margin:0 0 32px;padding:0;display:grid;gap:1px;background:var(--rule);border:1px solid var(--rule);grid-template-columns:1fr}@media (min-width: 760px){.ch-beats{grid-template-columns:1fr 1fr}}@media (min-width: 1100px){.ch-beats{grid-template-columns:repeat(4,1fr)}}.ch-beats li{background:var(--void);padding:18px 20px;display:grid;grid-template-columns:28px 1fr;gap:4px;color:var(--ivory)}.ch-beats .label{color:var(--accent);padding-top:4px}.ch-beats h3{font:500 17px/1.3 var(--f-sans);color:inherit;margin:0 0 6px;transition:color var(--t-chip) var(--ease)}.ch-beats p{font-size:14.5px;line-height:1.5;color:inherit;margin:0;transition:color var(--t-chip) var(--ease)}.lanes-fig{margin:0}.lanes-cap{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;margin-bottom:12px}.mx-synth{background:repeating-linear-gradient(45deg,rgba(242,240,234,.18) 0 1px,transparent 1px 5px);white-space:normal;height:auto;min-height:22px;padding:4px 8px;line-height:1.3}.lanes-cap .tc{margin-left:auto;color:var(--mute)}.lanes-cap .tc b{color:var(--accent);font-weight:500}.lanes-wrap{position:relative}.lanes-wrap canvas{border:1px solid var(--rule);background:var(--hull)}#lanes{width:100%;height:360px}@media (max-width: 759px){#lanes{height:300px}}.playhead{position:absolute;top:0;height:360px;left:0;width:1px;background:var(--accent);opacity:.7;will-change:transform;display:none}.note-card{max-width:300px;margin:16px 0 0 auto;padding:16px 18px 18px;background:var(--paper);color:var(--ink);box-shadow:0 24px 48px -24px #0009}@media (min-width: 1280px){.note-card{position:absolute;right:16px;bottom:16px;max-width:250px;margin:0}}.note-card .label{color:var(--ink-mute);display:block;margin-bottom:8px}.note-card p{font:400 clamp(20px,1.8vw,26px)/1.2 var(--f-serif);color:var(--ink);margin:0}.channels.is-pinned{height:300vh;padding:0}.channels.is-pinned .ch-pin{position:sticky;top:0;height:100svh;display:flex;align-items:center;padding:calc(var(--nav-h) + 12px) 0 20px;overflow:hidden}.channels.is-pinned .ch-pin>.wrap{width:100%}.channels.is-pinned h2{font-size:clamp(40px,4.2vw,64px)}.channels.is-pinned .ch-head .sec-head,.channels.is-pinned .ch-beats{margin-bottom:20px}.channels.is-pinned .ch-beats li,.channels.is-pinned .ch-beats li .label{color:var(--mute)}.channels.is-pinned .ch-beats li.on{color:var(--ivory)}.channels.is-pinned .ch-beats li.on .label{color:var(--accent)}.channels.is-pinned #lanes,.channels.is-pinned .playhead{height:min(40vh,380px)}.channels.is-pinned .playhead{display:block}.channels.is-pinned .note-card{opacity:0;transform:translateY(8px);transition:opacity var(--t-enter) var(--ease),transform var(--t-enter) var(--ease)}.channels.is-pinned .note-card.on{opacity:1;transform:none}@media (max-height: 800px){.channels.is-pinned .ch-beats p{display:none}}.airgap{margin:0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px}.ag-box{position:relative;border:1px solid var(--accent);padding:28px 16px;display:grid;gap:8px;text-align:center;background:color-mix(in srgb,var(--accent) 6%,var(--hull))}.ag-box .label{color:var(--mute)}.ag-box b{font:400 26px var(--f-serif);color:var(--ivory)}.ag-box i{position:absolute;top:-8px;right:-8px;bottom:-8px;left:-8px;border:1px dashed color-mix(in srgb,var(--accent) 40%,transparent)}.ag-cut{width:clamp(56px,8vw,90px);position:relative;height:40px}.ag-cut span{position:absolute;left:0;right:0;top:50%;border-top:2px dashed var(--rule-2)}.ag-cut span:after{content:"";position:absolute;left:50%;top:-11px;width:20px;height:20px;margin-left:-10px;background:linear-gradient(45deg,transparent 45%,var(--rust-text) 45% 55%,transparent 55%),linear-gradient(-45deg,transparent 45%,var(--rust-text) 45% 55%,transparent 55%)}.ag-cut em{position:absolute;left:50%;bottom:-24px;transform:translate(-50%);white-space:nowrap;color:var(--rust-text);font-style:normal}.ag-cloud{border:1px dashed var(--rule-2);border-radius:40px;padding:26px 10px;text-align:center;color:var(--mute)}.line-grid{display:grid;gap:24px}@media (min-width: 900px){.line-grid{grid-template-columns:1fr 1fr}}.does{border:1px solid var(--rule);padding:28px;display:grid;gap:14px;align-content:start}.does h3{color:var(--mute);margin:0}.does ul{list-style:none;margin:0;padding:0;display:grid;gap:10px}.does li{padding-left:24px;position:relative;color:var(--ivory)}.does li:before{content:"";position:absolute;left:2px;top:.55em;width:8px;height:4px;border-left:1.5px solid var(--accent);border-bottom:1.5px solid var(--accent);transform:rotate(-45deg)}.never{align-content:start}.ledger{list-style:none;margin:0;padding:0;border-top:1px solid var(--rule)}.ledger li{display:grid;grid-template-columns:1fr;gap:10px;padding:20px 0;border-bottom:1px solid var(--rule)}@media (min-width: 760px){.ledger li{grid-template-columns:150px 1fr;gap:24px;align-items:baseline}}.ledger .lg-t{color:var(--ivory);margin:0 0 6px}.mx-for{margin:28px 0 0;max-width:60ch}.mx-fr{padding:0 0 var(--sec)}.fr-plate{display:grid;gap:10px;padding:clamp(24px,3vw,36px);text-decoration:none;max-width:860px}.fr-plate .label{color:var(--ink-mute)}.fr-plate .dbl-rule{display:block;margin:2px 0 6px}.fr-plate .fr-text{font:400 clamp(24px,2.6vw,36px)/1.2 var(--f-serif);color:var(--ink);text-wrap:balance}.fr-plate .fr-text b{white-space:nowrap;font:500 .5em/1 var(--f-mono);letter-spacing:.12em;color:var(--stamp);vertical-align:.3em}.fr-plate .fr-sub{font:400 15px/1.55 var(--f-sans);color:var(--ink-mute)}.fr-plate .fr-go{color:var(--ink);margin-top:6px}.fr-plate .arr{display:inline-block;transition:transform var(--t-press) var(--ease)}.fr-plate:hover .arr{transform:translate(4px)}@media (max-width: 759px){.airgap{gap:22px}}
