:root{--border-color:#fff3}*{box-sizing:border-box;margin:0;padding:0;font-family:ui-sans-serif,system-ui,sans-serif}html,body{width:100vw;height:100vh}#root{background-color:#000;width:100%;height:100%;position:relative;overflow:hidden}.ytp-wrapper{border-radius:10px;justify-content:center;align-items:center;width:100%;height:80%;margin:20px 0 15px;display:flex;overflow:hidden}.player-container{border-radius:20px;width:2000px;height:1500px}.footer{flex-direction:column;gap:5px;width:100%;margin:0 0 20px 30px;display:flex}.controllerBtn-container{color:#f0f8ff;gap:10px;display:flex}.header{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10;background-color:#0006;justify-content:space-between;align-items:center;width:100%;padding:0 25px;display:flex;position:absolute;top:20px}.header-right-section{gap:15px;display:flex}.title{background-color:#0000004d;border:2px solid #fff3;border-radius:30px;align-items:center;gap:10px;padding:5px 30px;font-weight:700;display:flex}.coffee-btn{color:#000;cursor:pointer;background-color:#facc15e6;border:none;border-radius:30px;align-items:center;gap:5px;padding:7px 15px;font-size:14px;font-weight:700;transition:transform .2s,background-color .2s;display:flex}.coffee-btn svg,.coffee-btn p{color:#000}.coffee-btn:hover{background-color:#facc15;transform:scale(1.05)}.creator-info h3,p,.title{color:#fff}.creator-info h3{font-size:16px}.creator-info p{font-size:12px;font-weight:500}.rooms{border-left:2px solid var(--border-color);z-index:10;background-color:#000;grid-template-rows:1fr 7fr;width:400px;height:100%;transition:transform .75s ease-out;display:grid;position:fixed;top:0;right:-400px;transform:translate(0)}.rooms.open{z-index:10;transform:translate(-400px)}.sidebar-top{border-bottom:1px solid var(--border-color);color:#fff;justify-content:space-between;align-items:center;width:100%;padding:0 30px 0 20px;display:flex}.sidebar-bottom{flex-direction:column;gap:10px;padding:20px;display:flex}.channel-profile-picture{border:1px solid var(--border-color);border-radius:10px;width:60px;height:60px}.channel-profile-picture img{object-fit:cover;border-radius:10px;width:100%;height:100%}.card{border:1px solid var(--border-color);background-color:#fff3;border-right:none;border-top-left-radius:10px;border-bottom-left-radius:10px;align-items:center;gap:20px;padding:10px;display:flex}.channel-name-title{white-space:nowrap;text-overflow:ellipsis;cursor:default;width:255px;font-weight:600;overflow:hidden}.stream-status{color:#fff6;cursor:default;margin-top:5px;font-size:10px;font-weight:500}.playback-controls{color:#898888;z-index:10}.playback-controls:hover{color:#fff}.close-btn{border-radius:5px;transition:background-color .55s ease-in-out}.close-btn:hover{color:#000;background-color:#fff}.playlist{border:1px solid 2px solid #fff3;z-index:10;background-color:#0000004d;border-radius:50px;width:35px;height:auto;padding:7px}.playlist:hover{background-color:#d4d5d6;color:#2a2929!important}.player-overlay{z-index:5;position:absolute;inset:0}.main-overlay{z-index:999;scroll-behavior:none;isolation:isolate;background-image:url(/poster.webp);background-position:50%;background-size:cover;width:100%;height:100%;transition:opacity .8s,transform 1.2s;position:relative;inset:0;transform:scale(1)}.main-overlay:before{content:"";-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:0;border-radius:inherit;background-color:#0000001a;position:absolute;inset:0}.main-overlay.close{opacity:0;transform:scale(1.05)}.main-overlay video{object-fit:cover;opacity:0;filter:blur(8px)saturate(1.1);width:100%;height:100%;animation:1.6s forwards reveal;transform:scale(1.02)}.welcome-message{color:#f5e6d3;z-index:10;letter-spacing:2px;text-transform:lowercase;opacity:.9;text-shadow:0 0 10px #f5e6d34d,2px 2px #0003;font-family:Courier New,monospace;font-size:18px;position:absolute;bottom:40px;left:40px}.welcome-message:after{content:"_";animation:1s step-end infinite blink;display:inline-block}@keyframes blink{0%,50%{opacity:1}51%,to{opacity:0}}@keyframes reveal{0%{opacity:0;filter:blur(12px)saturate();transform:scale(1.05)}to{opacity:1;filter:blur()saturate(1.1);transform:scale(1)}}
