.controller-modal-backdrop{z-index:60;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#040506d1;place-items:center;padding:18px;display:grid;position:fixed;inset:0}.controller-dialog{border:1px solid var(--line-bright);scrollbar-color:var(--line-bright) transparent;background:radial-gradient(circle at 8% 0,#5fd9ff0e,#0000 25rem),linear-gradient(145deg,#181b1d,#0d0f10);border-radius:18px;width:min(1040px,100%);max-height:min(900px,100dvh - 36px);padding:20px;overflow-y:auto;box-shadow:0 34px 110px #000000ad,inset 0 1px #ffffff09}.controller-dialog-header,.controller-dialog-footer,.hardware-card-heading,.hardware-actions,.mapping-heading,.connected-device{align-items:center;display:flex}.controller-dialog-header{justify-content:space-between;gap:18px;padding:1px 2px 17px}.controller-dialog-header h2{letter-spacing:-.035em;margin:0;font-size:clamp(18px,2.2vw,25px)}.controller-dialog-header p{color:var(--muted);margin:5px 0 0;font-size:11px}.controller-dialog-close{border:1px solid var(--line);width:36px;height:36px;color:var(--muted);background:var(--raised);cursor:pointer;border-radius:9px;flex:none;place-items:center;display:grid}.controller-dialog-close:hover{color:var(--text);border-color:var(--line-bright)}.controller-dialog-sections{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:11px;display:grid}.hardware-card{border:1px solid var(--line);background:#0b0d0ec7;border-radius:14px;min-width:0;padding:14px;box-shadow:inset 0 1px #ffffff06}.gamepad-card{--hardware-accent:var(--cyan)}.midi-card{--hardware-accent:var(--acid)}.hardware-card-heading{gap:9px}.hardware-icon{border:1px solid color-mix(in srgb, var(--hardware-accent) 28%, transparent);width:38px;height:38px;color:var(--hardware-accent);background:color-mix(in srgb, var(--hardware-accent) 6%, #101213);border-radius:9px;flex:none;place-items:center;display:grid}.hardware-card-heading>div{min-width:0}.hardware-kicker{color:var(--faint);font-family:var(--mono);letter-spacing:.13em;margin-bottom:2px;font-size:7px;font-weight:750;display:block}.hardware-card-heading h3{letter-spacing:-.02em;margin:0;font-size:14px}.hardware-status{border:1px solid var(--line);min-height:25px;color:var(--muted);white-space:nowrap;background:#111415;border-radius:999px;align-items:center;gap:6px;margin-left:auto;padding:0 8px;font-size:8px;font-weight:700;display:inline-flex}.hardware-status i{background:var(--faint);border-radius:50%;width:5px;height:5px}.hardware-status.is-connected{color:#dce8c1;border-color:#d9ff523d}.hardware-status.is-connected i{background:var(--acid);box-shadow:0 0 9px #d9ff52b3}.hardware-status.is-waiting{color:#c8f4ff;border-color:#5fd9ff3d}.hardware-status.is-waiting i{background:var(--cyan);animation:1s ease-in-out infinite controller-status-pulse;box-shadow:0 0 9px #5fd9ffa6}.hardware-status.is-error{color:var(--danger);border-color:#ff735a47}.hardware-status.is-error i{background:var(--danger)}.hardware-setup-strip{border:1px solid var(--line);min-height:32px;color:var(--muted);background:#0e1112;border-radius:8px;align-items:center;gap:8px;margin:13px 0 8px;padding:6px 8px;font-size:8px;line-height:1.35;display:flex}.hardware-setup-strip span{align-items:center;gap:5px;display:inline-flex}.hardware-setup-strip svg{color:var(--hardware-accent);flex:none}.hardware-setup-strip .hardware-setup-or{color:var(--faint);font-family:var(--mono);text-transform:uppercase;font-size:7px}.hardware-copy{min-height:48px;color:var(--muted);margin:0 1px 10px;font-size:9px;line-height:1.55}.hardware-copy strong{color:var(--text);font-weight:650}.hardware-actions{flex-wrap:wrap;gap:6px}.hardware-actions button,.mapping-heading button,.controller-dialog-footer button{border:1px solid var(--line);min-height:31px;color:var(--muted);background:var(--raised);cursor:pointer;border-radius:7px;justify-content:center;align-items:center;gap:6px;padding:0 9px;font-size:8px;font-weight:700;display:inline-flex}.hardware-actions button:hover:not(:disabled),.mapping-heading button:hover,.controller-dialog-footer button:hover{color:var(--text);border-color:var(--line-bright)}.hardware-actions button:disabled{cursor:not-allowed;opacity:.4}.hardware-actions .hardware-primary-button{color:#071114;border-color:var(--hardware-accent);background:var(--hardware-accent)}.hardware-actions .hardware-primary-button:disabled{color:var(--muted);border-color:var(--line);opacity:.75;background:#151819}.hardware-actions .midi-learn-button:not(:disabled){color:var(--acid);background:#d9ff5212;border-color:#d9ff5252}.hardware-actions .midi-learn-button.is-learning{color:#071114;border-color:var(--cyan);background:var(--cyan)}.connected-device{min-width:0;min-height:29px;color:var(--cyan);background:#5fd9ff09;border:1px solid #5fd9ff24;border-radius:7px;gap:6px;margin-top:7px;padding:0 8px;font-size:8px}.connected-device span{min-width:0;color:var(--text);text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.connected-device small{color:var(--cyan);font-family:var(--mono);letter-spacing:.08em;white-space:nowrap;margin-left:auto;font-size:6px;font-weight:750}.midi-device-list{gap:5px;display:grid}.hardware-error,.browser-note{color:#ff9a86;background:#ff735a0e;border:1px solid #ff735a33;border-radius:7px;margin:7px 0 0;padding:7px 8px;font-size:8px;line-height:1.45}.browser-note{color:var(--muted);border-color:var(--line);background:#0e1011}.mapping-heading{justify-content:space-between;gap:10px;min-height:36px;margin-top:11px}.mapping-heading>div{min-width:0}.mapping-heading strong,.mapping-heading span{display:block}.mapping-heading strong{color:var(--text);font-size:9px}.mapping-heading>div>span{color:var(--faint);margin-top:2px;font-size:7px;line-height:1.35}.mapping-heading button{min-height:25px;color:var(--cyan);flex:none}.learn-progress{background:#292e30;border-radius:999px;flex:none;width:86px;height:4px;position:relative;overflow:hidden}.learn-progress i{border-radius:inherit;background:linear-gradient(90deg, var(--cyan), var(--acid));height:100%;transition:width .12s;display:block}.hardware-map-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;display:grid}.hardware-map-pad{border:1px solid var(--line);min-width:0;min-height:54px;color:var(--muted);text-align:left;background:linear-gradient(145deg,#1a1e20,#121415);border-radius:7px;grid-template-columns:1fr auto;align-items:center;padding:7px;display:grid}button.hardware-map-pad{cursor:pointer}button.hardware-map-pad:hover:not(:disabled){border-color:color-mix(in srgb, var(--hardware-accent) 45%, var(--line));filter:brightness(1.08)}.hardware-map-pad:disabled{cursor:not-allowed;opacity:.48}.hardware-map-pad>span{color:var(--faint);font-family:var(--mono);align-self:start;font-size:7px}.hardware-map-pad strong{max-width:62px;color:var(--hardware-accent);font-family:var(--mono);text-overflow:ellipsis;white-space:nowrap;font-size:7px;font-weight:750;overflow:hidden}.hardware-map-pad small{color:var(--faint);font-family:var(--mono);letter-spacing:.08em;grid-column:1/-1;align-self:end;margin-top:6px;font-size:6px;font-weight:700}.hardware-map-pad.is-listening{border-color:var(--cyan);background:#5fd9ff17;animation:1.15s ease-in-out infinite controller-map-pulse;box-shadow:inset 0 0 0 1px #5fd9ff14,0 0 15px #5fd9ff14}.hardware-map-pad.is-listening strong,.hardware-map-pad.is-listening small{color:var(--cyan)}.hardware-map-pad.is-learned{background:#d9ff520e;border-color:#d9ff5266}.hardware-map-pad.is-learned strong,.hardware-map-pad.is-learned small{color:var(--acid)}.controller-dialog-footer{justify-content:space-between;gap:18px;padding:15px 2px 1px}.controller-dialog-footer p{max-width:680px;color:var(--faint);margin:0;font-size:8px;line-height:1.5}.controller-dialog-footer button{color:#141708;border-color:var(--acid);background:var(--acid);min-width:72px;min-height:32px}@keyframes controller-status-pulse{50%{opacity:.35}}@keyframes controller-map-pulse{50%{border-color:#5fd9ff61}}@media (width<=880px){.controller-dialog-sections{grid-template-columns:1fr}.hardware-copy{min-height:0}}@media (width<=560px){.controller-modal-backdrop{align-items:end;padding:0}.controller-dialog{width:100%;max-height:94dvh;padding:15px 12px max(14px, env(safe-area-inset-bottom));border-bottom:0;border-left:0;border-right:0;border-radius:17px 17px 0 0}.controller-dialog-header{align-items:flex-start}.controller-dialog-header p{max-width:260px}.hardware-card{padding:11px}.hardware-card-heading{flex-wrap:wrap}.hardware-status{width:max-content;margin-left:47px}.hardware-setup-strip{flex-direction:column;align-items:flex-start;gap:5px}.hardware-setup-strip .hardware-setup-or{padding-left:18px}.hardware-actions button{flex:auto}.hardware-map-pad{min-height:51px}.hardware-map-pad strong{max-width:50px}.controller-dialog-footer{flex-direction:column;align-items:stretch;gap:10px}.controller-dialog-footer button{width:100%}}@media (prefers-reduced-motion:reduce){.hardware-status.is-waiting i,.hardware-map-pad.is-listening{animation:none}}:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-synthesis:none;text-rendering:optimizelegibility;--bg:#090a0b;--panel:#101214;--panel-2:#15181a;--raised:#1a1e20;--line:#2b3033;--line-bright:#41484c;--text:#f2f1eb;--muted:#8f979b;--faint:#646b6f;--acid:#d9ff52;--acid-dim:#9dbd31;--cyan:#5fd9ff;--orange:#ff6540;--danger:#ff735a;--mono:"SFMono-Regular", Consolas, "Liberation Mono", monospace;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{background:var(--bg);min-width:320px;min-height:100%}body{min-width:320px;min-height:100vh;color:var(--text);background:radial-gradient(circle at 12% -10%, #5fd9ff14, transparent 28rem), radial-gradient(circle at 100% 0%, #d9ff520b, transparent 35rem), var(--bg);margin:0}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--cyan);outline-offset:2px}button:disabled{cursor:not-allowed}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.app-shell{width:min(100%,1540px);min-height:100vh;margin:0 auto;padding:22px clamp(18px,2.6vw,42px) 18px}.topbar,.source-bar,.workspace,.app-footer{width:100%}.topbar{justify-content:space-between;align-items:center;min-height:54px;margin-bottom:16px;display:flex}.brand-cluster{align-items:center;gap:10px;min-width:0;display:flex}.brand{color:var(--text);align-items:center;gap:12px;text-decoration:none;display:inline-flex}.brand-mark{border:1px solid var(--line-bright);background:#0d0f10;border-radius:7px;grid-template-columns:repeat(3,5px);align-items:end;gap:3px;width:28px;height:28px;padding:5px;display:grid;position:relative;box-shadow:inset 0 0 0 1px #08090a,0 0 24px #d9ff520f}.brand-mark i{background:var(--acid);border-radius:1px;display:block}.brand-mark i:first-child{height:8px}.brand-mark i:nth-child(2){height:16px}.brand-mark i:nth-child(3){height:12px}.brand-name{letter-spacing:-.045em;font-size:19px;font-weight:800}.brand-name span{color:var(--acid)}.brand-tagline{border-left:1px solid var(--line);color:var(--muted);letter-spacing:.02em;padding-left:12px;font-size:12px}.maker-link{color:var(--muted);font-family:var(--mono);letter-spacing:.04em;white-space:nowrap;background:#5fd9ff09;border:1px solid #5fd9ff29;border-radius:999px;padding:5px 8px;font-size:8px;text-decoration:none;transition:color .14s,border-color .14s,background .14s}.maker-link:hover{color:var(--cyan);background:#5fd9ff12;border-color:#5fd9ff6b}.header-meta,.source-links,.timeline-actions{align-items:center;gap:8px;display:flex}.status-pill{border:1px solid var(--line);min-height:30px;color:var(--muted);background:#101214b8;border-radius:999px;align-items:center;gap:8px;padding:0 11px;font-size:11px;font-weight:650;display:inline-flex}.status-pill i{background:var(--faint);border-radius:999px;width:6px;height:6px;box-shadow:0 0 0 3px #646b6f1f}.status-playing,.status-ready,.status-paused{color:#dce8c1;border-color:#d9ff5238}.status-playing i,.status-ready i,.status-paused i{background:var(--acid);box-shadow:0 0 0 3px #d9ff521a,0 0 12px #d9ff5273}.status-buffering i,.status-loading i{background:var(--cyan);animation:1.2s ease-in-out infinite status-pulse;box-shadow:0 0 0 3px #5fd9ff1a}.status-capture{color:#c8f4ff;background:#19353e9e;border-color:#5fd9ff66}.status-capture i{background:var(--cyan);animation:.85s ease-in-out infinite status-pulse;box-shadow:0 0 0 3px #5fd9ff1f,0 0 14px #5fd9ff8c}.status-error i{background:var(--danger)}.icon-link{border:1px solid var(--line);width:32px;height:32px;color:var(--muted);border-radius:50%;place-items:center;text-decoration:none;transition:color .15s,border-color .15s,transform .15s;display:grid}.icon-link:hover{color:var(--text);border-color:var(--line-bright);transform:translateY(-1px)}.source-bar{border:1px solid var(--line);background:#101214e0;border-radius:14px;grid-template-columns:minmax(0,1fr) auto auto;gap:10px;margin-bottom:14px;padding:8px;display:grid;box-shadow:0 18px 60px #00000029}.upload-button{border:1px solid var(--line);min-height:42px;color:var(--muted);background:var(--raised);cursor:pointer;white-space:nowrap;border-radius:9px;justify-content:center;align-items:center;gap:7px;padding:0 13px;font-size:10px;font-weight:700;transition:color .13s,border-color .13s,background .13s;display:inline-flex;position:relative;overflow:hidden}.upload-button:hover,.upload-button:focus-within{color:var(--text);border-color:var(--line-bright);background:#202527}.upload-button input{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.source-input{min-width:0;height:42px;color:var(--muted);background:#0c0e0f;border:1px solid #0000;border-radius:9px;align-items:center;padding:0 10px 0 12px;transition:border-color .15s,box-shadow .15s;display:flex}.source-input:focus-within{border-color:#5fd9ff70;box-shadow:0 0 0 3px #5fd9ff0f}.source-input.is-invalid{border-color:#ff735a99}.source-input input{min-width:0;height:100%;color:var(--text);background:0 0;border:0;outline:0;flex:1;padding:0 12px;font-size:13px}.source-input input::placeholder{color:#62696d}.clear-input{width:28px;height:28px;color:var(--faint);cursor:pointer;background:0 0;border:0;border-radius:6px;font-size:20px;line-height:1}.clear-input:hover{color:var(--text);background:var(--raised)}.load-button,.demo-button{color:#141708;background:var(--acid);cursor:pointer;letter-spacing:.01em;border:0;border-radius:9px;justify-content:center;align-items:center;gap:8px;min-height:42px;font-size:12px;font-weight:800;transition:transform .12s,filter .12s;display:inline-flex;box-shadow:inset 0 -2px #1d24033d,0 0 26px #d9ff5214}.load-button{padding:0 18px}.load-button:hover,.demo-button:hover{filter:brightness(1.06);transform:translateY(-1px)}.load-button:active,.demo-button:active{transform:translateY(1px)}.workspace{grid-template-columns:minmax(0,1.42fr) minmax(370px,.78fr);align-items:start;gap:14px;display:grid}.source-deck,.pad-bank{border:1px solid var(--line);background:linear-gradient(145deg,#16191bf5,#0d0f10fa);border-radius:18px;min-width:0;box-shadow:inset 0 1px #ffffff06,0 24px 80px #00000029}.source-deck{padding:12px}.pad-bank{flex-direction:column;padding:12px;display:flex}.panel-heading{justify-content:space-between;align-items:center;gap:14px;display:flex}.source-heading,.pads-heading{min-height:48px;padding:0 3px 10px}.source-title-wrap,.panel-heading>div:first-child{min-width:0}.eyebrow{color:var(--acid);font-family:var(--mono);letter-spacing:.14em;margin-bottom:4px;font-size:9px;font-weight:750;display:block}.panel-heading h1,.panel-heading h2{color:var(--text);text-overflow:ellipsis;white-space:nowrap;margin:0;font-size:13px;font-weight:650;line-height:1.25;overflow:hidden}.quiet-button{border:1px solid var(--line);min-height:31px;color:var(--muted);cursor:pointer;background:#111416;border-radius:7px;justify-content:center;align-items:center;gap:6px;padding:0 10px;font-size:10px;font-weight:650;text-decoration:none;transition:color .13s,border-color .13s,background .13s;display:inline-flex}.quiet-button.compact{min-height:28px;padding:0 8px}.quiet-button:hover:not(:disabled){color:var(--text);border-color:var(--line-bright);background:var(--raised)}.quiet-button:disabled{opacity:.35}.local-only-badge{min-height:27px;color:var(--cyan);font-family:var(--mono);white-space:nowrap;background:#5fd9ff0e;border:1px solid #5fd9ff33;border-radius:999px;align-items:center;padding:0 8px;font-size:8px;display:inline-flex}.video-frame{aspect-ratio:16/9;background-color:#070809;background-image:linear-gradient(#5fd9ff06 1px,#0000 1px),linear-gradient(90deg,#5fd9ff06 1px,#0000 1px),none;background-position:0 0,0 0,0 0;background-repeat:repeat,repeat,repeat;background-size:30px 30px;background-attachment:scroll,scroll,scroll;background-origin:padding-box,padding-box,padding-box;background-clip:border-box,border-box,border-box;border:1px solid #303639;border-radius:12px;width:100%;position:relative;overflow:hidden;box-shadow:inset 0 0 0 5px #00000038,0 15px 40px #00000038}.youtube-mount,.youtube-mount iframe{border:0;width:100%;height:100%;display:block}.local-media-stage{background:#050607;place-items:center;width:100%;height:100%;display:grid;position:absolute;inset:0}.local-media-stage__media--video{object-fit:contain;background:#000;width:100%;height:100%;display:block}.local-media-stage--audio{background:radial-gradient(circle at 28% 40%,#5fd9ff1a,#0000 32%),radial-gradient(circle at 82% 75%,#d9ff520f,#0000 28%),#080a0b;padding:clamp(16px,3vw,34px)}.local-media-stage__audio-shell{border:1px solid var(--line-bright);background:#0f1213e0;border-radius:14px;grid-template-columns:minmax(0,1fr);gap:15px;width:min(100%,620px);padding:clamp(16px,3vw,28px);display:grid;box-shadow:0 24px 70px #0000005c,inset 0 1px #ffffff06}.local-media-stage__audio-header{align-items:baseline;gap:11px;min-width:0;display:flex}.local-media-stage__audio-kicker{color:var(--acid);font-family:var(--mono);letter-spacing:.12em;text-transform:uppercase;flex:none;font-size:8px;font-weight:800}.local-media-stage__file-name{color:var(--text);text-overflow:ellipsis;white-space:nowrap;font-size:12px;overflow:hidden}.local-media-stage__audio-visual{align-items:center;gap:18px;min-height:76px;display:flex;position:relative;overflow:hidden}.local-media-stage__audio-disc{background:radial-gradient(circle, var(--acid) 0 4px, #101415 5px 12px, #5fd9ff73 13px 14px, #15191b 15px 24px, #5fd9ff33 25px 26px, #0b0d0e 27px);border:1px solid #5fd9ff57;border-radius:50%;flex:none;width:64px;height:64px;box-shadow:0 0 35px #5fd9ff1a}.local-media-stage__audio-wave{opacity:.56;background:repeating-linear-gradient(90deg, var(--cyan) 0 2px, transparent 2px 7px);clip-path:polygon(0 47%,4% 30%,8% 58%,12% 18%,16% 72%,20% 39%,24% 62%,28% 25%,32% 80%,36% 43%,40% 54%,44% 12%,48% 73%,52% 31%,56% 61%,60% 21%,64% 70%,68% 42%,72% 57%,76% 27%,80% 75%,84% 37%,88% 64%,92% 23%,96% 58%,100% 46%,100% 54%,96% 68%,92% 35%,88% 76%,84% 49%,80% 86%,76% 39%,72% 68%,68% 54%,64% 82%,60% 33%,56% 73%,52% 43%,48% 84%,44% 24%,40% 65%,36% 55%,32% 91%,28% 37%,24% 74%,20% 51%,16% 84%,12% 30%,8% 70%,4% 42%,0 55%);flex:1;height:54px}.local-media-stage__media--audio{width:100%;height:36px;display:block}.video-empty{background:radial-gradient(circle at 25%,#5fd9ff14,#0000 34%),linear-gradient(120deg,#ffffff04,#0000);grid-template-columns:minmax(230px,.9fr) minmax(260px,1.1fr);align-items:center;gap:4%;padding:clamp(24px,5vw,58px);display:grid;position:absolute;inset:0}.empty-orbit{aspect-ratio:1;border:1px solid #5fd9ff29;border-radius:50%;width:min(100%,240px);margin:auto;position:relative;box-shadow:inset 0 0 60px #5fd9ff06,0 0 0 28px #5fd9ff04,0 0 0 56px #5fd9ff03}.empty-orbit:before,.empty-orbit:after{content:"";border:1px dashed #d9ff522e;border-radius:50%;animation:22s linear infinite slow-spin;position:absolute;inset:19%}.empty-orbit:after{border-style:solid;border-color:#ff654033;animation-direction:reverse;inset:39%}.orbit-play{z-index:2;width:70px;height:70px;color:var(--acid);background:#111511;border:1px solid #d9ff526b;border-radius:50%;place-items:center;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 36px #d9ff521a}.empty-orbit kbd{--angle:calc(var(--orbit-index) * 45deg);z-index:3;border:1px solid var(--line-bright);width:26px;height:26px;color:var(--acid);font-family:var(--mono);transform:rotate(var(--angle)) translateY(-112px) rotate(calc(var(--angle) * -1));background:#171a1c;border-radius:6px;place-items:center;font-size:10px;display:grid;position:absolute;top:calc(50% - 13px);left:calc(50% - 13px);box-shadow:0 5px 14px #0000004d}.empty-copy{z-index:2;position:relative}.empty-copy h2{letter-spacing:-.045em;max-width:420px;margin:7px 0 10px;font-size:clamp(24px,3vw,42px);font-weight:720;line-height:.98}.empty-copy p{max-width:390px;color:var(--muted);margin:0 0 20px;font-size:12px;line-height:1.55}.demo-button{min-height:36px;padding:0 13px;font-size:10px}.video-loading,.video-error{z-index:5;text-align:center;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#060708e6;flex-direction:column;justify-content:center;align-items:center;gap:10px;padding:24px;display:flex;position:absolute;inset:0}.video-loading{color:var(--muted);font-family:var(--mono);letter-spacing:.06em;font-size:10px}.video-error svg{color:var(--danger)}.video-error strong{font-size:15px}.video-error p{max-width:390px;color:var(--muted);margin:-3px 0 2px;font-size:12px;line-height:1.5}.video-error a{color:var(--acid);align-items:center;gap:5px;font-size:11px;font-weight:650;text-decoration:none;display:inline-flex}.spin{color:var(--cyan);animation:.85s linear infinite spin}.transport{align-items:center;gap:10px;min-height:50px;padding:8px 3px 2px;display:flex}.transport-play{width:36px;height:36px;color:var(--acid);cursor:pointer;background:#121610;border:1px solid #d9ff5252;border-radius:8px;flex:0 0 36px;place-items:center;display:grid}.transport-play:disabled{color:var(--faint);border-color:var(--line);background:#101213}.transport-clock{min-width:174px;color:var(--text);font-family:var(--mono);gap:7px;font-size:10px;display:inline-flex}.transport-clock i{color:var(--faint);font-style:normal}.transport-clock span:last-child{color:var(--muted)}.transport-progress{background:#292e30;border-radius:999px;flex:1;min-width:30px;height:3px;position:relative;overflow:hidden}.transport-progress span{border-radius:inherit;background:linear-gradient(90deg, var(--cyan), var(--acid));height:100%;transition:width 80ms linear;display:block}.arm-button{border:1px solid var(--line);min-height:32px;color:var(--text);background:var(--raised);cursor:pointer;border-radius:7px;justify-content:center;align-items:center;gap:6px;padding:0 10px;font-size:10px;font-weight:650;display:inline-flex}.arm-button:disabled{opacity:.4}.audio-label{color:var(--faint);align-items:center;gap:5px;font-size:9px;display:inline-flex}.timeline-panel{border:1px solid var(--line);background:linear-gradient(145deg,#16191bf5,#0d0f10fa);border-radius:18px;padding:12px;box-shadow:inset 0 1px #ffffff06,0 24px 80px #00000024}.timeline-wide{grid-column:1/-1;width:100%}.timeline-panel.is-capturing{border-color:#5fd9ff61;box-shadow:inset 0 0 0 1px #5fd9ff0d,0 20px 70px #125a6e17}.timeline-heading{min-height:42px;margin-bottom:8px}.capture-toggle.is-active{color:#071114;border-color:var(--cyan);background:var(--cyan);box-shadow:0 0 18px #5fd9ff29}.capture-strip{color:#9daeb4;background:#1430396b;border:1px solid #5fd9ff33;border-radius:7px;align-items:center;gap:10px;min-height:34px;margin:-1px 0 9px;padding:7px 10px;font-size:9px;line-height:1.4;display:flex}.capture-strip>span{color:var(--cyan);font-family:var(--mono);letter-spacing:.08em;flex:none;align-items:center;gap:6px;font-size:8px;font-weight:800;display:inline-flex}.capture-strip i{background:var(--cyan);border-radius:50%;width:6px;height:6px;animation:.8s ease-in-out infinite status-pulse;box-shadow:0 0 9px #5fd9ffbf}.timeline-panel.is-disabled .timeline-ruler,.timeline-panel.is-disabled .timeline-track,.timeline-panel.is-disabled .timeline-footer{opacity:.38}.timeline-ruler{color:var(--faint);font-family:var(--mono);justify-content:space-between;padding:0 3px 5px;font-size:8px;display:flex}.timeline-track{touch-action:none;background:#0a0c0d;border:1px solid #2d3336;border-radius:7px;height:142px;margin:0 2px;position:relative;box-shadow:inset 0 8px 30px #00000040}.signal-bars{opacity:.26;align-items:center;gap:2px;display:flex;position:absolute;inset:17px 7px 14px}.signal-bars span{background:linear-gradient(var(--cyan), #5fd9ff24);border-radius:1px;flex:1;min-width:0}.timeline-segments{grid-template-columns:repeat(16,1fr);display:grid;position:absolute;inset:0}.timeline-segments span{border-right:1px solid #8f979b14}.timeline-segments span:nth-child(4n){border-right-color:#8f979b33}.playhead{z-index:2;background:var(--orange);pointer-events:none;width:1px;position:absolute;top:0;bottom:0;box-shadow:0 0 9px #ff6540bf}.playhead:before{content:"";background:var(--orange);border-radius:50%;width:7px;height:7px;position:absolute;top:-1px;left:50%;transform:translate(-50%,-45%)}.cue-marker{z-index:3;width:28px;color:var(--cyan);cursor:ew-resize;touch-action:none;background:0 0;border:0;padding:0;position:absolute;top:0;bottom:0;transform:translate(-50%)}.marker-label{min-width:18px;height:16px;color:var(--cyan);font-family:var(--mono);background:#11191c;border:1px solid #5fd9ff57;border-radius:4px;place-items:center;padding:0 3px;font-size:8px;font-weight:750;display:grid;position:absolute;top:4px;left:50%;transform:translate(-50%);box-shadow:0 3px 9px #00000052}.marker-pin{background:#5fd9ffb3;width:1px;position:absolute;top:19px;bottom:4px;left:50%;box-shadow:0 0 6px #5fd9ff4d}.cue-marker:hover .marker-label,.cue-marker.is-selected .marker-label{color:#071114;border-color:var(--cyan);background:var(--cyan)}.cue-marker.is-selected .marker-pin{background:var(--cyan);width:2px}.marker-tooltip{z-index:7;border:1px solid var(--line-bright);color:var(--text);font-family:var(--mono);white-space:nowrap;background:#1b1f21;border-radius:4px;padding:4px 6px;font-size:8px;position:absolute;bottom:7px;left:50%;transform:translate(-50%);box-shadow:0 6px 18px #0006}.timeline-footer{color:var(--faint);justify-content:flex-end;align-items:center;gap:12px;padding-top:7px;font-size:8px;display:flex}.timeline-footer span:first-child{margin-right:auto}.legend-dot{border-radius:50%;width:5px;height:5px;margin-right:3px;display:inline-block}.cue-dot{background:var(--cyan)}.playhead-dot{background:var(--orange)}.pads-heading{min-height:48px}.pads-heading-actions{justify-content:flex-end;align-items:center;gap:7px;min-width:0;display:flex}.key-map{color:var(--faint);font-family:var(--mono);letter-spacing:.05em;text-align:right;font-size:8px}.remap-button{flex:none;min-height:29px}.controller-button{flex:none;min-height:29px;position:relative}.controller-button i{background:var(--acid);border-radius:50%;width:5px;height:5px;margin-left:-2px;box-shadow:0 0 8px #d9ff52b8}.controller-button.is-connected{color:var(--acid);background:#181f0cc2;border-color:#d9ff5242}.pad-grid{flex:1;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;display:grid}.pad{--pad-accent:var(--acid);background:#0d0f10;border:1px solid #303538;border-radius:10px;flex-direction:column;min-width:0;transition:border-color .12s,transform .12s,box-shadow .12s;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff06,0 5px 15px #0000002e}.pad:nth-child(4n+2),.pad:nth-child(4n+3){--pad-accent:#c6f1ff}.pad.is-selected{border-color:#5fd9ff9e;box-shadow:inset 0 0 0 1px #5fd9ff1a,0 0 14px #5fd9ff0f}.pad.is-active{border-color:#ff6540d9;box-shadow:inset 0 0 0 1px #ff65401f,0 0 20px #ff65401a}.pad.is-capture-ready:not(.is-captured){border-color:#5fd9ff4d}.pad.is-capture-ready:not(.is-captured) .pad-action{color:var(--cyan)}.pad.is-captured{border-color:var(--cyan);box-shadow:inset 0 0 0 1px #5fd9ff26,0 0 24px #5fd9ff29}.pad.pad.is-captured .pad-trigger{background:radial-gradient(circle at 50% 48%,#5fd9ff33,#0000 48%),linear-gradient(145deg,#17252a,#141b1e)}.pad.pad.is-captured .pad-pulse{border-color:var(--cyan);background:var(--cyan);box-shadow:0 0 10px #5fd9ffcc}.pad.pad.is-captured .pad-action,.pad.pad.is-captured .pad-timecode{color:var(--cyan)}.pad.is-pressed{transform:scale(.965)}.pad-trigger{width:100%;min-height:90px;color:var(--text);cursor:pointer;text-align:left;background:radial-gradient(circle at 50% 46%,#d9ff5209,#0000 45%),linear-gradient(145deg,#1c2022,#151719);border:0;flex-direction:column;flex:1;justify-content:space-between;padding:8px;transition:background .12s,filter .12s;display:flex}.pad-trigger:after{content:"";pointer-events:none;border-radius:9px 9px 0 0;position:absolute;inset:0 0 27px;box-shadow:inset 0 -5px 10px #0003,inset 0 1px #ffffff08}.pad-trigger:hover:not(:disabled){filter:brightness(1.1)}.pad-trigger:disabled{color:#71777a;background:linear-gradient(145deg,#171a1b,#121415)}.pad-topline{justify-content:space-between;align-items:center;width:100%;display:flex}.pad-number{color:var(--faint);font-family:var(--mono);font-size:8px;font-weight:700}.pad-topline kbd{min-width:23px;height:22px;color:var(--acid);font-family:var(--mono);background:#111411;border:1px solid #d9ff5252;border-radius:5px;place-items:center;padding:0 5px;font-size:10px;display:grid;box-shadow:inset 0 -2px #00000059}.pad-center{align-items:center;gap:5px;display:flex;position:absolute;top:42%;left:50%;transform:translate(-50%,-50%)}.pad-pulse{border:1px solid var(--faint);border-radius:50%;width:5px;height:5px}.pad-action{color:var(--faint);font-family:var(--mono);letter-spacing:.1em;font-size:7px;font-weight:700}.pad-timecode{z-index:1;color:var(--pad-accent);font-family:var(--mono);letter-spacing:-.04em;white-space:nowrap;font-size:clamp(8px,.75vw,11px);font-weight:650;position:relative}.pad.is-active .pad-trigger{background:radial-gradient(circle at 50% 48%,#ff65402e,#0000 48%),linear-gradient(145deg,#24201f,#191718)}.pad.is-active .pad-pulse{border-color:var(--orange);background:var(--orange);animation:1.2s ease-in-out infinite status-pulse;box-shadow:0 0 8px #ff6540b3}.pad.is-active .pad-action,.pad.is-active .pad-timecode{color:var(--orange)}.pad-time-input{height:27px;color:var(--faint);background:#0b0d0e;border-top:1px solid #292e30;align-items:center;gap:4px;padding:0 6px;display:flex}.pad-time-input:focus-within{color:var(--cyan);background:#0e1315}.pad-time-input.is-invalid{color:var(--danger);box-shadow:inset 0 0 0 1px #ff735a59}.pad-time-input input{width:100%;min-width:0;color:var(--muted);font-family:var(--mono);background:0 0;border:0;outline:0;padding:0;font-size:clamp(7px,.62vw,9px)}.pad-time-input input:focus{color:var(--text)}.pad-time-input input:disabled{opacity:.45}.pad-time-input>span:last-child{font-family:var(--mono);font-size:7px}.fine-tune{border:1px solid var(--line);background:#0d0f10;border-radius:9px;margin-top:9px;padding:9px}.fine-tune-label{color:var(--muted);align-items:center;gap:7px;margin-bottom:8px;font-size:9px;display:flex}.fine-tune-label svg{color:var(--cyan)}.fine-tune-label strong{color:var(--text);font-family:var(--mono);letter-spacing:.05em;margin-left:auto;font-size:8px}.nudge-controls{grid-template-columns:repeat(4,minmax(0,1fr)) 1.35fr;gap:5px;display:grid}.nudge-controls button{border:1px solid var(--line);min-width:0;height:30px;color:var(--muted);background:var(--raised);cursor:pointer;font-family:var(--mono);border-radius:6px;padding:0 4px;font-size:8px;font-weight:650}.nudge-controls button:hover:not(:disabled){color:var(--text);border-color:var(--line-bright)}.nudge-controls button:disabled{opacity:.35}.nudge-controls .preview-button{color:var(--acid);background:#131710;border-color:#d9ff523d;justify-content:center;align-items:center;gap:4px;display:inline-flex}.modal-backdrop{z-index:50;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#040506c7;place-items:center;padding:18px;display:grid;position:fixed;inset:0}.key-dialog{border:1px solid var(--line-bright);background:linear-gradient(145deg,#181b1d,#0e1011);border-radius:16px;width:min(680px,100%);max-height:min(850px,100vh - 36px);padding:18px;overflow-y:auto;box-shadow:0 30px 100px #0000009e,inset 0 1px #ffffff08}.key-dialog-header,.key-dialog-actions,.key-dialog-actions>div,.quick-key-heading{align-items:center;display:flex}.key-dialog-header,.key-dialog-actions{justify-content:space-between;gap:14px}.key-dialog-header h2{letter-spacing:-.025em;margin:0;font-size:18px}.dialog-close{border:1px solid var(--line);width:34px;height:34px;color:var(--muted);background:var(--raised);cursor:pointer;border-radius:8px;flex:none;place-items:center;display:grid}.key-dialog-copy{color:var(--muted);margin:12px 0 14px;font-size:11px;line-height:1.5}.remap-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;display:grid}.remap-pad{border:1px solid var(--line);min-height:64px;color:var(--muted);cursor:pointer;text-align:left;background:linear-gradient(145deg,#1d2123,#151719);border-radius:9px;grid-template-columns:1fr auto;align-items:center;padding:8px;display:grid}.remap-pad>span{font-family:var(--mono);align-self:start;font-size:8px}.remap-pad kbd{min-width:30px;height:28px;color:var(--acid);font-family:var(--mono);background:#101310;border:1px solid #d9ff5252;border-radius:6px;place-items:center;padding:0 5px;font-size:11px;display:grid}.remap-pad small{color:var(--faint);font-family:var(--mono);letter-spacing:.08em;grid-column:1/-1;align-self:end;font-size:7px}.remap-pad.is-listening{border-color:var(--cyan);background:#19424e9e;box-shadow:0 0 20px #5fd9ff1a}.remap-pad.is-listening kbd,.remap-pad.is-listening small{color:var(--cyan);border-color:var(--cyan)}.quick-key-section{border:1px solid var(--line);background:#0d0f10;border-radius:9px;margin-top:12px;padding:10px}.quick-key-heading{color:var(--text);gap:6px;margin-bottom:8px;font-size:9px;font-weight:650}.quick-key-heading svg{color:var(--cyan)}.quick-key-heading span{color:var(--faint);font-family:var(--mono);margin-left:auto;font-size:8px;font-weight:400}.quick-key-grid{grid-template-columns:repeat(10,minmax(0,1fr));gap:4px;display:grid}.quick-key-grid button{border:1px solid var(--line);min-width:0;height:27px;color:var(--muted);background:var(--raised);cursor:pointer;font-family:var(--mono);border-radius:5px;padding:0;font-size:8px}.quick-key-grid button.is-used{color:var(--acid);border-color:#d9ff5240}.quick-key-grid button:disabled{opacity:.32}.remap-message{min-height:18px;color:var(--cyan);font-family:var(--mono);margin:9px 1px;font-size:8px}.key-dialog-actions{border-top:1px solid var(--line);padding-top:11px}.key-dialog-actions>div{gap:7px}.save-map-button{color:#101406;background:var(--acid);cursor:pointer;border:0;border-radius:7px;min-height:32px;padding:0 13px;font-size:10px;font-weight:800}.notice{z-index:20;right:max(18px, env(safe-area-inset-right));bottom:max(18px, env(safe-area-inset-bottom));max-width:min(430px,100vw - 36px);min-height:42px;color:var(--text);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#13181af5;border:1px solid #5fd9ff52;border-radius:10px;align-items:center;gap:8px;padding:8px 9px 8px 12px;font-size:11px;display:flex;position:fixed;box-shadow:0 18px 60px #0000006b}.notice svg{color:var(--cyan);flex:none}.notice button{width:25px;height:25px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:5px;margin-left:auto;font-size:18px}.notice-error{border-color:#ff735a66}.notice-error svg{color:var(--danger)}.app-footer{color:#5f6669;justify-content:space-between;align-items:center;gap:18px;padding:13px 4px 0;font-size:8px;line-height:1.45;display:flex}@keyframes spin{to{transform:rotate(360deg)}}@keyframes slow-spin{to{transform:rotate(360deg)}}@keyframes status-pulse{0%,to{opacity:.55}50%{opacity:1}}@media (width<=980px){.workspace{grid-template-columns:1fr}.timeline-wide{grid-column:auto}.pad-grid{min-height:460px}.pad-timecode{font-size:11px}.pad-time-input input{font-size:9px}}@media (width<=720px){.app-shell{padding:12px 11px max(14px, env(safe-area-inset-bottom))}.topbar{min-height:45px;margin-bottom:10px}.brand{gap:8px}.brand-cluster{gap:6px}.brand-mark{width:26px;height:26px}.brand-tagline,.audio-label{display:none}.maker-link{padding:4px 6px;font-size:7px}.status-pill{min-height:28px;padding:0 8px;font-size:9px}.source-bar{grid-template-columns:minmax(0,1fr) auto auto;margin-bottom:10px;padding:6px}.source-input,.upload-button,.load-button{height:40px}.workspace{gap:10px}.source-deck,.pad-bank{border-radius:14px;padding:9px}.source-links>a.quiet-button{display:none}.local-media-stage--audio{padding:14px}.local-media-stage__audio-shell{padding:15px}.video-empty{grid-template-columns:.75fr 1.25fr;gap:8%;padding:24px}.empty-orbit{width:150px}.empty-orbit kbd{display:none}.orbit-play{width:55px;height:55px}.empty-copy h2{font-size:clamp(19px,6vw,30px)}.empty-copy p{display:none}.transport-clock{min-width:142px;font-size:8px}.arm-button span{display:none}.arm-button{width:34px;padding:0}.timeline-panel{padding:9px}.timeline-track{height:104px}.timeline-actions{flex-wrap:wrap;justify-content:flex-end}.timeline-actions .quiet-button:not(.capture-toggle){width:31px;padding:0;font-size:0}.timeline-actions .quiet-button:not(.capture-toggle) svg{width:14px}.timeline-actions .capture-toggle{min-width:96px;padding:0 8px;font-size:8px}.capture-strip{flex-direction:column;align-items:flex-start;gap:4px}.key-map{display:none}.pad-grid{gap:5px;min-height:0}.pad-trigger{min-height:78px;padding:6px}.pad-topline kbd{min-width:21px;height:20px}.pad-timecode{font-size:9px}.fine-tune{margin-top:7px;padding:7px}.modal-backdrop{padding:10px}.key-dialog{max-height:calc(100vh - 20px);padding:13px}.app-footer{flex-direction:column;align-items:flex-start;gap:3px}}@media (width<=480px){.source-bar{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.source-input{grid-column:1/-1}.upload-button,.load-button{width:100%}.local-media-stage__audio-wave{display:none}.local-media-stage__audio-visual{justify-content:center}.source-heading,.pads-heading{min-height:43px}.source-heading h1{max-width:185px}.video-empty{justify-content:center;padding:18px;display:flex}.empty-orbit{opacity:.34;width:170px;position:absolute}.empty-copy{text-align:center;max-width:250px}.empty-copy .eyebrow{margin-bottom:7px}.demo-button{margin-top:5px}.transport{gap:7px}.transport-clock{min-width:126px;font-size:7px}.timeline-heading h2{max-width:170px;font-size:10px}.timeline-heading{align-items:flex-start}.timeline-footer span:first-child{display:none}.pad-trigger{min-height:68px;padding:5px}.pad-timecode{font-size:7.5px}.pad-action{display:none}.pad-time-input{height:25px;padding:0 4px}.pad-time-input svg,.pad-time-input>span:last-child{display:none}.pad-time-input input{text-align:center;font-size:7px}.fine-tune-label span{display:none}.nudge-controls{grid-template-columns:repeat(4,minmax(0,1fr))}.nudge-controls .preview-button{grid-column:1/-1}.remap-grid{gap:5px}.remap-pad{min-height:58px;padding:6px}.quick-key-section{padding:7px}.quick-key-grid{gap:3px}.quick-key-grid button{height:25px}.key-dialog-actions{flex-direction:column;align-items:stretch}.key-dialog-actions>div{grid-template-columns:1fr 1.2fr;display:grid}.reset-map-button{align-self:flex-start}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}