@font-face {
  font-family: "Noto Sans SC";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("../fonts/noto-sans-sc-400.woff2") format("woff2");
}

@font-face {
  font-family: "Noto Sans SC";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("../fonts/noto-sans-sc-700.woff2") format("woff2");
}

:root {
  --paper: #faf9f6;
  --surface: #ffffff;
  --ink: #17191e;
  --muted: #5b6069;
  --navy: #1e2f5c;
  --seal: #b93a26;
  /* 控制台沿用原型 v3 的变量名（--red / --accent / --line-strong）。
     原先只定义了 --seal，导致 .console__group a[aria-current] 的强调色与
     退出按钮颜色在计算时取不到值。这里统一为别名，避免两套命名漂移。 */
  --red: #8b2f1d;
  --accent: #8b2f1d;
  --line-strong: #c9c5ba;
  --line: #d9d7cf;
  --max-width: 1120px;
  --font-sans: "Noto Sans SC", system-ui, sans-serif;
  --font-serif: Georgia, "Noto Sans SC", serif;
  --font-mono: ui-monospace, "Noto Sans SC", monospace;
}

* { box-sizing: border-box; }
html { color-scheme: light; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 16px/1.65 var(--font-sans); }
a { color: var(--navy); }
:where(a, button, input, select, textarea):focus-visible { outline: 3px solid var(--seal); outline-offset: 3px; }
.shell { width: min(var(--max-width), calc(100% - 40px)); margin-inline: auto; }
.skip-link { position: fixed; top: 8px; left: 8px; z-index: 10; transform: translateY(-150%); background: var(--ink); color: white; padding: 10px 14px; }
.skip-link:focus { transform: none; }
.masthead { position: relative; overflow: hidden; border-top: 4px solid var(--ink); border-bottom: 1px solid var(--line); background: var(--surface); }
.particle-field { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; }
.masthead__inner { position: relative; z-index: 1; min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.brand { display: flex; align-items: center; gap: 10px; color: var(--ink); text-decoration: none; }
.brand strong, .brand small { display: block; }
.brand small { color: var(--muted); font: 10px/1.4 var(--font-mono); letter-spacing: .18em; }
.brand__seal { width: 42px; height: 42px; display: grid; place-items: center; border: 2px solid var(--seal); color: var(--seal); font: 700 22px var(--font-serif); }
nav { display: flex; gap: 18px; flex-wrap: wrap; }
nav a { color: var(--ink); text-decoration: none; min-height: 44px; display: inline-flex; align-items: center; }
nav a[aria-current="page"] { color: var(--seal); border-bottom: 2px solid currentColor; }
.nav-toggle { display: none; width: 44px; height: 44px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); cursor: pointer; }
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after { display: block; width: 20px; height: 2px; margin-inline: auto; background: currentColor; content: ''; transition: transform 160ms ease, opacity 160ms ease; }
.nav-toggle span::before { transform: translateY(-6px); }
.nav-toggle span::after { transform: translateY(4px); }
.nav-toggle[aria-expanded="true"] span { background: transparent; }
.nav-toggle[aria-expanded="true"] span::before { transform: translateY(0) rotate(45deg); background: var(--ink); }
.nav-toggle[aria-expanded="true"] span::after { transform: translateY(-2px) rotate(-45deg); background: var(--ink); }
.currency-toggle, .language-toggle { flex: 0 0 auto; min-height: 44px; border: 1px solid var(--line); background: transparent; color: var(--ink); padding: 6px 10px; cursor: pointer; font: 600 12px/1 var(--font-mono); }
.account-link { min-height: 44px; display: inline-flex; align-items: center; color: var(--navy); white-space: nowrap; font-size: 13px; }
.page { min-height: calc(100vh - 160px); padding-block: 72px; }
.eyebrow { color: var(--navy); font: 600 12px/1.4 var(--font-mono); letter-spacing: .12em; }
h1 { max-width: 16ch; margin: 10px 0 16px; font: 800 44px/1.2 var(--font-serif); }
.lede { max-width: 680px; color: var(--muted); font-size: 18px; }
.model-note { max-width: 760px; padding-left: 16px; border-left: 3px solid var(--red); font-size: 17px; line-height: 1.75; }.model-facts { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); margin: 28px 0 0; border-top: 2px solid var(--ink); border-bottom: 1px solid var(--line); }.model-facts div { padding: 14px; border-right: 1px solid var(--line); }.model-facts div:last-child { border-right: 0; }.model-facts dt { color: var(--muted); font-size: 11px; }.model-facts dd { margin: 6px 0 0; overflow-wrap: anywhere; }
.status-panel { margin-top: 36px; border-top: 2px solid var(--ink); }
.status-panel div { display: grid; grid-template-columns: 140px 1fr; gap: 16px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.status-panel dt { color: var(--muted); }
.status-panel dd { margin: 0; font-family: var(--font-mono); overflow-wrap: anywhere; }
.request-id { margin-top: 28px; color: var(--muted); font-family: var(--font-mono); }
.footer { border-top: 2px solid var(--ink); padding-block: 22px; color: var(--muted); font-size: 13px; background: var(--surface); }
.hero-ledger { border-block: 3px double var(--ink); padding: 48px 0; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px 40px; align-items: end; }
.hero-ledger h1 { grid-column: 1; max-width: 18ch; }
.hero-ledger .lede { grid-column: 1; margin: 0; }
.action { grid-column: 2; grid-row: 1 / 4; align-self: center; display: inline-flex; min-height: 44px; align-items: center; padding: 8px 16px; background: var(--seal); color: white; text-decoration: none; }
.section-head { margin-top: 48px; padding-bottom: 12px; border-bottom: 2px solid var(--ink); display: flex; align-items: end; justify-content: space-between; gap: 24px; }
.section-head h2 { margin: 2px 0 0; font: 800 26px/1.2 var(--font-serif); }
.section-head p { margin: 0; color: var(--muted); }
.data-sheet { background: var(--surface); border-bottom: 1px solid var(--ink); overflow-x: auto; }
.data-sheet table { width: 100%; border-collapse: collapse; font-size: 14px; }
.data-sheet th, .data-sheet td { padding: 12px 10px; text-align: left; border-bottom: 1px solid var(--line); vertical-align: middle; }
.data-sheet th { color: var(--muted); font: 600 11px/1.4 var(--font-mono); text-transform: uppercase; }
.data-sheet tbody tr:hover { background: #f0f1f4; }
.number, .rank { text-align: right !important; font-family: var(--font-mono); font-variant-numeric: tabular-nums; }
.rank { color: var(--seal); font-weight: 700; }
.model-link { display: flex; flex-direction: column; color: var(--ink); text-decoration: none; min-width: 190px; }
.model-link small { color: var(--muted); }
.empty { padding: 28px; color: var(--muted); }
.back { display: inline-flex; min-height: 44px; align-items: center; }
.metric-grid { margin-top: 36px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 2px solid var(--ink); border-left: 1px solid var(--line); }
.metric { min-width: 0; padding: 18px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--surface); }
.metric span { display: block; color: var(--muted); font: 11px/1.4 var(--font-mono); overflow-wrap: anywhere; }
.metric strong { display: block; margin-top: 8px; font: 700 28px/1.1 var(--font-mono); }
.news-lead { margin-top: 40px; padding: 28px 0; border-bottom: 1px solid var(--ink); }
.news-lead h2 { max-width: 24ch; margin: 8px 0; font: 800 34px/1.25 var(--font-serif); }
.news-lead h2 a, .news-grid a, .article-list h2 a { color: var(--ink); text-decoration: none; }
.news-lead small, .news-grid time, .article-list footer, .article-meta { color: var(--muted); font-size: 13px; }
.news-lead footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 24px; color: var(--muted); font-size: 13px; }
.news-status { display: flex; flex-wrap: wrap; gap: 6px; }.news-status .importance { margin-left: 0; }
.news-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-bottom: 1px solid var(--ink); }
.news-grid article { padding: 20px; border-right: 1px solid var(--line); }
.news-grid article:nth-child(3n) { border-right: 0; }
.news-grid h3 { margin: 6px 0 16px; font: 700 18px/1.4 var(--font-serif); }
.line-nav { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0 32px; }
.line-nav a, .badge, .importance { display: inline-flex; min-height: 36px; align-items: center; padding: 4px 10px; border: 1px solid var(--line); text-decoration: none; font: 600 12px/1 var(--font-mono); }
.line-nav a { gap: 5px; }.line-nav a[aria-current="page"] { border-color: var(--seal); color: var(--seal); }
.badge { color: var(--navy); }.importance { color: var(--seal); margin-left: 6px; }
.article-list article { max-width: 820px; padding: 24px 0; border-top: 1px solid var(--line); }
.article-list h2 { margin: 10px 0; font: 750 24px/1.35 var(--font-serif); }
.article-list p { color: var(--muted); }
.article-meta { display: flex; flex-wrap: wrap; gap: 8px 20px; padding: 14px 0; border-block: 1px solid var(--line); }
.article-summary { max-width: 720px; margin: 36px 0; font-size: 18px; }
.article-summary h2 { font: 750 24px/1.3 var(--font-serif); }.copyright-note { margin-top: 24px; color: var(--muted); font-size: 13px; }
.compare-toolbar { display: flex; justify-content: flex-end; margin: 18px 0; }
.compare-toolbar .action[aria-disabled="true"] { opacity: .45; pointer-events: none; }
.action--inline { grid-column: auto; grid-row: auto; margin-top: 18px; }
.compare-chart { margin-top: 36px; border-top: 2px solid var(--ink); }
.chart-heading { display: flex; align-items: baseline; justify-content: space-between; gap: 16px; margin: 28px 0 6px; font: 750 20px/1.3 var(--font-serif); }
.chart-heading small { color: var(--muted); font: 11px/1.4 var(--font-mono); }
.chart-row { display: grid; grid-template-columns: 190px minmax(160px, 1fr) 64px; gap: 12px; align-items: center; min-height: 48px; border-bottom: 1px solid var(--line); }
.chart-label { min-width: 0; overflow-wrap: anywhere; }.chart-label strong small { display: block; color: var(--muted); }
.chart-track { height: 18px; background: repeating-linear-gradient(90deg, transparent 0 calc(20% - 1px), var(--line) calc(20% - 1px) 20%); border-inline: 1px solid var(--line); }
.chart-bar { height: 100%; min-width: 2px; background: var(--navy); transition: width 240ms ease-out; }
.chart-value { text-align: right; font: 600 12px/1 var(--font-mono); font-variant-numeric: tabular-nums; }
.chart-value small { display: block; margin-top: 4px; color: var(--seal); font: 10px/1.1 var(--font-mono); }.compare-details th small,.compare-details td small { display: block; color: var(--muted); font: 10px/1.4 var(--font-mono); }.compare-details td strong { display: block; }
.chart-axis { display: grid; grid-template-columns: 190px repeat(6, 1fr); gap: 0; padding: 10px 64px 10px 0; color: var(--muted); font: 10px/1 var(--font-mono); }
.chart-axis span:not(:first-child) { text-align: right; }.chart-note { max-width: 760px; color: var(--muted); font-size: 13px; }
.compare-details:focus-visible { outline: 3px solid var(--seal); outline-offset: 3px; }
.compare-details th:first-child { min-width: 190px; }
.compare-details td { min-width: 180px; }
.efficiency-chart { margin-top: 34px; }.efficiency-chart .section-head { margin-top: 0; }.scatter-frame { width: 100%; overflow-x: auto; background: var(--surface); border-bottom: 1px solid var(--ink); }.scatter-frame svg { display: block; width: 100%; min-width: 720px; height: auto; }.scatter-grid { stroke: var(--line); stroke-width: 1; stroke-dasharray: 3 5; }.scatter-axis { stroke: var(--ink); stroke-width: 1.5; }.scatter-tick,.scatter-axis-label { fill: var(--muted); font: 11px var(--font-mono); }.kill-line { fill: none; stroke: var(--seal); stroke-width: 2.5; stroke-linejoin: round; stroke-dasharray: 7 5; }.kill-line-label { fill: var(--seal); font: 700 11px var(--font-sans); }.scatter-point circle { fill: var(--navy); opacity: .42; stroke: var(--surface); stroke-width: 1; }.scatter-point--selected circle { fill: var(--seal); opacity: 1; stroke: var(--ink); stroke-width: 1.5; }.scatter-point text { fill: var(--ink); font: 700 11px var(--font-sans); paint-order: stroke; stroke: var(--surface); stroke-width: 4px; stroke-linejoin: round; }.scatter-point:focus circle { outline: none; stroke: var(--seal); stroke-width: 4; }.translation-pending { display: block; margin-top: 10px; color: var(--seal); font-size: 12px; }
.scatter-frame [hidden] { display: none; }
.filter-bar { display: flex; flex-wrap: wrap; align-items: end; gap: 14px; margin: 28px 0; padding: 16px 0; border-block: 1px solid var(--line); }
.filter-bar label { display: grid; gap: 5px; color: var(--muted); font-size: 12px; }
.filter-bar input, .filter-bar select, .filter-bar button { min-height: 44px; border: 1px solid var(--line); border-radius: 0; background: var(--surface); color: var(--ink); padding: 8px 12px; font: inherit; }
.filter-bar input { min-width: min(320px, 80vw); }.filter-bar button { border-color: var(--navy); background: var(--navy); color: white; cursor: pointer; }
.compare-picker .section-head { margin-top: 28px; }.compare-picker .filter-bar { margin-bottom: 12px; }.compare-picker .filter-bar label { flex: 1 1 240px; min-width: 0; }.compare-picker select { width: 100%; min-width: 0; max-width: 100%; }
.selected-models { display: flex; flex-wrap: wrap; gap: 8px; min-height: 44px; align-items: center; padding: 10px 0; }.selected-model { display: inline-flex; align-items: center; gap: 8px; min-width: 0; border: 1px solid var(--navy); background: var(--surface); padding-left: 10px; }.selected-model strong { overflow-wrap: anywhere; font-size: 13px; }.selected-model a { width: 38px; min-height: 38px; display: grid; place-items: center; border-left: 1px solid var(--line); color: var(--seal); text-decoration: none; font: 700 20px/1 var(--font-sans); }.empty-selection { margin: 0; color: var(--muted); font-size: 13px; }
.model-choice-list { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); max-height: 330px; overflow-y: auto; border-top: 1px solid var(--line); border-left: 1px solid var(--line); }.model-choice-list a { min-width: 0; display: flex; flex-direction: column; justify-content: center; min-height: 66px; padding: 9px 12px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--surface); color: var(--ink); text-decoration: none; }.model-choice-list strong { overflow-wrap: anywhere; font-size: 13px; }.model-choice-list small { color: var(--muted); }.model-choice-list a:hover { background: #f0f1f4; }.model-choice-list a[aria-pressed="true"] { border-left: 3px solid var(--seal); color: var(--seal); }.model-choice-list a[aria-disabled="true"] { opacity: .45; cursor: not-allowed; }
.model-choice-list a[hidden] { display: none; }
.leaderboard-filters input { min-width: 120px; max-width: 190px; }.leaderboard-filters .back { padding-inline: 8px; }.trend-cell { min-width: 180px; font-size: 11px; }.trend-cell span { display: block; white-space: nowrap; }
.model-catalog { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 2px solid var(--ink); border-left: 1px solid var(--line); }
.model-catalog article { min-width: 0; padding: 18px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); background: var(--surface); }
.model-catalog h2 { min-height: 3em; margin: 8px 0; font: 700 18px/1.45 var(--font-serif); overflow-wrap: anywhere; }.model-catalog h2 a { color: var(--ink); text-decoration: none; }
.model-catalog dl { margin: 0; }.model-catalog dl div { display: flex; justify-content: space-between; gap: 12px; padding-top: 6px; font-size: 12px; }.model-catalog dt { color: var(--muted); }.model-catalog dd { margin: 0; text-align: right; }
.search-results { list-style: none; margin: 0; padding: 0; }.search-results li { display: flex; justify-content: space-between; gap: 20px; padding: 12px 0; border-bottom: 1px solid var(--line); }.search-results span { color: var(--muted); font-size: 13px; text-align: right; }
.archive-day { display: grid; grid-template-columns: 150px 1fr; gap: 24px; border-top: 1px solid var(--line); }.archive-day h2 { margin: 0; padding: 18px 0; font: 700 18px/1.4 var(--font-mono); }.archive-day ul { list-style: none; margin: 0; padding: 0; }.archive-day li { display: grid; grid-template-columns: 48px 1fr 160px; gap: 12px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--line); }.archive-day small { color: var(--muted); text-align: right; }
.learning-path { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 38px; border-top: 2px solid var(--ink); }.learning-path section { padding: 22px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }.learning-path span { color: var(--seal); font: 700 13px/1 var(--font-mono); }.learning-path h2 { font: 700 21px/1.3 var(--font-serif); }
.inline-form { display: inline-flex; margin: 18px 10px 18px 0; }
.inline-form button, .comment-form button, .comment-list button, .danger-zone button { min-height: 44px; border: 1px solid var(--navy); background: var(--surface); color: var(--navy); padding: 8px 14px; cursor: pointer; font: inherit; }
.comment-form { max-width: 720px; display: grid; gap: 8px; margin: 28px 0; }
.comment-form textarea { min-height: 120px; resize: vertical; border: 1px solid var(--line); background: var(--surface); color: var(--ink); padding: 12px; font: inherit; }
.comment-form button { justify-self: start; background: var(--navy); color: white; }
.comment-list, .account-list { list-style: none; margin: 0; padding: 0; }
.comment-list li { max-width: 720px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.comment-list header, .comment-list footer { display: flex; justify-content: space-between; gap: 16px; align-items: center; color: var(--muted); font-size: 13px; }
.comment-list footer { justify-content: flex-start; }.comment-list footer form { margin: 0; }.comment-list button { min-height: 36px; padding: 4px 10px; }
.account-list li { display: grid; grid-template-columns: minmax(180px, 1fr) 2fr; gap: 24px; padding: 13px 0; border-bottom: 1px solid var(--line); }.account-list span { color: var(--muted); overflow-wrap: anywhere; }
.danger-zone { max-width: 720px; margin-top: 64px; padding: 24px 0; border-top: 3px double var(--seal); }.danger-zone h2 { color: var(--seal); }.danger-zone form { display: grid; gap: 12px; }.danger-zone button { justify-self: start; border-color: var(--seal); color: var(--seal); }
.price-history { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--ink); }.price-history li { display: grid; grid-template-columns: 170px 100px 1fr 1fr auto; gap: 14px; align-items: center; min-height: 54px; border-bottom: 1px solid var(--line); font-size: 13px; }.price-history time { color: var(--muted); font-family: var(--font-mono); }.price-history span { font-variant-numeric: tabular-nums; }
/* 后台记录行：按字段数量自适应换行。原先用固定列网格，字段数不同的表单会被压变形。 */
.admin-records { border-top: 2px solid var(--ink); }
.admin-record { display: flex; flex-wrap: wrap; align-items: end; gap: 10px 14px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.admin-record > strong { flex: 1 1 240px; min-width: 0; align-self: center; overflow-wrap: anywhere; }
.admin-record > span { flex: 1 1 220px; min-width: 0; align-self: center; overflow-wrap: anywhere; }
.admin-record > label { display: grid; gap: 4px; flex: 1 1 170px; min-width: 140px; color: var(--muted); font-size: 11px; }
.admin-record > label.admin-record__note { flex: 2 1 320px; }
.admin-record input, .admin-record select, .admin-record textarea, .admin-record button { min-height: 44px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); padding: 8px; width: 100%; }
.admin-record textarea { min-height: 88px; resize: vertical; }
.admin-record > button { flex: 0 0 auto; width: auto; min-width: 96px; border-color: var(--navy); background: var(--navy); color: white; cursor: pointer; }
.admin-record > button[disabled] { opacity: .5; cursor: not-allowed; }
.admin-record--compact > strong { flex: 0 1 200px; }
.admin-record--compact > label { flex: 1 1 150px; }
.admin-record--alias > strong { flex: 0 1 160px; }
.admin-record--alias > label { flex: 1 1 150px; }
.admin-record--translation > label { flex: 1 1 240px; }
.admin-model-group { border-bottom: 3px double var(--line); }.admin-model-group .admin-record { border-bottom-style: dashed; }.admin-record strong small { display: block; margin-top: 4px; color: var(--muted); font-weight: 400; }
.admin-record--translation textarea { min-height: 88px; resize: vertical; }

@media (max-width: 720px) {
  .shell { width: min(100% - 28px, var(--max-width)); }
  .masthead__inner { min-height: 68px; display: grid; grid-template-columns: minmax(0, 1fr) auto auto auto; align-items: center; padding-block: 10px; gap: 8px; }
  .nav-toggle { display: grid; place-items: center; }
  nav { grid-column: 1 / -1; width: 100%; display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 0; border-top: 1px solid var(--line); }
  nav a { padding-inline: 10px; border-bottom: 1px solid var(--line); }
  .has-js .nav-toggle[aria-expanded="false"] + nav { display: none; }
  .account-link { justify-self: end; }
  .page { padding-block: 44px; }
  h1 { font-size: 34px; }
  .status-panel div { grid-template-columns: 1fr; gap: 2px; }
  .hero-ledger { grid-template-columns: 1fr; padding: 34px 0; }
  .hero-ledger .action { grid-column: 1; grid-row: auto; justify-self: start; }
  .section-head { align-items: flex-start; flex-direction: column; gap: 6px; }
  .metric-grid { grid-template-columns: 1fr 1fr; }.model-facts { grid-template-columns: 1fr 1fr; }
  .data-sheet { overflow: visible; background: transparent; }
  .data-sheet thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .data-sheet tr { display: block; margin: 12px 0; padding: 10px 14px; background: var(--surface); border: 1px solid var(--line); }
  .data-sheet td { display: grid; grid-template-columns: minmax(90px, .7fr) minmax(0, 1.3fr); gap: 12px; text-align: right !important; border: 0; padding: 5px 0; overflow-wrap: anywhere; }
  .data-sheet td::before { content: attr(data-label); color: var(--muted); text-align: left; font: 11px/1.5 var(--font-mono); }
  .model-link { min-width: 0; align-items: flex-end; }
  .news-grid { grid-template-columns: 1fr; }
  .news-grid article { border-right: 0; border-bottom: 1px solid var(--line); }
  .chart-row { grid-template-columns: 110px minmax(110px, 1fr) 44px; gap: 8px; }
  .chart-axis { grid-template-columns: 110px repeat(6, 1fr); padding-right: 44px; }
  .chart-heading { align-items: flex-start; flex-direction: column; gap: 2px; }
  .data-sheet.compare-details { overflow-x: auto; background: var(--surface); overscroll-behavior-inline: contain; scrollbar-gutter: stable; }
  .compare-details table { min-width: max-content; font-size: 12px; }
  .compare-details thead { position: static; width: auto; height: auto; overflow: visible; clip: auto; }
  .compare-details tr { display: table-row; margin: 0; padding: 0; background: transparent; border: 0; }
  .compare-details th, .compare-details td { display: table-cell; min-width: 152px; padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: right !important; white-space: normal; }
  .compare-details th:first-child { position: sticky; left: 0; z-index: 1; min-width: 132px; max-width: 132px; text-align: left !important; background: var(--surface); box-shadow: 1px 0 var(--line); }
  .compare-details thead th:first-child { z-index: 2; }
  .compare-details td::before { content: none; }
  .model-catalog, .learning-path { grid-template-columns: 1fr; }
  .model-choice-list { grid-template-columns: 1fr 1fr; }
  .account-list li { grid-template-columns: 1fr; gap: 4px; }
  .price-history li { grid-template-columns: 1fr 1fr; padding: 12px 0; }.price-history time,.price-history a { grid-column: 1 / -1; }
  .admin-record > strong, .admin-record > span { flex: 1 1 100%; }.admin-record > label { flex: 1 1 100%; }
  .archive-day { grid-template-columns: 1fr; gap: 0; }.archive-day h2 { padding-bottom: 4px; }.archive-day li { grid-template-columns: 42px 1fr; }.archive-day small { grid-column: 2; text-align: left; }
  .search-results li { flex-direction: column; gap: 4px; }.search-results span { text-align: left; }
}

@media (max-width: 420px) { .metric-grid,.model-facts { grid-template-columns: 1fr; }.model-facts div { border-right: 0; border-bottom: 1px solid var(--line); }.model-choice-list { grid-template-columns: 1fr; } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}

/* 后台：翻译连接的分步指引 */
.setup-steps { list-style: none; margin: 8px 0 18px; padding: 0; display: grid; gap: 8px; }
.setup-steps li { border: 1px solid var(--line); border-left: 3px solid var(--line-strong, var(--line)); padding: 10px 12px; background: var(--paper, #fff); line-height: 1.6; }
.setup-steps li.done { border-left-color: var(--accent, #8b2f1d); }
.setup-steps code { background: rgba(0,0,0,0.04); padding: 1px 4px; }

/* 后台：进度条 */
.progress-block { border: 1px solid var(--line); padding: 12px 14px; margin-bottom: 14px; }
.progress-head { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
.progress-track { height: 10px; background: rgba(0,0,0,0.06); margin: 8px 0 6px; overflow: hidden; }
.progress-fill { height: 100%; background: var(--accent, #8b2f1d); transition: width .3s ease; }
.progress-block .chart-note { margin: 0; }

/* ===== 后台控制台：原型 v3 落地的外壳与表单系统 ===== */
.console { display: grid; grid-template-columns: 232px minmax(0, 1fr); min-height: 100vh; }
/* 侧栏固定：只让正文滚动，导航不跟着跑；侧栏自身超高时在栏内滚动。 */
.console__side { border-right: 1px solid var(--line); background: var(--surface); padding: 22px 0 18px; display: flex; flex-direction: column; gap: 4px; position: sticky; top: 0; align-self: start; height: 100vh; overflow-y: auto; overscroll-behavior: contain; }
.console__brand { padding: 0 20px 16px; border-bottom: 1px solid var(--line); margin-bottom: 12px; }
.console__brand b { display: block; font-size: 19px; letter-spacing: .06em; }
.console__brand small { color: var(--muted); font: 11px var(--font-mono); letter-spacing: .14em; text-transform: uppercase; }
.console__group { margin-bottom: 14px; }
/* 单列 + 分组线即可定位：十几个入口分两列反而降低扫读效率。 */
.console__group + .console__group { border-top: 1px solid var(--line); padding-top: 12px; }
.console__group > p { margin: 0 0 6px; padding: 0 20px; color: var(--muted); font: 600 10px/1 var(--font-mono); letter-spacing: .16em; text-transform: uppercase; }
.console__group a { display: flex; justify-content: space-between; gap: 8px; align-items: center; padding: 8px 20px; border-left: 3px solid transparent; font-size: 14px; }
.console__group a:hover { background: #F3F1EC; }
.console__group a[aria-current="page"] { border-left-color: var(--red); background: #F3F1EC; font-weight: 600; }
.console__group em { font: 11px var(--font-mono); font-style: normal; color: var(--muted); }
.console__foot { margin-top: auto; padding: 14px 20px 0; border-top: 1px solid var(--line); display: grid; gap: 6px; font-size: 13px; color: var(--muted); }
.console__foot .inline-form button { border: 0; background: none; color: var(--red); cursor: pointer; padding: 0; font: inherit; }
.console__main { min-width: 0; display: flex; flex-direction: column; }
.console__top { display: flex; justify-content: space-between; align-items: flex-end; gap: 20px; padding: 24px 32px 18px; border-bottom: 1px solid var(--line); background: var(--surface); }
.console__top h1 { margin: 6px 0 4px; font-size: 26px; letter-spacing: -.01em; }
.console__top p { margin: 0; color: var(--muted); font-size: 13px; max-width: 70ch; }
.console__actions { display: flex; gap: 10px; flex: 0 0 auto; }
.console__actions .btn, .console__actions a.btn { display: inline-flex; align-items: center; min-height: 44px; padding: 0 16px; border: 1px solid var(--line); background: var(--surface); }
.btn--ghost { border-color: var(--line); background: transparent; }
.console__content { padding: 22px 32px 64px; display: grid; gap: 20px; align-content: start; }
.console .card { border: 1px solid var(--line); background: var(--surface); }
.console .card__body { padding: 18px; }
.console .section-head { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin-bottom: 12px; }
.console .section-head h2, .console .section-head h3 { margin: 0; font-size: 17px; }
.console .section-head p { margin: 0; color: var(--muted); font-size: 12px; }
.console .admin-records { border-top: 1px solid var(--line); }
.console .filter-bar { margin: 0 0 14px; padding: 0 0 14px; }
@media (max-width: 900px) {
  .console { grid-template-columns: minmax(0, 1fr); }
  /* 手机上侧栏改成一排可横向滑动的入口，避免导航把正文挤到屏幕外。 */
  .console__side { border-right: 0; border-bottom: 1px solid var(--line); padding: 12px 0 0; display: block; position: static; height: auto; overflow: visible; }
  .console__group + .console__group { border-top: 0; padding-top: 0; }
  .console__brand { padding: 0 16px 10px; border-bottom: 0; margin-bottom: 6px; }
  .console__side nav { display: flex; gap: 0; overflow-x: auto; padding: 0 8px; }
  .console__group { margin: 0; display: flex; }
  .console__group > p { display: none; }
  .console__group a { padding: 10px 14px; white-space: nowrap; border-left: 0; border-bottom: 3px solid transparent; }
  .console__group a[aria-current="page"] { border-left: 0; border-bottom-color: var(--red); }
  .console__foot { display: flex; gap: 12px; align-items: center; padding: 10px 16px; border-top: 1px solid var(--line); margin-top: 10px; }
  .console__top { flex-direction: column; align-items: stretch; padding: 18px 20px; }
  .console__content { padding: 18px 20px 48px; }
}

/* 后台独立外壳：不再套对外站点的 masthead，控制台占满视口。 */
.console-body { background: var(--paper); }
.console-body .skip-link { z-index: 20; }

/* 登录 / 修改密码：独立的居中卡片，不显示读者导航。 */
.admin-auth-body { min-height: 100vh; display: grid; place-items: center; padding: 40px 20px; background: var(--paper); }
.admin-auth-body .page { min-height: 0; padding-block: 0; }
.admin-auth-body .admin-login { width: min(600px, 100%); }
.admin-auth-body .admin-login h1 { font-size: 32px; }
.admin-auth-body .admin-login .filter-bar { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 16px; align-items: end; border: 1px solid var(--line); background: var(--surface); padding: 20px; margin: 20px 0 0; }
.admin-auth-body .admin-login .filter-bar label { width: 100%; }
.admin-auth-body .admin-login .filter-bar input { width: 100%; min-width: 0; }
.admin-auth-body .admin-login .filter-bar button { grid-column: 1 / -1; }
@media (max-width: 520px) { .admin-auth-body .admin-login .filter-bar { grid-template-columns: 1fr; } }