.timeline-controls{position:fixed;bottom:0;left:0;right:0;z-index:100;padding:16px 48px 24px;background:linear-gradient(to top,rgba(0,0,0,.95) 0%,rgba(0,0,0,.7) 70%,transparent 100%);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);opacity:0;transform:translateY(20px);transition:opacity .8s ease-out,transform .8s ease-out;pointer-events:none;display:flex;flex-direction:column;gap:12px}.timeline-controls.visible{opacity:1;transform:translateY(0);pointer-events:all}.timeline-container{display:flex;flex-direction:column;gap:12px;margin-bottom:16px}.timeline{width:100%;height:6px;cursor:pointer;position:relative;padding:8px 0}.timeline-track{width:100%;height:6px;background:#ffffff26;border-radius:3px;position:relative;overflow:hidden;transition:height .2s ease}.timeline:hover .timeline-track{height:8px}.timeline-progress{position:absolute;top:0;left:0;height:100%;background:linear-gradient(90deg,#ff6ec7,#ff9edf);border-radius:3px;transition:width .1s linear}.timeline-handle{position:absolute;top:50%;width:16px;height:16px;background:#fff;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 2px 8px #0006;opacity:0;transition:opacity .2s ease,transform .2s ease;z-index:3}.timeline:hover .timeline-handle{opacity:1}.timeline-handle:active{transform:translate(-50%,-50%) scale(1.2)}.timeline-marker{position:absolute;top:50%;transform:translateY(-50%);pointer-events:none;z-index:2}.shape-marker{width:3px;height:20px;background:linear-gradient(180deg,#ff6ec7cc,#ff6ec74d);border-radius:2px}.shape-marker .marker-dot{width:6px;height:6px;border-radius:50%;background:#ff6ec7e6;box-shadow:0 0 6px #ff6ec780;opacity:.6;transition:opacity .2s ease,transform .2s ease}.timeline:hover .shape-marker .marker-dot{opacity:1;transform:scale(1.3)}.time-display{display:flex;align-items:center;gap:6px;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;font-size:14px;color:#fffc;font-variant-numeric:tabular-nums}.time-separator{color:#fff6}.controls-container{display:flex;align-items:center;gap:24px}.playback-controls{display:flex;align-items:center;gap:12px}.control-button{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);border-radius:50%;width:48px;height:48px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;transition:all .2s ease}.control-button:hover:not(:disabled){background:#fff3;border-color:#fff6;transform:scale(1.05)}.control-button:active:not(:disabled){transform:scale(.95)}.control-button:disabled{opacity:.3;cursor:not-allowed}.control-button.skip-button{width:40px;height:40px;background:#ffffff14}.control-button.skip-button:hover{background:#ffffff26}.speed-controls{display:flex;align-items:center;gap:8px}.speed-button{background:#ffffff14;border:1px solid rgba(255,255,255,.15);border-radius:8px;padding:8px 16px;font-size:13px;font-weight:500;color:#ffffffb3;cursor:pointer;transition:all .2s ease;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.speed-button:hover{background:#ffffff1f;color:#ffffffe6;border-color:#ffffff40}.speed-button.active{background:linear-gradient(135deg,#ff6ec7,#ff9edf);border-color:transparent;color:#fff}.speed-button:active{transform:scale(.95)}.manual-controls-wrapper{position:relative;align-self:flex-start}.manual-controls-toggle{display:flex;align-items:center;gap:8px;padding:10px 16px;background:#ffffff14;border:1px solid rgba(255,255,255,.15);border-radius:10px;color:#ffffffe6;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s ease;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.manual-controls-toggle:hover{background:#ffffff1f;border-color:#ffffff40;transform:translateY(-1px)}.manual-controls-toggle svg{width:16px;height:16px}.manual-controls-dropdown{position:absolute;bottom:calc(100% + 12px);left:0;background:#0f0f14fa;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.15);border-radius:16px;padding:16px;min-width:320px;box-shadow:0 12px 40px #0009;animation:dropdownFadeIn .25s ease-out}@keyframes dropdownFadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.dropdown-header{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:#ffffff80;margin-bottom:12px;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.shape-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.shape-button{display:flex;align-items:center;gap:12px;padding:12px 16px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);border-radius:12px;color:#fffc;font-size:14px;cursor:pointer;transition:all .2s ease;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.shape-button:hover{background:#ffffff14;border-color:#fff3;color:#fff;transform:translateY(-2px)}.shape-button.active{background:linear-gradient(135deg,#ff6ec733,#ff9edf33);border-color:#ff6ec766;color:#fff}.shape-icon{font-size:24px;line-height:1;filter:grayscale(.3)}.shape-button.active .shape-icon{filter:grayscale(0)}.shape-label{font-weight:500;flex:1}.custom-dropdown{position:relative;width:100%}.dropdown-trigger{width:100%;padding:12px 16px;background:#ffffff0f;border:1px solid rgba(255,255,255,.15);border-radius:12px;color:#ffffffe6;font-size:14px;font-weight:500;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;cursor:pointer;outline:none;transition:all .2s ease;display:flex;align-items:center;justify-content:space-between;gap:8px}.dropdown-trigger:hover{background:#ffffff14;border-color:#ffffff40}.dropdown-trigger:active{background:#ffffff1a;border-color:#ff6ec780}.dropdown-value{display:flex;align-items:center;gap:8px;flex:1;text-align:left}.dropdown-arrow{opacity:.5;transition:opacity .2s ease;flex-shrink:0}.dropdown-trigger:hover .dropdown-arrow{opacity:.8}.dropdown-menu{position:absolute;top:calc(100% + 4px);left:0;right:0;background:#141419fa;border:1px solid rgba(255,255,255,.15);border-radius:12px;padding:6px;z-index:1000;box-shadow:0 8px 24px #0006;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);max-height:240px;overflow-y:auto;animation:dropdownMenuFadeIn .2s ease}@keyframes dropdownMenuFadeIn{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}.dropdown-item{width:100%;padding:10px 12px;background:transparent;border:none;border-radius:8px;color:#fffc;font-size:14px;font-weight:500;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;cursor:pointer;outline:none;transition:all .2s ease;display:flex;align-items:center;gap:10px;text-align:left}.dropdown-item:hover{background:#ffffff14;color:#fff}.dropdown-item.active{background:#ff6ec726;color:#ff6ec7}.dropdown-item .shape-icon{font-size:18px;line-height:1}.dropdown-item .shape-label{flex:1}.audio-sliders{display:flex;flex-direction:column;gap:10px}.audio-slider-row{display:flex;align-items:center;gap:12px}.audio-slider-label{font-size:13px;font-weight:500;color:#ffffffb3;min-width:80px;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.audio-slider{flex:1;-webkit-appearance:none;appearance:none;height:4px;background:#ffffff26;border-radius:2px;outline:none;cursor:pointer}.audio-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:14px;height:14px;border-radius:50%;background:#fff;cursor:grab;box-shadow:0 1px 4px #0006;transition:transform .1s ease}.audio-slider::-webkit-slider-thumb:active{cursor:grabbing;transform:scale(1.2)}.audio-slider::-moz-range-thumb{width:14px;height:14px;border-radius:50%;background:#fff;cursor:grab;border:none;box-shadow:0 1px 4px #0006}.audio-slider-value{font-size:12px;font-weight:600;color:#ffffff80;min-width:28px;text-align:right;font-variant-numeric:tabular-nums;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.tuning-link-row{display:flex;align-items:center;gap:10px;padding:10px 0;cursor:pointer;-webkit-user-select:none;user-select:none}.tuning-link-checkbox{width:16px;height:16px;accent-color:#6ec7ff;cursor:pointer}.tuning-link-icon{width:16px;height:16px;color:#ffffff80;transition:color .2s ease}.tuning-link-row:hover .tuning-link-icon{color:#fffc}.tuning-link-label{font-size:13px;font-weight:500;color:#fff9;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.audio-slider.linked-disabled{opacity:.35;cursor:not-allowed}.audio-slider.linked-disabled::-webkit-slider-thumb{cursor:not-allowed;background:#fff6}.effect-toggle-button{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:14px 16px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);border-radius:12px;color:#fffc;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;margin-bottom:12px}.effect-toggle-button:hover{background:#ffffff14;border-color:#fff3;color:#fff;transform:translateY(-2px)}.effect-toggle-button.active{background:linear-gradient(135deg,#ff000026,#00ffff26);border-color:#f0f6;color:#fff;box-shadow:0 0 20px #ff00ff4d}.effect-toggle-button svg{width:20px;height:20px}.journey-toggle{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:14px 16px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);border-radius:12px;color:#fffc;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.journey-toggle:hover{background:#ffffff14;border-color:#fff3;color:#fff;transform:translateY(-2px)}.journey-toggle.active{background:linear-gradient(135deg,#6ec7ff33,#9edfff33);border-color:#6ec7ff66;color:#fff}.journey-toggle svg{width:20px;height:20px}.reset-button{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;padding:14px 16px;background:#ff6e6e1a;border:1px solid rgba(255,110,110,.2);border-radius:12px;color:#ff9696e6;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.reset-button:hover{background:#ff6e6e26;border-color:#ff6e6e4d;color:#ffb4b4;transform:translateY(-2px)}.reset-button svg{width:20px;height:20px}.now-playing{display:flex;align-items:center;gap:10px;margin-left:auto;padding:8px 14px;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:10px;max-width:280px;overflow:hidden}.now-playing-icon{color:#ffffff80;flex-shrink:0;display:flex;align-items:center}.now-playing-info{display:flex;flex-direction:column;gap:1px;min-width:0;overflow:hidden}.now-playing-label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:#ffffff59;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.now-playing-title{font-size:12px;font-weight:500;color:#ffffffd9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.now-playing-queue{font-size:10px;font-weight:500;color:#ff7700b3;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;font-variant-numeric:tabular-nums}.now-playing-container{position:relative}.now-playing.clickable{cursor:pointer;transition:all .2s ease}.now-playing.clickable:hover{background:#ffffff14;transform:translateY(-1px)}@media(max-width:768px){.timeline-controls{padding:16px 24px}.controls-container{flex-direction:column;gap:16px}.speed-controls{width:100%;justify-content:center}.manual-controls-dropdown{min-width:280px}.shape-grid{grid-template-columns:1fr}}.audience-readonly{pointer-events:none}.audience-disabled{opacity:.6}.audience-3d-toggle{display:flex;align-items:center;gap:8px;padding:8px 14px;background:#ffffff14;border:1px solid rgba(255,255,255,.12);border-radius:8px;color:#ffffffb3;font-size:13px;cursor:pointer;transition:all .2s ease}.audience-3d-toggle:hover{background:#ffffff1f;color:#fff}.audience-3d-toggle.active{border-color:#0ff6;color:#0ff}.back-button{position:fixed;top:24px;left:24px;z-index:100;display:flex;align-items:center;gap:8px;padding:12px 20px;background:#0009;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);border-radius:12px;color:#ffffffe6;font-size:15px;font-weight:500;cursor:pointer;transition:all .3s ease;opacity:0;transform:translate(-20px);pointer-events:none;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.back-button.visible{opacity:1;transform:translate(0);pointer-events:all}.back-button:hover{background:#000c;border-color:#fff3;transform:translate(-4px)}.back-button svg{width:24px;height:24px}@media(max-width:768px){.back-button{top:16px;left:16px;padding:10px 16px}.back-button span{display:none}}.stage-sidebar-toggle{position:fixed;top:24px;right:24px;z-index:120;display:flex;align-items:center;gap:8px;padding:10px 16px;background:#0009;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);border-radius:12px;color:#ffffffe6;font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.stage-sidebar-toggle:hover{background:#000c;border-color:#c8ff7a4d}.stage-sidebar-toggle.open{background:#c8ff7a1a;border-color:#c8ff7a4d}.stage-sidebar-toggle-label{font-weight:600}.stage-sidebar-badge{background:#c8ff7ae6;color:#000;font-size:11px;font-weight:700;padding:1px 7px;border-radius:10px;min-width:18px;text-align:center}.stage-sidebar{position:fixed;top:0;right:0;width:340px;height:100vh;z-index:115;background:#08080cf2;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border-left:1px solid rgba(255,255,255,.08);transform:translate(100%);transition:transform .35s cubic-bezier(.22,1,.36,1);display:flex;flex-direction:column;overflow:hidden}.stage-sidebar.open{transform:translate(0)}.stage-sidebar-header{display:flex;align-items:center;justify-content:space-between;padding:20px 20px 16px;border-bottom:1px solid rgba(255,255,255,.06)}.stage-sidebar-title{font-size:1.25rem;font-weight:700;margin:0;background:linear-gradient(135deg,#c8ff7a,#0f8);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.stage-sidebar-close{background:none;border:none;color:#fff6;cursor:pointer;padding:6px;display:flex;align-items:center;justify-content:center;transition:color .2s ease;border-radius:8px}.stage-sidebar-close:hover{color:#fffc;background:#ffffff0f}.stage-sidebar-rooms{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:8px}.stage-sidebar-rooms::-webkit-scrollbar{width:4px}.stage-sidebar-rooms::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:2px}.stage-sidebar-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:60px 20px;text-align:center}.stage-sidebar-empty p{font-size:.9rem;font-weight:500;color:#fff6;margin:0}.stage-sidebar-empty span{font-size:.8rem;color:#ffffff40}.stage-sidebar-room{width:100%;text-align:left;padding:14px 16px;background:#ffffff08;border:1px solid rgba(255,255,255,.06);border-radius:12px;cursor:pointer;transition:all .25s ease;display:flex;flex-direction:column;gap:6px;color:#fff;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.stage-sidebar-room:hover:not(:disabled){background:#ffffff0f;border-color:#c8ff7a33;transform:translate(-2px)}.stage-sidebar-room.active{border-color:#c8ff7a4d;background:#c8ff7a0f;cursor:default}.stage-sidebar-room:disabled{opacity:.7}.sidebar-room-top{display:flex;align-items:center;justify-content:space-between}.sidebar-room-name{font-size:.9rem;font-weight:600;color:#fffffff2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-room-live{display:flex;align-items:center;gap:5px;font-size:.65rem;font-weight:700;color:#f44;letter-spacing:.08em;flex-shrink:0}.sidebar-live-dot{width:5px;height:5px;border-radius:50%;background:#f44;animation:livePulse 1.5s ease-in-out infinite}@keyframes livePulse{0%,to{opacity:1}50%{opacity:.4}}.sidebar-room-host{font-size:.75rem;color:#ffffff59}.sidebar-room-host span{color:#c8ff7ab3;font-weight:500}.sidebar-room-playing{display:flex;align-items:center;gap:6px;font-size:.72rem;color:#fff6;padding:6px 8px;background:#0000004d;border-radius:6px}.sidebar-room-playing svg{color:#c8ff7a99;flex-shrink:0}.sidebar-room-playing span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sidebar-room-audience{display:flex;align-items:center;gap:5px;font-size:.72rem;color:#ffffff4d}.stage-sidebar-backdrop{position:fixed;inset:0;z-index:110;background:#0006;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:backdropFade .3s ease}@keyframes backdropFade{0%{opacity:0}to{opacity:1}}@media(max-width:480px){.stage-sidebar{width:100%}}.room-header{position:fixed;top:24px;left:50%;transform:translate(-50%);z-index:105;display:flex;align-items:center;gap:16px;padding:8px 12px;background:#00000080;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.08);border-radius:14px;max-width:90vw;animation:roomHeaderSlideIn .4s cubic-bezier(.22,1,.36,1);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}@keyframes roomHeaderSlideIn{0%{opacity:0;transform:translate(-50%) translateY(-12px)}to{opacity:1;transform:translate(-50%) translateY(0)}}.room-header-left{display:flex;align-items:center;gap:10px}.room-header-right{display:flex;align-items:center;gap:8px}.room-role-badge{display:flex;align-items:center;gap:5px;padding:4px 10px;border-radius:8px;font-size:.72rem;font-weight:600;letter-spacing:.04em;text-transform:uppercase}.room-role-badge.host{background:#c8ff7a26;color:#c8ff7af2;border:1px solid rgba(200,255,122,.2)}.room-role-badge.audience{background:#ffffff14;color:#fff9;border:1px solid rgba(255,255,255,.1)}.room-name-display{background:none;border:none;color:#ffffffe6;font-size:.9rem;font-weight:600;cursor:default;display:flex;align-items:center;gap:6px;padding:4px 8px;border-radius:6px;transition:all .2s ease;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;white-space:nowrap;max-width:200px;overflow:hidden;text-overflow:ellipsis}.room-name-display.editable{cursor:pointer}.room-name-display.editable:hover{background:#ffffff0f;color:#fff}.room-name-display svg{opacity:0;transition:opacity .2s ease;flex-shrink:0}.room-name-display.editable:hover svg{opacity:.5}.room-name-input{background:#ffffff14;border:1px solid rgba(200,255,122,.3);border-radius:6px;color:#fff;font-size:.9rem;font-weight:600;padding:4px 8px;outline:none;width:180px;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.room-audience-count{display:flex;align-items:center;gap:4px;padding:4px 8px;font-size:.75rem;font-weight:500;color:#ffffff73}.room-username{font-size:.75rem;font-weight:500;color:#ffffff80;padding:4px 8px;background:#ffffff0a;border:1px solid transparent;border-radius:6px;white-space:nowrap;cursor:default;display:flex;align-items:center;gap:5px;transition:all .2s ease;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.room-username.editable{cursor:pointer}.room-username.editable:hover{background:#ffffff14;border-color:#ffffff1f;color:#ffffffb3}.room-username svg{opacity:0;transition:opacity .2s ease;flex-shrink:0}.room-username.editable:hover svg{opacity:.4}.room-username-input{background:#ffffff14;border:1px solid rgba(200,255,122,.3);border-radius:6px;color:#fff;font-size:.75rem;font-weight:500;padding:4px 8px;outline:none;width:120px;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.room-username-input::placeholder{color:#ffffff40}.room-visibility-toggle{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:8px;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s ease;border:1px solid;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.room-visibility-toggle.private{background:#ffffff0f;border-color:#ffffff1f;color:#fff9}.room-visibility-toggle.private:hover{background:#c8ff7a14;border-color:#c8ff7a33;color:#c8ff7acc}.room-visibility-toggle.public{background:#c8ff7a1f;border-color:#c8ff7a40;color:#c8ff7ae6}.room-visibility-toggle.public:hover{background:#c8ff7a2e;border-color:#c8ff7a59}.room-leave-btn{display:flex;align-items:center;gap:5px;padding:6px 12px;background:#ff50501a;border:1px solid rgba(255,80,80,.2);border-radius:8px;color:#ff7878e6;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.room-leave-btn:hover{background:#ff50502e;border-color:#ff505059}@media(max-width:768px){.room-header{flex-direction:column;gap:8px;padding:10px;top:12px;width:calc(100% - 120px)}.room-header-left,.room-header-right{width:100%;justify-content:center;flex-wrap:wrap;gap:6px}.room-name-display{max-width:140px}}.room-end-btn{display:flex;align-items:center;gap:6px;padding:6px 12px;border-radius:8px;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:#ff50501f;border:1px solid rgba(255,80,80,.25);color:#ff7878f2}.room-end-btn:hover{background:#ff505033;border-color:#ff505073;color:#fff}.room-end-btn svg{opacity:.85}.chat-toggle-pill{position:fixed;bottom:180px;right:24px;z-index:120;display:flex;align-items:center;gap:8px;padding:10px 18px;background:#000000a6;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.12);border-radius:14px;color:#ffffffd9;font-size:.82rem;font-weight:600;cursor:pointer;transition:all .3s ease;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;white-space:nowrap}.chat-toggle-pill:hover{background:#000c;border-color:#c8ff7a4d;color:#fff}.chat-toggle-pill.open{background:#c8ff7a1a;border-color:#c8ff7a4d;color:#c8ff7af2}.chat-unread-dot{width:8px;height:8px;background:#f44;border-radius:50%;animation:unreadPulse 2s ease-in-out infinite;flex-shrink:0}.chat-msg-count{font-size:.68rem;font-weight:700;background:#c8ff7ad9;color:#000;padding:1px 7px;border-radius:10px;min-width:16px;text-align:center}@keyframes unreadPulse{0%,to{transform:scale(1)}50%{transform:scale(1.3)}}.chat-panel{position:fixed;bottom:240px;right:24px;z-index:115;width:360px;height:440px;background:#08080cf2;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border:1px solid rgba(255,255,255,.08);border-radius:16px;display:flex;flex-direction:column;overflow:hidden;opacity:0;transform:translateY(16px) scale(.95);pointer-events:none;transition:all .3s cubic-bezier(.22,1,.36,1);box-shadow:0 16px 48px #00000080;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.chat-panel.open{opacity:1;transform:translateY(0) scale(1);pointer-events:all}.chat-header{display:flex;align-items:center;gap:8px;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.06)}.chat-header h3{margin:0;font-size:.9rem;font-weight:600;color:#ffffffe6;flex:1}.chat-header-count{font-size:.7rem;font-weight:600;color:#ffffff4d;background:#ffffff0f;padding:2px 8px;border-radius:10px}.chat-close{background:none;border:none;color:#fff6;cursor:pointer;padding:4px;display:flex;align-items:center;justify-content:center;transition:color .2s ease;border-radius:6px}.chat-close:hover{color:#fffc;background:#ffffff0f}.chat-messages{flex:1;overflow-y:auto;padding:12px;display:flex;flex-direction:column;gap:4px}.chat-messages::-webkit-scrollbar{width:4px}.chat-messages::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:2px}.chat-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:4px;text-align:center}.chat-empty p{font-size:.85rem;color:#ffffff4d;margin:0}.chat-empty span{font-size:.75rem;color:#fff3}.chat-message{padding:6px 10px;border-radius:8px;animation:msgSlideIn .25s ease}@keyframes msgSlideIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.chat-message.system{text-align:center;padding:4px}.chat-system-text{font-size:.7rem;color:#ffffff40;font-style:italic;margin:0}.chat-message.host{background:#c8ff7a0a;border-left:2px solid rgba(200,255,122,.3)}.chat-message-header{display:flex;align-items:center;gap:8px;margin-bottom:2px}.chat-username{font-size:.75rem;font-weight:600;color:#fff9;display:flex;align-items:center;gap:5px}.chat-username.host{color:#c8ff7ae6}.chat-host-tag{font-size:.6rem;font-weight:700;letter-spacing:.05em;padding:1px 5px;background:#c8ff7a26;border-radius:4px;color:#c8ff7acc}.chat-time{font-size:.65rem;color:#fff3;font-variant-numeric:tabular-nums}.chat-text{font-size:.82rem;color:#ffffffbf;margin:0;line-height:1.4;word-break:break-word}.chat-input-form{display:flex;align-items:center;gap:0;padding:10px 12px;border-top:1px solid rgba(255,255,255,.06);background:#0003}.chat-input{flex:1;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:10px 0 0 10px;color:#fff;font-size:.82rem;padding:10px 12px;outline:none;transition:border-color .2s ease;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.chat-input::placeholder{color:#ffffff40}.chat-input:focus{border-color:#c8ff7a4d}.chat-send{background:#c8ff7a26;border:1px solid rgba(200,255,122,.2);border-left:none;border-radius:0 10px 10px 0;color:#c8ff7ae6;padding:10px 14px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s ease}.chat-send:hover:not(:disabled){background:#c8ff7a40}.chat-send:disabled{opacity:.3;cursor:not-allowed}@media(max-width:480px){.chat-panel{width:calc(100vw - 48px);right:24px;bottom:200px;height:350px}.chat-toggle-pill{bottom:150px}}.host-miniplayer{position:fixed;bottom:100px;left:50%;z-index:130;width:380px;max-width:calc(100vw - 32px);animation:miniplayerSlideUp .4s cubic-bezier(.22,1,.36,1);font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;touch-action:none;-webkit-user-select:none;user-select:none;transition:box-shadow .2s ease}.host-miniplayer.dragging{cursor:grabbing;transition:none}.host-miniplayer.dragging .host-miniplayer-bar{cursor:grabbing}@keyframes miniplayerSlideUp{0%{opacity:0;transform:translate(-50%,20px)}to{opacity:1;transform:translate(-50%)}}.miniplayer-drag-handle{display:flex;justify-content:center;padding:6px 0 2px;cursor:grab}.drag-handle-dots{display:flex;gap:3px}.drag-handle-dots span{width:4px;height:4px;border-radius:50%;background:#fff3;transition:background .2s ease}.host-miniplayer:hover .drag-handle-dots span{background:#ffffff59}.host-miniplayer.dragging .drag-handle-dots span{background:#c8ff7a80}.host-miniplayer-bar{width:100%;display:flex;align-items:center;gap:10px;padding:10px 14px;background:#000000b3;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(200,255,122,.2);border-radius:14px;cursor:grab;transition:all .25s ease;color:#fff;font-family:inherit}.host-miniplayer.expanded .host-miniplayer-bar{border-radius:14px 14px 0 0;border-bottom:1px solid rgba(255,255,255,.06)}.host-miniplayer-bar:hover{background:#000000d9;border-color:#c8ff7a59}.miniplayer-bar-left{display:flex;align-items:center;gap:8px;flex-shrink:0}.miniplayer-pulse{width:8px;height:8px;border-radius:50%;background:#c8ff7ae6;animation:miniplayerPulse 2s ease-in-out infinite;flex-shrink:0}@keyframes miniplayerPulse{0%,to{opacity:1;box-shadow:0 0 #c8ff7a66}50%{opacity:.7;box-shadow:0 0 0 6px #c8ff7a00}}.miniplayer-label{font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#c8ff7ae6}.miniplayer-bar-center{flex:1;min-width:0;display:flex;align-items:center}.miniplayer-track{display:flex;align-items:center;gap:6px;font-size:.78rem;font-weight:500;color:#ffffffb3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.miniplayer-track svg{color:#c8ff7a99;flex-shrink:0}.miniplayer-track-empty{font-size:.78rem;color:#ffffff4d;font-style:italic}.miniplayer-bar-right{display:flex;align-items:center;gap:8px;flex-shrink:0}.miniplayer-audience{display:flex;align-items:center;gap:4px;font-size:.72rem;font-weight:500;color:#fff6}.miniplayer-chevron{color:#fff6;transition:transform .25s ease}.miniplayer-chevron.up{transform:rotate(180deg)}.host-miniplayer-panel{background:#000000bf;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid rgba(200,255,122,.2);border-top:none;border-radius:0 0 14px 14px;padding:14px;display:flex;flex-direction:column;gap:14px;animation:panelExpand .25s ease}@keyframes panelExpand{0%{opacity:0;max-height:0;padding-top:0;padding-bottom:0}to{opacity:1;max-height:300px;padding-top:14px;padding-bottom:14px}}.miniplayer-info{display:flex;flex-direction:column;gap:8px}.miniplayer-room-name{font-size:1rem;font-weight:700;color:#fffffff2}.miniplayer-now-playing{display:flex;align-items:center;gap:8px;font-size:.8rem;color:#ffffff80;padding:8px 10px;background:#0000004d;border-radius:8px}.miniplayer-now-playing svg{color:#c8ff7a99;flex-shrink:0}.miniplayer-now-playing span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.miniplayer-stats{display:flex;align-items:center;gap:12px}.miniplayer-stat{display:flex;align-items:center;gap:5px;font-size:.75rem;font-weight:500;color:#fff6}.miniplayer-stat.public{color:#c8ff7a99}.miniplayer-stat.private{color:#ffffff59}.miniplayer-actions{display:flex;flex-direction:column;gap:8px}.miniplayer-return-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:10px 16px;background:#c8ff7a1f;border:1px solid rgba(200,255,122,.25);border-radius:10px;color:#c8ff7af2;font-size:.82rem;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:inherit}.miniplayer-return-btn:hover{background:#c8ff7a33;border-color:#c8ff7a66}.miniplayer-end-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:9px 16px;background:#ff3c3c14;border:1px solid rgba(255,60,60,.15);border-radius:10px;color:#ff6464cc;font-size:.78rem;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:inherit}.miniplayer-end-btn:hover{background:#ff3c3c26;border-color:#ff3c3c4d}.miniplayer-confirm-end{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#ff3c3c0f;border:1px solid rgba(255,60,60,.15);border-radius:10px}.miniplayer-confirm-end span{font-size:.78rem;font-weight:500;color:#ff7878e6;flex:1}.miniplayer-confirm-yes{padding:5px 12px;background:#ff3c3c33;border:1px solid rgba(255,60,60,.3);border-radius:6px;color:#ff7878f2;font-size:.72rem;font-weight:700;cursor:pointer;transition:all .2s ease;font-family:inherit}.miniplayer-confirm-yes:hover{background:#ff3c3c59}.miniplayer-confirm-no{padding:5px 12px;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);border-radius:6px;color:#ffffff80;font-size:.72rem;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:inherit}.miniplayer-confirm-no:hover{background:#ffffff1a;color:#ffffffb3}@media(max-width:480px){.host-miniplayer{bottom:80px;width:calc(100vw - 24px)}}.queue-toggle{position:fixed;left:16px;bottom:100px;z-index:120;display:flex;align-items:center;gap:6px;padding:8px 14px;background:#0009;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);border-radius:10px;color:#ffffffb3;font-size:.75rem;font-weight:600;cursor:pointer;transition:all .25s ease;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.queue-toggle:hover{background:#000c;border-color:#c8ff7a40;color:#ffffffe6}.queue-toggle.open{border-color:#c8ff7a4d;color:#c8ff7ae6}.queue-toggle-label{letter-spacing:.03em}.queue-badge{background:#c8ff7a33;color:#c8ff7ae6;font-size:.65rem;font-weight:700;padding:1px 6px;border-radius:8px;min-width:16px;text-align:center}.queue-suggestion-badge{background:#ffb43240;color:#ffc850f2;font-size:.65rem;font-weight:700;padding:1px 6px;border-radius:8px;min-width:16px;text-align:center;animation:suggestionPulse 2s ease-in-out infinite}@keyframes suggestionPulse{0%,to{opacity:1}50%{opacity:.6}}.queue-panel{position:fixed;left:0;top:0;bottom:0;width:360px;max-width:85vw;z-index:125;background:#08080cf2;-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);border-right:1px solid rgba(255,255,255,.08);transform:translate(-100%);transition:transform .35s cubic-bezier(.22,1,.36,1);display:flex;flex-direction:column;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.queue-panel.open{transform:translate(0)}.queue-panel-header{display:flex;align-items:center;justify-content:space-between;padding:20px 20px 12px;border-bottom:1px solid rgba(255,255,255,.06)}.queue-panel-title{font-size:1.1rem;font-weight:700;color:#fffffff2;margin:0;letter-spacing:-.01em}.queue-panel-close{background:none;border:none;color:#fff6;cursor:pointer;padding:4px;border-radius:6px;transition:all .2s ease}.queue-panel-close:hover{color:#ffffffb3;background:#ffffff0f}.queue-panel-content{flex:1;overflow-y:auto;padding:12px 16px 24px;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.1) transparent}.queue-panel-content::-webkit-scrollbar{width:5px}.queue-panel-content::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:3px}.queue-section{margin-bottom:16px}.queue-section-label{display:flex;align-items:center;gap:8px;font-size:.7rem;font-weight:700;color:#ffffff59;text-transform:uppercase;letter-spacing:.08em;margin-bottom:8px;padding:0 4px}.queue-section-tag{font-size:.6rem;font-weight:600;padding:2px 6px;border-radius:4px;text-transform:uppercase;letter-spacing:.05em}.queue-section-tag.locked{background:#ffffff0f;color:#ffffff4d}.queue-section-tag.draggable{background:#c8ff7a14;color:#c8ff7a80}.queue-section-tag.suggestion{background:#ffb4321f;color:#ffc850cc}.queue-item{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#ffffff08;border:1px solid rgba(255,255,255,.04);border-radius:10px;margin-bottom:4px;transition:all .2s ease}.queue-item.now-playing{background:#c8ff7a0f;border-color:#c8ff7a26}.queue-item.priority{border-color:#ffffff0f}.queue-item.low-priority{cursor:default}.queue-item.low-priority[draggable=true]{cursor:grab}.queue-item.low-priority[draggable=true]:active{cursor:grabbing}.queue-item.drag-over{border-color:#c8ff7a4d;background:#c8ff7a0f}.queue-item.analyzing{border-color:#64b4ff26}.queue-item-bars{display:flex;align-items:flex-end;gap:2px;height:16px;flex-shrink:0}.queue-item-bars span{width:3px;background:#c8ff7acc;border-radius:1px;animation:audioBar 1.2s ease-in-out infinite}.queue-item-bars span:nth-child(1){height:60%;animation-delay:0s}.queue-item-bars span:nth-child(2){height:100%;animation-delay:.2s}.queue-item-bars span:nth-child(3){height:40%;animation-delay:.4s}@keyframes audioBar{0%,to{transform:scaleY(1)}50%{transform:scaleY(.4)}}.queue-item-number{font-size:.72rem;font-weight:600;color:#ffffff40;min-width:16px;text-align:center;flex-shrink:0}.queue-item-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.queue-item-title{font-size:.82rem;font-weight:500;color:#ffffffd9;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.queue-item-meta{font-size:.68rem;color:#ffffff4d}.queue-item-drag-handle{color:#fff3;flex-shrink:0;cursor:grab}.queue-item-remove{background:none;border:none;color:#ff505066;cursor:pointer;padding:4px;border-radius:4px;transition:all .2s ease;flex-shrink:0}.queue-item-remove:hover{color:#ff5050cc;background:#ff505014}.queue-item-spinner{width:16px;height:16px;border:2px solid rgba(100,180,255,.2);border-top-color:#64b4ffb3;border-radius:50%;animation:spinnerRotate 1s linear infinite;flex-shrink:0}.queue-empty{display:flex;flex-direction:column;align-items:center;gap:8px;padding:40px 20px;text-align:center}.queue-empty p{font-size:.85rem;font-weight:500;color:#ffffff59;margin:0}.queue-empty span{font-size:.75rem;color:#fff3}.queue-item.suggestion{border-color:#ffb4321f;background:#ffb4320a}.suggestion-actions{display:flex;gap:6px;flex-shrink:0}.suggestion-approve{background:#64dc641a;border:1px solid rgba(100,220,100,.2);color:#64dc64cc;padding:5px 8px;border-radius:6px;cursor:pointer;transition:all .2s ease}.suggestion-approve:hover{background:#64dc6433;border-color:#64dc6466}.suggestion-reject{background:#ff505014;border:1px solid rgba(255,80,80,.15);color:#ff505099;padding:5px 8px;border-radius:6px;cursor:pointer;transition:all .2s ease}.suggestion-reject:hover{background:#ff505026;border-color:#ff50504d}.suggest-section{border-top:1px solid rgba(255,255,255,.06);padding-top:12px}.suggest-song-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:10px 16px;background:#ffb43214;border:1px solid rgba(255,180,50,.15);border-radius:10px;color:#ffc850d9;font-size:.82rem;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:inherit}.suggest-song-btn:hover{background:#ffb43226;border-color:#ffb4324d}.suggest-form{display:flex;flex-direction:column;gap:8px}.suggest-input{width:100%;padding:10px 12px;background:#0000004d;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;font-size:.82rem;font-family:inherit;outline:none;transition:border-color .2s ease;box-sizing:border-box}.suggest-input:focus{border-color:#ffb4324d}.suggest-input::placeholder{color:#ffffff40}.suggest-title-input{font-size:.78rem}.suggest-form-actions{display:flex;gap:8px}.suggest-submit-btn{flex:1;padding:8px 16px;background:#ffb4321f;border:1px solid rgba(255,180,50,.25);border-radius:8px;color:#ffc850e6;font-size:.78rem;font-weight:600;cursor:pointer;transition:all .2s ease;font-family:inherit}.suggest-submit-btn:hover:not(:disabled){background:#ffb43233}.suggest-submit-btn:disabled{opacity:.4;cursor:not-allowed}.suggest-cancel-btn{padding:8px 16px;background:#ffffff0a;border:1px solid rgba(255,255,255,.08);border-radius:8px;color:#fff6;font-size:.78rem;font-weight:500;cursor:pointer;transition:all .2s ease;font-family:inherit}.suggest-cancel-btn:hover{background:#ffffff14;color:#fff9}.suggest-pending{display:flex;align-items:center;gap:8px;padding:10px 12px;background:#ffb4320f;border:1px solid rgba(255,180,50,.12);border-radius:10px;font-size:.78rem;color:#ffc850b3}.suggest-pending svg{flex-shrink:0;animation:spinnerRotate 3s linear infinite}.queue-add-section{border-bottom:1px solid rgba(255,255,255,.06);padding-bottom:12px!important}.queue-add-buttons{display:flex;gap:8px}.queue-add-btn{flex:1;display:flex;align-items:center;justify-content:center;gap:6px;padding:10px 12px;background:#ffffff0a;border:1px dashed rgba(255,255,255,.12);border-radius:8px;color:#fff9;font-size:12px;font-weight:500;cursor:pointer;transition:all .2s ease}.queue-add-btn:hover{background:#c8ff7a0f;border-color:#c8ff7a40;color:#c8ff7ae6}.queue-add-form{display:flex;flex-direction:column;gap:8px}.queue-add-input-row{display:flex;gap:6px}.queue-add-input{flex:1;padding:8px 12px;background:#ffffff0a;border:1px solid rgba(255,255,255,.1);border-radius:8px;color:#fff;font-size:13px;outline:none;transition:border-color .2s}.queue-add-input:focus{border-color:#c8ff7a4d}.queue-add-input:disabled{opacity:.5}.queue-add-submit{display:flex;align-items:center;justify-content:center;width:36px;height:36px;background:#c8ff7a1f;border:1px solid rgba(200,255,122,.25);border-radius:8px;color:#c8ff7ae6;cursor:pointer;transition:all .2s;flex-shrink:0}.queue-add-submit:hover:not(:disabled){background:#c8ff7a33}.queue-add-submit:disabled{opacity:.4;cursor:not-allowed}.queue-add-cancel{padding:6px 12px;background:none;border:none;color:#fff6;font-size:12px;cursor:pointer;align-self:flex-start}.queue-add-cancel:hover{color:#ffffffb3}.queue-add-loading{padding:8px;text-align:center;color:#c8ff7ab3;font-size:12px}.queue-add-error{color:#ff6464cc;font-size:12px;padding:4px 0 0;margin:0}.queue-add-spinner{width:16px;height:16px;border:2px solid rgba(200,255,122,.2);border-top-color:#c8ff7acc;border-radius:50%;animation:queue-spin .7s linear infinite}@keyframes queue-spin{to{transform:rotate(360deg)}}.queue-backdrop{position:fixed;inset:0;z-index:124;background:#0000004d;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}@media(max-width:480px){.queue-panel{width:100vw;max-width:100vw}.queue-toggle{bottom:80px;left:12px}}.app-container{width:100vw;height:100vh;position:relative;overflow:hidden;background:#000}.gradient-overlay{position:absolute;top:0;left:0;width:100%;height:100%;z-index:2;background:radial-gradient(ellipse at center,transparent 0%,transparent 40%,rgba(0,0,0,.7) 80%,rgba(0,0,0,.95) 100%);pointer-events:none}.landing-screen{position:absolute;top:0;left:0;width:100%;height:100%;z-index:3;overflow-y:auto;overflow-x:hidden;transition:opacity 1.2s ease-out,transform 1.2s ease-out;scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.15) transparent}.landing-screen::-webkit-scrollbar{width:6px}.landing-screen::-webkit-scrollbar-track{background:transparent}.landing-screen::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:3px}.landing-screen.fade-out{opacity:0;transform:scale(.95);pointer-events:none}.edge-glow{position:fixed;top:0;left:0;width:100%;height:100%;z-index:3;pointer-events:none;overflow:hidden;transition:opacity 1.2s ease-out}.edge-glow.fade-out{opacity:0}.edge-glow-blob{position:absolute;border-radius:50%;filter:blur(120px);opacity:.4;mix-blend-mode:screen}.edge-glow-blob--tl{top:-20%;left:-15%;width:50vw;height:50vh;background:radial-gradient(circle,#00ff88 0%,#00cc6a 40%,transparent 70%);animation:glowDrift1 12s ease-in-out infinite alternate}.edge-glow-blob--tr{top:-10%;right:-15%;width:45vw;height:45vh;background:radial-gradient(circle,#00e5ff 0%,#0097a7 40%,transparent 70%);animation:glowDrift2 15s ease-in-out infinite alternate}.edge-glow-blob--bl{bottom:-20%;left:-10%;width:40vw;height:50vh;background:radial-gradient(circle,#00ff88 0%,#00e676 40%,transparent 70%);animation:glowDrift3 18s ease-in-out infinite alternate}.edge-glow-blob--br{bottom:-15%;right:-10%;width:50vw;height:50vh;background:radial-gradient(circle,#00bfa5 0%,#009688 40%,transparent 70%);animation:glowDrift4 14s ease-in-out infinite alternate}@keyframes glowDrift1{0%{transform:translate(0) scale(1);opacity:.35}50%{transform:translate(5%,8%) scale(1.1);opacity:.5}to{transform:translate(-3%,5%) scale(.95);opacity:.3}}@keyframes glowDrift2{0%{transform:translate(0) scale(1);opacity:.3}50%{transform:translate(-6%,5%) scale(1.15);opacity:.45}to{transform:translate(4%,-3%) scale(1.05);opacity:.35}}@keyframes glowDrift3{0%{transform:translate(0) scale(1);opacity:.25}50%{transform:translate(8%,-6%) scale(1.2);opacity:.4}to{transform:translate(-5%,-2%) scale(.9);opacity:.3}}@keyframes glowDrift4{0%{transform:translate(0) scale(1);opacity:.3}50%{transform:translate(-4%,-7%) scale(1.1);opacity:.45}to{transform:translate(6%,-4%) scale(1.05);opacity:.35}}.hero-section{min-height:100vh;display:flex;align-items:center;justify-content:center;position:relative}.content-wrapper{text-align:center;color:#fff;max-width:600px;padding:2rem;position:relative;z-index:4}.title{font-size:5rem;font-weight:700;letter-spacing:-.02em;margin:0 0 .5rem;line-height:1;background:linear-gradient(135deg,#c8ff7a,#a8ff60 20%,#fff 45% 55%,#a8ff60 80%,#c8ff7a);background-size:200% 200%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:titleGradientShift 6s ease-in-out infinite}@keyframes titleGradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.tagline{font-size:1.25rem;font-weight:400;color:#ffffffbf;margin:0 0 3rem;letter-spacing:.01em}.upload-box{border:2px dashed rgba(255,255,255,.3);border-radius:12px;padding:3rem 2rem;cursor:pointer;transition:all .3s ease;background:#0000004d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.upload-box:hover{border-color:#c8ff7a80;background:#0006;box-shadow:0 0 30px #c8ff7a14}.upload-box.dragging{border-color:#c8ff7ab3;background:#c8ff7a0a;transform:scale(1.02);box-shadow:0 0 40px #c8ff7a1f}.upload-content{display:flex;flex-direction:column;align-items:center;gap:1.5rem}.upload-text{font-size:1.125rem;font-weight:500;color:#ffffffd9;line-height:1.6;margin:0}.upload-icon{width:48px;height:48px;color:#fff9}.accepted-formats{font-size:.875rem;color:#fff6;margin:0}.scroll-indicator{position:absolute;bottom:32px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:8px;color:#ffffff59;animation:scrollBounce 2s ease-in-out infinite;cursor:pointer;z-index:5}.scroll-indicator-text{font-size:.75rem;font-weight:500;letter-spacing:.1em;text-transform:uppercase}.scroll-indicator svg{width:20px;height:20px}@keyframes scrollBounce{0%,to{transform:translate(-50%) translateY(0);opacity:.35}50%{transform:translate(-50%) translateY(6px);opacity:.6}}.stage-section{min-height:100vh;padding:80px 48px 120px;position:relative;z-index:4}.stage-section-header{text-align:center;margin-bottom:48px}.stage-title{font-size:3rem;font-weight:700;letter-spacing:-.02em;margin:0 0 .75rem;background:linear-gradient(135deg,#fff,#c8ff7a,#0f8);background-size:200% 200%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:titleGradientShift 8s ease-in-out infinite}.stage-subtitle{font-size:1.1rem;color:#ffffff80;font-weight:400;margin:0}.stage-rooms-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:24px;max-width:1200px;margin:0 auto}.stage-room-card{background:#ffffff0a;border:1px solid rgba(255,255,255,.1);border-radius:16px;overflow:hidden;transition:all .3s ease;cursor:pointer}.stage-room-card:hover{border-color:#c8ff7a4d;background:#ffffff0f;transform:translateY(-4px);box-shadow:0 12px 40px #0006,0 0 30px #c8ff7a0f}.room-card-preview{width:100%;aspect-ratio:16 / 9;background:linear-gradient(135deg,#00ff880d,#00e5ff0d,#0000004d);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.room-card-preview:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,rgba(200,255,122,.08) 0%,transparent 60%);animation:previewPulse 4s ease-in-out infinite}@keyframes previewPulse{0%,to{opacity:.5;transform:scale(1)}50%{opacity:1;transform:scale(1.1)}}.room-card-visualizer-placeholder{font-size:.8rem;color:#ffffff40;font-weight:500;letter-spacing:.05em;z-index:1}.room-card-live-badge{position:absolute;top:12px;right:12px;display:flex;align-items:center;gap:6px;padding:4px 10px;background:#ff3232e6;border-radius:6px;font-size:.7rem;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.08em;z-index:1}.live-dot{width:6px;height:6px;border-radius:50%;background:#fff;animation:livePulse 1.5s ease-in-out infinite}@keyframes livePulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}.room-card-info{padding:16px 20px}.room-card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.room-card-name{font-size:1rem;font-weight:600;color:#fffffff2;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-card-audience{display:flex;align-items:center;gap:4px;font-size:.75rem;color:#fff6;flex-shrink:0}.room-card-audience svg{width:14px;height:14px}.room-card-host{font-size:.8rem;color:#fff6;margin:0 0 12px}.room-card-host span{color:#c8ff7acc;font-weight:500}.room-card-now-playing{display:flex;align-items:center;gap:8px;font-size:.8rem;color:#ffffff80;padding:10px 12px;background:#0000004d;border-radius:8px;margin-bottom:12px}.room-card-now-playing svg{width:14px;height:14px;flex-shrink:0;color:#c8ff7ab3}.room-card-now-playing-text{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.room-card-join-btn{width:100%;padding:10px;background:#c8ff7a1f;border:1px solid rgba(200,255,122,.25);border-radius:10px;color:#c8ff7af2;font-size:.875rem;font-weight:600;cursor:pointer;transition:all .2s ease;letter-spacing:.02em}.room-card-join-btn:hover{background:#c8ff7a33;border-color:#c8ff7a66;box-shadow:0 0 20px #c8ff7a1a;transform:translateY(-1px)}.room-card-join-btn:active{transform:translateY(0)}.stage-empty{text-align:center;padding:80px 40px;color:#ffffff4d}.stage-empty-icon{width:48px;height:48px;margin:0 auto 16px;opacity:.4}.stage-empty-text{font-size:1rem;font-weight:500;margin:0 0 4px}.stage-empty-sub{font-size:.85rem;margin:0;opacity:.7}.loading-screen{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;display:flex;align-items:center;justify-content:center;background:#000000bf;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);animation:loadingFadeIn .4s ease-out}@keyframes loadingFadeIn{0%{opacity:0}to{opacity:1}}.loading-content{display:flex;flex-direction:column;align-items:center;gap:2rem}.loading-spinner{position:relative;width:56px;height:56px}.spinner-ring{position:absolute;inset:0;border-radius:50%;border:2px solid transparent;border-top-color:#c8ff7ae6;animation:spinnerRotate 1s linear infinite}.spinner-ring-2{inset:6px;border-top-color:#c8ff7a4d;animation-duration:1.5s;animation-direction:reverse}@keyframes spinnerRotate{to{transform:rotate(360deg)}}.loading-message{font-size:1rem;font-weight:500;color:#fffc;margin:0;letter-spacing:.02em;animation:messagePulse 2s ease-in-out infinite;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}@keyframes messagePulse{0%,to{opacity:.7}50%{opacity:1}}.soundcloud-section{margin-top:1.5rem;width:100%}.soundcloud-divider{display:flex;align-items:center;gap:16px;margin-bottom:1.25rem}.divider-line{flex:1;height:1px;background:#ffffff1f}.divider-text{font-size:.875rem;color:#ffffff4d;font-weight:500;text-transform:lowercase}.soundcloud-input-wrapper{display:flex;align-items:center;gap:0;background:#0000004d;border:1px solid rgba(255,255,255,.15);border-radius:12px;overflow:hidden;transition:all .3s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.soundcloud-input-wrapper:focus-within{border-color:#ff770080;box-shadow:0 0 0 2px #ff77001a}.soundcloud-icon{color:#ff7700b3;margin-left:14px;flex-shrink:0}.soundcloud-input{flex:1;background:transparent;border:none;outline:none;color:#fff;font-size:.9375rem;font-weight:400;padding:14px 12px;font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif}.soundcloud-input::placeholder{color:#ffffff4d}.soundcloud-submit{background:#ff770026;border:none;border-left:1px solid rgba(255,255,255,.08);color:#ff7700e6;padding:14px 16px;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center}.soundcloud-submit:hover:not(:disabled){background:#ff770040;color:#f70}.soundcloud-submit:disabled{opacity:.3;cursor:not-allowed}.soundcloud-error{color:#ff6464e6;font-size:.8125rem;margin:8px 0 0;text-align:left;padding-left:4px}@media(max-width:768px){.title{font-size:3.5rem}.tagline{font-size:1rem;margin-bottom:2rem}.upload-box{padding:2rem 1.5rem}.upload-text{font-size:1rem}.upload-icon{width:40px;height:40px}.stage-section{padding:60px 24px 100px}.stage-title{font-size:2rem}.stage-rooms-grid{grid-template-columns:1fr}}@media(max-width:480px){.title{font-size:2.5rem}.content-wrapper{padding:1rem}.stage-section{padding:40px 16px 80px}}.visualizer-background{position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;filter:blur(40px);transition:filter 1.2s ease-out}.visualizer-background.unblurred{filter:blur(0px)}html,body,#root{margin:0;width:100%;height:100%;background:#000;overflow:hidden;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,*:before,*:after{box-sizing:border-box}.app-root{width:100%;height:100%;position:relative}.bg-canvas{position:absolute!important;inset:0;transition:filter 1.2s ease,transform 1.2s ease}.bg-canvas.blurred{filter:blur(30px) brightness(.8);transform:scale(1.05)}.bg-canvas.unblurred{filter:blur(0px);transform:scale(1)}.landing-ui{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#fff;text-align:center;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);animation:fadeIn 1.5s ease}.processing-overlay{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;background:#0006;font-size:18px;letter-spacing:.05em}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}::selection{background:#c8ff7a4d;color:#fff}
