*{margin:0;padding:0;box-sizing:border-box}
html,body{background:#f3f5f8;color:#445;font:14px/1.7 "PingFang SC","Microsoft YaHei",Helvetica,Arial,sans-serif}
a{color:#445;text-decoration:none}
a:hover{color:#1a56c8}
ul,ol,li{list-style:none}
img{max-width:100%;border:0;vertical-align:middle}
button{border:0;background:none;cursor:pointer}
.w{width:1200px;margin:0 auto}
.site-header{background:linear-gradient(90deg,#2b3344 0%,#3a4458 100%);box-shadow:0 4px 16px rgba(20,28,44,.18)}
.header-inner{height:72px;display:flex;align-items:center}
.logo{display:flex;align-items:center;gap:10px;min-width:168px;color:#fff}
.logo span{font-size:22px;font-weight:700;letter-spacing:1px;color:#fff}
.logo:hover{color:#fff}
.nav-links{display:flex;align-items:center;margin-left:36px;flex:1}
.nav-links a{color:#eef2f7;padding:0 22px;height:72px;line-height:72px;font-size:16px;position:relative}
.nav-links a:hover,.nav-links a.on{color:#fff}
.nav-links a.on:after{content:"";position:absolute;left:22px;right:22px;bottom:14px;height:2px;background:#fff}
.menu-btn{display:none;width:28px;height:20px;margin-left:auto}
.menu-btn span{display:block;height:2px;background:#fff;margin:6px 0}
.hotbar{background:#fff;border-bottom:1px solid #eceff4}
.hotbar-inner{display:flex;align-items:center;height:44px;overflow:hidden}
.hotbar b{flex-shrink:0;color:#2b3344;font-size:13px;margin-right:8px}
.hotbar-list{display:flex;gap:4px;overflow-x:auto;white-space:nowrap}
.hotbar-list a{padding:0 10px;color:#556;font-size:13px}
.hotbar-list a:hover{color:#1a56c8}
.wrap{padding:18px 0 48px;min-height:640px}
.crumbs{color:#889;font-size:13px;margin-bottom:14px}
.crumbs a{color:#667}
.layout{display:flex;align-items:flex-start;gap:16px}
.main-left{width:830px;flex-shrink:0}
.main-right{width:354px;flex:1;min-width:0}
.panel{background:#fff;margin-bottom:16px;box-shadow:0 1px 8px rgba(30,40,60,.04)}
.panel-hd{height:46px;line-height:46px;padding:0 16px;font-size:16px;font-weight:700;color:#fff;background:#2b3344}
.panel-bd{padding:14px 16px 16px}
.hot-scroll{display:flex;gap:14px;overflow-x:auto;padding:4px 2px 10px}
.hot-card{flex:0 0 196px;background:#fff;border:1px solid #eef1f5;padding:12px 10px 10px;color:#334}
.hot-card:hover{border-color:#c9d3e3;color:#223;box-shadow:0 6px 16px rgba(40,50,70,.08)}
.hot-card-top{display:flex;justify-content:space-between;color:#889;font-size:12px}
.hot-card-top em{font-style:normal;color:#2b3344;font-weight:700}
.hot-card-top em.live{color:#d1122a}
.hot-card-teams{display:flex;align-items:center;justify-content:space-between;margin:10px 0 8px;gap:6px}
.hot-team{width:42%;text-align:center}
.hot-team img{width:26px;height:26px;object-fit:contain}
.hot-team b{display:block;margin-top:4px;font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hot-card .vs{width:20px;text-align:center;color:#99a;font-size:12px}
.hot-card-foot{text-align:center;color:#889;font-size:12px}
.tabs{display:flex;flex-wrap:wrap;gap:10px;padding:16px 16px 4px;border-bottom:1px solid #efefef}
.tabs a{border:1px solid #b8bec8;color:#556;padding:5px 14px;font-size:13px;border-radius:2px;cursor:pointer}
.tabs a.on,.tabs a:hover{background:#2b3344;border-color:#2b3344;color:#fff}
.date-bar{width:148px;background:#2b3344;color:#fff;font-size:14px;padding:8px 0 8px 16px;margin:16px 0 0}
.match-row{display:flex;align-items:center;min-height:60px;padding:0 12px;border-top:1px solid #f3f3f3}
.match-row:hover{background:#fafbfd}
.col-time{width:12%;color:#334;font-weight:600}
.col-league{width:14%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.col-teams{width:54%;display:flex;align-items:center;justify-content:center;gap:8px;min-width:0}
.col-teams span{width:108px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.col-teams .home{text-align:right}
.col-teams .away{text-align:left}
.col-teams img{width:24px;height:24px;object-fit:contain}
.col-teams em{font-style:normal;color:#99a;width:28px;text-align:center}
.play-btn{display:inline-flex;align-items:center;justify-content:center;width:108px;height:30px;background:#2b3344;color:#fff!important;font-size:13px;gap:4px;flex-shrink:0}
.play-btn i{width:19px;height:19px;background:url(/static/images/play.png) no-repeat center/contain}
.play-btn.is-live{background:#c8102e}
.play-btn:hover{opacity:.92;color:#fff!important}
.news-list li{line-height:30px;border-bottom:1px dashed #f0f0f0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.news-list li:last-child{border-bottom:0}
.news-list a{color:#445}
.vlist .vitem,.nlist .nitem{display:flex;gap:12px;padding:12px 0;border-bottom:1px solid #f2f2f2}
.vlist .vitem:last-child,.nlist .nitem:last-child{border-bottom:0}
.vitem img,.nitem img{width:128px;height:76px;object-fit:cover;background:#eef1f5;flex-shrink:0}
.vitem h3,.nitem h3{font-size:16px;font-weight:600;line-height:1.5;color:#223}
.vitem p,.nitem p{color:#889;font-size:12px;margin-top:6px}
.about-box{background:#fff;padding:22px 24px;margin-bottom:16px}
.about-box h1{font-size:26px;color:#1c2433;margin-bottom:8px;letter-spacing:.5px}
.about-box h2{font-size:18px;color:#1c2433;margin:18px 0 8px}
.about-box p{color:#556;line-height:1.9}
.faq{background:#fff}
.faq-item{border-bottom:1px solid #f0f2f5}
.faq-item dt{padding:14px 18px;cursor:pointer;font-size:15px;color:#223;position:relative}
.faq-item dt:after{content:"+";position:absolute;right:18px;color:#8a93a3;font-size:18px}
.faq-item.open dt:after{content:"-"}
.faq-item dd{display:none;padding:0 18px 14px;color:#667;line-height:1.85}
.faq-item.open dd{display:block}
.match-hero{background:#fff;padding:24px;margin-bottom:16px}
.time-info{display:flex;align-items:center;gap:16px;color:#667;margin-bottom:16px}
.badge{display:inline-flex;align-items:center;gap:6px;font-size:12px}
.badge i{width:8px;height:8px;border-radius:50%;background:#aaa}
.badge.live{color:#c8102e}
.badge.live i{background:#c8102e;box-shadow:0 0 6px #c8102e;animation:pulse 1.2s infinite}
.badge.soon{color:#c98912}
.badge.soon i{background:#c98912}
@keyframes pulse{50%{opacity:.4}}
.team-board{display:flex;align-items:center;justify-content:center;gap:40px;padding:8px 0 18px}
.team-board .team{text-align:center;min-width:140px}
.team-board img{width:72px;height:72px;object-fit:contain}
.team-board span{display:block;margin-top:8px;font-size:16px;font-weight:700;color:#1c2433}
.score-big{text-align:center;font-size:36px;font-weight:800;color:#1c2433;letter-spacing:2px}
.score-big small{display:block;font-size:13px;font-weight:400;color:#889;letter-spacing:0;margin-top:4px}
.channels{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:14px 0;border-top:1px solid #f0f2f5;border-bottom:1px solid #f0f2f5}
.channels span{color:#889}
.channels a{background:#2b3344;color:#fff;padding:8px 16px}
.channels a:hover{background:#c8102e;color:#fff}
.intro{padding-top:16px;color:#556}
.intro h1{display:inline;font-size:20px;color:#1c2433;margin:0 6px}
.intro li{margin:8px 0}
.article{background:#fff;padding:28px 32px;color:#334}
.article h1{font-size:24px;color:#1c2433;margin-bottom:10px;line-height:1.4}
.article .meta{color:#889;font-size:13px;margin-bottom:18px}
.article .cover{display:block;max-width:100%;margin:0 auto 18px}
.article .body p{margin:12px 0;line-height:1.9}
.article .body img{max-width:100%;height:auto}
.video-sources{margin-top:18px}
.video-sources a{display:inline-block;margin:0 8px 8px 0;background:#2b3344;color:#fff;padding:8px 14px}
.video-sources a:hover{background:#c8102e;color:#fff}
.pager{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:18px 0 6px}
.pager a{min-width:36px;height:36px;line-height:36px;display:block;text-align:center;border:1px solid #cfd5de;color:#556}
.pager .on a,.pager a:hover{background:#2b3344;border-color:#2b3344;color:#fff}
.empty{padding:40px;text-align:center;color:#99a}
.site-footer{background:#1b202b;color:#9aa3b2;padding:28px 0 20px;margin-top:10px}
.site-footer h2{color:#fff;font-size:16px;margin-bottom:8px;font-weight:600}
.site-footer p{line-height:1.9}
.site-footer .copy{margin-top:12px;font-size:12px;color:#7d8594;text-align:center}
.gotop{position:fixed;right:28px;bottom:48px;width:46px;height:46px;border-radius:50%;background:#2b3344;display:none;align-items:center;justify-content:center;z-index:20}
.gotop img{filter:brightness(10)}
@media (max-width:1240px){.w{width:96%}.main-left,.main-right{width:auto}.layout{flex-direction:column}}
@media (max-width:860px){
  .nav-links{display:none;position:absolute;top:72px;left:0;right:0;background:#2b3344;flex-direction:column;z-index:30}
  .nav-links.show{display:flex}
  .nav-links a{height:44px;line-height:44px}
  .menu-btn{display:block}
  .site-header{position:relative}
  .hotbar-inner{height:auto;flex-wrap:wrap;padding:8px 0}
  .col-league{display:none}
  .col-time{width:18%}
  .col-teams{width:52%}
  .col-teams span{width:72px}
  .team-board{gap:12px}
  .article{padding:18px}
}
