@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap";:root{--color-bg-primary:#0a0a0f;--color-bg-secondary:#14141e99;--color-bg-glass:#ffffff0d;--color-bg-glass-hover:#ffffff1a;--color-bg-glass-active:#ffffff26;--color-primary:#4f46e5;--color-primary-hover:#4338ca;--color-text-main:#fff;--color-text-muted:#9ca3af;--color-border:#ffffff14;--shadow-glass:0 8px 32px 0 #0000005e;--blur-glass:blur(16px);--radius-glass:16px;--font-main:"Outfit", sans-serif}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-main);background-color:var(--color-bg-primary);color:var(--color-text-main);-webkit-font-smoothing:antialiased;overflow:hidden}a{color:inherit;text-decoration:none}.glass-panel{background:var(--color-bg-glass);-webkit-backdrop-filter:var(--blur-glass);border:1px solid var(--color-border);border-radius:var(--radius-glass);box-shadow:var(--shadow-glass)}.glass-button{background:var(--color-primary);color:#fff;cursor:pointer;font-weight:600;font-family:var(--font-main);border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:12px 24px;transition:all .2s;display:flex}.glass-button:hover{background:var(--color-primary-hover);transform:translateY(-2px);box-shadow:0 4px 12px #4f46e566}.glass-button:disabled{opacity:.6;cursor:not-allowed;box-shadow:none;transform:none}.glass-input{border:1px solid var(--color-border);color:#fff;width:100%;font-family:var(--font-main);background:#0003;border-radius:8px;padding:12px 16px;font-size:1rem;transition:all .3s}.glass-input:focus{border-color:var(--color-primary);background:#0006;outline:none;box-shadow:0 0 0 2px #4f46e533}.glass-input::placeholder{color:var(--color-text-muted)}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:.4s ease-out forwards fadeIn}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#ffffff4d}#root{width:100vw;height:100vh;display:flex}.login-container{justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}.login-background{background:radial-gradient(circle at 50% 50%, #1e1e2f 0%, var(--color-bg-primary) 100%);z-index:-2;width:100%;height:100%;position:absolute;top:0;left:0}.decor-circle{filter:blur(80px);z-index:-1;opacity:.5;border-radius:50%;position:absolute}.circle-1{background:#4f46e5;width:400px;height:400px;animation:10s ease-in-out infinite alternate float1;top:-100px;left:-100px}.circle-2{background:#9333ea;width:300px;height:300px;animation:8s ease-in-out infinite alternate float2;bottom:-50px;right:-50px}@keyframes float1{0%{transform:translate(0)}to{transform:translate(100px,50px)}}@keyframes float2{0%{transform:translate(0)}to{transform:translate(-50px,-100px)}}.login-card{z-index:10;flex-direction:column;gap:32px;width:100%;max-width:400px;padding:40px;display:flex}.login-header{text-align:center;flex-direction:column;align-items:center;gap:12px;display:flex}.icon-wrapper{background:#4f46e533;border:1px solid #4f46e566;border-radius:50%;justify-content:center;align-items:center;padding:16px;display:flex}.login-icon{color:#818cf8}.login-header h2{letter-spacing:-.02em;font-size:2rem;font-weight:700}.login-header p{color:var(--color-text-muted)}.login-form{flex-direction:column;gap:20px;display:flex}.input-group{position:relative}.input-icon{color:var(--color-text-muted);pointer-events:none;transition:color .3s;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.glass-input:focus+.input-icon,.input-group:focus-within .input-icon{color:var(--color-primary)}.input-group .glass-input{padding-left:48px}.login-btn{width:100%;margin-top:12px}.login-error{color:#ef4444;text-align:center;background:#ef44441a;border:1px solid #ef444433;border-radius:8px;padding:12px;font-size:.9rem;animation:.3s ease-out fadeIn}.sidebar-container{pointer-events:auto;flex-direction:column;width:280px;animation-delay:.1s;display:flex}.sidebar-header{border-bottom:1px solid var(--color-border);align-items:center;gap:12px;padding:20px;display:flex}.sidebar-header h3{text-transform:uppercase;letter-spacing:.05em;color:var(--color-text-muted);font-size:1.1rem;font-weight:600}.sidebar-scroll{flex:1;padding:12px;overflow-y:auto}.loading-state{text-align:center;color:var(--color-text-muted);padding:24px}.category-list{flex-direction:column;gap:4px;list-style:none;display:flex}.category-item{cursor:pointer;color:var(--color-text-muted);border-radius:8px;align-items:center;gap:12px;padding:12px 16px;transition:all .2s;display:flex}.category-item:hover{background:var(--color-bg-glass-hover);color:#fff;transform:translate(4px)}.category-item.active{background:var(--color-bg-glass-active);color:var(--color-primary);border-left:3px solid var(--color-primary);font-weight:600}.channel-list-container{pointer-events:auto;flex-direction:column;width:320px;animation-delay:.2s;display:flex}.channel-list-scroll{flex:1;padding:16px;overflow-y:auto}.empty-state{text-align:center;color:var(--color-text-muted);padding:24px}.channels-grid{flex-direction:column;gap:12px;display:flex}.channel-card{cursor:pointer;background:#ffffff05;border:1px solid #0000;border-radius:12px;align-items:center;gap:16px;padding:12px;transition:all .3s;display:flex}.channel-card:hover{background:var(--color-bg-glass-hover);border-color:var(--color-border);transform:scale(1.02)}.channel-card.active{background:#4f46e526;border-color:#4f46e54d}.channel-icon-wrapper{background:#0000004d;border-radius:8px;justify-content:center;align-items:center;width:48px;height:48px;display:flex;position:relative;overflow:hidden}.channel-icon{object-fit:contain;width:100%;height:100%;padding:4px}.channel-icon-placeholder{color:var(--color-text-muted);font-size:1.2rem;font-weight:700}.playing-indicator{color:#fff;background:#4f46e5cc;justify-content:center;align-items:center;width:100%;height:100%;animation:.2s ease-out fadeIn;display:flex;position:absolute;top:0;left:0}.channel-info{flex-direction:column;flex:1;gap:4px;display:flex;overflow:hidden}.channel-name{white-space:nowrap;text-overflow:ellipsis;font-size:1rem;font-weight:500;overflow:hidden}.channel-category{color:var(--color-text-muted);font-size:.8rem}.video-player-wrapper{background-color:#000;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:relative;overflow:hidden}.video-element{object-fit:cover;pointer-events:auto;width:100%;height:100%}.video-controls-overlay{opacity:1;z-index:20;transition:opacity .5s,transform .5s;display:flex;position:absolute;bottom:32px;right:32px}.video-controls-overlay.controls-hidden{opacity:0;pointer-events:none;transform:translateY(20px)}.controls-bottom-bar{border-radius:var(--radius-glass);background:var(--color-bg-glass);-webkit-backdrop-filter:var(--blur-glass);border:1px solid var(--color-border);box-shadow:var(--shadow-glass);align-items:center;gap:16px;padding:12px 20px;display:flex}.control-btn{color:#fff;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;padding:8px;transition:all .2s;display:flex}.control-btn:hover{background:#ffffff26;transform:scale(1.1)}.volume-container{align-items:center;gap:12px;transition:all .3s;display:flex}.volume-slider{cursor:pointer;width:100px;accent-color:var(--color-primary);border-radius:4px;outline:none;height:4px}.controls-spacer{flex:1}:fullscreen .video-player-wrapper{background-color:#000}:fullscreen .video-element{object-fit:contain}.dashboard-container{background-color:var(--color-bg-primary);width:100vw;height:100vh;position:relative;overflow:hidden}.video-background-layer{z-index:1;background:#000;justify-content:center;align-items:center;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.video-vignette{pointer-events:none;background:linear-gradient(90deg,#000c 0%,#0003 50%,#000c 100%);width:100%;height:100%;position:absolute;top:0;left:0}.empty-player{color:var(--color-text-muted);opacity:.5;flex-direction:column;align-items:center;gap:16px;animation:1s ease-out fadeIn;display:flex}.empty-icon{color:var(--color-primary);opacity:.8}.dashboard-ui-overlay{z-index:10;pointer-events:none;flex-direction:column;width:100%;height:100%;display:flex;position:absolute;top:0;left:0}.dashboard-header{pointer-events:auto;justify-content:space-between;align-items:center;margin:16px;padding:16px 24px;display:flex}.header-left{align-items:center;gap:16px;display:flex}.brand{align-items:center;gap:8px;display:flex}.brand h1{margin:0;font-size:1.5rem;font-weight:700}.brand span{color:var(--color-primary)}.current-category{color:var(--color-text-muted);border-left:1px solid var(--color-border);padding-left:16px;font-size:1.1rem;font-weight:500}.header-right{align-items:center;gap:24px;display:flex}.logout-btn{color:#ef4444;background:#ef444433;padding:8px 16px}.logout-btn:hover{background:#ef444466;box-shadow:0 4px 12px #ef444433}.dashboard-content{flex:1;gap:16px;padding:0 16px 16px;display:flex;overflow:hidden}.transparent-player-area{flex:1}.dashboard-ui-overlay{transition:opacity .6s cubic-bezier(.4,0,.2,1)}.dashboard-ui-overlay.ui-hidden{opacity:0;pointer-events:none}.dashboard-header,.sidebar-container,.channel-list-container,.video-vignette{transition:transform .6s cubic-bezier(.4,0,.2,1),opacity .6s}.dashboard-ui-overlay.ui-hidden .dashboard-header{transform:translateY(-40px)}.dashboard-ui-overlay.ui-hidden .sidebar-container,.dashboard-ui-overlay.ui-hidden .channel-list-container{transform:translate(-40px)}.video-vignette.ui-hidden{opacity:0}