/* =====================================================================
   mmj —— 2026 美墨加世界杯 多彩活力主题
   配色：珊瑚 / 绿松石 + 红(美·加) / 绿(墨) / 蓝(美) 三国代表色
   适配：px + 媒体查询断点（414 / 768 / 992 / 1200）
   ===================================================================== */

/* ---------- reset ---------- */
* { margin: 0; padding: 0; box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: "PingFang SC", "Microsoft YaHei", "Helvetica Neue", Arial, sans-serif;
  color: var(--ink);
  background: var(--bg);
  font-size: 14px;
  line-height: 1.6;
  min-width: 320px;
}
ul, ol, li { list-style: none; }
a { color: inherit; text-decoration: none; transition: color .2s, background .2s, transform .2s, box-shadow .2s; }
img { display: block; border: 0; max-width: 100%; }
button, input { font-family: inherit; outline: none; border: 0; }
h1, h2, h3, strong, b { font-weight: 700; }
time { display: inline-block; }

/* ---------- palette ---------- */
:root {
  --navy: #0a2a5e;     /* 美国 海军蓝 */
  --blue: #0d57c6;     /* 活力蓝 */
  --red: #e4002b;      /* 红：美·加 */
  --green: #00a651;    /* 绿：墨西哥 */
  --coral: #ff6a3d;    /* 珊瑚色 */
  --coral-2: #ff3d77;  /* 玫珊瑚 */
  --turq: #12c8b6;     /* 绿松石 */
  --sun: #ffc733;      /* 活力黄 */
  --ink: #16223a;
  --muted: #6b7790;
  --line: #e7ebf3;
  --bg: #f2f5fb;
  --card: #ffffff;
  --grad: linear-gradient(120deg, #ff6a3d 0%, #ff3d77 42%, #12c8b6 100%);
  --grad-cool: linear-gradient(120deg, #0d57c6 0%, #12c8b6 100%);
  --grad-flag: linear-gradient(120deg, #e4002b 0%, #ff6a3d 50%, #00a651 100%);
  --radius: 14px;
  --radius-sm: 10px;
  --shadow: 0 8px 24px rgba(16, 34, 58, .08);
  --shadow-hover: 0 14px 34px rgba(16, 34, 58, .14);
}

/* ---------- layout container ---------- */
.w { width: 1200px; max-width: calc(100% - 24px); margin: 0 auto; }

/* 顶部多彩活力色带（贯穿三国旗色） */
.flag-strip { height: 5px; background: var(--grad-flag); }

/* ========================= header ========================= */
.mmj-header {
  position: sticky; top: 0; z-index: 60;
  background: var(--navy);
  background-image: radial-gradient(circle at 12% 0%, rgba(255, 106, 61, .35), transparent 38%),
                    radial-gradient(circle at 88% 120%, rgba(18, 200, 182, .35), transparent 40%);
  box-shadow: 0 2px 14px rgba(10, 42, 94, .25);
}
.mmj-bar { display: flex; align-items: center; height: 70px; gap: 24px; }
.mmj-logo { display: flex; align-items: center; flex-shrink: 0; }
.mmj-logo img { height: 52px; width: auto; }
.mmj-nav { flex: 1; overflow-x: auto; }
.mmj-nav ul { display: flex; align-items: center; gap: 6px; }
.mmj-nav li a {
  display: block; padding: 8px 16px; border-radius: 999px;
  color: rgba(255, 255, 255, .82); font-size: 15px; white-space: nowrap; font-weight: 500;
}
.mmj-nav li a:hover { color: #fff; background: rgba(255, 255, 255, .12); }
.mmj-nav li.on a { color: #fff; background: var(--grad); box-shadow: 0 6px 16px rgba(255, 61, 119, .4); }
.mmj-search { flex-shrink: 0; display: flex; align-items: center; background: rgba(255, 255, 255, .14); border-radius: 999px; padding: 4px 4px 4px 16px; }
.mmj-search input { background: transparent; color: #fff; width: 130px; font-size: 14px; }
.mmj-search input::placeholder { color: rgba(255, 255, 255, .6); }
.mmj-search .search { width: 34px; height: 34px; border-radius: 50%; background: var(--grad); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; }

/* ========================= footer ========================= */
.mmj-footer { margin-top: 40px; background: var(--navy); color: rgba(255, 255, 255, .7); }
.mmj-footer .ft-top { display: flex; align-items: center; gap: 28px; padding: 26px 0; border-bottom: 1px solid rgba(255, 255, 255, .1); flex-wrap: wrap; }
.mmj-footer .ft-top img { height: 40px; }
.mmj-footer .ft-links { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
.mmj-footer .ft-links strong { color: #fff; }
.mmj-footer .ft-links a:hover { color: var(--turq); }
.mmj-footer .ft-copy { padding: 20px 0; font-size: 12.5px; line-height: 1.9; }
.mmj-footer .ft-copy a { color: rgba(255, 255, 255, .85); }
.mmj-footer .ft-copy a:hover { color: var(--coral); }

/* 返回顶部火箭 */
.rapidly { position: fixed; right: 22px; bottom: 40px; z-index: 50; cursor: pointer; }
.rapidly img { width: 52px; height: 52px; filter: drop-shadow(0 6px 12px rgba(0, 0, 0, .25)); }

/* ========================= 通用卡片 / 区块标题 ========================= */
.card { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 18px; }
.block { margin-top: 22px; }
.sec-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
.sec-head .sec-title { display: flex; align-items: center; gap: 10px; font-size: 18px; color: var(--ink); }
.sec-head .sec-title::before { content: ""; width: 6px; height: 20px; border-radius: 4px; background: var(--grad); }
.sec-head .more { display: inline-flex; align-items: center; gap: 4px; color: var(--muted); font-size: 13px; }
.sec-head .more:hover { color: var(--coral); }

/* 标签胶囊导航 */
.pill-nav { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.pill-nav a, .pill-nav li { display: inline-block; }
.pill-nav a, .pill-nav li > a { padding: 6px 14px; border-radius: 999px; background: #eef2fa; color: var(--muted); font-size: 13px; cursor: pointer; }
.pill-nav a:hover, .pill-nav li:hover > a, .pill-nav li.active > a { background: var(--grad-cool); color: #fff; }

/* 面包屑 */
.crumb { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 13px; padding: 16px 0; flex-wrap: wrap; }
.crumb .iconfont { color: var(--coral); }
.crumb ol { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.crumb li { display: flex; align-items: center; gap: 6px; }
.crumb li:not(:last-child)::after { content: "/"; color: #c4ccda; }
.crumb a:hover { color: var(--coral); }
.crumb li:last-child a { color: var(--ink); }

/* ========================= 比赛卡片（全站通用） ========================= */
.match-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }
.match-card {
  position: relative; background: var(--card); border-radius: var(--radius);
  box-shadow: var(--shadow); padding: 14px 16px; overflow: hidden;
  border: 1px solid var(--line);
}
.match-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: #cbd5e6; }
.match-card.mc-green::before { background: var(--green); }
.match-card.mc-yellow::before { background: var(--coral); }
.match-card.mc-gray::before { background: #98a2b3; }
.match-card:hover { box-shadow: var(--shadow-hover); transform: translateY(-2px); }

.mc-top { display: flex; align-items: center; gap: 10px; padding-bottom: 12px; border-bottom: 1px dashed var(--line); }
.mc-league { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12.5px; max-width: 45%; min-width: 0; }
.mc-league img { width: 20px; height: 20px; object-fit: contain; border-radius: 4px; }
.mc-league span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mc-state { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 600; margin-left: auto; }
.mc-green .mc-state { color: var(--green); }
.mc-yellow .mc-state { color: var(--coral); }
.mc-gray .mc-state { color: #98a2b3; }
.mc-state .dot { width: 8px; height: 8px; border-radius: 50%; background: currentColor; }
.mc-green .mc-state .dot { animation: livePulse 1.1s infinite; }
@keyframes livePulse { 0% { box-shadow: 0 0 0 0 rgba(0, 166, 81, .5); } 100% { box-shadow: 0 0 0 8px rgba(0, 166, 81, 0); } }
.mc-time { color: #9aa4b8; font-size: 12px; margin-left: 8px; }

.mc-mid { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; padding: 14px 0 4px; }
.mc-team { display: flex; align-items: center; gap: 8px; min-width: 0; }
.mc-team img { width: 34px; height: 34px; object-fit: contain; flex-shrink: 0; }
.mc-team span { font-size: 14px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mc-team.home { justify-content: flex-end; text-align: right; }
.mc-team.away { justify-content: flex-start; }
.mc-score { display: flex; align-items: center; gap: 6px; font-weight: 800; font-size: 20px; color: var(--navy); }
.mc-score i { color: #c4ccda; font-style: normal; font-size: 14px; }
.mc-green .mc-score { color: var(--red); }

.mc-foot { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--line); flex-wrap: wrap; }
.mc-foot .watch-label { display: inline-flex; align-items: center; gap: 4px; color: var(--muted); font-size: 12.5px; }
.mc-foot .watch-label .iconfont { color: var(--turq); }
.mc-foot a:not(.watch-label) { padding: 3px 12px; border-radius: 999px; background: #eef2fa; color: var(--blue); font-size: 12.5px; }
.mc-foot a:not(.watch-label):hover { background: var(--grad-cool); color: #fff; }

/* ========================= 内页布局：主区 + 侧栏 ========================= */
.layout { display: grid; grid-template-columns: 1fr 320px; gap: 22px; align-items: start; }
.layout .main-col { min-width: 0; }
.aside { display: flex; flex-direction: column; gap: 22px; }
.aside .card { padding: 16px; }

/* 侧栏新闻榜 */
.rank-list li { padding: 9px 0; border-bottom: 1px dashed var(--line); }
.rank-list li:last-child { border-bottom: 0; }
.rank-list li a { display: flex; align-items: center; gap: 10px; width: 100%; min-width: 0; }
.rank-list .no { width: 22px; height: 22px; border-radius: 6px; background: #eef2fa; color: var(--muted); display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; flex-shrink: 0; }
.rank-list li:nth-child(1) .no { background: var(--red); color: #fff; }
.rank-list li:nth-child(2) .no { background: var(--coral); color: #fff; }
.rank-list li:nth-child(3) .no { background: var(--sun); color: #fff; }
.rank-list p { flex: 1; min-width: 0; font-size: 13.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rank-list time { flex-shrink: 0; }
.rank-list a:hover p { color: var(--coral); }
.rank-list time { color: #9aa4b8; font-size: 12px; }

/* 侧栏视频小卡 */
.aside-video ul { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.aside-video .clip { position: relative; border-radius: var(--radius-sm); overflow: hidden; background: #000; }
.aside-video .clip img.cover { width: 100%; height: 84px; object-fit: cover; opacity: .92; }
.aside-video .clip .play { position: absolute; left: 50%; top: 42%; transform: translate(-50%, -50%); width: 30px; height: 30px; }
.aside-video .clip time { position: absolute; right: 6px; bottom: 6px; background: rgba(0, 0, 0, .6); color: #fff; font-size: 11px; padding: 1px 5px; border-radius: 4px; }
.aside-video p { font-size: 12.5px; margin-top: 6px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.aside-video a:hover p { color: var(--coral); }

/* ========================= 首页 hero ========================= */
.hero { background: var(--navy); background-image: var(--grad-cool); border-radius: 0; padding: 0; }
.hero-inner { padding: 30px 0 26px; }
.hero h1 { color: #fff; font-size: 26px; letter-spacing: .5px; }
.hero h1 em { font-style: normal; color: var(--sun); }
.hero p { color: rgba(255, 255, 255, .8); margin-top: 8px; font-size: 14px; }
.hero-hot { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.hero-hot a { background: rgba(255, 255, 255, .16); color: #fff; padding: 6px 14px; border-radius: 999px; font-size: 13px; }
.hero-hot a:hover { background: var(--grad); }

/* 视频网格卡 */
.video-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.video-card { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; }
.video-card:hover { box-shadow: var(--shadow-hover); transform: translateY(-3px); }
.video-card .cover-box { position: relative; aspect-ratio: 16 / 10; background: #000; overflow: hidden; }
.video-card .cover-box img.cover { width: 100%; height: 100%; object-fit: cover; opacity: .94; }
.video-card:hover .cover-box img.cover { transform: scale(1.06); }
.video-card .play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 46px; height: 46px; filter: drop-shadow(0 4px 10px rgba(0, 0, 0, .4)); }
.video-card .dur { position: absolute; right: 8px; bottom: 8px; background: rgba(0, 0, 0, .6); color: #fff; font-size: 11px; padding: 1px 6px; border-radius: 4px; }
.video-card .v-info { padding: 12px 14px; }
.video-card .v-info p { font-size: 14px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; min-height: 42px; }
.video-card .meta { display: flex; align-items: center; gap: 14px; margin-top: 8px; color: #9aa4b8; font-size: 12px; }
.video-card .meta span, .video-card .meta time { display: inline-flex; align-items: center; gap: 4px; }
.video-card .meta img { width: 14px; height: 14px; }

/* 新闻列表卡 */
.news-list li { margin-bottom: 14px; }
.news-list a { display: flex; gap: 16px; background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 14px; }
.news-list a:hover { box-shadow: var(--shadow-hover); }
.news-list .thumb { width: 180px; height: 116px; border-radius: var(--radius-sm); overflow: hidden; flex-shrink: 0; }
.news-list .thumb img { width: 100%; height: 100%; object-fit: cover; }
.news-list .n-body { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.news-list .n-title { font-size: 17px; font-weight: 700; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.news-list a:hover .n-title { color: var(--coral); }
.news-list .n-desc { color: var(--muted); font-size: 13.5px; margin-top: 8px; line-height: 1.7; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; flex: 1; }
.news-list .n-meta { display: flex; align-items: center; gap: 16px; color: #9aa4b8; font-size: 12px; margin-top: 8px; }
.news-list .n-meta span, .news-list .n-meta time { display: inline-flex; align-items: center; gap: 4px; }
.news-list .n-meta img { width: 14px; height: 14px; }

/* 搜索词云 / 球队胶囊 */
.search-box { display: flex; background: #fff; border-radius: 999px; box-shadow: var(--shadow); padding: 6px 6px 6px 18px; max-width: 560px; }
.search-box input { flex: 1; font-size: 14px; }
.search-box .search, .search-box .sb-go { width: 40px; height: 40px; border-radius: 50%; background: var(--grad); color: #fff; display: flex; align-items: center; justify-content: center; cursor: pointer; flex-shrink: 0; }
.tag-cloud { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; }
.tag-cloud a { padding: 7px 16px; background: #fff; border-radius: 999px; box-shadow: var(--shadow); font-size: 13.5px; }
.tag-cloud a:hover { background: var(--grad); color: #fff; }

.team-cloud { display: flex; flex-wrap: wrap; gap: 12px; }
.team-cloud a { display: flex; align-items: center; gap: 8px; padding: 8px 16px 8px 8px; background: #fff; border-radius: 999px; box-shadow: var(--shadow); font-size: 13.5px; }
.team-cloud a img { width: 30px; height: 30px; object-fit: contain; }
.team-cloud a:hover { transform: translateY(-2px); box-shadow: var(--shadow-hover); }

/* 问答卡 */
.qa-list { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.qa-card { background: var(--card); border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px; }
.qa-card .q { display: flex; align-items: flex-start; gap: 8px; font-size: 15px; font-weight: 700; }
.qa-card .q .iconfont { color: var(--coral); font-size: 18px; flex-shrink: 0; }
.qa-card .q span { min-width: 0; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; }
.qa-card .a { display: flex; align-items: flex-start; gap: 8px; margin-top: 12px; color: var(--muted); font-size: 13.5px; }
.qa-card .a .iconfont { color: var(--turq); font-size: 18px; flex-shrink: 0; }
.qa-card .a .txt { min-width: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 1.7; }
.qa-card .qa-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 12px; padding-top: 10px; border-top: 1px dashed var(--line); color: #9aa4b8; font-size: 12px; }
.qa-card .qa-foot span { display: inline-flex; align-items: center; gap: 4px; }
.qa-card .qa-foot .iconfont { color: var(--turq); font-size: 14px; }
.qa-card a:hover .q span { color: var(--coral); }
.qa-card:hover { box-shadow: var(--shadow-hover); }

/* ========================= 分页 ========================= */
.pager { display: flex; justify-content: center; margin: 26px 0 6px; }
.pager .pagination, .pager ul { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.pager a, .pager span, .pager li > a, .pager li > span { display: inline-flex; min-width: 36px; height: 36px; padding: 0 10px; align-items: center; justify-content: center; background: #fff; border-radius: 9px; box-shadow: var(--shadow); color: var(--ink); font-size: 13px; }
.pager a:hover { background: var(--grad-cool); color: #fff; }
.pager .active span, .pager .active, .pager li.active > span { background: var(--grad); color: #fff; }

/* ========================= 详情：比赛 ========================= */
.detail-head { background: var(--navy); background-image: var(--grad-cool); border-radius: var(--radius); padding: 24px; color: #fff; box-shadow: var(--shadow); }
.detail-head h1 { font-size: 22px; }
.detail-head .dh-meta { display: flex; gap: 18px; margin-top: 10px; color: rgba(255, 255, 255, .8); font-size: 13px; }
.detail-head .dh-meta span, .detail-head .dh-meta time { display: inline-flex; align-items: center; gap: 5px; }
.detail-head .dh-meta img { width: 14px; height: 14px; filter: brightness(0) invert(1); opacity: .8; }
.versus { position: relative; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; margin-top: 22px; }
.versus .vt { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.versus .vt img { width: 70px; height: 70px; object-fit: contain; }
.versus .vt strong { font-size: 16px; }
.versus .vmid { text-align: center; }
.versus .vmid .vscore { font-size: 34px; font-weight: 800; display: flex; align-items: center; gap: 12px; }
.versus .vmid .vscore .to { font-size: 18px; opacity: .7; }
.versus .vmid .vleague { display: inline-block; margin-top: 6px; padding: 3px 12px; border-radius: 999px; background: rgba(255, 255, 255, .18); font-size: 12px; }
.versus .vmid time { color: rgba(255, 255, 255, .8); font-size: 12px; }
.recplay { margin-top: 16px; background: rgba(255, 255, 255, .14); border-radius: var(--radius-sm); padding: 10px 14px; display: flex; align-items: center; gap: 8px; font-size: 13px; }
.recplay strong { color: var(--sun); }

.intro-text { color: var(--muted); font-size: 13.5px; line-height: 1.9; margin-top: 16px; }
.intro-text a { color: var(--blue); }
.intro-text a:hover { color: var(--coral); }

/* tab */
.tabs { display: flex; gap: 6px; margin-top: 22px; background: #fff; border-radius: var(--radius) var(--radius) 0 0; box-shadow: var(--shadow); padding: 6px; }
.tabs .tab { flex: 1; text-align: center; padding: 12px 0; border-radius: var(--radius-sm); cursor: pointer; font-weight: 600; color: var(--muted); }
.tabs .tab.active { background: var(--grad); color: #fff; }
.tab-body { background: #fff; border-radius: 0 0 var(--radius) var(--radius); box-shadow: var(--shadow); padding: 20px; }
.tab-pane { display: none; }
.tab-pane.show { display: block; }

.notice-line { display: flex; gap: 8px; padding: 9px 0; border-bottom: 1px dashed var(--line); font-size: 14px; flex-wrap: wrap; }
.notice-line strong { color: var(--navy); flex-shrink: 0; }
.notice-line a { color: var(--blue); }

/* 直播信号源（铁契约结构内的展示样式） */
.signal-wrap { padding: 12px 0; border-bottom: 1px dashed var(--line); }
.signal-wrap > strong { color: var(--navy); display: block; margin-bottom: 10px; }
.ul-signal { display: flex; flex-wrap: wrap; gap: 10px; }
.ul-signal li { }
.ul-signal li a { display: inline-block; padding: 7px 16px; border-radius: 999px; background: #eef2fa; color: var(--blue); font-size: 13px; cursor: pointer; }
.ul-signal li a:hover { background: var(--grad); color: #fff; }

/* 文字直播 */
.live-feed { display: flex; flex-direction: column; }
.live-feed .lf-row { display: grid; grid-template-columns: 70px 1fr auto; align-items: center; gap: 10px; padding: 10px; border-bottom: 1px solid var(--line); }
.live-feed .lf-row:last-child { border-bottom: 0; }
.live-feed .lf-time { color: var(--muted); font-size: 13px; }
.live-feed .lf-icon { width: 20px; height: 20px; }
.live-feed .lf-text { font-size: 13.5px; }
.live-feed .lf-side { width: 26px; height: 26px; object-fit: contain; }
.live-empty { text-align: center; color: var(--muted); padding: 40px 0; }

/* 情报 */
.intel-nav { display: flex; gap: 6px; margin-bottom: 14px; }
.intel-nav li { padding: 7px 16px; border-radius: 999px; background: #eef2fa; color: var(--muted); cursor: pointer; font-size: 13px; }
.intel-nav li.active { background: var(--grad-cool); color: #fff; }
.intel-pane { display: none; }
.intel-pane.show { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.intel-col h4 { display: flex; align-items: center; gap: 6px; font-size: 14px; color: var(--navy); margin-bottom: 8px; }
.intel-col h4 .iconfont { color: var(--coral); }
.intel-col ol li { position: relative; padding: 8px 8px 8px 18px; font-size: 13.5px; color: var(--muted); border-bottom: 1px dashed var(--line); }
.intel-col ol li::before { content: ""; position: absolute; left: 4px; top: 15px; width: 6px; height: 6px; border-radius: 50%; background: var(--turq); }
.tidings-level-1::before { background: var(--green) !important; }
.tidings-level-2::before { background: var(--coral) !important; }
.tidings-level-3::before { background: var(--red) !important; }

/* 历史交锋 / 近期 表 */
.h2h { margin-bottom: 22px; }
.h2h .h2h-title { display: flex; align-items: center; gap: 8px; font-size: 15px; color: var(--navy); margin-bottom: 12px; }
.h2h .h2h-title::before { content: ""; width: 5px; height: 16px; border-radius: 3px; background: var(--grad); }
.h2h table, .h2h .row { width: 100%; }
.h2h-row { display: grid; grid-template-columns: 1.2fr 2fr 0.8fr; align-items: center; gap: 8px; padding: 10px 8px; border-bottom: 1px solid var(--line); font-size: 13px; }
.h2h-row.head { color: var(--muted); font-weight: 600; background: #f7f9fd; border-radius: 8px; }
.h2h-row .vs-cell { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 8px; }
.h2h-row .vs-cell .t a{ display: flex; align-items: center; gap: 6px; }
.h2h-row .vs-cell .t img { width: 22px; height: 22px; object-fit: contain; }
.h2h-row .vs-cell .t.home a { justify-content: flex-end; }
.h2h-row .vs-cell .sc { font-weight: 700; color: var(--red); }
.h2h-row .detail-link { color: var(--blue); text-align: center; }
.h2h-row .detail-link:hover { color: var(--coral); }
.subtab { display: flex; gap: 8px; margin-bottom: 12px; }
.subtab .st { padding: 6px 14px; border-radius: 999px; background: #eef2fa; color: var(--muted); cursor: pointer; font-size: 13px; }
.subtab .st.active { background: var(--grad-cool); color: #fff; }
.h2h-pane { display: none; }
.h2h-pane.show { display: block; }

/* ========================= 详情：文章/视频 ========================= */
.article-card { background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); padding: 26px; }
.article-card h1 { font-size: 24px; line-height: 1.4; }
.article-meta { display: flex; align-items: center; gap: 18px; color: var(--muted); font-size: 13px; margin: 14px 0 20px; padding-bottom: 16px; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.article-meta span, .article-meta time { display: inline-flex; align-items: center; gap: 5px; }
.article-meta img { width: 15px; height: 15px; }
.article-body { font-size: 16px; line-height: 1.9; color: #2a3650; }
.article-body p { margin: 14px 0; }
.article-body img { margin: 16px auto; border-radius: 10px; max-width: 100%; height: auto; }
.article-nav { display: flex; flex-direction: column; gap: 10px; margin-top: 24px; padding-top: 16px; border-top: 1px solid var(--line); }
.article-nav a { display: flex; gap: 8px; color: var(--muted); font-size: 14px; }
.article-nav a span { color: var(--coral); flex-shrink: 0; }
.article-nav a:hover { color: var(--coral); }

.video-stage { position: relative; margin-top: 18px; border-radius: var(--radius); overflow: hidden; background: #000; cursor: pointer; aspect-ratio: 16 / 9; }
.video-stage img.cover { width: 100%; height: 100%; object-fit: cover; opacity: .85; }
.video-stage .play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 72px; height: 72px; filter: drop-shadow(0 6px 16px rgba(0, 0, 0, .5)); }
.video-stage time { position: absolute; right: 12px; bottom: 12px; background: rgba(0, 0, 0, .6); color: #fff; font-size: 12px; padding: 2px 8px; border-radius: 6px; }
.video-rel { margin-top: 22px; }
.video-rel .video-grid { grid-template-columns: repeat(4, 1fr); }

/* ========================= 球队/球员页 ========================= */
.team-hero { display: flex; align-items: center; gap: 24px; background: var(--navy); background-image: var(--grad-cool); border-radius: var(--radius); padding: 24px; color: #fff; box-shadow: var(--shadow); flex-wrap: wrap; }
.team-hero .badge { display: flex; flex-direction: column; align-items: center; gap: 8px; }
.team-hero .badge img { width: 84px; height: 84px; object-fit: contain; }
.team-hero .badge figcaption { font-size: 16px; font-weight: 700; }
.team-hero .t-meta { flex: 1; min-width: 240px; }
.team-hero .t-meta .team-name { font-size: 22px; color: #fff; margin-bottom: 12px; }
.team-hero .t-meta ul { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 24px; }
.team-hero .t-meta li { font-size: 14px; color: rgba(255, 255, 255, .85); }
.team-hero .t-meta li strong { color: #fff; }
.team-hero .t-meta a { color: var(--sun); }
.team-bio { margin-top: 16px; background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); padding: 18px; }
.team-bio strong { color: var(--navy); }
.team-bio p { color: var(--muted); font-size: 14px; line-height: 1.9; margin-top: 8px; }

.player-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.player-card { background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px; }
.player-card:hover { box-shadow: var(--shadow-hover); }
.player-card .p-top { display: flex; align-items: center; gap: 12px; padding-bottom: 12px; border-bottom: 1px dashed var(--line); }
.player-card .p-top img { width: 54px; height: 54px; border-radius: 50%; object-fit: cover; background: #eef2fa; }
.player-card .p-top figcaption { font-size: 16px; font-weight: 700; }
.player-card .p-mete { margin-top: 10px; }
.player-card .p-mete li { display: flex; justify-content: space-between; font-size: 13px; padding: 5px 0; color: var(--muted); }
.player-card .p-mete li strong { color: var(--ink); font-weight: 600; }
.player-honor { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.player-honor figure { display: flex; flex-direction: column; align-items: center; gap: 4px; width: 48px; }
.player-honor img { width: 36px; height: 36px; object-fit: contain; }
.player-honor figcaption { font-size: 11px; color: var(--muted); text-align: center; }

/* 球队页左侧 tab */
.side-tabs { display: flex; gap: 6px; margin: 20px 0 16px; background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); padding: 6px; }
.side-tabs .st-item { flex: 1; text-align: center; padding: 11px 0; border-radius: var(--radius-sm); cursor: pointer; color: var(--muted); font-weight: 600; }
.side-tabs .st-item.active { background: var(--grad); color: #fff; }
.tab-section { display: none; }
.tab-section.show { display: block; }

/* ========================= big 聚合页 ========================= */
.big-comp-nav { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 18px; }
.big-comp-nav li { display: flex; align-items: center; gap: 6px; padding: 8px 16px; background: #fff; border-radius: 999px; box-shadow: var(--shadow); cursor: pointer; font-size: 13.5px; }
.big-comp-nav li img { width: 22px; height: 22px; object-fit: contain; }
.big-comp-nav li.active { background: var(--grad-cool); color: #fff; }
.big-arena { display: none; }
.big-arena.show { display: block; }
.big-arena ul li { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 14px; padding: 12px; background: #fff; border-radius: var(--radius-sm); box-shadow: var(--shadow); margin-bottom: 10px; }
.big-arena .b-vs { display: flex; align-items: center; gap: 10px; justify-content: center; font-size: 14px; }
.big-arena .b-vs span { color: var(--muted); }
.big-arena .b-state { color: var(--coral); font-size: 13px; }
.big-hot { margin-top: 22px; }
.big-hot .playdown { display: flex; flex-wrap: wrap; gap: 10px; }
.big-hot .playdown a { padding: 7px 16px; background: #fff; border-radius: 999px; box-shadow: var(--shadow); font-size: 13.5px; }
.big-hot .playdown a:hover { background: var(--grad); color: #fff; }

/* ========================= 赛程页 ========================= */
.sift-balls { display: flex; gap: 14px; margin-bottom: 18px; }
.sift-balls .ball { flex: 1; display: flex; align-items: center; justify-content: center; gap: 10px; padding: 16px; background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); }
.sift-balls .ball a{
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  height: 100%;
}
.sift-balls .ball img { width: 30px; height: 30px; object-fit: contain; }
.sift-balls .ball strong { font-size: 16px; color: var(--muted); }
.sift-balls .ball.active { background: var(--grad-cool); }
.sift-balls .ball.active strong { color: #fff; }
.week-bar { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 8px; margin-bottom: 18px; }
.week-bar li { flex-shrink: 0; }
.week-bar a { display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 88px; padding: 10px 12px; background: #fff; border-radius: var(--radius-sm); box-shadow: var(--shadow); }
.week-bar a span { font-weight: 700; font-size: 14px; }
.week-bar a time { font-size: 12px; color: var(--muted); }
.week-bar li.active a { background: var(--grad); }
.week-bar li.active a span, .week-bar li.active a time { color: #fff; }

/* 搜索结果页 */
.search-head { background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); padding: 22px; }
.search-head h1 { font-size: 22px; }
.search-head p { color: var(--muted); font-size: 13.5px; margin-top: 10px; line-height: 1.8; }
.related-search { margin-top: 22px; }
.related-search .rs-title { display: flex; align-items: center; gap: 8px; font-size: 15px; color: var(--navy); margin-bottom: 12px; }
.related-search .rs-title img { width: 26px; height: 26px; }
.related-search ul { display: flex; flex-wrap: wrap; gap: 10px; }
.related-search ul li a { display: flex; align-items: center; gap: 6px; padding: 8px 16px; background: #fff; border-radius: 999px; box-shadow: var(--shadow); font-size: 13.5px; }
.related-search ul li a img { width: 16px; height: 16px; }
.related-search ul li a:hover { background: var(--grad); color: #fff; }

/* 侧栏问答小列表 */
.ask-mini li { padding: 10px 0; border-bottom: 1px dashed var(--line); }
.ask-mini li:last-child { border-bottom: 0; }
.ask-mini p { font-size: 13.5px; font-weight: 600; line-height: 1.5; }
.ask-mini a:hover p { color: var(--coral); }
.ask-mini .am-meta { display: flex; align-items: center; gap: 14px; margin-top: 6px; color: #9aa4b8; font-size: 12px; }
.ask-mini .am-meta span, .ask-mini .am-meta time { display: inline-flex; align-items: center; gap: 4px; }
.ask-mini .am-meta img { width: 14px; height: 14px; }

/* 空占位 */
.empty { text-align: center; color: var(--muted); padding: 40px 0; font-size: 14px; }

/* ========================= 响应式断点 ========================= */
@media screen and (max-width: 1200px) {
  .video-grid, .video-rel .video-grid { grid-template-columns: repeat(3, 1fr); }
}
@media screen and (max-width: 992px) {
  .layout { grid-template-columns: 1fr; }
  .aside { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
  .team-hero .t-meta ul { grid-template-columns: 1fr; }
}
@media screen and (max-width: 768px) {
  .mmj-bar { height: 56px; gap: 12px; }
  .mmj-logo img { height: 40px; }
  .mmj-search { display: none; }
  .match-list { grid-template-columns: 1fr; }
  .video-grid, .video-rel .video-grid { grid-template-columns: repeat(2, 1fr); }
  .qa-list { grid-template-columns: 1fr; }
  .player-grid { grid-template-columns: repeat(2, 1fr); }
  .aside { grid-template-columns: 1fr; }
  .news-list .thumb { width: 120px; height: 84px; }
  .news-list .n-title { font-size: 15px; }
  .hero h1 { font-size: 20px; }
  .versus .vt img { width: 52px; height: 52px; }
  .versus .vmid .vscore { font-size: 26px; }
  .intel-pane.show { grid-template-columns: 1fr; }
  .article-card { padding: 16px; }
  .article-card h1 { font-size: 20px; }
  .article-body { font-size: 15px; }
  .tabs .tab { padding: 10px 0; font-size: 13px; }
  .big-arena ul li { grid-template-columns: 1fr; gap: 8px; text-align: center; }
}
@media screen and (max-width: 414px) {
  .video-grid, .video-rel .video-grid { grid-template-columns: 1fr 1fr; }
  .player-grid { grid-template-columns: 1fr; }
  .mc-team span { font-size: 13px; }
  .mc-score { font-size: 18px; }
  .week-bar a { min-width: 72px; }
}