:root{--bg-primary:#06070d;--bg-panel:#0a0d18d1;--bg-panel-border:#00f0ff40;--accent-cyan:#00f0ff;--accent-magenta:#ff007f;--accent-purple:#9d4edd;--accent-green:#0f8;--accent-gold:#fa0;--text-main:#f0f4f8;--text-muted:#8e9bb0;--font-display:"Orbitron", -apple-system, BlinkMacSystemFont, sans-serif;--font-sans:"Outfit", -apple-system, BlinkMacSystemFont, sans-serif}*{box-sizing:border-box;-webkit-user-select:none;user-select:none;margin:0;padding:0}body,html{background-color:var(--bg-primary);width:100%;height:100%;font-family:var(--font-sans);color:var(--text-main);-webkit-font-smoothing:antialiased;justify-content:center;align-items:center;display:flex;overflow:hidden}#stream-viewport{aspect-ratio:9/16;background:#000;width:100%;max-width:56.25vh;height:100%;position:relative;overflow:hidden;box-shadow:0 0 50px #000c,0 0 1px #00f0ff4d}@media (aspect-ratio<=9/16){#stream-viewport{width:100vw;max-width:100vw;height:100vh;box-shadow:none}}#bg-video-container{z-index:1;pointer-events:none;width:100%;height:100%;transition:opacity .5s;position:absolute;top:0;left:0;overflow:hidden}#bg-video{object-fit:cover;opacity:.9;filter:contrast(1.15)brightness(.9)saturate(1.25);width:100%;height:100%}#canvas-container{z-index:2;width:100%;height:100%;position:absolute;top:0;left:0}#canvas-container canvas{display:block;width:100%!important;height:100%!important}#loading-indicator{z-index:50;border:1px solid var(--accent-cyan);pointer-events:none;background:#0a0d18eb;border-radius:16px;flex-direction:column;align-items:center;gap:12px;padding:24px 32px;transition:opacity .4s;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 30px #00f0ff4d}.spinner{border:3px solid #00f0ff33;border-top-color:var(--accent-cyan);border-radius:50%;width:38px;height:38px;animation:.8s linear infinite spin}.loading-text{font-family:var(--font-display);letter-spacing:2px;color:var(--accent-cyan);font-size:13px}#overlay-layer{z-index:10;pointer-events:none;flex-direction:column;justify-content:space-between;width:100%;height:100%;padding:16px;display:flex;position:absolute;top:0;left:0}.glass-panel{background:var(--bg-panel);-webkit-backdrop-filter:blur(14px);border:1px solid var(--bg-panel-border);pointer-events:auto;border-radius:12px;box-shadow:0 8px 32px #00000080,inset 0 1px #ffffff1a}.hud-draggable-card{cursor:grab;cursor:-webkit-grab;-webkit-user-select:none;user-select:none;touch-action:none;z-index:15;transition:box-shadow .2s,border-color .2s,transform .15s;position:absolute}.hud-draggable-card:hover{border-color:#00f0ffbf;box-shadow:0 10px 36px #000000d9,0 0 20px #00f0ff59}.hud-draggable-card.is-dragging{cursor:grabbing;cursor:-webkit-grabbing;opacity:.96;transform:scale(1.02);z-index:50!important;border-color:#00f0ff!important;box-shadow:0 14px 40px #000000e6,0 0 30px #00f0ff99!important}.drag-handle{color:#fff6;cursor:grab;cursor:-webkit-grab;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;padding:4px 6px;transition:color .2s,background .2s;display:inline-flex}.drag-handle.small{padding:1px 3px}.hud-draggable-card:hover .drag-handle{color:var(--accent-cyan);background:#00f0ff26}.now-playing-card{-webkit-backdrop-filter:blur(24px);border:2.5px solid #00f0ffcc;border-left:8px solid var(--accent-cyan);background:#030716f5;border-radius:20px;align-items:center;gap:clamp(14px,2vw,20px);width:calc(100% - 32px);max-width:860px;padding:clamp(14px,2vw,22px) clamp(16px,2.5vw,26px);display:flex;box-shadow:0 14px 45px #000000f2,0 0 35px #00f0ff59,inset 0 1px #ffffff40}.vinyl-icon{border:3px solid var(--accent-cyan);background:#09090b;border-radius:16px;justify-content:center;align-items:center;width:clamp(75px,9.5vw,98px);min-width:clamp(75px,9.5vw,98px);height:clamp(75px,9.5vw,98px);display:flex;overflow:hidden;box-shadow:0 0 22px #00f0ffa6}.vinyl-icon img{object-fit:cover;width:100%;height:100%}.track-info{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.track-label-row{justify-content:space-between;align-items:center;gap:10px;display:flex}.track-label{letter-spacing:3px;color:var(--accent-cyan);font-size:clamp(14px,1.8vw,18px);font-family:var(--font-display);text-transform:uppercase;text-shadow:0 0 12px #00f0ffcc;font-weight:900}.track-req-pill{color:#fff;white-space:nowrap;text-shadow:0 1px 4px #000c;background:#00f0ff40;border:2px solid #00f0ffd9;border-radius:14px;padding:4px 12px;font-size:clamp(13px,1.6vw,16px);font-weight:800}.track-title{color:#fff;white-space:nowrap;text-overflow:ellipsis;text-shadow:0 2px 10px #000,0 0 20px #ffffff73;letter-spacing:.6px;font-size:clamp(23px,3.4vw,34px);font-weight:900;line-height:1.25;overflow:hidden}.track-meta{color:#f1f5f9;white-space:nowrap;text-overflow:ellipsis;text-shadow:0 2px 8px #000;align-items:center;gap:10px;font-size:clamp(17px,2.3vw,23px);font-weight:800;display:flex;overflow:hidden}.equalizer-bars{align-items:flex-end;gap:5px;min-width:36px;height:clamp(34px,4.5vw,44px);display:flex}.eq-bar{background:linear-gradient(to top, var(--accent-cyan), var(--accent-magenta));border-radius:3px;width:5px;height:10px;transition:height 80ms}.hud-queue-toast{border:2px solid var(--accent-cyan);-webkit-backdrop-filter:blur(20px);z-index:99;opacity:0;pointer-events:none;background:#050918f7;border-left:6px solid #10b981;border-radius:16px;align-items:center;gap:14px;max-width:90%;padding:12px 22px;transition:all .35s cubic-bezier(.16,1,.3,1);display:flex;position:absolute;top:96px;left:50%;transform:translate(-50%)translateY(-20px)scale(.95);box-shadow:0 14px 45px #000000f2,0 0 30px #00f0ff73}.hud-queue-toast.active{opacity:1;pointer-events:auto;transform:translate(-50%)translateY(0)scale(1)}.queue-toast-icon{flex-shrink:0;font-size:28px}.queue-toast-body{flex-direction:column;gap:3px;min-width:0;display:flex}.queue-toast-badge{letter-spacing:2px;color:#34d399;text-transform:uppercase;font-size:12px;font-weight:900}.queue-toast-title{color:#fff;white-space:nowrap;text-overflow:ellipsis;text-shadow:0 2px 6px #000;font-size:18px;font-weight:900;overflow:hidden}.queue-toast-meta{color:#cbd5e1;font-size:14px;font-weight:700}.live-badge-group{-webkit-backdrop-filter:blur(18px);background:#060a18f2;border:2px solid #ffffff40;border-radius:24px;align-items:center;gap:10px;padding:8px 16px;display:inline-flex;box-shadow:0 8px 30px #000000d9}.badge{letter-spacing:1.2px;text-transform:uppercase;font-size:14px;font-weight:900;font-family:var(--font-display);border-radius:18px;align-items:center;gap:8px;padding:7px 15px;display:flex}.badge-live{color:#f37;background:#ff004b4d;border:2px solid #f05;box-shadow:0 0 14px #f056}.badge-live .pulse-dot{background:#f05;border-radius:50%;width:10px;height:10px;animation:1.2s ease-in-out infinite blink;box-shadow:0 0 12px #f05}@keyframes blink{0%,to{opacity:1;transform:scale(1)}50%{opacity:.3;transform:scale(.8)}}.badge-energy{border:2px solid var(--accent-cyan);color:var(--accent-cyan);background:#00f0ff38}.ducking-badge{border:2px solid var(--accent-green);color:var(--accent-green);background:#00ff884d;border-radius:14px;padding:6px 14px;font-size:13px;font-weight:900}.ducking-badge.active{border-color:var(--accent-magenta);color:var(--accent-magenta);background:#ff007f66;animation:.8s infinite blink}.instructions-card{-webkit-backdrop-filter:blur(24px);border:2.5px solid #00f0ffcc;border-left:8px solid var(--accent-magenta);background:#030716f5;border-radius:20px;flex-direction:column;gap:12px;width:calc(100% - 32px);max-width:860px;padding:clamp(14px,2vw,20px) clamp(16px,2.5vw,24px);display:flex;box-shadow:0 14px 45px #000000f2,0 0 35px #ff008040}.instructions-header{border-bottom:1.5px solid #ffffff29;align-items:center;gap:12px;padding-bottom:8px;display:flex}.instructions-title{font-family:var(--font-display);letter-spacing:2px;color:var(--accent-cyan);text-transform:uppercase;text-shadow:0 0 12px #00f0ffb3;font-size:clamp(16px,2.1vw,22px);font-weight:900}.instructions-grid{flex-direction:column;gap:10px;display:flex}.instruction-row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.instruction-chip{font-family:var(--font-display);color:#fff;border:2px solid var(--accent-cyan);letter-spacing:.8px;white-space:nowrap;background:linear-gradient(135deg,#00f0ff40,#ff007f40);border-radius:12px;padding:5px 14px;font-size:clamp(17px,2.3vw,23px);font-weight:900;box-shadow:0 0 14px #00f0ff66}.instruction-chip.alt{border-color:var(--accent-magenta);box-shadow:0 0 14px #ff007f66}.instruction-chip.gold{border-color:var(--accent-gold);box-shadow:0 0 14px #ffd70066}.instruction-desc{color:#fff;text-shadow:0 2px 8px #000;font-size:clamp(16px,2.2vw,22px);font-weight:700;line-height:1.3}.chat-feed-box{-webkit-backdrop-filter:blur(20px);background:#060a18f2;border:2px solid #00f0ff8c;border-radius:16px;flex-direction:column;gap:10px;width:calc(100% - 32px);max-width:560px;max-height:280px;padding:14px 18px;display:flex;box-shadow:0 12px 42px #000000e6}.chat-feed-top-bar{border-bottom:1px solid #ffffff29;justify-content:space-between;align-items:center;padding-bottom:8px;display:flex}.chat-title-group{align-items:center;gap:8px;display:flex}.chat-panel-heading{font-family:var(--font-display);letter-spacing:2px;color:var(--accent-cyan);font-size:14px;font-weight:900}.btn-hud-reset-pos{color:#c4d1e6;cursor:pointer;background:#ffffff1f;border:1px solid #ffffff4d;border-radius:12px;padding:4px 10px;font-size:12px;font-weight:800;transition:all .2s}.btn-hud-reset-pos:hover{border-color:var(--accent-cyan);color:#fff;background:#00f0ff40}.chat-bubbles-container{flex-direction:column;gap:8px;display:flex;overflow:hidden}.chat-bubble{border:1px solid #ffffff26;border-left:4.5px solid var(--accent-cyan);background:#101730f0;border-radius:10px;flex-direction:column;padding:8px 12px;animation:.3s cubic-bezier(.16,1,.3,1) slideIn;display:flex;box-shadow:0 4px 14px #0009}.chat-bubble.meetme{border-left-color:var(--accent-gold)}.chat-bubble.gift{border-left-color:var(--accent-magenta);background:#ff007f4d}@keyframes slideIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.chat-author{color:#00f0ff;align-items:center;gap:8px;margin-bottom:3px;font-size:15px;font-weight:900;display:flex}.chat-platform-tag{color:#fff;text-transform:uppercase;background:#ffffff2e;border-radius:5px;padding:2px 7px;font-size:11px;font-weight:800}.chat-text{color:#fff;word-break:break-word;text-shadow:0 2px 5px #000;font-size:17px;font-weight:700;line-height:1.4}#shoutout-popup-banner{color:#fff;width:90%;font-family:var(--font-display);letter-spacing:.5px;text-align:center;opacity:0;pointer-events:none;z-index:20;background:linear-gradient(135deg,#ff007fe6,#9d4edde6);border:2px solid #fff;border-radius:30px;padding:12px 20px;font-size:14px;font-weight:800;transition:all .35s cubic-bezier(.175,.885,.32,1.275);position:absolute;top:130px;left:50%;transform:translate(-50%)scale(.9);box-shadow:0 0 25px #ff007fcc}#shoutout-popup-banner.active{opacity:1;transform:translate(-50%)scale(1)}#control-panel-drawer{z-index:100;pointer-events:auto;width:400px;max-height:calc(100vh - 40px);padding:20px;transition:transform .35s cubic-bezier(.16,1,.3,1),opacity .3s;position:fixed;top:20px;right:20px;overflow-y:auto}#control-panel-drawer.collapsed{opacity:0;pointer-events:none;transform:translate(430px)}#control-toggle-btn{z-index:105;background:var(--bg-panel);border:1px solid var(--accent-cyan);color:var(--accent-cyan);font-family:var(--font-display);cursor:pointer;pointer-events:auto;border-radius:12px;padding:10px 16px;font-size:11px;font-weight:700;transition:all .2s;position:fixed;top:20px;right:20px;box-shadow:0 0 15px #00f0ff4d}#control-toggle-btn:hover{background:var(--accent-cyan);color:#000}.panel-section{margin-bottom:18px}.panel-title{font-family:var(--font-display);color:var(--accent-cyan);letter-spacing:1.5px;text-transform:uppercase;justify-content:space-between;align-items:center;margin-bottom:10px;font-size:12px;display:flex}.mode-switch-group{background:#0006;border-radius:8px;grid-template-columns:1fr 1fr;gap:8px;padding:4px;display:grid}.mode-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;gap:6px;padding:9px 12px;font-size:12px;font-weight:700;transition:all .2s;display:flex}.mode-btn.active.tiktok{color:#fff;background:linear-gradient(135deg,#f05,#00f0ff);box-shadow:0 0 12px #f056}.mode-btn.active.meetme{color:#fff;background:linear-gradient(135deg,#fa0,#ff007f);box-shadow:0 0 12px #fa06}.input-group{gap:8px;margin-top:8px;display:flex}.input-field{color:#fff;font-family:var(--font-sans);background:#00000080;border:1px solid #ffffff26;border-radius:6px;outline:none;flex:1;padding:8px 10px;font-size:12px;transition:border-color .2s}.input-field:focus{border-color:var(--accent-cyan)}.action-btn{background:linear-gradient(135deg, var(--accent-cyan), #08f);color:#000;cursor:pointer;border:none;border-radius:6px;padding:8px 14px;font-size:11px;font-weight:700;transition:all .2s}.action-btn:hover{filter:brightness(1.15);box-shadow:0 0 12px #00f0ff80}.action-btn.secondary{color:#fff;background:#ffffff1a}.action-btn.danger{color:#fff;background:#f05}.status-indicator{color:var(--text-muted);align-items:center;gap:6px;margin-top:6px;font-size:11px;display:flex}.status-dot{background:#666;border-radius:50%;width:7px;height:7px}.status-dot.connected{background:var(--accent-green);box-shadow:0 0 6px var(--accent-green)}.status-dot.connecting{background:var(--accent-gold);animation:1s infinite blink}.status-dot.error{background:#f05}.quick-grid{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.grid-btn{color:#fff;cursor:pointer;text-align:center;background:#ffffff0f;border:1px solid #ffffff1a;border-radius:6px;padding:7px 4px;font-size:11px;font-weight:600;transition:all .2s}.grid-btn:hover{border-color:var(--accent-cyan);background:#00f0ff33}body.obs-overlay #control-panel-drawer,body.obs-overlay #control-toggle-btn{display:none!important}body.transparent-bg{background:0 0!important}body.transparent-bg #stream-viewport{box-shadow:none!important;background:0 0!important}body.transparent-bg #bg-video-container{display:none!important}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#0000004d}::-webkit-scrollbar-thumb{background:#00f0ff4d;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--accent-cyan)}.obs-interact-btn{z-index:99999;-webkit-backdrop-filter:blur(12px);border:1.5px solid var(--accent-gold);color:var(--accent-gold);font-family:var(--font-display);letter-spacing:.5px;cursor:pointer;opacity:.85;pointer-events:auto;background:#0c1020eb;border-radius:20px;padding:7px 14px;font-size:11px;font-weight:800;transition:all .2s;position:absolute;top:14px;right:14px;box-shadow:0 4px 18px #0009,0 0 12px #ffaa0059}#stream-viewport:hover .obs-interact-btn,.obs-interact-btn:focus,.obs-interact-btn:hover{opacity:1;background:#161c36fa;transform:scale(1.05);box-shadow:0 6px 24px #000c,0 0 20px #fa09}.obs-modal-backdrop{-webkit-backdrop-filter:blur(14px);z-index:100000;background:#040710e0;justify-content:center;align-items:center;width:100%;height:100%;padding:20px;display:flex;position:absolute;top:0;left:0}.obs-modal-card{border:1.5px solid var(--accent-gold);background:#0d1326;border-radius:16px;width:100%;max-width:420px;animation:.25s cubic-bezier(.16,1,.3,1) modalScaleIn;overflow:hidden;box-shadow:0 20px 60px #000000f2,0 0 35px #ffaa0059}@keyframes modalScaleIn{0%{opacity:0;transform:scale(.92)}to{opacity:1;transform:scale(1)}}.obs-modal-header{background:#ffaa001a;border-bottom:1px solid #ffaa0040;justify-content:space-between;align-items:center;padding:14px 18px;display:flex}.obs-modal-title{font-family:var(--font-display);color:var(--accent-gold);letter-spacing:.5px;font-size:13px;font-weight:800}.btn-obs-modal-close{color:#fff;cursor:pointer;background:0 0;border:none;border-radius:4px;padding:2px 6px;font-size:18px}.btn-obs-modal-close:hover{background:#ffffff26}.obs-modal-body{padding:18px}.obs-modal-options{flex-direction:column;gap:12px;margin:14px 0;display:flex}.obs-login-opt-btn{text-align:left;font-family:var(--font-display);cursor:pointer;border:1px solid #0000;border-radius:10px;flex-direction:column;align-items:flex-start;padding:12px 16px;font-size:13px;font-weight:700;transition:all .2s;display:flex}.obs-login-opt-btn.primary{color:#fff;background:linear-gradient(135deg,#f05,#fa0);border-color:#ffffff4d;box-shadow:0 4px 16px #f056}.obs-login-opt-btn.primary:hover{transform:translateY(-2px);box-shadow:0 6px 24px #f059}.obs-login-opt-btn.secondary{color:#e2e8f0;background:#ffffff14;border-color:#fff3}.obs-login-opt-btn.secondary:hover{border-color:var(--accent-cyan);color:#fff;background:#ffffff26}.btn-subtext{font-family:var(--font-sans);opacity:.85;margin-top:4px;font-size:11px;font-weight:400}.obs-modal-tip{color:#94a3b8;background:#00f0ff0f;border:1px solid #00f0ff33;border-radius:8px;padding:10px;font-size:11px;line-height:1.45}.genre-chips-container{flex-wrap:wrap;gap:8px;margin-top:10px;display:flex}.btn-genre-chip{color:#cbd5e1;cursor:pointer;background:#ffffff0f;border:1px solid #ffffff29;border-radius:16px;align-items:center;gap:6px;padding:7px 12px;font-size:12px;font-weight:600;transition:all .2s;display:flex}.btn-genre-chip:hover{border-color:var(--accent-cyan);color:#fff;background:#00f0ff24;transform:translateY(-1px)}.btn-genre-chip.active{border:1.5px solid var(--accent-cyan);color:#00f0ff;background:linear-gradient(135deg,#00f0ff59,#0064ff59);font-weight:700;box-shadow:0 0 14px #00f0ff73}.mood-chips-container{flex-wrap:wrap;gap:8px;margin-top:10px;display:flex}.btn-mood-chip{color:#cbd5e1;cursor:pointer;background:#ffffff0f;border:1px solid #ffffff29;border-radius:16px;padding:7px 12px;font-size:12px;font-weight:600;transition:all .2s}.btn-mood-chip:hover{border-color:var(--accent-magenta);color:#fff;background:#ff007f24;transform:translateY(-1px)}.btn-mood-chip.active{border:1.5px solid var(--accent-magenta);color:#f39;background:linear-gradient(135deg,#ff007f59,#9d4edd59);font-weight:700;box-shadow:0 0 14px #ff007f73}.btn-cam-orbit{border-color:var(--accent-cyan)!important;color:var(--accent-cyan)!important}.btn-cam-orbit.active{color:#000!important;background:linear-gradient(135deg,#00f0ff,#06f)!important;font-weight:800!important;box-shadow:0 0 18px #00f0ffb3!important}body.studio-body{background:radial-gradient(circle at 50% 0,#0d1326 0%,#06070d 70%);width:100vw;height:100vh;display:block;overflow:hidden}#studio-app{flex-direction:column;width:100%;height:100%;display:flex;overflow:hidden}.studio-header{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);z-index:50;background:#080b14eb;border-bottom:1px solid #00f0ff26;justify-content:space-between;align-items:center;height:56px;min-height:56px;padding:0 20px;display:flex}.studio-header-left{align-items:center;gap:12px;display:flex}.studio-logo-badge{font-family:var(--font-display);letter-spacing:1px;color:#fff;background:linear-gradient(135deg, var(--accent-cyan), var(--accent-magenta));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;align-items:center;gap:6px;font-size:14px;font-weight:900;display:flex}.studio-title-box h1{font-family:var(--font-display);letter-spacing:.5px;color:var(--text-main);font-size:14px;font-weight:800}.studio-subtitle{color:var(--text-muted);letter-spacing:.5px;font-size:10px}.studio-header-center{align-items:center;gap:12px;display:flex}.header-status-pill{background:#ffffff0d;border:1px solid #ffffff1a;border-radius:20px;align-items:center;gap:6px;padding:4px 10px;font-size:11px;font-weight:600;display:flex}.pulse-dot{background:#888;border-radius:50%;width:7px;height:7px}.pulse-dot.connected{background:var(--accent-green);box-shadow:0 0 8px var(--accent-green);animation:2s infinite pulse-green}@keyframes pulse-green{0%,to{opacity:1;transform:scale(1)}50%{opacity:.7;transform:scale(1.3)}}.mode-tag{color:var(--accent-cyan);font-family:var(--font-display);letter-spacing:.5px;font-size:10px}.autodj-tag{color:var(--accent-magenta);font-family:var(--font-display);letter-spacing:.5px;font-size:10px}.autodj-tag.disabled{color:var(--text-muted)}.studio-header-right{align-items:center;gap:10px;display:flex}.btn-primary-glow{border:1px solid var(--accent-cyan);color:#fff;cursor:pointer;background:linear-gradient(135deg,#00f0ff40,#00f0ff1a);border-radius:6px;padding:6px 12px;font-size:11px;font-weight:700;transition:all .2s;box-shadow:0 0 10px #00f0ff33}.btn-primary-glow:hover{background:var(--accent-cyan);color:#000;box-shadow:0 0 16px var(--accent-cyan)}.btn-secondary-glow{color:var(--text-main);cursor:pointer;background:#ffffff0f;border:1px solid #ffffff26;border-radius:6px;padding:6px 12px;font-size:11px;font-weight:600;transition:all .2s}.btn-secondary-glow:hover{border-color:var(--accent-magenta);color:var(--accent-magenta)}.btn-outline-glow{color:var(--accent-cyan);cursor:pointer;background:0 0;border:1px solid #00f0ff4d;border-radius:6px;padding:6px 12px;font-size:11px;font-weight:700;text-decoration:none;transition:all .2s}.btn-outline-glow:hover{border-color:var(--accent-cyan);background:#00f0ff26}.studio-main-grid{flex:1;grid-template-columns:310px 1fr 340px;gap:14px;padding:14px;display:grid;overflow:hidden}.studio-column{flex-direction:column;gap:12px;padding-right:4px;display:flex;overflow-y:auto}.studio-panel{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#0c101cd9;border:1px solid #ffffff14;border-radius:10px;flex-direction:column;gap:10px;padding:12px 14px;transition:border-color .2s;display:flex;box-shadow:0 4px 20px #00000059}.studio-panel:hover{border-color:#00f0ff33}.panel-header{border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;padding-bottom:8px;display:flex}.panel-title{font-family:var(--font-display);letter-spacing:.5px;color:var(--accent-cyan);align-items:center;gap:6px;font-size:12px;font-weight:800;display:flex}.panel-icon{font-size:13px}.live-tag{border:1px solid var(--accent-magenta);color:var(--accent-magenta);letter-spacing:.5px;background:#ff007f33;border-radius:4px;padding:2px 6px;font-size:9px;font-weight:800}.monitor-viewport-wrapper{background:#000;border:1px solid #ffffff14;border-radius:8px;justify-content:center;width:100%;padding:6px;display:flex}.monitor-viewport-inner{aspect-ratio:9/16;background:#06070d;border-radius:6px;width:100%;max-width:210px;overflow:hidden;box-shadow:0 0 15px #00f0ff26}.monitor-viewport-inner iframe{border:none;width:100%;height:100%;display:block}.monitor-controls-bar{flex-direction:column;gap:6px;display:flex}.control-label{color:var(--text-muted);font-size:11px}.cam-btn-group{grid-template-columns:repeat(2,1fr);gap:6px;display:grid}.btn-cam-select{color:var(--text-main);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:5px;padding:6px 8px;font-size:10px;font-weight:600;transition:all .2s}.btn-cam-select.active,.btn-cam-select:hover{border-color:var(--accent-cyan);color:#fff;background:#00f0ff33}.obs-info-card{background:#00f0ff0a;border:1px dashed #00f0ff40;border-radius:6px;padding:10px}.obs-info-title{color:var(--accent-cyan);margin-bottom:6px;font-size:11px;font-weight:700}.obs-info-list{color:var(--text-muted);padding-left:14px;font-size:10px;line-height:1.5}.obs-info-list code{color:var(--accent-green);background:#0006;border-radius:3px;padding:1px 4px;font-family:monospace}.premium-callout-card{background:linear-gradient(135deg,#ffaa001f,#ff007f14);border:1px solid #ffaa0059;border-radius:10px;justify-content:space-between;align-items:center;gap:12px;padding:12px 16px;display:flex;box-shadow:0 0 20px #ffaa001a}.premium-badge{font-family:var(--font-display);color:var(--accent-gold);letter-spacing:.5px;margin-bottom:2px;font-size:12px;font-weight:900}.premium-text{color:#d8e0ec;font-size:11px;line-height:1.4}.btn-premium-action{background:linear-gradient(135deg, var(--accent-gold), #f80);color:#000;font-family:var(--font-sans);cursor:pointer;white-space:nowrap;border:none;border-radius:6px;padding:8px 16px;font-size:11px;font-weight:800;transition:all .2s;box-shadow:0 0 12px #ffaa0059}.btn-premium-action:hover{transform:translateY(-1px);box-shadow:0 0 18px #fa09}.now-playing-body{align-items:center;gap:14px;display:flex}.track-artwork-box{border:1px solid #00f0ff4d;border-radius:8px;width:90px;min-width:90px;height:90px;position:relative;overflow:hidden;box-shadow:0 0 14px #00f0ff33}.track-artwork-box img{object-fit:cover;width:100%;height:100%}.artwork-eq-bars{background:#0009;border-radius:4px;gap:2px;padding:3px 5px;display:flex;position:absolute;bottom:4px;right:4px}.artwork-eq-bars span{background:var(--accent-cyan);border-radius:1px;width:3px;height:12px;animation:.8s ease-in-out infinite eq-bounce}.artwork-eq-bars span:nth-child(2){height:16px;animation-delay:.2s}.artwork-eq-bars span:nth-child(3){height:10px;animation-delay:.4s}.artwork-eq-bars span:nth-child(4){height:14px;animation-delay:.6s}@keyframes eq-bounce{0%,to{transform:scaleY(.3)}50%{transform:scaleY(1)}}.track-meta-box{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.track-title-text{font-family:var(--font-display);color:#fff;white-space:nowrap;text-overflow:ellipsis;font-size:14px;font-weight:700;overflow:hidden}.track-artist-text{color:var(--accent-cyan);white-space:nowrap;text-overflow:ellipsis;font-size:12px;overflow:hidden}.track-genre-pill{border:1px solid var(--accent-purple);color:#d19eff;background:#9d4edd33;border-radius:12px;align-self:flex-start;margin-top:2px;padding:2px 8px;font-size:10px;font-weight:600;display:inline-block}.badge-requester{border:1px solid var(--accent-green);color:var(--accent-green);background:#00ff8826;border-radius:10px;padding:2px 8px;font-size:10px;font-weight:700}.transport-controls-row{flex-wrap:wrap;align-items:center;gap:8px;margin-top:6px;display:flex}.btn-transport{cursor:pointer;border:none;border-radius:5px;padding:6px 12px;font-size:11px;font-weight:700;transition:all .2s}.btn-transport.main{background:var(--accent-cyan);color:#000}.btn-transport.main:hover{box-shadow:0 0 12px var(--accent-cyan)}.btn-transport.secondary{color:#fff;background:#ffffff14;border:1px solid #ffffff26}.btn-transport.secondary:hover{border-color:var(--accent-cyan)}.btn-transport.duck{border:1px solid var(--accent-magenta);color:#ff80bf;background:#ff007f26;font-size:10px}.btn-transport.duck:hover{background:var(--accent-magenta);color:#fff}.volume-slider-box{background:#ffffff0a;border:1px solid #ffffff14;border-radius:5px;align-items:center;gap:6px;padding:4px 8px;display:flex}.volume-icon{font-size:11px}.volume-slider-box input[type=range]{width:65px;accent-color:var(--accent-cyan);cursor:pointer}#volume-value-text{color:var(--text-muted);width:28px;font-size:10px}.toggle-switch-wrapper{cursor:pointer;align-items:center;gap:8px;display:flex}.toggle-switch-wrapper input[type=checkbox]{display:none}.toggle-slider{background:#fff3;border-radius:20px;width:32px;height:18px;transition:all .2s;position:relative}.toggle-slider:before{content:"";background:#fff;border-radius:50%;width:14px;height:14px;transition:all .2s;position:absolute;top:2px;left:2px}.toggle-switch-wrapper input:checked+.toggle-slider{background:var(--accent-green)}.toggle-switch-wrapper input:checked+.toggle-slider:before{transform:translate(14px)}.toggle-label{color:#fff;font-size:11px;font-weight:700}.autodj-selectors-grid{grid-template-columns:repeat(2,1fr);gap:10px;display:grid}.selector-group{flex-direction:column;gap:4px;display:flex}.select-label{color:var(--text-muted);font-size:11px;font-weight:600}.studio-select{color:#fff;font-family:var(--font-sans);cursor:pointer;background:#06080ff2;border:1px solid #00f0ff4d;border-radius:6px;outline:none;padding:8px 10px;font-size:12px;transition:all .2s}.studio-select:focus,.studio-select:hover{border-color:var(--accent-cyan);box-shadow:0 0 10px #00f0ff33}.vibe-presets-row{border-top:1px solid #ffffff0d;flex-wrap:wrap;align-items:center;gap:6px;padding-top:4px;display:flex}.presets-label{color:var(--text-muted);margin-right:2px;font-size:10px}.btn-vibe-preset{color:var(--text-main);cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:4px;padding:4px 8px;font-size:10px;font-weight:600;transition:all .2s}.btn-vibe-preset:hover{border-color:var(--accent-cyan);color:#fff;background:#00f0ff33}.btn-vibe-action{border:1px solid var(--accent-green);color:var(--accent-green);cursor:pointer;background:linear-gradient(135deg,#0f83,#00f0ff33);border-radius:4px;margin-left:auto;padding:4px 10px;font-size:10px;font-weight:700;transition:all .2s}.btn-vibe-action:hover{background:var(--accent-green);color:#000;box-shadow:0 0 10px var(--accent-green)}.search-input-row{gap:8px;display:flex}.studio-input{color:#fff;font-family:var(--font-sans);background:#06080ff2;border:1px solid #ffffff1f;border-radius:6px;outline:none;flex:1;padding:8px 12px;font-size:12px;transition:border-color .2s}.studio-input:focus{border-color:var(--accent-cyan);box-shadow:0 0 10px #00f0ff33}.btn-search-add{border:1px solid var(--accent-cyan);color:#fff;cursor:pointer;white-space:nowrap;background:#00f0ff33;border-radius:6px;padding:8px 14px;font-size:11px;font-weight:700;transition:all .2s}.btn-search-add:hover{background:var(--accent-cyan);color:#000}.btn-search-play{border:1px solid var(--accent-green);color:var(--accent-green);cursor:pointer;white-space:nowrap;background:#00ff8826;border-radius:6px;padding:8px 12px;font-size:11px;font-weight:700;transition:all .2s}.btn-search-play:hover{background:var(--accent-green);color:#000}.search-feedback{min-height:14px;color:var(--text-muted);font-size:11px}.search-feedback.active{color:var(--accent-cyan);font-weight:600}.queue-subtext{color:var(--text-muted);font-size:10px}.queue-list-container{flex-direction:column;gap:6px;max-height:220px;padding-right:4px;display:flex;overflow-y:auto}.queue-empty-state{text-align:center;color:var(--text-muted);border:1px dashed #ffffff14;border-radius:6px;flex-direction:column;gap:4px;padding:16px;font-size:12px;display:flex}.empty-sub{color:#7b889e;font-size:10px}.queue-item-card{background:#ffffff08;border:1px solid #ffffff0f;border-radius:6px;justify-content:space-between;align-items:center;padding:6px 10px;transition:all .2s;display:flex}.queue-item-card:hover{background:#ffffff0f;border-color:#00f0ff33}.queue-item-left{flex:1;align-items:center;gap:8px;min-width:0;display:flex}.queue-item-pos{color:var(--accent-cyan);width:20px;font-size:11px;font-weight:800}.queue-item-thumb{object-fit:cover;border-radius:4px;width:40px;height:40px}.queue-item-info{flex:1;min-width:0}.queue-item-title{color:#fff;white-space:nowrap;text-overflow:ellipsis;font-size:11px;font-weight:600;overflow:hidden}.queue-item-artist{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:10px;overflow:hidden}.queue-item-right{align-items:center;gap:8px;display:flex}.queue-item-req{color:var(--accent-green);white-space:nowrap;background:#00ff881a;border-radius:4px;padding:2px 6px;font-size:9px}.btn-remove-queue{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:2px 4px;font-size:13px;transition:color .2s}.btn-remove-queue:hover{color:var(--accent-magenta)}.platform-tabs-row{gap:6px;display:flex}.tab-btn{color:var(--text-muted);cursor:pointer;background:#ffffff0a;border:1px solid #ffffff1a;border-radius:6px;flex:1;padding:8px 10px;font-size:11px;font-weight:700;transition:all .2s}.tab-btn.active.tiktok{border-color:var(--accent-cyan);color:#fff;background:#00f0ff26}.tab-btn.active.meetme{border-color:var(--accent-magenta);color:#fff;background:#ff007f26}.platform-box{flex-direction:column;gap:6px;display:flex}.input-label{color:var(--text-muted);font-size:10px}.input-with-btn{gap:6px;display:flex}.btn-action-primary{background:var(--accent-cyan);color:#000;cursor:pointer;white-space:nowrap;border:none;border-radius:5px;padding:6px 14px;font-size:11px;font-weight:700;transition:all .2s}.btn-action-danger{color:#fff;cursor:pointer;background:#f05c;border:none;border-radius:5px;padding:6px 14px;font-size:11px;font-weight:700}.btn-action-secondary{color:#fff;cursor:pointer;white-space:nowrap;background:#ffffff14;border:1px solid #ffffff26;border-radius:5px;padding:6px 12px;font-size:11px;font-weight:600}.platform-status-row{color:var(--text-muted);align-items:center;gap:6px;margin-top:2px;font-size:10px;display:flex}.fx-section-title{color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-top:4px;font-size:10px;font-weight:700}.fx-buttons-grid,.lighting-buttons-grid,.anim-buttons-grid,.sim-buttons-grid{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}.btn-fx,.btn-light-item,.btn-anim-item,.btn-sim-cmd,.btn-sim-gift{color:var(--text-main);cursor:pointer;text-align:center;white-space:nowrap;text-overflow:ellipsis;background:#ffffff0a;border:1px solid #ffffff14;border-radius:5px;padding:6px 4px;font-size:10px;font-weight:600;transition:all .2s;overflow:hidden}.btn-fx:hover,.btn-light-item:hover,.btn-anim-item:hover,.btn-sim-cmd:hover,.btn-sim-gift:hover{border-color:var(--accent-cyan);color:#fff;background:#00f0ff26}.elevenlabs-row{gap:6px;display:flex}.studio-modal-backdrop{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;background:#000c;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.studio-modal-card{border:1px solid var(--accent-gold);background:#0d1222;border-radius:12px;width:90%;max-width:520px;padding:20px;box-shadow:0 0 30px #ffaa0040}.modal-header{border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;margin-bottom:14px;padding-bottom:12px;display:flex}.modal-header h3{font-family:var(--font-display);color:var(--accent-gold);font-size:14px}.btn-modal-close{color:#fff;cursor:pointer;background:0 0;border:none;font-size:16px}.modal-body{color:#c8d4e6;font-size:12px;line-height:1.6}.modal-body ol{flex-direction:column;gap:8px;margin:12px 0 18px;padding-left:18px;display:flex}.modal-actions{justify-content:flex-end;display:flex}.yt-docked-container{opacity:.01;pointer-events:none;z-index:-1;width:200px;height:200px;transition:opacity .3s,transform .3s;position:absolute;top:0;left:-9999px}.yt-docked-container.visible{opacity:1;pointer-events:auto;z-index:100000;border:2px solid var(--accent-gold);background:#0a0e1c;border-radius:12px;width:380px;height:240px;top:auto;bottom:80px;left:50%;overflow:hidden;transform:translate(-50%);box-shadow:0 16px 48px #000000f2,0 0 24px #fa06}.yt-docked-container iframe{width:100%!important;height:100%!important}.pose-editor-toggle-btn{z-index:99999;border:2px solid var(--accent-cyan);color:#fff;font-family:var(--font-display);letter-spacing:.8px;cursor:pointer;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#080e1cf2;border-radius:24px;align-items:center;gap:10px;padding:11px 20px;font-size:13px;font-weight:800;transition:all .2s;display:flex;position:absolute;top:14px;right:14px;box-shadow:0 4px 20px #00f0ff66}.pose-editor-toggle-btn:hover,.pose-editor-toggle-btn.active{background:#00f0ff59;transform:scale(1.04);box-shadow:0 0 25px #00f0ffcc}.pose-editor-toggle-btn .hotkey-badge{color:#00f0ff;background:#fff3;border-radius:6px;padding:2px 8px;font-size:11px;font-weight:800}.pose-editor-panel{border:2px solid var(--accent-cyan);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);z-index:100000;background:#060a18fa;border-radius:16px;flex-direction:column;width:440px;max-width:calc(100vw - 28px);max-height:88vh;animation:.2s ease-out fadeInDown;display:flex;position:absolute;top:60px;right:14px;overflow:hidden;box-shadow:0 24px 60px #000000f2,0 0 35px #00f0ff4d}.pose-editor-panel.hidden{display:none!important}.pose-editor-header{cursor:move;-webkit-user-select:none;user-select:none;background:#00f0ff1f;border-bottom:2px solid #00f0ff4d;justify-content:space-between;align-items:center;padding:14px 18px;display:flex}.pose-editor-header .header-title{font-family:var(--font-display);letter-spacing:.6px;color:#00f0ff;align-items:center;gap:10px;font-size:14px;font-weight:900;display:flex}.pose-editor-header .header-title .pulse-dot{background:var(--accent-green);width:10px;height:10px;box-shadow:0 0 12px var(--accent-green);border-radius:50%;animation:1.5s infinite pulseGreen}.btn-icon-close{border:1px solid var(--accent-magenta);color:#fff;font-family:var(--font-display);cursor:pointer;background:#ff007f40;border-radius:8px;padding:6px 12px;font-size:11px;font-weight:800;transition:all .15s}.btn-icon-close:hover{background:#ff007f99;transform:scale(1.05)}.pose-editor-body{flex-direction:column;gap:14px;padding:16px 18px;display:flex;overflow-y:auto}.barrier-banner{border:1.5px solid var(--accent-green);background:#00ff881f;border-radius:10px;padding:10px 14px}.barrier-banner .barrier-status{font-size:12px;font-family:var(--font-display);color:var(--accent-green);letter-spacing:.5px;font-weight:800}.barrier-banner .barrier-sub{color:#e2e8f0;margin-top:3px;font-size:12px;line-height:1.35}.section-title{font-family:var(--font-display);letter-spacing:.9px;color:#00f0ff;text-transform:uppercase;margin-top:6px;font-size:12px;font-weight:800}.target-grid{grid-template-columns:repeat(2,1fr);gap:8px;display:grid}.btn-target{color:#fff;cursor:pointer;text-align:left;background:#ffffff14;border:1.5px solid #fff3;border-radius:8px;padding:11px 12px;font-size:13px;font-weight:700;transition:all .15s}.btn-target:hover{border-color:var(--accent-cyan);background:#00f0ff33}.btn-target.active{color:#fff;background:#00f0ff59;border-color:#00f0ff;box-shadow:0 0 16px #00f0ff80}.mode-toggle-group{gap:10px;display:flex}.btn-mode{color:#fff;cursor:pointer;background:#ffffff14;border:1.5px solid #fff3;border-radius:8px;flex:1;padding:10px;font-size:13px;font-weight:800;transition:all .15s}.btn-mode:hover{background:#ff007f33}.btn-mode.active{border-color:var(--accent-magenta);background:#ff007f73;box-shadow:0 0 14px #ff007f80}.dynamic-limb-box,.beat-sync-box{background:#ffffff0d;border:1.5px solid #00f0ff40;border-radius:12px;flex-direction:column;gap:12px;padding:14px;display:flex}.control-with-buttons{align-items:center;gap:10px;display:flex}.btn-step{color:#fff;cursor:pointer;white-space:nowrap;background:#00f0ff26;border:1px solid #00f0ff66;border-radius:6px;padding:8px 12px;font-size:12px;font-weight:700;transition:all .15s}.btn-step:hover{background:#00f0ff59;border-color:#00f0ff}.slider-row{flex-direction:column;gap:6px;display:flex}.slider-row label{color:#f1f5f9;justify-content:space-between;font-size:13px;font-weight:700;display:flex}.slider-row label span{color:var(--accent-cyan);font-family:monospace;font-size:14px;font-weight:800}.slider-row input[type=range]{accent-color:var(--accent-cyan);cursor:pointer;flex:1;height:6px}.beat-pulse-row{border-bottom:1px solid #ffffff1a;align-items:center;gap:12px;padding-bottom:8px;display:flex}.beat-led{background:#00f0ff33;border:2px solid #00f0ff;border-radius:50%;width:18px;height:18px;transition:all 80ms ease-out}.beat-led.flash{background:#00f0ff;transform:scale(1.2);box-shadow:0 0 20px #00f0ff,0 0 40px #00f0ff}.beat-status-text{color:#fff;flex-direction:column;font-size:13px;display:flex}.beat-status-text span{color:var(--accent-cyan);font-size:14px;font-weight:800}.nudge-row{align-items:center;gap:8px;display:flex}.btn-nudge{color:#fff;cursor:pointer;background:#ffffff1a;border:1px solid #ffffff40;border-radius:6px;padding:6px 10px;font-size:12px;font-weight:700}.btn-nudge:hover{background:#00f0ff40;border-color:#00f0ff}.quick-bpm-group{flex-wrap:wrap;align-items:center;gap:6px;margin-top:4px;display:flex}.quick-bpm-group .bpm-label{color:#cbd5e1;font-size:12px;font-weight:700}.btn-bpm{color:#fff;cursor:pointer;background:#ffffff14;border:1px solid #fff3;border-radius:5px;padding:5px 8px;font-size:12px;font-weight:700}.btn-bpm.active,.btn-bpm:hover{background:#00f0ff4d;border-color:#00f0ff}.checkbox-group{flex-direction:column;gap:8px;display:flex}.big-checkbox-label{color:#fff;cursor:pointer;background:#ffffff0f;border:1px solid #ffffff26;border-radius:8px;align-items:center;gap:12px;padding:10px 14px;font-size:13px;line-height:1.35;display:flex}.big-checkbox-label input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent-cyan);cursor:pointer}.preset-grid{flex-direction:column;gap:8px;display:flex}.btn-preset-card{color:#fff;text-align:left;cursor:pointer;background:#9d4edd26;border:1.5px solid #9d4edd59;border-radius:8px;flex-direction:column;gap:2px;padding:10px 14px;transition:all .15s;display:flex}.btn-preset-card:hover{border-color:var(--accent-purple);background:#9d4edd59;transform:translate(4px)}.btn-preset-card .preset-name{color:#fff;font-size:13px;font-weight:800}.btn-preset-card .preset-desc{color:#e9d5ff;font-size:11px}.editor-actions{gap:10px;margin-top:8px;display:flex}.btn-action{cursor:pointer;border:none;border-radius:10px;padding:12px 16px;font-size:13px;font-weight:800;transition:all .2s}.btn-action.primary{color:#050510;font-family:var(--font-display);letter-spacing:.6px;background:linear-gradient(135deg,#00f0ff,#08f);flex:2;box-shadow:0 4px 16px #00f0ff80}.btn-action.primary:hover{filter:brightness(1.15);transform:translateY(-2px);box-shadow:0 0 25px #00f0ffcc}.btn-action.secondary{color:#fff;background:#ffffff1a;border:1.5px solid #ffffff40;flex:1}.btn-action.secondary:hover{background:#fff3}.pose-toast{border:1.5px solid var(--accent-green);color:#fff;text-align:center;background:#00ff8840;border-radius:8px;padding:10px 14px;font-size:13px;font-weight:700;display:none}.pose-toast.show{animation:.2s fadeIn;display:block}