@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}*{margin:0;padding:0;box-sizing:border-box}:root{--bg-0:#04060d;--panel:#070b16;--panel-2:#0b1224;--blue:#1e7bff;--orange:#ff7a18;--amber:#ffb020;--line:rgba(120, 160, 255, 0.16);--text-dim:#9db0d6;--font-head:'Outfit', 'Segoe UI', sans-serif;--font-body:'Plus Jakarta Sans', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif}body{font-family:var(--font-body);background:radial-gradient(70% 55%at 12% -10%,rgba(30,123,255,.16),transparent 62%),radial-gradient(60% 50%at 95% 4%,rgba(255,122,24,.1),transparent 60%),var(--bg-0);color:#fff;overflow:hidden;height:100vh}.chat-title,.video-title{font-family:var(--font-head)}.error-content h3,.loading-content h3,h1,h2,h3{font-family:var(--font-head);font-weight:800}.stream-container{display:flex;width:100vw;height:100vh;background:#04060d;position:fixed;top:0;left:0;padding-bottom:60px}.video-section{flex:1;position:relative;background:#000;transition:all .3s ease}.chat-section{width:400px;height:100%;background:#070b16;border-left:1px solid #1b2743;display:flex;flex-direction:column;transition:all .3s ease}@media (max-width:768px){.stream-container{flex-direction:column;padding-bottom:60px}.video-section{height:calc(40vh - 60px);flex:none}.chat-section{width:100%;height:calc(58vh - 60px);border-left:none;border-top:1px solid #1b2743}}.stream-footer{position:fixed;bottom:0;left:0;width:100%;height:60px;background:rgba(5,8,17,.94);border-top:1px solid rgba(30,123,255,.45);display:flex;align-items:center;justify-content:space-between;padding:0 20px;z-index:1000;backdrop-filter:blur(10px)}.footer-controls,.footer-info{display:flex;align-items:center;gap:15px}.video-wrapper{position:relative;width:100%;height:100%}.video-player{width:100%;height:100%;object-fit:contain}.stream-header,.video-overlay{display:flex;justify-content:space-between}.video-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(to bottom,rgba(0,0,0,.6)0,transparent 20%,transparent 80%,rgba(0,0,0,.6) 100%);opacity:0;transition:opacity .3s ease;flex-direction:column;padding:20px;pointer-events:none}.video-overlay.visible,.volume-group:hover .volume-slider-container{opacity:1}.stream-header{align-items:flex-start;pointer-events:auto}.live-badge,.stream-info{display:flex;align-items:center;gap:15px}.live-badge{gap:8px;background:#ff2d46;color:#fff;padding:6px 12px;border-radius:20px;font-size:14px;font-weight:600}.live-dot{width:8px;height:8px;background:#fff;border-radius:50%;animation:pulse 2s infinite}.viewer-count{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.1);padding:6px 12px;border-radius:20px;font-size:14px;backdrop-filter:blur(10px)}.stream-actions{display:flex;gap:10px}.center-controls{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;justify-content:center;align-items:center;pointer-events:auto}.play-pause-btn{width:80px;height:80px;border:0;border-radius:50%;background:rgba(255,255,255,.2);color:#fff;font-size:24px;cursor:pointer;transition:all .3s ease;backdrop-filter:blur(10px)}.play-pause-btn:hover{background:#ff7a18;transform:scale(1.1)}.video-info{max-width:60%}.video-title{font-size:18px;font-weight:600;margin-bottom:5px}.video-description{color:#9db0d6;font-size:14px}.player-controls{display:flex;align-items:center;gap:15px}.control-btn,.volume-group{display:flex;align-items:center;pointer-events:auto}.control-btn{width:40px;height:40px;border:0;border-radius:50%;background:rgba(255,255,255,.1);color:#fff;cursor:pointer;justify-content:center;transition:all .3s ease;backdrop-filter:blur(10px);text-decoration:none}.control-btn:hover{background:rgba(30,123,255,.32);transform:translateY(-2px)}.control-btn.active{background:rgba(255,122,24,.9)}.volume-group{gap:8px}.volume-slider-container{width:80px;opacity:0;transition:opacity .3s ease;pointer-events:auto}.volume-slider{width:100%;height:4px;background:rgba(255,255,255,.3);border-radius:2px;outline:0;-webkit-appearance:none;cursor:pointer}.volume-slider::-webkit-slider-thumb{-webkit-appearance:none;width:12px;height:12px;background:#fff;border-radius:50%;cursor:pointer}.chat-header,.chat-title{display:flex;align-items:center}.chat-header{padding:20px;border-bottom:1px solid rgba(30,123,255,.35);background:linear-gradient(180deg,#0d1426,#070b16);justify-content:space-between}.chat-title{gap:10px;font-weight:600}.online-count{background:rgba(37,211,102,.18);color:#25d366;padding:4px 8px;border-radius:12px;font-size:12px}.chat-actions{display:flex;gap:8px}.auth-section{padding:20px;border-bottom:1px solid #1b2743}.auth-loading{display:flex;align-items:center;gap:10px;justify-content:center;color:#7d90b8}.auth-spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,.3);border-top:2px solid #ff7a18;border-radius:50%;animation:spin 1s linear infinite}.auth-options{text-align:center}.auth-prompt{margin-bottom:15px;color:#9db0d6;font-size:14px}.auth-btn{width:100%;padding:12px;border:0;border-radius:8px;margin-bottom:10px;cursor:pointer;gap:10px;justify-content:center;font-size:14px;font-weight:500;transition:all .3s ease}.auth-btn.google{background:#4285f4;color:#fff}.auth-btn.facebook{background:#1877f2;color:#fff}.auth-btn.anonymous{background:#1e7bff;color:#fff}.auth-btn:hover{opacity:.9;transform:translateY(-1px)}.auth-btn,.user-avatar,.user-info{display:flex;align-items:center}.user-info{padding:15px 20px;border-bottom:1px solid #1b2743;background:#0b1224;gap:12px}.user-avatar{width:32px;height:32px;border-radius:50%;background:#2c3d67;justify-content:center;overflow:hidden}.user-avatar img{width:100%;height:100%;object-fit:cover}.user-details{flex:1}.user-name{font-weight:600;display:block;font-size:14px}.user-status{font-size:12px;color:#25d366}.chat-messages-container{flex:1;overflow-y:auto;background:#070b16}.chat-messages{padding:20px;min-height:100%}.welcome-message{text-align:center;color:#7d90b8;padding:20px 0}.welcome-message .ico{font-size:24px;margin-bottom:10px;display:block}.chat-message{margin-bottom:15px;padding:12px;border-radius:8px;background:rgba(255,255,255,.05)}.chat-message.own-message{background:rgba(30,123,255,.22)}.message-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:5px}.message-sender{font-weight:600;font-size:14px}.message-time{font-size:12px;color:#7d90b8}.message-text{font-size:14px;line-height:1.4}.chat-input-container{padding:20px;background:#0b1224;border-top:1px solid #1b2743}.input-group{display:flex;gap:10px}.chat-input{flex:1;padding:12px 16px;border:1px solid #223154;border-radius:8px;background:#070b16;color:#fff;font-size:14px}.chat-input:disabled{opacity:.5;cursor:not-allowed}.chat-input:focus{outline:0;border-color:#1e7bff}.send-btn{padding:12px 20px;border:0;border-radius:8px;background:#ff7a18;color:#fff;cursor:pointer;transition:all .3s ease}.send-btn:hover:not(:disabled){background:#e5680a}.send-btn:disabled{opacity:.5;cursor:not-allowed}.loading-screen{position:fixed;top:0;left:0;width:100%;height:100%;background:#04060d;display:flex;align-items:center;justify-content:center;z-index:1000}.loading-content{text-align:center}.loading-spinner{width:50px;height:50px;border:3px solid rgba(255,255,255,.3);border-top:3px solid #ff7a18;border-radius:50%;animation:spin 1s linear infinite;margin:0 auto 20px}.error-content h3,.loading-content h3{font-size:24px;margin-bottom:10px}.loading-content p{color:#7d90b8}.error-screen{position:fixed;top:0;left:0;width:100%;height:100%;background:#04060d;display:none;align-items:center;justify-content:center;z-index:1000}.error-content{text-align:center;max-width:400px}.error-icon{font-size:64px;color:#ff7a18;margin-bottom:20px}.error-content p{color:#7d90b8;margin-bottom:30px}.error-actions{display:flex;gap:15px;justify-content:center}.btn{padding:12px 24px;border:0;border-radius:6px;font-size:14px;cursor:pointer;transition:all .3s ease;display:inline-block;text-align:center;text-decoration:none}.btn-primary{background:#ff7a18;color:#fff}.btn-secondary{background:rgba(30,123,255,.16);border:1px solid rgba(120,160,255,.35);color:#fff}.footer-home-link{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:999px;background:linear-gradient(90deg,#ff7a18,#ffb020);color:#0a0d16;font-size:.85rem;font-weight:800;font-family:var(--font-head);text-decoration:none;white-space:nowrap;transition:all .25s ease}.footer-home-link:hover{box-shadow:0 10px 24px -12px rgba(255,122,24,.9)}.btn:hover,.footer-home-link:hover{transform:translateY(-2px)}.buffering-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:rgba(0,0,0,.8);padding:20px 30px;border-radius:10px;display:none;align-items:center;gap:15px;z-index:10}.buffering-spinner{width:20px;height:20px;border:2px solid rgba(255,255,255,.3);border-top:2px solid #ff7a18;border-radius:50%;animation:spin 1s linear infinite}@media (max-width:768px){.stream-header{padding:0}.play-pause-btn{width:60px;height:60px;font-size:20px}.control-btn{width:36px;height:36px}.video-title{font-size:16px}.video-description{font-size:12px}.auth-section,.chat-input-container,.user-info{padding:15px}.stream-footer{padding:0 15px}.footer-controls,.footer-info{gap:10px}}@media (max-width:480px){.stream-info{flex-direction:column;gap:8px;align-items:flex-start}.player-controls{gap:8px}.footer-info{flex-direction:column;gap:5px;align-items:flex-start}.footer-controls{gap:8px}.footer-home-link span{display:none}.footer-home-link{padding:9px 12px}}.stream-container.fullscreen{width:100vw;height:100vh;padding-bottom:0;position:fixed;top:0;left:0;z-index:9999}.stream-container.fullscreen .video-section{width:100%;height:100%}.ico{width:1em;height:1em;display:inline-block;vertical-align:-.125em;flex-shrink:0}.ico-pause,.ico-vol-low,.ico-vol-mute,.is-playing .ico-play,.stream-container.fullscreen .chat-section,.stream-container.fullscreen .stream-footer{display:none}.is-muted .ico-vol-mute,.is-playing .ico-pause{display:inline-block}.is-low .ico-vol-on,.is-muted .ico-vol-low,.is-muted .ico-vol-on{display:none}.is-low .ico-vol-low{display:inline-block}