html,body,#root{box-sizing:border-box;color:#fff;background-color:#000;width:100%;height:100%;margin:0;font-family:Franklin Gothic,Arial Narrow,Arial,sans-serif;overflow:hidden}.App{flex-direction:row;width:100%;height:100%;display:flex}#navbar{box-sizing:border-box;background-color:#0c0c0c;border-right:1px solid #1c1c1c;flex-direction:column;align-items:center;height:100%;padding:10px;display:flex}#navbar .nav-channel-list{flex-direction:column;gap:10px;display:flex}#navbar .nav-channel-list .nav-channel-button{cursor:pointer;border-radius:50%;outline:2px solid #fff;width:45px;display:flex;position:relative}#navbar .nav-channel-list .nav-channel-button.disabled{opacity:.5;outline:2px solid #1c1c1c}#navbar .nav-channel-list .nav-channel-button.disabled:hover{opacity:1}#navbar .nav-channel-list .nav-channel-button img{border-radius:50%;width:100%}#navbar .nav-channel-list .nav-channel-button .live-indicator{background-color:#858484;border-radius:50%;outline:3px solid #0c0c0c;width:10px;height:10px;position:absolute;left:2px}#navbar .nav-channel-list .nav-channel-button .live-indicator.on{background-color:red}#navbar .nav-channel-list .nav-channel-button .remove-indicator{text-align:center;background-color:#858484;border-radius:50%;outline:3px solid #0c0c0c;width:17px;height:17px;font-size:small;display:none;position:absolute;top:-5px;right:-5px}#navbar .nav-channel-list .nav-channel-button:hover .remove-indicator,#navbar .nav-channel-list .nav-channel-button:hover #navbar .nav-channel-list .nav-channel-button .remove-indicator:hover .remove-indicator{display:block}#navbar .nav-add-button{aspect-ratio:1;color:#fff;cursor:pointer;background-color:#1c1c1c;border:2px solid #2f3843;border-radius:25%;justify-content:center;align-items:center;width:45px;margin-top:10px;font-size:24px;display:flex}#navbar .nav-add-button:hover{background-color:#2c2c2c}.veil{z-index:1000;background-color:#0000007a;width:100%;height:100%;position:absolute}.veil.hidden{display:none}#add-channel-modal{z-index:1000;background-color:#1c1c1c;border:1px solid #2f3843;border-radius:8px;width:min(460px,90vw);height:75%;padding:20px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:0 0 100px 10px #000}#add-channel-modal .modal-content{height:100%;overflow-x:hidden}#add-channel-modal input{all:unset;color:#fff;background-color:#212121;border:1px solid #2f3843;border-radius:14px;outline:2px solid #0000;width:calc(100% - 20px);margin-top:10px;margin-bottom:10px;padding:10px;transition:all .5s}#add-channel-modal input:focus{border:1px solid #515a67;outline:2px solid #515a67}#add-channel-modal .search-results{flex-direction:column;gap:6px;margin-top:10px;display:flex;overflow-y:auto}#add-channel-modal .search-results .channel{cursor:pointer;background:#212121;border:1px solid #2f3843;border-radius:20px;align-items:center;gap:20px;padding:10px;display:flex}#add-channel-modal .search-results .channel:hover{background-color:#2c2c2c}#add-channel-modal .search-results .channel .channel-profile-image{border-radius:50%;width:50px}#add-channel-modal .search-results .channel .channel-text{color:#757575;flex-direction:column;gap:2px;font-size:16px;display:flex}#add-channel-modal .search-results .channel .channel-text .channel-name{color:#fff}#add-channel-modal .search-results .channel .channel-text .channel-subtext{gap:10px;font-size:14px;display:flex}#add-channel-modal .search-results .channel .channel-text .channel-subtext.live{color:#dc5252}#add-channel-modal .search-results .channel .channel-text .channel-subtext .stream-category{color:#757575;background-color:#2c2c2c;border-radius:4px;padding:1px 4px}#player-container{flex:1;min-width:0;position:relative}#player-container .player-embed{background-color:#111;border-radius:12px;min-width:0;min-height:0;transition:top .2s linear,left .2s linear,width .2s,height .2s;overflow:hidden}#player-container .player-embed iframe{display:block;width:100%!important;height:100%!important}#player-container .player-embed.offline iframe{display:none}#player-container .player-embed:hover .player-actions{opacity:1;visibility:visible;background:linear-gradient(.25turn,#0000,#000000e6)}#player-container .player-offline{color:#757575;flex-direction:column;justify-content:center;align-items:center;gap:14px;width:100%;height:100%;display:flex;position:absolute;top:0}#player-container .player-offline img{border-radius:50%;width:10%}#player-container .player-actions{opacity:0;visibility:hidden;background:linear-gradient(.25turn,#0000,#0000);justify-content:center;align-items:center;width:50px;height:100%;transition:all .2s;display:flex;position:absolute;top:0;right:0}#player-container .player-actions button{all:unset;width:10px;height:10px;line-height:0}#player-container .player-actions button:hover{cursor:pointer;background-color:#434343;border-radius:25%;padding:5px}