@font-face{font-family:Studio;src:local('Avenir Next'),local('Avenir'),local('Arial');font-display:swap}
:root{--paper:#f3f1e9;--panel:#fbfaf5;--ink:#143c2e;--green:#0b4936;--line:#d9dbd0;--orange:#ed672b;--muted:#68776e;--yellow:#e5b54c;--shadow:0 12px 36px #173f2f0b;color-scheme:light}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px Studio,Arial,sans-serif}button,input,select{font:inherit}button{cursor:pointer;color:inherit}button:disabled{opacity:.45;cursor:wait}button:focus-visible,input:focus-visible,select:focus-visible,a:focus-visible{outline:3px solid var(--orange);outline-offset:3px}button{border:1px solid var(--line);background:var(--panel);border-radius:7px;padding:10px 14px;transition:background .12s,transform .12s}button:hover{background:#e9ede4}button.active,button[aria-pressed=true]{background:var(--green);border-color:var(--green);color:var(--paper)}button.primary{background:var(--green);color:white;border-color:var(--green)}button.accent{background:var(--orange);color:#fff;border-color:var(--orange)}button.ghost{border-color:transparent;background:transparent}button.danger{color:#ac3122}button:active{transform:translateY(1px)}label{display:block}input[type=range]{accent-color:var(--green);width:100%;min-height:25px}input[type=number]{width:76px}input:not([type=range]):not([type=checkbox]),select{background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:5px;padding:7px;max-width:100%}select{width:100%}input[type=checkbox]{accent-color:var(--green)}a{color:var(--green)}p{line-height:1.6}h1,h2,h3,p{margin-top:0}h1{font-size:26px}h2{font-size:20px;letter-spacing:-.5px}h3{font-size:14px}small,.muted{color:var(--muted)}.mono,.eyebrow{font-family:ui-monospace,Menlo,monospace}.eyebrow{font-size:10px;text-transform:uppercase;letter-spacing:1.6px;color:var(--muted)}.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.between{justify-content:space-between}.stack{display:grid;gap:13px}.topbar{height:86px;display:flex;align-items:center;justify-content:space-between;padding:0 30px;border-bottom:1px solid var(--line);gap:20px}.brand{display:flex;gap:13px;align-items:center}.brandmark{width:43px;height:47px;border:2px solid var(--green);border-radius:7px;font-size:21px;font-weight:900;display:grid;place-items:center;position:relative}.brandmark:after{content:'';position:absolute;width:7px;height:7px;background:var(--orange);right:3px;bottom:3px;border-radius:50%}.brand h1{font-size:24px;letter-spacing:-1px;margin:0}.brand small{font-size:10px;letter-spacing:1.4px;text-transform:uppercase}.tabs{display:flex;background:#e4e7dc;padding:4px;border-radius:9px;gap:3px}.tabs button{border:0;background:transparent;padding:10px 21px}.tabs button.active{background:var(--panel);color:var(--green);box-shadow:0 2px 5px #0001}.top-actions{display:flex;gap:6px;align-items:center}.workspace{max-width:1630px;margin:auto;display:grid;grid-template-columns:200px minmax(0,1fr)}.sidebar{padding:25px 20px;border-right:1px solid var(--line);min-height:calc(100vh - 86px)}.sidebar .section{margin-bottom:28px}.sidebar h3{font-size:11px;text-transform:uppercase;letter-spacing:1.4px;font-weight:500;color:var(--muted);margin-bottom:13px}.project-choice{display:flex;gap:8px;align-items:center;width:100%;text-align:left;padding:9px 8px;margin:3px 0;border:0;background:transparent;font-size:12px}.project-choice span{font-family:monospace;color:var(--muted);font-size:11px}.project-choice.active{background:#dde6da;color:var(--green)}.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#4f8c62;margin-right:5px}.side-note{padding:12px;background:#e9e7dc;border-radius:6px;font-size:11px;line-height:1.7}.side-note strong{display:block;margin-bottom:5px}.main{padding:26px 30px 35px;min-width:0}.titlebar{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;margin-bottom:22px}.titlebar h2{font-size:28px;font-weight:500;margin:5px 0 7px}.titlebar .row button{font-size:11px}.tag{font-size:10px;text-transform:uppercase;letter-spacing:.8px;padding:6px 9px;border-radius:4px;background:#e4e9de;white-space:nowrap}.onboarding{display:flex;gap:15px;align-items:center;background:#e1e8db;border:1px solid #cfdcc8;border-radius:8px;padding:12px 15px;margin-bottom:18px;font-size:12px}.onboarding .number{border:1px solid #8caa8d;border-radius:50%;padding:6px 9px;font:13px monospace}.onboarding strong{display:block;font-size:13px;margin-bottom:4px}.transport{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;background:var(--panel);padding:13px 16px;border:1px solid var(--line);border-radius:9px 9px 0 0}.transport .play{font-size:15px;min-width:90px}.recording{background:#b63124!important;color:white!important;animation:blink 1.5s infinite}.tempo{display:flex;align-items:center;gap:7px;font-size:11px}.tempo input{border:0!important;background:transparent!important;width:58px!important;font:22px ui-monospace,monospace!important;padding:0!important}.transport-divider{height:25px;width:1px;background:var(--line)}.position{font:20px ui-monospace,monospace;letter-spacing:3px}.meter{height:7px;width:75px;background:#dfe3d6;overflow:hidden;border-radius:2px}.meter i{display:block;width:0;height:100%;background:var(--green)}.timeline{border:1px solid var(--line);border-top:0;border-radius:0 0 9px 9px;background:var(--panel);overflow:hidden}.timeline-head,.track{display:grid;grid-template-columns:148px repeat(4,minmax(50px,1fr)) 42px;gap:8px;align-items:center;padding:10px 14px}.timeline-head{font:10px ui-monospace,monospace;color:var(--muted);padding-bottom:4px}.track{border-top:1px solid #e9ebe1;min-height:61px}.trackname{display:flex;align-items:center;gap:8px}.trackname .letter{width:29px;height:30px;border-radius:5px;background:var(--track);display:grid;place-items:center;font-weight:bold}.trackname b{font-size:12px}.trackname small{display:block;font-size:9px;margin-top:3px}.clip{height:40px;position:relative;border:1px solid color-mix(in srgb,var(--track) 55%,white);background:color-mix(in srgb,var(--track) 18%,white);border-radius:5px;padding:7px;display:flex;align-items:center;justify-content:space-between;font-size:10px;overflow:hidden}.clip.active{color:var(--ink);background:color-mix(in srgb,var(--track) 42%,white);border-color:var(--track)}.clip .bars{display:flex;gap:3px;align-items:center;height:16px;opacity:.5}.clip .bars i{width:3px;background:var(--ink);border-radius:1px}.clip.queued{outline:2px dashed var(--green);outline-offset:1px}.mute{padding:6px;font:11px monospace}.track.muted{opacity:.5}.scene-row{display:flex;gap:7px;align-items:center;flex-wrap:wrap;padding:12px 0 20px;font-size:11px}.scene-row button{font-size:10px;padding:7px 10px}.scene-row .label{color:var(--muted);margin-right:5px}.deck{display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:20px}.panel{border:1px solid var(--line);border-radius:9px;background:var(--panel);padding:17px;box-shadow:var(--shadow)}.panel-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px;gap:10px}.panel-title h3{margin:0}.panel-title small{font:10px monospace}.group-tabs{display:flex;gap:5px}.group-tabs button{padding:6px 10px;font:11px monospace}.pad-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.pad{height:76px;display:flex;flex-direction:column;justify-content:space-between;text-align:left;padding:10px 12px;border-radius:7px;background:#eeeede;position:relative;touch-action:none;user-select:none;box-shadow:0 3px 0 #d8dccf}.pad:nth-child(4n+1){border-bottom-color:var(--orange)}.pad.selected{outline:2px solid var(--green);outline-offset:1px}.pad.down{background:var(--orange)!important;color:white!important;box-shadow:none;transform:translateY(3px)}.pad .pad-key{font:10px monospace;opacity:.5}.pad .pad-name{font-size:11px;font-weight:600}.pad .pad-type{font:8px monospace;position:absolute;right:8px;top:9px;opacity:.55}.pad.loop-on{background:#b6cfb5}.pad-tools{margin:13px 0 2px;display:flex;gap:6px;flex-wrap:wrap}.pad-tools button{font-size:10px;padding:6px 9px}.editor-grid{margin-top:15px;display:grid;gap:8px}.editor-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:10px}.steps{display:grid;grid-template-columns:repeat(16,minmax(0,1fr));gap:3px}.step{height:30px;padding:0;border-radius:3px;font:9px monospace;background:#e5e9dd}.step:nth-child(4n+1){border-left:2px solid #889b88}.step.active{background:var(--green);color:white}.step.playhead{box-shadow:0 0 0 2px var(--orange);z-index:1}.punch-bar{margin-top:20px;border-top:1px solid var(--line);padding-top:16px}.punch-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px}.punch-grid button{font-size:9px;padding:9px 4px;background:#edeadf;touch-action:none;user-select:none}.punch-grid button.down{background:var(--orange);color:white}.field{margin:12px 0}.field label{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;margin-bottom:4px}.field label output{color:var(--green);font-family:monospace}.inspector h3{margin:0 0 5px;font-size:17px}.inspector .sound-kind{font:9px monospace;text-transform:uppercase;color:var(--muted)}.inspector details{border-top:1px solid var(--line);padding-top:10px;margin-top:12px}.inspector summary{font-size:11px;cursor:pointer}.sound-picker{font-size:11px;margin-top:12px}.small-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.small-grid label{font-size:10px;color:var(--muted)}.small-grid input{width:100%}.footer{margin-top:22px;display:flex;align-items:center;justify-content:space-between;color:var(--muted);font:9px ui-monospace,monospace;gap:15px;flex-wrap:wrap}.save-state{min-width:70px}.fx-panel{margin-top:20px}.fx-buttons{display:flex;flex-wrap:wrap;gap:5px}.fx-buttons button{font-size:10px;padding:7px 11px}.fx-controls{display:grid;grid-template-columns:1fr 1fr 1fr;gap:25px;margin-top:12px}.fx-controls .field{margin:0}.hardware-layout{display:grid;grid-template-columns:minmax(390px,650px) minmax(210px,1fr);gap:25px;align-items:start}.machine{background:linear-gradient(110deg,#e8e2cd,#d7d1bd);border:2px solid #c6c1af;border-radius:5px;box-shadow:0 9px 0 #aaa58f,0 22px 30px #15261726;padding:0 20px 20px;color:#064735;max-width:650px}.machine-header{display:flex;justify-content:space-between;padding:20px 0 15px}.machine-header b{font-size:33px;letter-spacing:-2px;line-height:1}.machine-header small{display:block;font-size:9px;margin-top:4px;color:var(--orange)}.speaker{width:100px;height:65px;background:repeating-linear-gradient(0deg,#d9d4c4 0 5px,transparent 5px 8px),radial-gradient(circle,#183b2f 58%,transparent 60%);border:1px solid #ccc5b3}.ports{display:flex;justify-content:space-around;font:8px monospace;border-bottom:1px solid #c7c2ad;padding:7px}.lcd{background:linear-gradient(140deg,#4c9c76,#83bd99);border:7px solid #496e53;border-radius:2px;box-shadow:inset 0 2px 14px #0c4a3380;padding:13px 10px;margin:0 -20px 19px;font-family:monospace;color:#094c35;min-height:111px}.lcd-top{display:flex;align-items:center;justify-content:space-between;font-size:9px}.lcd-value{font-size:38px;letter-spacing:4px;text-shadow:2px 1px #c3dcb355}.lcd-icons{display:flex;gap:10px;justify-content:space-between;font-size:10px;margin-top:6px}.machine-controls{display:grid;grid-template-columns:52px 1fr 90px;gap:14px}.machine button{border-radius:2px;border:1px solid #4e5342;box-shadow:1px 3px 1px #55564790;background:linear-gradient(#f9f6e9,#d8d5c5);color:#094b37;padding:7px 3px;font:10px monospace;min-height:30px}.machine button.active{background:#0c4a36;color:#f0eedc}.machine .accent{background:linear-gradient(#ff8b3c,#ed5b1f);color:#522c12}.machine .green{background:#084833;color:#f7f2dc}.machine-top{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:13px}.hardware-groups{display:grid;grid-template-rows:repeat(4,1fr);gap:12px}.hardware-groups button{font-size:20px}.hardware-pads{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.hardware-pads .pad{height:55px;min-height:55px;align-items:center;padding:4px;font:28px monospace;display:flex}.hardware-pads .pad small{font:7px monospace;max-width:100%;overflow:hidden;white-space:nowrap;color:inherit}.hardware-pads .pad.selected{outline:2px solid var(--orange)}.hardware-left{display:flex;flex-direction:column;gap:12px}.hardware-left .field{margin:0;flex:1}.hardware-left input[type=range]{writing-mode:vertical-lr;direction:rtl;min-height:110px;width:38px;accent-color:#dedaca}.hardware-right{display:grid;grid-template-columns:1fr 1fr;gap:12px 8px}.knob{border-radius:50%!important;width:35px;height:35px;min-height:35px;appearance:none;background:var(--orange)!important;box-shadow:1px 3px 4px #0004!important;border:4px solid #dc682f!important;cursor:ns-resize;color:transparent;max-width:100%;padding:0!important}.knob.green{background:#08513a!important;border-color:#06422f!important}.knob-line{font:9px monospace;text-align:center}.machine .pad.down{background:var(--orange)!important}.machine-bottom{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}.hardware-help{font-size:12px;line-height:1.8}.hardware-help h3{font-size:16px}.hardware-help kbd{border:1px solid var(--line);padding:2px 5px;border-radius:3px;background:#eeeade;font:10px monospace}.ting-layout{display:grid;grid-template-columns:minmax(220px,350px) minmax(0,1fr);gap:28px}.ting-unit{background:linear-gradient(100deg,#e6dfce,#f0eadd);border:1px solid #c8c3b3;border-radius:80px 80px 26px 26px;padding:25px 30px;max-width:280px;margin:0 auto;box-shadow:5px 10px 0 #bfb9a6}.ting-grill{height:140px;border-radius:65px 65px 25px 25px;background:repeating-linear-gradient(#d9d3bf 0 7px,#133d2d 7px 11px);margin-bottom:25px}.ting-unit h2{text-align:center;font-size:36px;letter-spacing:-2px}.ting-unit .talk{width:100%;min-height:90px;background:var(--green);color:white;touch-action:none;margin-top:20px}.ting-unit .talk.down{background:var(--orange)}.ting-fx-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.ting-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:20px 0}.ting-slots button{min-height:75px;font-size:11px}.feature-note{background:#ede8d9;border-left:3px solid var(--orange);padding:12px;font-size:11px;line-height:1.7;margin-top:15px}.waveform{width:100%;height:75px;background:#edf0e5;border-radius:4px;display:block;margin-top:12px}.piano{display:flex;gap:2px;margin-top:10px}.piano button{height:80px;flex:1;font-size:10px;padding:3px;background:#f5f3e9;touch-action:none}.piano button:nth-child(7n+2),.piano button:nth-child(7n+4){background:#143f30;color:white}.piano button.down{background:var(--orange)}#toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);padding:12px 22px;background:#123e2f;color:#f4f1e5;border-radius:7px;opacity:0;pointer-events:none;transition:.15s;max-width:90vw;font-size:12px;z-index:10}#toast.show{opacity:1;transform:translate(-50%,0)}dialog{width:min(680px,94vw);max-height:85vh;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);padding:28px;box-shadow:0 30px 80px #0004}dialog::backdrop{background:#122b2466;backdrop-filter:blur(3px)}dialog .close{float:right;border:0;background:transparent;font-size:24px;padding:0 6px}dialog h2{margin-right:20px}dialog table{border-collapse:collapse;width:100%;font-size:12px}dialog td,dialog th{border-bottom:1px solid var(--line);padding:10px;text-align:left}dialog .checklist{font-size:12px;line-height:1.8}dialog p{font-size:13px}.tutorial-step{background:#e0e8d7;padding:15px;border-radius:6px;margin:12px 0}.tutorial-step b{display:block;margin-bottom:5px}@keyframes blink{50%{opacity:.7}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}@media(min-width:1500px){.main{padding:30px 45px}.deck{grid-template-columns:minmax(0,1fr) 275px}.pad{height:90px}}@media(max-width:1100px){.workspace{grid-template-columns:160px minmax(0,1fr)}.sidebar{padding:20px 12px}.main{padding:22px 20px}.deck{grid-template-columns:minmax(0,1fr) 210px;gap:12px}.topbar{padding:0 20px}.tabs button{padding:10px 15px}.hardware-layout{grid-template-columns:minmax(340px,1fr)}.hardware-help{display:none}}@media(max-width:850px){.workspace{grid-template-columns:1fr}.sidebar{display:none}.deck{grid-template-columns:minmax(0,1fr) 220px}.main{padding:20px}.top-actions .save-label{display:none}.topbar{height:auto;min-height:78px;flex-wrap:wrap;padding:16px 20px;gap:13px}.brand{flex:1}.tabs{order:3;width:100%;justify-content:center}.tabs button{flex:1}.trackname b{font-size:11px}.timeline-head,.track{grid-template-columns:115px repeat(4,minmax(40px,1fr)) 30px;gap:5px;padding:10px}.clip{padding:5px}.topbar .top-actions button{font-size:11px;padding:8px}.ting-layout{grid-template-columns:250px minmax(0,1fr)}}@media(max-width:620px){.main{padding:18px 12px}.titlebar h2{font-size:23px}.titlebar .tag{display:none}.titlebar{margin-bottom:15px}.onboarding{font-size:11px;gap:10px}.onboarding .number{display:none}.onboarding button{padding:6px;font-size:10px}.transport{gap:8px;padding:10px}.transport .play{min-width:65px}.transport .row{gap:5px}.transport button{font-size:11px;padding:8px}.transport-divider,.transport .meter-row,.position{display:none}.deck{grid-template-columns:1fr}.inspector{order:2}.pad{height:78px;padding:8px}.pad .pad-name{font-size:10px}.pad-grid{gap:7px}.timeline-head,.track{grid-template-columns:90px repeat(4,minmax(30px,1fr)) 26px;gap:4px;padding:8px}.trackname .letter{width:23px;height:26px;font-size:11px}.trackname{gap:5px}.trackname b{font-size:10px}.clip{height:38px;font-size:9px}.clip .bars{display:none}.trackname small{font-size:8px}.panel{padding:13px}.fx-controls{gap:12px}.scene-row{gap:5px;padding-bottom:15px}.scene-row button{padding:6px 7px}.punch-grid{grid-template-columns:repeat(4,1fr)}.ting-layout{grid-template-columns:1fr}.ting-unit{width:230px}.hardware-layout{grid-template-columns:minmax(0,1fr)}.machine{padding:0 12px 15px}.lcd{margin:0 -12px 15px;padding:9px 6px}.machine-controls{grid-template-columns:40px 1fr 70px;gap:8px}.hardware-pads{gap:8px}.hardware-groups{gap:8px}.hardware-right{gap:8px 5px}.hardware-pads .pad{height:47px;min-height:47px;font-size:24px}.machine-header b{font-size:30px}.machine-top{gap:8px}.knob{width:30px;height:30px}.hardware-pads .pad small{font-size:6px}.lcd-icons{font-size:8px;gap:4px}.lcd-value{font-size:30px}.machine button{font-size:8px}.ting-slots{gap:5px}.ting-slots button{padding:7px 4px}.small-grid{grid-template-columns:1fr 1fr}.steps{gap:2px}.step{height:28px;font-size:7px}}

.machine-top{grid-template-columns:43px repeat(3,1fr)}.volume-knob{background:#eeeade!important;border-color:#d0cdbe!important;width:30px;height:30px}.speaker{width:28%;min-width:78px;height:75px}.lcd{min-height:130px}

input[type=range].knob{width:35px!important;min-width:0!important;height:35px!important;appearance:none;-webkit-appearance:none;border-radius:50%!important}.knob::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:3px;height:12px;border-radius:1px;background:#f5e5c5;transform:translateY(-8px)}.volume-knob::-webkit-slider-thumb{background:#123f31}.knob::-moz-range-thumb{width:3px;height:12px;border:0;background:#efdfbb}.machine-top>.knob-line{min-width:0}.machine-top{grid-template-columns:43px repeat(3,minmax(0,1fr))}

textarea{width:100%;font:11px/1.5 ui-monospace,monospace;color:var(--ink);background:#fbfaf5;border:1px solid var(--line);border-radius:5px;padding:12px;margin:12px 0;resize:vertical}