:root{--neon-pink: #ff3ea5;--neon-violet: #9b5cff;--neon-cyan: #28e0ff;--neon-green: #5cff9b;--neon-yellow: #ffd23e;--bg0: #07000f;--bg1: #16002e;--bg2: #1f0a3d;--panel: rgba(34, 12, 64, .55);--panel-strong: rgba(28, 10, 54, .78);--panel-brd: rgba(155, 92, 255, .35);--panel-brd-hot: rgba(255, 62, 165, .5);--text: #f4ecff;--muted: #b9a3e6;--label-w: 80px;--cell-w: 40px;--cell-gap: 6px;--font: "Rubik", "Segoe UI", system-ui, -apple-system, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%}body{margin:0;font-family:var(--font);color:var(--text);background:var(--bg0);overflow-x:hidden;-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}h1,h2,h3{margin:0;font-weight:800;letter-spacing:.02em}button{font-family:inherit;cursor:pointer}.app{position:relative;min-height:100vh;min-height:100dvh;display:flex;flex-direction:column;padding:calc(env(safe-area-inset-top) + 10px) calc(env(safe-area-inset-right) + 12px) calc(env(safe-area-inset-bottom) + 14px) calc(env(safe-area-inset-left) + 12px);background:radial-gradient(1200px 700px at 20% -10%,var(--bg2),transparent 60%),radial-gradient(1000px 800px at 90% 10%,#2a0a4d,transparent 55%),linear-gradient(160deg,var(--bg0),var(--bg1) 60%,#0b0118)}.bg-orbs{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;overflow:hidden}.orb{position:absolute;width:46vmax;height:46vmax;border-radius:50%;filter:blur(70px);opacity:.4;mix-blend-mode:screen}.orb-1{background:radial-gradient(circle,var(--neon-violet),transparent 65%);top:-12vmax;left:-8vmax;animation:float1 16s ease-in-out infinite}.orb-2{background:radial-gradient(circle,var(--neon-pink),transparent 65%);bottom:-14vmax;right:-10vmax;animation:float2 19s ease-in-out infinite}.orb-3{background:radial-gradient(circle,var(--neon-cyan),transparent 65%);top:30%;right:20%;width:30vmax;height:30vmax;animation:float3 22s ease-in-out infinite}.bg-grid-lines{position:absolute;top:-50%;right:0;bottom:-10%;left:0;background-image:linear-gradient(rgba(155,92,255,.12) 1px,transparent 1px),linear-gradient(90deg,rgba(40,224,255,.08) 1px,transparent 1px);background-size:44px 44px;transform:perspective(400px) rotateX(60deg);transform-origin:center bottom;opacity:.5;animation:gridScroll 12s linear infinite}@keyframes float1{50%{transform:translate(6vmax,8vmax) scale(1.1)}}@keyframes float2{50%{transform:translate(-7vmax,-5vmax) scale(1.15)}}@keyframes float3{50%{transform:translate(-5vmax,6vmax) scale(.9)}}@keyframes gridScroll{to{background-position:0 44px,44px 0}}.bg-fx{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;overflow:hidden;--hue: calc(var(--cut, .45) * 230deg)}.bg-fx-layer{position:absolute;top:-25%;right:-25%;bottom:-25%;left:-25%;background-repeat:no-repeat;background-position:center;background-size:contain;mix-blend-mode:screen;filter:hue-rotate(var(--hue)) saturate(calc(.7 + var(--cut, .45) * 1.3)) brightness(calc(.65 + var(--cut, .45) * .7));transition:filter .11s linear;will-change:transform,filter}.bg-fx-aurora{opacity:.42;animation:bgDrift 40s ease-in-out infinite alternate}.bg-fx-mandala{opacity:.26;animation:bgSpin 120s linear infinite}@keyframes bgDrift{0%{transform:translate(-3%,-2%) scale(1.02) rotate(-4deg)}to{transform:translate(3%,2%) scale(1.12) rotate(4deg)}}@keyframes bgSpin{to{transform:rotate(360deg) scale(1.05)}}@media (prefers-reduced-motion: reduce){.bg-fx-layer{animation:none!important}}.particle-dust{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;z-index:0;pointer-events:none}.layout{position:relative;z-index:1;width:100%;max-width:1180px;margin:0 auto;display:flex;flex-direction:column;gap:14px;flex:1}.transport{position:relative;z-index:2;width:100%;max-width:1180px;margin:0 auto 14px;padding:12px 16px;border-radius:18px;background:var(--panel-strong);border:1px solid var(--panel-brd);box-shadow:0 8px 40px #00000073,inset 0 0 30px #9b5cff14;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.transport-title{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:10px}.transport-title h1{font-size:clamp(18px,3.4vw,28px);background:linear-gradient(90deg,var(--neon-cyan),var(--neon-pink));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 24px rgba(255,62,165,.35)}.transport-title h1 span{color:var(--muted);-webkit-text-fill-color:var(--muted);font-weight:600;font-size:.7em}.audio-status{display:inline-flex;align-items:center;gap:8px;font-size:12px;font-weight:700;letter-spacing:.08em;padding:6px 12px;border-radius:999px;border:1px solid var(--panel-brd);background:#0000004d}.status-dot{width:10px;height:10px;border-radius:50%;background:#777;box-shadow:0 0 10px currentColor}.status-running .status-dot{background:var(--neon-green);color:var(--neon-green);animation:blinkDot 1.4s ease-in-out infinite}.status-suspended .status-dot{background:var(--neon-yellow);color:var(--neon-yellow)}.status-locked .status-dot{background:var(--neon-pink);color:var(--neon-pink)}@keyframes blinkDot{50%{opacity:.35}}.transport-controls{display:flex;align-items:flex-end;gap:14px 18px;flex-wrap:wrap}.play-btn{min-width:96px;height:52px;padding:0 22px;font-size:18px;font-weight:800;letter-spacing:.1em;color:#07000f;border:none;border-radius:14px;background:linear-gradient(135deg,var(--neon-green),var(--neon-cyan));box-shadow:0 0 24px #5cff9b80;transition:transform .1s ease,box-shadow .2s ease}.play-btn.is-playing{background:linear-gradient(135deg,var(--neon-pink),var(--neon-yellow));box-shadow:0 0 28px #ff3ea599}.play-btn:active{transform:scale(.95)}.bpm-control{display:flex;align-items:flex-end;gap:6px}.step-btn{width:34px;height:34px;margin-bottom:4px;font-size:20px;line-height:1;color:var(--text);background:#ffffff12;border:1px solid var(--panel-brd);border-radius:10px}.step-btn:active{background:#ffffff2e}.length-control{display:flex;gap:4px;padding:4px;border-radius:12px;background:#0000004d;border:1px solid var(--panel-brd)}.seg-btn{min-width:46px;height:38px;color:var(--muted);background:transparent;border:none;border-radius:9px;font-weight:700;font-size:15px}.seg-btn.is-on{color:#07000f;background:linear-gradient(135deg,var(--neon-cyan),var(--neon-violet));box-shadow:0 0 14px #28e0ff80}.transport-buttons{display:flex;gap:8px;flex-wrap:wrap}.ghost-btn{height:40px;padding:0 14px;color:var(--text);background:#ffffff0f;border:1px solid var(--panel-brd);border-radius:11px;font-weight:600;font-size:13px;transition:background .15s ease,border-color .15s ease}.ghost-btn:active{background:#9b5cff40;border-color:var(--neon-violet)}.knob{display:flex;flex-direction:column;gap:4px;min-width:120px}.knob-label{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}.knob-value{font-size:12px;font-weight:700;color:var(--text);font-variant-numeric:tabular-nums}.knob-range{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;height:8px;border-radius:999px;background:linear-gradient(90deg,var(--accent) 0%,var(--accent) var(--fill, 50%),rgba(255,255,255,.12) var(--fill, 50%),rgba(255,255,255,.12) 100%);outline:none;touch-action:pan-y}.knob-range::-webkit-slider-thumb{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid var(--accent);box-shadow:0 0 12px var(--accent);cursor:pointer}.knob-range::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid var(--accent);box-shadow:0 0 12px var(--accent);cursor:pointer}.knob-select .note-select{width:100%;height:38px;padding:0 10px;color:var(--text);background:#00000059;border:1px solid var(--panel-brd);border-radius:10px;font-weight:700;font-size:14px}.stage{position:relative;padding:10px 10px 0;border-radius:20px;background:var(--panel);border:1px solid var(--panel-brd);box-shadow:inset 0 -40px 60px #14002899,0 8px 40px #0006;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);overflow:hidden}.stage-floor{position:absolute;left:0;right:0;bottom:0;height:46%;background:radial-gradient(120% 100% at 50% 100%,rgba(155,92,255,.28),transparent 70%);pointer-events:none}.stage-grid{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.char-card{position:relative;display:flex;flex-direction:column;align-items:center;padding:10px 6px 12px;border-radius:16px;background:linear-gradient(180deg,#ffffff0d,#00000026);border:1px solid rgba(255,255,255,.08);touch-action:none;user-select:none;-webkit-user-select:none;transition:transform .12s ease,box-shadow .2s ease,border-color .2s ease}.char-card.is-grabbing{transform:scale(1.03);border-color:var(--accent);box-shadow:0 0 30px var(--accent);z-index:5}.char-card.is-triggered{border-color:var(--accent);box-shadow:0 0 34px var(--accent),inset 0 0 24px #ffffff1a}.char-visual{width:100%;aspect-ratio:1 / 1.1;overflow:visible}.goblin{width:100%;height:100%}.goblin-svg{width:100%;height:100%;display:block;overflow:visible}.sprite-pose{position:relative;width:100%;height:100%;transform-origin:50% 50%}.pose-layer{position:absolute;top:0;right:0;bottom:0;left:0;background-repeat:no-repeat;background-position:center bottom;background-size:contain}.pose-action,.goblin.is-triggered .pose-idle{opacity:0}.goblin.is-triggered .pose-action{opacity:1}.char-label{margin-top:4px;text-align:center;display:flex;flex-direction:column}.char-name{font-weight:800;font-size:clamp(13px,2vw,16px);letter-spacing:.12em;color:#fff;text-shadow:0 0 12px var(--accent)}.char-hint{font-size:10px;letter-spacing:.08em;color:var(--muted);text-transform:uppercase;opacity:.75}.char-card.is-triggered .char-name{color:var(--accent)}.goblin-svg .g-aura,.goblin-svg .g-breathe,.goblin-svg .head,.goblin-svg .mouth,.goblin-svg .arm,.goblin-svg .hand,.goblin-svg .pupil,.goblin-svg .eyelid,.goblin-svg .ear,.goblin-svg .body,.goblin-svg .cymbal{transform-box:fill-box;transform-origin:center}.m-shadow{fill:#0006}.m-stem{fill:#f1e7d6}.m-stem-shade{fill:#785a3c40}.m-spot{fill:#ffffffd9}.belly{fill:#ffffff2e}.eye{fill:#fff}.pupil{fill:#1a0b2e}.glint{fill:#fff}.nose{fill:#00000040}.brow{fill:none;stroke:#2f7a3a;stroke-width:3;stroke-linecap:round}.arm{fill:none;stroke:#5fc169;stroke-width:9;stroke-linecap:round}.mouth{fill:#2a0b1c;transform:scaleY(.32)}.tusk{fill:#fff}.eyelid{fill:#6fcf6a;transform:scaleY(0)}.cymbal{display:none;fill:#ffe27a;stroke:#ffffffb3;stroke-width:1}.goblin[data-inst=cymbal] .cymbal{display:block}.g-aura{animation:auraPulse 2.8s ease-in-out infinite}.g-breathe{animation:breathe 3.4s ease-in-out infinite}.head{animation:headBob 3.4s ease-in-out infinite}.ear-l{animation:earWiggleL 4s ease-in-out infinite}.ear-r{animation:earWiggleR 4.3s ease-in-out infinite}.eyelid{animation:blink 5s infinite}@keyframes auraPulse{0%,to{transform:scale(.92);opacity:.7}50%{transform:scale(1.06);opacity:1}}@keyframes breathe{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-3px) scale(1.02)}}@keyframes headBob{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-1.5px) rotate(-1.5deg)}}@keyframes earWiggleL{0%,to{transform:rotate(0)}50%{transform:rotate(-6deg)}}@keyframes earWiggleR{0%,to{transform:rotate(0)}50%{transform:rotate(6deg)}}@keyframes blink{0%,92%,to{transform:scaleY(0)}95%,97%{transform:scaleY(1)}}.mouth,.head,.arm,.hand,.pupil,.body,.cymbal{transition:transform .13s cubic-bezier(.2,.9,.3,1.4),opacity .13s}.goblin.is-triggered .pupil{transform:scale(1.18)}.goblin.is-triggered .body{transform:scaleY(.95) scaleX(1.03)}.goblin[data-inst=kick].is-triggered .mouth{transform:scaleY(1.7) translateY(2px)}.goblin[data-inst=kick].is-triggered .head{transform:translateY(3px) scale(1.02)}.goblin[data-inst=bass].is-triggered .mouth{transform:scale(1.35)}.goblin[data-inst=bass].is-triggered .head{transform:translateY(2px) rotate(2deg)}.goblin[data-inst=cymbal].is-triggered .arm-l{transform:rotate(22deg) translate(6px)}.goblin[data-inst=cymbal].is-triggered .arm-r{transform:rotate(-22deg) translate(-6px)}.goblin[data-inst=cymbal].is-triggered .cym-l{transform:translate(20px) translateY(-2px) scale(1.1)}.goblin[data-inst=cymbal].is-triggered .cym-r{transform:translate(-20px) translateY(-2px) scale(1.1)}.goblin[data-inst=clap].is-triggered .hand-l{transform:translate(28px) translateY(-4px)}.goblin[data-inst=clap].is-triggered .hand-r{transform:translate(-28px) translateY(-4px)}@media (prefers-reduced-motion: reduce){.g-aura,.g-breathe,.head,.ear-l,.ear-r,.eyelid,.orb,.bg-grid-lines{animation:none!important}}.seq{border-radius:18px;background:var(--panel);border:1px solid var(--panel-brd);box-shadow:0 8px 40px #0006;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);padding:10px}.seq-scroll{overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;padding-bottom:4px}.seq-ruler,.seq-lane{display:grid;grid-template-columns:var(--label-w) repeat(var(--cells),var(--cell-w));gap:var(--cell-gap);width:max-content;min-width:100%;align-items:center}.seq-ruler{margin-bottom:6px}.seq-lane{margin-bottom:var(--cell-gap)}.ruler-corner{background:transparent}.ruler-step{text-align:center;font-size:10px;font-weight:700;color:var(--muted);opacity:.6;font-variant-numeric:tabular-nums}.ruler-step.is-beat{opacity:1;color:var(--neon-cyan)}.ruler-step.is-current{color:#fff;text-shadow:0 0 10px var(--neon-pink);transform:scale(1.25)}.lane-label{position:sticky;left:0;z-index:3;display:flex;align-items:center;gap:6px;height:100%;padding-right:8px;font-size:12px;font-weight:800;letter-spacing:.06em;color:var(--text);background:linear-gradient(90deg,var(--panel-strong) 70%,rgba(28,10,54,0))}.lane-dot{width:12px;height:12px;border-radius:50%;box-shadow:0 0 10px currentColor}.step-cell{position:relative;height:var(--cell-w);padding:0;border-radius:9px;border:1px solid rgba(255,255,255,.1);background:#ffffff0a;touch-action:pan-x;transition:background .12s ease,border-color .12s ease,box-shadow .12s ease,transform .08s ease}.step-cell.is-beat{border-left:2px solid rgba(40,224,255,.5)}.step-cell.is-active{touch-action:none;background:var(--accent);border-color:#fff;box-shadow:0 0 16px var(--accent),inset 0 0 8px #fff6}.step-cell .step-token{position:absolute;top:22%;right:22%;bottom:22%;left:22%;border-radius:5px;background:#ffffffeb;opacity:0;transform:scale(.4);transition:opacity .12s ease,transform .12s ease}.step-cell.is-active .step-token{opacity:1;transform:scale(1)}.step-cell.is-current{border-color:var(--neon-yellow);box-shadow:0 0 18px #ffd23eb3}.step-cell.is-current:after{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:11px;border:1px solid var(--neon-yellow);opacity:.7;pointer-events:none}.step-cell.is-active.is-current{transform:scale(1.08)}.step-cell.drop-target{border-color:#fff;box-shadow:0 0 20px #fff;background:#ffffff40}.step-cell:active{transform:scale(.92)}.controls-panel{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.track-controls{display:flex;flex-direction:column;gap:12px;padding:14px;border-radius:16px;background:var(--panel);border:1px solid var(--panel-brd);box-shadow:inset 0 0 24px #9b5cff0f;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.track-controls-head{display:flex;align-items:center;gap:8px;padding-bottom:6px;border-bottom:1px solid rgba(255,255,255,.08)}.track-controls-head h3{font-size:15px;letter-spacing:.1em;color:var(--accent);text-shadow:0 0 12px var(--accent)}.track-dot{width:14px;height:14px;border-radius:50%;box-shadow:0 0 10px currentColor}.app-footer{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;font-size:11px;color:var(--muted);padding:8px 0 4px}.app-footer>span:first-child{opacity:.6}.app-credit{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}.app-credit strong{font-weight:900;letter-spacing:.18em;background:linear-gradient(90deg,var(--neon-cyan),var(--neon-pink));-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:0 0 18px rgba(255,62,165,.4)}.exit-btn{position:fixed;top:calc(env(safe-area-inset-top) + 10px);left:calc(env(safe-area-inset-left) + 10px);z-index:50;display:inline-flex;align-items:center;gap:6px;padding:7px 12px 7px 10px;border-radius:999px;background:var(--panel-strong);border:1px solid var(--panel-brd);color:var(--text);text-decoration:none;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:lowercase;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);box-shadow:0 6px 22px #00000080;transition:transform .12s ease,box-shadow .2s ease,border-color .2s ease}.exit-btn:hover{border-color:var(--neon-cyan);box-shadow:0 0 18px #28e0ff80}.exit-btn:active{transform:scale(.96)}.exit-arrow{font-size:14px;line-height:1;color:var(--neon-cyan)}@media (max-width: 480px){.exit-btn{font-size:10px;padding:6px 10px 6px 8px}}.donate-btn{display:inline-flex;align-items:center;gap:5px;margin-top:2px;padding:5px 12px;border-radius:999px;background:#ff3ea51a;border:1px solid rgba(255,62,165,.35);color:var(--neon-pink);text-decoration:none;font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;transition:background .15s ease,box-shadow .15s ease,color .15s ease,transform .1s ease}.donate-btn:hover{background:#ff3ea538;box-shadow:0 0 14px #ff3ea566;color:#fff}.donate-btn:active{transform:scale(.95)}.donate-btn svg{width:11px;height:11px;fill:currentColor}.pattern-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:8px 12px;border-radius:14px;background:var(--panel);border:1px solid var(--panel-brd);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.pattern-label{font-size:11px;font-weight:800;letter-spacing:.12em;color:var(--muted)}.pattern-btn{width:48px;height:40px;font-weight:800;font-size:16px;color:var(--text);background:#ffffff0f;border:1px solid var(--panel-brd);border-radius:10px;transition:background .12s ease,box-shadow .12s ease,color .12s ease}.pattern-btn.is-current{color:#07000f;background:linear-gradient(135deg,var(--neon-cyan),var(--neon-violet));box-shadow:0 0 16px #28e0ff80;border-color:#fff}.pattern-btn.is-pending{border-color:var(--neon-yellow);box-shadow:0 0 14px #ffd23e99;animation:patternQueue .5s ease-in-out infinite alternate}@keyframes patternQueue{0%{opacity:.5}to{opacity:1}}.pattern-hint{font-size:10px;letter-spacing:.06em;color:var(--muted);opacity:.7;text-transform:uppercase;margin-left:4px}.ms-buttons{margin-left:auto;display:flex;gap:4px}.ms-btn{width:28px;height:28px;font-size:12px;font-weight:800;border-radius:7px;color:var(--muted);background:#ffffff0f;border:1px solid var(--panel-brd);transition:background .12s ease,box-shadow .12s ease,color .12s ease}.ms-btn.ms-mute.is-on{color:#07000f;background:var(--neon-pink);border-color:#fff;box-shadow:0 0 10px var(--neon-pink)}.ms-btn.ms-solo.is-on{color:#07000f;background:var(--neon-yellow);border-color:#fff;box-shadow:0 0 10px var(--neon-yellow)}.length-control .dbl-btn{color:var(--neon-cyan);letter-spacing:.04em}.length-control .dbl-btn:active{background:#28e0ff40}.dupe-btn{height:40px;padding:0 12px;font-weight:800;font-size:12px;letter-spacing:.06em;color:var(--text);background:#ffffff0f;border:1px solid var(--panel-brd);border-radius:10px;transition:background .12s ease,box-shadow .12s ease,color .12s ease}.dupe-btn.is-on{color:#07000f;background:var(--neon-green);border-color:#fff;box-shadow:0 0 12px var(--neon-green)}.pattern-btn.is-copy-target{border-color:var(--neon-green);box-shadow:0 0 12px #5cff9b80}.pattern-bar.is-copying .pattern-hint{color:var(--neon-green);opacity:1}.drag-ghost{position:fixed;z-index:9999;top:0;left:0;transform:translate(-50%,-50%);padding:8px 14px;border-radius:12px;font-weight:800;font-size:13px;letter-spacing:.08em;color:#07000f;background:var(--ghost-color, #fff);box-shadow:0 0 24px var(--ghost-color, #fff);pointer-events:none}.audio-gate{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;display:flex;align-items:center;justify-content:center;padding:24px;background:#05000cb3;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.audio-gate-card{position:relative;text-align:center;padding:34px 28px;border-radius:24px;background:var(--panel-strong);border:1px solid var(--panel-brd-hot);box-shadow:0 0 60px #ff3ea566;overflow:hidden;max-width:420px;width:100%}.gate-glow{position:absolute;top:-40%;right:-40%;bottom:-40%;left:-40%;background:conic-gradient(from 0deg,var(--neon-pink),var(--neon-violet),var(--neon-cyan),var(--neon-green),var(--neon-pink));filter:blur(50px);opacity:.35;animation:spin 8s linear infinite;pointer-events:none}@keyframes spin{to{transform:rotate(360deg)}}.audio-gate-card h2{position:relative;font-size:38px;background:linear-gradient(90deg,var(--neon-cyan),var(--neon-pink));-webkit-background-clip:text;background-clip:text;color:transparent}.gate-sub{position:relative;margin:2px 0 22px;color:var(--muted);letter-spacing:.25em;font-size:12px;text-transform:uppercase}.start-audio-btn{position:relative;width:100%;height:60px;font-size:18px;font-weight:800;color:#07000f;border:none;border-radius:16px;background:linear-gradient(135deg,var(--neon-green),var(--neon-cyan));box-shadow:0 0 30px #5cff9b99;transition:transform .1s ease}.start-audio-btn:active{transform:scale(.97)}.gate-note{position:relative;margin:16px 0 0;font-size:13px;color:var(--muted)}@media (max-width: 900px){.controls-panel{grid-template-columns:repeat(2,1fr)}}@media (max-width: 720px){.stage-grid{grid-template-columns:repeat(2,1fr);gap:8px}:root{--label-w: 64px;--cell-w: 38px}.transport-controls{gap:12px}.knob{min-width:104px;flex:1}}@media (max-width: 480px){:root{--label-w: 58px;--cell-w: 36px;--cell-gap: 5px}.transport-title h1{font-size:20px}.play-btn{flex:1;min-width:0}.bpm-control,.length-control{flex:1}.controls-panel{grid-template-columns:1fr 1fr}}