/* ============================================================
   越南篮球数据站 · 样式
   字体说明：越南语需要 Latin Extended 声调支持，
   Hiragino/PingFang 等中日字体缺字会掉字形，故用系统 UI 字体栈。
   ============================================================ */

:root{
  color-scheme:dark;
  --bg:#0a0b0f;
  --bg-1:#111319;
  --bg-2:#171a22;
  --bg-3:#1e222c;
  --line:#242936;
  --line-2:#2f3542;

  --t1:#f2f4f8;
  --t2:#98a1b3;
  /* --t3/--t4 为正文级次要文字，取值须对 --bg ~ --bg-3 四种背景都 ≥4.5:1（WCAG AA）。
     旧值 #646d80 / #414957 分别只有 3.35 / 2.05，比分中间的 "–" 分隔符会直接看不见。 */
  --t3:#8a93a6;
  --t4:#838c9c;

  --brand:#2d22e8;      /* 品牌蓝紫（logo 圆点） */
  --acc:#8f83ff;        /* 强调色：需当小字用（eyebrow/日期），提亮到 6.06:1 */
  --acc-dim:rgba(91,75,255,.14);
  --win:#00d47e;
  --loss:#ff4d5e;
  --gold:#f5c518;

  --font:-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',
         'Noto Sans',Arial,sans-serif;
  --mono:'SF Mono','JetBrains Mono',ui-monospace,Menlo,Consolas,monospace;

  --w:1120px;
  --r:14px;
}

*{margin:0;padding:0;box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;
  /* WCAG 2.4.11 焦点不被遮挡：顶栏 sticky 高 58px，不留出滚动内边距的话，
     Tab 到的目标会被它整个盖住 —— 键盘用户看不见自己在哪。70px 留一点余量。 */
  scroll-padding-top:70px;}
body{
  font-family:var(--font);
  background:var(--bg);
  color:var(--t1);
  line-height:1.6;
  font-size:15px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  /* 用 clip 而不是 hidden。两者都裁掉横向溢出，但 **hidden 会创建滚动容器，
     从而让后代的 position:sticky 全部失效**（首列固定就是这么被杀掉的）；
     clip 不创建滚动容器，sticky 照常工作。
     旧浏览器不认 clip 会整条忽略，退化成"不裁剪" —— 那正好也暴露了
     被 hidden 藏起来的真实溢出，比继续藏着好。 */
  overflow-x:clip;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
/* 正文区域内的链接必须自身可辨识，不能只靠颜色（WCAG 1.4.1）。
   导航、卡片这类整块可点的元素有自己的视觉边界，单独豁免。 */
main a:not(.tcard):not(.nm),
main .nm{text-decoration:underline;text-decoration-color:var(--line-2);
         text-underline-offset:3px;text-decoration-thickness:1px;}
main a:hover{text-decoration-color:var(--acc);}
:focus-visible{outline:2px solid var(--acc);outline-offset:2px;border-radius:3px;}

.wrap{max-width:var(--w);margin:0 auto;padding:0 18px;}

/* 只给屏幕阅读器的文本（表格 caption 等），视觉上不占位 */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;}

/* 表格里的行首单元格是 th，但要保持和 td 一样的排版 */
tbody th{font-weight:inherit;text-align:left;}

/* ── 顶栏 ───────────────────────────────────────────── */
.nav{
  position:sticky;top:0;z-index:50;
  background:rgba(10,11,15,.82);
  backdrop-filter:saturate(180%) blur(14px);
  -webkit-backdrop-filter:saturate(180%) blur(14px);
  border-bottom:1px solid var(--line);
}
.nav .inner{
  max-width:var(--w);margin:0 auto;padding:0 18px;
  height:58px;display:flex;align-items:center;gap:26px;
}
/* Logo：CSS 复刻，矢量清晰、零加载、自动适配深浅底 */
.logo{
  display:inline-flex;align-items:baseline;flex-shrink:0;
  font-weight:900;font-size:1.42rem;letter-spacing:-.045em;
  color:#fff;line-height:1;
}
.logo .dot{
  width:.30em;height:.30em;border-radius:50%;
  background:var(--brand);margin-left:.055em;flex-shrink:0;
  align-self:flex-end;margin-bottom:.02em;
  box-shadow:0 0 14px rgba(45,34,232,.55);
}

/*  导航可横滑，但**滚动条是藏起来的**，所以必须给一个「右边还有」的
 *  视觉提示，否则手机上后面几项等于不存在（2026-09-19 实测：
 *  tr 站 `Results` 被裁成 `Resul`、`Teams` 和交锋页完全看不见；
 *  sg 屏外 3 项、th 屏外 4 项）。
 *
 *  做法是给 ul 自身加一层右侧渐隐蒙版：`mask-image` 只影响绘制，
 *  不占布局、不拦点击，桌面上内容不溢出时视觉无变化。
 *  ⚠ 不要改成在 .nav .inner 上放伪元素 —— 那会盖住国家切换器，
 *    而切换器正好贴在 ul 右边。 */
.nav ul{display:flex;gap:22px;list-style:none;overflow-x:auto;
  scrollbar-width:none;-ms-overflow-style:none;
  /* 渐隐改成**全宽度生效 + 右侧留 20px 内边距**（2026-09-25 UI 巡检）。
   * 原来只在 ≤640px 加蒙版，但 768 平板上 12 个站的导航同样放不下
   * （br/sg 屏外 280px、usl 210px、th 的「สถิติ…」被硬切），没有任何提示。
   * 当初不敢全宽度加，是因为不溢出时最后一项贴着 ul 右缘、会被蒙版吃掉尾字。
   * 现在 ul 自带 20px 右内边距、渐隐区正好等于这 20px：
   *   不溢出 → 渐隐只落在空白内边距上，文字零影响（5 个宽度逐站实测）；
   *   溢出   → 可视区最右 20px 的文字被淡化，就是「右边还有」的提示；
   *   滚到底 → 最后一项停在内边距左侧，也不被淡化。 */
  padding-right:20px;
  -webkit-mask-image:linear-gradient(to right,#000 calc(100% - 20px),transparent);
  mask-image:linear-gradient(to right,#000 calc(100% - 20px),transparent);}
.nav ul::-webkit-scrollbar{display:none;}
.nav ul a{
  font-size:.88rem;color:var(--t2);white-space:nowrap;
  padding:6px 0;border-bottom:2px solid transparent;
  transition:color .16s,border-color .16s;
}
.nav ul a:hover{color:var(--t1);}

/* 国家切换器：原生 details，零 JS，键盘可达 */
.ctry{position:relative;margin-left:auto;flex-shrink:0;}
.ctry summary{
  list-style:none;cursor:pointer;font-size:.84rem;color:var(--t2);
  padding:5px 10px;border:1px solid var(--line-2);border-radius:8px;
  display:flex;align-items:center;gap:6px;white-space:nowrap;
}
.ctry summary::-webkit-details-marker{display:none;}
.ctry summary::after{content:"";width:5px;height:5px;flex-shrink:0;
  border-right:1.5px solid var(--t3);border-bottom:1.5px solid var(--t3);
  transform:rotate(45deg) translateY(-2px);}
.ctry summary:hover{color:var(--t1);border-color:var(--t3);}
.ctry[open] summary{color:var(--t1);border-color:var(--acc);}
.ctry ul{
  position:absolute;right:0;top:calc(100% + 6px);z-index:60;
  background:var(--bg-2);border:1px solid var(--line-2);border-radius:10px;
  padding:6px;min-width:170px;list-style:none;display:block;
  box-shadow:0 12px 32px rgba(0,0,0,.5);
  max-height:min(60vh,340px);overflow-y:auto;
}
.ctry ul li{display:block;}
.ctry ul a{
  display:block;padding:8px 12px;border-radius:6px;
  font-size:.86rem;color:var(--t2);white-space:nowrap;text-decoration:none;
}
.ctry ul a:hover{background:var(--bg-3);color:var(--t1);}
/* 本地文字队名（泰文/越南文），排在 h1 下方 */
.hero .loc-name{
  /* 上边距原来是 -2px：泰文/中日文 h1 的字形下沿和这一行的上沿贴死（th/hk/tw/jp 的
     球队页、单场页四个宽度全中）。给回正值。 */
  font-size:1.05rem;color:var(--t2);margin:4px 0 8px;font-weight:600;
}
/* 未上线的站：同样列出来，但不给链接 —— 域名还不存在，点了就是 404 */
.ctry ul .soon{
  display:flex;align-items:baseline;justify-content:space-between;gap:10px;
  padding:8px 12px;font-size:.86rem;color:var(--t3);white-space:nowrap;cursor:default;
}
.ctry ul .soon em{font-style:normal;font-size:.72rem;opacity:.65;}
@media(max-width:640px){
  .ctry summary span{max-width:88px;overflow:hidden;text-overflow:ellipsis;}
  /*  ⚠ 渐隐**只在窄屏加**（2026-09-19）。第一版写在 `.nav ul` 上无条件
   *  生效，结果桌面端不溢出的站也被吃掉尾字 —— tr 的
   *  `Head-to-head records` 最后那个 s 被淡化，而 JS 实测
   *  scrollWidth == clientWidth，根本没溢出。
   *  当时注释里写「没溢出时视觉无区别」是错的：内容正好贴着右缘时，
   *  蒙版照样把它淡掉。纯 CSS 没法判「是否溢出」，所以退一步 ——
   *  只在窄屏给提示，那里 11 个站全都真的放不下。
   *  ⚠ br 桌面端也溢出（它挂了两个第二赛事、导航 7 项），
   *    那种情况下没有提示，是这个折中的已知代价。 */
  /* 蒙版已挪到上面的 .nav ul 通用规则（带 20px 右内边距），这里不再单独加 */
}
.nav ul a.on{color:var(--t1);border-bottom-color:var(--acc);font-weight:600;}

/* ── Hero ──────────────────────────────────────────── */
.hero{
  padding:56px 0 44px;
  border-bottom:1px solid var(--line);
  background:
    radial-gradient(900px 380px at 12% -18%,rgba(255,122,26,.13),transparent 62%),
    radial-gradient(700px 340px at 88% -8%,rgba(0,212,126,.07),transparent 60%);
}
.hero .eyebrow{
  display:inline-flex;align-items:center;gap:7px;
  font-family:var(--mono);font-size:.72rem;letter-spacing:.08em;
  color:var(--acc);background:var(--acc-dim);
  padding:5px 11px;border-radius:20px;margin-bottom:16px;
  text-transform:uppercase;
}
.hero .eyebrow .dot{width:5px;height:5px;border-radius:50%;
  background:var(--acc);animation:pulse 2s ease-in-out infinite;}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:.3;}}
.hero h1{
  font-size:clamp(1.85rem,5.4vw,3.1rem);
  font-weight:800;line-height:1.14;letter-spacing:-.03em;
  /* 15ch 是按拉丁字母定的，中日韩全角字符下实际只有 8.34ch ——
     tw 的「台灣棒球，數據齊全」被切成两行、最后一个「全」字单独掉下去，
     右边还空着 1000px。用 min() 让它在窄屏仍然收窄、宽屏放开到能排下。 */
  max-width:min(26ch, 100%);
}
/* 中日韩全角字更宽，同样的 ch 数占的物理宽度差一倍，单独放宽 */
:root:lang(zh-Hant) .hero h1,:root:lang(zh-Hans) .hero h1{max-width:min(18ch,100%);}
.hero h1 em{font-style:normal;color:var(--acc);}
.hero p{
  color:var(--t2);font-size:clamp(.92rem,2.4vw,1.06rem);
  margin-top:15px;max-width:52ch;
}

/* ── 区块 ───────────────────────────────────────────── */
.sec{padding:48px 0;border-bottom:1px solid var(--line);}
.sec:last-of-type{border-bottom:0;}
.sec-hd{display:flex;align-items:flex-end;justify-content:space-between;
  gap:16px;margin-bottom:22px;flex-wrap:wrap;}
.sec-hd h2{font-size:clamp(1.15rem,3vw,1.5rem);font-weight:700;
  letter-spacing:-.02em;}
.sec-hd .sub{color:var(--t3);font-size:.83rem;margin-top:3px;}
.sec-hd .upd{font-family:var(--mono);font-size:.72rem;color:var(--t4);}

/* 分区联赛的组标题（NPB 的セ・パ 两个联盟各一张順位表）。
   ⚠ 必须是可见标题而不是只给 <caption> —— caption 是 sr-only 的，
   视觉上两张表会直接连在一起，读者分不清哪张是哪个联盟。 */
.grp-ttl{font-size:clamp(1rem,2.6vw,1.2rem);font-weight:700;
  margin:26px 0 10px;padding-left:10px;
  border-left:3px solid var(--acc);line-height:1.3;}
.grp-ttl:first-of-type{margin-top:4px;}

/* ── 表格 ───────────────────────────────────────────── */
/* 表格横向滚动 + **可供性**。容器本来就能滚，问题是没人知道它能滚：
   移动端的 overlay 滚动条静止时不可见，裁切边缘又正好落在列边界上，
   连"右边还有内容"的暗示都没有。实测 ind@390 只露出 56% 的宽度，
   看不见的正好是 D L GF GA GD 和最关键的 Pts —— 积分榜看不到积分。
   两道保险：右侧渐隐阴影（纯背景实现，随滚动自动消隐），
   以及首列 sticky（队名列始终可见，滚到哪都知道在看谁）。 */
.tbl-wrap{
  overflow-x:auto;-webkit-overflow-scrolling:touch;
  /* 同上，横向版：sticky 首列（名次+队名）约 150px 宽，横滚后会盖住
     刚获得焦点的链接。实测横滚 200px 时有 2 个链接被完全遮住。 */
  scroll-padding-left:150px;
  /* 配合 build.py 给每个 .tbl-wrap 加的 tabindex="0"（axe
     scrollable-region-focusable，serious）：可滚动区域必须能被键盘聚焦，
     否则纯键盘用户根本滚不动宽表格。
     **只加 tabindex，不加 role="region"** —— role 会要求每处都有独立的
     可访问名，9 个表格各编一个名字反而是噪音；表格自己的 <caption> 已经说明了内容。 */
  border:1px solid var(--line);border-radius:var(--r);
  background:var(--bg-1);
  /* local 的两层是"到底了就收起"的遮罩，scroll 的两层是常驻阴影。
     顺序不能反：遮罩必须压在阴影上面。 */
  background-image:
    linear-gradient(to right, var(--bg-1) 40%, transparent),
    linear-gradient(to left, var(--bg-1) 40%, transparent),
    linear-gradient(to right, rgba(0,0,0,.45), transparent),
    linear-gradient(to left, rgba(0,0,0,.45), transparent);
  background-position:left center, right center, left center, right center;
  background-repeat:no-repeat;
  background-size:26px 100%, 26px 100%, 14px 100%, 14px 100%;
  background-attachment:local, local, scroll, scroll;
}
/* 首列固定。**要给背景色**，否则滚动时下层单元格会透上来。
   ⚠ 祖先上任何 overflow:hidden 都会让 sticky 失效（body 上就有一条），
   所以这只是增强：不生效时退回上面的阴影提示，不会更糟。 */
.tbl-wrap th[scope="row"]{
  position:sticky;left:0;z-index:2;
  /* 跟着行走的背景。sticky 单元格必须自带底色（否则下层内容会透上来），
     但写死 var(--bg-1) 就不跟 tr:hover 变色了 —— PC 上划过一行只有右半边
     变亮，左半边（名次、队名）不变，中间凭空出现一条垂直撕裂线。
     用变量兜住，hover 时由 tr 改写它。 */
  background:var(--row-bg, var(--bg-1));
  /* 队名格里可能有第二行（本地文字名或城市），不给对齐方式的话
     sticky 单元格从顶部排、数字单元格 vertical-align:middle 居中，
     两者基线差半行 —— 复测里那个「队名跑到分隔线之上」就是这么来的。 */
  vertical-align:middle;
}
@media(max-width:560px){
  /* **减列**：手机上只留 # 队名 场次 和排名依据（积分/胜率），
     其余列（W D L GF GA GD 等）打了 opt 的一律隐藏。
     这些数据在宽屏和球队页都还在 —— 不是删数据，是分场景显示。
     靠横滑救不回来：743px 的表格塞进 352px 容器，排名依据永远在屏外。 */
  table .opt{display:none;}
  /* ⚠ 原来这里写的是 `table{min-width:0}`，**从来没生效过**（2026-09-25 UI 巡检）：
     下面那条通用的 `table{…min-width:520px}` 写在本媒体查询之后、特异度相同，后者赢。
     结果二十个站的积分榜在手机上都是 520px 宽，减列减完只剩 # 队名 场次 积分，
     场次和积分却仍被推到屏外 —— 手机上的积分榜看不到积分。
     两列的表（交锋索引「对阵 | 交手场次」、杯赛「阶段 | 场次」）同样第二列永远在屏外。
     改成带类型的选择器提高特异度，且只放开两类表：有 .opt 减列的、只有两列的；
     日期/主队/比分/客队/场馆这类多列表仍保持 520px 横滑。
     :has() 不支持的旧浏览器整条忽略，退回原来的横滑，不会更糟。 */
  table:has(.opt),table:not(:has(tr > :nth-child(3))){min-width:0;}
  /* 窄屏才值得牺牲宽度换固定列；宽屏整张表都看得见，固定反而多余 */
  /* min-width 是 2026-09-25 加的：队名改成可折两行后，赛果表这种仍保持 520px 横滑的表
     会按最小内容宽度把队名列压到约 60px（每行只剩三四个字母）。给个下限。 */
  .tbl-wrap th[scope="row"]{max-width:132px;min-width:118px;}
  /* 省略号要生效，**约束必须加在 .nm 的直接父级上**。原来只给 th 设了
     max-width，而 .nm 的 max-width:100% 参照的是中间那个没有宽度约束的
     <span>，于是 ellipsis 永远不触发、名字直接冲出单元格
     （sg 的 Geylang International FC 压过数字列 73px）。 */
  .tbl-wrap th[scope="row"] .team{min-width:0;}
  /* ⚠ 必须排除队徽（2026-09-19 修）。`.team` 的直接子 span 有**两个** ——
     队徽 `span.bdg.bdg-30` 和队名容器。原来这条选择器两个都选中，
     `flex:1` 覆盖掉 `.bdg-30{width:30px}`，队徽被撑到 115–135px：
     队名列只剩约 119px 几乎全被省略号砍掉（`Johor Darul Ta'...`），
     再叠加下面的 `align-items:flex-start`，队徽顶对齐而相邻 `#` 列胶囊
     垂直居中 → 名次数字和队名差半行、城市名掉到行底空一大块。
     **这就是用户反馈的「文字乱飞」，十个站的积分榜全中**，
     且只在 ≤560px 出现（768/1440 正常），所以桌面端复查发现不了。 */
  .tbl-wrap th[scope="row"] .team > span:not(.bdg){min-width:0;flex:1;overflow:hidden;}
  .tbl-wrap th[scope="row"] .team > span.bdg{flex:0 0 auto;}
  /* 省略号改成**最多两行**（2026-09-25）：单行省略把「Thành Phố Đồng Nai」
     「Singha Chiangrai United」砍成「Thành Phố …」「Singha Ch…」，
     同一张表里好几个队只剩前半截，分不清是谁。两行放得下绝大多数队名。 */
  .tbl-wrap th[scope="row"] .nm{
    display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;
    max-width:100%;overflow:hidden;white-space:normal;overflow-wrap:anywhere;
    line-height:1.3;
  }
  /* 队名改成块级后，紧跟的 <br> 会自己占一整个空行，城市名于是掉到行底、
     中间空出一大块（积分榜每一行都是）。城市名自己成块，<br> 不要了。 */
  .tbl-wrap th[scope="row"] .team br{display:none;}
  .tbl-wrap th[scope="row"] .team .ct{display:block;line-height:1.35;}
  /* 徽章和队名顶对齐：右侧是多行文字块时，居中会让徽章孤零零悬在中间 */
  .tbl-wrap th[scope="row"] .team{align-items:flex-start;}
}
table{width:100%;border-collapse:collapse;font-size:.88rem;min-width:520px;}
/* 行分隔线要连过首列。原来只有 tbody td 有 border-bottom，
   行首的 <th scope="row"> 没有，于是每条分隔线都在队名列位置断开一大段
   （br 积分榜 PC 上缺口约 404px），9 站所有表格通病。 */
tbody th[scope="row"]{border-bottom:1px solid var(--line);}
/* 行首单元格是 th 时没有任何内边距（td 才有 14px），文字直接贴着表格左边框：
   交锋索引、杯赛「阶段」表、说明表、besta 分区标题行都是这样（2026-09-25）。
   只补**位于行首**的 th —— 积分榜里队名 th 前面还有名次列，那里不需要。 */
tbody tr > th:first-child{padding-left:14px;padding-right:14px;}
thead th{
  text-align:left;font-weight:500;font-size:.73rem;
  letter-spacing:.05em;text-transform:uppercase;
  color:var(--t3);padding:13px 14px;
  background:var(--bg-2);border-bottom:1px solid var(--line);
  /* 表头 sticky 必须比数据行首列高一层：首列是 z-index 2，表头不给值就是
     auto（等同 0），纵向滚动时数据行的首列会盖住表头首列。 */
  white-space:nowrap;position:sticky;top:0;z-index:3;
}
/* 表头左上角那一格同时被横竖两个方向固定，要压过其余表头 */
.tbl-wrap thead th:first-child{left:0;z-index:4;}
tbody td{padding:13px 14px;border-bottom:1px solid var(--line);
  color:var(--t2);vertical-align:middle;}
tbody tr:last-child td{border-bottom:0;}
tbody tr{transition:background .14s;}
/* hover 时把变量一起改掉，sticky 首列才会跟着亮（见上面 th[scope=row]） */
tbody tr:hover{background:var(--bg-2);--row-bg:var(--bg-2);}
td.num,th.num{text-align:right;font-family:var(--mono);
  font-variant-numeric:tabular-nums;}
td.c,th.c{text-align:center;}

.rank{
  display:inline-flex;align-items:center;justify-content:center;
  width:24px;height:24px;border-radius:7px;
  font-family:var(--mono);font-size:.78rem;font-weight:600;
  background:var(--bg-3);color:var(--t2);
}
.rank.top{background:var(--acc-dim);color:var(--acc);}

.team{display:flex;align-items:center;gap:11px;}
.team .badge{
  width:30px;height:30px;border-radius:9px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:.7rem;font-weight:700;
  color:#fff;letter-spacing:-.02em;
}
.team .nm{padding:3px 0;display:inline-block;color:var(--t1);font-weight:600;white-space:nowrap;}
.team .ct{color:var(--t3);font-size:.76rem;}

.pct{font-family:var(--mono);font-variant-numeric:tabular-nums;}
.w{color:var(--win);} .l{color:var(--loss);} .d{color:var(--t2);}
/* 纪律扣分的上标（积分榜 pts 列，如 28⁻³）。用 loss 色是因为读者扫一眼
   要立刻明白这是减分，不是加分；不写 vertical-align:super 而是自己抬，
   避免 sup 默认样式把整行行高撑开、让积分榜的行错位。 */
.ded{color:var(--loss);font-size:.68rem;font-weight:600;margin-left:2px;
     vertical-align:baseline;position:relative;top:-.45em;line-height:0;}

/* ── 赛程卡 ─────────────────────────────────────────── */
/* 同一天的多场比赛现在共用一个日期表头（见 build.py 的 fixture_cards），
   没有表头的那些块要贴紧上一块，否则一天几场会被 24px 间距拆散。 */
.fx-day{margin-bottom:24px;}
/* 用类名而不是 :has()。:has() 要 Safari 15.4 / Chrome 105（2022-08），
   目标市场（印度、印尼、巴西）的存量安卓上整条规则会失效，
   同一天的多场比赛又会被 24px 间距重新拆散，观感退回改之前。 */
.fx-day.cont{margin-top:-16px;}
.fx-day .dt{
  font-family:var(--mono);font-size:.76rem;color:var(--acc);
  letter-spacing:.06em;margin-bottom:10px;
  display:flex;align-items:center;gap:10px;
}
.fx-day .dt:after{content:'';flex:1;height:1px;background:var(--line);}
.fx{
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;
  gap:14px;padding:15px 18px;
  background:var(--bg-1);border:1px solid var(--line);
  border-radius:var(--r);margin-bottom:9px;
  transition:border-color .16s,transform .16s;
}
.fx:hover{border-color:var(--line-2);}
.fx .side{display:flex;align-items:center;gap:10px;min-width:0;}
/* 单场页顶部比分卡行内写的是 padding:22px 0，水平内边距为 0，
   两边队徽直接压在卡片边框上（二十个站全中，2026-09-25）。行内样式只能 !important 补。 */
.fx[style*="padding:22px 0"]{padding-left:18px !important;padding-right:18px !important;}
.fx .side.away{flex-direction:row-reverse;text-align:right;}
.fx .side .nm{font-weight:600;font-size:.9rem;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;}
.fx .mid{text-align:center;flex-shrink:0;}
.fx .mid .time{font-family:var(--mono);font-size:.94rem;font-weight:600;
  color:var(--t1);}
.fx .mid .score{font-family:var(--mono);font-size:1.15rem;font-weight:700;
  letter-spacing:-.02em;}
.fx .mid .vs{font-size:.68rem;color:var(--t4);letter-spacing:.1em;
  margin-top:2px;text-transform:uppercase;}
.fx .venue{grid-column:1/-1;font-size:.75rem;color:var(--t4);
  text-align:center;padding-top:9px;margin-top:3px;
  border-top:1px solid var(--line);}
/* 赛程卡里的赛前推算：主 / 平 / 客 三个百分比。
   跨整行（和 .venue 一样 1/-1），三等分对齐到卡片的三列 ——
   左右两个数字正好落在主客队名下方，中间是平局，位置本身就是标签。
   **三项同字号同颜色**，最高的那个不加粗不变色：这是数据参考，
   视觉上分出主次就成了在暗示押哪边。平局用 --t3 区分是因为它
   在语义上确实是「另一类」，不是因为它更次要。 */
.fx .fx-pj{grid-column:1/-1;display:grid;grid-template-columns:1fr auto 1fr;
  gap:14px;align-items:center;margin-top:2px;
  font-family:var(--mono);font-size:.82rem;color:var(--t2);}
.fx .fx-pj span{text-align:center;}
.fx .fx-pj i{font-style:normal;color:var(--t3);text-align:center;
  min-width:42px;}

/* ── 球队网格 ───────────────────────────────────────── */
.grid{display:grid;gap:12px;
  grid-template-columns:repeat(auto-fill,minmax(215px,1fr));}
.tcard{
  background:var(--bg-1);border:1px solid var(--line);
  border-radius:var(--r);padding:18px;
  transition:border-color .16s,transform .16s;
  position:relative;overflow:hidden;
}
.tcard:before{
  content:'';position:absolute;left:0;top:0;bottom:0;width:3px;
  background:var(--bar,var(--acc));
}
.tcard:hover{border-color:var(--line-2);transform:translateY(-2px);}
.tcard .badge{
  width:42px;height:42px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  font-family:var(--mono);font-size:.85rem;font-weight:700;
  /* 不设 color：字色由生成器按底色亮度算好写在行内（badge_ink）。
     这里硬编码 color:#fff 会让浅色队徽变成白底白字 —— 行内虽然优先级更高，
     但曾经有一处把整套规则连同 color:#fff 抄进行内，直接把它盖掉了。 */
  margin-bottom:13px;
}
.tcard h3{font-size:.98rem;font-weight:700;letter-spacing:-.01em;}
.tcard .meta{color:var(--t3);font-size:.79rem;margin-top:4px;}

/* ── 页脚 ───────────────────────────────────────────── */
.foot{padding:36px 0 46px;color:var(--t4);font-size:.79rem;
  border-top:1px solid var(--line);}
.foot p+p{margin-top:7px;}
.foot a{color:var(--t3);border-bottom:1px solid var(--line-2);}

/* ── 响应式 ─────────────────────────────────────────── */
@media (max-width:640px){
  body{font-size:14px;}
  .nav .inner{height:52px;gap:16px;}
  .nav ul{gap:16px;}
  .hero{padding:38px 0 32px;}
  .sec{padding:34px 0;}
  .fx{padding:13px 14px;gap:9px;}
  /* 窄屏队名允许两行（2026-09-25）。单行省略在 360 宽只剩 79px，
     「Công an TP. H…」「Geylang I…」「Gaziant…」—— 单场页顶部比分卡都认不出是谁。
     overflow-wrap:anywhere 兜住单个超长词（International、Internacional）。 */
  .fx .side .nm{font-size:.84rem;white-space:normal;overflow-wrap:anywhere;
    display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-height:1.3;}
  .fx[style*="padding:22px 0"]{padding-left:14px !important;padding-right:14px !important;}
  /* 单场页比分卡的比分是 1.9rem，两边只剩约 50px，两行也塞不下「Gaziantep」这种单词
     （会被拦腰折成「Gaziant / ep」）。窄屏把队徽放到队名上方，队名拿到整列宽度。 */
  .fx[style*="padding:22px 0"] .side,
  .fx[style*="padding:22px 0"] .side.away{flex-direction:column;text-align:center;gap:6px;}
  /* 球队页「本季战绩」卡里的大数字是行内 1.5rem，360 宽两列时「18W 5D 1L」
     「11W 10D 9L」放不下、最后一段掉到第二行。行内样式只能用 !important 压。 */
  .tcard > div[style*="font-size:1.5rem"]{font-size:1.2rem !important;white-space:nowrap;}
  .grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;}
  .tcard{padding:14px;}
  .tcard .badge{width:36px;height:36px;}
}

/* ── 数据洞察卡片 ───────────────────────────────────── */
/* 复用与 .grid 相同的栅格思路，卡片内是「标签 / 大数字 / 说明」三段。
   大数字用等宽字体，和站内其他数字（比分、时间）视觉统一。 */
/* 数据洞察区块开头的一句话事实陈述（2026-09-11）。
   和 .ins-card 里的碎片说的是同一组数字，只是说成了一句话 ——
   卡片给人看，句子给摘取器看（搜索结果摘要、AI 回答引用拿走的都是句子）。
   比正文略淡一点点，但**不能用 --t3**：那是 .sub 的颜色，
   两行挨着同色会读成同一句的延续，而它们是口径说明 + 事实，两回事。 */
.ins-lead{color:var(--t2);font-size:.94rem;line-height:1.7;
  margin:0 0 14px;max-width:68ch;}
.ins-grid{display:grid;gap:12px;
  grid-template-columns:repeat(auto-fill,minmax(210px,1fr));}
.ins-card{background:var(--bg-1);border:1px solid var(--line);
  border-radius:var(--r);padding:16px 18px;}
.ins-k{color:var(--t3);font-size:.78rem;letter-spacing:.02em;}
.ins-v{font-family:var(--mono);font-size:1.6rem;font-weight:700;
  line-height:1.15;margin:6px 0 4px;color:var(--t1);}
.ins-d{color:var(--t3);font-size:.8rem;line-height:1.45;}

/* ── 问答式卡片（联赛之最，2026-09-20）─────────────────
   复用 .ins-card 的外框，但里面是「问句 / 答句」两段而不是
   「标签 / 大数字 / 说明」三段 —— 这里没有大数字可放，答案本身
   就是一个队名加一串战绩。问句用 h3 是有意的：它是页面大纲里
   真实的一级小节，不只是个标签，所以要重置浏览器默认的 h3 边距。 */
.qa-q{color:var(--t1);font-size:.95rem;font-weight:600;
  line-height:1.4;margin:0 0 7px;}
.qa-a{color:var(--t2);font-size:.86rem;line-height:1.55;margin:0;}

@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important;}
}

/* ── skip link ─────────────────────────────────────────
   平时用 sr-only 藏起来，键盘 Tab 到时才显形。位置固定在左上，
   不能只靠 sr-only 的 clip —— 那样获得焦点也看不见，等于没有。 */
.skip:focus{
  position:fixed;left:12px;top:12px;z-index:200;
  width:auto;height:auto;clip:auto;clip-path:none;overflow:visible;
  padding:10px 16px;border-radius:10px;
  /* 深色字而不是 #fff：白字压在 --acc(#8f83ff) 上只有 3.06:1，
     达不到 WCAG AA 的 4.5:1（15px/600 不算大字号，没有 3:1 豁免）。
     换成近黑是 6.86:1。这是全站唯一一处对比度不达标的地方。 */
  background:var(--acc);color:#0a0b0f;font-weight:600;
}

/* ── 打印 ──────────────────────────────────────────────
   默认深色背景直接打出来是满版纯黑，而积分榜还被 overflow 裁掉关键列。
   打印时翻成白底黑字、放开所有横向滚动容器、去掉导航页脚。 */
@media print{
  :root{--bg:#fff;--bg-1:#fff;--bg-2:#fff;--t1:#000;--t2:#222;--t3:#444;
        --t4:#666;--line:#bbb;--acc:#000;}
  body{background:#fff;color:#000;}
  .site-hd,.nav,.foot,.ctry,.skip{display:none !important;}
  /* 裁切在纸上没有意义，全部展开 */
  .tbl-wrap{overflow:visible !important;background-image:none !important;}
  table{min-width:0 !important;}
  table .opt{display:table-cell !important;}
  .tbl-wrap th[scope="row"]{position:static !important;}
  thead th{position:static !important;}
  .card,.tcard,.fx,.fx-day{break-inside:avoid;}
  a{text-decoration:underline;}
}

/* ── 赛前数据推算 ───────────────────────────────────── */
/* 三路概率条。刻意**不做成排行榜样式**、不给最高的那项加高亮或奖杯 ——
   这是数据参考不是推荐，视觉上一旦分出「主次」就变成了在暗示押哪边。
   三项等宽等重，读者自己看数字。 */
.pjs{display:grid;gap:12px;
  grid-template-columns:repeat(auto-fit,minmax(160px,1fr));}
.pj{background:var(--bg-1);border:1px solid var(--line);
  border-radius:var(--r);padding:15px 16px;}
.pj-n{font-family:var(--mono);font-size:1.6rem;font-weight:700;
  letter-spacing:-.02em;line-height:1.1;}
.pj-t{color:var(--t2);font-size:.84rem;margin-top:3px;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pj-b{height:4px;border-radius:2px;background:var(--line);
  margin-top:11px;overflow:hidden;}
.pj-b i{display:block;height:100%;border-radius:2px;}
.pj-k{margin:13px 0 0;font-size:.9rem;color:var(--t2);}
.pj-k b{font-family:var(--mono);color:var(--t1);}
/* 局限声明。字号小但**不能弱到看不见** —— 它是这块内容的合规前提，
   不是可有可无的脚注。 */
.pj-note{margin:9px 0 0;font-size:.78rem;line-height:1.55;color:var(--t3);}

/* ── 表格/卡片里的队徽（两种尺寸） ─────────────────────
   ⚠ 这套规则原来是**逐个内联写在 style 属性里**的：每个徽标 10 条属性，
   一行比赛两个徽标，resultados 一页 450 个 —— 光这一项就占了几十 KB，
   而且 225 行的页面涨到 266 KB / 4133 个节点。
   现在固定部分走类，行内**只留 background 和 color** 这两个按队变化的值。

   color 必须留在行内：它由 badge_ink() 按底色亮度算出黑或白，
   浅色队徽配白字会掉到 2.3:1。**这里绝不能补一条 color 兜底** ——
   同一个 style 属性里出现第二条 color 会静默覆盖算好的那个，
   历史上就是这么把 34 个徽标压成不合格对比度的。

   flex-shrink:0 不能少：徽标是 flex 子项，队名一长就会被挤扁
   （实测被压成 18×26，同卡另一个还是 26×26，肉眼可见的撕裂）。 */
.bdg{
  display:inline-flex;align-items:center;justify-content:center;
  font-weight:700;font-family:var(--mono);flex-shrink:0;
}
.bdg-30{width:30px;height:30px;border-radius:9px;font-size:.7rem;}
.bdg-26{width:26px;height:26px;border-radius:8px;font-size:.62rem;}
/* 深色队色（Corinthians #111、Terengganu #1a1a1a、Lotte、ORIX、Kasımpaşa 海军蓝…）
   在 --bg-1 上对比度只有 1.0–1.3，徽章的方块轮廓完全看不见，只剩三个字母浮着。
   加一圈很淡的内描边：亮色徽章上几乎看不出，深色徽章有了边界。
   用 inset box-shadow 不占尺寸、不影响 flex 布局。 */
.bdg,.team .badge,.tcard .badge{box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);}

/* ── 比分单元格 ─────────────────────────────────────
   同样是把逐行内联的样式收进类：225 行 × 3 个 span，每个都写着
   font-family/color，光这一处就是十几 KB。
   .sc 是等宽数字，.sc-w 给胜方加粗上色，.sc-d 是中间那个破折号。 */
.sc{font-family:var(--mono);}
.sc-w{font-weight:700;color:var(--win);}
.sc-d{color:var(--t4);}

/* ── 常驻底部入口（CTA_H5，2026-09-04）─────────────────
   这九个站是搜索流量的入口，用户从 Google 落到某个球队页或交锋页上，
   看完数据需要一个明确的去处，否则就退回搜索结果了。
   在此之前通往 H5 的链接只有页脚里那一条（文档 96% 处）。

   ⚠ 高度压在 54px 以内。Google 对「侵入式插页」是有惩罚的，判据是
     遮挡主要内容的比例 —— 一条几十像素的底部条属于常规做法，
     做成整屏浮层就会中招。
   ⚠ body 补 padding-bottom 在下面那条规则里，不补的话页脚最后几行
     会被这条盖住。被盖住的文字对爬虫仍然存在、对真人却是丢失的，
     这种「只有真人受损」的问题最难被发现。
   ⚠ 打印时隐藏：打印出来的纸上留一条固定按钮没有意义。 */
.h5bar{
  position:fixed; left:0; right:0; bottom:0; z-index:40;
  background:color-mix(in srgb, var(--bg) 88%, transparent);
  backdrop-filter:blur(8px);
  border-top:1px solid var(--line);
  padding:9px 16px;
}
.h5bar a{
  display:block; max-width:520px; margin:0 auto; text-align:center;
  background:var(--acc); color:var(--bg);
  font-weight:700; font-size:.92rem;
  border-radius:7px; padding:11px 14px; border:0;
}
body{padding-bottom:78px;}
/* 窄屏：土/希/波/西四种语言的按钮文案在 360–390 宽折成两行、末尾单词孤零零掉下去，
   整条变高到约 95px。缩字号 + 均衡折行，多数一行放下，放不下时两行等长。 */
@media (max-width:420px){
  .h5bar{padding:8px 12px;}
  .h5bar a{font-size:.84rem;line-height:1.3;padding:10px 10px;text-wrap:balance;}
}
@media print{ .h5bar{display:none;} body{padding-bottom:0;} }

/* ================================================================
   设计 v3（2026-09-25）· 瑞士 / 编辑风格
   ----------------------------------------------------------------
   参考：用户给的 Standard Data 官网截图（output/redesign2/report.html）。
   · 超大 grotesk 标题（Inter，字重 500，字距收紧），关键短语斜体；
   · 整屏色块分段：黑色 hero（CSS 竖向光条）→ 白底大留白 → 电光蓝整条 → 黑色页脚；
   · 单一强品牌色：电光蓝 #0F22E0（取自参考图），配黑 / 白 / 浅灰，不加第二强调色；
   · 小号全大写胶囊做眉标，» ↗ 这类细符号全部由 CSS 生成（不进正文、不进索引）。
   上面那部分旧规则（sticky 首列、减列、两行省略、渐隐导航…巡检修复）原样保留，
   本段只覆盖视觉。v2 那一层整段被本段替换（备份在 output/redesign2/work/v2_layer.css）。
   ⚠ jp 冻结：它读 assets_frozen/style.jp.css，本文件的改动对 jp 零影响。
   ================================================================ */

/* ── 字体：Inter 可变字体拉丁子集（opsz 固定 24，wght 400–700）+ 斜体 500 ──
   按 unicode-range 拆三段，只下载页面用得到的：核心拉丁 23KB+15KB，
   波兰/土耳其用到扩展 A（+17KB），越南文用到越南段（+11KB）。任一站 ≤ 55KB。
   回退字体按 Inter 的度量对齐（size-adjust / ascent-override），换字不跳版。 */
@font-face{font-family:Inter;font-style:normal;font-weight:400 700;font-display:swap;
  src:url(fonts/inter-r-core.de3e84f6.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2013-2014,U+2018-201E,U+2022,U+2026,U+2032-2033,U+2039-203A,U+20AC,U+2122,U+2190-2193,U+2197,U+2212;}
@font-face{font-family:Inter;font-style:normal;font-weight:400 700;font-display:swap;
  src:url(fonts/inter-r-exta.a6361f28.woff2) format("woff2");
  unicode-range:U+0100-0130,U+0132-0151,U+0154-017F;}
@font-face{font-family:Inter;font-style:normal;font-weight:400 700;font-display:swap;
  src:url(fonts/inter-r-vi.19b56400.woff2) format("woff2");
  unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
@font-face{font-family:Inter;font-style:italic;font-weight:500;font-display:swap;
  src:url(fonts/inter-i-core.15406286.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2013-2014,U+2018-201E,U+2022,U+2026,U+2032-2033,U+2039-203A,U+20AC,U+2122,U+2190-2193,U+2197,U+2212;}
@font-face{font-family:Inter;font-style:italic;font-weight:500;font-display:swap;
  src:url(fonts/inter-i-exta.0df1b2da.woff2) format("woff2");
  unicode-range:U+0100-0130,U+0132-0151,U+0154-017F;}
@font-face{font-family:Inter;font-style:italic;font-weight:500;font-display:swap;
  src:url(fonts/inter-i-vi.aeb1f7dc.woff2) format("woff2");
  unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;}
/* 度量匹配的回退（按真实标题 / 队名样本实测 Inter 与 Arial 的宽度比逐档校准）：
   正文 400、标题 450–599、粗体 600+、斜体各一档 —— Arial 只有 400/700 两个字重，
   一档 size-adjust 盖不住 Inter 500/550 与 Arial 400 的宽度差，标题会在换字时改折行。 */
@font-face{font-family:"Inter Fallback";font-weight:100 449;
  src:local("Arial"),local("ArialMT"),local("Helvetica Neue"),local("Helvetica"),local("Liberation Sans"),local("Roboto");
  size-adjust:100.4%;ascent-override:96.5%;descent-override:24%;line-gap-override:0%;}
@font-face{font-family:"Inter Fallback";font-weight:450 599;
  src:local("Arial"),local("ArialMT"),local("Helvetica Neue"),local("Helvetica"),local("Liberation Sans"),local("Roboto");
  size-adjust:102.9%;ascent-override:94.1%;descent-override:23.4%;line-gap-override:0%;}
@font-face{font-family:"Inter Fallback";font-weight:600 900;
  src:local("Arial Bold"),local("Arial-BoldMT"),local("Helvetica Neue Bold"),local("Helvetica Bold"),local("Liberation Sans Bold"),local("Roboto Bold");
  size-adjust:97.3%;ascent-override:99.6%;descent-override:24.8%;line-gap-override:0%;}
@font-face{font-family:"Inter Fallback";font-style:italic;
  src:local("Arial Italic"),local("Arial-ItalicMT"),local("Helvetica Neue Italic"),local("Helvetica Oblique"),local("Liberation Sans Italic"),local("Roboto Italic");
  size-adjust:102.9%;ascent-override:94.1%;descent-override:23.4%;line-gap-override:0%;}

/* ── 设计令牌：浅色（默认） ─────────────────────────────── */
:root{
  color-scheme:light dark;
  --blue:#0f22e0;        /* 品牌电光蓝（参考图取色）：白字 9.0:1，白底蓝字 9.0:1 */
  --blue-hi:#2437ff;     /* hover */
  --blue-t:#0f22e0;      /* 当文字用的蓝（深色模式下提亮） */
  --blue-soft:#eef0ff;   /* 浅胶囊底 */
  --bg:#ffffff;
  --bg-1:#ffffff;
  --bg-2:#f5f5f7;
  --bg-3:#ececf0;
  --line:#e6e6eb;
  --line-2:#cdced6;
  --rule:#0b0b0d;        /* 表格 / 区块顶部的粗分隔线 */
  --t1:#0b0b0d;
  --t2:#34363d;
  --t3:#595c66;          /* 白底 6.6:1，--bg-3 上 5.6:1 */
  --t4:#5e616b;
  --brand:#0f22e0;
  --acc:#0f22e0;
  --acc-dim:rgba(15,34,224,.08);
  --win:#067a46;         /* 白底 5.5:1 */
  --loss:#c42231;        /* 白底 5.7:1 */
  --gold:#a86b00;
  --ink:#000;
  --ring:rgba(11,11,13,.14);
  --shadow:none;
  --zebra:transparent;
  --r:4px;
  --font:Inter,"Inter Fallback",system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue','Noto Sans',Arial,sans-serif;
  --mono:var(--font);
  --w:1200px;
  --ease:cubic-bezier(.2,.7,.2,1);
}

/* ── 深色（跟随系统）：白底段落翻成近黑，蓝色块和黑色 hero 不变 ── */
@media (prefers-color-scheme:dark){
  :root{
    --bg:#0a0a0c;
    --bg-1:#0a0a0c;
    --bg-2:#141418;
    --bg-3:#1d1d23;
    --line:#24242b;
    --line-2:#3a3a45;
    --rule:#f2f2f4;
    --t1:#f2f2f4;
    --t2:#c4c6cd;
    --t3:#a3a6b0;          /* --bg-3 上 7.0:1 */
    --t4:#a0a3ad;
    --blue-t:#9ba5ff;      /* 深底 8.3:1 */
    --blue-soft:rgba(155,165,255,.12);
    --acc:#9ba5ff;
    --acc-dim:rgba(155,165,255,.12);
    --win:#34cf8b;
    --loss:#ff6b77;
    --gold:#f5c518;
    --ring:rgba(255,255,255,.22);
  }
}

/* ── 多语言：Inter 只覆盖拉丁；泰/日/繁中/希腊文走本地系统字体 ── */
:root:lang(th){--font:'Noto Sans Thai','Leelawadee UI','Thonburi','Sukhumvit Set',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;}
:root:lang(ja){--font:-apple-system,'Hiragino Sans','Hiragino Kaku Gothic ProN','Yu Gothic UI','Meiryo','Noto Sans JP','Noto Sans CJK JP',system-ui,sans-serif;}
:root:lang(zh){--font:-apple-system,'PingFang TC','PingFang HK','Microsoft JhengHei','Noto Sans TC','Noto Sans CJK TC',system-ui,sans-serif;}
:root:lang(el){--font:system-ui,-apple-system,'Segoe UI','Helvetica Neue',Roboto,'Noto Sans',Arial,sans-serif;}

html{scroll-padding-top:76px;}
body{background:var(--bg);color:var(--t1);font-family:var(--font);font-size:15.5px;line-height:1.6;
  letter-spacing:-.003em;}
/* 等宽数字只给数据：表格、比分、时间、统计大数字（正文段落用比例数字，更好读） */
table,.fx,.ins-v,.pj-n,.pct,.sc,.rank,.num,.upd,.fx-day .dt,div.tcard > div[style]{font-variant-numeric:tabular-nums;}
:root:lang(th) body{line-height:1.8;}
:root:lang(ja) body,:root:lang(zh) body{line-height:1.8;}
/* 大写 + 字距 / 负字距只对拉丁、希腊文有意义 */
:root:lang(ja) *,:root:lang(zh) *,:root:lang(th) *{letter-spacing:0 !important;}

main a:not(.tcard):not(.nm){text-decoration-color:color-mix(in srgb,currentColor 32%,transparent);}
main a:hover{text-decoration-color:var(--blue-t);color:var(--blue-t);}
main span.nm{text-decoration:none !important;}
/* 表格 / 赛程里的队名链接：默认不画下划线（参考图的干净列表），hover 与键盘焦点时才出现；
   焦点另有 2px 蓝色轮廓（:focus-visible），可访问性不降。队名列整列都是链接，位置本身就是可点提示。 */
main a.nm{text-decoration:none;}
main a.nm:hover,main a.nm:focus-visible{text-decoration:underline;text-decoration-color:var(--blue-t);
  text-decoration-thickness:1px;text-underline-offset:3px;color:var(--blue-t);}
:focus-visible{outline:2px solid var(--blue-t);outline-offset:2px;border-radius:2px;}
.wrap{max-width:var(--w);padding:0 clamp(18px,4vw,40px);}
::selection{background:var(--blue);color:#fff;}

/* ── 黑色区域（顶栏 / hero / 页脚）：局部改写令牌，两种模式都是深色 ── */
.nav,.hero,.foot{
  --t1:#fff;--t2:rgba(255,255,255,.78);--t3:rgba(255,255,255,.66);--t4:rgba(255,255,255,.66);
  --line:rgba(255,255,255,.12);--line-2:rgba(255,255,255,.24);
  --bg-2:#111115;--bg-3:#1b1b21;--acc:#9ba5ff;--blue-t:#9ba5ff;--acc-dim:rgba(155,165,255,.16);
  color:var(--t1);
}

/* ── 顶栏：黑底、左字标、居中细字导航、右侧国家切换 ─────────────── */
.nav{background:#000;border-bottom:1px solid #000;
  backdrop-filter:none;-webkit-backdrop-filter:none;}
.nav .inner{max-width:var(--w);height:60px;gap:28px;padding:0 clamp(18px,4vw,40px);}
.logo{display:inline-flex;align-items:center;gap:9px;font-family:var(--font);font-weight:600;
  font-size:1.06rem;letter-spacing:-.02em;color:#fff;min-height:40px;line-height:1.6;}
.logo .mark{color:#fff;flex-shrink:0;}
.logo .dot{display:none;}
.nav ul{gap:4px;flex:1 1 auto;justify-content:flex-start;}
.nav ul a{display:inline-flex;align-items:center;min-height:40px;padding:0 10px;border-radius:0;
  border-bottom:0;color:rgba(255,255,255,.72);font-weight:450;font-size:.86rem;letter-spacing:-.005em;line-height:1.75;
  background-image:linear-gradient(#fff,#fff);background-size:0 1px;background-repeat:no-repeat;
  background-position:10px calc(50% + .85em);transition:color .16s,background-size .2s var(--ease);}
.nav ul a:hover{color:#fff;background-color:transparent;}
.nav ul a.on{color:#fff;font-weight:550;background-size:calc(100% - 20px) 1px;}
.ctry summary{border:0;padding:8px 2px 8px 10px;line-height:24px;font-size:.84rem;color:rgba(255,255,255,.82);
  border-radius:0;min-height:40px;}
.ctry summary:hover{color:#fff;}
.ctry[open] summary{color:#fff;}
.ctry summary::after{border-color:currentColor;}
.ctry ul{background:#0b0b0e;border:1px solid rgba(255,255,255,.14);border-radius:var(--r);
  box-shadow:0 20px 50px rgba(0,0,0,.45);padding:6px;}
.ctry ul a{min-height:40px;display:flex;align-items:center;color:rgba(255,255,255,.78);border-radius:2px;font-size:.86rem;}
.ctry ul a:hover{background:rgba(255,255,255,.08);color:#fff;}
@media (min-width:1100px){
  /* 宽屏导航居中（参考图）：logo 与切换器各占一侧，ul 在中间 */
  .nav ul{justify-content:center;}
}

/* ── Hero：黑底 + CSS 竖向电光蓝光条 ─────────────────────────
   光条 = 三层不同周期的 repeating-linear-gradient 叠出不规则的「百褶帘」，
   每条左亮右暗；再用两层蒙版把光收到左下方、向上和向右淡出黑色。
   零图片、零字节额外请求。background-color 必须写（巡检脚本按它算对比度）。 */
.hero{position:relative;isolation:isolate;overflow:hidden;background:#000;background-color:#000;
  border-bottom:0;padding:clamp(52px,8vw,112px) 0 clamp(40px,5.5vw,72px);color:#fff;}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(180deg,rgba(0,0,0,.5) 0%,rgba(0,0,0,.15) 45%,rgba(0,0,0,0) 70%),
    repeating-linear-gradient(90deg,rgba(0,0,0,0) 0 14px,rgba(40,62,255,0) 14px,rgba(58,82,255,.7) 21px,#000 22px 23px),
    repeating-linear-gradient(90deg,rgba(0,0,0,0) 0 26px,rgba(40,62,255,0) 26px,rgba(48,72,255,.95) 38px,#000 39px 41px),
    repeating-linear-gradient(90deg,rgba(0,0,0,0) 0 40px,rgba(22,44,255,0) 40px,rgba(32,56,255,.95) 63px,#000 64px 67px),
    repeating-linear-gradient(90deg,rgba(0,0,0,0) 0 58px,rgba(15,34,224,0) 58px,rgba(22,42,245,1) 104px,#000 105px 109px),
    #000;
  /* 各层错开起点：让最左缘也落在一条光条上，而不是每层都从「透明段」开始留出一道黑边 */
  background-position:0 0,-8px 0,-22px 0,-46px 0,-70px 0,0 0;
  /* 横向：左侧最亮，向右只降到 ~45%，整幅都有光条（参考图是满幅的）；纵向：底部亮、上半收暗保住标题可读 */
  -webkit-mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.85) 30%,rgba(0,0,0,.55) 62%,rgba(0,0,0,.45) 100%),
                     linear-gradient(0deg,#000 0%,rgba(0,0,0,.72) 30%,rgba(0,0,0,.4) 62%,rgba(0,0,0,.2) 100%);
  mask-image:linear-gradient(90deg,#000 0%,rgba(0,0,0,.85) 30%,rgba(0,0,0,.55) 62%,rgba(0,0,0,.45) 100%),
             linear-gradient(0deg,#000 0%,rgba(0,0,0,.72) 30%,rgba(0,0,0,.4) 62%,rgba(0,0,0,.2) 100%);
  -webkit-mask-composite:source-in;mask-composite:intersect;}
/* 光条上压一层自下而上的蓝色辉光，让左下角亮起来 */
.hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(60% 55% at 4% 104%,rgba(15,34,224,.55),transparent 72%);}
.hero .wrap{position:relative;display:flex;flex-direction:column;align-items:flex-start;}
.hero .eyebrow{display:inline-flex;align-items:center;gap:8px;font-family:var(--font);
  font-size:.68rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;line-height:1.35;
  color:#fff;background:var(--blue);border:0;border-radius:3px;padding:5px 9px;margin:0 0 26px;max-width:100%;}
.hero .eyebrow .dot{width:6px;height:6px;border-radius:1px;background:#fff;animation:none;flex-shrink:0;}
.hero .eyebrow[style]{background:rgba(255,255,255,.1) !important;color:#fff !important;}
.hero h1{font-family:var(--font);font-weight:500;color:#fff;
  font-size:clamp(2.2rem,6.2vw,4.75rem);line-height:1.02;letter-spacing:-.042em;
  max-width:min(100%,13.5em);text-wrap:balance;overflow-wrap:break-word;hyphens:manual;}
.hero h1 em{font-style:italic;color:#fff;font-weight:500;letter-spacing:-.035em;padding-right:.04em;}
.hero .loc-name{font-size:clamp(1rem,2vw,1.2rem);font-weight:450;color:rgba(255,255,255,.72);margin:14px 0 0;letter-spacing:-.01em;}
.hero p{color:rgba(255,255,255,.88);text-shadow:0 1px 14px rgba(0,0,0,.55);font-size:clamp(.92rem,1.3vw,1rem);line-height:1.6;
  max-width:44ch;margin-top:clamp(28px,5vw,64px);}
.hero .loc-name + p{margin-top:clamp(24px,4vw,52px);}
.hero p a{color:#fff;}
.hero p b{font-weight:600;color:#fff;}
/* 大队徽（球队页） */
.hero .hero-crest,.hero .badge{width:96px;height:96px;margin:0 0 24px;}
.hero .badge{border-radius:6px;font-size:1.4rem;font-weight:600;display:flex;align-items:center;justify-content:center;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.2);}
@media (min-width:900px){
  .hero{min-height:clamp(400px,52vh,540px);display:flex;}
  .hero > .wrap{flex:1;width:100%;}
  .hero p{margin-top:auto;padding-top:56px;}
  .hero .loc-name + p{margin-top:auto;}
  /* 底部居中的双箭头（参考图）：纯装饰 */
  .hero > .wrap::after{content:"";position:absolute;left:50%;bottom:0;width:16px;height:18px;margin-left:-8px;
    background:currentColor;opacity:.8;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 16'%3E%3Cpath d='M2 1.5l5 3.5 5-3.5M2 6l5 3.5 5-3.5M2 10.5l5 3.5 5-3.5' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 16'%3E%3Cpath d='M2 1.5l5 3.5 5-3.5M2 6l5 3.5 5-3.5M2 10.5l5 3.5 5-3.5' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3C/svg%3E") center/contain no-repeat;}
}
/* 无空格语言：标题不收字距、行高给足；泰文不做斜体（系统会硬斜切，笔画错位） */
:root:lang(th) .hero h1{font-weight:600;line-height:1.4;font-size:clamp(1.9rem,5vw,3.6rem);max-width:min(100%,16em);}
:root:lang(ja) .hero h1,:root:lang(zh) .hero h1{font-weight:700;line-height:1.25;font-size:clamp(2rem,5.4vw,4rem);max-width:min(100%,14em);}
:root:lang(th) .hero h1 em,:root:lang(ja) .hero h1 em,:root:lang(zh) .hero h1 em{font-style:normal;color:#aab2ff;}
:root:lang(el) .hero h1{letter-spacing:-.03em;}
/* 大标题 / 大句子用比例数字：等宽数字在大字号下字距松散，且和回退字体宽度差最大 */
.hero h1,.sec-hd h2,.sec > .wrap > h2,.band-t,.cta-t,.loc-name{font-variant-numeric:normal;font-feature-settings:normal;}
/* 中日文标题只在空格和标点处折行，不把「台灣」拆成「台 / 灣」；超长串兜底用 anywhere */
:root:lang(zh) :is(.hero h1,.sec-hd h2,.band-t,.cta-t),:root:lang(ja) :is(.hero h1,.sec-hd h2,.band-t,.cta-t){word-break:keep-all;overflow-wrap:anywhere;}

/* ── 电光蓝整条（总览页洞察句 / 页脚前引流）────────────────── */
.band,.cta-band{background:var(--blue);color:#fff;text-align:center;position:relative;
  --t1:#fff;--t2:rgba(255,255,255,.9);--blue-t:#fff;}
.band{padding:clamp(64px,10vw,150px) 0 clamp(72px,11vw,160px);}
.band-t{font-family:var(--font);font-weight:450;font-size:clamp(1.4rem,3.3vw,2.55rem);line-height:1.2;
  letter-spacing:-.028em;max-width:30ch;margin:0 auto;text-wrap:balance;overflow-wrap:break-word;}
.band .wrap::before{content:"»";display:block;font-size:clamp(1.4rem,2.5vw,2rem);line-height:1;margin-bottom:22px;
  opacity:.9;font-weight:400;}
.band::after,.cta-band::after{content:"";position:absolute;left:50%;bottom:clamp(22px,3vw,36px);width:16px;height:18px;margin-left:-8px;
  background:#fff;opacity:.85;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 16'%3E%3Cpath d='M2 1.5l5 3.5 5-3.5M2 6l5 3.5 5-3.5M2 10.5l5 3.5 5-3.5' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 16'%3E%3Cpath d='M2 1.5l5 3.5 5-3.5M2 6l5 3.5 5-3.5M2 10.5l5 3.5 5-3.5' fill='none' stroke='%23000' stroke-width='1.5'/%3E%3C/svg%3E") center/contain no-repeat;}
.cta-band{padding:clamp(64px,9vw,128px) 0 calc(clamp(80px,10vw,140px) + 64px);margin-top:clamp(56px,8vw,112px);}
.cta-t{font-family:var(--font);font-weight:450;font-size:clamp(1.45rem,3.6vw,2.8rem);line-height:1.15;
  letter-spacing:-.03em;max-width:24ch;margin:0 auto;text-wrap:balance;overflow-wrap:break-word;}
.cta-t a{color:#fff;text-decoration:none;font-style:italic;background-image:linear-gradient(#fff,#fff);
  background-size:100% 1px;background-position:0 100%;background-repeat:no-repeat;padding-bottom:.06em;}
.cta-t a::after{content:"↗";font-style:normal;display:inline-block;margin-left:.3em;font-size:.72em;
  transform:translateY(-.08em);transition:transform .2s var(--ease);}
.cta-t a:hover::after{transform:translate(.12em,-.2em);}
.cta-t a:focus-visible{outline-color:#fff;}
:root:lang(th) .cta-t a,:root:lang(ja) .cta-t a,:root:lang(zh) .cta-t a{font-style:normal;}
:root:lang(th) .band-t,:root:lang(th) .cta-t{line-height:1.5;}
:root:lang(ja) .band-t,:root:lang(zh) .band-t,:root:lang(ja) .cta-t,:root:lang(zh) .cta-t{line-height:1.45;font-weight:500;}

/* ── 区块：白底大留白；标题前 »，副标题做成小号全大写胶囊眉标 ─────── */
main{display:block;}
.sec{padding:clamp(52px,7.5vw,104px) 0 0;border-bottom:0;}
.sec + .sec{padding-top:clamp(52px,7.5vw,104px);}
.sec-hd{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:12px 28px;margin-bottom:clamp(22px,3vw,34px);}
.sec-hd > div:first-child{display:flex;flex-direction:column;align-items:flex-start;min-width:0;max-width:100%;}
.sec-hd h2,.sec > .wrap > h2{font-family:var(--font);font-weight:500;font-size:clamp(1.6rem,3.5vw,2.6rem);
  line-height:1.08;letter-spacing:-.034em;color:var(--t1);text-wrap:balance;overflow-wrap:break-word;}
.sec-hd h2::before,.sec > .wrap > h2::before{content:"»";color:var(--blue-t);font-weight:500;margin-right:.28em;letter-spacing:0;}
.sec-hd .sub{display:block;margin:10px 0 0;max-width:62ch;font-size:.86rem;font-weight:400;
  letter-spacing:0;text-transform:none;line-height:1.5;color:var(--t3);background:none;border-radius:0;padding:0;}
.sec-hd .upd{font-family:var(--font);font-size:.78rem;color:var(--t3);letter-spacing:0;padding-bottom:4px;}
:root:lang(th) .sec-hd h2,:root:lang(th) .sec > .wrap > h2{line-height:1.45;font-weight:600;font-size:clamp(1.4rem,3vw,2.2rem);}
:root:lang(ja) .sec-hd h2,:root:lang(zh) .sec-hd h2,:root:lang(ja) .sec > .wrap > h2,:root:lang(zh) .sec > .wrap > h2{line-height:1.3;font-weight:700;font-size:clamp(1.45rem,3vw,2.2rem);}
:root:lang(th) .hero .eyebrow{font-size:.78rem;}
main h3{font-family:var(--font);letter-spacing:-.015em;}
.grp-ttl{font-family:var(--font);font-weight:550;font-size:clamp(1.05rem,2.2vw,1.3rem);letter-spacing:-.02em;
  border-left:2px solid var(--blue);padding-left:12px;margin:34px 0 14px;}

/* ── 表格：无外框，顶部一条实线 + 行间细线（瑞士式） ─────────────── */
.tbl-wrap{border:0;border-top:1px solid var(--rule);border-radius:0;box-shadow:none;background-color:var(--bg-1);
  background-image:
    linear-gradient(to right,var(--bg-1) 40%,transparent),
    linear-gradient(to left,var(--bg-1) 40%,transparent),
    linear-gradient(to right,color-mix(in srgb,var(--t1) 12%,transparent),transparent),
    linear-gradient(to left,color-mix(in srgb,var(--t1) 12%,transparent),transparent);}
table{font-size:.9rem;}
thead th{background:var(--bg-1);color:var(--t3);font-family:var(--font);font-size:.66rem;font-weight:600;
  letter-spacing:.085em;text-transform:uppercase;padding:14px 12px 12px;border-bottom:1px solid var(--line-2);}
tbody td{padding:13px 12px;color:var(--t2);border-bottom:1px solid var(--line);}
tbody tr > th:first-child{padding-left:12px;padding-right:12px;}
tbody th[scope="row"]{border-bottom:1px solid var(--line);}
tbody tr:last-child > th{border-bottom:0;}
tbody tr:nth-child(even){background:transparent;--row-bg:var(--bg-1);}
tbody tr:hover{background:var(--bg-2);--row-bg:var(--bg-2);}
td.num,th.num{font-family:var(--font);}
td.pts{color:var(--t1);font-size:1rem;}
td.pts b{font-weight:650;}
.rank{background:transparent;color:var(--t1);font-family:var(--font);font-weight:500;font-size:.86rem;
  width:26px;height:26px;border-radius:3px;}
.rank.top{background:var(--blue);color:#fff;}
.team{gap:12px;}
.team .nm{font-weight:550;color:var(--t1);letter-spacing:-.01em;}
.team .ct{color:var(--t3);}
.w{color:var(--win);} .l{color:var(--loss);}
.sc-w{font-weight:650;}
tbody tr > td.num:first-child{text-align:left;}

/* ── 队徽：真实队徽（img.crest）/ 队色缩写（.bdg，对不上的队） ────────── */
.crest{display:inline-block;flex-shrink:0;object-fit:contain;vertical-align:middle;}
.crest-26{width:26px;height:26px;} .crest-30{width:30px;height:30px;}
.crest-42{width:42px;height:42px;} .crest-56{width:56px;height:56px;} .crest-96{width:96px;height:96px;}
/* 深色队徽（Corinthians、Botafogo…）落在黑底上：描一圈细白边保住轮廓 */
.hero .crest.dk,.foot .crest.dk{filter:drop-shadow(0 0 1px rgba(255,255,255,.9)) drop-shadow(0 0 .5px rgba(255,255,255,.9));}
@media (prefers-color-scheme:dark){
  .crest.dk{filter:drop-shadow(0 0 1px rgba(255,255,255,.85)) drop-shadow(0 0 .5px rgba(255,255,255,.85));}
}
.bdg,.team .badge,.tcard .badge,.fx .badge{box-shadow:inset 0 0 0 1px var(--ring);font-family:var(--font);
  letter-spacing:.01em;font-weight:650;}
.bdg-30{border-radius:4px;} .bdg-26{border-radius:3px;font-size:.58rem;}
.fx .badge{width:56px;height:56px;border-radius:5px;display:flex;align-items:center;justify-content:center;font-size:.9rem;flex-shrink:0;}

/* ── 赛程 / 赛果：去卡片，改成细线分隔的列表 ───────────────────── */
.fx-day{margin-bottom:0;}
.fx-day.cont{margin-top:0;}
.fx-day .dt{font-family:var(--font);font-size:.66rem;font-weight:600;color:var(--t2);letter-spacing:.09em;
  text-transform:uppercase;margin:26px 0 0;padding:0 0 10px;border-radius:0;background:transparent;
  border-bottom:1px solid var(--rule);}
.fx-day:first-of-type .dt,.sec-hd + .fx-day .dt{margin-top:0;}
.fx-day .dt:after{display:none;}
.fx{background:transparent;border:0;border-bottom:1px solid var(--line);border-radius:0;box-shadow:none;
  padding:16px 2px;margin:0;gap:14px;}
.fx:hover{border-color:var(--line-2);background:var(--bg-2);}
.fx .side{gap:12px;}
.fx .side .nm{font-weight:550;font-size:.95rem;letter-spacing:-.01em;}
.fx .mid{min-width:72px;}
.fx .mid .time{font-family:var(--font);font-weight:500;font-size:1.02rem;letter-spacing:-.01em;}
.fx .mid .score{font-family:var(--font);font-weight:600;font-size:1.3rem;letter-spacing:-.01em;}
.fx .mid .vs{color:var(--t3);font-weight:500;font-size:.64rem;letter-spacing:.12em;}
.fx .venue{color:var(--t3);font-size:.78rem;border-top:0;padding-top:0;}
.fx .fx-pj{font-family:var(--font);font-weight:500;color:var(--t2);font-size:.8rem;}
.fx .fx-pj i{color:var(--t3);}
/* 单场页顶部比分卡：主视觉 —— 大队徽、超大比分 */
.fx[style*="padding:22px 0"]{border-top:1px solid var(--rule);border-bottom:1px solid var(--line);
  padding-top:34px !important;padding-bottom:30px !important;background:transparent;}
.fx[style*="padding:22px 0"]:hover{background:transparent;}
.fx[style*="padding:22px 0"] .side{gap:16px;}
.fx[style*="padding:22px 0"] .side .nm{font-size:clamp(1rem,1.8vw,1.35rem);font-weight:550;letter-spacing:-.02em;}
.fx[style*="padding:22px 0"] .mid > div[style]{font-family:var(--font) !important;font-weight:500 !important;
  font-size:clamp(2.4rem,6vw,4.2rem) !important;letter-spacing:-.045em;line-height:1.15;}
.fx[style*="padding:22px 0"] .mid .time{font-size:clamp(1.6rem,4vw,2.4rem) !important;font-weight:500;letter-spacing:-.03em;}
.fx[style*="padding:22px 0"] .mid .vs{margin-top:12px;}
.fx[style*="padding:22px 0"] .venue{margin-top:14px;padding-top:14px;border-top:1px solid var(--line);}

/* ── 卡片：球队卡保留细框；统计 / 洞察 / 问答改成「左侧蓝色竖线」条目 ── */
.grid{gap:12px;}
.tcard{background:var(--bg-1);border:1px solid var(--line);border-radius:var(--r);box-shadow:none;
  padding:18px 18px 18px 18px;transition:border-color .16s,background-color .16s;}
.tcard:before{display:none;}
.tcard:hover{border-color:var(--t1);transform:none;}
.tcard h3{font-weight:550;font-size:1rem;letter-spacing:-.015em;}
.tcard .meta{color:var(--t3);}
.tcard .crest-42,.tcard .badge{margin-bottom:14px;}
.tcard .badge{width:42px;height:42px;border-radius:4px;}
a.tcard{display:block;}
a.tcard h3::after{content:"↗";display:inline-block;margin-left:.35em;color:var(--t3);font-weight:400;
  transition:transform .2s var(--ease),color .2s;}
a.tcard:hover h3::after{color:var(--blue-t);transform:translate(.1em,-.1em);}
/* 统计小卡（球队页「本季战绩」等，div.tcard 非链接）：左侧蓝色竖线条目 */
div.tcard{border:0;border-left:2px solid var(--blue);border-radius:0;padding:4px 0 4px 16px;background:transparent;}
div.tcard:hover{border-color:var(--blue);}
div.tcard > div[style*="font-size:1.5rem"]{font-family:var(--font) !important;font-weight:500 !important;
  letter-spacing:-.03em;font-size:1.75rem !important;line-height:1.15;}
.ins-lead{color:var(--t2);font-size:clamp(1rem,1.6vw,1.12rem);line-height:1.65;max-width:62ch;margin:0 0 28px;}
.ins-grid{gap:28px 32px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));}
.ins-card,.pj{background:transparent;border:0;border-left:2px solid var(--blue);border-radius:0;box-shadow:none;
  padding:2px 0 2px 16px;}
.ins-k{color:var(--t3);font-size:.7rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;}
.ins-v{font-family:var(--font);font-weight:500;font-size:clamp(1.8rem,3.4vw,2.4rem);letter-spacing:-.04em;line-height:1.05;margin:8px 0 6px;}
.ins-d{color:var(--t3);font-size:.84rem;}
.qa-q{font-weight:550;font-size:1rem;letter-spacing:-.015em;line-height:1.4;}
.qa-a{color:var(--t2);font-size:.9rem;}
.pjs{gap:24px;}
.pj-n{font-family:var(--font);font-weight:500;font-size:2rem;letter-spacing:-.04em;}
.pj-t{color:var(--t2);}
.pj-b{background:var(--bg-3);height:4px;border-radius:0;}
.pj-b i{border-radius:0;box-shadow:inset 0 0 0 1px var(--ring);}
.pj-k b{font-family:var(--font);}
:root:lang(th) .ins-k,:root:lang(th) .fx-day .dt,:root:lang(th) thead th{font-size:.76rem;}
:root:lang(ja) .ins-k,:root:lang(zh) .ins-k,:root:lang(ja) .fx-day .dt,:root:lang(zh) .fx-day .dt,
:root:lang(ja) thead th,:root:lang(zh) thead th{font-size:.74rem;}
:root:lang(th) .tcard h3,:root:lang(th) .qa-q,:root:lang(th) .grp-ttl,:root:lang(th) .pj-t{line-height:1.55;}
:root:lang(th) .tbl-wrap th[scope="row"] .nm,:root:lang(th) .fx .side .nm{line-height:1.5;}

/* 正文里的列表（关于 / 隐私页）：左侧蓝色竖线条目（参考图右侧那组） */
main .sec ul:not(.grid){list-style:none;}
main .sec ul:not(.grid) > li{position:relative;padding-left:18px;}
main .sec ul:not(.grid) > li::before{content:"";position:absolute;left:0;top:.45em;width:2px;height:1em;background:var(--blue);}
:root:lang(th) main .sec ul:not(.grid) > li::before{top:.55em;}

/* ── 页脚：黑底 ─────────────────────────────────────────────── */
.foot{background:#000;border-top:0;margin-top:0;padding:clamp(48px,6vw,72px) 0 130px;font-size:.8rem;color:rgba(255,255,255,.66);}
.cta-band + .foot{margin-top:0;}
.foot p+p{margin-top:9px;}
.foot b{color:#fff;font-weight:600;}
.foot a{color:#fff;border-bottom:1px solid rgba(255,255,255,.3);}
.foot a:hover{border-bottom-color:#fff;}
.foot .foot-links{margin-top:18px;}
.foot .foot-legal{margin-top:18px;max-width:78ch;color:rgba(255,255,255,.62);}

body{padding-bottom:0;}
/* ── 底部常驻引流条：黑底 + 电光蓝按钮 ─────────────────────────── */
.h5bar{background:rgba(0,0,0,.86);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-top:1px solid rgba(255,255,255,.1);}
.h5bar a{background:var(--blue);color:#fff;border-radius:3px;font-weight:600;letter-spacing:-.005em;font-family:var(--font);}
.h5bar a::after{content:"↗";font-weight:400;margin-left:.35em;}
.h5bar a:hover{background:var(--blue-hi);}
/* 点击区 ≥ 40px（窄屏原来 37px），整条仍压在 54px 以内（侵入式插页红线，见上方旧规则） */
.h5bar{padding:5px 14px;}
.h5bar a{display:flex;align-items:center;justify-content:center;min-height:42px;padding-top:6px;padding-bottom:6px;}
.skip:focus{background:var(--blue);color:#fff;}

/* ── 桌面：赛程单行（主队 | 时间 | 客队 | 场馆） ─────────────────── */
@media (min-width:900px){
  .fx{grid-template-columns:minmax(0,1fr) minmax(96px,auto) minmax(0,1fr) minmax(200px,.8fr);row-gap:6px;padding:14px 8px;}
  .fx .venue{grid-column:4;grid-row:1 / span 2;border-left:1px solid var(--line);margin:0;padding:2px 0 2px 20px;
    text-align:left;display:flex;align-items:center;flex-wrap:wrap;gap:0 4px;}
  .fx .fx-pj{grid-column:1 / 4;grid-template-columns:minmax(0,1fr) minmax(96px,auto) minmax(0,1fr);}
  .fx .fx-pj > span:first-child{text-align:right;}
  .fx .fx-pj > span:last-child{text-align:left;}
  .fx .side,.fx .side.away{justify-content:flex-end;}
  .fx[style*="padding:22px 0"]{grid-template-columns:1fr auto 1fr;}
  .fx[style*="padding:22px 0"] .side{justify-content:flex-start;}
  .fx[style*="padding:22px 0"] .side.away{justify-content:flex-start;}
  .fx[style*="padding:22px 0"] .venue{grid-column:1 / -1;grid-row:auto;border-left:0;border-top:1px solid var(--line);
    padding:14px 0 0;margin-top:14px;display:block;text-align:center;}
}

/* ── 手机 ─────────────────────────────────────────────────── */
@media (max-width:640px){
  body{font-size:15px;}
  .nav .inner{height:54px;gap:10px;}
  .nav ul{gap:0;}
  .nav ul a{padding:0 9px;font-size:.86rem;background-position:9px calc(50% + .85em);}
  .nav ul a.on{background-size:calc(100% - 18px) 1px;}
  .nav ul li:has(> a.on){order:-1;}
  .logo{font-size:1rem;gap:7px;}
  .hero{padding:40px 0 36px;}
  .hero .eyebrow{margin-bottom:20px;}
  .hero p{margin-top:24px;}
  .hero .hero-crest,.hero .badge{width:72px;height:72px;margin-bottom:18px;}
  .sec{padding-top:52px;}
  .sec + .sec{padding-top:52px;}
  .fx{padding:14px 0;gap:8px;}
  .fx .mid{min-width:0;}
  .fx .side .nm{font-size:.86rem;font-weight:550;}
  .fx[style*="padding:22px 0"] .side .nm{font-size:.95rem;}
  .fx .badge{width:48px;height:48px;}
  .crest-56{width:48px;height:48px;}
  thead th,tbody td{padding:12px 9px;}
  tbody tr > th:first-child{padding-left:9px;}
  .ins-grid{gap:22px;}
  .tcard{padding:14px;}
  .cta-band{margin-top:56px;}
}

@media print{
  .nav,.hero,.foot{--t1:#000;--t2:#222;--t3:#444;}
  .hero{background:none;color:#000;min-height:0;}
  .hero::before,.hero::after,.band::after,.cta-band::after{display:none;}
  .hero h1,.hero p,.hero h1 em{color:#000;}
  .band,.cta-band{background:none;color:#000;}
  .cta-t a{color:#000;}
}
@media (prefers-reduced-motion:reduce){
  .nav ul a,.cta-t a::after,a.tcard h3::after{transition:none;}
}

/* ── 关于 / 隐私这类「标题 + 正文」段落：编辑式左右两栏（参考图下半屏） ── */
.sec:has(> .wrap > h2:first-child){padding-top:clamp(36px,5vw,64px);}
.sec:has(> .wrap > h2:first-child) > .wrap::before{content:"";display:block;height:1px;background:var(--line-2);
  margin-bottom:clamp(24px,3vw,40px);grid-column:1 / -1;}
.sec > .wrap > h2:first-child{font-size:clamp(1.4rem,2.6vw,2.1rem);}
.sec > .wrap > h2:first-child ~ p,.sec > .wrap > h2:first-child ~ ul{max-width:68ch;font-size:1rem;line-height:1.7;}
@media (min-width:900px){
  .sec > .wrap:has(> h2:first-child){display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);
    column-gap:clamp(32px,5vw,88px);align-items:start;}
  .sec > .wrap:has(> h2:first-child) > *:not(h2){grid-column:2;}
  .sec > .wrap:has(> h2:first-child) > h2{grid-column:1;grid-row:2 / span 30;}
  .sec > .wrap > h2:first-child + *{margin-top:.3em !important;}
}

/* 页脚前蓝色整条的箭头抬到常驻按钮（约 55px）之上 */
.cta-band::after{bottom:calc(clamp(22px,3vw,36px) + 64px);}

/* ── 窄屏顶栏：国家切换器收成地球图标 + ⌄，导航渐隐加宽，不露半个字 ──
   国家名只是视觉上收起（沿用 sr-only 的裁切写法），读屏照旧念「Portugal, 选择国家」。 */
@media (max-width:640px){
  .ctry summary{padding:8px 2px 8px 10px;gap:4px;min-width:42px;}
  .ctry summary > span:first-child{position:absolute;clip-path:inset(50%);white-space:nowrap;
    max-width:none;overflow:visible;pointer-events:none;}
  .ctry summary::before{content:"";width:18px;height:18px;flex-shrink:0;background:currentColor;
    -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c2.5 2.6 3.8 5.6 3.8 9s-1.3 6.4-3.8 9c-2.5-2.6-3.8-5.6-3.8-9S9.5 5.6 12 3z'/%3E%3C/svg%3E") center/contain no-repeat;
    mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.6'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M3 12h18M12 3c2.5 2.6 3.8 5.6 3.8 9s-1.3 6.4-3.8 9c-2.5-2.6-3.8-5.6-3.8-9S9.5 5.6 12 3z'/%3E%3C/svg%3E") center/contain no-repeat;}
  /* 渐隐区 20px → 48px，右内边距同步加宽（不溢出时渐隐仍只落在空白上，见上方旧规则的说明） */
  .h5bar a::after{display:none;}
  .nav ul{padding-right:48px;
    -webkit-mask-image:linear-gradient(to right,#000 calc(100% - 56px),rgba(0,0,0,.25) calc(100% - 22px),transparent);
    mask-image:linear-gradient(to right,#000 calc(100% - 56px),rgba(0,0,0,.25) calc(100% - 22px),transparent);}
}