:root{--safe-bottom: env(safe-area-inset-bottom, 0px)}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;background:#000;touch-action:none;-webkit-user-select:none;user-select:none}button{touch-action:manipulation}button:focus-visible{outline:2px solid rgba(255,255,255,.5);outline-offset:2px}#vj-root{position:fixed;inset:0}canvas#milkdrop{display:block;width:100%;height:100%;position:absolute;top:0;left:0;z-index:0}#p5-container{position:absolute;inset:0;z-index:1;pointer-events:none}.p5-deck-container{position:absolute;inset:0;pointer-events:none}#p5-container canvas{position:absolute!important;top:0!important;left:0!important;width:100%!important;height:100%!important}#ui-layer{position:absolute;inset:0;z-index:10;pointer-events:none}#start-overlay{position:fixed;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#000000b3;z-index:100;gap:16px;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#fff;padding:env(safe-area-inset-top,0) env(safe-area-inset-right,0) env(safe-area-inset-bottom,0) env(safe-area-inset-left,0);transition:opacity .4s}.start-ring{width:100px;height:100px;border:3px solid rgba(255,255,255,.3);border-radius:50%;position:relative;margin-bottom:16px;animation:pulse-ring 2s ease-in-out infinite,start-drift 12s ease-in-out infinite}.start-ring:after{content:"";position:absolute;top:50%;left:50%;width:40px;height:40px;background:#ffffffe6;border-radius:50%;transform:translate(-50%,-50%)}@keyframes pulse-ring{0%,to{transform:scale(1);border-color:#ffffff4d}50%{transform:scale(1.08);border-color:#fff9}}@keyframes start-drift{0%{translate:0 0}15%{translate:30vw -25vh}35%{translate:-25vw -15vh}55%{translate:20vw 20vh}75%{translate:-30vw 10vh}90%{translate:15vw -20vh}to{translate:0 0}}#start-overlay h1{font-size:1.6rem;font-weight:700;letter-spacing:.15em}#start-overlay .subtitle{font-size:.9rem;color:#fff9;text-align:center}.start-buttons{display:flex;gap:16px;align-items:center;margin-top:12px}#start-mic,#start-demo{padding:10px 24px;font-size:.85rem;font-weight:500;background:transparent;color:#ffffffb3;border:1px solid rgba(255,255,255,.25);border-radius:8px;cursor:pointer;-webkit-tap-highlight-color:transparent}#start-mic:active,#start-demo:active,#start-install:active{opacity:.5}#start-install{padding:8px 20px;font-size:.8rem;font-weight:500;background:transparent;color:#fff6;border:1px solid rgba(255,255,255,.15);border-radius:8px;cursor:pointer;-webkit-tap-highlight-color:transparent}#start-error{display:none;font-size:13px;color:#ff6b6b;max-width:280px;text-align:center}body.has-minibar .pb-status{display:none!important}@media(orientation:landscape)and (max-height:500px){#start-overlay{gap:8px}#start-overlay h1{font-size:1.2rem}.start-ring{width:60px;height:60px;margin-bottom:8px}.start-ring:after{width:24px;height:24px}.start-buttons{margin-top:4px}}#cockpit{position:fixed;inset:0;z-index:190;display:flex;flex-direction:column;font-family:IBM Plex Mono,monospace;font-size:13px;color:#00ff80d9;background:none;pointer-events:none;user-select:none;-webkit-user-select:none;perspective:1400px;opacity:0;visibility:hidden;filter:blur(6px);transform:scale(.9);transition:opacity .42s cubic-bezier(.16,.8,.24,1),filter .42s cubic-bezier(.16,.8,.24,1),transform .42s cubic-bezier(.16,.8,.24,1),visibility 0s linear .42s;will-change:opacity,transform,filter}#cockpit.open{opacity:1;visibility:visible;filter:blur(0);transform:scale(1);transition:opacity .42s cubic-bezier(.16,.8,.24,1),filter .42s cubic-bezier(.16,.8,.24,1),transform .42s cubic-bezier(.16,.8,.24,1),visibility 0s linear 0s}#cockpit .cp-header,#cockpit .cp-deck.deck-a,#cockpit .cp-deck.deck-b,#cockpit .cp-crossfader-row,#cockpit .cp-browser,#cockpit .cp-media-panel{opacity:0;transition:opacity .38s cubic-bezier(.16,.8,.24,1),transform .52s cubic-bezier(.16,.8,.24,1)}#cockpit .cp-header{transform:translateY(-28px);transition-delay:80ms}#cockpit .cp-deck.deck-a{transform:translate(-44px) rotateY(8deg);transform-origin:left center;transition-delay:.14s}#cockpit .cp-deck.deck-b{transform:translate(44px) rotateY(-8deg);transform-origin:right center;transition-delay:.14s}#cockpit .cp-crossfader-row{transform:scale(.85);transform-origin:center;transition-delay:.2s}#cockpit .cp-media-panel{transform:translateY(12px);transition-delay:.18s}#cockpit .cp-browser{transform:translateY(36px);transition-delay:.24s}#cockpit.open .cp-header,#cockpit.open .cp-deck.deck-a,#cockpit.open .cp-deck.deck-b,#cockpit.open .cp-crossfader-row,#cockpit.open .cp-browser,#cockpit.open .cp-media-panel{opacity:1;transform:translate(0) scale(1) rotateY(0)}#cockpit:not(.open) .cp-header,#cockpit:not(.open) .cp-deck.deck-a,#cockpit:not(.open) .cp-deck.deck-b,#cockpit:not(.open) .cp-crossfader-row,#cockpit:not(.open) .cp-browser,#cockpit:not(.open) .cp-media-panel{transition-delay:0s;transition-duration:.22s}@media(prefers-reduced-motion:reduce){#cockpit,#cockpit .cp-header,#cockpit .cp-deck.deck-a,#cockpit .cp-deck.deck-b,#cockpit .cp-crossfader-row,#cockpit .cp-browser,#cockpit .cp-media-panel{transition-duration:.12s!important;transition-delay:0s!important;filter:none!important}}.cp-header{display:flex;align-items:center;padding:8px 16px;gap:16px;flex-shrink:0;background:#00000080;border-bottom:1px solid rgba(0,255,128,.12);pointer-events:auto}.cp-bpm-section{display:flex;align-items:center;gap:6px}.cp-bpm-label{font-size:10px;opacity:.5;letter-spacing:1px}.cp-bpm{font-size:28px;font-weight:700;text-shadow:0 0 14px rgba(0,255,128,.5);min-width:50px;letter-spacing:2px;background:none;border:none;padding:0;margin:0;color:inherit;font-family:inherit;cursor:ns-resize;-webkit-tap-highlight-color:transparent}.cp-bpm-mode{background:none;border:1px solid rgba(0,255,128,.2);color:#00ff8080;font-family:inherit;font-size:8px;font-weight:700;padding:2px 6px;cursor:pointer;border-radius:2px;letter-spacing:1px;-webkit-tap-highlight-color:transparent}.cp-bpm-mode.manual{color:#ffc800e6;border-color:#ffc80066}.cp-bpm-editable{cursor:ns-resize;touch-action:none}.cp-bpm-adj{background:none;border:1px solid rgba(0,255,128,.15);color:#00ff8066;font-family:inherit;font-size:8px;padding:2px 6px;cursor:pointer;border-radius:2px;-webkit-tap-highlight-color:transparent}.cp-bpm-adj:active{color:#00ff80e6}.cp-fps{background:none;border:1px solid rgba(0,255,128,.2);color:#00ff8080;font-family:inherit;font-size:8px;font-weight:700;padding:2px 6px;border-radius:2px;letter-spacing:1px;white-space:nowrap;pointer-events:none;transition:color .2s ease,border-color .2s ease}.cp-fps.warn{color:#ff5555f2;border-color:#ff55558c;text-shadow:0 0 6px rgba(255,85,85,.5)}.cp-transition-select{display:flex;gap:2px;margin-left:auto}.cp-transition-btn{background:none;border:1px solid rgba(0,255,128,.15);color:#00ff8066;font-family:inherit;font-size:11px;padding:4px 10px;cursor:pointer;border-radius:2px;transition:all .15s;-webkit-tap-highlight-color:transparent}.cp-transition-btn.active{color:#00ff80f2;border-color:#00ff8066;text-shadow:0 0 8px rgba(0,255,128,.4)}.cp-close{background:none;border:none;color:#00ff8066;font-family:inherit;font-size:20px;cursor:pointer;padding:4px 8px;-webkit-tap-highlight-color:transparent}.cp-close:active{opacity:.5}.cp-main{display:grid;grid-template-columns:minmax(160px,220px) minmax(120px,1fr) minmax(160px,220px);grid-template-rows:minmax(0,1fr);flex:1;min-height:0;overflow:hidden;align-items:stretch;gap:12px;padding:0 12px}.cp-deck{--live-strength: 0;width:auto;max-width:220px;min-width:160px;min-height:0;height:100%;display:flex;flex-direction:column;padding:12px;font-size:14px;background:#000a0566;border:2px solid rgba(0,255,128,calc(.08 + var(--live-strength) * .72));box-shadow:0 0 calc(var(--live-strength) * 18px) rgba(0,255,128,calc(var(--live-strength) * .35));opacity:calc(.55 + var(--live-strength) * .45);pointer-events:auto;transition:opacity .2s}.deck-a{justify-self:start}.deck-b{justify-self:end}.cp-deck-label{font-size:11px;font-weight:700;letter-spacing:3px;text-align:center;margin-bottom:8px;opacity:calc(.35 + var(--live-strength) * .65);text-shadow:0 0 calc(var(--live-strength) * 16px) rgba(0,255,128,calc(var(--live-strength) * .7))}.cp-deck-layers{display:flex;flex-direction:column;gap:3px;flex:1;min-height:0;overflow-x:hidden;overflow-y:auto;scrollbar-width:thin;scrollbar-color:rgba(0,255,128,.2) transparent;margin-bottom:4px}.cp-layer-item{display:flex;align-items:center;gap:6px;padding:3px;border-radius:3px;background:#00ff800a;border:1px solid rgba(0,255,128,.08);flex-shrink:0}.cp-layer-md{flex-direction:column;position:relative}.cp-layer-md>.cp-layer-lock,.cp-layer-md>.cp-layer-remove{position:absolute;top:4px;right:4px;background:#00000073;backdrop-filter:blur(2px);border-radius:3px}.cp-layer-md>.cp-layer-lock{right:30px}.cp-layer-thumb-md{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:2px;pointer-events:none}.cp-layer-thumb-img{width:40px;height:22px;object-fit:cover;border-radius:1px;flex-shrink:0;pointer-events:none}.cp-layer-placeholder{display:flex;align-items:center;justify-content:center;background:#00ff8014;border:1px dashed rgba(0,255,128,.2);border-radius:2px;font-size:10px;font-weight:700;color:#00ff8066;pointer-events:none}.cp-layer-md .cp-layer-placeholder{width:100%;aspect-ratio:16/9}.cp-layer-p5 .cp-layer-placeholder{width:40px;height:22px;flex-shrink:0}.cp-layer-label{font-size:11px;opacity:.7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;line-height:1.2;flex:1;min-width:0}.cp-layer-md .cp-layer-label{white-space:normal;word-break:break-word;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.25;max-height:2.5em}.cp-layer-remove{font-size:14px;line-height:1;opacity:.5;cursor:pointer;padding:3px 6px;flex-shrink:0;-webkit-tap-highlight-color:transparent}.cp-layer-remove:hover{opacity:.8}.cp-image-style-row{display:flex;flex-wrap:wrap;gap:4px;padding:2px 4px;min-height:auto;background:none;border:none}.cp-image-style-row .cp-text-chip{font-size:10px;padding:3px 7px}.cp-image-counter{font-size:10px;font-weight:700;font-variant-numeric:tabular-nums;color:#00ff80e6;background:#00ff801a;border:1px solid rgba(0,255,128,.25);border-radius:3px;padding:1px 5px;margin:0 4px;flex-shrink:0;text-shadow:0 0 4px rgba(0,255,128,.3)}.cp-deck-fx-cols{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-bottom:6px;flex-shrink:0}.cp-deck-fx-col{display:flex;flex-direction:column;min-width:0}.cp-deck-fx-col-header{display:flex;align-items:center;justify-content:space-between;gap:4px;min-height:18px;margin-bottom:3px;padding-bottom:2px;border-bottom:1px solid rgba(0,255,128,.2)}.cp-deck-fx-col-header .cp-layer-lock{width:16px;height:16px;padding:1px;flex-shrink:0}.cp-deck-fx-col-header .cp-layer-lock svg{width:12px;height:12px}.cp-deck-fx-col-title{font-size:11px;font-weight:700;letter-spacing:1.5px;color:#00ff80d9;text-shadow:0 0 6px rgba(0,255,128,.3);line-height:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.cp-fx-item{background:none;border:1px solid rgba(0,255,128,.12);color:#00ff8059;font-family:inherit;font-size:10px;font-weight:600;padding:3px 4px;margin-bottom:2px;cursor:pointer;border-radius:2px;-webkit-tap-highlight-color:transparent;transition:background .12s,color .12s,border-color .12s;text-align:center;letter-spacing:.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.cp-fx-item:last-child{margin-bottom:0}.cp-fx-item:hover{color:#00ff80a6;border-color:#00ff8040}.cp-fx-blend-item.active{color:#00ff80;border-color:#00ff80a6;background:#00ff802e;text-shadow:0 0 6px rgba(0,255,128,.5)}.cp-fx-filter-item.on{color:#00ff80f2;border-color:#00ff808c;background:#00ff801f;text-shadow:0 0 6px rgba(0,255,128,.4)}.cp-deck-name{font-size:12px;text-align:center;line-height:1.3;margin-bottom:4px;opacity:.8;word-break:break-all;white-space:pre-line}.cp-deck-empty{opacity:.25;font-style:italic}.cp-deck-controls{display:flex;gap:8px;margin-top:auto;align-items:stretch}.cp-deck-controls-left{display:flex;gap:4px;flex:1;min-width:0}.cp-deck-btn{flex:1;background:none;border:1px solid rgba(0,255,128,.15);color:#00ff8099;font-family:inherit;font-size:10px;padding:6px 4px;cursor:pointer;text-align:center;border-radius:2px;-webkit-tap-highlight-color:transparent;transition:color .15s,border-color .15s,background .15s}.cp-deck-btn:active{opacity:.5}.cp-kill-btn{color:#ff5050e6;border:1px solid rgba(255,80,80,.4);background:#ff3c3c14;font-weight:700}.cp-kill-btn:hover{background:#ff3c3c2e;border-color:#ff505099}.cp-kill-btn:active{opacity:.5}.cp-deck-btn.active{color:#00ff80f2;border-color:#00ff8066}.cp-layer-lock{cursor:pointer;width:22px;height:22px;padding:3px;margin:0 1px;background:none;border:none;color:inherit;opacity:.35;display:inline-flex;align-items:center;justify-content:center;-webkit-tap-highlight-color:transparent;transition:opacity .12s ease,transform 80ms ease}.cp-layer-lock svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.cp-layer-lock:hover{opacity:.7}.cp-layer-lock:active{transform:scale(.88)}.cp-layer-lock.locked{opacity:1;color:#00ff80f2}.cp-track-icon{display:inline-flex;align-items:center;margin-right:4px;vertical-align:middle}.cp-track-icon svg{width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}.cp-text-chip-row{display:flex;align-items:center;gap:4px;padding:2px 3px;pointer-events:auto;min-width:0}.cp-text-chip-row.collapsed .cp-text-chips{display:none}.cp-text-chip-label{font-size:9px;font-weight:700;opacity:.4;min-width:20px;cursor:pointer;padding:2px 0;-webkit-tap-highlight-color:transparent}.cp-text-chip-label:active{opacity:.8}.cp-text-chip-label .cp-text-toggle{font-size:7px;margin-left:1px}.cp-text-chips{display:flex;flex-wrap:wrap;gap:2px;flex:1;min-width:0;overflow:hidden}.cp-text-chip{background:none;border:1px solid rgba(0,255,128,.1);color:#00ff804d;font-size:9px;padding:3px 5px;cursor:pointer;border-radius:2px;-webkit-tap-highlight-color:transparent;transition:all .15s;white-space:nowrap}.cp-text-chip.on{color:#00ff80f2;border-color:#00ff8080;background:#00ff801f;text-shadow:0 0 6px rgba(0,255,128,.4)}.cp-text-chip:active{opacity:.5}.cp-text-size-slider{flex:1 1 0;min-width:0;-webkit-appearance:none;appearance:none;height:4px;background:#00ff8026;border-radius:2px;outline:none}.cp-text-size-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:#00ff80cc;cursor:pointer}.cp-text-pos-sliders{display:flex;flex-direction:column;gap:2px;flex:1;min-width:0}.cp-text-pos-row{display:flex;align-items:center;gap:4px}.cp-text-size-val{font-size:9px;min-width:28px;text-align:right;opacity:.6}.cp-fav-btn{flex:0 0 auto;min-width:36px;font-size:14px;color:#ffc832e6;border:1px solid rgba(255,200,50,.35);background:#ffc8320f;text-shadow:0 0 6px rgba(255,200,50,.35)}.cp-fav-btn:hover{background:#ffc83226;border-color:#ffc8328c}.cp-rec-btn.active{color:#ff3c3cf2;border-color:#ff3c3c66;animation:cp-rec-pulse 1s infinite}@keyframes cp-rec-pulse{0%,to{opacity:1}50%{opacity:.5}}.cp-output{min-width:120px;position:relative;background:transparent}.cp-output-label{position:absolute;top:12px;left:50%;transform:translate(-50%);font-size:10px;opacity:.2;letter-spacing:3px;pointer-events:none}.cp-crossfader-row{display:flex;align-items:center;padding:12px 20px;gap:12px;pointer-events:auto;background:#00000080;border-top:1px solid rgba(0,255,128,.12);flex-shrink:0;position:relative}.cp-crossfader-row:before{content:"";position:absolute;left:50%;top:50%;width:2px;height:14px;background:#00ff8073;box-shadow:0 0 4px #00ff8059;transform:translate(-50%,-50%);pointer-events:none;z-index:1}.cp-cf-btn{font-size:13px;font-weight:700;min-width:52px;padding:6px;text-align:center;font-variant-numeric:tabular-nums;background:none;border:1px solid rgba(0,255,128,.15);color:#00ff8066;font-family:inherit;border-radius:3px;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:color .3s,border-color .3s,background .3s,text-shadow .3s}.cp-cf-btn:active{opacity:.5}.cp-cf-btn.live{color:#00ff80;border-color:#00ff8080;background:#00ff8014;text-shadow:0 0 12px rgba(0,255,128,.6)}.cp-crossfader{flex:1;-webkit-appearance:none;appearance:none;height:8px;background:linear-gradient(to right,#00ff804d,#00ff800f 45% 55%,#00ff804d);border-radius:4px;outline:none;cursor:pointer;position:relative}.cp-crossfader::-webkit-slider-thumb{-webkit-appearance:none;width:36px;height:36px;background:radial-gradient(circle at center,#00ff80e6,#00ff8099);border:2px solid rgba(0,255,128,.8);border-radius:6px;cursor:grab;box-shadow:0 0 16px #00ff8059,inset 0 0 4px #ffffff26}.cp-crossfader::-moz-range-thumb{width:36px;height:36px;background:radial-gradient(circle at center,#00ff80e6,#00ff8099);border:2px solid rgba(0,255,128,.8);border-radius:6px;cursor:grab;box-shadow:0 0 16px #00ff8059,inset 0 0 4px #ffffff26}.cp-crossfader:active::-webkit-slider-thumb{cursor:grabbing}.cp-crossfader:active::-moz-range-thumb{cursor:grabbing}.cp-browser{background:#00000080;border-top:1px solid rgba(0,255,128,.12);pointer-events:auto;flex-shrink:0}.cp-browser-header{display:flex;align-items:center;padding:8px 12px 4px;gap:8px}.cp-browser-tabs{display:flex;gap:2px;flex-shrink:0}.cp-browser-tab{background:none;border:1px solid rgba(0,255,128,.12);color:#00ff8066;font-family:inherit;font-size:10px;padding:3px 8px;cursor:pointer;border-radius:2px;-webkit-tap-highlight-color:transparent;transition:all .15s}.cp-browser-tab.active{color:#00ff80f2;border-color:#00ff8059}.cp-browser-search{flex:1;min-width:0;background:#00ff800a;border:1px solid rgba(0,255,128,.12);border-radius:2px;color:#00ff80d9;font-family:inherit;font-size:11px;padding:4px 8px;outline:none}.cp-browser-search::placeholder{color:#00ff8040}.cp-browser-search:focus{border-color:#00ff804d}.cp-browser-list{display:flex;flex-direction:row;gap:6px;padding:6px 12px 8px;overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;scrollbar-width:auto;scrollbar-color:rgba(0,255,128,.5) rgba(0,10,5,.5)}.cp-browser-list::-webkit-scrollbar{height:10px}.cp-browser-list::-webkit-scrollbar-track{background:#000a0580;border-radius:5px}.cp-browser-list::-webkit-scrollbar-thumb{background:#00ff8080;border-radius:5px}.cp-browser-list::-webkit-scrollbar-thumb:hover{background:#00ff80b3}.cp-browser-list::-webkit-scrollbar-thumb:active{background:#00ff80e6}.cp-browser-list{cursor:grab}.cp-browser-list:active{cursor:grabbing}.cp-preset-card{flex-shrink:0;width:100px;height:60px;background:#00ff8008;border:1px solid rgba(0,255,128,.12);border-radius:3px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:11px;padding:4px 6px;cursor:grab;word-break:break-word;line-height:1.3;overflow:hidden;transition:border-color .15s,background .15s}.cp-preset-card:active{border-color:#00ff8080;background:#00ff800f}.cp-preset-card.md{border-left:2px solid rgba(128,160,255,.4)}.cp-preset-card.p5{border-left:2px solid rgba(0,255,128,.4)}.cp-deckfav-card{border:1px solid rgba(0,220,255,.55);background:#00dcff0f;flex-direction:column;gap:2px;position:relative;padding:4px 6px}.cp-deckfav-card .cp-card-tag{color:#00dcffe6;font-size:9px;letter-spacing:.5px;font-weight:700;opacity:1}.cp-deckfav-card .cp-deckfav-name{color:#dcf5fff2;font-weight:700;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.cp-deckfav-card .cp-deckfav-summary{color:#00dcff99;font-size:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.cp-deckfav-card:hover{border-color:#00dcffd9;background:#00dcff1a}.cp-deckfav-card:active{border-color:#00dcff;background:#00dcff2e}.cp-deckfav-card.cp-deckfav-thumb{flex-direction:row;align-items:center;justify-content:flex-start;padding:0}.cp-deckfav-card.cp-deckfav-thumb .cp-card-label{position:relative;z-index:1;text-shadow:0 1px 3px rgba(0,0,0,.9),0 0 6px rgba(0,0,0,.7);font-size:8px;padding:2px 4px}.cp-deckfav-card.cp-deckfav-thumb .cp-card-tag{z-index:1;text-shadow:0 1px 2px rgba(0,0,0,.9)}.cp-card-promo{order:998}.cp-fav-reset-card{order:999;border:1px dashed rgba(0,255,128,.5);background:#00ff800a;justify-content:center;align-items:center;cursor:pointer}.cp-fav-reset-card .cp-card-label{color:#00ff80e6;font-size:10px;font-weight:700;letter-spacing:.5px}.cp-fav-reset-card:hover{border-color:#00ff80f2;background:#00ff801f}.cp-card-del{display:none;position:absolute;top:1px;right:1px;width:16px;height:16px;padding:0;border:1px solid rgba(255,80,80,.55);background:#140000bf;color:#ff7878f2;font-size:12px;line-height:1;border-radius:2px;cursor:pointer;z-index:3;pointer-events:auto}.cp-card-del:hover{background:#500000e6;color:#ff6464;border-color:#ff5050f2}.cp-card-del:active{background:#780000}.browser-fav-mode .cp-preset-card .cp-card-del,.cp-deckfav-card .cp-card-del{display:flex;align-items:center;justify-content:center}.cp-jump-target{border-color:#00ff80cc!important;box-shadow:0 0 12px #00ff8066}.cp-card-num{position:absolute;top:2px;left:3px;font-size:11px;font-weight:700;opacity:.65;text-shadow:0 1px 3px rgba(0,0,0,.9);z-index:1}.cp-card-tag{position:absolute;top:2px;right:3px;font-size:7px;opacity:.35;letter-spacing:.5px}.cp-card-thumb{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:2px;opacity:.7;pointer-events:none;-webkit-user-drag:none;user-select:none}.cp-preset-card.has-thumb .cp-card-label{position:relative;z-index:1;text-shadow:0 1px 3px rgba(0,0,0,.9),0 0 6px rgba(0,0,0,.7);font-size:8px}.cp-preset-card.has-thumb .cp-card-tag{z-index:1;text-shadow:0 1px 2px rgba(0,0,0,.9)}.cp-card-label{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:break-word;line-height:1.3}.cp-preset-card{position:relative}@media(max-width:900px){.cp-header{background:none;border-bottom:none;padding:3px 8px;gap:4px;overflow-x:auto;flex-wrap:nowrap;text-shadow:0 0 8px rgba(0,255,128,.4)}.cp-header::-webkit-scrollbar{display:none}.cp-bpm{font-size:13px;min-width:auto;letter-spacing:1px;text-shadow:0 0 8px rgba(0,255,128,.5)}.cp-bpm-section{gap:3px}.cp-bpm-label{font-size:9px}.cp-bpm-mode,.cp-bpm-adj{border:none;padding:2px 3px;font-size:8px}.cp-fps{font-size:9px}.cp-transition-select{gap:0}.cp-transition-btn{border:none;border-radius:0;padding:4px 6px;font-size:10px;background:none}.cp-transition-btn.active{color:#00ff80;text-shadow:0 0 10px rgba(0,255,128,.6)}.cp-close{font-size:16px;padding:2px 6px}.cp-crossfader-row{background:none;border-top:none;padding:2px 12px;gap:8px}.cp-cf-btn{border:none;background:none;font-size:12px;min-width:24px;padding:2px 0;text-shadow:0 0 6px rgba(0,255,128,.4)}.cp-cf-btn.live{text-shadow:0 0 10px rgba(0,255,128,.7)}.cp-output-label{display:none}}@media(max-width:900px)and (orientation:landscape){.cp-main{grid-template-columns:minmax(100px,130px) minmax(100px,1fr) minmax(100px,130px);gap:6px;padding:0 6px}.cp-deck{max-width:130px;min-width:100px;padding:6px;font-size:11px;border-width:1px}.cp-deck-label{font-size:9px;margin-bottom:3px}.cp-layer-item{padding:2px;gap:4px}.cp-layer-thumb-img,.cp-layer-p5 .cp-layer-placeholder{width:28px;height:16px}.cp-layer-label{font-size:10px}.cp-layer-remove{font-size:12px;padding:2px 4px}.cp-deck-fx-cols{gap:3px;margin-bottom:4px}.cp-deck-fx-col-header{min-height:14px;margin-bottom:2px;padding-bottom:1px}.cp-deck-fx-col-title{font-size:10px;letter-spacing:0}.cp-fx-item{font-size:9px;padding:2px 3px;margin-bottom:1px}.cp-deck-btn{font-size:9px;padding:3px 4px}.cp-deck-controls{gap:4px}.cp-deck-controls-left{gap:3px}.cp-bpm{font-size:16px}.cp-header{padding:3px 10px;gap:8px}.cp-crossfader-row{padding:3px 12px}.cp-crossfader{height:12px}.cp-crossfader::-webkit-slider-thumb{width:12px;height:12px}.cp-crossfader::-moz-range-thumb{width:12px;height:12px}.cp-cf-btn{font-size:11px;min-width:20px}.cp-browser-header{padding:2px 8px 1px}.cp-browser-tab{padding:1px 6px;font-size:9px}.cp-browser-search{height:18px;font-size:10px;padding:2px 6px}.cp-browser-list{padding:2px 6px 3px;gap:4px}.cp-preset-card{width:68px;height:38px;font-size:8px}.cp-deckfav-card{height:38px}.cp-browser-scroll-btn{width:20px;font-size:12px}.cp-media-panel{padding:3px 10px;gap:6px}.cp-media-panel .cp-text-chip{font-size:10px;padding:4px 8px}.cp-media-panel .cp-video-time{font-size:10px;min-width:64px}.cp-media-panel .cp-video-prog{height:16px}}@media(max-width:399px)and (orientation:portrait){.cp-deck-fx-col-title{font-size:9px;letter-spacing:0}}@media(max-width:900px)and (orientation:portrait){.cp-main{grid-template-columns:1fr 1fr;grid-template-rows:auto minmax(0,1fr);grid-template-areas:"output output" "deck-a deck-b";gap:0;padding:0}.cp-output{grid-area:output;aspect-ratio:16 / 9;border-bottom:1px solid rgba(0,255,128,.15)}.cp-deck{max-width:none;min-width:0;padding:8px;font-size:12px}.cp-deck.deck-a{grid-area:deck-a;justify-self:stretch}.cp-deck.deck-b{grid-area:deck-b;justify-self:stretch}.cp-preset-card{width:80px;height:50px;font-size:8px}.cp-browser-list{padding:4px 8px 8px}}.cp-media-panel{display:none;flex-direction:column;padding:8px 16px;gap:8px;pointer-events:auto;background:#00000059;border-top:1px solid rgba(0,255,128,.1);flex-shrink:0}.cp-media-panel:not(:empty){display:flex}.cp-media-row{display:flex;align-items:center;gap:10px;flex-wrap:nowrap;min-width:0}.cp-media-row .cp-video-prog-wrap{flex:1 1 auto;min-width:100px;height:24px}.cp-media-chips-inline{flex:0 0 auto;gap:4px}.cp-media-chips-row{flex-wrap:wrap;gap:6px}.cp-media-panel .cp-text-chip{font-size:12px;padding:6px 10px;border-radius:3px}.cp-media-panel .cp-text-chip-label{font-size:11px;min-width:auto}.cp-media-panel .cp-video-time{font-size:11px;min-width:80px}.cp-media-panel .cp-video-prog{height:24px}.cp-media-panel .cp-video-prog::-webkit-slider-runnable-track{height:6px}.cp-media-panel .cp-video-prog::-moz-range-track{height:6px}.cp-media-panel .cp-video-prog::-webkit-slider-thumb{width:16px;height:16px;margin-top:-5px}.cp-media-panel .cp-video-prog::-moz-range-thumb{width:16px;height:16px}.cp-video-prog-row{display:flex;align-items:center;gap:6px;padding:4px 3px;pointer-events:auto}.cp-video-prog-wrap{position:relative;flex:1;min-width:0;height:18px}.cp-video-prog{width:100%;height:18px;appearance:none;-webkit-appearance:none;background:transparent;cursor:pointer;margin:0}.cp-video-prog::-webkit-slider-runnable-track{height:4px;background:#00ff8026;border-radius:2px}.cp-video-prog::-moz-range-track{height:4px;background:#00ff8026;border-radius:2px}.cp-video-prog::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;margin-top:-4px;background:#00ff80e6;border-radius:50%;box-shadow:0 0 6px #00ff8080;cursor:grab}.cp-video-prog::-moz-range-thumb{width:12px;height:12px;background:#00ff80e6;border:none;border-radius:50%;box-shadow:0 0 6px #00ff8080;cursor:grab}.cp-video-cue{position:absolute;top:3px;bottom:3px;width:2px;background:#ffc800e6;box-shadow:0 0 4px #ffc80099;pointer-events:none;display:none;transform:translate(-1px)}.cp-video-pins-overlay{position:absolute;inset:0;pointer-events:none}.cp-video-pin-marker{position:absolute;top:0;bottom:0;width:2px;background:#ffc800d9;box-shadow:0 0 4px #ffc80080;transform:translate(-1px);display:none;font-size:8px;color:#ffdc50e6;text-align:center;line-height:10px}.cp-video-pin-marker:before{content:attr(data-idx)}.cp-pin-chip{font-variant-numeric:tabular-nums;position:relative;overflow:hidden}.cp-pin-chip:after{content:"";position:absolute;top:0;bottom:0;left:0;width:0;background:#ff3c3c80;box-shadow:inset 0 0 8px #ff646499;pointer-events:none}.cp-pin-chip.charging:after{width:100%;transition:width .9s linear}.cp-drag-chip{cursor:ns-resize;touch-action:none}.cp-text-adv-body{display:flex;flex-direction:column;gap:2px}.cp-text-adv-body.collapsed{display:none}.cp-text-adv-toggle .cp-text-chip-label{cursor:pointer}.cp-trans-drag{min-width:80px;text-align:center;touch-action:none;cursor:ns-resize}.cp-loop-chip{font-variant-numeric:tabular-nums;min-width:48px;text-align:center;padding:6px 10px;box-sizing:border-box}.cp-loop-val{font-variant-numeric:tabular-nums;font-size:13px;font-weight:700;color:#00ff80e6;text-shadow:0 0 6px rgba(0,255,128,.4);padding:6px 10px;min-width:72px;text-align:center;background:#00ff8014;border:1px solid rgba(0,255,128,.2);border-radius:3px;box-sizing:border-box}.cp-loop-editable{cursor:ns-resize;touch-action:none;-webkit-user-select:none;user-select:none}.cp-video-time{font-size:9px;color:#00ff8099;font-family:inherit;flex-shrink:0;min-width:64px;text-align:right}.cp-toast{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(.8);background:#00140af2;border:1px solid rgba(0,255,128,.5);color:#00ff80f2;font-family:inherit;font-size:16px;font-weight:700;letter-spacing:3px;padding:16px 32px;border-radius:4px;pointer-events:none;opacity:0;transition:opacity .2s,transform .2s;text-shadow:0 0 16px rgba(0,255,128,.6);box-shadow:0 0 30px #00ff8026;z-index:100}.cp-toast.show{opacity:1;transform:translate(-50%,-50%) scale(1)}@supports (padding: env(safe-area-inset-bottom)){.cp-browser{padding-bottom:env(safe-area-inset-bottom,0px)}.cp-header{padding-top:calc(8px + env(safe-area-inset-top,0px))}.cp-crossfader-row{padding-left:calc(20px + env(safe-area-inset-left,0px));padding-right:calc(20px + env(safe-area-inset-right,0px))}}.cp-browser-wrap{position:relative;display:flex;align-items:stretch;min-height:0}.cp-browser-scroll-btn{flex-shrink:0;width:28px;background:#000a05cc;border:1px solid rgba(0,255,128,.2);color:#00ff80b3;font-size:14px;cursor:pointer;-webkit-tap-highlight-color:transparent;z-index:2}.cp-browser-scroll-btn:hover{background:#00ff801a;color:#00ff80}.cp-browser-scroll-btn:active{background:#00ff8033}.cp-track-input{flex:1;min-width:0;padding:4px 8px;font:11px/1.4 IBM Plex Mono,monospace;background:#00ff8014;border:1px solid rgba(0,255,128,.2);border-radius:3px;color:#00ff80e6;outline:none}.cp-track-input::placeholder{color:#00ff804d}.cp-track-input:focus{border-color:#00ff8080}