@font-face{font-family:Monoblock;src:url('assets/Monoblock-Light.otf') format('opentype');font-display:swap}@font-face{font-family:'SF Pro';src:local('SF Pro Display'),local('SFProDisplay-Regular')}@font-face{font-family:Panel;src:url('assets/native/crt-display-font.otf') format('opentype');font-display:swap}
:root{color-scheme:dark;--bg:#111b20;--fg:#f3eee3;--muted:#b2c2c5;--accent:#8bd8ef;--line:#63838a55;--font:'SF Pro',-apple-system,BlinkMacSystemFont,'Helvetica Neue',sans-serif}*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth;scrollbar-color:#698389 #142329;scroll-padding-top:24px}body{background:var(--bg);color:var(--fg);font:16px/1.5 var(--font);overflow-x:hidden}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:wait;opacity:.5}a{color:inherit;text-decoration:none}svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}::selection{background:#8bd8ef;color:#102028}:focus-visible{outline:2px solid var(--accent);outline-offset:4px}h1,h2,h3{font-family:var(--font);font-weight:650;line-height:1.04;letter-spacing:-.035em}h2{font-size:clamp(38px,4.2vw,62px)}p{color:var(--muted)}.header{position:relative;z-index:2;max-width:1440px;padding:18px 40px;display:flex;align-items:center;justify-content:space-between;margin:auto}.brand{display:flex;align-items:center;gap:12px}.brand-symbol{width:36px;height:36px;object-fit:contain}.wordmark{width:143px;height:auto}.header nav{display:flex;align-items:center;gap:34px;font:12px Monoblock,monospace}.nav-download{color:var(--accent);display:flex;align-items:center;gap:12px}.hero{position:relative;isolation:isolate;padding:10px 24px 54px;overflow:hidden;background:#16313c}.hero:before{content:'';position:absolute;inset:-60px -50px;z-index:-2;background:url('assets/instrument.webp') center 35%/cover;opacity:.3;filter:contrast(1.2) saturate(.65);transform:scale(1.1) rotate(-12deg)}.hero:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#092b38b8,#0f293380 47%,#592f18a3),linear-gradient(0deg,#111b20,transparent 32%,#111b2080)}.hero-heading{text-align:center;margin:0 auto 21px}.hero h1{font-size:clamp(46px,6vw,86px);font-weight:700;line-height:1.02}.hero-heading p{margin-top:9px;font-size:17px;color:#e1e5e0}.hero-heading p span{color:var(--accent)}.instrument-stage{width:min(100%,calc((100svh - 330px)*1.4074),920px);min-width:560px;margin:auto}.hero-toolbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;margin:0 10px 12px;gap:16px}.play-controls{display:flex;align-items:center;gap:8px}.play-button,.transport-shuffle{height:42px;padding:0 14px;border:1px solid #7a9b9b;background:#142b33;color:var(--fg);display:flex;align-items:center;gap:9px;font:12px Monoblock,monospace;border-radius:4px}.play-button svg{width:17px;fill:currentColor;stroke:none}.transport-shuffle{padding:0 10px}.button{display:inline-flex;align-items:center;justify-content:center;gap:26px;min-height:46px;padding:12px 24px;font:13px Monoblock,monospace;border-radius:4px;transition:background .2s,transform .2s}.primary{background:var(--accent);color:#182127}.primary:hover{background:#b9eaff;transform:translateY(-2px)}.toolbar-volume{font-size:0}.native-instrument{position:relative;width:100%;aspect-ratio:1824/1296;container-type:inline-size;filter:drop-shadow(0 22px 24px #0008)}.native-plate{display:block;width:100%;height:100%;pointer-events:none}.native-pos{position:absolute!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;min-width:0!important;min-height:0!important;max-width:none!important}.native-sprite{background-color:transparent;background-repeat:no-repeat;background-position:50% 0;box-shadow:none;color:#152729;cursor:pointer}.native-sprite[aria-pressed=true]{background-position:50% 100%!important}.native-sprite:active{filter:brightness(.92)}.native-sprite:disabled{opacity:.55;cursor:default}.native-text,.native-value{font:1cqw Panel,Monoblock,monospace;line-height:1;letter-spacing:0;color:#273631;background:transparent;display:flex;align-items:center;white-space:nowrap}.native-value{justify-content:center;font-size:.9cqw;pointer-events:none}.native-text{appearance:none;text-overflow:ellipsis;overflow:hidden;cursor:pointer}.native-text option{background:#142328;color:#efede3;font-size:14px}#preset{color:#e7e9df}#dice{z-index:5;border-radius:50%!important}#dice:focus-visible{outline-offset:3px}.native-scope{pointer-events:none;border-radius:50%!important;z-index:3}.native-dice{pointer-events:none;z-index:4}.native-wave{background:#102222}.native-sprite[data-speed]{font:1cqw Panel,Monoblock;display:grid;place-items:center}.native-fader{appearance:none;background:transparent;cursor:ew-resize;outline-offset:2px}.native-fader::-webkit-slider-runnable-track{background:transparent;height:1.32cqw}.native-fader::-webkit-slider-thumb{appearance:none;width:1.32cqw;height:1.32cqw;background:var(--thumb) center/contain no-repeat;border:0}.native-fader::-moz-range-thumb{width:1.32cqw;height:1.32cqw;background:var(--thumb) center/contain no-repeat;border:0}.native-fader::-moz-range-track{background:transparent}.browser-settings{display:flex;justify-content:center;gap:20px;font:10px Monoblock;color:#b8cbcc;margin:2px 0 9px}.browser-settings input{width:36px;color:#f1e8da;background:transparent;border:0;font:inherit;text-align:center;appearance:textfield}.browser-settings input::-webkit-inner-spin-button{appearance:none}.instrument-feedback{display:flex;justify-content:space-between;gap:20px;margin:0 10px;font:10px/1.4 Monoblock;color:#c5d8d7}.section{max-width:1200px;margin:auto;padding:94px 36px}.about{display:grid;grid-template-columns:1fr 1.08fr;gap:64px}.about-copy p{font-size:17px;max-width:43ch;margin-top:22px}.about h2 em{font-style:normal;color:var(--accent)}.text-link{font:13px Monoblock;display:inline-flex;align-items:center;gap:24px;margin-top:27px;border-bottom:1px solid #93ada9;padding-bottom:8px}.detail-image{position:relative;min-height:390px;overflow:hidden;background:#2b4f56}.detail-image img{position:absolute;height:145%;width:auto;max-width:none;top:-9%;left:-12%;transform:rotate(-10deg)}.detail-image:after{content:'';position:absolute;inset:0;background:linear-gradient(transparent 55%,#091e2be6)}.detail-image>span{position:absolute;bottom:23px;left:24px;right:15px;font:11px/1.5 Monoblock;z-index:1}.feature-strip{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:45px}.feature-strip>div{border-top:1px solid var(--line);padding-top:22px}.feature-strip h3{font-size:23px;color:#8bd8ef}.feature-strip p{font-size:15px;max-width:33ch;margin-top:13px}.listen{border-top:1px solid var(--line)}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:38px}.section-heading p{max-width:27ch}.media-grid{display:grid;grid-template-columns:1.25fr 1fr;gap:48px}.walkthrough{position:relative;aspect-ratio:1.4;overflow:hidden;background:#263e42}.walkthrough>img{position:absolute;height:110%;width:auto;left:0;top:-4%;opacity:.75;transform:rotate(-8deg)}.video-shade{position:absolute;inset:0;background:linear-gradient(0deg,#102832,transparent)}.video-copy{position:absolute;inset:auto 30px 28px}.video-icon{display:grid;place-items:center;width:46px;height:46px;border:1px solid #8bd8ef;border-radius:50%;margin-bottom:24px}.video-icon svg{fill:currentColor;stroke:none}.video-copy h3{font-size:36px}.video-copy p{font:12px Monoblock;margin-top:13px;color:#d5d8cd}.previews{padding:12px 0}.previews>h3{font-size:24px}.previews>p{font-size:14px;margin-top:12px}.preview-row{width:100%;display:grid;grid-template-columns:36px 1fr 45px;align-items:center;gap:14px;background:transparent;color:var(--fg);text-align:left;border:0;border-bottom:1px solid var(--line);padding:18px 0;font-size:16px}.preview-row:first-child{margin-top:18px}.preview-row>svg{width:32px;height:32px;padding:8px;border:1px solid #849b9b;border-radius:50%;fill:currentColor;stroke:none}.preview-row small{display:block;font:10px Monoblock;color:var(--muted);margin-top:5px}.preview-row>span:last-child{font:11px Monoblock;color:var(--accent)}.preview-row:hover,.preview-row[aria-pressed=true]{color:var(--accent)}.preview-note{display:block;font:11px/1.5 Monoblock;color:var(--muted);margin-top:18px}.download{max-width:none;text-align:center;background:linear-gradient(#183440dc,#183440e6),url('assets/instrument.webp') center 60%/cover;padding:70px 24px}.download-inner>img{width:62px;height:62px;object-fit:contain;margin-bottom:20px}.download h2{font-size:clamp(42px,5vw,70px)}.download p{margin-top:22px;color:#c7d6d6}.download .button{margin-top:28px}.download .release-note{font:11px/1.5 Monoblock;margin-top:18px}body>footer{max-width:1380px;margin:auto;padding:32px 40px;display:flex;align-items:center;justify-content:space-between;gap:24px;color:var(--muted);font:11px Monoblock}footer .wordmark{width:125px}.skip{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}.skip:focus{width:auto;height:auto;clip:auto;padding:10px;background:var(--fg);color:var(--bg);z-index:10}#walkthrough iframe{position:absolute;width:100%;height:100%;border:0}
@media(max-width:700px){.header{padding:18px 20px}.header nav>a:not(.nav-download){display:none}.header .wordmark{width:112px}.brand-symbol{width:28px;height:28px}.nav-download{font-size:10px}.hero{padding:20px 12px 40px}.hero h1{font-size:44px}.hero-heading p{font-size:15px;max-width:260px;margin:12px auto 0}.hero-heading{margin-bottom:24px}.instrument-stage{min-width:0;width:100%}.hero-toolbar{grid-template-columns:1fr auto;gap:7px;margin:0 0 14px}.hero-toolbar .button{padding:11px 13px;gap:10px;font-size:11px}.hero-toolbar .button svg{width:17px}.play-button{padding:0 10px;font-size:11px}.transport-shuffle{padding:0 8px}.toolbar-volume{display:none}.native-instrument{filter:drop-shadow(0 14px 15px #0007)}.instrument-feedback{font-size:9px;flex-direction:column;gap:6px;align-items:center;text-align:center;margin-top:12px}.browser-settings{margin-top:12px;font-size:10px}.native-sprite:focus-visible{outline-width:1px;outline-offset:1px}.section{padding:55px 24px}.about{display:flex;flex-direction:column;gap:32px}.detail-image{min-height:280px}.feature-strip{grid-template-columns:1fr;gap:25px}.feature-strip p{max-width:40ch}.section-heading{display:block}.section-heading p{margin-top:17px;max-width:32ch}.media-grid{grid-template-columns:1fr;gap:28px}.video-copy h3{font-size:32px}.download h2{font-size:45px}body>footer{padding:28px 24px;flex-wrap:wrap;gap:15px}body>footer>span:nth-child(2){display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

.hero h1{font-weight:600}.hero h1 span{color:var(--accent)}.hero-benefits{display:flex;justify-content:center;gap:22px;list-style:none;padding:0;margin:14px 0 0;font:10px Monoblock;color:#cfdddc}.hero-benefits li:before{content:"+";color:var(--accent);margin-right:7px}.hero-heading{margin-bottom:16px}@media(max-width:700px){.hero-benefits{gap:10px;font-size:8px}.hero h1{font-size:42px}}

.instrument:not(.native-instrument){height:0;padding-top:71.05%;overflow:hidden;visibility:hidden}.native-instrument input[type=range]{border:0}.native-instrument #preset{font-size:1cqw}

.hero-benefits,.instrument-feedback,.browser-settings,.nav-download,.preview-row small{font-size:11px}.zoom-instrument{display:none}.instrument-viewport{width:100%}@media(max-width:700px){.hero-benefits{flex-wrap:wrap;gap:8px 14px}.instrument-viewport{overflow-x:auto;scrollbar-color:#a4b9b5 #192e34}.instrument-viewport.is-zoomed .native-instrument{width:860px}.zoom-instrument{display:block;margin:12px auto;padding:10px 16px;color:#8bd8ef;background:#203b44;border:1px solid #758d91;border-radius:4px;font:11px Monoblock}.instrument-feedback{line-height:1.6}}
@media(max-width:700px){.hero-toolbar{grid-template-columns:1fr auto 1fr}.hero-toolbar .transport-shuffle{display:none}.hero-toolbar .toolbar-volume{display:block}.hero-toolbar .play-button{padding:0 10px;gap:5px}}

/* User-directed dark native skin, seamless stage and stronger typography. */
@font-face{font-family:'SF Pro';src:local('SF Pro Display Heavy'),local('SFProDisplay-Heavy');font-weight:900}
:root{--bg:#080b0a;--muted:#b9c3bf;--line:#71817a40}
body{font-family:Monoblock,monospace}h1,h2,h3{font-family:var(--font);font-weight:800}.hero h1{font-weight:900;letter-spacing:-.04em}
.hero,.download{background:var(--bg)}.hero:before,.hero:after{content:none}.hero{padding-top:6px;padding-bottom:54px}.hero-heading{margin-bottom:28px}.hero-heading p{font-size:14px}
.hero-toolbar{margin:0 10px 28px;gap:24px}.hero-toolbar .primary{min-height:52px;padding:16px 34px;gap:28px}.instrument-stage{width:min(100%,calc((100svh - 360px)*1.4074),920px)}
.native-instrument{filter:none;background:var(--bg)}.native-plate{mask-image:linear-gradient(to bottom,transparent,#000 2%,#000 98%,transparent)}
.native-text,.native-value,.native-sprite[data-speed]{font-family:Monoblock,monospace;color:#e5e9e2}.native-wave{background:#101716}.native-sprite[data-speed]{color:#e5e9e2}
.browser-settings,.instrument-feedback{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.about-copy p{font-size:15px}.feature-strip p{font-size:14px}.detail-image{background:#101716}.download{border-top:1px solid var(--line)}
@media(max-width:700px){.hero{padding-top:15px}.hero h1{font-size:44px}.hero-heading p{font-size:12px}.hero-heading{margin-bottom:28px}.hero-toolbar{gap:8px;margin:0 0 24px}.hero-toolbar .primary{padding:14px 15px;gap:12px;font-size:11px;min-height:48px}.instrument-stage{width:100%}.native-instrument{filter:none}.zoom-instrument{margin:0 0 0 auto;padding:0;width:36px;height:40px;font:22px Monoblock;background:transparent;border-color:#71817a80;color:#8bd8ef}.toolbar-volume{display:flex;justify-content:end}.hero{padding-bottom:40px}}

/* Native blue accents and the four-part pinned feature story. */
h2 em{font-style:normal;color:var(--accent)}.kit-auditions{padding-top:38px;padding-bottom:80px;border-bottom:1px solid var(--line)}.kit-auditions h2{font-size:clamp(32px,3.2vw,46px)}.kit-preview-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}.kit-preview{border:0;border-top:1px solid #617974;background:transparent;color:var(--fg);text-align:left;padding:22px 0 16px;min-width:0}.kit-name{font:14px Monoblock;display:block}.kit-wave{width:100%;height:55px;margin:20px 0;color:#7eb9ca;stroke-width:2;stroke-linecap:round}.kit-control{display:flex;align-items:center;gap:10px;font:12px Monoblock;color:var(--accent)}.kit-control>svg{width:30px;height:30px;border:1px solid #8bd8ef80;border-radius:50%;padding:7px;fill:currentColor;stroke:none}.kit-control small{margin-left:auto;color:var(--muted)}.kit-preview:hover .kit-wave,.kit-preview[aria-pressed=true] .kit-wave{color:var(--accent)}.kit-preview[aria-pressed=true]{border-color:var(--accent)}
.feature-story{max-width:1380px;margin:auto;display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:76px;padding:0 40px;position:relative}.story-visual{position:sticky;top:0;height:100svh;display:flex;flex-direction:column;justify-content:center;align-self:start;min-width:0}.story-pictures{position:relative;aspect-ratio:1.26;width:100%}.story-picture{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;opacity:0;visibility:hidden;transition:opacity .45s ease-out,visibility .45s}.story-picture.is-active{opacity:1;visibility:visible}.story-picture img{width:100%;height:auto;display:block}.story-picture figcaption{margin-top:24px;font:11px Monoblock;color:#a6bfbe;text-align:center}.story-progress{display:flex;gap:8px;justify-content:center;margin-top:30px}.story-progress i{width:28px;height:2px;background:#3a4e4d}.story-progress i.is-active{background:var(--accent)}.story-step{min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:90px 0}.story-step h2{font-size:clamp(38px,3.8vw,56px);text-wrap:balance}.story-step p{font-size:14px;line-height:1.85;margin-top:24px;max-width:43ch}.story-step .text-link{align-self:start}.feature-tags{list-style:none;display:flex;gap:10px 20px;flex-wrap:wrap;padding:0;margin-top:26px;font:11px Monoblock;color:var(--accent)}.skin-picker{display:flex;gap:12px;margin-top:30px}.skin-picker button{padding:12px 16px;background:transparent;border:1px solid #54716f;color:var(--fg);font:12px Monoblock}.skin-picker button[aria-pressed=true]{border-color:var(--accent);color:var(--accent);background:#14272c}.mobile-story-image{display:none}.recordings{display:grid;grid-template-columns:1fr 1fr;gap:80px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding-top:110px;padding-bottom:110px}.recordings h2{font-size:clamp(40px,4vw,58px)}.recordings-copy p{font-size:15px;line-height:1.9}.recordings-copy p+p{margin-top:22px}.source-packs{display:flex;flex-wrap:wrap;gap:14px 24px;border-top:1px solid var(--line);margin-top:30px;padding-top:24px;color:var(--accent);font:11px Monoblock}.walkthrough-section .walkthrough{aspect-ratio:2.05;max-width:950px;margin:auto}.walkthrough-section .walkthrough>img{width:100%;height:auto;left:0;top:-14%;transform:none}.video-shade{background:linear-gradient(0deg,#080b0afa,transparent)}
@media(max-width:800px){.kit-preview-grid{grid-template-columns:repeat(2,1fr);gap:16px 24px}.kit-auditions{padding-top:12px;padding-bottom:48px}.kit-auditions .section-heading{display:block}.kit-auditions .section-heading p{margin-top:20px;font-size:13px}.feature-story{display:block;padding:0 24px}.story-visual{display:none}.story-step{min-height:0;padding:55px 0;border-bottom:1px solid var(--line)}.mobile-story-image{display:block;width:100%;height:auto;margin-bottom:34px}.story-step h2{font-size:39px}.story-step p{font-size:13px}.recordings{display:block;padding-top:65px;padding-bottom:65px}.recordings-copy{margin-top:32px}.recordings-copy p{font-size:13px}.walkthrough-section .walkthrough{aspect-ratio:1.3}.walkthrough-section .walkthrough>img{height:100%;width:auto;top:0;left:-8%}.kit-name{font-size:12px}.kit-wave{margin:14px 0}.kit-control{font-size:11px}}
@media(prefers-reduced-motion:reduce){.story-picture{transition:none}}
/* Synchronized preview playheads and feature demonstrations. */
.kit-intro{max-width:none!important;font-size:13px;line-height:1.8;flex-shrink:0}.kit-intro span{display:block}.kit-wave-wrap{position:relative;display:block;margin:20px 0;height:55px;overflow:hidden}.kit-wave-wrap .kit-wave{display:block;margin:0;height:100%}.preview-playhead{position:absolute;top:0;bottom:0;left:clamp(1px,var(--playhead,0%),calc(100% - 2px));width:2px;background:#fff;opacity:0;pointer-events:none}.kit-preview[aria-pressed=true] .preview-playhead{opacity:1}
.feature-demo{background:#111a1c;border:1px solid #3e5257;padding:30px;gap:26px}.feature-demo figcaption{margin-top:0;color:#abc0c5;font-size:10px}.feature-demo strong{font:700 23px var(--font);letter-spacing:-.025em;color:#f3eee3}.demo-heading{display:flex;align-items:center;gap:24px}.demo-heading span{display:block;font-size:12px;color:var(--muted);margin-top:8px}.demo-dice{flex:none;width:90px;height:90px;background:transparent url('assets/native/crt-dice-roll-blue.webp') center top/100% 6400%;border:0}.demo-lanes{display:grid;gap:18px}.visual-lane{display:grid;grid-template-columns:66px minmax(0,1fr) 57px;align-items:center;gap:12px;font:10px Monoblock}.visual-track{position:relative;height:66px;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(12.5% - 1px),#7899a326 calc(12.5% - 1px),#7899a326 12.5%),#080e10;border:1px solid #45606a}.visual-track canvas{position:absolute;top:6px;height:52px;background:#24414c80;border:1px solid #8bd8ef70;transition:left .5s ease-out,width .5s ease-out}.feature-demo button:not(.demo-dice){font:11px Monoblock;background:transparent;border:1px solid #59737b;color:#c7d9df;padding:10px 8px}.feature-demo button[aria-pressed=true]{color:#8bd8ef;border-color:#8bd8ef;background:#24434d}.effect-tabs{display:flex;gap:10px}.effect-tabs button{flex:1}.effect-canvas{display:block;width:100%;height:190px}.effect-adjust{display:grid;grid-template-columns:70px 1fr 40px;align-items:center;gap:22px;font:12px Monoblock}.effect-knob{width:70px;height:70px;background-image:url('assets/native/crt-knob-filter-cutoff-cap-blue.webp'),url('assets/native/crt-knob-filter-cutoff.webp');background-size:100% 100%,100% 6500%;background-repeat:no-repeat}.effect-adjust label span{display:block;margin-bottom:10px}.feature-demo input[type=range]{accent-color:#8bd8ef;width:100%;cursor:ew-resize}.clip-demo-heading{display:flex;flex-direction:column;gap:14px}.clip-demo-heading output{font:12px Monoblock;color:#8bd8ef}.clip-ruler{display:flex;justify-content:space-around;font:10px Monoblock;color:#99b1b8;margin-bottom:-18px}.clip-edit-track{height:130px;background:repeating-linear-gradient(90deg,transparent 0,transparent calc(12.5% - 1px),#7899a326 calc(12.5% - 1px),#7899a326 12.5%),#080e10;border:1px solid #45606a;padding:12px 0}.editable-clip{height:100%;position:relative;border:1px solid #8bd8ef;background:#24414c80;transition:width .7s ease-out}.editable-clip canvas{display:block;width:100%;height:100%}.editable-clip.is-muted{opacity:.4}.clip-handle{position:absolute;right:3px;top:35%;height:30%;width:3px;background:#fff}.clip-sliders{display:grid;grid-template-columns:1fr 1fr;gap:24px;font:11px Monoblock}.clip-sliders input{display:block;margin-top:10px}.clip-actions{display:flex;gap:10px}.clip-actions button{flex:1}.skin-group{justify-content:center}.skin-group img{position:absolute;width:73%;height:auto;box-shadow:0 18px 32px #0007}.skin-group img:nth-child(1){top:0;left:0;transform:rotate(-7deg)}.skin-group img:nth-child(2){top:20%;right:0;transform:rotate(6deg)}.skin-group img:nth-child(3){bottom:4%;left:7%;transform:rotate(-3deg)}.skin-group figcaption{position:absolute;bottom:-28px;left:0;right:0}.story-picture:not(.is-active){pointer-events:none}.story-picture.is-active{pointer-events:auto}
.recordings{max-width:none;background:#f5f4ef;color:#15262d;padding:100px max(36px,calc((100vw - 1128px)/2));gap:64px 80px;border:0}.recordings h2 em{color:#287b96}.recordings p{color:#354c54}.recordings .source-packs{color:#236b83;border-color:#98adb2}.studio-photos{grid-column:1/-1;display:grid;grid-template-columns:1.35fr 1fr;gap:28px;align-items:start}.studio-photos figure:nth-child(2){padding-top:80px}.studio-photos img{display:block;width:100%;height:350px;object-fit:cover}.studio-photos figure:nth-child(2) img{height:260px;object-position:center}.studio-photos figcaption{font:11px Monoblock;color:#354c54;margin-top:16px}
@media(max-width:1100px) and (min-width:801px){.feature-story{gap:34px;padding:0 24px;grid-template-columns:1.15fr 1fr}.feature-demo{padding:20px}.demo-heading{gap:10px}.feature-demo strong{font-size:20px}.visual-lane{grid-template-columns:52px minmax(0,1fr) 48px;gap:6px}}
@media(max-width:800px){.kit-intro{font-size:11px!important}.kit-intro span{white-space:nowrap}.story-step .story-picture{position:relative;inset:auto;opacity:1;visibility:visible;pointer-events:auto;flex-shrink:0;margin-bottom:34px}.feature-demo{padding:20px;gap:20px}.demo-heading{gap:12px}.feature-demo strong{font-size:20px}.demo-heading span{font-size:10px}.demo-dice{width:65px;height:65px}.visual-lane{grid-template-columns:51px minmax(0,1fr) 48px;gap:7px;font-size:9px}.visual-track{height:52px}.visual-track canvas{height:40px}.feature-demo button:not(.demo-dice){font-size:10px;padding:10px 6px}.feature-demo figcaption{font-size:9px;line-height:1.6}.effect-canvas{height:150px}.effect-adjust{grid-template-columns:50px 1fr 30px;gap:12px}.effect-knob{width:50px;height:50px}.skin-group{height:350px}.skin-group figcaption{bottom:0}.skin-group img:nth-child(3){bottom:10%}.recordings{padding:65px 24px}.studio-photos{margin-top:36px;display:block}.studio-photos figure:nth-child(2){padding-top:30px}.studio-photos img,.studio-photos figure:nth-child(2) img{height:auto}.kit-wave-wrap{margin:14px 0}}
@media(prefers-reduced-motion:reduce){.visual-track canvas,.editable-clip{transition:none}}
/* Blue audition band, native-interface demonstrations and compact hardware section. */
.kit-auditions{max-width:none;background:#8bd8ef;color:#13282f;padding:55px max(36px,calc((100vw - 1128px)/2)) 60px;border:0}.kit-auditions h2,.kit-auditions h2 em{color:#13282f}.kit-auditions p{color:#24434d}.kit-preview{color:#13282f;border-color:#39738b80}.kit-control,.kit-control small{color:#24434d}.kit-control>svg{border-color:#24434d90}.kit-wave,.kit-preview:hover .kit-wave,.kit-preview[aria-pressed=true] .kit-wave{color:#46575e}.kit-wave-wrap .kit-wave-played{position:absolute;inset:0;color:#0068bb!important;clip-path:inset(0 calc(100% - var(--playhead,0%)) 0 0)}.kit-preview[aria-pressed=true]{border-color:#0068bb}.kit-preview:focus-visible{outline-color:#005797}.kit-wave-wrap{height:58px}
.native-showcase{gap:0}.native-demo-mount{width:100%;aspect-ratio:1824/1296}.showcase-instrument{width:100%;pointer-events:none}.showcase-instrument button:disabled,.showcase-instrument select:disabled,.showcase-instrument input:disabled{opacity:1}.showcase-instrument .native-plate{mask-image:none}.native-showcase figcaption{line-height:1.6;font-size:11px;margin:22px 0 0;color:#adc9d0}.demo-pause{align-self:center;background:transparent;border:0;border-bottom:1px solid #5b7a83;color:#b4cbd2;font:10px Monoblock;padding:5px 0;margin-top:12px;cursor:pointer}.recordings{padding-top:70px;padding-bottom:70px;align-items:center;gap:60px}.recordings h2{font-size:clamp(38px,3.8vw,55px)}.synth-product-pair{display:block;width:100%;height:auto;margin-top:26px}.recordings-copy p{font-size:14px}.youtube-placeholder{display:grid;place-items:center;background:#101a1e!important;border:1px solid #3b555f;aspect-ratio:16/9!important}.youtube-placeholder .video-copy{position:static;text-align:center;padding:32px}.youtube-placeholder .video-icon{border:0;border-radius:0;width:72px;height:54px;margin:0 auto 24px}.youtube-placeholder .video-icon svg{width:64px;height:46px;fill:none;stroke:#8bd8ef}.youtube-placeholder .video-icon svg path{fill:#8bd8ef;stroke:none}.youtube-placeholder h3{font-size:30px}.youtube-placeholder p{font-size:12px}
@media(max-width:800px){.kit-auditions{padding:36px 24px 42px}.native-showcase{margin-top:0}.native-showcase figcaption{font-size:9px;margin-top:15px}.demo-pause{font-size:11px;padding:8px 0}.recordings{padding:50px 24px}.recordings-copy{margin-top:25px}.synth-product-pair{margin-top:20px}.recordings-copy p{font-size:13px}.youtube-placeholder h3{font-size:24px}.youtube-placeholder .video-copy{padding:22px}}

/* Close-up feature framing and aligned walkthrough copy. */
.native-demo-mount{position:relative;overflow:hidden;aspect-ratio:1824/1296;background:#101716;isolation:isolate}
.native-demo-mount .showcase-instrument{position:absolute;max-width:none;transition:width .65s ease,left .65s ease,top .65s ease;transform-origin:top left}
.native-showcase figcaption{font-size:16px;color:#8bd8ef;letter-spacing:.025em;margin-top:24px;min-height:26px}
.walkthrough-section .section-heading{max-width:950px;margin-left:auto;margin-right:auto}
.walkthrough-section .section-heading p{max-width:32ch;font-size:13px;line-height:1.8}
.plugin-formats{display:flex;justify-content:center;gap:17px;margin-top:18px;color:#c4ceca}
.format-icon{display:grid;place-items:center;min-width:39px;height:25px;border:1px solid #82968b;border-radius:3px;font:12px Monoblock,monospace;letter-spacing:.03em;padding:0 6px}
@media(max-width:800px){.native-showcase figcaption{font-size:12px}.walkthrough-section .section-heading p{margin-top:20px}.plugin-formats{margin-top:14px}}

@media(min-width:701px){.instrument-stage{width:min(100%,calc((100svh - 403px)*1.4074),920px)}}

/* Soft scene changes run on a fixed clock, independent of scrolling speed. */
.story-picture,.story-picture.skin-group{clip-path:none;overflow:visible;opacity:0;filter:blur(12px);transform:scale(.985);visibility:hidden;transition:opacity .65s ease,filter .65s ease,transform .65s ease,visibility 0s .65s}
.story-picture.is-active,.story-picture.skin-group.is-active{opacity:1;filter:blur(0);transform:scale(1);visibility:visible;transition-delay:0s}
.native-demo-mount[data-demo="2"] .showcase-instrument{transition:width .3s ease,left .3s ease,top .3s ease}
@media(max-width:800px){.story-step .story-picture,.story-step .skin-group{opacity:1;filter:none;transform:none;visibility:visible;transition:none}}
@media(prefers-reduced-motion:reduce){.story-picture,.story-picture.skin-group,.native-demo-mount .showcase-instrument{transition:none!important;filter:none;transform:none}}
/* Static grain sits in the background only, leaving artwork and type crisp. */
body,.hero,.download{background-color:var(--bg);background-image:url('assets/film-grain.svg');background-repeat:repeat;background-size:180px 180px}
.download{border-top:0}

/* Transport beneath the instrument, download above it. */
.hero-toolbar>.primary{grid-column:2;grid-row:1}.hero-toolbar>.toolbar-volume{grid-column:3;grid-row:1}
.plugin-bottom-bar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;margin-top:18px;padding:0 10px}
.plugin-bottom-bar .plugin-formats{margin:0;grid-column:2}.plugin-bottom-bar .play-controls{grid-column:1;grid-row:1}
@media(min-width:701px){.instrument-stage{width:min(100%,calc((100svh - 420px)*1.4074),920px)}}
@media(max-width:700px){.plugin-bottom-bar{padding:0;grid-template-columns:1fr auto;gap:10px}.plugin-bottom-bar .play-button{font-size:11px;padding:0 10px}.plugin-bottom-bar .transport-shuffle{display:flex;padding:0 9px}.plugin-bottom-bar .plugin-formats{gap:8px}}

/* Feather only the three cropped demos into the textured page background. */
.native-showcase .native-demo-mount{
 -webkit-mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent),linear-gradient(to bottom,transparent,#000 11%,#000 89%,transparent);
 mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent),linear-gradient(to bottom,transparent,#000 11%,#000 89%,transparent);
 -webkit-mask-composite:source-in;
 mask-composite:intersect;
 -webkit-mask-repeat:no-repeat;
 mask-repeat:no-repeat;
}

/* Final native library counts, October 4. */
.kit-auditions .kit-intro{flex-shrink:1}.kit-title{display:flex;align-items:baseline;justify-content:space-between;gap:8px;flex-wrap:wrap}.kit-total{font:11px Monoblock,monospace;color:#24434d;white-space:nowrap}@media(max-width:800px){.kit-auditions .kit-intro span{white-space:normal}.kit-title{gap:6px}.kit-total{font-size:10px}}

/* Simplified kit banner: static background grain and white secondary title. */
.kit-auditions{background-image:url('assets/film-grain.svg');background-repeat:repeat;background-size:180px 180px}.kit-auditions h2 em{color:#fff}

/* Original Night Garden scene, rendered without the central instrument. */
.hero-backdrop{position:absolute;inset:0;z-index:-2;display:block;pointer-events:none}
.hero-backdrop img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 55%}
.hero:after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,#080b0abf 0%,#080b0a26 24%,#080b0a0d 65%,#080b0ab3 100%)}
.hero-heading{text-shadow:0 2px 18px #0009}
@media(max-width:700px){.hero-backdrop img{object-position:center}.hero:after{background:linear-gradient(180deg,#080b0abf,#080b0a40 35%,#080b0a40 70%,#080b0ab3)}}

/* Click-to-open download form. Native dialog handles focus and Escape. */
html{scrollbar-gutter:stable}
.nav-download{border:0;padding:0;background:transparent;font:inherit}
.button[data-download-trigger],.download-dialog-submit{border:0}
.download-dialog{margin:auto;width:min(500px,calc(100% - 32px));max-height:calc(100svh - 32px);padding:0;border:1px solid #8bd8ef40;border-radius:12px;background:#101614 url('assets/film-grain.svg') repeat;color:var(--fg);box-shadow:0 28px 100px #0009;overflow:auto;overscroll-behavior:contain}
.download-dialog::backdrop{background:#030605c9;backdrop-filter:blur(8px)}
.download-dialog[open]{animation:download-popup-in .22s ease-out}
.download-dialog-panel{position:relative;padding:34px 36px 30px}
.download-dialog-close{position:absolute;right:12px;top:12px;display:grid;place-items:center;width:44px;height:44px;padding:0;border:0;background:transparent;border-radius:4px;color:var(--muted)}
.download-dialog-close:hover{background:#8bd8ef14;color:var(--accent)}
.download-dialog-logo{display:block;object-fit:contain;margin-bottom:22px}
.download-dialog-eyebrow{font:10px/1.5 Monoblock,monospace;letter-spacing:.045em;color:var(--accent);margin-bottom:10px}
.download-dialog h2{font:900 clamp(32px,5vw,42px)/1.06 var(--font);letter-spacing:-.035em;margin-bottom:12px}
#download-dialog-description{font:12px/1.65 Monoblock,monospace;margin-bottom:26px}
#download-form{display:flex;flex-direction:column}
#download-form label{font:12px/1.5 Monoblock,monospace;margin-bottom:7px;color:var(--fg)}
#download-form label span{color:var(--muted);font-size:11px}
#download-form input{width:100%;min-height:48px;border:1px solid #71817a66;border-radius:4px;background:#080b0a;color:var(--fg);padding:11px 13px;font:16px/1.4 Monoblock,monospace;margin-bottom:18px}
#download-form input:focus-visible{outline-offset:2px;border-color:var(--accent)}
.download-dialog-submit{width:100%;margin-top:6px;min-height:52px;font:13px Monoblock,monospace}
.download-dialog-status{font:11px/1.65 Monoblock,monospace;color:var(--muted);margin-top:16px}
@keyframes download-popup-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:600px){.download-dialog-panel{padding:28px 24px 24px}.download-dialog-logo{margin-bottom:18px}.download-dialog-eyebrow{font-size:9px}#download-dialog-description{margin-bottom:22px}}
@media(prefers-reduced-motion:reduce){.download-dialog[open]{animation:none}}

/* Compact, centred mobile presentation. */
@media(max-width:700px){
 .header{justify-content:center;padding:16px 20px 12px}
 .header .wordmark,.header nav{display:none}
 .header .brand{justify-content:center}
 .header .brand-symbol{width:34px;height:34px}
 .hero-heading p{max-width:none;font-size:clamp(9px,2.6vw,11px);white-space:nowrap;line-height:1.5;margin-top:10px}
 .hero-benefits{flex-wrap:nowrap;gap:8px;font-size:clamp(7px,1.9vw,8px);white-space:nowrap;margin-top:12px}
 .hero-benefits li:before{margin-right:4px}
 .hero-toolbar{grid-template-columns:1fr;justify-items:center;margin-bottom:26px}
 .hero-toolbar>.primary{grid-column:1;min-width:190px;min-height:50px;padding:15px 24px;font-size:12px;background:#9cdef1;box-shadow:0 0 0 1px #c2efff45,0 0 20px #8bd8ef38,0 8px 32px #8bd8ef20}
 .hero-toolbar>.primary:hover{background:#b9eaff;box-shadow:0 0 0 1px #c2efff60,0 0 26px #8bd8ef55,0 8px 32px #8bd8ef30}
 .hero-toolbar>.toolbar-volume,.zoom-instrument{display:none}
 .section,.feature-story,body>footer{text-align:center}
 .section-heading p,.story-step p{margin-left:auto;margin-right:auto}
 .story-step{align-items:center}
 .story-step>.story-picture{width:100%;align-self:stretch}
 .story-step .text-link{align-self:center;font-size:12px}
 .story-step p,.recordings-copy p{font-size:12px}
 .feature-tags,.source-packs{justify-content:center;font-size:10px}
 .walkthrough-section .section-heading p{font-size:12px}
 .native-showcase figcaption{font-size:11px}
 .demo-pause{font-size:10px}
 .kit-auditions .kit-intro{font-size:10px!important}
 .kit-title{justify-content:center}
 .kit-name{font-size:11px}
 .kit-total{font-size:9px}
 .kit-control{font-size:10px}
 .youtube-placeholder p{font-size:11px}
 .download-inner>img{display:none}
 .download{padding-top:34px;padding-bottom:42px}
 .download p{font-size:15px}
 .download .release-note{font-size:10px}
 body>footer{justify-content:center;font-size:10px}
}

/* Keep a keyboard-accessible pause action without a visible demo caption. */
.demo-pause{position:absolute;width:1px;height:1px;min-height:0;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}
.demo-pause:focus-visible{position:relative;width:auto;height:auto;padding:6px 10px;margin:12px auto 0;overflow:visible;clip:auto;clip-path:none;outline:2px solid var(--accent);outline-offset:3px}
@media(max-width:700px){
 .transport-shuffle{display:none!important}
 #instrument.is-mobile-demo button:disabled,#instrument.is-mobile-demo select:disabled,#instrument.is-mobile-demo input:disabled{opacity:1;cursor:default}
 #instrument.is-mobile-demo #dice:disabled{opacity:.55}
 .kit-auditions h2{font-size:clamp(21px,6.5vw,28px);white-space:nowrap;text-wrap:nowrap}
 .story-step h2{font-size:clamp(24px,7.4vw,32px);white-space:nowrap;text-wrap:nowrap}
 .story-step{padding:38px 0}
 .story-step>.story-picture{margin-bottom:24px}
 .story-step p{margin-top:18px;line-height:1.8}
 .story-step .text-link{margin-top:22px}
 .feature-tags{margin-top:22px}
 .native-showcase figcaption{margin-top:16px;min-height:18px}
}

/* The playable demo explains its dice control beside the actual action. */
.plugin-bottom-bar{display:flex;justify-content:center;align-items:center;gap:14px;padding:0;margin-top:22px}
.plugin-bottom-bar .play-controls{display:flex;align-items:center;gap:8px;flex-shrink:0}
.plugin-bottom-bar #shuffle{display:none!important}
.plugin-bottom-bar .reroll-control{display:flex!important;min-width:44px;min-height:44px;justify-content:center;padding:0}
.plugin-bottom-bar .play-button{min-height:44px}
.reroll-hint{display:flex;align-items:center;gap:8px;margin:0;color:#e5f4f7;font:12px/1.6 Monoblock,monospace;text-align:left}
.reroll-hint svg{width:34px;height:28px;fill:none;stroke:#9cdef1;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
@media(max-width:700px){.plugin-bottom-bar{gap:10px;margin-top:20px}.reroll-hint{font-size:11px;gap:6px}.reroll-hint svg{width:26px}.plugin-bottom-bar .play-controls{gap:7px}.plugin-bottom-bar .play-button{padding:0 10px}}
@media(max-width:350px){.reroll-hint{font-size:10px}.reroll-hint svg{width:22px}.plugin-bottom-bar{gap:7px}}

.hero-formats{position:absolute;top:16px;right:28px;z-index:2;display:flex;align-items:center;gap:8px;color:#e5f4f7}
.hero-formats .format-icon{font-size:10px;min-width:35px;height:23px;padding:0 6px;border-color:#81979b;background:#0a141c38}
@media(max-width:700px){.hero-formats{top:9px;right:16px;gap:6px}.hero-formats .format-icon{font-size:9px;min-width:31px;height:21px}.hero{padding-top:43px}}

.walkthrough-section .walkthrough-video{aspect-ratio:16/9;background:#0b1216;overflow:hidden}
.walkthrough-video iframe{display:block;width:100%;height:100%;border:0}
.walkthrough-fallback{max-width:950px;margin:auto}.walkthrough-fallback .text-link{margin-top:16px}
