@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;600;650;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{--bg:#171915;--cream:#f1e9d8;--muted:#a6a79c;--orange:#e59863;--line:#363a31;--mono:ui-monospace,SFMono-Regular,Consolas,monospace}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:35px}body{margin:0;background:var(--bg);color:var(--cream);font-family:'DM Sans',Arial,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,select{font:inherit}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid var(--orange);outline-offset:5px}::selection{background:var(--orange);color:var(--bg)}.wrap{width:min(1240px,calc(100% - 100px));margin:auto}.header{height:112px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:inline-flex;align-items:center;gap:10px;font-family:'Space Grotesk',sans-serif;font-size:25px;font-weight:700;letter-spacing:-1.3px}.brand-icon{font-size:32px;color:var(--orange);font-weight:400;transform:rotate(180deg)}.brand-dot{font-size:10px;align-self:flex-start;margin-top:8px;margin-left:-5px}nav{display:flex;align-items:center;gap:36px;font-size:13px}nav a:hover,footer a:hover{color:var(--orange)}.nav-download{border:1px solid #636659;padding:12px 17px;border-radius:3px}.nav-download span{margin-left:16px}.hero{text-align:center;padding-top:58px;overflow:hidden}.eyebrow{font:10px var(--mono);letter-spacing:2px;display:flex;align-items:center;justify-content:center;gap:10px;color:#bebdaf}.led{display:inline-block;width:6px;height:6px;border-radius:50%;background:#e7a364;box-shadow:0 0 10px #e7a36488}h1,h2{font-family:'Space Grotesk',sans-serif;letter-spacing:-5px;line-height:1.01;font-weight:500}h1{font-size:clamp(68px,7.6vw,108px);margin:24px 0}em{font-style:normal;color:var(--orange)}p{line-height:1.8;color:var(--muted);font-size:15px}.hero-description{margin:0 0 27px}.app-store{display:inline-flex;align-items:center;gap:11px;background:var(--cream);color:#191b17;border-radius:6px;padding:9px 20px 10px;text-align:left;transition:transform .2s,background .2s;box-shadow:0 3px 0 #0d0e0c}.app-store:hover{background:#fff9ec;transform:translateY(-3px)}.app-store svg{width:25px;height:31px}.app-store span{display:flex;flex-direction:column}.app-store small{font-size:10px;line-height:1.25}.app-store strong{font-size:22px;line-height:1.1;font-weight:600;letter-spacing:-.6px}.device-note{font:8px var(--mono);letter-spacing:1.8px;color:#8e9284;margin-top:17px}.product-stage{height:430px;position:relative;display:flex;align-items:center;justify-content:center;perspective:1200px;margin-top:8px}.product-stage:before{content:'';position:absolute;width:800px;height:300px;background:radial-gradient(ellipse,#b57c3b24,transparent 70%);bottom:-10px}.orbit{position:absolute;width:860px;height:280px;border:1px solid #51534244;border-radius:50%;transform:rotate(-12deg);top:110px}.orbit-two{transform:rotate(12deg);width:1000px;top:110px}.phone{position:relative;width:790px;height:325px;border-radius:43px;padding:14px 22px 14px 28px;background:linear-gradient(160deg,#888b80,#272923 15%,#050605 30%,#151713 90%,#686b5e);box-shadow:0 40px 45px -14px #000b,inset 0 0 0 2px #8d908077,inset 0 0 0 6px #0c0d0b;transform:rotate(-5deg) rotateY(-9deg) rotateX(12deg);z-index:1;transition:transform 1s;animation:arrive 1.2s ease-out both}.phone:before{content:'';position:absolute;left:23%;top:-3px;width:65px;height:3px;background:#6b6e61;border-radius:3px}.phone-camera{position:absolute;width:10px;height:40px;border-radius:10px;background:#030403;left:10px;top:44%;z-index:2}.home-indicator{position:absolute;bottom:6px;left:42%;width:120px;height:3px;background:#eee9d67a;border-radius:3px}.synth{height:100%;background:repeating-linear-gradient(2deg,#6c3d2111 0px,#aa754320 2px,#4b2b1911 4px),linear-gradient(90deg,#482b1c,#a06d40 1.5%,#4c2b18 3%,#805431 4%,#2a2c27 4%,#2a2c27 96%,#8e6038 96%,#472919 98%,#a16d40);border-radius:26px;padding:14px 37px 10px;box-shadow:inset 0 0 10px #0009;overflow:hidden}.synth-top{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #77796b80;padding-bottom:10px;font:7px var(--mono);color:#d4d1bd}.synth-top b{font:700 18px 'Space Grotesk',sans-serif;letter-spacing:-1px}.synth-top b span{font:6px var(--mono);letter-spacing:1px;margin-left:7px}.synth-preset{padding:5px 8px;background:#151a12;box-shadow:inset 0 0 4px #000;color:#b4c68e;font-size:7px;letter-spacing:1px}.synth-controls{display:flex;padding:12px 0 10px;gap:15px;height:117px;background:repeating-linear-gradient(0deg,#ffffff02 0 1px,transparent 1px 3px)}.synth-section{flex:1;border-right:1px solid #62645677;padding-right:13px;text-align:center}.synth-section>span{font:6px var(--mono);letter-spacing:2px;display:block}.knobs{display:flex;justify-content:space-around;align-items:center;height:67px;gap:10px}.dial{position:relative;width:37px;height:37px;flex-shrink:0;border-radius:50%;background:repeating-conic-gradient(#151714 0deg 5deg,#383b31 7deg 12deg);box-shadow:0 5px 6px #000b,0 0 0 2px #11130e,0 0 0 4px #626458}.dial:before{content:'';position:absolute;inset:5px;border-radius:50%;background:linear-gradient(130deg,#53564a,#20221d 75%);border:1px solid #74776a66}.dial i{position:absolute;left:46%;top:4px;width:3px;height:12px;background:#e0d8c0;transform:rotate(-25deg);transform-origin:50% 14px;z-index:1}.dial:nth-child(2) i{transform:rotate(45deg)}.dial:nth-child(3) i{transform:rotate(110deg)}.dial.large{width:46px;height:46px}.dial-labels{display:flex;justify-content:space-around;font:5px var(--mono);letter-spacing:1px}.sliders{display:flex;justify-content:space-around;height:65px;align-items:center;gap:12px}.sliders i{height:42px;width:3px;background:#11140d;box-shadow:1px 0 #666b5a;position:relative}.sliders i:after{content:'';width:13px;height:7px;position:absolute;top:12px;left:-5px;background:linear-gradient(#b6a381,#594d3a);border:1px solid #151711}.sliders i:nth-child(2):after{top:24px}.sliders i:nth-child(3):after{top:5px}.sliders i:nth-child(4):after{top:30px}.master{border:0;max-width:76px;padding:0}.meter{display:flex;gap:3px;justify-content:center;margin:10px 0 12px}.meter i{width:5px;height:9px;background:#a8b56b;box-shadow:0 0 5px #a6ae6544}.meter i:nth-last-child(-n+2){background:#a87846}.dial.small{width:26px;height:26px;margin:auto}.keyboard{display:flex;position:relative;isolation:isolate}.visual-keyboard{height:92px;background:#090b08;gap:2px;padding:2px 1px 4px;box-shadow:0 -3px 7px #0008}.white-key{position:relative;flex:1;border:0;border-radius:0 0 3px 3px;background:linear-gradient(90deg,#c9c4b3,#f6f0dc 50%,#e7dfc9);box-shadow:inset 0 -5px 0 #bcb59e,0 2px 1px #0006}.black-key{position:absolute;width:3.7%;height:61%;top:0;border:0;border-radius:0 0 3px 3px;background:linear-gradient(90deg,#0a0c0a,#34382f 65%,#11140f);box-shadow:2px 4px 3px #0008,inset 0 -7px #080a07;z-index:2}.synth-bottom{display:flex;justify-content:space-between;font:5px var(--mono);letter-spacing:1px;padding-top:7px;color:#b4b29f}.stage-label{position:absolute;bottom:32px;font:7px/1.8 var(--mono);letter-spacing:1.3px;text-align:left;color:#919483}.label-left{left:3px}.label-right{right:3px;text-align:right}.concept-label{position:absolute;bottom:1px;font:8px var(--mono);color:#898d7f;letter-spacing:1px}.hero-bottom{display:flex;justify-content:space-between;align-items:center;padding:16px 0 25px;font:8px var(--mono);letter-spacing:1px;color:#9b9e90}.hero-bottom a{font-size:11px;color:var(--cream);letter-spacing:0}.hero-bottom a span{margin-left:20px}.spec-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#1c1f19}.spec-strip .wrap{display:flex;justify-content:space-around;padding:24px 0;font:10px var(--mono);letter-spacing:1.5px}.spec-strip i{font-style:normal;color:var(--orange);margin-right:12px}.instrument{padding:100px 0}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:60px;margin-bottom:55px}.section-heading .eyebrow{justify-content:flex-start}h2{font-size:clamp(42px,4.4vw,62px);letter-spacing:-3px;margin:22px 0 0}.section-heading>p{max-width:360px;font-size:14px;margin:0 0 4px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:36px}.feature-art{height:210px;background:radial-gradient(ellipse at 50% 40%,#444635,#252820 70%);border:1px solid #454737;border-radius:5px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:25px;overflow:hidden;position:relative}.feature-art:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,#ffffff03 0 1px,transparent 1px 3px);pointer-events:none}.feature-art>span{font:7px var(--mono);letter-spacing:2px;color:#bdbda9}.dial.huge{width:89px;height:89px;box-shadow:0 15px 18px #0008,0 0 0 4px #14170e,0 0 0 6px #777b64,0 0 0 13px #24291c,0 0 0 14px #7e816455;transform:rotate(15deg)}.dial.huge:before{inset:10px}.dial.huge i{top:10px;height:23px;transform-origin:50% 35px}.art-wave{background:radial-gradient(ellipse,#3e3925,#252820 80%)}.art-wave svg{width:85%;height:99px;filter:drop-shadow(0 0 7px #e4a56c66)}.art-wave path{fill:none;stroke:var(--orange);stroke-width:1.5}.reel{width:87px;height:87px;border:12px solid #898574;border-radius:50%;background:#2e3027;position:relative;box-shadow:0 10px 20px #0007,inset 0 0 0 2px #1a1c16}.reel:after{content:'';position:absolute;inset:23px;border:5px solid #b3a893;border-radius:50%}.reel i{width:22px;height:22px;border-radius:50%;background:#1d2018;position:absolute;left:21px;top:3px}.reel i:nth-child(2){left:3px;top:33px}.reel i:nth-child(3){left:39px;top:33px}.art-record b{color:#d4835a;margin-right:6px}.feature-index{font:8px var(--mono);color:var(--orange);letter-spacing:1.6px;display:block;margin-top:27px}h3{font-family:'Space Grotesk',sans-serif;font-size:22px;font-weight:500;letter-spacing:-.7px;margin:12px 0}article p{font-size:13px;margin:0;max-width:320px}.play-section{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:#1d2019;padding:80px 0}.play-layout{display:grid;grid-template-columns:1fr 1.2fr;gap:70px;align-items:center}.play-layout .eyebrow{justify-content:flex-start}.play-layout h2{margin-top:23px}.play-layout p{font-size:13px;margin-top:25px}.play-layout .demo-note{font-size:10px;color:#929684}.demo{padding:22px;background:repeating-linear-gradient(2deg,#bf8f5820 0 2px,transparent 2px 6px),linear-gradient(90deg,#7b5030,#3d281b 3%,#191d16 3%,#282d22 97%,#794f30 97%,#4f3420);border-radius:8px;box-shadow:0 20px 35px #0004;border-top:1px solid #b7916044}.demo-top{display:flex;justify-content:space-between;font:7px var(--mono);letter-spacing:1px;padding-bottom:17px;border-bottom:1px solid #515743}.demo-status{color:#c5ce96}.demo-controls{display:flex;gap:23px;align-items:center;padding:22px 0}.demo-controls label{font:7px var(--mono);letter-spacing:1px;display:flex;flex-direction:column;gap:9px;flex:1}.demo-controls select{background:#171b13;border:1px solid #5f654d;border-radius:3px;color:#e5dec8;font:10px var(--mono);padding:7px;width:100%}input[type=range]{width:100%;accent-color:var(--orange)}.demo-light{font:6px var(--mono);letter-spacing:1px;display:flex;gap:7px;align-items:center}.playable{height:125px;gap:3px;touch-action:none}.playable button{cursor:pointer;touch-action:none}.playable button:active,.playable button.active{background:#d49a66;box-shadow:inset 0 -1px #9a693f,0 0 15px #e8a25b44;transform:translateY(2px)}.playable .white-key span{position:absolute;bottom:12px;left:0;width:100%;color:#7b7868;font:9px var(--mono)}.keyboard-help{font:6px var(--mono)!important;letter-spacing:1px;display:flex;justify-content:space-between;margin:16px 0 0!important;color:#b0b49c}.download{padding:90px 0;text-align:center}.download h2{font-size:72px;margin-top:24px}.download p{font-size:14px;margin:23px 0 27px}.download .availability{font-size:10px;margin:15px 0;color:#a7ab99}.download .device-note{display:block;margin-top:20px}footer{border-top:1px solid var(--line);padding:32px 0;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}footer .brand{font-size:20px}footer .brand-icon{font-size:25px}footer>div{display:flex;gap:25px;font-size:10px;color:#adae9f}.footer-note{font:7px var(--mono);letter-spacing:1px;color:#838877}.skip{position:fixed;top:-100px;left:20px;padding:12px;background:var(--cream);color:var(--bg);z-index:10}.skip:focus{top:10px}.legal{max-width:750px;min-height:65vh;padding:65px 0 100px}.legal h1{font-size:55px;letter-spacing:-2px}.legal h2{font-size:26px;letter-spacing:-1px}.legal p,.legal li{font-size:15px;color:var(--muted);line-height:1.8}.legal a{color:var(--orange);text-decoration:underline}@keyframes arrive{from{opacity:0;translate:0 25px}to{opacity:1;translate:0 0}}@media(min-width:1500px){.hero{padding-top:65px}.product-stage{height:460px}.phone{width:850px;height:345px}.synth-controls{height:130px}.visual-keyboard{height:100px}}@media(max-width:1000px){.wrap{width:calc(100% - 56px)}.phone{width:670px;height:295px}.synth{padding:14px 30px 10px}.synth-controls{gap:9px;height:105px}.synth-section{padding-right:9px}.dial{width:30px;height:30px}.dial.large{width:38px;height:38px}.knobs{gap:8px;height:58px}.visual-keyboard{height:80px}.synth-top b{font-size:15px}.synth-top b span{display:none}.stage-label{display:none}.feature-grid{gap:23px}.feature-art{height:180px}.section-heading{gap:30px}.section-heading>p{max-width:300px}.play-layout{gap:35px;grid-template-columns:1fr 1.1fr}.demo{padding:18px}.demo-light{display:none}.keyboard-help span{display:none}.footer-note{display:none}}@media(max-width:650px){.wrap{width:calc(100% - 40px)}.header{height:82px}.brand{font-size:22px}nav{gap:0}nav>a:not(.nav-download){display:none}.nav-download{font-size:10px;padding:10px 12px}.nav-download span{margin-left:5px}.hero{padding-top:42px;overflow:hidden}.eyebrow{font-size:8px;letter-spacing:1.5px}h1{font-size:56px;letter-spacing:-3px;margin:23px 0}.hero-description{font-size:13px;max-width:290px;margin:0 auto 26px}.desktop{display:none}.product-stage{height:255px;margin-top:15px;perspective:700px;overflow:visible}.phone{width:540px;max-width:none;flex-shrink:0;height:225px;border-radius:28px;padding:9px 15px 9px 20px;transform:scale(.65) rotate(-5deg) rotateY(-9deg) rotateX(12deg)}.synth{padding:11px 25px 7px;border-radius:18px}.synth-top{padding-bottom:7px;font-size:5px}.synth-top b{font-size:13px}.synth-preset{font-size:5px}.synth-controls{height:79px;padding:7px 0;gap:7px}.synth-section>span{font-size:5px;letter-spacing:1px}.knobs{height:45px;gap:7px}.dial{width:24px;height:24px}.dial:before{inset:4px}.dial i{height:8px;top:3px;width:2px;transform-origin:50% 10px}.dial.large{height:31px;width:31px}.dial.small{width:19px;height:19px}.dial-labels{font-size:4px}.sliders{height:44px;gap:10px}.sliders i{height:30px}.sliders i:after{width:10px;left:-4px;height:6px}.sliders i:nth-child(4):after{top:22px}.master{max-width:45px}.meter{gap:2px;margin:6px 0 8px}.meter i{width:3px;height:6px}.visual-keyboard{height:65px}.synth-bottom{font-size:4px;letter-spacing:.5px;padding-top:5px}.phone-camera{width:6px;left:8px;height:28px}.home-indicator{height:2px;bottom:4px;width:80px}.orbit{width:330px;height:140px;top:70px}.orbit-two{width:355px;top:70px}.concept-label{bottom:5px;font-size:7px}.hero-bottom{padding:17px 0 24px;justify-content:center}.hero-bottom>span{display:none}.spec-strip .wrap{gap:14px;padding:20px 0;justify-content:space-between;font-size:6px;letter-spacing:.6px}.spec-strip i{display:block;margin:0 0 6px}.instrument{padding:60px 0}.section-heading{display:block;margin-bottom:32px}.section-heading>p{max-width:none;margin-top:25px;font-size:13px}h2{font-size:43px;letter-spacing:-2.5px}.feature-grid{grid-template-columns:1fr;gap:38px}.feature-art{height:210px}.feature-index{margin-top:19px}article p{max-width:none;font-size:13px}h3{font-size:23px}.play-section{padding:55px 0}.play-layout{grid-template-columns:1fr;gap:25px}.play-layout p{margin-top:20px}.playable{height:125px}.demo-top{font-size:6px;letter-spacing:.5px}.demo-controls{padding:17px 0}.download{padding:60px 0}.download h2{font-size:57px}.download p{font-size:12px}footer{justify-content:center;padding:27px 0}footer>div{width:100%;justify-content:center;gap:20px;font-size:9px}.legal{padding:40px 0 60px}.legal h1{font-size:44px}}@media(max-width:360px){h1{font-size:56px}.phone{transform:scale(.55) rotate(-5deg)}.demo-top{letter-spacing:0}.demo{padding:15px}.brand{font-size:19px}.nav-download{font-size:9px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
