*{margin:0;padding:0;box-sizing:border-box}
html,body{background:#070b16;color:#c9d4ea;font:14px/1.7 "PingFang SC","Microsoft YaHei",Helvetica,sans-serif}
a{color:#d7e6ff;text-decoration:none}
a:hover{color:#5ce1ff}
img{max-width:100%;border:0;vertical-align:middle}
ul,ol{list-style:none}
.wrap{width:1180px;margin:0 auto}
.site-header{position:sticky;top:0;z-index:20;background:rgba(8,12,24,.92);backdrop-filter:blur(12px);border-bottom:1px solid rgba(92,225,255,.18)}
.header-inner{display:flex;align-items:center;height:68px}
.logo{display:flex;align-items:center;gap:10px;color:#fff;font-size:20px;font-weight:700;letter-spacing:1px}
.logo img{width:36px;height:36px}
.nav{display:flex;margin-left:36px;gap:4px}
.nav a{color:#b7c7e0;font-size:16px;padding:8px 18px;border-radius:999px}
.nav a:hover,.nav a.on{color:#071018;background:linear-gradient(90deg,#5ce1ff,#7cf0c2);font-weight:700}
.nav-toggle{display:none;margin-left:auto;background:none;border:1px solid #345;color:#dff;padding:6px 10px;border-radius:8px}
.league-bar{background:rgba(12,22,44,.7);border-bottom:1px solid rgba(92,225,255,.12)}
.league-bar-inner{display:flex;align-items:center;min-height:42px;padding:6px 0;gap:12px}
.league-bar strong{color:#5ce1ff;flex:none}
.league-links{display:flex;flex-wrap:wrap;gap:4px 2px}
.league-links a{padding:4px 10px;color:#9fb3d1}
.league-links a.on,.league-links a:hover{color:#5ce1ff}

.hero{position:relative;overflow:hidden;min-height:320px;display:flex;align-items:center;background:radial-gradient(1200px 320px at 20% 20%,rgba(92,225,255,.18),transparent 50%),linear-gradient(135deg,#08101f 0%,#0c1a33 55%,#071018 100%)}
.hero-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(92,225,255,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(92,225,255,.06) 1px,transparent 1px);background-size:28px 28px;mask-image:linear-gradient(#000 40%,transparent 100%)}
.hero-copy{position:relative;z-index:2;padding:48px 0}
.hero-kicker{display:inline-flex;align-items:center;gap:8px;color:#7cf0c2;letter-spacing:2px;font-size:13px}
.hero-title{margin-top:12px;font-size:40px;color:#fff;line-height:1.25}
.hero-title em{font-style:normal;color:#5ce1ff}
.hero-sub{margin-top:14px;max-width:640px;color:#b7c7e0;font-size:16px}
.hero-cta{margin-top:24px;display:flex;gap:12px}
.hero-cta a{display:inline-block;padding:10px 22px;border-radius:999px;background:linear-gradient(90deg,#5ce1ff,#4de0c0);color:#071018;font-weight:700}
.hero-cta a.ghost{background:transparent;color:#dff;border:1px solid rgba(92,225,255,.45)}

.layout{display:flex;align-items:flex-start;margin:22px auto 0;gap:18px}
.main{width:800px;flex:none}
.side{width:360px;flex:none}
.panel,.side-box,.article,.match-hero,.about-block,.faq{background:rgba(14,22,40,.78);border:1px solid rgba(92,225,255,.14);border-radius:16px;box-shadow:0 10px 40px rgba(0,0,0,.25)}
.panel{padding:4px 16px 16px;margin-bottom:16px}
.panel h2,.side-box>h3,.about-block h2,.faq h2{display:flex;align-items:center;gap:8px;font-size:18px;color:#fff;padding:14px 0 10px}
.side-box>h3{padding:12px 16px;border-bottom:1px solid rgba(92,225,255,.12);background:linear-gradient(90deg,rgba(92,225,255,.12),transparent)}
.date-tag{display:inline-block;margin:10px 0;padding:6px 14px;border-radius:999px;background:#12243f;color:#5ce1ff;font-size:13px}
.match-row{display:flex;align-items:center;min-height:64px;padding:8px 6px;border-top:1px solid rgba(255,255,255,.05);gap:8px;color:#d7e6ff}
.match-row:hover{background:rgba(92,225,255,.06)}
.c-time{width:150px;flex:none;font-size:12px;color:#8ea3c4}
.c-league{width:78px;flex:none;color:#7cf0c2;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.c-teams{flex:1;min-width:0;display:flex;align-items:center;justify-content:center;gap:8px}
.c-teams .home,.c-teams .away{display:flex;align-items:center;gap:6px;width:42%;min-width:0}
.c-teams .home{justify-content:flex-end}
.c-teams .away{justify-content:flex-start}
.c-teams b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.c-teams img{width:28px;height:28px;object-fit:contain;flex:none;background:#0b1426;border-radius:50%}
.score{width:56px;flex:none;text-align:center;font-weight:700;color:#fff}
.score.is-live{color:#ff5d7a}
.c-play{flex:none;min-width:84px;text-align:center;background:#16324f;color:#5ce1ff;height:30px;line-height:30px;padding:0 10px;border-radius:999px;font-size:12px}
.c-play.is-live{background:#ff5d7a;color:#fff}

.pop-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;padding:6px 0 12px}
.pop-card{background:rgba(9,16,32,.9);padding:12px 10px;border:1px solid rgba(92,225,255,.12);border-radius:12px;min-height:118px;display:block}
.pop-card .meta{display:flex;justify-content:space-between;color:#8ea3c4;font-size:12px}
.pop-card .teams{display:flex;align-items:center;justify-content:space-between;margin-top:10px;text-align:center;color:#fff}
.pop-card .t{width:42%}
.pop-card img{width:28px;height:28px;object-fit:contain}
.pop-card .vs{color:#5ce1ff;font-weight:700}
.pop-card .st{margin-top:10px;display:flex;justify-content:space-between;font-size:12px;color:#8ea3c4}

.side-box{margin-bottom:16px}
.side-box ul{padding:8px 14px 12px}
.side-box li{line-height:28px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.video-card,.news-item{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.05);align-items:center}
.video-card h3,.news-item h3{font-size:15px;font-weight:600;color:#eef5ff;line-height:1.45}
.news-txt,.video-info{flex:1;min-width:0}
.video-card p,.news-item time{color:#8ea3c4;font-size:12px;margin-top:6px;display:block}
.video-vis{display:flex;align-items:center;justify-content:center;gap:8px;min-width:104px;flex:none}
.video-vis img{width:36px;height:36px;object-fit:contain;background:#0b1426;border-radius:8px}
.news-item img{width:120px;height:80px;object-fit:cover;background:#12243f;flex:none;border-radius:8px}
.more-link{text-align:right;padding:8px 0}
.more-link a{color:#5ce1ff}
.empty{text-align:center;color:#8ea3c4;padding:24px 0}
.crumb{padding:16px 0 8px;color:#8ea3c4}
.crumb a{color:#9fdfff}

.match-hero{padding:24px;margin-bottom:16px;text-align:center}
.mh-meta{color:#8ea3c4}
.names{display:flex;align-items:center;justify-content:center;gap:28px;margin:18px 0;color:#fff;font-size:18px;font-weight:700}
.names img{width:64px;height:64px;object-fit:contain;background:#0b1426;border-radius:50%;margin-bottom:8px}
.big-score{font-size:36px;color:#5ce1ff}
.signals{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:16px}
.signals a{padding:8px 16px;border-radius:999px;background:#16324f;color:#5ce1ff;border:1px solid rgba(92,225,255,.25)}
.signals a:hover{background:#5ce1ff;color:#071018}
.article{padding:22px;margin-bottom:16px}
.article h1{font-size:22px;color:#fff;line-height:1.4}
.article .meta,.news-meta{margin:12px 0 18px;color:#8ea3c4;font-size:13px;display:flex;flex-wrap:wrap;gap:8px 16px}
.article-body{font-size:16px;line-height:1.85;color:#d5def0}
.article-body p{margin:0 0 14px}
.article-body img{border-radius:8px;margin:8px 0}
.pager{display:flex;justify-content:center;gap:8px;padding:16px 0}
.pager li,.pager a{min-width:34px;height:34px;line-height:34px;text-align:center;border-radius:8px;background:#12243f;color:#d7e6ff;display:inline-block}
.pager .on{background:#5ce1ff;color:#071018}
.pager-article{display:flex;justify-content:space-between;gap:12px;margin:12px 0 28px}
.pager-article a,.pager-article span{flex:1;background:rgba(14,22,40,.78);border:1px solid rgba(92,225,255,.14);border-radius:12px;padding:12px;color:#c9d4ea}

.about-block,.faq{padding:20px 22px;margin:18px 0}
.about-block h3{margin:14px 0 6px;color:#7cf0c2;font-size:16px}
.faq-item{border-top:1px solid rgba(255,255,255,.06);padding:8px 0}
.faq-item h3{cursor:pointer;color:#fff;font-size:15px;padding:8px 0}
.faq-body{overflow:hidden}
.faq-body[data-open="0"]{height:0;opacity:0}
.site-footer{margin-top:28px;padding:24px 0 36px;border-top:1px solid rgba(92,225,255,.12);color:#8ea3c4;text-align:center;line-height:1.9}
.friend-links a{margin:0 8px;color:#9fb3d1}
.backtop{position:fixed;right:18px;bottom:18px;width:40px;height:40px;border:0;border-radius:50%;background:#16324f;color:#5ce1ff;cursor:pointer}

@media (max-width:1200px){
  .wrap{width:auto;padding:0 12px}
  .layout{display:block}
  .main,.side{width:100%}
  .pop-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:760px){
  .nav-toggle{display:block}
  .nav{display:none;position:absolute;top:68px;left:0;right:0;background:#0b1426;flex-direction:column;padding:8px}
  .nav.open{display:flex}
  .header-inner{position:relative}
  .hero-title{font-size:26px}
  .c-time{width:auto;font-size:11px}
  .c-league{display:none}
  .c-teams .home,.c-teams .away{width:38%}
  .pop-grid{grid-template-columns:1fr 1fr}
  .names{gap:10px;font-size:14px}
  .big-score{font-size:24px}
  .news-item img{width:88px;height:60px}
  .pager-article{flex-direction:column}
}