*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#eef2ff;background:#050b12;min-height:100svh;margin:0;font-family:Figtree,system-ui,sans-serif}body:before{content:"";pointer-events:none;z-index:9999;opacity:.03;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");background-repeat:repeat;background-size:128px;position:fixed;inset:0}#root{min-height:100svh}:root{--bg:#050b12;--surface:#0a1525;--surface-2:#0e1d35;--border:#162035;--border-2:#1e2f4a;--text:#eef2ff;--text-2:#8ba4c8;--text-3:#4a6480;--green:#00ff87;--green-dim:#00ff871a;--green-glow:0 0 20px #00ff8740;--red:#f36;--red-dim:#ff33661f;--gold:#fbbf24;--font-display:"Bebas Neue", sans-serif;--font-body:"Figtree", system-ui, sans-serif;--radius:10px;--radius-lg:16px}*{box-sizing:border-box;margin:0;padding:0}.app{max-width:1280px;margin:0 auto;padding:0 1.25rem 4rem}.app-header{text-align:center;padding:3rem 1rem 2.5rem;position:relative}.app-header:after{content:"";background:var(--green);width:60px;height:2px;box-shadow:var(--green-glow);margin:1.5rem auto 0;display:block}.app-header h1{font-family:var(--font-display);letter-spacing:.04em;color:var(--text);text-transform:uppercase;font-size:clamp(3rem,8vw,6rem);font-weight:400;line-height:.95}.app-header h1 span{color:var(--green);display:block}.subtitle{font-family:var(--font-body);color:var(--text-3);letter-spacing:.15em;text-transform:uppercase;margin-top:.6rem;font-size:.78rem;font-weight:600}.app-section{margin-top:4rem}.section-header{align-items:baseline;gap:1rem;margin-bottom:1.25rem;display:flex}.section-tag{font-family:var(--font-body);letter-spacing:.18em;text-transform:uppercase;color:var(--green);background:var(--green-dim);border:1px solid #00ff8733;border-radius:4px;padding:.2rem .55rem;font-size:.65rem;font-weight:700}.section-title{font-family:var(--font-display);letter-spacing:.06em;color:var(--text);font-size:clamp(1.6rem,4vw,2.4rem);font-weight:400;line-height:1}.section-subtitle{color:var(--text-3);letter-spacing:.01em;margin-bottom:1.25rem;font-size:.8rem;font-weight:500}.section-divider{background:linear-gradient(90deg, var(--green) 0%, transparent 40%);opacity:.35;width:100%;height:1px;margin-bottom:1.5rem}.state-message{text-align:center;color:var(--text-3);padding:3rem;font-size:.95rem}.state-message.error{color:var(--red)}.matches-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:.875rem;display:grid}.match-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);cursor:default;transition:border-color .2s,transform .2s,box-shadow .2s;position:relative;overflow:hidden}.match-card:before{content:"";background:var(--border-2);height:3px;transition:background .2s;display:block}.match-card.live:before{background:var(--red);animation:1.8s ease-in-out infinite pulse-bar}.match-card:hover{border-color:var(--border-2);transform:translateY(-2px);box-shadow:0 12px 32px #0006}.match-card-body{padding:1rem 1.1rem .9rem}.match-header{justify-content:space-between;align-items:center;margin-bottom:.9rem;display:flex}.match-status{font-family:var(--font-body);letter-spacing:.12em;text-transform:uppercase;border-radius:4px;padding:.18rem .5rem;font-size:.62rem;font-weight:700}.match-status.live{color:var(--red);background:var(--red-dim);border:1px solid #ff336640}.match-status.finished{color:var(--text-3);border:1px solid var(--border);background:#4a64801f}.match-status.upcoming{color:var(--green);background:var(--green-dim);border:1px solid #00ff8733}.match-date{color:var(--text-3);text-align:right;font-size:.75rem;font-weight:500;line-height:1.4}.match-teams{align-items:center;gap:.5rem;display:flex}.team{flex-direction:column;flex:1;align-items:center;gap:.45rem;display:flex}.team-logo{object-fit:contain;filter:drop-shadow(0 2px 6px #0006);width:40px;height:40px}.team-name{text-align:center;color:var(--text-2);letter-spacing:.02em;font-size:.75rem;font-weight:600}.score{font-family:var(--font-display);letter-spacing:.04em;min-width:90px;color:var(--text);justify-content:center;align-items:center;gap:.25rem;font-size:2.2rem;font-weight:400;display:flex}.score-sep{color:var(--text-3);margin-bottom:2px;font-size:1.4rem}.score .winner{color:var(--green)}.score-tbd{font-family:var(--font-body);color:var(--text-3);letter-spacing:.06em;font-size:.85rem;font-weight:600}.match-venue{color:var(--text-3);text-align:center;letter-spacing:.04em;margin-top:.7rem;font-size:.68rem;font-weight:500}@keyframes pulse-bar{0%,to{opacity:1}50%{opacity:.4}}.countdown-bar{background:var(--surface);border:1px solid var(--border-2);border-radius:var(--radius-lg);flex-wrap:wrap;justify-content:center;align-items:center;gap:1.5rem;margin-top:1.5rem;padding:1.25rem 2rem;display:flex;position:relative;overflow:hidden}.countdown-bar:before{content:"";pointer-events:none;background:radial-gradient(at bottom,#00ff870a 0%,#0000 70%);position:absolute;inset:0}.countdown-label{color:var(--text-3);letter-spacing:.12em;text-transform:uppercase;font-size:.72rem;font-weight:600}.countdown-live{color:var(--green);letter-spacing:.06em;font-size:.9rem;font-weight:700}.countdown-units{align-items:flex-end;gap:.25rem;display:flex}.countdown-unit{background:var(--surface-2);border:1px solid var(--border-2);border-radius:8px;flex-direction:column;align-items:center;min-width:54px;padding:.5rem .25rem .4rem;display:flex}.countdown-num{font-family:var(--font-display);color:var(--green);font-variant-numeric:tabular-nums;text-shadow:var(--green-glow);font-size:2.2rem;line-height:1}.countdown-unit-label{color:var(--text-3);text-transform:uppercase;letter-spacing:.1em;margin-top:.2rem;font-size:.55rem;font-weight:600}.countdown-sep{font-family:var(--font-display);color:var(--text-3);align-self:flex-end;padding-bottom:.6rem;font-size:1.8rem;line-height:1}.countdown-clock{color:var(--text-3);font-variant-numeric:tabular-nums;font-size:.75rem;font-weight:500}.groups-grid{grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:.875rem;display:grid}.group-table{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}.group-table-header{background:var(--surface-2);border-bottom:1px solid var(--border);align-items:center;gap:.6rem;padding:.6rem .875rem;display:flex}.group-letter{font-family:var(--font-display);color:var(--green);letter-spacing:.04em;font-size:1.6rem;line-height:1}.group-label{letter-spacing:.14em;text-transform:uppercase;color:var(--text-3);font-size:.6rem;font-weight:700}.group-table table{border-collapse:collapse;width:100%;font-size:.77rem}.group-table thead th{color:var(--text-3);text-align:center;text-transform:uppercase;letter-spacing:.06em;padding:.3rem .4rem;font-size:.62rem;font-weight:600}.group-table th.col-team,.group-table td.col-team{text-align:left}.group-table tbody tr{border-top:1px solid var(--border);transition:background .12s}.group-table tbody tr:hover{background:var(--surface-2)}.group-table tbody tr.advancing{border-left:2px solid var(--green)}.group-table td{text-align:center;color:var(--text);padding:.4rem}.group-table td.col-pos{color:var(--text-3);width:20px;font-size:.68rem;font-weight:600}.group-table td.col-team{align-items:center;gap:.4rem;display:flex}.group-table td.col-pts{font-weight:700;font-family:var(--font-display);color:var(--text);letter-spacing:.04em;font-size:1rem}.group-table td.positive{color:var(--green);font-weight:600}.group-table td.negative{color:var(--red);font-weight:600}.group-crest{object-fit:contain;flex-shrink:0;width:16px;height:16px}.prediction-row{border-top:1px solid var(--border);align-items:center;gap:.6rem;margin-top:.75rem;padding-top:.65rem;display:flex}.prediction-label{letter-spacing:.1em;text-transform:uppercase;color:var(--text-3);flex-shrink:0;font-size:.6rem;font-weight:700}.prediction-btns{flex:1;gap:.3rem;display:flex}.prediction-btn{font-family:var(--font-body);letter-spacing:.04em;border:1px solid var(--border-2);background:var(--surface-2);color:var(--text-3);cursor:pointer;white-space:nowrap;text-overflow:ellipsis;border-radius:5px;flex:1;padding:.3rem .2rem;font-size:.65rem;font-weight:600;transition:all .15s;overflow:hidden}.prediction-btn:hover:not(.locked){border-color:var(--green);color:var(--green);background:var(--green-dim)}.prediction-btn.active{border-color:var(--green);color:var(--bg);background:var(--green);font-weight:700}.prediction-btn.locked{cursor:default;opacity:.6}.squads-container{flex-direction:column;gap:1.25rem;display:flex}.squads-team-grid{flex-wrap:wrap;gap:.5rem;display:flex}.squad-team-btn{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;flex-direction:column;align-items:center;gap:.3rem;min-width:58px;padding:.55rem .65rem;transition:border-color .15s,background .15s,transform .15s;display:flex}.squad-team-btn:hover{border-color:var(--border-2);transform:translateY(-1px)}.squad-team-btn.active{border-color:var(--green);background:var(--green-dim);box-shadow:0 0 0 1px #00ff8726}.squad-crest{object-fit:contain;width:28px;height:28px}.squad-tla{color:var(--text-3);text-transform:uppercase;letter-spacing:.06em;font-size:.6rem;font-weight:700}.squad-roster{background:var(--surface);border:1px solid var(--border-2);border-radius:var(--radius-lg);padding:1.25rem}.squad-roster-header{border-bottom:1px solid var(--border);align-items:center;gap:1rem;margin-bottom:1.25rem;padding-bottom:1rem;display:flex}.squad-roster-crest{object-fit:contain;width:48px;height:48px}.squad-roster-name{font-family:var(--font-display);letter-spacing:.04em;color:var(--text);font-size:1.8rem;line-height:1}.squad-roster-count{color:var(--text-3);letter-spacing:.04em;margin-top:.2rem;font-size:.72rem;font-weight:600}.squad-close{border:1px solid var(--border);color:var(--text-3);cursor:pointer;font-size:.85rem;font-family:var(--font-body);background:0 0;border-radius:6px;margin-left:auto;padding:.3rem .6rem;transition:all .15s}.squad-close:hover{color:var(--text);border-color:var(--border-2);background:var(--surface-2)}.squad-links{flex-wrap:wrap;gap:.5rem;margin-bottom:1.25rem;display:flex}.squad-link{border:1px solid var(--border-2);background:var(--surface-2);color:var(--text-2);border-radius:6px;align-items:center;gap:.3rem;padding:.35rem .75rem;font-size:.75rem;font-weight:600;text-decoration:none;transition:all .15s;display:inline-flex}.squad-link:hover{border-color:var(--green);color:var(--green);background:var(--green-dim)}.squad-positions{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1.25rem;display:grid}.squad-pos-label{color:var(--green);text-transform:uppercase;letter-spacing:.12em;margin-bottom:.5rem;font-size:.62rem;font-weight:700}.squad-player-list{flex-direction:column;gap:3px;display:flex}.squad-player{color:var(--text);border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:.18rem 0;font-size:.78rem;display:flex}.squad-player:last-child{border-bottom:none}.squad-player-meta{color:var(--text-3);font-size:.68rem;font-weight:500}.match-tooltip{z-index:100;border:1px solid var(--border-2);border-radius:var(--radius-lg);background:#080f1e;width:440px;max-width:92vw;padding:.875rem;position:absolute;top:calc(100% + 10px);left:50%;transform:translate(-50%);box-shadow:0 20px 60px #000000b3,0 0 0 1px #00ff870f}.tooltip-header{text-align:center;color:var(--green);text-transform:uppercase;letter-spacing:.14em;border-bottom:1px solid var(--border);margin-bottom:.7rem;padding-bottom:.6rem;font-size:.62rem;font-weight:700}.tooltip-empty{text-align:center;color:var(--text-3);padding:.6rem 0;font-size:.8rem}.tooltip-lineups{gap:.75rem;display:flex}.tooltip-team-col{flex:1;min-width:0}.tooltip-team-name{color:var(--text);margin-bottom:.4rem;font-size:.72rem;font-weight:700}.tooltip-formation{color:var(--green);font-weight:500}.tooltip-divider{background:var(--border);flex-shrink:0;width:1px}.tooltip-players{flex-direction:column;gap:2px;display:flex}.tooltip-players.muted .tooltip-player{color:var(--text-3)}.tooltip-player{color:var(--text);align-items:center;gap:.4rem;font-size:.7rem;display:flex}.player-num{text-align:right;width:18px;color:var(--text-3);flex-shrink:0;font-size:.65rem;font-weight:600}.tooltip-bench-label{text-transform:uppercase;letter-spacing:.08em;color:var(--text-3);margin:.45rem 0 .25rem;font-size:.6rem}.scroll-to-top{z-index:999;border:1px solid var(--border-2);background:var(--surface-2);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:1.35rem;transition:transform .2s,box-shadow .2s,border-color .2s;animation:.25s fade-up;display:flex;position:fixed;bottom:2rem;right:2rem;box-shadow:0 4px 20px #00000080,0 0 0 1px #00ff870f}.scroll-to-top:hover{border-color:#00ff8766;transform:translateY(-3px)rotate(-15deg);box-shadow:0 8px 28px #0009,0 0 12px #00ff8726}@keyframes fade-up{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.lang-switcher{flex-wrap:wrap;justify-content:center;gap:6px;margin-top:12px;display:flex}.lang-btn{color:#94a3b8;cursor:pointer;background:#ffffff0d;border:1px solid #ffffff1a;border-radius:6px;padding:4px 10px;font-size:.75rem;transition:background .15s,color .15s,border-color .15s}.lang-btn:hover{color:#e2e8f0;background:#ffffff1a}.lang-btn.active{color:#00ff87;background:#00ff871a;border-color:#00ff8766;font-weight:600}.match-preview{border-top:1px solid #ffffff0d;padding:10px 14px 4px}.preview-btn{color:#00ff87;cursor:pointer;letter-spacing:.03em;background:0 0;border:1px solid #00ff874d;border-radius:6px;width:100%;padding:5px 12px;font-size:.75rem;transition:background .15s,border-color .15s}.preview-btn:hover{background:#00ff8714;border-color:#00ff8799}.preview-loading,.preview-error{color:#64748b;text-align:center;padding:4px 0;font-size:.75rem}.preview-error{color:#f87171}.preview-text{color:#94a3b8;white-space:pre-wrap;padding:4px 0 6px;font-size:.8rem;line-height:1.6}