:root{font-family:Arial,Helvetica,sans-serif;color:#e9ece9;background:#111a23;font-synthesis:none;--muted:#9daeb8;--line:#34414b;--teal:#31cebe;--yellow:#f5b04a}*{box-sizing:border-box}body{margin:0}button,input,summary{font:inherit}button,summary,a,input{touch-action:manipulation}button{border:1px solid #54616b;background:#202d37;color:inherit;padding:11px 15px;border-radius:4px;cursor:pointer;transition:background .15s}button:hover{background:#33434f}button:disabled{opacity:.4;cursor:default}button:focus-visible,input:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid var(--yellow);outline-offset:4px}a{color:inherit;text-decoration:none}main{max-width:1800px;margin:auto;padding:0 4vw}header{height:87px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px}.wordmark{font-size:12px;font-weight:700;letter-spacing:2px;display:flex;align-items:center;gap:12px}.mark{background:var(--yellow);color:#111a23;padding:7px 11px;font-size:25px;line-height:1}.badge{font-size:10px;letter-spacing:2px;color:var(--muted)}.subtle{background:transparent}.heading{padding:48px 0 38px;display:flex;justify-content:space-between;align-items:center}.eyebrow,.sectionline{font-size:10px;letter-spacing:2px;font-weight:700}.eyebrow{color:var(--muted);margin:0 0 17px}h1{font-size:clamp(38px,5vw,78px);letter-spacing:-4px;font-weight:400;margin:0;line-height:1.1}h1 i{font-family:Georgia,serif;color:var(--yellow);padding:0 8px}h2{font-weight:400;font-size:25px;line-height:1.2;letter-spacing:-.5px;margin:14px 0}.lede{color:#afbdc6;font-size:16px;margin:16px 0 0}.explain{font-size:14px;line-height:1.7;margin:0;border-left:1px solid var(--yellow);padding-left:24px}.explain span{color:var(--muted)}.workspace{display:grid;grid-template-columns:290px minmax(0,1fr);gap:32px}aside{border-right:1px solid var(--line);padding-right:28px}.sectionline{display:flex;justify-content:space-between;gap:10px;align-items:center;color:var(--muted);margin-bottom:18px}.sectionline:not(:first-child){margin-top:30px}.muted,.fine{color:var(--muted);line-height:1.6}.muted{font-size:12px}.fine{font-size:11px}.sourcewave{margin:24px 0;background:#17242e;border-radius:4px}.sourcewave path{stroke:#b9c5cd;stroke-width:1.2}svg{display:block;width:100%}.field{display:block;font-size:12px;color:#c3cdd4;margin:20px 0}.field output{float:right;color:var(--yellow)}input:not([type=range]):not([type=checkbox]){width:100%;display:block;margin-top:9px;background:#111a23;border:1px solid #495864;border-radius:3px;color:#fff;padding:10px}input[type=range]{display:block;width:100%;accent-color:var(--teal);margin:13px 0 0;min-height:24px;cursor:pointer}.buttonpair{display:flex;gap:8px}.buttonpair button{flex:1;padding:10px 8px;font-size:11px}.presets{display:grid;gap:6px}.presets button{display:flex;align-items:center;text-align:left;gap:12px;font-size:12px;background:#1b2832}.presets b{font:10px monospace;color:var(--muted)}.presets span{margin-left:auto;color:var(--yellow)}.annotation{font-family:Georgia,serif;color:#c8cdc8;font-size:14px;line-height:1.6;padding:10px 0 15px;border-bottom:1px solid var(--line)}.primary{background:var(--yellow);color:#182029;border-color:var(--yellow);font-weight:700}.primary:hover{background:#ffd38e}.panel{background:#192630;border:1px solid var(--line);border-radius:6px;padding:22px}.spectrum{padding-bottom:12px}.map{overflow:hidden;background:#121b24;min-height:200px}.map svg{aspect-ratio:900/256}.map.empty{height:256px;display:grid;place-items:center;font:italic 22px Georgia,serif;color:var(--muted)}.dot{display:inline-block;width:6px;height:6px;border-radius:50%;margin:0 6px 1px 9px;background:currentColor}.dot.attack{color:var(--yellow)}.dot.sustain{color:var(--teal)}.axis{display:flex;justify-content:space-between;font:9px monospace;color:var(--muted);margin-top:12px}.channels{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.channel.attack{border-top:2px solid var(--yellow)}.channel.sustain{border-top:2px solid var(--teal)}.channel svg{height:64px;margin:20px 0}.channel path{stroke:currentColor;stroke-width:1.6}.channel.attack{color:var(--yellow)}.channel.sustain{color:var(--teal)}.channel .field,.channel button{color:#dae2e5}.channel.attack input{accent-color:var(--yellow)}.channel h2{font-size:30px}.transport{display:flex;align-items:center;flex-wrap:wrap;gap:10px;margin-top:18px;padding:15px}.transport button{font-size:12px}.transport .play{min-width:120px}.check{font-size:12px;display:flex;align-items:center;gap:5px;margin-right:auto}.check input{accent-color:var(--teal);width:17px;height:17px}.status{min-height:35px;font:12px/1.5 monospace;color:#c8d4da;margin:14px 3px}.loupe{display:grid;grid-template-columns:1.1fr 1fr;gap:30px;margin-top:10px}.loupe h2{font-family:Georgia,serif;font-style:italic;font-size:28px}.loupe p{font-size:12px;line-height:1.7;color:var(--muted)}.loupecontrols{display:flex;gap:15px}.loupecontrols label{flex:1}.readout{border-left:1px solid var(--line);padding-left:28px}.readout p{font-family:monospace}.splitbar{height:8px;background:var(--teal);margin:23px 0;border-radius:5px;overflow:hidden}.splitbar span{display:block;height:100%;background:var(--yellow)}.readout strong{font-size:38px;font-weight:400;color:var(--yellow)}.readout small{font-size:11px;color:var(--muted);margin-left:10px}dl{font-size:10px;line-height:2;display:grid;grid-template-columns:auto auto;gap:1px 8px;color:var(--muted)}dd{margin:0;text-align:right;font-family:monospace;color:#e9ece9}.exports{display:grid;grid-template-columns:1fr 1fr;gap:25px;margin:18px 0 30px}.exports .eyebrow{margin-bottom:10px}.exports h2{font-size:28px;margin:0}.exportbuttons{display:grid;grid-template-columns:1fr 1fr;gap:8px;align-content:center}.exportbuttons button{font-size:11px}details{margin:24px 0;color:var(--muted);font-size:12px;line-height:1.5}summary{cursor:pointer}.fixtures{display:flex;gap:4px;margin-top:10px}.fixtures button{font-size:10px}footer{border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:40px;font-size:11px;color:var(--muted);line-height:1.8;padding:24px 0 30px}footer details{margin:10px 0}footer p{max-width:700px}.pulse{animation:pulse 2s ease-in-out infinite}@keyframes pulse{50%{opacity:.35}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}@media(min-width:1500px){.workspace{grid-template-columns:330px minmax(0,1fr)}.panel{padding:26px}.map svg{max-height:350px}}@media(max-width:1050px){main{padding:0 22px}.workspace{grid-template-columns:240px minmax(0,1fr);gap:20px}aside{padding-right:20px}.panel{padding:16px}.loupe,.exports{grid-template-columns:1fr}.readout{padding-left:0;border-left:0;border-top:1px solid var(--line);padding-top:5px}.badge{display:none}h1{letter-spacing:-2px}}@media(max-width:740px){header{height:72px}.wordmark{font-size:9px;letter-spacing:1px}.heading{padding:32px 0}.explain{display:none}.workspace{display:flex;flex-direction:column}aside{border-right:0;padding:0 0 24px;border-bottom:1px solid var(--line)}.presets{grid-template-columns:1fr 1fr 1fr}.presets button{padding:9px 6px;gap:6px;font-size:10px}.presets span{display:none}.sourcewave{max-height:55px;overflow:hidden}.channels{gap:10px}.channel h2{font-size:23px}.sectionline{font-size:8px;letter-spacing:1px}.channel .buttonpair{flex-wrap:wrap}.map{min-height:130px}.axis{font-size:7px}.transport{gap:8px}.transport button{font-size:11px;padding:10px}.transport .check{margin-right:0}.loupecontrols{gap:25px}footer{grid-template-columns:1fr;gap:0}h1{font-size:42px}.lede{font-size:14px}.exportbuttons{gap:10px}.panel{border-radius:4px}}h2{white-space:pre-wrap;overflow-wrap:anywhere}
