:root{color-scheme:dark;--bg:#0a1013;--text:#f4f7f8;--muted:#a4b2bc;--line:#293940;--mint:#2ef2bf;--cyan:#21d6ec;--pink:#ed41bb;--brand-gradient:linear-gradient(110deg,#39f526 0%,#25f6a6 48%,#00d4ee 100%)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:radial-gradient(ellipse at 72% 15%,#0b202728,transparent 50%),var(--bg);color:var(--text);font-family:"Avenir Next",Avenir,"Segoe UI",sans-serif;font-size:16px;line-height:1.6}a{color:inherit;text-decoration:none}a:hover{color:var(--mint)}a:focus-visible,button:focus-visible{outline:2px solid var(--mint);outline-offset:6px}button{font:inherit;cursor:pointer}.page{max-width:1440px;margin:auto;padding:0 56px}.header{min-height:96px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);gap:24px}.brand{display:flex;align-items:center;gap:9px;font-size:23px;font-weight:750;letter-spacing:-.8px}.brand img{object-fit:contain;mix-blend-mode:lighten}nav{display:flex;gap:32px;font-size:14px}nav a{padding:14px 0}.hero{position:relative;min-height:575px;display:flex;align-items:center;padding:66px 0 58px;isolation:isolate}.hero-copy{position:relative;z-index:2}.eyebrow,.section-label,.art-label,.art-foot{font-family:"SFMono-Regular",Consolas,monospace;font-size:10px;letter-spacing:2px;text-transform:uppercase}.eyebrow{color:var(--muted);margin:0 0 24px}.release{display:inline-flex;align-items:center;gap:10px;letter-spacing:1.6px}.status-dot{display:inline-block;width:6px;height:6px;background:var(--mint);border-radius:50%;flex-shrink:0}.separator{opacity:.5;margin:0 3px}h1{font-size:clamp(64px,6.5vw,94px);line-height:.99;letter-spacing:-5px;margin:0 0 25px;font-weight:800}h1 span{color:var(--mint);background-image:var(--brand-gradient);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.intro{font-size:23px;line-height:1.45;color:#c4d4df;margin:0 0 30px}.actions{display:flex;gap:14px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:26px;padding:12px 21px;border-radius:5px;font-weight:650;min-height:50px;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px)}.primary{background:var(--brand-gradient);color:#071a16}.primary:hover{filter:brightness(1.08);color:#071a16}.secondary{border:1px solid #516570;background:#101920aa}.hero-art{position:absolute;right:-25px;top:36px;width:65%;height:500px;z-index:-1;pointer-events:none;overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 20%)}.hero-art img{width:100%;height:100%;object-fit:contain}.art-label{position:absolute;right:10px;top:90px;line-height:1.8;font-size:9px;color:#b7c8d2;border-top:1px solid var(--cyan);padding-top:15px}.art-foot{position:absolute;right:12px;bottom:50px;font-size:9px;color:var(--muted)}.product{margin:0}.section-label{display:flex;justify-content:space-between;color:var(--muted);margin-bottom:17px;font-size:10px}.screenshot-link{display:block}.app-shot{display:block;width:100%;height:auto}figcaption{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;margin-top:14px}.features{display:grid;grid-template-columns:1fr 1.3fr;column-gap:52px;row-gap:44px;padding:100px 0 64px;border-bottom:1px solid var(--line)}h2{font-size:44px;line-height:1.09;letter-spacing:-1.7px;margin:0 0 23px;font-weight:750}.feature-intro>p:not(.eyebrow),.start>div>p:not(.eyebrow){color:#bdcbd4}.text-link{display:inline-block;color:var(--mint);font-size:13px;padding:10px 0}.code-panel,.terminal{min-width:0;background:linear-gradient(135deg,#15202788,#0b1116);border:1px solid var(--line);border-radius:9px;overflow:hidden}.panel-title{display:flex;align-items:center;gap:10px;border-bottom:1px solid #24323a;padding:14px 18px;color:#c3cdd5;font-size:12px}.file-dot{width:7px;height:7px;background:var(--mint);border-radius:2px}.muted{color:#80909d;font-size:10px;margin-left:auto}pre{margin:0;overflow-x:auto;padding:25px;font-size:13px;line-height:1.95;tab-size:4}code{font-family:"SFMono-Regular",Consolas,"Liberation Mono",monospace}.comment{color:#8397ac}.keyword{color:#f487ce}.type{color:#8fe6ef}.function{color:#80dfbf}.number,.string{color:#efdd7e}.code-caption{padding:15px 24px;font-size:11px;color:var(--muted);border-top:1px solid #24323a;display:flex;align-items:center;gap:9px}.feature-list{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:40px}.feature-list article{display:flex;gap:18px}.feature-icon{font-family:monospace;color:var(--cyan);font-size:28px;line-height:1.3}.loops{color:var(--pink);font-size:38px;line-height:1}h3{font-size:18px;line-height:1.3;margin:0 0 10px;letter-spacing:-.4px}.feature-list p{font-size:14px;color:var(--muted);margin:0;line-height:1.65}.start{display:grid;grid-template-columns:1fr 1.3fr;gap:52px;padding:65px 0 62px}.start h2{font-size:40px}.requirements{font-size:12px;line-height:1.8}.installation{min-width:0}.terminal .panel-title{background:#ffffff03}.traffic{display:flex;gap:5px;margin-right:8px}.traffic i{width:7px;height:7px;border-radius:50%;background:#ff6262}.traffic i:nth-child(2){background:#ffcb52}.traffic i:nth-child(3){background:#2cce72}.terminal pre{font-size:11px;line-height:2.1;color:#bfd2de;padding:23px 18px}.terminal button{margin-left:auto;background:transparent;border:1px solid #40535f;border-radius:4px;color:#c8d9e3;font-size:10px;padding:5px 8px}.terminal button:hover{border-color:var(--mint);color:var(--mint)}.install-note{color:var(--muted);font-size:12px;line-height:1.7;margin:10px 0 0}#copy-status{font-size:12px;color:var(--mint);margin:4px 0;min-height:0}#copy-status:empty{display:none}footer{border-top:1px solid var(--line);padding:28px 0 38px;display:flex;align-items:center;justify-content:space-between;gap:20px;color:var(--muted);font-size:12px}footer .brand{font-size:19px;color:var(--text)}footer>a:last-child{font-size:11px}.skip{position:absolute;top:10px;left:10px;z-index:10;background:var(--mint);color:#000;padding:10px;transform:translateY(-160%)}.skip:focus{transform:none}
@media(min-width:1200px){.desktop-break{display:none}}
@media(max-width:1000px){.page{padding:0 30px}.hero-art{opacity:.7;right:-20px;width:67%}.art-label,.art-foot{display:none}.features,.start{gap:30px}h2{font-size:36px}.feature-list{gap:24px}.brand{font-size:20px}nav{gap:22px}.feature-list article{gap:12px}pre{font-size:11px;padding:20px}}
@media(max-width:700px){.page{padding:0 22px}.header{min-height:78px;gap:12px}.brand{font-size:17px;letter-spacing:-.5px}.brand img{width:37px;height:32px}nav{gap:16px;font-size:12px}nav a:first-child{display:none}nav a:nth-child(2){display:none}.hero{min-height:auto;padding:45px 0 180px}.release{font-size:8px;letter-spacing:.9px;gap:6px;margin-bottom:25px}h1{font-size:clamp(54px,12vw,78px);letter-spacing:-3px}.intro{font-size:18px;line-height:1.55}.desktop-break{display:none}.actions{gap:10px}.button{font-size:13px;padding:11px 15px;gap:16px;min-height:46px}.hero-art{width:100%;height:240px;top:auto;bottom:-9px;right:-16px;opacity:.9;mask-image:linear-gradient(180deg,transparent,#000 20%)}.section-label{font-size:8px;letter-spacing:1px;gap:10px}.section-label span:first-child{display:none}figcaption{font-size:9px;gap:12px}.features{display:flex;flex-direction:column;padding:62px 0 40px;gap:30px}h2{font-size:39px}.feature-intro>p:not(.eyebrow){font-size:15px}.feature-list{display:flex;flex-direction:column;gap:27px}.feature-list article{gap:20px}.feature-icon{width:35px;flex-shrink:0}pre{font-size:11px;padding:18px 14px}.muted{font-size:9px}.panel-title{padding:12px 14px}.start{display:flex;flex-direction:column;padding:42px 0;gap:20px}.start h2{font-size:36px}.start>div>p{font-size:14px}.start .requirements{font-size:12px}.terminal pre{font-size:10px}.eyebrow{font-size:9px}.code-caption{font-size:10px;padding:14px}footer{flex-wrap:wrap;gap:20px;padding:24px 0}footer .brand{width:100%}footer>a:last-child{margin-left:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.button{transition:none}.button:hover{transform:none}}

@media(forced-colors:active){h1 span{background:none;-webkit-text-fill-color:currentColor}.primary{border:1px solid ButtonText}}

.performance{padding:70px 0 0;border-bottom:1px solid var(--line)}
.performance-heading h2{font-size:44px}.performance-heading h2 span{color:var(--muted)}
.performance-row{display:grid;grid-template-columns:1fr 1.3fr;gap:52px;align-items:center;padding:45px 0 55px}
.performance-row+.performance-row{border-top:1px solid var(--line)}
.feature-tag{font:11px "SFMono-Regular",Consolas,monospace;letter-spacing:1.5px;text-transform:uppercase;color:var(--cyan);margin:0 0 20px}
.cue-row .feature-tag{color:#f37ecf}.performance-copy h3{font-size:34px;letter-spacing:-1.2px;line-height:1.12;margin-bottom:20px}
.performance-copy>p:not(.feature-tag){color:#bdcbd4;max-width:380px;font-size:15px}.performance-copy .detail{font-size:12px!important;color:var(--muted)!important}
.gesture-diagram,.cue-diagram{margin:0;min-width:0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:linear-gradient(145deg,#10232877,transparent)}
.diagram-top{display:flex;align-items:center;gap:10px;padding:18px 0;font:9px "SFMono-Regular",Consolas,monospace;letter-spacing:1px;color:var(--muted)}
.deck-chip{display:inline-grid;place-items:center;width:25px;height:25px;border-radius:4px;background:var(--cyan);color:#061318;font-size:12px;font-weight:bold}.deck-chip.b{background:var(--pink)}
.diagram-status{margin-left:auto;font-size:8px;letter-spacing:.5px}.scratch-wave{position:relative;height:145px;margin:8px 0 15px;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(12.5% - 1px),#30424a55 calc(12.5% - 1px),#30424a55 12.5%);overflow:hidden}.scratch-wave>svg{width:100%;height:100%;stroke:var(--cyan);stroke-width:1.5;opacity:.8}.playhead{position:absolute;top:0;bottom:0;left:50%;width:1px;background:#fff;box-shadow:0 0 10px #21d6ec66}.playhead:before{content:"";position:absolute;left:-4px;border-left:4px solid transparent;border-right:4px solid transparent;border-top:6px solid #fff}.finger-pair{display:flex;gap:9px;position:absolute;left:calc(50% + 24px);top:25px;transform:rotate(-12deg)}.finger-pair i{display:block;width:19px;height:43px;border:1px solid #bdfff3;border-radius:14px;background:#172d36de;box-shadow:0 4px 15px #0008}.finger-pair i:nth-child(2){margin-top:-7px}.finger-pair i:nth-child(3){border-style:dashed;opacity:.55}
.scratch-directions{display:flex;justify-content:space-between;font-size:13px;color:#ddf5f6}.scratch-directions>span:last-child{text-align:right}.scratch-directions small{display:block;color:var(--muted);font-size:10px;margin-top:3px}.performance figure figcaption{display:block;font-size:10px;margin:20px 0;color:var(--muted)}
.cue-flow{display:grid;grid-template-columns:1fr 1.7fr;gap:25px;align-items:center;min-height:210px}.signal-source{position:relative;display:flex;flex-direction:column;align-items:flex-start;padding:20px 0}.signal-source strong{font-size:22px}.signal-source small,.signal-destination small{font-size:10px;color:var(--muted);display:block;margin-top:6px}.route-dot{width:7px;height:7px;background:var(--pink);border-radius:50%;margin-bottom:10px;box-shadow:0 0 12px #ed41bb66}.signal-branches{border-left:1px solid #56717c;display:grid;gap:30px;padding:0 0 0 25px;position:relative}.signal-branches:before{content:"";position:absolute;top:50%;left:-26px;width:25px;border-top:1px solid #56717c}.signal-destination{position:relative}.signal-destination:before{content:"";position:absolute;left:-26px;top:16px;width:16px;border-top:1px solid #56717c}.route-label{font:9px "SFMono-Regular",Consolas,monospace;color:var(--muted);letter-spacing:1px;display:block;margin-bottom:8px}.signal-destination strong{font-size:16px;display:flex;align-items:center;gap:8px}.headphone-route strong,.headphone-route .route-label{color:#f37ecf}.headphone-route svg{fill:none;stroke:currentColor;stroke-width:1.5}
@media(max-width:1000px){.performance-row{gap:30px}.performance-copy h3{font-size:30px}.diagram-top{font-size:8px}.signal-destination strong{font-size:13px}}
@media(max-width:700px){.performance{padding-top:45px}.performance-heading h2{font-size:32px}.performance-row{grid-template-columns:1fr;padding:30px 0 40px;gap:20px}.performance-copy h3{font-size:32px}.performance-copy>p:not(.feature-tag){max-width:none}.cue-flow{gap:20px;grid-template-columns:1fr 1.65fr}.signal-branches{padding-left:16px}.signal-destination:before{left:-17px;width:10px}.signal-source strong{font-size:19px}.diagram-status{font-size:7px}.signal-destination strong{font-size:13px}.performance figure figcaption{font-size:9px}}

.play-mode{display:grid;grid-template-columns:1fr 1.3fr;gap:45px 52px;padding:70px 0;border-bottom:1px solid var(--line)}
.gradient-text{color:var(--mint);background:var(--brand-gradient);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
.mode-intro>p:not(.eyebrow),.shortcut-heading>p:not(.eyebrow){color:var(--muted);font-size:15px;max-width:390px}.mode-intro strong{color:var(--text)}
.trackpad-guide{margin:0;min-width:0}.trackpad-map{position:relative;display:grid;grid-template-columns:18% 64% 18%;grid-template-rows:80% 20%;aspect-ratio:1.62;border:1px solid #4a616c;border-radius:18px;overflow:hidden;background:linear-gradient(145deg,#15232b,#0b141a)}
.edge-a,.edge-b{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;text-align:center;background:#21d6ec12;border-right:1px solid #21d6ec55;color:var(--cyan)}
.edge-b{background:#ed41bb12;border-right:0;border-left:1px solid #ed41bb55;color:#f37ecf}.edge-a>span,.edge-b>span{font-size:27px;font-weight:750}.edge-a strong,.edge-b strong{font-size:11px}.edge-a small,.edge-b small{font:9px monospace;opacity:.85}
.trackpad-center{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px}.trackpad-center strong{font-size:18px;line-height:1.3}.trackpad-center small{font-size:11px;color:var(--muted)}.touch-mark{display:block;width:25px;height:35px;border:1px solid #7c9ba9;border-radius:14px;box-shadow:0 0 0 6px #7c9ba90b;margin-bottom:3px}
.edge-fader{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;padding:0 20px;background:linear-gradient(90deg,#21d6ec25,#ed41bb25);border-top:1px solid #687f8966}.edge-fader>strong:first-child{color:var(--cyan)}.edge-fader>strong:last-child{color:#f37ecf}.edge-fader>span{text-align:center}.edge-fader b{display:block;font-size:12px;letter-spacing:1px}.edge-fader small{display:block;font-size:9px;color:#c1ced6}.trackpad-guide figcaption{font-size:10px;color:var(--muted);margin-top:12px}
.shortcut-heading h3{font-size:29px;line-height:1.2;letter-spacing:-1px}.shortcut-table-wrap{min-width:0}.shortcut-table{width:100%;border-collapse:collapse;font-size:13px}.shortcut-table th,.shortcut-table td{padding:13px 0;border-bottom:1px solid var(--line);text-align:left}.shortcut-table thead th{font:9px monospace;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);padding-top:0}.shortcut-table tbody th{width:45%;font-weight:400;white-space:nowrap}.shortcut-table tbody th>span{display:inline-block;min-width:35px;font-size:11px;color:var(--muted)}kbd{display:inline-block;border:1px solid #445965;border-bottom-width:3px;border-radius:5px;padding:4px 7px;background:#142028;color:#e2eaf0;font:11px "SFMono-Regular",Consolas,monospace}.shortcut-deck{font:10px monospace;display:inline-block;margin-right:5px}.shortcut-deck.a{color:var(--cyan)}.shortcut-deck.b{color:#f37ecf}.mode-note{font-size:11px;line-height:1.7;color:var(--muted);margin:15px 0 0}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(max-width:1000px){.play-mode{column-gap:30px}.shortcut-table{font-size:11px}.shortcut-table tbody th{width:47%}.trackpad-center strong{font-size:16px}}
@media(max-width:700px){.play-mode{grid-template-columns:1fr;gap:30px;padding:45px 0}.mode-intro h2{font-size:36px}.trackpad-map{border-radius:13px}.trackpad-center{gap:8px}.trackpad-center strong{font-size:16px}.trackpad-center small{font-size:10px}.edge-a strong,.edge-b strong{font-size:9px}.edge-a small,.edge-b small{font-size:7px}.edge-fader{padding:0 14px}.edge-fader b{font-size:10px}.edge-fader small{font-size:8px}.shortcut-heading{margin-top:15px}.shortcut-table td{font-size:11px;padding-left:6px}.shortcut-table tbody th{width:44%}.shortcut-table tbody th>span{min-width:29px;font-size:10px}kbd{font-size:10px;padding:4px}.trackpad-guide figcaption{font-size:9px}}
@media(forced-colors:active){.gradient-text{background:none;-webkit-text-fill-color:currentColor}}
