:root{--bg: #070b16;--bg-2: #0c1222;--surface: #111a2e;--surface-2: #16213a;--border: rgba(148, 163, 184, .14);--border-strong: rgba(148, 163, 184, .28);--text: #e8edf7;--muted: #8b97ad;--accent: #c6ff3d;--accent-ink: #0b1020;--live: #ff3b5c;--upcoming: #60a5fa;--radius: 18px;--shadow: 0 10px 30px -12px rgba(0, 0, 0, .6);--font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--display: "Oswald", "Inter", sans-serif;color-scheme:dark}*,*:before,*:after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;font-family:var(--font);color:var(--text);background:radial-gradient(900px 500px at 85% -10%,rgba(198,255,61,.09),transparent 60%),radial-gradient(700px 400px at -10% 10%,rgba(96,165,250,.08),transparent 60%),var(--bg);background-attachment:fixed;-webkit-font-smoothing:antialiased;line-height:1.5}button{font:inherit;color:inherit;cursor:pointer}h1,h2,p{margin:0}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 20px}.app{min-height:100vh;display:flex;flex-direction:column}.muted{color:var(--muted);font-weight:500}.live-dot{position:relative;display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--live);flex-shrink:0}.live-dot:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;background:var(--live);animation:pulse 1.6s ease-out infinite}.live-dot--sm{width:7px;height:7px}@keyframes pulse{0%{transform:scale(1);opacity:.7}to{transform:scale(2.8);opacity:0}}.header{position:sticky;top:0;z-index:10;background:#070b16c7;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--border)}.header__inner{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:14px;padding-bottom:14px}.brand{display:flex;align-items:center;gap:12px;min-width:0}.brand__logo{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--accent);box-shadow:0 0 24px -4px #c6ff3d8c;flex-shrink:0}.brand__logo span{width:20px;height:20px;border-radius:50%;border:4px solid var(--accent-ink);position:relative}.brand__logo span:after{content:"";position:absolute;top:3px;right:3px;bottom:3px;left:3px;border-radius:50%;background:var(--accent-ink)}.brand__title{font-family:var(--display);font-size:1.45rem;font-weight:700;letter-spacing:.02em;text-transform:uppercase;line-height:1.1}.brand__subtitle{font-size:.82rem;color:var(--muted)}.header__stats{display:flex;align-items:center;gap:8px}.stat{display:flex;align-items:center;gap:6px;padding:7px 12px;border:1px solid var(--border);border-radius:999px;background:var(--surface);font-size:.82rem;color:var(--muted);white-space:nowrap}.stat strong{color:var(--text);font-size:.95rem}.stat--live{border-color:#ff3b5c59;background:#ff3b5c1a}.main{flex:1;padding-top:28px;padding-bottom:48px}.tabs{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px;margin-bottom:26px;scrollbar-width:none}.tabs::-webkit-scrollbar{display:none}.tab{display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:14px;border:1px solid var(--border);background:var(--surface);text-align:left;flex-shrink:0;transition:border-color .2s,background .2s,transform .2s}.tab:hover{border-color:var(--border-strong);transform:translateY(-2px)}.tab__text{display:flex;flex-direction:column;line-height:1.2}.tab__name{font-weight:700;font-size:.92rem}.tab__country{font-size:.72rem;color:var(--muted)}.tab__count{display:grid;place-items:center;min-width:24px;height:24px;padding:0 6px;border-radius:8px;background:var(--surface-2);font-size:.75rem;font-weight:700;color:var(--muted)}.tab.is-active{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);box-shadow:0 8px 24px -10px #c6ff3db3}.tab.is-active .tab__country{color:#0b1020a6}.tab.is-active .tab__count{background:var(--accent-ink);color:var(--accent)}.layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:28px;align-items:start}.section-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;margin-bottom:16px}.section-head h2,.panel__head h2{font-family:var(--display);font-size:1.35rem;font-weight:600;text-transform:uppercase;letter-spacing:.03em}.section-head h2 .muted{font-family:var(--font);font-size:.9rem;margin-left:4px}.segmented{display:inline-flex;padding:4px;gap:2px;border-radius:12px;background:var(--surface);border:1px solid var(--border);max-width:100%;overflow-x:auto;scrollbar-width:none}.segmented::-webkit-scrollbar{display:none}.segmented__btn{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border:0;border-radius:9px;background:transparent;color:var(--muted);font-size:.84rem;font-weight:600;white-space:nowrap;transition:background .2s,color .2s}.segmented__btn:hover{color:var(--text)}.segmented__btn.is-active{background:var(--surface-2);color:var(--text);box-shadow:inset 0 0 0 1px var(--border-strong)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr));gap:16px}.card{position:relative;display:flex;flex-direction:column;gap:16px;padding:18px;border-radius:var(--radius);border:1px solid var(--border);background:radial-gradient(120% 70% at 0% 0%,color-mix(in srgb,var(--home, transparent) 13%,transparent),transparent 60%),radial-gradient(120% 70% at 100% 0%,color-mix(in srgb,var(--away, transparent) 13%,transparent),transparent 60%),linear-gradient(180deg,var(--surface) 0%,var(--bg-2) 100%);box-shadow:var(--shadow);overflow:hidden;transition:transform .25s,border-color .25s,box-shadow .25s;animation:rise .35s ease both}.card:hover{transform:translateY(-4px);border-color:#c6ff3d59;box-shadow:0 18px 40px -16px #000c}.card--live{border-color:#ff3b5c52}.card--live:before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,var(--live),#ff8a3d)}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.card__top{display:flex;align-items:center;justify-content:space-between;gap:10px}.card__league{font-size:.75rem;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.pill{display:inline-flex;align-items:center;gap:6px;padding:4px 10px;border-radius:999px;font-size:.75rem;font-weight:700;white-space:nowrap}.pill--live{background:#ff3b5c24;color:#ff7a90}.pill--finished{background:#94a3b81f;color:var(--muted)}.pill--upcoming{background:#60a5fa24;color:#93c5fd}.card__body{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:10px}.team{display:flex;flex-direction:column;align-items:center;gap:8px;min-width:0;text-align:center;transition:opacity .2s}.team.is-loser{opacity:.5}.team__name{font-weight:600;font-size:.92rem;line-height:1.25;overflow-wrap:anywhere}.badge{--team: #94a3b8;display:grid;place-items:center;flex-shrink:0;border-radius:50%;font-family:var(--display);font-weight:700;letter-spacing:.04em;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.55);background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.35),transparent 55%),color-mix(in srgb,var(--team) 70%,#0b1020);box-shadow:inset 0 0 0 2px color-mix(in srgb,var(--team) 80%,white),0 6px 16px -6px color-mix(in srgb,var(--team) 70%,transparent)}.badge--md{width:54px;height:54px;font-size:1rem}.badge--sm{width:26px;height:26px;font-size:.6rem;box-shadow:inset 0 0 0 1.5px color-mix(in srgb,var(--team) 80%,white)}.card:hover .badge--md{transform:scale(1.06)}.badge--md{transition:transform .25s}.scoreboard{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:2px 6px;min-width:96px;padding:10px 12px;border-radius:14px;background:var(--bg);border:1px solid var(--border);font-family:var(--display)}.scoreboard__num{font-size:2.1rem;font-weight:700;line-height:1;min-width:1ch;text-align:center;color:var(--text)}.scoreboard__num.is-win{color:var(--accent)}.scoreboard__sep{font-size:1.6rem;color:var(--muted);line-height:1}.card--live .scoreboard{border-color:#ff3b5c4d;box-shadow:0 0 22px -10px var(--live)}.card--live .scoreboard__num{color:var(--text)}.scoreboard__time{font-size:1.5rem;font-weight:600;color:#93c5fd;line-height:1.2}.scoreboard__label{flex-basis:100%;margin-top:4px;font-family:var(--font);font-size:.62rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;text-align:center;color:var(--muted)}.card--live .scoreboard__label{color:#ff7a90}.progress{height:4px;border-radius:999px;background:var(--surface-2);overflow:hidden}.progress span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--live),#ff8a3d)}.card__meta{display:flex;justify-content:space-between;gap:10px;padding-top:12px;border-top:1px dashed var(--border);font-size:.78rem;color:var(--muted)}.card__meta-item{display:inline-flex;align-items:center;gap:6px;min-width:0;white-space:nowrap}.card__meta-item svg{width:14px;height:14px;flex-shrink:0;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:.8}.card__venue span{overflow:hidden;text-overflow:ellipsis}.count-badge{display:inline-grid;place-items:center;min-width:26px;height:22px;margin-left:6px;padding:0 7px;border-radius:8px;background:#c6ff3d24;color:var(--accent);font-family:var(--font);font-size:.78rem;font-weight:700;vertical-align:middle}.empty{display:flex;flex-direction:column;align-items:center;gap:14px;padding:48px 20px;border:1px dashed var(--border-strong);border-radius:var(--radius);color:var(--muted);text-align:center}.empty button{padding:9px 16px;border:0;border-radius:10px;background:var(--accent);color:var(--accent-ink);font-weight:700}.sidebar{position:sticky;top:96px}.panel{padding:18px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);box-shadow:var(--shadow)}.panel__head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:12px}.panel__sub{font-size:.8rem;font-weight:600;color:var(--accent)}.table{width:100%;border-collapse:collapse;font-size:.84rem}.table th{padding:8px 4px;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);text-align:center;border-bottom:1px solid var(--border)}.table td{padding:9px 4px;text-align:center;color:var(--muted);border-bottom:1px solid var(--border)}.table tbody tr{transition:background .2s}.table tbody tr:hover{background:var(--surface-2)}.table tbody tr:last-child td{border-bottom:0}.table .table__team{text-align:left;width:100%}.table__team-inner{display:flex;align-items:center;gap:8px;color:var(--text);font-weight:600}.table__pts{color:var(--text)!important;font-weight:800}.rank{display:inline-grid;place-items:center;width:22px;height:22px;border-radius:7px;font-size:.75rem;font-weight:700;background:var(--surface-2)}.rank--top{background:#c6ff3d24;color:var(--accent)}.panel__note{margin-top:12px;font-size:.72rem;color:var(--muted)}.footer{border-top:1px solid var(--border);background:var(--bg-2)}.footer__inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;padding-top:22px;padding-bottom:22px;font-size:.85rem;color:var(--muted)}.footer__inner strong{color:var(--text)}.footer__links{display:flex;gap:18px;margin:0;padding:0;list-style:none}.footer__links a{color:var(--text);text-decoration:none;font-weight:600;transition:color .2s}.footer__links a:hover{color:var(--accent)}.footer__note{width:100%;font-size:.75rem}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media (max-width: 980px){.layout{grid-template-columns:1fr}.sidebar{position:static}}@media (max-width: 600px){.container{padding:0 16px}.header__stats .stat--date,.brand__subtitle{display:none}.brand__title{font-size:1.1rem;white-space:nowrap}.header__inner{gap:10px}.stat span:not(.live-dot){font-size:.75rem}.header__stats .stat:not(.stat--live){display:none}.brand__logo{width:36px;height:36px}.stat{padding:6px 10px}.main{padding-top:20px}.tabs{margin-bottom:20px}.segmented{width:100%}.segmented__btn{flex:1;justify-content:center;padding:7px 8px}.card{padding:16px}.badge--md{width:46px;height:46px;font-size:.88rem}.scoreboard{min-width:84px;padding:8px 10px}.scoreboard__num{font-size:1.8rem}.team__name{font-size:.85rem}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation:none!important;transition:none!important}}
