*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--bg-primary: #070b14;--bg-secondary: #0d1321;--bg-tertiary: #131b2e;--bg-card: #162033;--bg-card-hover: #1b2740;--bg-elevated: #1e2c48;--border: rgba(99, 102, 241, .12);--border-hover: rgba(99, 102, 241, .3);--text-primary: #f0f4f8;--text-secondary: #8899b4;--text-muted: #5a6d8a;--accent: #6366f1;--accent-hover: #7c7ff5;--accent-glow: rgba(99, 102, 241, .25);--purple: #8b5cf6;--cyan: #06b6d4;--green: #22c55e;--orange: #f59e0b;--red: #ef4444;--gradient-main: linear-gradient(135deg, #6366f1, #8b5cf6);--gradient-accent: linear-gradient(135deg, #6366f1, #06b6d4);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .3);--shadow-md: 0 4px 20px rgba(0, 0, 0, .4);--shadow-lg: 0 8px 40px rgba(0, 0, 0, .5);--shadow-glow: 0 0 20px var(--accent-glow);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-xl: 20px;--transition: .25s cubic-bezier(.4, 0, .2, 1);--font: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif}html{font-size:16px;scroll-behavior:smooth}body{font-family:var(--font);background:var(--bg-primary);color:var(--text-primary);min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--bg-elevated);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.header{position:fixed;top:0;left:0;right:0;z-index:100;background:#070b14d9;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid var(--border)}.header-inner{max-width:1600px;margin:0 auto;padding:0 24px;height:64px;display:flex;align-items:center;gap:24px}.logo{display:flex;align-items:center;gap:10px;flex-shrink:0}.logo-icon{width:28px;height:28px;color:var(--accent);filter:drop-shadow(0 0 8px var(--accent-glow))}.logo-text{font-size:1.4rem;font-weight:800;background:var(--gradient-main);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.5px}.header-center{display:flex;align-items:center;gap:20px;flex:1;justify-content:center}.nav-tabs{display:flex;gap:4px;background:var(--bg-secondary);padding:3px;border-radius:var(--radius-md);border:1px solid var(--border)}.nav-tab{padding:8px 18px;border:none;background:transparent;color:var(--text-secondary);font-family:var(--font);font-size:.875rem;font-weight:500;border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);display:flex;align-items:center;gap:6px;white-space:nowrap}.nav-tab:hover{color:var(--text-primary);background:#ffffff0a}.nav-tab.active{background:var(--gradient-main);color:#fff;box-shadow:0 2px 10px var(--accent-glow)}.live-dot-small{width:6px;height:6px;border-radius:50%;background:var(--red);display:none}.nav-tab.active .live-dot-small{display:block;animation:pulse-dot 1.5s ease-in-out infinite}.search-box{position:relative;flex:1;max-width:360px}.search-icon{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:16px;height:16px;color:var(--text-muted);pointer-events:none}.search-input{width:100%;padding:8px 12px 8px 36px;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-family:var(--font);font-size:.85rem;outline:none;transition:var(--transition)}.search-input::placeholder{color:var(--text-muted)}.search-input:focus{border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-glow)}.refresh-btn{width:38px;height:38px;display:flex;align-items:center;justify-content:center;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-secondary);cursor:pointer;transition:var(--transition);flex-shrink:0}.refresh-btn svg{width:18px;height:18px}.refresh-btn:hover{color:var(--text-primary);border-color:var(--border-hover);background:var(--bg-tertiary)}.refresh-btn.spinning svg{animation:spin .8s linear infinite}.layout{display:flex;max-width:1600px;margin:0 auto;padding-top:64px;min-height:100vh}.sidebar{width:220px;flex-shrink:0;background:var(--bg-secondary);border-right:1px solid var(--border);padding:20px 0;position:fixed;top:64px;left:0;bottom:0;overflow-y:auto;z-index:50;transition:transform var(--transition)}.sidebar-header{display:flex;align-items:center;gap:10px;padding:0 20px 16px;border-bottom:1px solid var(--border);margin-bottom:8px}.sidebar-icon{width:18px;height:18px;color:var(--accent)}.sidebar-header h3{font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}.sports-list{list-style:none;padding:0}.sport-item{display:flex;align-items:center;gap:10px;padding:10px 20px;cursor:pointer;transition:var(--transition);position:relative;color:var(--text-secondary);font-size:.9rem;font-weight:500}.sport-item:hover{background:#ffffff08;color:var(--text-primary)}.sport-item.active{color:var(--text-primary);background:#6366f114}.sport-item.active:before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:3px;background:var(--gradient-main);border-radius:0 3px 3px 0}.sport-indicator{width:8px;height:8px;border-radius:50%;background:var(--bg-elevated);flex-shrink:0}.sport-indicator.live-bar{background:var(--red);animation:pulse-dot 1.5s ease-in-out infinite}.sport-icon{width:18px;height:18px;flex-shrink:0;color:var(--text-muted);display:flex;align-items:center;justify-content:center}.sport-icon svg{width:100%;height:100%}.sport-item.active .sport-icon{color:var(--accent)}.sport-icon-live{color:var(--red)}.sport-name{flex:1}.sport-count{font-size:.75rem;padding:2px 8px;background:var(--bg-tertiary);border-radius:10px;color:var(--text-muted);font-weight:600}.sport-divider{height:1px;background:var(--border);margin:8px 20px;list-style:none}.sidebar-attribution{font-size:.68rem;color:var(--text-muted);line-height:1.5;border-top:1px solid var(--border);margin:8px 20px 0;padding:12px 0 0}.sidebar-attribution a{color:var(--accent);text-decoration:none;font-weight:500}.sidebar-attribution a:hover{text-decoration:underline}.main-content{flex:1;margin-left:220px;padding:24px;min-width:0}.content-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:24px}.content-header-left{display:flex;align-items:baseline;gap:14px}#contentTitle{font-size:1.5rem;font-weight:700;letter-spacing:-.3px}.match-count{font-size:.85rem;color:var(--text-muted);font-weight:500}.sidebar-toggle{display:none;width:36px;height:36px;align-items:center;justify-content:center;background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-secondary);cursor:pointer}.sidebar-toggle svg{width:18px;height:18px}.matches-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:16px}.match-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:0;cursor:pointer;transition:var(--transition);position:relative;overflow:hidden}.card-body{padding:16px 20px 20px}.match-card.has-poster .card-body{padding-top:14px}.match-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--gradient-main);opacity:0;transition:var(--transition)}.match-card:hover{background:var(--bg-card-hover);border-color:var(--border-hover);transform:translateY(-2px);box-shadow:var(--shadow-md)}.match-card:hover:before{opacity:1}.match-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:14px}.match-badges{display:flex;gap:6px;flex-wrap:wrap}.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:20px;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em}.badge-live{background:#ef444426;color:var(--red)}.badge-live .badge-dot{width:5px;height:5px;border-radius:50%;background:var(--red);animation:pulse-dot 1.5s ease-in-out infinite}.badge-popular{background:#f59e0b26;color:var(--orange)}.badge-sport{background:#6366f11f;color:var(--accent)}.badge-upcoming{background:#06b6d41f;color:var(--cyan)}.match-time{font-size:.75rem;color:var(--text-muted);white-space:nowrap}.match-teams{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}.team{display:flex;flex-direction:column;align-items:center;gap:8px;flex:1;min-width:0}.team-badge{width:48px;height:48px;border-radius:50%;object-fit:contain;background:var(--bg-tertiary);padding:6px;transition:var(--transition)}.match-card:hover .team-badge{transform:scale(1.08)}.team-badge-placeholder{width:48px;height:48px;border-radius:50%;background:var(--bg-tertiary);display:flex;align-items:center;justify-content:center;font-size:1.2rem;font-weight:700;color:var(--text-muted)}.team-name{font-size:.82rem;font-weight:600;text-align:center;line-height:1.3;color:var(--text-primary);max-width:100%;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.match-score-display{display:flex;flex-direction:column;align-items:center;justify-content:center;flex-shrink:0;min-width:48px}.score{font-size:1.5rem;font-weight:800;color:var(--text-primary);letter-spacing:-1px;font-variant-numeric:tabular-nums;line-height:1;min-height:1.5rem}.score:empty:after{content:"";display:block;width:20px;height:2px;background:var(--border);border-radius:1px}.match-status-line{text-align:center;font-size:.78rem;font-weight:500;padding:4px 0}.status-live{color:var(--red)}.status-upcoming{color:var(--cyan)}.status-finished{color:var(--text-muted)}.match-card.single-entity .card-body{text-align:center}.card-poster{width:100%;aspect-ratio:16 / 9;object-fit:cover;display:block;background:var(--bg-tertiary);border-radius:var(--radius-lg) var(--radius-lg) 0 0}.event-title{font-size:1.05rem;font-weight:700;line-height:1.4;padding:4px 0 8px;color:var(--text-primary)}.match-card-footer{display:flex;justify-content:space-between;align-items:center;margin-top:14px;padding-top:12px;border-top:1px solid var(--border)}.match-date{font-size:.75rem;color:var(--text-muted);display:flex;align-items:center;gap:4px}.match-sources-count{font-size:.75rem;color:var(--accent);font-weight:500;display:flex;align-items:center;gap:4px}.watch-btn{padding:5px 14px;border:none;background:var(--gradient-main);color:#fff;font-family:var(--font);font-size:.78rem;font-weight:600;border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition)}.watch-btn:hover{box-shadow:0 0 16px var(--accent-glow);transform:scale(1.04)}.loading-state{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 20px;color:var(--text-muted);gap:16px}.spinner{width:40px;height:40px;border:3px solid var(--bg-tertiary);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}.empty-state,.error-state{grid-column:1 / -1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:80px 20px;color:var(--text-muted);gap:12px;text-align:center}.empty-state svg,.error-state svg{width:48px;height:48px;opacity:.4}.empty-state h3,.error-state h3{font-size:1.1rem;color:var(--text-secondary);font-weight:600}.error-state button{margin-top:8px;padding:8px 20px;border:1px solid var(--accent);background:transparent;color:var(--accent);font-family:var(--font);font-size:.85rem;font-weight:500;border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition)}.error-state button:hover{background:var(--accent-glow)}.modal-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#000000bf;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);z-index:200;align-items:center;justify-content:center;padding:20px;animation:fadeIn .2s ease}.modal-overlay.open{display:flex}.modal-content{background:var(--bg-secondary);border:1px solid var(--border);border-radius:var(--radius-xl);width:100%;max-width:800px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;animation:slideUp .3s ease;box-shadow:var(--shadow-lg)}.modal-header{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid var(--border)}.modal-header-info h3{font-size:1.15rem;font-weight:700}.modal-category{font-size:.78rem;color:var(--text-muted);font-weight:500;text-transform:capitalize}.modal-close{width:36px;height:36px;display:flex;align-items:center;justify-content:center;background:var(--bg-tertiary);border:none;border-radius:50%;color:var(--text-secondary);cursor:pointer;transition:var(--transition)}.modal-close svg{width:18px;height:18px}.modal-close:hover{background:var(--bg-elevated);color:var(--text-primary)}.modal-body{padding:20px 24px 24px;overflow-y:auto}.stream-container{width:100%;aspect-ratio:16 / 9;background:var(--bg-primary);border-radius:var(--radius-md);overflow:hidden;margin-bottom:16px;border:1px solid var(--border)}.stream-container iframe{width:100%;height:100%;border:none}.stream-placeholder{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;color:var(--text-muted)}.placeholder-icon{width:48px;height:48px;opacity:.3}.stream-placeholder p{font-size:.9rem}.source-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}.source-tab{padding:8px 18px;border:1px solid var(--border);background:var(--bg-tertiary);color:var(--text-secondary);font-family:var(--font);font-size:.82rem;font-weight:500;border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);text-transform:capitalize}.source-tab:hover{border-color:var(--border-hover);color:var(--text-primary)}.source-tab.active{background:var(--gradient-main);border-color:transparent;color:#fff;box-shadow:0 2px 10px var(--accent-glow)}.stream-list{display:flex;flex-direction:column;gap:8px}.stream-item{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-md);transition:var(--transition)}.stream-item:hover{background:var(--bg-card-hover);border-color:var(--border-hover)}.stream-item-info{display:flex;align-items:center;gap:12px}.stream-flag{width:28px;height:20px;border-radius:3px;object-fit:cover;background:var(--bg-tertiary)}.stream-language{font-size:.9rem;font-weight:600}.stream-hd{font-size:.7rem;padding:2px 6px;background:#22c55e26;color:var(--green);border-radius:4px;font-weight:700}.play-btn{padding:6px 16px;border:none;background:var(--gradient-main);color:#fff;font-family:var(--font);font-size:.8rem;font-weight:600;border-radius:var(--radius-sm);cursor:pointer;transition:var(--transition);display:flex;align-items:center;gap:6px}.play-btn:hover{box-shadow:0 0 14px var(--accent-glow);transform:scale(1.03)}.play-btn svg{width:14px;height:14px}.toast-container{position:fixed;bottom:20px;right:20px;z-index:300;display:flex;flex-direction:column;gap:8px}.toast{padding:12px 20px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text-primary);font-size:.85rem;font-weight:500;animation:slideInRight .3s ease;box-shadow:var(--shadow-md);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.toast.error{border-color:#ef44444d;background:#ef44441a}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.7)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes slideInRight{0%{opacity:0;transform:translate(40px)}to{opacity:1;transform:translate(0)}}@keyframes cardFadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.match-card{animation:cardFadeIn .35s ease backwards}.match-card:nth-child(1){animation-delay:.02s}.match-card:nth-child(2){animation-delay:.05s}.match-card:nth-child(3){animation-delay:.08s}.match-card:nth-child(4){animation-delay:.11s}.match-card:nth-child(5){animation-delay:.14s}.match-card:nth-child(6){animation-delay:.17s}.match-card:nth-child(7){animation-delay:.2s}.match-card:nth-child(8){animation-delay:.23s}.match-card:nth-child(9){animation-delay:.26s}.match-card:nth-child(10){animation-delay:.29s}@media(max-width:1024px){.sidebar{transform:translate(-100%)}.sidebar.open{transform:translate(0)}.main-content{margin-left:0}.sidebar-toggle{display:flex}.matches-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}}@media(max-width:768px){.header-inner{padding:0 16px;gap:12px}.logo-text{font-size:1.15rem}.header-center{gap:10px}.nav-tab{padding:6px 12px;font-size:.8rem}.nav-tab:nth-child(3){display:none}.search-box{max-width:180px}.main-content{padding:16px}.matches-grid{grid-template-columns:1fr;gap:12px}.match-teams{gap:8px}.team-badge,.team-badge-placeholder{width:40px;height:40px}.team-badge-placeholder{font-size:1rem}.score{font-size:1.3rem}.modal-content{max-height:95vh;border-radius:var(--radius-lg)}.modal-body,.modal-header{padding:16px}}@media(max-width:480px){.nav-tab{padding:5px 10px;font-size:.75rem}.nav-tab:nth-child(2){display:none}.search-box{max-width:120px}.search-input{padding:6px 8px 6px 30px;font-size:.78rem}#contentTitle{font-size:1.15rem}}