@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;600;800&display=swap";:root{--primary: #FF512F;--secondary: #DD2476;--bg-dark: #050505;--glass-bg: rgba(20, 20, 20, .4);--glass-border: rgba(255, 255, 255, .05);--text-main: #FFFFFF;--text-muted: #A0A0A0}*{box-sizing:border-box;margin:0;padding:0;font-family:Outfit,-apple-system,sans-serif}body{background:radial-gradient(circle at 100% 0%,#1a0808 0%,var(--bg-dark) 100%);color:var(--text-main);height:100vh;overflow:hidden}.gradient-text{background:linear-gradient(90deg,var(--primary),var(--secondary));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.glass-panel{background:var(--glass-bg);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid var(--glass-border);border-radius:16px;box-shadow:0 8px 32px #00000080}.tv-layout{display:flex;height:100vh;width:100vw;padding:24px;gap:24px}.main-stage{flex:1;display:flex;flex-direction:column;gap:24px;min-width:0}.top-header{display:flex;justify-content:space-between;align-items:center;padding:16px 32px;gap:32px}.host-search-bar{flex:1;max-width:600px;background:#ffffff14;border:1px solid rgba(255,255,255,.15);border-radius:100px;display:flex;align-items:center;padding:14px 24px;gap:16px;transition:all .3s ease}.host-search-bar:focus-within{border-color:#ff512f80;box-shadow:0 0 20px #ff512f33,inset 0 2px 8px #00000080;background:#141414cc}.host-search-bar input{flex:1;background:transparent;border:none;outline:none;color:#fff;font-size:1.15rem;font-family:inherit}.host-search-bar input::placeholder{color:#666}.logo-wrapper{display:flex;align-items:center;gap:16px}.brand-logo-img{width:64px;height:64px;border-radius:50%;object-fit:contain;box-shadow:0 0 24px #ff512f66;background:#fff}.brand-name{font-size:2.2rem;font-weight:800;letter-spacing:-1px;color:#fff}.highlight-t{color:#ff512f}.highlight-s{color:#f09819}.highlight-c{color:#dd2476}.join-pill{display:flex;align-items:center;gap:20px;padding:12px 24px;border-radius:100px}.qr-box{background:#fff;padding:6px;border-radius:8px;display:flex;align-items:center}.join-text{display:flex;flex-direction:column}.join-text span{font-size:.95rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:1px}.join-text strong{font-size:1.5rem;font-weight:600;color:#fff}.video-canvas{flex:1;position:relative;display:flex;align-items:center;justify-content:center;border-radius:20px;background:var(--glass-bg);overflow:hidden;border:1px solid var(--glass-border);box-shadow:0 8px 32px #0006}.video-canvas:before{display:none}.video-inner{position:absolute;top:0;left:0;right:0;bottom:0;background:transparent;border-radius:20px;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.glow-icon{filter:drop-shadow(0 0 30px rgba(221,36,118,.6));margin-bottom:24px;animation:float 4s ease-in-out infinite}.video-inner h1{font-size:3.5rem;font-weight:800;margin-bottom:12px}.video-inner p{font-size:1.3rem;color:var(--text-muted)}@keyframes bg-pulse{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-10px)}to{transform:translateY(0)}}.now-singing{display:flex;align-items:center;gap:24px;padding:24px 32px;border-left:6px solid var(--primary);position:relative;overflow:hidden}.now-singing:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,rgba(255,81,47,.1),transparent);pointer-events:none}.mic-pulse{background:#ff512f33;width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;animation:pulse 2s infinite}@keyframes pulse{0%{box-shadow:0 0 #ff512f66}70%{box-shadow:0 0 0 20px #ff512f00}to{box-shadow:0 0 #ff512f00}}.singer-details{display:flex;flex-direction:column;z-index:2}.singer-details span{font-size:1.1rem;color:var(--primary);text-transform:uppercase;font-weight:600;letter-spacing:1px}.singer-details h2{font-size:2rem;font-weight:600}.sidebar{width:440px;display:flex;flex-direction:column;padding:32px}.sidebar h3{font-size:2rem;font-weight:800;margin-bottom:32px;display:flex;align-items:center;gap:16px}.sidebar h3:after{content:"";flex:1;height:2px;background:linear-gradient(90deg,var(--glass-border),transparent)}.queue-list{display:flex;flex-direction:column;gap:20px;list-style:none}.queue-item{display:flex;gap:20px;padding:16px;border-radius:16px;background:#ffffff05;border:1px solid transparent;transition:all .3s ease}.queue-item.active{background:#ffffff0f;border:1px solid rgba(255,255,255,.15);box-shadow:0 8px 32px #0000004d}.queue-art{width:72px;height:72px;border-radius:12px;background:linear-gradient(135deg,#2a2a2a,#111);display:flex;align-items:center;justify-content:center;box-shadow:inset 0 2px 10px #00000080;flex-shrink:0}.art-gradient-1{background:linear-gradient(135deg,#ff512f,#dd2476)}.art-gradient-2{background:linear-gradient(135deg,#12c2e9,#c471ed)}.queue-info{display:flex;flex-direction:column;justify-content:center;flex:1;overflow:hidden}.queue-title{font-size:1.3rem;font-weight:600;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:6px}.queue-user{font-size:1.05rem;color:var(--text-muted);display:flex;align-items:center;gap:8px}.search-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px;width:100%;height:100%;padding:32px;overflow-y:auto;align-content:start}.search-card{background:#ffffff08;border:1px solid rgba(255,255,255,.05);border-radius:16px;overflow:hidden;transition:all .3s ease;cursor:pointer;display:flex;flex-direction:column}.search-card:hover{background:#ffffff14;border-color:var(--primary);transform:translateY(-4px);box-shadow:0 12px 32px #0006}.search-thumbnail{width:100%;aspect-ratio:16/9;object-fit:cover;border-bottom:1px solid rgba(255,255,255,.05)}.search-card-info{padding:16px;flex:1;display:flex;flex-direction:column;justify-content:center}.search-card-info h4{font-size:1.1rem;font-weight:600;margin-bottom:4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:#fff}.search-card-info p{font-size:.9rem;color:var(--text-muted)}.animate-spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.ux-btn{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:12px 24px;border-radius:100px;font-family:inherit;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;gap:8px}.ux-btn:hover:not(:disabled){background:var(--primary);border-color:var(--primary);box-shadow:0 0 20px #ff512f66}.ux-btn:disabled{opacity:.5;cursor:not-allowed}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#ff512f99}.bottom-queue-bar{scrollbar-width:auto}@media (max-width: 1024px){.tv-layout{padding:16px;gap:16px}.sidebar{width:340px;padding:24px}.top-header{flex-wrap:wrap;padding:16px 24px}.brand-name{font-size:1.8rem}.join-pill,.host-search-bar{max-width:none;flex:1;min-width:250px}}.queue-mobile-list,.queue-toggle-arrow{display:none}.bottom-queue-bar{display:flex;flex-direction:row;align-items:center;padding:12px 24px;gap:20px;min-height:108px;min-width:0;width:100%;box-sizing:border-box}.queue-bar-header{width:auto!important;flex-shrink:0;padding-right:20px!important;border-right:1px solid rgba(255,255,255,.1);gap:12px!important}@keyframes slideDownBounce{0%{transform:translate(-50%,-150%);opacity:0}60%{transform:translate(-50%,15%);opacity:1}80%{transform:translate(-50%,-5%);opacity:1}to{transform:translate(-50%);opacity:1}}@media (max-width: 768px){body{overflow-y:auto!important;background:linear-gradient(180deg,#0a0205,#050505 30%,#050505)!important}.tv-layout{flex-direction:column!important;height:auto!important;min-height:100vh;padding:0!important;gap:0!important;overflow:visible!important}.main-stage{flex:none!important;height:auto!important;order:1!important;gap:0!important}.top-header{flex-direction:row!important;justify-content:flex-start!important;align-items:center!important;padding:10px 16px!important;gap:12px!important;height:68px!important;box-sizing:border-box!important;border-radius:0!important;border:none!important;position:fixed!important;top:0!important;left:0!important;right:0!important;z-index:100!important;background:#050505f2!important;backdrop-filter:blur(24px) saturate(180%)!important;-webkit-backdrop-filter:blur(24px) saturate(180%)!important;box-shadow:0 1px #ff512f1a!important}.join-pill{display:flex!important;padding:6px!important;gap:0!important;flex-shrink:0!important;width:auto!important;min-width:unset!important;align-self:center!important}.join-text{display:none!important}.logo-wrapper{gap:8px!important;flex-shrink:0!important}.brand-logo-img{width:32px!important;height:32px!important;box-shadow:0 0 16px #ff512f66!important}.brand-name{display:none!important}.host-search-bar{flex:1!important;max-width:none!important;min-width:0!important;padding:10px 14px!important;border-radius:12px!important}.video-canvas{position:fixed!important;top:68px!important;left:0!important;right:0!important;z-index:90!important;width:100%!important;height:56.25vw!important;aspect-ratio:unset!important;min-height:unset!important;border-radius:0!important;flex:none!important;border:none!important;background:#050505fa!important;box-shadow:0 2px 12px #0006!important}.video-canvas:before{display:none!important}.video-inner{border-radius:0!important;background:transparent!important}.glass-mic-icon{transform:scale(.7)!important;margin:0 auto!important}.video-inner h1{font-size:1.3rem!important;margin-bottom:4px!important}.video-inner p{font-size:.8rem!important;padding:0 24px!important}.bottom-queue-bar{position:fixed!important;top:auto!important;bottom:0!important;left:0!important;right:0!important;z-index:89!important;flex-direction:column!important;align-items:stretch!important;padding:0!important;gap:0!important;min-height:unset!important;border-radius:0!important;overflow:hidden!important;border:none!important;background:#0a0a0af7!important;backdrop-filter:blur(16px)!important;-webkit-backdrop-filter:blur(16px)!important;border-bottom:1px solid rgba(255,255,255,.06)!important;max-height:72px!important;overscroll-behavior-y:contain!important;transition:max-height .35s cubic-bezier(.4,0,.2,1)!important}.bottom-queue-bar.queue-expanded{max-height:50vh!important}.queue-bar-header{padding:10px 16px!important;width:100%!important;flex-shrink:0!important}.queue-bar-header .mic-pulse{width:28px!important;height:28px!important;padding:5px!important;animation:none!important}.queue-bar-header span:first-of-type{font-size:.6rem!important}.queue-bar-header h3{font-size:.8rem!important}.queue-desktop-strip{display:none!important}.queue-mobile-list{display:block!important;padding:0 16px 12px!important}.queue-toggle-arrow{display:inline-block!important;transform:rotate(0)!important}.bottom-queue-bar.queue-expanded .queue-toggle-arrow{transform:rotate(180deg)!important}.bottom-queue-bar:not(.queue-expanded) .queue-mobile-list{opacity:0!important;pointer-events:none!important;transition:opacity .1s ease-out!important}.bottom-queue-bar.queue-expanded .queue-mobile-list{opacity:1!important;pointer-events:auto!important;transition:opacity .3s ease-in .15s!important;max-height:calc(50vh - 72px)!important;overflow-y:auto!important}.sidebar{width:100%!important;order:2!important;flex:none!important;height:auto!important;min-height:50vh!important;padding-top:calc(84px + 56.25vw)!important;padding-left:16px!important;padding-right:16px!important;padding-bottom:120px!important;border-radius:0!important;border:none!important;margin:0!important;background:transparent!important;box-shadow:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;overflow:visible!important}.search-header{position:sticky!important;top:calc(68px + 56.25vw)!important;z-index:85!important;background:#050505f7!important;backdrop-filter:blur(16px)!important;-webkit-backdrop-filter:blur(16px)!important;padding:10px 16px!important;margin:0 -16px 12px!important;border-bottom:1px solid rgba(255,255,255,.06)!important}.search-header h3{font-size:1rem!important;margin:0!important}.sidebar h3:after{display:none!important}.sidebar .queue-list{display:grid!important;grid-template-columns:1fr 1fr!important;gap:12px!important}.sidebar .queue-item.hover-card{padding:8px!important;border-radius:14px!important;background:#ffffff0a!important;border:1px solid rgba(255,255,255,.06)!important}.sidebar .queue-item.hover-card img{border-radius:10px!important}.sidebar .queue-item .queue-title{font-size:.8rem!important;-webkit-line-clamp:2!important;line-height:1.3!important}.sidebar .queue-item .queue-user{font-size:.65rem!important}.sidebar .queue-list>li:last-child{grid-column:1 / -1!important}}@keyframes slideDownBounce{0%{transform:translateY(-100%);opacity:0}60%{transform:translateY(10%);opacity:1}80%{transform:translateY(-5%);opacity:1}to{transform:translateY(0);opacity:1}}