/* Shared shell and homepage, adapted from the current mini-program artwork. */
.ui-icon { width: 24px; height: 24px; object-fit: contain; flex-shrink: 0; vertical-align: middle; }
/* 顶栏 / 侧栏 / 移动底栏的样式已统一收进 shell.css（它在 ui-sync.css 之后加载，
   写在这里会被覆盖，别再往这里加壳层规则）。 */
.app-footer { color: var(--text-2); }
.footer-brand-name { font-size: 15px; font-weight: 750; color: var(--text); margin-top: 8px; }
.footer-mark { display: inline-flex; width: 34px; height: 28px; align-items: center; justify-content: center; border-radius: 8px; background: var(--bg-soft); color: var(--text-2); font-weight: 900; font-size: 13px; }
.footer-ver { display: block; margin: 6px 0 12px; color: var(--text-2); font-size: 10px; font-weight: 700; letter-spacing: 1.5px; }
/* 页脚声明/防沉迷的尺寸与字重统一收在 shell.css（这里原有的 11px/10px 会被覆盖，已删）。 */
.footer-beian a { color: var(--text-2); }
#homePage { padding-top: 8px; }
/* hero 卡片已下线：首个分区不再额外下压 */
.home-col-left > .home-section:first-child { margin-top: 0; }
.home-section { margin-top: 22px; }
.home-section-heading { display: flex; justify-content: space-between; align-items: flex-end; gap: 12px; margin-bottom: 13px; }
.home-eyebrow { display: block; color: var(--brand); font-size: 9px; font-weight: 800; letter-spacing: 1.5px; line-height: 1.4; margin-bottom: 4px; }
.home-section-heading h2 { font-size: 19px; line-height: 1.3; font-weight: 800; letter-spacing: .2px; }
.home-section-heading a,.home-section-count { font-size: 12px; color: var(--brand); font-weight: 650; padding-bottom: 2px; }
.home-section-heading a:hover { color: var(--brand); text-decoration: underline; }
/* 赛事中心标题行的「收起/展开」：胶囊按钮，对齐小程序 section-collapse-toggle
   （1px 橙描边 rgba(.28) + 8% 橙底 + pill 圆角 + 11px/650 橙字）。
   只在移动端出现，PC 在 ≥1100px 隐藏（见文件下方 #matchToggle）。
   flex-end 下胶囊盒与链接盒同底，胶囊文字中心恰与链接文字中心对齐（已实测）。 */
.home-heading-actions { display: flex; align-items: flex-end; gap: 12px; }
.home-collapse { padding: 3px 11px; border: 1px solid rgba(249, 115, 22, .28); border-radius: 999px; background: rgba(249, 115, 22, .08); color: var(--brand); font-size: 11px; font-weight: 650; line-height: 1.3; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.home-collapse:hover { opacity: .72; }
.home-collapse:active { opacity: .6; }
.home-status-panel { border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: var(--bg-card); box-shadow: var(--shadow); }
.home-status-row { display: flex; align-items: center; width: 100%; gap: 14px; padding: 18px 20px; border: 0; background: transparent; color: var(--text); text-align: left; }
.home-status-row + .home-status-row { border-top: 1px solid var(--line); }
button.home-status-row:hover,a.home-status-row:hover { background: var(--bg-soft); }
.home-status-copy { flex: 1; min-width: 0; }
.home-status-copy strong { display: block; font-size: 14px; font-weight: 750; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.home-status-copy > span { display: block; color: var(--text-2); margin-top: 4px; font-size: 11px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 左侧色条对齐小程序：6rpx 宽、渐变 + 同色微光 */
.home-status-row .status-dot,.home-patch-accent,.home-stream-accent { width: 3px; height: 24px; flex-shrink: 0; border-radius: 8px; background: linear-gradient(180deg,#fb923c,#ea580c); box-shadow: 0 0 6px rgba(249,115,22,.24); }
#compDot { background: linear-gradient(180deg,#818cf8,#4f46e5); box-shadow: 0 0 6px rgba(99,102,241,.22); }
.home-patch-accent { background: linear-gradient(180deg,#a78bfa,#7c3aed); box-shadow: 0 0 6px rgba(124,58,237,.24); }
.home-stream-accent { background: linear-gradient(180deg,#fb7185,#f43f5e); box-shadow: 0 0 6px rgba(244,63,94,.22); }
.home-status-chevron { color: var(--text-3); font-size: 22px; line-height: 1; }
/* 当前动态「比赛中」行：一场一条，三行结构（比赛中 / 队名 VS / 赛事全名）。
   队名独占一行，左栏 320px 下也不会被省略号吃掉对手名。
   容器 display:contents 让行与其它横幅共享分隔线，隐藏时仍要显式 display:none，
   否则 contents 会盖掉 [hidden] 的默认样式。 */
.home-live-rows { display: contents; }
.home-live-rows[hidden] { display: none; }
.home-live-rows:not([hidden]) + .home-status-row { border-top: 1px solid var(--line); }
/* 色条与其它状态行同规格：3×24、垂直居中（不是 stretch——撑满会跟上面几行的短条对不齐）。 */
.home-live-accent { width: 3px; height: 24px; flex-shrink: 0; border-radius: 8px; background: linear-gradient(180deg,#f87171,#ef4444); box-shadow: 0 0 6px rgba(239,68,68,.26); }
.home-live-rows .home-live-kicker { display: block; margin: 0 0 4px; font-size: 10px; font-weight: 700; letter-spacing: .08em; color: #ef4444; }
.home-live-rows .home-status-copy strong { display: block; white-space: normal; overflow: visible; line-height: 1.35; }
/* 状态胶囊配色对齐小程序：进行中绿 / 竞逐红 / 即将开赛橙 / 已结束灰 / 补丁紫 */
.home-status-row .banner-tag { flex-shrink: 0; padding: 5px 10px; font-size: 10px; font-weight: 700; color: #16a34a; background: rgba(34,197,94,.12); border-radius: 20px; }
.home-status-row .banner-tag.upcoming { color: #ea580c; background: rgba(249,115,22,.12); }
.home-status-row .banner-tag.ended { color: var(--text-3); background: var(--bg-soft); }
#compBanner .banner-tag { color: #ef4444; background: rgba(239,68,68,.12); }
#compBanner .banner-tag.upcoming { color: #ea580c; background: rgba(249,115,22,.12); }
#patchBanner .banner-tag { color: #7c3aed; background: rgba(124,58,237,.12); }
.home-status-row .banner-tag.live { color: #ef4444; background: rgba(239,68,68,.12); }
.home-match-subhead { display: flex; align-items: center; justify-content: flex-start; gap: 8px; margin: 18px 0 12px; color: var(--text); }
.home-match-subhead h3 { font-size: 13px; font-weight: 750; }
.home-match-subhead .status-dot { background: #ef4444; box-shadow: 0 0 5px rgba(239,68,68,.65); animation: homeLivePulse 1.5s ease-in-out infinite; }
.home-match-subhead .status-dot:not(.on) { background: #f59e0b; box-shadow: none; animation: none; }
@keyframes homeLivePulse { 0%,100% { opacity: 1; } 50% { opacity: .4; } }
/* 正在进行 / 最新战果：通栏卡，白底 + var(--line) 细描边，与「即将开赛」卡同款 */
#homePage #liveList { display: grid; grid-template-columns: 1fr; gap: 10px; }
/* 即将开赛：按赛区分组，每组独占一行（组头 + 组内卡片网格），组与组纵向排列。
   组内列数由 home.js 的 upCardCols 按容器宽度算（2~4 列），宽屏一组正好排成一行。
   原来把分组再并排成多列，导致「ASIA KR」的标题下面其实是两个赛区的卡，
   读起来像 4 列同属一组，分界线靠猜。 */
#homePage #upcomingList { display: flex; flex-direction: column; align-items: stretch; gap: 18px; }
#homePage .home-up-head { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
#homePage .home-up-bar { width: 3px; height: 12px; flex-shrink: 0; border-radius: 3px; background: var(--brand); }
#homePage .home-up-line { flex: 1; height: 1px; background: var(--line); }
/* 即将开赛：按赛区分组，组内白底细描边卡（对齐小程序 upcomingGroups）。
   列数对齐小程序恒为 2（全场只有一场时由 home.js 写 1 通栏）。 */
#homePage .home-up-grid { display: grid; grid-template-columns: repeat(var(--up-cols, 2),minmax(0,1fr)); gap: 10px; }
#homePage .match-card { margin: 0; border: 1px solid var(--line); box-shadow: 0 4px 14px #0f172a08; padding: 14px 16px; border-radius: 14px; background: var(--bg-card); }
/* 正在进行 / 最新战果：跟「即将开赛」一样白底细描边（原来是浅灰底无描边）。
   live 场次也不再单独描红边，进行中的辨识交给中间的红比分和标题上的脉冲点。 */
#homePage #liveList .match-card { border-color: var(--line); background: var(--bg-card); box-shadow: 0 4px 14px #0f172a08; }
#homePage .match-card.live { border-color: var(--line); }
/* 最新战果（没有直播、只回放最近战果）用计分板卡，列数按战果数量自适应：
   auto-fit 会折叠空轨道 —— 4 张时 4 列各约 230px（和「即将开赛」完全一致），
   3 张各 310px，2 张各 470px，1 张通栏。卡片本身不拉伸高度，
   内容少时下方留白是内容量决定的，硬拉高只会让卡片内部空得更多。 */
#homePage #liveList.is-results { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
/* 计分板卡的「已结束」状态行：灰点灰字，和「即将开赛」的橙色倒计时区分开 */
.match-card.mc-up .mc-status.mc-status-final { color: var(--text-3); }
.match-card.mc-up .mc-status.mc-status-final .mc-dot { background: var(--text-3); box-shadow: none; }
/* 通栏只给「正在进行」的单张卡；赛区分组里某赛区只排到一场时保持半宽，
   和邻组宽度对齐（与小程序 upcoming 注释同一条结论）。 */
#homePage #liveList .match-card:only-child { grid-column: 1 / -1; }
/* 弹窗里复用同一套分组卡（对齐小程序 upcoming-modal-box）；弹窗在 #homePage 外，
   网格和 mc-* 卡片规则都同时按 .home-up-modal-body 作用域写了一份。 */
.home-up-modal-body { max-height: 60vh; overflow-y: auto; }
.home-up-modal-body .home-up-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 10px; }
.home-up-modal-body .home-up-group + .home-up-group { margin-top: 14px; }
#homePage .match-meta { justify-content: flex-start; gap: 8px; font-size: 11px; color: var(--text-2); }
#homePage .match-meta .countdown-tag { margin-left: auto; }
/* 队名在 logo 下方，与小程序一致 */
#homePage .match-team,#homePage .match-team.right { flex-direction: column; align-items: center; justify-content: flex-start; gap: 6px; text-align: center; }
#homePage .match-team.right img,#homePage .match-team.right .team-logo-ph { order: -1; }
#homePage .team-name { white-space: normal; overflow-wrap: anywhere; line-height: 1.3; font-size: 12px; max-width: 130px; }
#homePage .team-logo,#homePage .team-logo-ph { width: 34px; height: 34px; }
/* 正在进行：中间那枚 VS 换成比分数字（上游还没同步比分时仍是 VS）。
   进行中整个比分是红的（表示实时）；已结束的「最新战果」则只把胜方标红、负方弱化，
   与赛程页 .mc-score.score-win 的中文「胜方标红」习惯一致。 */
#homePage .live-score {
  display: inline-flex; align-items: center; gap: 6px;
  font-size: 22px; font-weight: 800; line-height: 1.1;
  font-variant-numeric: tabular-nums; color: var(--err);
}
#homePage .live-score i { font-style: normal; font-size: 15px; color: var(--text-3); }
/* 已结束的场次不再走直播卡（改用 .mc-up 计分板卡，胜方比分由 .mc-score.score-win 标红），
   这里只留一条兜底，避免旧缓存里的 final 卡整块变红。 */
#homePage .match-card.final .live-score { color: var(--text-3); }
#homePage .live-vs { color: var(--err); font-weight: 800; font-size: 13px; animation: pulse 1.2s infinite; }
#homePage .match-card.final .live-vs { color: var(--text-3); animation: none; }
#homePage .live-note { font-size: 10px; color: var(--text-3); }
#homePage .match-center { min-width: 46px; gap: 4px; }
#homePage .countdown-tag { margin-left: auto; }
/* 赛区角标：配色与小程序 regionTagClassOf 白名单一致（CN 红 / KR 蓝 / JP 粉 / PAC 青 / NA 紫 / EMEA 橙 / OWWC 金） */
#homePage .region-tag { padding: 1px 7px; border-radius: 6px; background: var(--bg-soft); color: var(--text-2); font-size: 10px; font-weight: 800; line-height: 1.6; }
#homePage .rt-cn { color: #dc2626; background: rgba(220,38,38,.11); }
#homePage .rt-kr { color: #2563eb; background: rgba(37,99,235,.11); }
#homePage .rt-jp { color: #db2777; background: rgba(219,39,119,.11); }
#homePage .rt-pac { color: #0d9488; background: rgba(13,148,136,.12); }
#homePage .rt-na { color: #7c3aed; background: rgba(124,58,237,.11); }
#homePage .rt-emea { color: #ea580c; background: rgba(249,115,22,.11); }
#homePage .rt-owwc { color: #ca8a04; background: rgba(202,138,4,.13); }
html[data-theme=dark] #homePage .rt-cn { color: #f87171; background: rgba(248,113,113,.16); }
html[data-theme=dark] #homePage .rt-kr { color: #60a5fa; background: rgba(96,165,250,.16); }
html[data-theme=dark] #homePage .rt-jp { color: #f472b6; background: rgba(244,114,182,.16); }
html[data-theme=dark] #homePage .rt-pac { color: #2dd4bf; background: rgba(45,212,191,.16); }
html[data-theme=dark] #homePage .rt-na { color: #a78bfa; background: rgba(167,139,250,.16); }
html[data-theme=dark] #homePage .rt-emea { color: #fb923c; background: rgba(251,146,60,.16); }
html[data-theme=dark] #homePage .rt-owwc { color: #facc15; background: rgba(250,204,21,.16); }
/* 分组竖条用对应赛区色 */
#homePage .home-up-bar.rt-cn { background: #dc2626; }
#homePage .home-up-bar.rt-kr { background: #2563eb; }
#homePage .home-up-bar.rt-jp { background: #db2777; }
#homePage .home-up-bar.rt-pac { background: #0d9488; }
#homePage .home-up-bar.rt-na { background: #7c3aed; }
#homePage .home-up-bar.rt-emea { background: #ea580c; }
#homePage .home-up-bar.rt-owwc { background: #ca8a04; }
/* 计分板卡（首页「即将开赛」与赛程页列表卡共用）：状态行 → 虚线 → 两队行 → 虚线 → 底栏。
   类名独立（mc-*），只在 .match-card.mc-up 内部命中，所以不再挂父容器作用域：
   首页、首页「展开剩余 N 场」弹窗、赛程页三处用的是同一套排版。 */
.match-card.mc-up {
  display: flex; flex-direction: column;
  margin: 0;
  padding: 12px 14px; border-radius: 18px;
  border: 1px solid var(--line); background: var(--bg-card);
  box-shadow: 0 4px 14px rgba(15, 23, 42, .04);
  transition: transform .15s, box-shadow .15s, border-color .15s;
  /* 参考稿的分隔线是虚线：比 --line 略重一点，浅色/暗色都不至于看不见 */
  --mc-dash: rgba(100, 116, 139, .38);
}
.match-card.mc-up:hover {
  transform: translateY(-2px); border-color: rgba(249, 115, 22, .35);
  box-shadow: 0 10px 24px rgba(15, 23, 42, .10);
}
html[data-theme=dark] .match-card.mc-up {
  --mc-dash: rgba(148, 163, 184, .34);
  box-shadow: 0 6px 20px rgba(0, 0, 0, .3);
}
.match-card.mc-up .mc-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-bottom: 9px; }
/* 「x小时后」比「x天后」多一个字，14px 下顶不住就折成两行、把卡片头撑高一倍。
   收一档字号并锁住不换行，日期一侧留出收缩余量（真的不够时省略号收尾，也不折行）。 */
.match-card.mc-up .mc-status { display: inline-flex; align-items: center; gap: 5px; flex-shrink: 0; white-space: nowrap; font-size: 13px; font-weight: 800; color: #f97316; letter-spacing: .2px; background: transparent; }
.match-card.mc-up .mc-dot { width: 7px; height: 7px; border-radius: 50%; background: #f97316; box-shadow: 0 0 0 3px rgba(249, 115, 22, .14); }
/* 倒计时三档（与小程序一致）：24 小时内红 → 1 天后橙 → 2 天后起蓝。
   旧的 .countdown-days 灰底是赛程页倒计时胶囊遗留，已收窄到 .countdown-tag，
   这里只按紧迫程度给文字和圆点上色，不再铺底色。 */
.match-card.mc-up .mc-status.countdown-minutes,
.match-card.mc-up .mc-status.countdown-hours { color: #ef4444; }
.match-card.mc-up .mc-status.countdown-minutes .mc-dot,
.match-card.mc-up .mc-status.countdown-hours .mc-dot { background: #ef4444; box-shadow: 0 0 0 3px rgba(239, 68, 68, .14); }
.match-card.mc-up .mc-status.countdown-tomorrow { color: #ea580c; }
.match-card.mc-up .mc-status.countdown-tomorrow .mc-dot { background: #ea580c; box-shadow: 0 0 0 3px rgba(234, 88, 12, .14); }
.match-card.mc-up .mc-status.countdown-days { color: #0284c7; }
.match-card.mc-up .mc-status.countdown-days .mc-dot { background: #0284c7; box-shadow: 0 0 0 3px rgba(2, 132, 199, .14); }
.match-card.mc-up .mc-kick { font-size: 11.5px; color: var(--text-3); font-variant-numeric: tabular-nums; white-space: nowrap; }
.match-card.mc-up .mc-teams { display: flex; flex-direction: column; gap: 7px; padding: 9px 0; border-top: 1px dashed var(--mc-dash); border-bottom: 1px dashed var(--mc-dash); }
.match-card.mc-up .mc-team-row { display: flex; align-items: center; gap: 9px; min-width: 0; }
.match-card.mc-up .mc-logo { width: 28px; height: 28px; border-radius: 8px; object-fit: contain; flex-shrink: 0; }
/* 队名不再一行截断：默认在单词/空格处整体换行（放不下的长单词才在词内断），最多两行。
   超长的再按 JS 打的 n-l1 / n-l2 降字号（见 core.js teamNameCls），两档都还放不下才省略。 */
.match-card.mc-up .mc-name { flex: 1; min-width: 0; font-size: 15.5px; font-weight: 750; letter-spacing: .1px; line-height: 1.25; white-space: normal; overflow-wrap: break-word; word-break: normal; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; }
.match-card.mc-up .mc-name.n-l1 { font-size: 13.5px; letter-spacing: 0; }
.match-card.mc-up .mc-name.n-l2 { font-size: 12px; letter-spacing: 0; }
.match-card.mc-up .mc-score { flex-shrink: 0; width: 16px; text-align: right; font-size: 15px; font-weight: 700; color: var(--text-3); font-variant-numeric: tabular-nums; }
/* 赛程页比首页多两档：已结束场次的胜负比分（胜方红色高亮、负方弱化，
   与中文「胜方标红」习惯一致）。比 .mc-score 多一个类，优先级更高。 */
.match-card.mc-up .mc-score.score-win { color: var(--err); }
.match-card.mc-up .mc-score.score-lose { color: var(--text-3); }
.match-card.mc-up .mc-foot { display: flex; align-items: center; gap: 8px; padding-top: 8px; }
.match-card.mc-up .mc-note { flex: 1; min-width: 0; font-size: 11px; color: var(--text-3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.match-card.mc-up .mc-foot > .replay-chip,
.match-card.mc-up .mc-foot > .sub-btn { flex-shrink: 0; }
/* 组头右侧的「查看更多 ›」：纯文字入口，跟赛区角标同一行贴右端 */
.home-expand { display: inline-flex; align-items: center; gap: 2px; flex-shrink: 0; margin: 0; padding: 0; border: 0; border-radius: 0; color: var(--brand); background: none; font-size: 12px; font-weight: 600; white-space: nowrap; }
.home-expand:hover { text-decoration: underline; }
.home-expand i { font-style: normal; font-size: 14px; line-height: 1; }
#homePage .home-up-head .region-tag { flex-shrink: 0; }

/* ── 首页桌面窄卡（≥1100 一组四列时单卡只有 210~240px）──────────────────
   15.5px 的字号是按小程序 340px 卡宽定的，Web 上必然截成「Cheeseb…」。
   这里收一档字号、把队名从 nowrap 改成最多两行，padding 与 logo 同步收紧。
   只作用于首页（#homePage）；赛程页与「展开剩余 N 场」弹窗卡宽足够，保持原排版。 */
@media (min-width: 1100px) {
  #homePage .match-card.mc-up { padding: 11px 12px; border-radius: 14px; }
  #homePage .match-card.mc-up .mc-head { padding-bottom: 7px; }
  #homePage .match-card.mc-up .mc-teams { gap: 6px; padding: 7px 0; }
  #homePage .match-card.mc-up .mc-team-row { gap: 7px; }
  #homePage .match-card.mc-up .mc-logo { width: 22px; height: 22px; border-radius: 6px; }
  #homePage .match-card.mc-up .mc-name {
    font-size: 13.5px; line-height: 1.28; letter-spacing: 0;
    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2;
    overflow: hidden;
  }
  #homePage .match-card.mc-up .mc-name.n-l1 { font-size: 12px; }
  #homePage .match-card.mc-up .mc-name.n-l2 { font-size: 11px; }
  #homePage .match-card.mc-up .mc-score { width: 14px; font-size: 13.5px; }
}

/* 赛事中心底部的「展开其余 N 个赛区（M 场）」：虚线按钮，展开后文案变成「收起其余赛区」。
   桌面首屏只铺前 2 个赛区，避免赛事中心占满右栏、把英雄日报压到页面最底部。 */
#homePage .home-up-more {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 4px;
  width: 100%;
  margin-top: 12px;
  padding: 10px 0;
  border: 1px dashed var(--line);
  border-radius: 12px;
  background: none;
  color: var(--brand);
  font-size: 12.5px;
  font-weight: 650;
  cursor: pointer;
}
#homePage .home-up-more:hover {
  border-color: rgba(249, 115, 22, .45);
  background: var(--bg-soft);
}
#homePage .home-up-more i { font-style: normal; font-size: 14px; line-height: 1; }
.home-tool-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 12px; }
.home-tool-card { min-width: 0; display: flex; align-items: center; gap: 12px; min-height: 102px; padding: 18px; border-radius: 14px; border: 1px solid var(--line); background: var(--bg-card); box-shadow: 0 3px 12px #0f172a0b; color: var(--text); transition: transform .15s,box-shadow .15s,border-color .15s; }
.home-tool-card:hover { transform: translateY(-2px); border-color: #f9731655; box-shadow: 0 6px 18px #0f172a12; }
.home-tool-card:active { transform: scale(.985); }
.home-tool-icon { width: 44px; height: 44px; object-fit: contain; flex-shrink: 0; }
.home-tool-copy { min-width: 0; flex: 1; }
.home-tool-name { display: flex; align-items: center; gap: 4px; font-weight: 750; font-size: 15px; line-height: 1.35; }
.home-tool-description { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; font-size: 11px; line-height: 1.6; margin-top: 5px; color: var(--text-2); }
.home-tool-badge { font-size: 8px; color: #fff; background: #f97316; padding: 2px 4px; border-radius: 4px; flex-shrink: 0; }
.home-tool-arrow { flex-shrink: 0; color: var(--text-3); font-size: 22px; font-weight: 300; }
.home-modal-heading { display: flex; align-items: center; gap: 12px; margin: 4px 24px 20px 0; }
.home-modal-heading h2 { font-size: 19px; font-weight: 800; }
.home-modal-heading .ui-icon { width: 30px; height: 30px; }
.home-announcement-icon { width: 30px; height: 26px; overflow: hidden; flex-shrink: 0; }
html[data-theme=dark] .home-tool-card { box-shadow: 0 4px 16px #0004; }
html[data-theme=dark] .home-status-row .banner-tag { color: #4ade80; }
html[data-theme=dark] .home-status-row .banner-tag.upcoming { color: #fb923c; }
html[data-theme=dark] .home-status-row .banner-tag.ended { color: var(--text-3); }
html[data-theme=dark] #compBanner .banner-tag { color: #f87171; }
html[data-theme=dark] #compBanner .banner-tag.upcoming { color: #fb923c; }
html[data-theme=dark] #patchBanner .banner-tag { color: #a78bfa; }
html[data-theme=dark] .home-status-row .banner-tag.live { color: #f87171; }
html[data-theme=dark] .home-live-rows .home-live-kicker { color: #f87171; }

/* 壳层断点与顶部导航由 shell.css 统一（1024px），此处不再另设。 */
@media(max-width:1023px) {
  .home-tool-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .home-tool-wide { grid-column: 1 / -1; }
}
@media(max-width:560px) {
  .home-section { margin-top: 24px; }
  .home-section-heading h2 { font-size: 17px; }
  .home-status-row { padding: 16px 13px; gap: 10px; }
  .home-status-copy strong { font-size: 12px; }
  .home-status-copy > span { font-size: 10px; }
  .home-status-row .banner-tag { padding: 4px 7px; font-size: 9px; }
  .home-tool-grid { gap: 9px; }
  .home-tool-card { gap: 8px; min-height: 94px; padding: 13px 10px; border-radius: 12px; }
  .home-tool-icon { width: 30px; height: 36px; }
  .home-tool-name { font-size: 13px; }
  .home-tool-description { font-size: 10px; line-height: 1.55; }
  .home-tool-arrow { font-size: 18px; }
  .home-tool-badge { display: none; }
  #homePage #upcomingList { gap: 12px; }
  #homePage #liveList { gap: 9px; }
  #homePage .home-up-grid { gap: 9px; }
  #homePage .match-card { padding: 11px 9px; }
  /* 计分板卡：首页恒定 2 列（对齐小程序），按半宽给紧凑版式，不吃上面的 9px 侧边距；
     赛程页在手机上仍是单列通栏，尺寸在文件末尾另给一档（body[data-page=schedule]）。 */
  .match-card.mc-up { padding: 10px 11px; border-radius: 14px; }
  .match-card.mc-up .mc-head { padding-bottom: 6px; }
  .match-card.mc-up .mc-status { font-size: 12px; gap: 5px; }
  .match-card.mc-up .mc-dot { width: 6px; height: 6px; box-shadow: 0 0 0 2.5px rgba(249, 115, 22, .14); }
  .match-card.mc-up .mc-kick { font-size: 10px; }
  .match-card.mc-up .mc-teams { gap: 6px; padding: 7px 0; }
  .match-card.mc-up .mc-team-row { gap: 7px; }
  .match-card.mc-up .mc-logo { width: 22px; height: 22px; border-radius: 6px; }
  .match-card.mc-up .mc-name { font-size: 12.5px; }
  /* 长队名降档要在每档基准字号下各写一份：n-l* 的选择器比基准规则高一级，
     不在这里压住就会在手机上把长名放大成 13.5px。 */
  .match-card.mc-up .mc-name.n-l1 { font-size: 11.5px; }
  .match-card.mc-up .mc-name.n-l2 { font-size: 10.5px; }
  .match-card.mc-up .mc-score { width: 12px; font-size: 12.5px; }
  .match-card.mc-up .mc-foot { padding-top: 7px; }
  .match-card.mc-up .mc-note { font-size: 10px; }
  #homePage .match-row { gap: 6px; }
  #homePage .match-team,#homePage .match-team.right { flex-direction: column; align-items: center; justify-content: flex-start; gap: 6px; text-align: center; }
  #homePage .match-team.right img { order: -1; }
  #homePage .team-name { font-size: 11px; }
  #homePage .team-logo { width: 26px; height: 26px; }
  #homePage .match-meta { flex-wrap: wrap; row-gap: 5px; font-size: 9px; }
  #homePage .countdown-tag { font-size: 9px; }
}
@media(prefers-reduced-motion:reduce) {
  .home-tool-card { transition: none; }
}

/* 窄屏（<1100）单列堆叠的顺序：赛事中心没有「正在进行」时（home.js 打上 home-hero-first），
   英雄日报提到赛事中心前面 —— 与小程序首页同一条规则。
   左栏（当前动态 + 置顶工具）不动，靠默认 order:0 排在两者之前。 */
@media (max-width: 1099px) {
  .home-main { display: flex; flex-direction: column; }
  .home-main.home-hero-first .home-bottom { order: 1; }
  .home-main.home-hero-first .home-col-right { order: 2; }
}

/* 桌面布局：英雄日报通栏置顶，下面才是「左栏 + 赛事中心」。
   ┌──────────────────────────────────────┐
   │ 英雄日报（通栏四列）                       │
   ├──────────┬───────────────────────────┤
   │ 当前动态   │ 赛事中心                     │
   │ 置顶工具   │                             │
   └──────────┴───────────────────────────┘
   桌面端用 grid 的 areas 把英雄日报提到第一行，DOM 顺序不动 ——
   窄屏（<1100）单列堆叠「动态 → 置顶 → 赛事 → 英雄」；
   没有「正在进行」时英雄日报与赛事中心换位（见上一条 home-hero-first）。 */
.home-col { min-width: 0; }
@media (min-width: 1100px) {
  body[data-page="home"] { --content-max: clamp(1200px, 90vw, 1520px); }
  .home-main {
    display: grid;
    grid-template-columns: clamp(280px, 23vw, 320px) minmax(0, 1fr);
    grid-template-areas:
      "status hero"
      "pinned match";
    /* 第一行按内容高度、第二行吃剩余：否则两栏高度不等时，
       多出来的高度会被均摊到两行，在上下两个区块之间顶出空隙。 */
    grid-template-rows: auto 1fr;
    align-items: start;
    gap: 26px 28px;
  }
  /* .home-col-left 用 display:contents 拆开，让「当前动态」「置顶工具」各自成为
     外层 grid 的 item，才能一上一下分到两行（宽栏放内容、窄栏放辅助信息）。 */
  .home-main > .home-col-left { display: contents; }
  .home-main > .home-col-right { grid-area: match; min-width: 0; }
  .home-main > .home-bottom { grid-area: hero; min-width: 0; }
  #statusSection { grid-area: status; margin-top: 0; }
  #pinnedSection { grid-area: pinned; margin-top: 0; }
  .home-col-right > .home-section:first-child { margin-top: 0; }
  .home-bottom > .home-section { margin-top: 0; }

  /* 赛事中心整块无数据（赛季间隙 / 后台关掉）：它那一格空出来，
     置顶工具顺势通栏，当前动态与英雄日报仍在第一行。 */
  #homePage:has(#matchSection[hidden]) .home-main {
    grid-template-areas:
      "status hero"
      "pinned pinned";
  }
  #homePage:has(#matchSection[hidden]) .home-col-right { display: none; }
  /* 置顶工具在通栏里标题行有 1200px 宽，「管理」别被 space-between 推到最右边 */
  #homePage:has(#matchSection[hidden]) #pinnedSection .home-section-heading {
    justify-content: flex-start;
    gap: 12px;
  }
  /* 两块辅助信息都关掉时只剩宽栏 */
  #homePage:has(#statusSection[hidden]):has(#pinnedSection[hidden]) .home-main {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "hero"
      "match";
  }
  /* PC 不做「收起赛事中心」：收起后右栏塌成一行标题，桌面屏幕高度也够用。移动端保留 */
  #matchToggle { display: none; }
  /* 置顶工具管理态：左栏临时加宽到 420，2 列各 205px 才放得下名称 + 描述 + ↑↓− */
  #homePage:has(.home-pinned-grid.home-pinned-edit):has(#matchSection:not([hidden])) .home-main {
    grid-template-columns: 420px minmax(0, 1fr);
  }
}

/* ── 赛程查询：列表卡换成首页「即将开赛」那套计分板卡 ─────────────────────────
   卡片本体直接用上面的 .match-card.mc-up，这里只补赛程页独有的三件事：
   1) 组内多列网格 —— 宽屏下一张卡不再被拉成 1280px 通栏；
   2) 状态色 —— 进行中 / 已结束 / 比分未出（首页只有倒计时三档）；
   3) 底栏右侧的回放角标与「开赛提醒」按钮。 */
@media (min-width: 1100px) {
  /* 与首页同一条宽屏口径：1280 起随视口放宽到 1680，多出来的宽度交给网格多排一列 */
  body[data-page="schedule"] { --content-max: clamp(1280px, 88vw, 1680px); }
}
/* ── 赛程查询：筛选条 ─────────────────────────────────────────────
   搜索 / 时间排序 + 赛区 / 分区 + 赛事维度合成同一张卡（原来是三张卡，搜索与排序
   还单独掉在列表下方）。赛区行所有视图共用，其余只在列表视图出现，
   显隐由 schedule.js 的 updateScheduleView() 控制。 */
body[data-page="schedule"] #filterBar { padding: 12px 14px; }
body[data-page="schedule"] #filterBar .filter-tools {
  display: flex; align-items: center; gap: 10px;
  padding-bottom: 10px; margin-bottom: 5px;
  border-bottom: 1px dashed rgba(100, 116, 139, .4);
}
body[data-page="schedule"] #filterBar .filter-tools .input {
  flex: 1 1 auto; min-width: 0; height: 34px; min-height: 34px; padding: 0 12px;
}
body[data-page="schedule"] #filterBar .filter-tools .chip {
  flex: 0 0 auto; height: 34px; padding: 0 14px; font-variant-numeric: tabular-nums;
}
/* 合并后最多 5 行，沿用原来的 6px 行距 + chip-bar 上下 10px 会留出过多空白 */
body[data-page="schedule"] #filterBar .filter-row { margin-bottom: 2px; }
body[data-page="schedule"] #filterBar .chip-bar { padding: 2px 0; }
body[data-page="schedule"] #filterBar #cnFilters .filter-row:last-child,
body[data-page="schedule"] #filterBar #intlFilters .filter-row:last-child { margin-bottom: 0; }

body[data-page="schedule"] .match-grid {
  display: grid; gap: 12px;
  /* auto-fill 而不是 auto-fit：某组只排到一两场时列宽也不变，不会被拉开顶满整行。
     300px 是队名（如 Solus Victorem）+ 队标 + 比分仍能一行放下的下限。 */
  grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
}
body[data-page="schedule"] .match-grid > .match-card { margin: 0; }
/* 组头：左起赛区色条 + 组名 + 右侧延伸线（与首页分组同一个语言）。
   原来的「线—居中文字—线」适合单列长列表，压在三列卡片上会显得浮在中间。 */
body[data-page="schedule"] .group-head { margin: 22px 0 10px; gap: 9px; color: var(--text); font-size: 13.5px; font-weight: 750; }
body[data-page="schedule"] .group-bar { width: 3px; height: 13px; border-radius: 3px; background: var(--brand); flex-shrink: 0; }
body[data-page="schedule"] .group-title { flex-shrink: 0; }
body[data-page="schedule"] .group-head .group-line { flex: 1; }
/* 状态行：进行中红点脉冲，即将开始橙（.mc-status 默认色），已结束 / 比分未出 / 未开始灰 */
body[data-page="schedule"] .match-card.mc-up .mc-status.is-live { color: #ef4444; }
body[data-page="schedule"] .match-card.mc-up .mc-status.is-live .mc-dot { background: #ef4444; box-shadow: 0 0 0 3px rgba(239,68,68,.16); animation: homeLivePulse 1.5s ease-in-out infinite; }
body[data-page="schedule"] .match-card.mc-up .mc-status.is-done,
body[data-page="schedule"] .match-card.mc-up .mc-status.is-pending,
body[data-page="schedule"] .match-card.mc-up .mc-status.is-stale { color: var(--text-3); }
body[data-page="schedule"] .match-card.mc-up .mc-status.is-done .mc-dot,
body[data-page="schedule"] .match-card.mc-up .mc-status.is-pending .mc-dot,
body[data-page="schedule"] .match-card.mc-up .mc-status.is-stale .mc-dot { background: var(--text-3); box-shadow: 0 0 0 3px rgba(148,163,184,.18); }
/* 正在打的那场描边带一点红，长列表里一眼能定位 */
body[data-page="schedule"] .match-card.mc-live { border-color: rgba(239,68,68,.42); }
/* 底栏高度不能被「开赛提醒」按钮撑开：按钮 23px 会把底栏从 25 抬到 31，同一个网格里就混着
   163 / 169 两种卡高，底栏一紧一松看着像间距错乱。按有按钮的那一档钉死，全组卡高统一。 */
body[data-page="schedule"] .match-card.mc-up .mc-foot { min-height: 31px; }
body[data-page="schedule"] .match-card.mc-up .mc-foot .sub-btn { padding: 3px 10px; font-size: 11px; }
/* 手机：赛程页是单列通栏，比首页的半宽卡宽一倍，队标与队名给回正常字号 */
@media (max-width: 560px) {
  body[data-page="schedule"] .match-grid { gap: 10px; }
  body[data-page="schedule"] .match-card.mc-up { padding: 12px 13px; }
  body[data-page="schedule"] .match-card.mc-up .mc-head { padding-bottom: 7px; }
  body[data-page="schedule"] .match-card.mc-up .mc-status { font-size: 12.5px; }
  body[data-page="schedule"] .match-card.mc-up .mc-kick { font-size: 11px; }
  body[data-page="schedule"] .match-card.mc-up .mc-teams { gap: 7px; padding: 8px 0; }
  body[data-page="schedule"] .match-card.mc-up .mc-logo { width: 26px; height: 26px; border-radius: 8px; }
  body[data-page="schedule"] .match-card.mc-up .mc-name { font-size: 14px; }
  body[data-page="schedule"] .match-card.mc-up .mc-name.n-l1 { font-size: 12.5px; }
  body[data-page="schedule"] .match-card.mc-up .mc-name.n-l2 { font-size: 11.5px; }
  body[data-page="schedule"] .match-card.mc-up .mc-score { width: 14px; font-size: 14px; }
  body[data-page="schedule"] .match-card.mc-up .mc-foot { min-height: 30px; }
  body[data-page="schedule"] .match-card.mc-up .mc-note { font-size: 10.5px; }
}