/* ==========================================================================
   site.css — 爱游戏赛事 · 高原数据观测站
   共享外壳：reset / 变量 / 中文排版 / 命令栏 / 页脚 / 通用模块
   ========================================================================== */

/* ---------- 1. Reset ---------- */
*,
*::before,
*::after { box-sizing: border-box; }

html {
  -webkit-text-size-adjust: 100%;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: var(--night);
  color: var(--white);
  font-family: var(--font-body);
  font-size: 17px;
  line-height: 1.85;
  font-weight: 400;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

img,
svg,
video { display: block; max-width: 100%; height: auto; }

h1, h2, h3, h4, p, figure, blockquote, dl, dd { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
table { border-collapse: collapse; width: 100%; }
th { text-align: left; }
strong { font-weight: 900; }

:focus-visible {
  outline: 3px solid var(--corner);
  outline-offset: 3px;
}

::selection {
  background: var(--blue);
  color: var(--white);
}

/* ---------- 2. 变量 ---------- */
:root {
  /* 色彩 */
  --night: #0D1230;
  --ink: #06080F;
  --night-2: #1A2350;
  --paper: #F3EDDF;
  --paper-2: #E0D6C0;
  --white: #F8FAFF;
  --blue: #2F6BE8;
  --blue-lift: #6E9BFF;
  --red: #E04A2F;
  --net: #14C29A;
  --foreign: #F2703C;
  --corner: #F6C542;
  --muted: #7C86A8;
  --muted-ink: #4C5578;

  /* 字体 */
  --font-display: "Noto Sans SC", "Source Han Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, sans-serif;
  --font-body: "Noto Sans SC", "Source Han Sans SC", "PingFang SC", "Microsoft YaHei", system-ui, -apple-system, sans-serif;
  --font-mono: "IBM Plex Mono", "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  /* 结构与节奏 */
  --bw: 3px;
  --shadow: 6px 6px 0 var(--ink);
  --cmd-h: 56px;
  --gut: 24px;
  --measure: 68ch;
  --ease: cubic-bezier(.22, .61, .36, 1);
}

/* ---------- 3. 中文排版与通用容器 ---------- */
.wrap {
  width: min(1320px, 100% - 32px);
  margin-inline: auto;
}

.wrap--narrow {
  width: min(880px, 100% - 32px);
  margin-inline: auto;
}

.band {
  position: relative;
  padding: clamp(48px, 7vw, 112px) 0;
}

.band--night { background: var(--night); color: var(--white); }
.band--mid   { background: var(--night-2); color: var(--white); }
.band--paper { background: var(--paper); color: var(--ink); }

.band--paper .seal-note { color: var(--muted-ink); }
.band--paper .timeline-rail { border-left-color: var(--paper-2); }
.band--paper .timeline-rail__item::before { border-color: var(--paper); background: var(--paper-2); }
.band--paper .timeline-rail__item.is-current::before { background: var(--net); }

.grid-texture { position: relative; }
.grid-texture::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(to right, rgba(248, 250, 255, .05) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(248, 250, 255, .05) 1px, transparent 1px);
  background-size: 24px 24px;
}

#main-content { scroll-margin-top: calc(var(--cmd-h) + 16px); }

/* ---------- 4. 跳至主要内容 ---------- */
.skip-link {
  position: absolute;
  left: 12px;
  top: -72px;
  z-index: 90;
  padding: 10px 16px;
  background: var(--corner);
  color: var(--ink);
  font-size: 14px;
  font-weight: 900;
  letter-spacing: .06em;
  border: var(--bw) solid var(--ink);
  transition: top .12s var(--ease);
}
.skip-link:focus { top: 10px; }

/* ---------- 5. 命令栏 ---------- */
.cmdbar {
  position: sticky;
  top: 0;
  z-index: 60;
  background: var(--ink);
  color: var(--white);
  border-bottom: var(--bw) solid var(--night-2);
}

.cmdbar__inner {
  width: min(1320px, 100% - 32px);
  margin-inline: auto;
  min-height: var(--cmd-h);
  display: flex;
  align-items: center;
  gap: 18px;
}

.cmdbar__brand {
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 0 0 auto;
  padding: 6px 0;
}

.cmdbar__mark {
  width: 22px;
  height: 22px;
  border: var(--bw) solid var(--white);
  position: relative;
  flex: 0 0 auto;
}
.cmdbar__mark::after {
  content: "";
  position: absolute;
  inset: 4px;
  background: var(--net);
}

.cmdbar__name {
  display: flex;
  flex-direction: column;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: .08em;
  line-height: 1.1;
}
.cmdbar__name em {
  font-style: normal;
  font-weight: 300;
  font-size: 10px;
  letter-spacing: .16em;
  color: var(--muted);
  margin-top: 3px;
}

.cmdbar__panel {
  flex: 1 1 auto;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 18px;
}

.cmdbar__nav { flex: 0 1 auto; }

.nav-list {
  display: flex;
  align-items: center;
  gap: 2px;
}

.nav-list__link {
  display: inline-block;
  padding: 8px 10px;
  font-size: 13px;
  letter-spacing: .06em;
  color: rgba(248, 250, 255, .78);
  border-bottom: var(--bw) solid transparent;
  transition: color .12s var(--ease), border-color .12s var(--ease);
}
.nav-list__link:hover { color: var(--white); }
.nav-list__link[aria-current="page"] {
  color: var(--blue-lift);
  border-bottom-color: var(--blue);
}

.cmdbar__side {
  display: flex;
  align-items: center;
  gap: 16px;
  flex: 0 0 auto;
}

.jump-list {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-left: 16px;
  border-left: 1px solid var(--night-2);
}

.jump-list__link {
  display: inline-flex;
  align-items: center;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .06em;
  color: rgba(248, 250, 255, .82);
  padding: 4px 0;
  border-bottom: 2px solid transparent;
  transition: color .12s var(--ease), border-color .12s var(--ease);
}
.jump-list__link:hover { color: var(--white); border-bottom-color: var(--muted); }

.status-lamp {
  display: flex;
  align-items: center;
  gap: 8px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .04em;
  color: var(--muted);
  white-space: nowrap;
}

.status-lamp__dot {
  width: 8px;
  height: 8px;
  background: var(--net);
  border-radius: 50%;
  animation: lamp-breathe 8s ease-in-out infinite;
}

@keyframes lamp-breathe {
  0%, 100% { transform: translateY(0); opacity: .65; }
  50%      { transform: translateY(-2px); opacity: 1; }
}

.cmdbar__progress {
  position: absolute;
  left: 0;
  bottom: calc(var(--bw) * -1);
  height: var(--bw);
  width: 0;
  background: var(--blue);
  transition: width .1s linear;
}

.cmdbar.is-condensed .cmdbar__inner { min-height: 52px; }

/* 移动端开关 */
.nav-toggle {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  border: 2px solid var(--night-2);
  color: var(--white);
  font-size: 12px;
  letter-spacing: .1em;
  margin-left: auto;
}
.nav-toggle__bars {
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.nav-toggle__bars i {
  display: block;
  width: 16px;
  height: 2px;
  background: var(--white);
}
.cmdbar[data-open] .nav-toggle { border-color: var(--blue); }
.cmdbar[data-open] .nav-toggle__bars i:nth-child(1) { transform: translateY(5px) rotate(45deg); }
.cmdbar[data-open] .nav-toggle__bars i:nth-child(2) { opacity: 0; }
.cmdbar[data-open] .nav-toggle__bars i:nth-child(3) { transform: translateY(-5px) rotate(-45deg); }

/* ---------- 6. 页脚 ---------- */
.site-foot {
  position: relative;
  overflow: hidden;
  background: var(--ink);
  color: var(--white);
  border-top: var(--bw) solid var(--night-2);
  padding: clamp(40px, 6vw, 76px) 0 28px;
}

.foot__wrap { position: relative; z-index: 1; }

.flag-strip {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  display: flex;
}
.flag-strip__band {
  flex: 1 1 0;
  height: 4px;
  animation: flag-breathe 8s ease-in-out infinite;
}
.flag-strip__band--blue   { background: var(--blue);   animation-delay: 0s; }
.flag-strip__band--white  { background: var(--white);  animation-delay: .4s; }
.flag-strip__band--red    { background: var(--red);    animation-delay: .8s; }
.flag-strip__band--green  { background: var(--net);    animation-delay: 1.2s; }
.flag-strip__band--yellow { background: var(--corner); animation-delay: 1.6s; }

@keyframes flag-breathe {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(2px); }
}

.foot__top {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 32px;
}

.foot__mark {
  font-size: 18px;
  font-weight: 900;
  letter-spacing: .1em;
}
.foot__tagline {
  margin-top: 8px;
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: .12em;
  color: var(--net);
}
.foot__summary {
  margin-top: 16px;
  max-width: 38ch;
  font-size: 14px;
  line-height: 1.8;
  color: rgba(248, 250, 255, .72);
}

.foot__col-title {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: .14em;
  color: var(--muted);
  padding-bottom: 8px;
  margin-bottom: 14px;
  border-bottom: 1px solid var(--night-2);
}

.foot__list li { margin: 9px 0; }
.foot__link {
  font-size: 14px;
  color: rgba(248, 250, 255, .82);
  border-bottom: 1px solid transparent;
  transition: color .12s var(--ease), border-color .12s var(--ease);
}
.foot__link:hover { color: var(--white); border-bottom-color: var(--blue-lift); }

.foot__bottom {
  margin-top: clamp(32px, 5vw, 56px);
  padding-top: 20px;
  border-top: var(--bw) solid var(--night-2);
  display: grid;
  gap: 10px;
}

.foot__contact {
  font-family: var(--font-mono);
  font-size: 13px;
  letter-spacing: .02em;
  color: var(--white);
}

.foot__note {
  font-size: 12px;
  line-height: 1.75;
  letter-spacing: .02em;
  color: var(--muted);
  max-width: 78ch;
}

.foot__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 24px;
  margin-top: 4px;
  font-family: var(--font-mono);
  font-size: 12px;
  color: var(--muted);
}

.foot__ending {
  margin-top: 6px;
  padding-left: 12px;
  border-left: 4px solid var(--corner);
  font-size: 12px;
  letter-spacing: .16em;
  color: var(--paper-2);
}

/* ---------- 7. 通用按钮 ---------- */
.btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  font-family: var(--font-body);
  font-size: 14px;
  font-weight: 900;
  letter-spacing: .08em;
  border: var(--bw) solid var(--ink);
  box-shadow: var(--shadow);
  transition: transform .12s var(--ease), box-shadow .12s var(--ease);
}
.btn:hover { transform: translate(-2px, -2px); box-shadow: 8px 8px 0 var(--ink); }
.btn:active { transform: translate(0, 0); box-shadow: 3px 3px 0 var(--ink); }

.btn--primary { background: var(--blue); color: var(--white); }
.btn--paper   { background: var(--paper); color: var(--ink); }
.btn--ghost   { background: transparent; color: var(--white); border-color: var(--white); box-shadow: 6px 6px 0 var(--night-2); }
.btn--ghost:hover { box-shadow: 8px 8px 0 var(--night-2); }

/* ---------- 8. 面包屑 ---------- */
.crumbs {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: .06em;
  color: var(--muted);
}
.crumbs__item + .crumbs__item::before {
  content: "/";
  margin-right: 8px;
  color: var(--muted);
}
.crumbs__item a:hover { color: var(--white); }
.band--paper .crumbs { color: var(--muted-ink); }
.band--paper .crumbs__item a:hover { color: var(--ink); }
.crumbs [aria-current="page"] { color: var(--blue-lift); }
.band--paper .crumbs [aria-current="page"] { color: var(--blue); }

/* ---------- 9. 正文排版容器 ---------- */
.prose {
  max-width: var(--measure);
  font-size: 17px;
  line-height: 1.85;
}
.prose p { margin: 0 0 1.1em; }
.prose h2 {
  margin: 2.2em 0 .6em;
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(22px, 2.4vw, 30px);
  letter-spacing: .06em;
  line-height: 1.3;
}
.prose h3 {
  margin: 1.8em 0 .5em;
  font-size: 19px;
  font-weight: 900;
  letter-spacing: .04em;
}
.prose ul,
.prose ol { margin: 0 0 1.2em; padding-left: 1.2em; }
.prose ul { list-style: square; }
.prose ol { list-style: decimal; }
.prose li { margin: .35em 0; }
.prose a {
  color: var(--blue-lift);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.band--paper .prose a { color: var(--blue); }
.prose small { font-size: 12px; color: var(--muted); }
.band--paper .prose small { color: var(--muted-ink); }

/* ---------- 10. 页头组 ---------- */
.page-head { display: grid; gap: 14px; max-width: 72ch; }
.page-head__eyebrow {
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: .18em;
  color: var(--blue-lift);
  text-transform: uppercase;
}
.band--paper .page-head__eyebrow { color: var(--blue); }
.page-head__title {
  font-family: var(--font-display);
  font-weight: 900;
  font-size: clamp(28px, 3.6vw, 44px);
  letter-spacing: .08em;
  line-height: 1.25;
}
.page-head__lead {
  font-size: 16px;
  line-height: 1.85;
  color: rgba(248, 250, 255, .78);
  max-width: 62ch;
}
.band--paper .page-head__lead { color: var(--muted-ink); }

/* ---------- 11. 网格 ---------- */
.grid12 {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--gut);
}
.span-2  { grid-column: span 2; }
.span-3  { grid-column: span 3; }
.span-4  { grid-column: span 4; }
.span-5  { grid-column: span 5; }
.span-6  { grid-column: span 6; }
.span-7  { grid-column: span 7; }
.span-8  { grid-column: span 8; }
.span-9  { grid-column: span 9; }
.span-12 { grid-column: span 12; }
.rail  { grid-column: span 3; }
.panel { grid-column: span 9; }

/* ---------- 12. 模块：锚点数字 ---------- */
.anchor-number { display: block; }
.anchor-number__value {
  display: block;
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  font-size: clamp(72px, 14vw, 220px);
  line-height: .86;
  letter-spacing: -.02em;
  color: var(--white);
}
.band--paper .anchor-number__value { color: var(--ink); }
.anchor-number__label {
  display: block;
  margin-top: 14px;
  font-size: 14px;
  letter-spacing: .06em;
  color: rgba(248, 250, 255, .78);
}
.band--paper .anchor-number__label { color: var(--muted-ink); }
.anchor-number__rule {
  height: var(--bw);
  margin-top: 16px;
  background: var(--net);
}
.anchor-number--net .anchor-number__rule { background: var(--net); }
.anchor-number--foreign .anchor-number__rule { background: var(--foreign); }
.anchor-number--corner .anchor-number__rule { background: var(--corner); }

/* ---------- 13. 模块：赛季时间轴 ---------- */
.timeline-rail {
  border-left: var(--bw) solid var(--night-2);
  padding-left: 16px;
}
.timeline-rail__item {
  position: relative;
  padding: 7px 0;
  font-family: var(--font-mono);
  font-size: 13px;
  letter-spacing: .06em;
  color: var(--muted);
  transition: color .12s var(--ease);
}
.timeline-rail__item::before {
  content: "";
  position: absolute;
  left: -21px;
  top: 50%;
  width: 9px;
  height: 9px;
  background: var(--night-2);
  border: 2px solid var(--night);
  transform: translateY(-50%);
}
.timeline-rail__item.is-current { color: var(--white); }
.timeline-rail__item.is-current::before { background: var(--net); }
.timeline-rail__link { display: block; }

/* ---------- 14. 模块：口径双栏 ---------- */
.split-dial { display: block; }
.split-dial__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  border: var(--bw) solid var(--ink);
  background: var(--ink);
}
.split-dial__tab {
  flex: 1 1 140px;
  padding: 12px 16px;
  font-size: 13px;
  font-weight: 900;
  letter-spacing: .08em;
  color: var(--white);
  border-right: var(--bw) solid var(--ink);
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
.split-dial__tab:last-child { border-right: 0; }
.split-dial__tab[aria-selected="true"] { background: var(--paper); color: var(--ink); }
.split-dial__panel {
  display: none;
  padding: 20px;
  border: var(--bw) solid var(--ink);
  border-top: 0;
  background: var(--paper);
  color: var(--ink);
}
.split-dial__panel.is-open { display: block; animation: dial-in .24s var(--ease) both; }

@keyframes dial-in {
  from { opacity: 0; transform: translateX(-8px); }
  to   { opacity: 1; transform: translateX(0); }
}

/* ---------- 15. 模块：赛季区间账表 ---------- */
.ledger {
  width: 100%;
  background: var(--paper);
  color: var(--ink);
  border: var(--bw) solid var(--ink);
  box-shadow: var(--shadow);
  font-size: 15px;
}
.ledger caption {
  caption-side: top;
  text-align: left;
  padding: 0 0 10px;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: .12em;
  color: var(--muted-ink);
}
.ledger th {
  padding: 11px 14px;
  background: var(--paper-2);
  font-family: var(--font-mono);
  font-size: 13px;
  font-weight: 400;
  letter-spacing: .06em;
  border-bottom: var(--bw) solid var(--ink);
}
.ledger td {
  padding: 11px 14px;
  border-bottom: 1px solid var(--paper-2);
  vertical-align: top;
}
.ledger tbody tr:nth-child(even) { background: var(--paper-2); }
.ledger tbody tr:last-child td { border-bottom: 0; }
.ledger .num {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
  text-align: right;
  white-space: nowrap;
}

/* ---------- 16. 模块：注记块 ---------- */
.seal-note {
  padding: 10px 0 10px 14px;
  border-left: var(--bw) solid var(--blue);
  font-size: 12px;
  line-height: 1.75;
  letter-spacing: .02em;
  color: var(--muted);
}
.seal-note--red { border-left-color: var(--red); }
.seal-note--yellow { border-left-color: var(--corner); }
.seal-note--net { border-left-color: var(--net); }
.seal-note strong { color: var(--white); }
.band--paper .seal-note strong { color: var(--ink); }

/* ---------- 17. 模块：信息板组 ---------- */
.bento-cluster {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: var(--gut);
}
.bento-cluster__cell {
  grid-column: span 3;
  padding: 20px;
  border: var(--bw) solid var(--ink);
  background: var(--night-2);
  color: var(--white);
  box-shadow: var(--shadow);
}
.bento-cluster__cell--anchor { grid-column: span 6; }
.bento-cluster__cell--note {
  grid-column: span 2;
  background: transparent;
  border: 0;
  box-shadow: none;
  padding: 4px 0;
}

/* ---------- 18. 色标与标签 ---------- */
.flag-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 6px;
  vertical-align: middle;
  border: 1px solid var(--ink);
  flex: 0 0 auto;
}
.flag-dot--net     { background: var(--net); }
.flag-dot--foreign { background: var(--foreign); }
.flag-dot--corner  { background: var(--corner); }
.flag-dot--blue    { background: var(--blue); }
.flag-dot--red     { background: var(--red); }

.tag {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 3px 9px;
  font-family: var(--font-mono);
  font-size: 12px;
  letter-spacing: .04em;
  background: var(--paper);
  color: var(--ink);
  border: 2px solid var(--ink);
}
.tag--net     { border-left: 6px solid var(--net); }
.tag--foreign { border-left: 6px solid var(--foreign); }
.tag--corner  { border-left: 6px solid var(--corner); }
.tag--red     { border-left: 6px solid var(--red); }
.tag--ghost {
  background: transparent;
  color: var(--white);
  border-color: var(--night-2);
}

/* ---------- 19. 图片容器基础规则 ---------- */
.media-frame {
  position: relative;
  display: block;
  border: var(--bw) solid var(--ink);
  box-shadow: var(--shadow);
  background: var(--night-2);
  overflow: hidden;
}
.media-frame img,
.media-frame__img,
.media-frame__ph {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  display: block;
  background: var(--night-2);
}
.media-frame--wide img,
.media-frame--wide .media-frame__img,
.media-frame--wide .media-frame__ph { aspect-ratio: 21 / 9; }
.media-frame--portrait img,
.media-frame--portrait .media-frame__img,
.media-frame--portrait .media-frame__ph { aspect-ratio: 4 / 5; }
.media-frame--square img,
.media-frame--square .media-frame__img,
.media-frame--square .media-frame__ph { aspect-ratio: 1 / 1; }

.media-frame__ph {
  background-image:
    linear-gradient(to right, rgba(248, 250, 255, .07) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(248, 250, 255, .07) 1px, transparent 1px);
  background-size: 24px 24px;
}

.media-frame__caption {
  padding: 8px 12px;
  background: var(--ink);
  color: var(--white);
  font-size: 12px;
  letter-spacing: .02em;
  line-height: 1.6;
}
.media-frame--paper {
  background: var(--paper-2);
  border-color: var(--ink);
}
.media-frame--paper .media-frame__caption { background: var(--ink); color: var(--white); }

/* ---------- 20. 显现动效 ---------- */
.reveal {
  opacity: 0;
  transform: translateY(14px);
  transition: opacity .5s var(--ease), transform .5s var(--ease);
}
.reveal.is-in { opacity: 1; transform: none; }

/* ---------- 21. 响应式 ---------- */
@media (max-width: 1200px) {
  .status-lamp { display: none; }
}

@media (max-width: 1040px) {
  .nav-toggle { display: inline-flex; }

  .cmdbar__panel {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 8px 16px 20px;
    background: var(--ink);
    border-top: var(--bw) solid var(--night-2);
    border-bottom: var(--bw) solid var(--night-2);
    max-height: calc(100vh - var(--cmd-h));
    overflow-y: auto;
  }

  .cmdbar[data-open] .cmdbar__panel { display: flex; }

  .nav-list {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
  }
  .nav-list__item { border-bottom: 1px solid var(--night-2); }
  .nav-list__link {
    display: block;
    padding: 14px 4px;
    font-size: 15px;
    border-bottom: 0;
    border-left: var(--bw) solid transparent;
  }
  .nav-list__link[aria-current="page"] {
    border-left-color: var(--blue);
    padding-left: 12px;
  }

  .cmdbar__side {
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
    margin-top: 16px;
  }
  .jump-list {
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
    padding-left: 4px;
    border-left: 0;
    border-top: 1px solid var(--night-2);
    padding-top: 14px;
  }
  .jump-list__link { font-size: 13px; }
  .status-lamp { display: flex; padding-left: 4px; }
}

@media (max-width: 900px) {
  .grid12 { grid-template-columns: repeat(6, 1fr); }
  .span-2, .span-3, .span-4, .span-5 { grid-column: span 6; }
  .span-6, .span-7, .span-8, .span-9, .span-12 { grid-column: span 6; }
  .rail, .panel { grid-column: span 6; }

  .bento-cluster { grid-template-columns: repeat(6, 1fr); }
  .bento-cluster__cell { grid-column: span 3; }
  .bento-cluster__cell--anchor { grid-column: span 6; }
  .bento-cluster__cell--note { grid-column: span 6; }

  .foot__top { grid-template-columns: 1fr 1fr; gap: 28px; }

  .ledger { display: block; overflow-x: auto; }
}

@media (max-width: 560px) {
  body { font-size: 16px; }
  .wrap, .wrap--narrow, .cmdbar__inner { width: min(1320px, 100% - 24px); }
  .cmdbar__name em { display: none; }
  .grid12 { grid-template-columns: 1fr; }
  .span-2, .span-3, .span-4, .span-5, .span-6,
  .span-7, .span-8, .span-9, .span-12, .rail, .panel { grid-column: span 1; }
  .bento-cluster { grid-template-columns: 1fr; }
  .bento-cluster__cell,
  .bento-cluster__cell--anchor,
  .bento-cluster__cell--note { grid-column: span 1; }
  .foot__top { grid-template-columns: 1fr; }
  .ledger { box-shadow: 4px 4px 0 var(--ink); }
}

/* ---------- 22. 降低动效偏好 ---------- */
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *,
  *::before,
  *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .001ms !important;
  }
  .reveal { opacity: 1; transform: none; }
  .flag-strip__band { animation: none; }
  .status-lamp__dot { animation: none; opacity: 1; }
}