/* V3 editorial hierarchy: compact board index, dominant hot-topic module. */
.sections-page .sections-intro { padding-top: 24px; }
.sections-page main { padding-bottom: 40px; }
.sections-page .sections-heading-row { padding-bottom: 18px; }
.sections-page .sections-heading-row h1 { font-size: clamp(42px, 4.6vw, 58px); }
.sections-page .sections-heading-row p { max-width: 520px; font-size: 14px; }
.sections-page .sections-board { padding-top: 16px; }
.sections-page .sections-board > h2 { margin: 0 0 10px; font: 600 20px/1.05 var(--display); letter-spacing: -.02em; text-transform: uppercase; }
.sections-page .section-board-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 12px; border-top: 1px solid var(--line); }
.sections-page .section-board-card { position: relative; display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 12px; align-items: center; min-height: 76px; padding: 8px 28px 8px 0; border: 0; border-bottom: 1px solid var(--line); background: transparent; transform: none; box-shadow: none; }
.sections-page .section-board-card:hover { transform: none; border-color: var(--line); background: var(--paper-2); box-shadow: none; }
.sections-page .section-card-media { width: 96px; aspect-ratio: 1.35 / 1; }
.sections-page .section-card-media img { filter: saturate(.88); }
.sections-page .section-card-shade { display: none; }
.sections-page .section-card-placeholder { display: none; }
.sections-page .section-card-body { position: static; display: grid; gap: 3px; min-width: 0; color: var(--ink); text-align: left; }
.sections-page .section-card-body strong { overflow: hidden; font: 600 15px/1.04 var(--display); letter-spacing: -.015em; text-transform: uppercase; text-overflow: ellipsis; white-space: nowrap; text-shadow: none; }
.sections-page .section-card-body > span { overflow: hidden; color: var(--muted); font-size: 10px; line-height: 1.2; text-overflow: ellipsis; white-space: nowrap; }
.sections-page .section-card-body small { overflow: hidden; color: var(--muted); font-size: 9px; font-weight: 700; letter-spacing: .06em; text-overflow: ellipsis; text-transform: uppercase; white-space: nowrap; }
.sections-page .section-card-arrow { position: absolute; top: 50%; right: 3px; width: auto; height: auto; border-radius: 0; background: transparent; color: var(--coral); font-size: 26px; line-height: 1; transform: translateY(-50%); }
.sections-page .section-board-card.age-restricted .section-card-media { background: #191828; }
.sections-page .hot-topics-section { padding-top: 28px; }
.sections-page .sections-section-heading { margin-bottom: 12px; }
.sections-page .sections-section-heading h2 { font-size: 28px; text-transform: uppercase; }
.sections-page .sections-note { font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }
.sections-page .hot-topics-more { margin-left: auto; font-size: 11px; }
.sections-page .hot-topics-more span { color: var(--coral); }
.sections-page .hot-topics-layout { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: 22px; border-top: 1px solid var(--line); padding-top: 14px; }
.sections-page .hot-topic-feature { display: grid; grid-template-columns: 1fr; gap: 10px; align-items: start; min-width: 0; }
.sections-page .hot-topic-feature > img { width: 100%; height: auto; min-height: 0; aspect-ratio: 1.72 / 1; object-fit: cover; background: var(--paper-2); }
.sections-page .hot-topic-feature-copy { display: grid; align-content: start; gap: 8px; min-width: 0; padding: 0; }
.sections-page .hot-topic-feature-copy small, .sections-page .hot-topic-copy small { color: var(--green); font-size: 9px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.sections-page .hot-topic-feature-copy strong { font: 600 clamp(22px, 2.3vw, 34px)/1 var(--display); letter-spacing: -.035em; }
.sections-page .hot-topic-feature-copy > span:not(.hot-topic-feature-bottom) { color: var(--muted); font-size: 13px; line-height: 1.35; }
.sections-page .hot-topic-feature-bottom { display: flex; align-items: center; justify-content: space-between; margin-top: auto; color: var(--coral); font-size: 22px; }
.sections-page .hot-topic-feature-bottom time { color: var(--muted); font-size: 10px; }
.sections-page .hot-topic-list { border-top: 0; }
.sections-page .hot-topic-row { display: grid; grid-template-columns: 22px 72px minmax(0, 1fr) 16px; gap: 9px; min-height: 62px; padding: 8px 0; }
.sections-page .hot-topic-row:hover { padding-left: 6px; padding-right: 6px; }
.sections-page .hot-topic-row > img { width: 72px; height: 46px; object-fit: cover; background: var(--paper-2); }
.sections-page .hot-topic-number { color: var(--coral); font: 600 22px/1 var(--display); }
.sections-page .hot-topic-copy { display: grid; align-content: center; gap: 3px; min-width: 0; }
.sections-page .hot-topic-copy strong { overflow: hidden; font: 600 16px/1.08 var(--display); letter-spacing: -.01em; text-overflow: ellipsis; }
.sections-page .hot-topic-copy time { color: var(--muted); font-size: 10px; }
.sections-page .hot-topic-arrow { color: var(--coral); font-size: 24px; }
.sections-page .active-now-strip { display: flex; align-items: center; gap: 10px; border-top: 1px solid var(--line); margin-top: 14px; padding-top: 11px; color: var(--muted); font-size: 10px; }
.sections-page .active-now-strip strong { color: var(--ink); font: 600 15px/1 var(--display); text-transform: uppercase; }
.sections-page .active-now-indicator { width: 7px; height: 7px; border-radius: 50%; background: var(--lime); }
.sections-page .topics-ad-slot { margin: 28px 0 0; }
.sections-page .header-edition .edition-button select, .sections-page .drawer-edition .edition-button select { appearance: none; border: 0; background: transparent; color: var(--ink); padding: 0; font: inherit; cursor: pointer; }
@media (min-width: 901px) {
  .sections-page .section-board-card.age-restricted { grid-column: 1 / -1; min-height: 66px; }
}
@media (max-width: 900px) {
  .sections-page .topics-ad-slot { margin-top: 24px; }
  .sections-page .sections-board > h2 { font-size: 18px; }
  .sections-page .section-board-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 10px; }
  .sections-page .section-board-card { grid-template-columns: 58px minmax(0, 1fr); gap: 8px; min-height: 68px; padding-right: 18px; }
  .sections-page .section-card-media { width: 58px; }
  .sections-page .section-card-body strong { overflow: visible; font-size: 12px; line-height: 1.05; text-overflow: clip; white-space: normal; }
  .sections-page .section-card-body > span { display: none; }
  .sections-page .section-card-body small { font-size: 8px; }
  .sections-page .section-card-arrow { right: 1px; font-size: 21px; }
  .sections-page .hot-topics-layout { grid-template-columns: 1fr; gap: 16px; }
  .sections-page .hot-topic-feature { grid-template-columns: 1fr; gap: 10px; }
  .sections-page .hot-topic-feature > img { min-height: 0; aspect-ratio: 1.75 / 1; }
  .sections-page .hot-topic-feature-copy { gap: 6px; }
  .sections-page .hot-topic-feature-copy strong { font-size: 25px; }
  .sections-page .hot-topic-row { grid-template-columns: 22px 60px minmax(0, 1fr) 14px; }
  .sections-page .hot-topic-row > img { width: 60px; height: 40px; }
  .sections-page .hot-topic-copy strong { font-size: 14px; }
  .sections-page .hot-topic-arrow,
  .sections-page .hot-topic-row time { grid-column: auto; grid-row: auto; }
}
@media (max-width: 540px) {
  .sections-page .sections-note { display: none; }
  .sections-page .hot-topics-more { font-size: 10px; }
  .sections-page .sections-heading-row h1 { font-size: 32px; line-height: .98; letter-spacing: -.045em; }
  .sections-page .sections-heading-row p { font-size: 13px; }
  .sections-page .sections-section-heading h2 { font-size: 23px; }
  .sections-page .hot-topic-feature-copy strong { font-size: 23px; }
  .sections-page .section-board-card { grid-template-columns: 50px minmax(0, 1fr); gap: 7px; min-height: 78px; padding-right: 14px; }
  .sections-page .section-card-media { width: 50px; }
  .sections-page .section-card-body strong,
  .sections-page .section-card-body small { overflow: visible; text-overflow: clip; white-space: normal; overflow-wrap: anywhere; }
  .sections-page .section-card-body small { line-height: 1.2; }
  .sections-page .section-card-arrow { font-size: 18px; }
  .sections-page .hot-topic-copy { width: 100%; }
  .sections-page .hot-topic-copy strong { overflow: visible; text-overflow: clip; overflow-wrap: anywhere; }
  .sections-page .hot-topic-row time { white-space: normal; }
  .sections-page .active-now-strip { flex-wrap: wrap; }
  html[lang="en"] .sections-page .section-board-card { grid-template-columns: 42px minmax(0, 1fr); gap: 6px; padding-right: 12px; }
  html[lang="en"] .sections-page .section-card-media { width: 42px; }
  html[lang="en"] .sections-page .section-card-body strong { font: 700 10px/1.15 var(--body); letter-spacing: 0; overflow-wrap: normal; word-break: normal; }
  html[lang="en"] .sections-page .section-card-body small { font-size: 7px; letter-spacing: 0; }
}
@media (max-width: 370px) {
  .sections-page .section-board-grid { grid-template-columns: 1fr; }
  .sections-page .section-board-card { grid-template-columns: 58px minmax(0, 1fr); min-height: 64px; }
  .sections-page .section-card-media { width: 58px; }
  html[lang="en"] .sections-page .section-board-card { grid-template-columns: 58px minmax(0, 1fr); gap: 8px; padding-right: 18px; }
  html[lang="en"] .sections-page .section-card-media { width: 58px; }
  html[lang="en"] .sections-page .section-card-body strong { font-size: 11px; }
  .sections-page .hot-topic-row { grid-template-columns: 18px 52px minmax(0, 1fr) 12px; gap: 7px; }
  .sections-page .hot-topic-row > img { width: 52px; height: 38px; }
  .sections-page .hot-topic-number { font-size: 18px; }
}

/* Chinese typography: keep editorial headings, but use one CJK UI face for
   navigation and compact content. The Latin display face has no CJK glyphs,
   and its tight line boxes made the fallback characters appear displaced. */
html[lang="zh-CN"] .sections-page {
  --body: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  --display: "Songti SC", "Noto Serif CJK SC", "Source Han Serif SC", serif;
}
html[lang="zh-CN"] .sections-page .nav-link,
html[lang="zh-CN"] .sections-page .drawer-link {
  font-family: var(--body);
  font-weight: 600;
  line-height: 1.4;
  letter-spacing: 0;
}
html[lang="zh-CN"] .sections-page .sections-heading-row h1 { line-height: 1.16; letter-spacing: 0; }
html[lang="zh-CN"] .sections-page .sections-board > h2 { line-height: 1.3; letter-spacing: 0; }
html[lang="zh-CN"] .sections-page .sections-section-heading { align-items: center; }
html[lang="zh-CN"] .sections-page .sections-section-heading h2 { line-height: 1.25; letter-spacing: 0; }
html[lang="zh-CN"] .sections-page .section-card-body { gap: 2px; }
html[lang="zh-CN"] .sections-page .section-card-body strong {
  font-family: var(--body);
  font-weight: 600;
  line-height: 1.35;
  letter-spacing: 0;
}
html[lang="zh-CN"] .sections-page .section-card-body > span,
html[lang="zh-CN"] .sections-page .section-card-body small {
  font-family: var(--body);
  line-height: 1.4;
  letter-spacing: 0;
}
html[lang="zh-CN"] .sections-page .hot-topic-feature-copy strong { line-height: 1.22; letter-spacing: 0; }
html[lang="zh-CN"] .sections-page .hot-topic-number,
html[lang="zh-CN"] .sections-page .hot-topic-copy strong,
html[lang="zh-CN"] .sections-page .active-now-strip strong {
  font-family: var(--body);
  line-height: 1.35;
  letter-spacing: 0;
}
html[lang="zh-CN"] .sections-page .hot-topic-copy small,
html[lang="zh-CN"] .sections-page .hot-topic-copy time,
html[lang="zh-CN"] .sections-page .hot-topic-feature-copy small,
html[lang="zh-CN"] .sections-page .hot-topic-feature-bottom time { line-height: 1.4; letter-spacing: 0; }
@media (min-width: 901px) {
  html[lang="zh-CN"] .sections-page .section-card-body > span { font-size: 11px; }
  html[lang="zh-CN"] .sections-page .section-card-body small { font-size: 10px; }
}
@media (max-width: 900px) {
  html[lang="zh-CN"] .sections-page .section-card-body small { font-size: 9px; }
}
