@font-face{font-family:Standard;src:url('fonts/standard-book.woff2') format('woff2');font-style:normal;font-weight:400 600;font-display:swap}
@font-face{font-family:Standard;src:url('fonts/standard-bold.woff2') format('woff2');font-style:normal;font-weight:700 900;font-display:swap}
:root{--sans:Standard,'Akzidenz-Grotesk',Helvetica,Arial,sans-serif;--ink:#303330;--muted:#7a7a7a;--line:#acacac;--orange:#f17b24;--noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.94' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath filter='url(%23n)' opacity='.24' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
*{box-sizing:border-box}html{background:#d3d6d0}body{margin:0;color:var(--ink);font:13px var(--sans);-webkit-font-smoothing:antialiased}button,input{font:inherit;color:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{opacity:.32;cursor:default}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid #ec7825;outline-offset:5px}button:active{outline-offset:3px}a{color:inherit;text-decoration:none}main{width:100%;min-height:100dvh;margin:0;padding:0}.machine{position:relative;isolation:isolate;min-height:100dvh;padding:clamp(26px,3.5vw,54px) clamp(26px,5vw,90px) 0;background:linear-gradient(115deg,#eeeee9 0%,#dbdbdb 40%,#e8e9e3 72%,#cbcbcb 100%);box-shadow:inset 0 3px 1px #ffffffcf,inset 0 10px 12px -12px #252525,inset 2px 0 1px #fff,inset -2px 0 1px #8f8f8f;overflow:hidden}.machine:before{content:'';position:absolute;inset:0;background:var(--noise);opacity:.28;mix-blend-mode:multiply;pointer-events:none;z-index:-1}.machine:after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:repeating-linear-gradient(0deg,#fff0 0px,#fff0 2px,#ffffff10 3px,#fff0 4px)}
.machine-top{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(35px,7vw,130px);align-items:center;padding-bottom:28px;border-bottom:1px solid #a1a1a1;box-shadow:0 1px 0 #ffffffa6}.identity{max-width:390px;padding:1px 0}.model{display:flex;align-items:center;gap:14px}h1{font-size:clamp(25px,2.7vw,38px);line-height:1;letter-spacing:-1px;font-weight:400;margin:0;text-shadow:0 1px 0 #fff}.model-dot{width:7px;height:7px;background:#e36e1d;border-radius:50%;margin-top:6px;box-shadow:inset 0 1px 1px #9a3f0c50,0 1px 0 #fff}.identity>p{font-size:11px;margin:8px 0 19px;color:#6b6b6b}.vents{height:45px;width:100%;max-width:275px;background:radial-gradient(ellipse at 50% 37%,#383838 0 1.05px,#7b7b7b 1.2px 1.7px,#cbcbcb 1.9px 2.6px,#f4f4f4 2.8px 3px,transparent 3.2px);background-size:7px 7px;mask-image:linear-gradient(90deg,#000 90%,transparent)}.identity-meta{display:flex;gap:22px;align-items:center;font-size:9px;color:#858585;margin-top:14px}.identity-meta a{color:#505050}.identity-meta .text-button{font-size:9px;color:#6c6c6c;margin-left:auto;text-decoration:none;border-bottom:1px solid #a1a1a1;padding-bottom:2px}.text-button{font-size:10px;background:none;border:0;padding:0;white-space:nowrap;line-height:1.3}.text-button:hover{color:#a64f14}.text-button>span:not(.switch){margin-left:6px}.display-panel{position:relative}.display-label{display:flex;align-items:center;justify-content:space-between;font-size:9px;color:#6a6a6a;margin:0 1px 9px}.display-label button{font-size:8px;letter-spacing:.3px;display:flex;align-items:center;gap:6px;background:none;border:0;padding:0}.display-label i{width:5px;height:5px;border-radius:50%;background:#6c6c6c;box-shadow:inset 0 1px 2px #292929,0 1px 0 #fff7}.display-label .enabled i{background:#e2e2e2;box-shadow:0 0 5px #e1e1e1,inset 0 0 2px #7b7b7b}.lcd{position:relative;isolation:isolate;background:linear-gradient(155deg,#292e29,#151515 60%,#232323);border:1px solid #161616;border-radius:7px;color:#d3d3d3;padding:17px 23px 13px;box-shadow:0 0 0 2px #818181,0 0 0 3px #e3e3e3,0 4px 3px #fff7,inset 0 4px 9px #000,inset 0 -1px 1px #a5a5a530;overflow:hidden;text-shadow:0 0 5px #dfdfdf3b;font-weight:400}.lcd:before{content:'';position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(140deg,#e5e5e510 0%,#fff1 23%,transparent 23.3%,transparent 69%,#ffffff03 70%);opacity:.6}.lcd:after{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;border-radius:6px;box-shadow:inset 1px 1px 0 #ffffff24,inset -1px -1px 0 #cdcdcd18;background:repeating-linear-gradient(0deg,transparent 0px,transparent 2px,#00000012 3px)}.lcd-top,.lcd-bottom{display:flex;justify-content:space-between;gap:10px;font-size:9px;letter-spacing:1.1px;color:#bdbdbd}.lcd-top{border-bottom:1px solid #b3b3b330;padding-bottom:10px}.lcd-main{display:flex;justify-content:space-between;align-items:flex-end;padding-top:12px}.lcd-caption{display:block;font-size:8px;letter-spacing:1.5px;color:#9a9a9a;margin-bottom:4px}.lcd-main strong{display:block;font-size:clamp(32px,4.7vw,61px);letter-spacing:-1px;font-weight:400;line-height:.95;font-variant-numeric:tabular-nums}.lcd-main strong span{font-size:.6em;opacity:.6}.position{text-align:right}.lcd-main .position strong{font-size:clamp(26px,3.3vw,42px);letter-spacing:1px;color:#bababa}.lcd-bottom{font-size:8px;letter-spacing:.5px}#wave{display:block;width:100%;height:26px;margin:8px 0;filter:brightness(1.7) saturate(.4);opacity:.8}
.machine-body{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:clamp(32px,5.5vw,100px);padding:26px 0 24px}.machine-body>section{min-width:0}.section-label{display:flex;justify-content:space-between;align-items:center;font-size:9px;line-height:1.3;color:#909090}.section-label b{font-size:10px;font-weight:400;color:#5f5f5f;margin-left:7px}.pads{position:relative;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(9px,1.1vw,19px);padding:clamp(11px,1.2vw,21px);margin-top:13px;border:1px solid #9a9a9a;border-radius:5px;background:linear-gradient(145deg,#b5b5b5,#c8c8c8);box-shadow:inset 0 3px 7px #43434350,inset 0 1px 1px #35353590,0 1px 0 #ffffffe0;isolation:isolate}.pads:before{content:'';position:absolute;inset:0;background:var(--noise);opacity:.22;z-index:-1}.pad{position:relative;min-width:0;aspect-ratio:1.34;border:1px solid #363636;border-radius:5px;padding:clamp(10px,1.3vw,20px);display:flex;flex-direction:column;justify-content:space-between;text-align:left;color:#b4b4b4;background:linear-gradient(155deg,#575757 0%,#474747 42%,#414141);box-shadow:0 1px 0 1px #303030,0 3px 0 #313131,0 5px 0 #4e4e4e,0 7px 4px #30303085,0 9px 8px #47474745,inset 0 2px 1px #a5a5a559,inset 2px 0 2px #7b7b7b70,inset -2px -2px 2px #29292990;transform:translateY(-2px);transition:transform 65ms,box-shadow 65ms,background 65ms;user-select:none;touch-action:none;isolation:isolate;overflow:hidden}.pad:after{content:'';position:absolute;inset:3px;border-radius:3px;background:var(--noise);opacity:.19;mix-blend-mode:soft-light;z-index:-1;box-shadow:inset 0 0 0 1px #c1c1c109}.pad-number{font-size:13px;font-weight:400;color:#c7c7c7;opacity:.65;text-shadow:0 -1px 1px #2c2c2c}.pad-key{position:absolute;right:clamp(10px,1.3vw,20px);top:clamp(11px,1.3vw,20px);font-size:9px;opacity:.3}.pad-name{font-size:clamp(9px,.9vw,12px);font-weight:400;color:#cbcbcb;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-shadow:0 -1px 1px #2c2c2c}.pad.selected{border-color:#8d8d8d;box-shadow:0 1px 0 1px #8e8e8e,0 3px 0 #313131,0 5px 0 #4e4e4e,0 7px 4px #30303085,0 9px 8px #47474745,inset 0 2px 1px #b8b8b855,inset 2px 0 2px #7b7b7b70,inset -2px -2px 2px #29292990}.pad:before{content:'';position:absolute;left:50%;top:8px;width:12px;height:2px;background:#1b1b1b;border-radius:1px;box-shadow:0 1px 0 #8c8c8c30;transform:translateX(-50%)}.pad.hit,.pad:active{transform:translateY(3px);background:linear-gradient(145deg,#5f5f5f,#434343);box-shadow:0 0 0 1px #313131,0 1px 1px #2d2d2d,inset 0 1px 5px #16161690,inset 0 -1px 1px #a6a6a640}.pad.hit:before{background:#efb74f;box-shadow:0 0 9px 2px #f2b74569}.pad.drag-over{outline:2px solid #ed842f;outline-offset:4px}.pad-foot{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:16px;font-size:9px;color:#858585}.pad-foot>span{display:flex;align-items:center;gap:6px}.tiny-dot{display:inline-block;flex:none;width:4px;height:4px;border-radius:50%;background:#878787;box-shadow:inset 0 1px 1px #25252550}.pad-foot .text-button{font-size:9px;display:flex;align-items:center;gap:8px}.switch{height:10px;width:19px;border:1px solid #7a7a7a;background:#767676;display:inline-block;box-shadow:inset 0 1px 2px #474747,0 1px 0 #fff8;border-radius:1px;padding:1px}.switch:before{content:'';display:block;width:7px;height:6px;background:linear-gradient(#efefef,#adadad);box-shadow:0 1px 1px #38383890}.switch.on:before{margin-left:8px}.controls{position:relative}.sound-heading{display:flex;justify-content:space-between;align-items:center;margin:14px 0 25px;gap:10px}h2{font-size:23px;font-weight:400;letter-spacing:-.3px;margin:0}.sound-heading .text-button{font-size:10px;color:#707070}.sound-controls{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;padding:5px 4px 21px;border-bottom:1px solid #aaaaaa;box-shadow:0 1px 0 #fff9}.dial-control{display:flex;flex:1;min-width:0;flex-direction:column;align-items:center;position:relative;cursor:ns-resize;touch-action:none;user-select:none}.dial{position:relative;display:block;width:clamp(53px,6.6vw,92px);height:clamp(53px,6.6vw,92px);margin-bottom:19px;border-radius:50%;border:1px solid #a1a1a1;background:radial-gradient(ellipse at 36% 25%,#f4f4f4 0%,#e8e8e8 30%,#cccccc 72%,#aaaaaa 100%);box-shadow:0 1px 0 1px #ededed,1px 2px 0 1px #939393,2px 4px 0 #878787,2px 6px 4px #60606070,3px 10px 12px #5b5b5b40,inset 0 1px 2px #fff,inset 2px 0 3px #fff9,inset -2px -2px 3px #8d8d8d80;isolation:isolate}.dial:before{content:'';position:absolute;inset:-10px;border-radius:50%;background:repeating-conic-gradient(from 225deg,#848484 0deg 1deg,transparent 1deg 15deg);mask:radial-gradient(transparent 67%,#000 68%,#000 71%,transparent 72%),conic-gradient(from 225deg,#000 0deg 270deg,transparent 270deg 360deg);mask-composite:intersect;opacity:.8;z-index:-1}.dial:after{content:'';position:absolute;inset:3px;border-radius:50%;background:var(--noise);opacity:.2;mix-blend-mode:multiply;pointer-events:none}.dial i{position:absolute;left:calc(50% - 1.4px);top:10%;height:19%;width:2.8px;border-radius:1px;background:#545454;box-shadow:0 1px 0 #fcfcfc;transform-origin:50% calc(clamp(53px,6.6vw,92px) * .4);transform:rotate(var(--angle,0deg))}.dial-name{font-size:10px;display:flex;justify-content:space-between;gap:8px;white-space:nowrap;width:100%;max-width:102px;color:#5a5a5a}.dial-name output{font-size:9px;color:#8d8d8d}.dial-control input{position:absolute;inset:-6px 0 20px;opacity:0;width:100%;height:calc(100% - 14px);cursor:ns-resize;touch-action:none}.dial-control:focus-within .dial{outline:1px solid #d5762b;outline-offset:11px}.timing{display:grid;grid-template-columns:1fr 1.15fr;gap:28px;padding:22px 0 0}.timing label{display:flex;align-items:center;justify-content:space-between;font-size:11px;gap:10px;position:relative}.timing label+label{padding-bottom:14px}.timing label>span{font-size:12px;white-space:nowrap}.timing input[type=number]{appearance:textfield;border:0;border-bottom:1px solid #afafaf;background:#dadada90;box-shadow:inset 0 1px 3px #6c6c6c1c;width:42px;text-align:center;font-size:18px;padding:2px;color:#474747;border-radius:1px}.timing input::-webkit-inner-spin-button{appearance:none}.timing small{font-size:8px;color:#929292;margin-left:6px}.timing input[type=range]{position:absolute;bottom:0;left:0;width:100%}input[type=range]{accent-color:#858585;cursor:pointer}input[type=range]:not(.dial-control input){appearance:none;background:transparent;height:14px;margin:0}input[type=range]::-webkit-slider-runnable-track{height:3px;background:#5d5d5d;box-shadow:0 1px 0 #fff9,inset 0 1px 2px #222222;border-radius:1px}input[type=range]::-webkit-slider-thumb{appearance:none;width:9px;height:15px;margin-top:-6px;border:1px solid #888888;border-radius:1px;background:linear-gradient(90deg,#cecece,#f5f5f5 40%,#b8b8b8 70%,#dcdcdc);box-shadow:1px 2px 2px #41414170}input[type=range]::-moz-range-track{height:3px;background:#5d5d5d}input[type=range]::-moz-range-thumb{width:9px;height:15px;background:#d8d8d8;border:1px solid #888888;border-radius:1px}.pattern-row{display:flex;align-items:center;gap:17px;padding:24px 0 22px}.pattern-row>span{font-size:10px;color:#838383}.patterns{display:flex;gap:7px}.patterns button{position:relative;width:28px;height:26px;font-size:10px;background:linear-gradient(140deg,#f2f2f2,#cacaca);border:1px solid #a8a8a8;border-radius:2px;box-shadow:0 2px 0 #828282,0 3px 3px #5d5d5d50,inset 0 1px 0 #fff}.patterns button.active{background:linear-gradient(#797979,#5b5b5b);border-color:#5b5b5b;color:#eeeeee;box-shadow:0 1px 0 #b0b0b0,inset 0 2px 3px #2f2f2f80;transform:translateY(2px)}.small-button{margin-left:auto;font-size:10px;color:#7d7d7d;background:linear-gradient(#eaeaea,#d1d1d1);border:1px solid #b2b2b2;border-radius:2px;padding:5px 8px;box-shadow:0 2px 0 #979797,inset 0 1px 0 #fbfbfb}.small-button:active{transform:translateY(2px);box-shadow:inset 0 1px 2px #909090}
.transport{display:grid;grid-template-columns:1fr 1fr 1fr;gap:10px;padding:9px;background:#a5a5a5;border:1px solid #979797;box-shadow:inset 0 2px 4px #4e4e4e50,0 1px 0 #fdfdfd;border-radius:3px}.transport-button{position:relative;isolation:isolate;height:clamp(70px,7.4vw,102px);border:1px solid #b1b1b1;border-radius:1px;background:linear-gradient(140deg,#f2f2f2,#d3d3d3 80%,#c2c2c2);box-shadow:0 3px 0 #838383,0 4px 3px #46464660,inset 1px 1px 1px #fcfcfc;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;font-size:10px;padding:0 0 10px;gap:0}.transport-button:before{content:'';position:absolute;top:11%;left:50%;width:clamp(38px,4.3vw,62px);aspect-ratio:1;border-radius:50%;transform:translateX(-50%);background:radial-gradient(ellipse at 55% 72%,#f2f2f2,#d4d4d4 70%);box-shadow:inset 0 2px 5px #7d7d7d3b,0 1px 1px #fff8;z-index:-1}.transport-button i{position:absolute;top:35%;left:50%;transform:translate(-50%,-50%);width:10px;height:10px;background:#757575;box-shadow:0 1px 0 #fff8}.transport-button:active{transform:translateY(3px);box-shadow:inset 0 1px 4px #949494;filter:brightness(.98)}.rec i{border-radius:50%;background:#be6840;width:11px;height:11px}.rec.armed:before{box-shadow:inset 0 1px 6px #bb653870,0 0 5px #e1774470}.rec.armed i{background:#d45920;box-shadow:0 0 8px #db733b;animation:blink 1s infinite}.play:before{background:radial-gradient(ellipse at 32% 23%,#ff9a40,#ef7a21 50%,#ca5811);box-shadow:0 1px 0 #ffa65e,inset 0 1px 2px #ffc377,inset 0 -2px 3px #9d3b0b69}.play i{width:0;height:0;background:none;box-shadow:none;border-top:6px solid transparent;border-bottom:6px solid transparent;border-left:8px solid #6b350e;margin-left:2px}.play.playing:before{background:radial-gradient(ellipse at 40% 25%,#a1a1a1,#757575);box-shadow:0 0 7px #858585,inset 0 1px 2px #dedede}.play.playing i{border-left-color:#dadada}.transport-note{font-size:9px;color:#898989;display:flex;justify-content:space-between;margin-top:12px}.transport-note>span+span{font-variant-numeric:tabular-nums}
.sequencer{padding:19px 0 14px;border-top:1px solid #b0b0b0;box-shadow:0 1px 0 #fbfbfb inset}.sequence-heading{display:flex;align-items:center;gap:18px;margin-bottom:16px}.sequence-heading>span{font-size:9px;color:#848484}.sequence-actions{margin-left:auto;display:flex;gap:20px}.sequence-actions button{font-size:10px;color:#868686}.steps{display:grid;grid-template-columns:repeat(16,minmax(0,1fr));gap:7px}.step{position:relative;height:30px;border:1px solid #a8a8a8;border-radius:2px;background:linear-gradient(145deg,#f0f0f0,#cfcfcf);box-shadow:0 2px 0 #949494,0 3px 3px #6464644a,inset 0 1px 1px #fcfcfc;padding:0}.step:nth-child(4n+1){margin-left:8px}.step:first-child{margin-left:0}.step:after{content:'';position:absolute;left:50%;top:10px;transform:translateX(-50%);width:11px;height:3px;border-radius:1px;background:#bbbbbb;box-shadow:inset 0 1px 1px #80808040}.step.active{background:linear-gradient(#7e7e7e,#5a5a5a);border-color:#6c6c6c;box-shadow:inset 0 2px 3px #34343480,0 1px 0 #f8f8f8;transform:translateY(2px)}.step.active:after{background:#e1e1e1;box-shadow:0 0 4px #cfcfcf55}.step.current:before{content:'';position:absolute;bottom:-8px;left:50%;width:4px;height:4px;border-radius:50%;background:#ed842e;box-shadow:0 0 5px #ed842e80;transform:translateX(-50%)}.beat-labels{display:grid;grid-template-columns:repeat(4,1fr);font-size:9px;color:#a4a4a4;padding-top:12px}.machine-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:55px;border-top:1px solid #b5b5b5;box-shadow:0 1px 0 #fbfbfb inset;font-size:9px;color:#8d8d8d}.machine-bottom>span{display:flex;align-items:center;gap:8px;white-space:nowrap}.orange{background:#df7c2f}.machine-bottom>div{display:flex;gap:17px}.machine-bottom .text-button{font-size:10px;text-transform:lowercase;color:#6b6b6b}.master{display:flex;align-items:center;gap:12px;font-size:10px}.master input{width:75px}.status{margin:0 calc(clamp(26px,5vw,90px) * -1);padding:10px 22px 11px;min-height:32px;background:linear-gradient(#c6c6c6,#c0c0c0);border-top:1px solid #a0a0a0;box-shadow:inset 0 1px 0 #f4f4f4;color:#6f6f6f;font-size:9px;text-align:center}.site-header,.site-footer,.intro{display:none}@keyframes blink{50%{opacity:.45}}
@media(min-width:1200px) and (min-height:780px){.machine{min-height:100dvh;display:grid;grid-template-rows:auto 1fr auto auto auto}.machine-body{align-items:center}.pads{max-height:52vh}.pad{aspect-ratio:1.55}}
@media(max-width:1000px){.machine{padding:28px 34px 0}.machine-top{gap:40px;grid-template-columns:1fr 1.15fr}.machine-body{gap:32px;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}.lcd{padding:15px 18px 12px}.identity-meta{gap:14px}.pad{aspect-ratio:1.14;padding:11px}.pad-key{top:11px;right:11px}.sound-heading{margin-bottom:24px}.sound-controls{gap:17px;padding-bottom:17px}.dial-name{font-size:9px;gap:5px}.timing{padding-top:18px;gap:19px}.pattern-row{gap:11px;padding-top:21px;padding-bottom:19px}.patterns{gap:5px}.patterns button{width:24px}.small-button{font-size:9px;padding:5px}.transport{gap:7px;padding:7px}.transport-button{height:81px;padding-bottom:9px}.transport-button:before{width:42px;top:11px}.transport-button i{top:32px}.machine-bottom>span{font-size:8px}.machine-bottom>div{gap:11px}.machine-bottom .text-button{font-size:9px}.master{font-size:9px;gap:8px}.master input{width:60px}.status{margin:0 -34px}}
@media(max-width:700px){.machine{padding:24px 23px 0}.machine-top{grid-template-columns:1fr;gap:23px;padding-bottom:24px}.identity{max-width:none;display:grid;grid-template-columns:1fr 120px;column-gap:20px;align-items:center}.model{grid-column:1;grid-row:1}.model h1{font-size:27px}.identity>p{grid-column:1;grid-row:2;margin:7px 0 0;font-size:10px}.vents{grid-column:2;grid-row:1 / span 2;width:100%;height:39px;background-size:6px 6px}.identity-meta{grid-column:1 / -1;grid-row:3;margin-top:15px;font-size:9px}.identity-meta .text-button{font-size:9px}.display-label{font-size:8px}.lcd{padding:16px 20px 13px}.lcd-main strong{font-size:43px}.lcd-main .position strong{font-size:30px}.lcd-caption{font-size:8px}.lcd-top,.lcd-bottom{font-size:8px}#wave{height:23px}.machine-body{grid-template-columns:minmax(0,1fr);gap:28px;padding-top:22px}.pads{gap:11px;padding:14px}.pad{aspect-ratio:1.12;padding:12px;border-radius:4px}.pad-key{right:11px;top:11px}.pad-name{font-size:10px}.pad-number{font-size:14px}.pad-foot{font-size:9px;margin-top:18px}.controls{border-top:1px solid #afafaf;box-shadow:0 1px 0 #fff9 inset;padding-top:19px}.sound-heading{margin:12px 0 26px}.sound-heading h2{font-size:24px}.sound-controls{padding-bottom:22px;padding-left:5px;padding-right:5px;gap:28px}.dial{width:70px;height:70px;margin-bottom:20px}.dial i{transform-origin:50% 28px}.dial:before{inset:-9px}.dial-name{max-width:100px;font-size:10px}.timing{padding-top:21px;gap:35px}.pattern-row{padding:23px 0;gap:16px}.patterns{gap:8px}.patterns button{width:29px;height:28px}.small-button{font-size:10px}.transport{gap:9px;padding:9px}.transport-button{height:100px;font-size:11px;padding-bottom:11px}.transport-button:before{width:53px;top:12px}.transport-button i{top:39px}.transport-note{font-size:9px;margin-top:14px}.sequencer{padding:20px 0 16px}.sequence-heading{gap:12px;margin-bottom:17px}.sequence-heading .section-label b{font-size:10px}.sequence-actions{gap:12px}.sequence-actions button{font-size:9px}.steps{gap:4px}.step{height:27px}.step:nth-child(4n+1){margin-left:3px}.step:first-child{margin-left:0}.step:after{width:5px;height:2px}.beat-labels{padding-top:12px;font-size:9px}.machine-bottom{flex-wrap:wrap;justify-content:space-between;padding:16px 0;gap:17px}.machine-bottom>span{font-size:8px}.machine-bottom>div{order:3;width:100%;justify-content:space-between}.machine-bottom .text-button{font-size:10px}.master{font-size:9px}.master input{width:60px}.status{margin:0 -23px;font-size:9px;padding:11px 20px}.section-label{font-size:9px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* Warm phosphor behind smoked glass; the remaining panel is neutral metal. */
.lcd{color:#d6d1b7;background:linear-gradient(155deg,#292b29,#101410 60%,#1e211e);text-shadow:0 0 5px #d7deac35}.lcd-top,.lcd-bottom{color:#b8b9a6}.lcd-caption{color:#949b84}.lcd-main .position strong{color:#b9c29c}.lcd:before{background:linear-gradient(140deg,#dbe9d810 0%,#ffffff14 23%,transparent 23.3%,transparent 69%,#ffffff03 70%)}.status{background:linear-gradient(#c8cbc4,#bfc3bc);color:#687060;border-color:#a4aca0}.pad.hit{background:linear-gradient(145deg,#65695d,#464e3b)}
.dial-control.turning .dial{box-shadow:0 1px 0 1px #eee,1px 2px 0 1px #999,2px 4px 0 #888,2px 5px 3px #5557,inset 0 1px 2px #fff,inset -2px -2px 3px #8888}.dial-control.turning{cursor:grabbing}
@media(min-width:701px) and (max-width:1000px) and (max-height:800px){.machine{padding-top:22px}.machine-top{padding-bottom:20px;gap:40px}.lcd{padding:12px 18px 10px}.lcd-main strong{font-size:36px}.lcd-main .position strong{font-size:28px}.lcd-main{padding-top:10px}.lcd-top{padding-bottom:8px}#wave{height:21px;margin:6px 0}.identity>p{margin-bottom:14px}.vents{height:30px}.machine-body{padding:19px 0 17px;gap:32px}.pad{aspect-ratio:1.4}.sound-heading{margin:10px 0 18px}.sound-heading h2{font-size:22px}.dial{width:50px;height:50px;margin-bottom:12px}.dial i{transform-origin:50% 20px}.dial-name{font-size:9px}.sound-controls{padding-bottom:13px}.timing{padding-top:14px}.pattern-row{padding:15px 0}.transport-button{height:70px;font-size:9px;padding-bottom:8px}.transport-button:before{width:36px;top:9px}.transport-button i{top:27px}.transport-note{margin-top:9px;font-size:8px}.sequencer{padding-top:16px;padding-bottom:11px}.sequence-heading{margin-bottom:13px}.step{height:27px}.machine-bottom{min-height:48px}.status{min-height:28px;padding:8px 22px}}