.app{width:100vw;height:100vh;overflow:hidden;background:#000}.iptv-container{width:100vw;height:100vh;overflow:hidden;position:relative;background:#000}.app-header{position:absolute;top:0;left:0;right:0;z-index:100;display:flex;align-items:center;padding:20px 40px;background:linear-gradient(180deg,#000c,#0000);transition:transform .3s ease,opacity .3s ease}.app-header.visible{transform:translateY(0);opacity:1}.app-header.hidden{transform:translateY(-100%);opacity:0}.logo-container{display:flex;align-items:center;position:relative}.logo{height:35px;width:auto;position:relative}.lab-badge{height:18px;width:auto;margin-left:2px;margin-bottom:15px;align-self:flex-start}.main-content{width:100%;height:100%;position:relative;overflow:hidden;display:flex;flex-direction:row}.main-content.split-view .player-container,.main-content.split-view .channel-list-bottom{width:50%}.player-container{width:100%;height:100%;position:relative;background:#000;transition:width .3s ease}.video-player{width:100%;height:100%;object-fit:contain;background:#000}.channel-overlay{position:absolute;top:20px;right:40px;background:linear-gradient(135deg,#00a0dff2,#0369a1f2);padding:15px 25px;border-radius:12px;box-shadow:0 8px 32px #00a0df66;animation:slideUp .3s ease;z-index:50}.overlay-content{display:flex;flex-direction:column;gap:5px}.channel-number{font-size:1.8rem;font-weight:700;color:#fff}.channel-name-overlay{font-size:1.2rem;font-weight:500;color:#fff}.favorites-panel{width:50%;height:100%;background:linear-gradient(135deg,#0f0f0ffa,#1e1e1efa);display:flex;align-items:center;justify-content:center;animation:slideInRight .3s ease;z-index:95}.favorites-content{display:flex;flex-direction:column;gap:40px;padding:60px;max-width:600px;width:100%;max-height:100vh;overflow-y:auto}.favorites-content::-webkit-scrollbar{width:8px}.favorites-content::-webkit-scrollbar-track{background:#0f0f0f80}.favorites-content::-webkit-scrollbar-thumb{background:#00a0df99;border-radius:4px}.favorites-content::-webkit-scrollbar-thumb:hover{background:#00a0df}.favorites-info{display:flex;flex-direction:column;gap:10px;border-bottom:2px solid rgba(0,160,223,.3);padding-bottom:20px}.favorites-label{font-size:1rem;font-weight:500;color:#888;text-transform:uppercase;letter-spacing:1px}.favorites-value{font-size:2rem;font-weight:700;color:#00a0df}.favorites-heart-container{display:flex;flex-direction:column;align-items:center;gap:20px;margin-top:40px;padding:20px;border-radius:12px;transition:background .3s ease}.favorites-heart-container.focused{background:#00a0df1a;border:2px solid rgba(0,160,223,.3)}.heart-icon{display:flex;align-items:center;justify-content:center;animation:pulse 1.5s ease-in-out infinite}.heart-icon svg{filter:drop-shadow(0 0 20px rgba(0,160,223,.6))}.favorites-instruction{font-size:1rem;color:#f0f0f0;text-align:center;font-weight:500}.menu-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000d9;display:flex;align-items:center;justify-content:center;z-index:200;animation:fadeIn .3s ease}.menu-container-horizontal{width:100%;display:flex;justify-content:center;padding:0 40px}.menu-items-horizontal{display:flex;flex-direction:row;gap:20px;align-items:center;justify-content:center;flex-wrap:nowrap;max-width:1400px}.menu-item-horizontal{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;padding:30px 25px;background:#1a1a1a99;border:2px solid transparent;border-radius:12px;transition:all .3s ease;cursor:pointer;flex-shrink:0}.menu-item-horizontal:hover{background:#282828b3;transform:translateY(-5px)}.menu-item-horizontal.selected{background:#00a0df33;border-color:#00a0df;transform:translateY(-8px) scale(1.05);box-shadow:0 8px 25px #00a0df80}.menu-icon{color:#888;transition:color .3s ease}.menu-item-horizontal.selected .menu-icon{color:#00a0df;filter:drop-shadow(0 0 10px rgba(0,160,223,.8))}.menu-label{font-size:1rem;font-weight:600;color:#888;text-align:center;transition:color .3s ease;white-space:nowrap}.menu-item-horizontal.selected .menu-label{color:#00a0df;font-weight:700}.submenu-dropdown{position:absolute;top:100%;left:50%;transform:translate(-50%);margin-top:10px;background:linear-gradient(135deg,#0f0f0ffa,#1e1e1efa);border:2px solid rgba(0,160,223,.5);border-radius:12px;padding:10px;min-width:180px;box-shadow:0 10px 40px #00a0df66;animation:slideDown .3s ease;z-index:300}.submenu-dropdown-right{position:absolute;top:0;left:100%;margin-left:10px;background:linear-gradient(135deg,#0f0f0ffa,#1e1e1efa);border:2px solid rgba(0,160,223,.5);border-radius:12px;padding:10px;min-width:180px;box-shadow:0 10px 40px #00a0df66;animation:slideRight .3s ease;z-index:400}.submenu-item{padding:15px 20px;background:#1a1a1a80;border:2px solid transparent;border-radius:8px;font-size:1rem;font-weight:600;color:#888;text-align:center;transition:all .3s ease;cursor:pointer;margin-bottom:8px}.submenu-item:last-child{margin-bottom:0}.submenu-item.selected{background:#00a0df4d;border-color:#00a0df;color:#00a0df;transform:scale(1.05);box-shadow:0 4px 15px #00a0df80}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideDown{0%{opacity:0;transform:translate(-50%) translateY(-10px)}to{opacity:1;transform:translate(-50%) translateY(0)}}@keyframes slideRight{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}.keyboard-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000e6;display:flex;align-items:center;justify-content:center;z-index:200;animation:fadeIn .3s ease}.keyboard-container{background:linear-gradient(135deg,#0f0f0ffa,#1e1e1efa);border:2px solid rgba(0,160,223,.5);border-radius:16px;padding:40px;box-shadow:0 10px 40px #00a0df4d;max-width:800px;width:90%}.keyboard-input-display{display:flex;align-items:center;gap:15px;margin-bottom:30px;padding:20px 30px;background:#00000080;border-radius:10px;border:2px solid rgba(0,160,223,.3)}.keyboard-input-label{font-size:1.3rem;font-weight:600;color:#00a0df}.keyboard-input-text{font-size:1.5rem;font-weight:700;color:#f0f0f0;flex:1;min-height:30px}.keyboard-grid{display:flex;flex-direction:column;gap:10px}.keyboard-row{display:flex;gap:10px;justify-content:center}.keyboard-key{padding:15px 20px;background:#1a1a1acc;border:2px solid rgba(60,60,60,.8);border-radius:8px;font-size:1.2rem;font-weight:600;color:#f0f0f0;min-width:50px;text-align:center;transition:all .3s ease;cursor:pointer}.keyboard-key.special{min-width:100px;background:#00a0df1a;border-color:#00a0df4d}.keyboard-key.selected{background:linear-gradient(135deg,#00a0df66,#0369a166);border-color:#00a0df;transform:scale(1.1);box-shadow:0 4px 15px #00a0df99;color:#00a0df}.recommended-section{display:flex;flex-direction:column;gap:15px;margin-top:30px;width:100%}.recommended-header{font-size:1.2rem;font-weight:700;color:#00a0df;text-transform:uppercase;letter-spacing:1px;border-bottom:2px solid rgba(0,160,223,.3);padding-bottom:10px}.recommended-list{display:flex;flex-direction:column;gap:10px}.recommended-item{display:flex;flex-direction:column;gap:5px;padding:15px 20px;background:#1a1a1a80;border-radius:8px;border:2px solid transparent;transition:all .3s ease;cursor:pointer}.recommended-item.selected{background:linear-gradient(135deg,#00a0df33,#0369a133);border-color:#00a0df;transform:scale(1.05);box-shadow:0 4px 12px #00a0df66}.recommended-num{font-size:1rem;font-weight:700;color:#00a0df}.recommended-name{font-size:1rem;font-weight:600;color:#f0f0f0}.recommended-meta{display:flex;gap:8px;font-size:.85rem}.recommended-country{color:#00a0df;font-weight:500}.recommended-res{color:#4caf50;font-weight:500}.channel-list-bottom{position:absolute;bottom:0;left:0;right:0;z-index:90;max-height:30vh;background:linear-gradient(0deg,#000000e6,#000000b3 70%,#0000);transition:transform .3s ease,opacity .3s ease,width .3s ease;overflow:hidden}.channel-list-bottom.visible{transform:translateY(0);opacity:1}.channel-list-bottom.hidden{transform:translateY(100%);opacity:0}.channel-list{display:flex;flex-direction:row;gap:15px;padding:20px 40px;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth}.channel-list::-webkit-scrollbar{height:6px}.channel-list::-webkit-scrollbar-track{background:#0f0f0f80}.channel-list::-webkit-scrollbar-thumb{background:#00a0df99;border-radius:3px}.channel-list::-webkit-scrollbar-thumb:hover{background:#00a0df}.channel-item{display:flex;flex-direction:column;align-items:flex-start;padding:12px 18px;background:linear-gradient(135deg,#1a1a1ae6,#2a2a2ae6);border-radius:8px;cursor:pointer;transition:all .3s ease;border:2px solid transparent;min-width:250px;max-width:300px;flex-shrink:0}.channel-item:hover{transform:scale(1.05);border-color:#00a0df;box-shadow:0 4px 12px #00a0df66}.channel-item.active{background:linear-gradient(135deg,#00a0df4d,#0369a14d);border-color:#00a0df;box-shadow:0 0 20px #00a0df99;transform:scale(1.1)}.channel-num{font-size:1.2rem;font-weight:700;color:#00a0df;margin-bottom:5px}.channel-info{display:flex;flex-direction:column;gap:5px;width:100%}.channel-title{font-size:.95rem;font-weight:600;color:#f0f0f0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.channel-meta{display:flex;gap:8px;font-size:.8rem}.channel-country{color:#00a0df;font-weight:500}.channel-res{color:#4caf50;font-weight:500}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100vw;height:100vh;gap:20px;background:#000}.spinner{width:50px;height:50px;border:4px solid #1a1a1a;border-top:4px solid #00a0df;border-radius:50%;animation:spin .8s linear infinite}.spinner-small{width:30px;height:30px;border:3px solid rgba(26,26,26,.3);border-top:3px solid #00a0df;border-radius:50%;animation:spin .8s linear infinite}.loading-text{color:#888;font-size:1rem}.loading-more-indicator{position:absolute;bottom:100px;right:40px;z-index:80;background:#000c;padding:10px 15px;border-radius:8px;display:flex;align-items:center;gap:10px}.error-container{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100vw;height:100vh;gap:20px;background:#000;padding:40px}.error-icon{font-size:3rem;color:#f44336}.error-text{color:#f44336;font-size:1.1rem;text-align:center;max-width:600px}.retry-button{padding:12px 24px;background:linear-gradient(135deg,#00a0df,#0369a1);color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;margin-top:10px}.retry-button:hover{transform:translateY(-2px);box-shadow:0 6px 20px #00a0df66}.retry-button:active{transform:translateY(0)}.no-channels{display:flex;align-items:center;justify-content:center;width:100vw;height:100vh;color:#888;font-size:1.2rem;background:#000}.load-more-trigger{height:1px;width:1px;visibility:hidden}.no-channels-message{padding:30px 40px;color:#888;font-size:1.1rem;text-align:center;background:#1a1a1a99;border-radius:8px;border:2px solid rgba(0,160,223,.3);margin:0 20px;min-width:400px}@keyframes slideInRight{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}@media(max-width:768px){.app-header{padding:15px 20px}.logo{height:28px}.lab-badge{height:14px}.channel-list{padding:15px 20px;gap:10px}.channel-item{min-width:200px;max-width:250px;padding:10px 15px}.channel-num{font-size:1rem}.channel-title{font-size:.85rem}.channel-meta{font-size:.75rem}.channel-overlay{top:15px;right:20px;padding:10px 20px}.channel-number{font-size:1.4rem}.channel-name-overlay{font-size:1rem}.favorites-content{padding:30px;gap:30px}.favorites-value{font-size:1.5rem}.favorites-label{font-size:.9rem}.heart-icon svg{width:80px;height:80px}.recommended-header{font-size:1rem}.recommended-item{padding:12px 15px}.recommended-num,.recommended-name{font-size:.9rem}.recommended-meta{font-size:.75rem}.menu-container-horizontal{padding:0 20px}.menu-items-horizontal{gap:15px}.menu-item-horizontal{min-width:100px;padding:25px 20px;gap:10px}.menu-icon{width:28px;height:28px}.menu-label{font-size:.9rem}.submenu-dropdown,.submenu-dropdown-right{min-width:150px;padding:8px}.submenu-item{padding:12px 15px;font-size:.9rem;margin-bottom:6px}.keyboard-container{padding:20px}.keyboard-input-display{padding:15px 20px}.keyboard-input-label{font-size:1.1rem}.keyboard-input-text{font-size:1.2rem}.keyboard-key{padding:12px 15px;font-size:1rem;min-width:40px}.keyboard-key.special{min-width:80px}}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100%;overflow:hidden;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#000;color:#f0f0f0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}#root{min-height:100vh;width:100%}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#1a1a1a}::-webkit-scrollbar-thumb{background:#00a0df;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#0369a1}@keyframes fadeIn{0%{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.fade-in{animation:fadeIn .3s ease}.slide-up{animation:slideUp .3s ease}