*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",Arial,sans-serif;
  font-size:14px;line-height:1.6;color:#1a1a2e;background:#f0f2f5;
  -webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;
  padding-bottom:calc(56px + env(safe-area-inset-bottom,0px));
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
button{font-family:inherit;cursor:pointer;border:none;background:none}
ul,ol{list-style:none}

/* 顶部 */
.site-header{
  background:#0d1b2a;border-bottom:2px solid #e63946;
  position:sticky;top:0;z-index:100;
}
.header-inner{
  max-width:1200px;margin:0 auto;padding:0 12px;
  display:flex;align-items:center;height:52px;gap:12px;
}
.logo{
  display:flex;align-items:center;gap:8px;
  font-size:18px;font-weight:800;color:#fff;white-space:nowrap;flex-shrink:0;
}
.logo-icon{
  width:32px;height:32px;background:#e63946;border-radius:8px;
  display:flex;align-items:center;justify-content:center;font-size:18px;
}
.header-search{
  flex:1;max-width:280px;position:relative;
}
.header-search input{
  width:100%;height:34px;padding:0 32px 0 12px;
  border:1px solid rgba(255,255,255,0.15);border-radius:6px;
  background:rgba(255,255,255,0.08);color:#fff;font-size:13px;outline:none;
}
.header-search input::placeholder{color:rgba(255,255,255,0.4)}
.header-search::after{
  content:"🔍";position:absolute;right:10px;top:50%;transform:translateY(-50%);
  font-size:13px;opacity:.6;
}
.main-nav{
  display:flex;gap:2px;overflow-x:auto;scrollbar-width:none;
  -ms-overflow-style:none;flex:1;justify-content:flex-end;
}
.main-nav::-webkit-scrollbar{display:none}
.main-nav a{
  padding:6px 12px;border-radius:4px;color:rgba(255,255,255,0.75);
  font-size:13px;font-weight:600;white-space:nowrap;flex-shrink:0;
}
.main-nav a:hover{color:#fff;background:rgba(255,255,255,0.06)}
.main-nav a.active{color:#fff;background:#e63946}

/* 即时比分条 */
.ticker-bar{
  background:#fff;border-bottom:1px solid #e2e8f0;
  overflow:hidden;white-space:nowrap;position:relative;
}
.ticker-bar::before,.ticker-bar::after{
  content:"";position:absolute;top:0;bottom:0;width:40px;z-index:2;pointer-events:none;
}
.ticker-bar::before{left:0;background:linear-gradient(90deg,#fff,transparent)}
.ticker-bar::after{right:0;background:linear-gradient(-90deg,#fff,transparent)}
.ticker-wrap{
  display:flex;gap:24px;padding:8px 16px;
  animation:ticker 40s linear infinite;
}
@keyframes ticker{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}
.ticker-item{
  display:flex;align-items:center;gap:8px;font-size:12px;color:#475569;flex-shrink:0;
}
.ticker-item .league-tag{
  padding:1px 6px;border-radius:3px;background:#f1f5f9;font-size:11px;font-weight:700;color:#64748b;
}
.ticker-item .score{font-weight:800;color:#1a1a2e}
.ticker-item .live-dot{
  width:6px;height:6px;border-radius:50%;background:#e63946;
  animation:blink 1.2s infinite;
}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.3}}

/* 面包屑 */
.breadcrumb{
  max-width:1200px;margin:0 auto;padding:10px 12px;font-size:12px;color:#64748b;
}
.breadcrumb a{color:#3b82f6}
.breadcrumb a:hover{text-decoration:underline}
.breadcrumb span{margin:0 6px;color:#cbd5e1}

/* 主内容 */
.main-wrap{
  max-width:1200px;margin:0 auto;padding:0 12px 20px;
  display:grid;grid-template-columns:1fr 340px;gap:16px;align-items:start;
}

/* 卡片通用 */
.card{
  background:#fff;border-radius:8px;border:1px solid #e2e8f0;
  overflow:hidden;margin-bottom:14px;
}
.card-hd{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 14px;border-bottom:1px solid #f1f5f9;
}
.card-hd h2,.card-hd h3{
  font-size:15px;font-weight:800;color:#0f172a;
  display:flex;align-items:center;gap:6px;
}
.card-hd .more{
  font-size:12px;color:#3b82f6;font-weight:600;
}
.card-hd .more:hover{text-decoration:underline}

/* 站点介绍 */
.site-intro{
  padding:18px 16px;
  background:#fff;
}
.intro-head{
  display:flex;align-items:center;gap:10px;margin-bottom:10px;
}
.intro-head h1{
  font-size:18px;font-weight:800;color:#0f172a;
}
.intro-head .intro-badge{
  padding:2px 8px;border-radius:3px;background:#dc2626;color:#fff;
  font-size:11px;font-weight:700;
}
.intro-desc{
  font-size:13px;color:#475569;line-height:1.8;margin-bottom:14px;
}
.intro-features{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
}
.intro-feature{
  text-align:center;padding:12px 8px;border-radius:6px;
  background:#f8fafc;border:1px solid #f1f5f9;
}
.intro-feature .feat-icon{
  font-size:22px;margin-bottom:4px;
}
.intro-feature .feat-title{
  font-size:12px;font-weight:700;color:#0f172a;
}
.intro-feature .feat-desc{
  font-size:11px;color:#94a3b8;margin-top:2px;
}

/* 赛程表 */
.schedule-table{width:100%;font-size:13px}
.schedule-table th{
  text-align:left;padding:8px 12px;background:#f8fafc;color:#64748b;font-size:12px;font-weight:600;
  border-bottom:1px solid #e2e8f0;white-space:nowrap;
}
.schedule-table td{padding:10px 12px;border-bottom:1px solid #f1f5f9;vertical-align:middle}
.schedule-table tr:hover td{background:#f8fafc}
.schedule-table tr.live-row td{background:#fff5f5}
.schedule-table .col-time{width:70px;color:#64748b;font-size:12px;white-space:nowrap}
.schedule-table .col-league{width:90px}
.schedule-table .col-match{min-width:0}
.schedule-table .col-status{width:80px;text-align:center}
.schedule-table .col-link{width:110px;text-align:right}

.league-name{
  display:inline-flex;align-items:center;gap:4px;
  padding:2px 8px;border-radius:4px;background:#f1f5f9;
  font-size:11px;font-weight:700;color:#475569;white-space:nowrap;
}
.match-teams-row{
  display:flex;align-items:center;gap:6px;flex-wrap:wrap;
}
.match-teams-row .home,.match-teams-row .away{
  font-weight:700;color:#0f172a;font-size:13px;
}
.match-teams-row .vs{color:#94a3b8;font-size:11px;font-weight:500}
.match-teams-row .score-live{
  color:#e63946;font-weight:800;font-size:14px;margin-left:4px;
}
.match-teams-row .score-end{color:#64748b;font-weight:700}

.status-tag{
  display:inline-block;padding:3px 8px;border-radius:4px;font-size:11px;font-weight:700;white-space:nowrap;
}
.status-tag.waiting{background:#fef3c7;color:#92400e}
.status-tag.live{background:#fee2e2;color:#991b1b}
.status-tag.end{background:#f1f5f9;color:#64748b}

.link-btn{
  display:inline-flex;align-items:center;gap:4px;
  padding:5px 10px;border-radius:4px;background:#16a34a;color:#fff;
  font-size:12px;font-weight:700;white-space:nowrap;
}
.link-btn:hover{background:#15803d}
.link-btn.gray{background:#64748b}
.link-btn.gray:hover{background:#475569}

/* 右侧模块 */
.news-list{padding:4px 0}
.news-item{
  display:block;padding:10px 14px;border-bottom:1px solid #f1f5f9;
  font-size:13px;font-weight:600;color:#0f172a;line-height:1.5;
  transition:background .15s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.news-item:last-child{border-bottom:0}
.news-item:hover{background:#f8fafc;color:#2563eb}
.news-item::before{content:"▸";color:#94a3b8;margin-right:6px;font-size:10px}

/* 积分榜 */
.standings-table{width:100%;font-size:12px}
.standings-table th{padding:8px 10px;background:#f8fafc;color:#64748b;font-weight:600;text-align:left;border-bottom:1px solid #e2e8f0}
.standings-table td{padding:7px 10px;border-bottom:1px solid #f1f5f9}
.standings-table tr:hover td{background:#f8fafc}
.standings-table .rank{width:28px;text-align:center;font-weight:800;color:#64748b}
.standings-table .rank.top{color:#e63946}
.standings-table .team-cell{font-weight:700;color:#0f172a}
.standings-table .num{text-align:center;color:#475569}

/* 热门标签 */
.tag-cloud{padding:12px 14px;display:flex;flex-wrap:wrap;gap:8px}
.tag-cloud a{
  padding:5px 12px;border-radius:999px;background:#f1f5f9;border:1px solid #e2e8f0;
  font-size:12px;color:#475569;font-weight:600;
}
.tag-cloud a:hover{background:#dbeafe;color:#1d4ed8;border-color:#bfdbfe}

/* 广告位 */
.ad-slot{
  background:linear-gradient(135deg,#fef3c7,#fde68a);
  border:1px dashed #f59e0b;border-radius:8px;padding:14px;text-align:center;
  color:#92400e;font-size:13px;font-weight:700;margin-bottom:14px;
}

/* 底部 */
.site-footer{
  background:#0d1b2a;border-top:3px solid #e63946;margin-top:20px;
}
.footer-inner{
  max-width:1200px;margin:0 auto;padding:24px 12px;text-align:center;
}
.footer-links{
  display:flex;justify-content:center;flex-wrap:wrap;gap:8px 16px;margin-bottom:12px;
}
.footer-links a{color:rgba(255,255,255,0.6);font-size:13px}
.footer-links a:hover{color:#fff}
.footer-copy{color:rgba(255,255,255,0.35);font-size:12px;line-height:1.8}

/* 移动端底部导航 */
.mobile-nav{
  display:none;position:fixed;left:0;right:0;bottom:0;z-index:999;
  height:calc(56px + env(safe-area-inset-bottom,0px));
  padding-bottom:env(safe-area-inset-bottom,0px);
  background:#fff;border-top:1px solid #e2e8f0;
  box-shadow:0 -4px 12px rgba(0,0,0,0.06);
}
.mobile-nav a{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:2px;font-size:10px;color:#64748b;text-decoration:none;padding:6px 0;
}
.mobile-nav a .icon{font-size:20px;line-height:1}
.mobile-nav a.active{color:#e63946;font-weight:700}

/* 响应式 */
@media (max-width:1100px){
  .main-wrap{grid-template-columns:1fr}
  .sidebar{order:2}
  .main-content{order:1}
}
@media (max-width:760px){
  body{padding-bottom:calc(56px + env(safe-area-inset-bottom,0px))}
  .header-inner{padding:0 10px;height:48px}
  .logo{font-size:16px}
  .logo-icon{width:28px;height:28px;font-size:16px}
  .header-search{max-width:160px}
  .header-search input{height:30px;font-size:12px}
  .main-nav a{padding:5px 8px;font-size:12px}
  .ticker-wrap{padding:6px 12px;gap:16px}
  .featured{grid-template-columns:1fr}
  .schedule-table{font-size:12px}
  .schedule-table th{padding:8px 10px}
  .schedule-table td{padding:8px 10px}
  .schedule-table .col-link{display:none}
  .link-btn{padding:4px 8px;font-size:11px}
  .mobile-nav{display:flex}
  .breadcrumb{padding:8px 10px}
  .main-wrap{padding:0 10px 16px;gap:12px}
}
@media (max-width:680px){
  .intro-features{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:420px){
  .schedule-table .col-league{display:none}
  .intro-head h1{font-size:16px}
  .intro-desc{font-size:12px}
  .intro-feature{padding:10px 6px}
  .intro-feature .feat-icon{font-size:18px}
  .intro-feature .feat-title{font-size:11px}
}
@media (min-width:1440px){
  .main-wrap{max-width:1320px;grid-template-columns:1fr 380px}
}