/* ---------------------------------------------------------------------------
   RP5 · 中文 — shared skin for the four Chinese routes.

   Paper boards this implements (read 2026-09-09):
     /zh                       10ZN-0 · 115R-0 · 11BU-0 · 11HU-0
     /zh/qwen                  11NZ-0 · 11UW-0 · 1220-0 · 1291-0
     /zh/deepseek              12FZ-0 · 154Q-0 · 15B6-0 · 15HJ-0
     /zh/local-dictation-mac   12MC-0 · 12T0-0 · 12ZO-0 · 1369-0
     states & components       13CY-0

   The four pages are hand-written (no generator), so the skin lives here once
   instead of being pasted into each <style>. Everything is scoped under .zh so
   nothing here can reach the other ~200 pages that share /docs/docs.css.

   Three rules from 13CY-0 drive most of what looks unusual next to the English
   pages:
     · Chinese body copy runs 16px/30px (≈1.85), not the 16/26 English uses —
       dense CJK glyphs need the extra leading to stay scannable.
     · Full-width punctuation （）、。—— is content, never trimmed for fit, and
       line-break:strict keeps it off the start of a line.
     · Latin and numerals render in Inter; Chinese falls through per-glyph to
       PingFang SC. fonts.css ships Inter with a Latin-only unicode-range, so
       this fallback is per-glyph and costs no extra request.
--------------------------------------------------------------------------- */

.zh {
  --zh-page:#FFFFFF; --zh-band:#F6F7F5; --zh-card:#FFFFFF;
  --zh-note:#FCFBF9; --zh-thead:#FBFBFA;
  --zh-line:#DCE1E7; --zh-line-soft:#EFEEEB;
  --zh-ink:#0E1116; --zh-ink2:#56585C; --zh-ink3:#7B7E84;
  --zh-amber:#C9821F; --zh-amber-stroke:#EFA23A;
  --zh-term:#1D1F23; --zh-term-ok:#5FC7A0;
}
html[data-theme="dark"] .zh {
  --zh-page:#141619; --zh-band:#101215; --zh-card:#1D2024;
  --zh-note:#191B1E; --zh-thead:#191B1E;
  --zh-line:#2A2E34; --zh-line-soft:#26292E;
  --zh-ink:#F2F2F0; --zh-ink2:#A9ACB2; --zh-ink3:#8B9099;
  --zh-amber:#E5A544; --zh-term:#0B0D10;
}

/* 13CY-0 · 排版规则. The Latin faces come first so numerals, aliases and
   "rapid-mlx" keep the brand's shapes; every CJK codepoint misses Inter's
   unicode-range and lands on the first family that has it. PingFang SC is the
   macOS face the boards were drawn with; the rest cover Windows/Linux/Android
   so a Chinese reader off a Mac never falls back to a serif default. */
.zh {
  font-family:'Inter', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei',
    'Noto Sans CJK SC', 'Source Han Sans SC', system-ui, sans-serif;
  line-break:strict;
  color:var(--zh-ink2);
}

/* Full-bleed alternating bands. .blogwrap is deliberately not used: it caps
   the column at 760px and cannot go edge to edge. */
.zh { min-width:0; }
.zh-band { padding:34px 0; background:var(--zh-page); border-top:1px solid var(--zh-line); }
.zh-band.alt { background:var(--zh-band); }
.zh-hero { padding:44px 0 34px; border-top:0; }
.zh-col { max-width:820px; margin-inline:auto; padding-inline:48px; }

/* --- Type scale ------------------------------------------------------- */
.zh .zh-kicker { display:flex; align-items:center; gap:10px; font-size:13px;
  line-height:16px; margin:0 0 16px; }
.zh .zh-kicker a { color:var(--zh-amber); }
.zh .zh-kicker .sep { color:var(--zh-ink3); }
.zh .zh-kicker .here { color:var(--zh-ink2); }

.zh h1 { font-size:46px; line-height:58px; letter-spacing:-0.01em; font-weight:700;
  color:var(--zh-ink); margin:0 0 14px; border:0; padding:0; }
.zh .lede { font-size:17px; line-height:32px; color:var(--zh-ink2); margin:0 0 20px;
  max-width:none; }
.zh h2 { font-size:27px; line-height:35px; letter-spacing:-0.01em; font-weight:700;
  color:var(--zh-ink); margin:0 0 16px; border:0; padding:0; }
.zh h3 { font-size:17px; line-height:26px; font-weight:600; color:var(--zh-ink);
  margin:0 0 8px; }
.zh p { font-size:16px; line-height:30px; color:var(--zh-ink2); margin:0 0 14px;
  max-width:none; }
.zh p:last-child { margin-bottom:0; }
.zh ul, .zh ol { font-size:16px; line-height:30px; color:var(--zh-ink2);
  margin:0 0 14px 22px; }
.zh li { margin-bottom:6px; }
.zh b, .zh strong { color:var(--zh-ink); font-weight:600; }
.zh a { color:var(--zh-amber); }

/* Inline code sheds docs.css's amber pill — on these pages an inline code run
   is a value inside a sentence, and the pill fights the CJK line rhythm. */
.zh code:not(pre code) { font-family:var(--mono); font-size:.9em; color:var(--zh-ink);
  background:transparent; border:0; padding:0; }

/* --- 大陆网络说明 · the mainland-network callout (13CY-0) ----------------
   Its own block on all four routes, never merged into body copy. The 2px
   amber rule is what stops a reader skimming past the one operational note
   that decides whether their download works. */
.zh .note { display:block; background:var(--zh-note); border:1px solid var(--zh-line);
  border-left:2px solid var(--zh-amber-stroke); border-radius:9px; padding:18px 20px;
  margin:0; font-size:14.5px; line-height:27px; color:var(--zh-ink2); }
.zh .note b { color:var(--zh-ink); }

/* --- Cards ------------------------------------------------------------- */
.zh-grid { display:grid; gap:16px; grid-template-columns:repeat(2, minmax(0, 1fr)); }
.zh-cards { display:grid; gap:16px; grid-template-columns:repeat(3, minmax(0, 1fr)); }
.zh-pkg, .zh .card { display:flex; flex-direction:column; background:var(--zh-card);
  border:1px solid var(--zh-line); border-radius:10px; transition:border-color .12s ease; }
.zh-pkg { padding:20px; }
.zh .card { padding:18px; gap:8px; text-decoration:none; }
.zh-pkg:hover, .zh .card:hover { border-color:var(--zh-ink3); text-decoration:none;
  transform:none; box-shadow:none; }
.zh-pkg h3 { font-size:16px; line-height:20px; margin:0 0 10px; }
.zh-pkg .tag { font-family:var(--mono); font-size:10px; letter-spacing:.06em;
  text-transform:uppercase; color:var(--zh-ink3); font-weight:600; margin-left:7px; }
.zh-pkg p { font-size:13.5px; line-height:24px; margin:0 0 9px; }
.zh-pkg .zh-actions { display:flex; flex-wrap:wrap; align-items:center; gap:10px;
  margin-top:6px; }
.zh .btn { display:inline-block; background:var(--zh-ink); color:var(--zh-page);
  font-size:13.5px; font-weight:600; line-height:18px; padding:9px 15px; border-radius:8px; }
.zh .btn:hover { text-decoration:none; opacity:.9; }
.zh .alt-link { font-size:13.5px; font-weight:500; line-height:18px; color:var(--zh-amber); }
.zh .card .ctitle { font-size:15.5px; line-height:20px; font-weight:600; color:var(--zh-ink);
  margin:0; display:block; }
.zh .card .csub { font-size:13.5px; line-height:23px; color:var(--zh-ink2); flex:1 1 auto; }
.zh .card .cgo { font-size:13.5px; line-height:18px; font-weight:500; color:var(--zh-amber);
  margin-top:2px; }

/* --- 系统要求 · spec chips (4 / 2 / 1 per 13CY-0) ------------------------ */
.zh-spec { display:grid; gap:14px; grid-template-columns:repeat(4, minmax(0, 1fr)); }
.zh-spec div { background:var(--zh-card); border:1px solid var(--zh-line); border-radius:9px;
  padding:15px 17px; display:flex; flex-direction:column; gap:6px; }
.zh-spec dt { font-family:var(--mono); font-size:10px; letter-spacing:.09em; line-height:12px;
  color:var(--zh-ink3); }
.zh-spec dd { font-size:14.5px; line-height:23px; color:var(--zh-ink); margin:0; }

/* --- Command surface: dark, light icon, never amber (13CY-0) ------------
   The visible "$" is a prompt glyph only. data-cmd carries the payload, so
   what lands on the clipboard never contains it. */
.zh .cmd { display:flex; align-items:center; justify-content:space-between; gap:18px;
  background:var(--zh-term); border:0; border-radius:8px; padding:19px 18px 19px 22px;
  margin:0 0 14px; }
.zh .cmd:last-child { margin-bottom:0; }
.zh .cmd code:not(pre code) { flex:1; min-width:0; font-family:var(--mono); font-size:14px;
  line-height:20px; color:#FFFFFF; background:transparent; border:0; padding:0;
  overflow-wrap:anywhere; }
.zh .cmd code .p { color:#8A9099; user-select:none; }
.zh .copy-btn { flex-shrink:0; width:34px; height:34px; display:inline-flex;
  align-items:center; justify-content:center; padding:0; border-radius:7px;
  border:1px solid rgba(255,255,255,.16); background:rgba(255,255,255,.05);
  color:#FFFFFF; cursor:pointer; }
.zh .copy-btn:hover { background:rgba(255,255,255,.10); }
.zh .copy-btn:focus-visible { outline:2px solid #FFFFFF; outline-offset:2px; }
.zh .copy-btn svg { width:16px; height:16px; }
.zh .copy-btn .ic-done { display:none; }
.zh .copy-btn.is-done .ic-copy { display:none; }
.zh .copy-btn.is-done .ic-done { display:block; color:var(--zh-term-ok); }
.zh .copy-btn.is-fail { border-color:#FF6B5E; color:#FF6B5E; }
.zh .copy-fail { font-size:13px; line-height:22px; color:var(--zh-ink3); margin:8px 0 0; }
.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; }

/* Terminal transcript (serve output). Same surface, no copy control. */
.zh-term { background:var(--zh-term); border-radius:8px; padding:18px 22px;
  display:flex; flex-direction:column; gap:7px; overflow-x:auto; }
.zh-term span { font-family:var(--mono); font-size:14px; line-height:20px; color:#FFFFFF;
  white-space:pre; }
.zh-term .c { font-size:13px; line-height:16px; color:#6E7681; }
.zh-term .p { color:#8A9099; user-select:none; }
.zh-term .ok { font-size:13px; line-height:16px; color:var(--zh-term-ok); }

/* --- Tables (13CY-0 · 表格) --------------------------------------------
   One DOM at every width: a real <table> at ≥1024px, one card per row below.
   No column is ever dropped and the page never scrolls sideways — the mobile
   label comes from data-label on each cell, so the header text is not
   duplicated in the markup. */
.zh-t { width:100%; border-collapse:separate; border-spacing:0;
  border:1px solid var(--zh-line); border-radius:10px; overflow:hidden;
  background:var(--zh-card); }
.zh-t thead th { background:var(--zh-thead); font-family:var(--mono); font-size:9.5px;
  letter-spacing:.08em; line-height:12px; color:var(--zh-ink3); font-weight:400;
  text-align:left; padding:12px 18px; }
.zh-t tbody td { border-top:1px solid var(--zh-line-soft); padding:13px 18px;
  font-size:13.5px; line-height:22px; color:var(--zh-ink2); vertical-align:top; }
.zh-t tbody td:first-child { color:var(--zh-ink); }
.zh-t code, .zh-t .zh-alias { font-family:var(--mono); font-size:12.5px; line-height:22px;
  color:var(--zh-amber); background:transparent; border:0; padding:0; }
.zh-t a code { color:var(--zh-amber); }

@media (max-width:1023px) {
  .zh-t, .zh-t tbody, .zh-t tr, .zh-t td { display:block; }
  .zh-t { border:0; border-radius:0; background:transparent; }
  .zh-t thead { position:absolute; width:1px; height:1px; overflow:hidden;
    clip:rect(0 0 0 0); white-space:nowrap; }
  .zh-t tr { background:var(--zh-card); border:1px solid var(--zh-line);
    border-radius:10px; padding:14px 16px; margin-bottom:12px; }
  .zh-t tr:last-child { margin-bottom:0; }
  .zh-t tbody td { border-top:0; padding:7px 0; line-height:21px; }
  /* First cell is the card title — 内存档位 on the sizing tables, the model
     alias on the dictation table. It keeps no data-label. */
  .zh-t tbody td:first-child { padding:0 0 4px; font-size:15px; line-height:18px;
    font-weight:600; color:var(--zh-ink); }
  .zh-t tbody td:not(:first-child)::before { content:attr(data-label); display:block;
    font-family:var(--mono); font-size:9px; letter-spacing:.08em; line-height:12px;
    color:var(--zh-ink3); margin-bottom:3px; }
}

/* --- Responsive ---------------------------------------------------------
   1440 → 1024: the column stops being the constraint and the side gutter
   takes over. 1024 → 768: two-up grids collapse and tables become cards.
   Below 430: single column throughout and the h1 steps down again. */
@media (max-width:1023px) {
  .zh h1 { font-size:36px; line-height:46px; }
  .zh-grid { grid-template-columns:1fr; }
  .zh-cards { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  .zh-spec { grid-template-columns:repeat(2, minmax(0, 1fr)); }
}
@media (max-width:660px) {
  .zh-cards { grid-template-columns:1fr; }
}
@media (max-width:430px) {
  .zh-col { padding-inline:24px; }
  .zh h1 { font-size:27px; line-height:34px; }
  .zh-spec { grid-template-columns:1fr; }
  .zh .cmd { padding:16px 14px 16px 16px; gap:12px; }
  .zh .cmd code:not(pre code) { font-size:13px; }
}

/* 13CY-0 · 动效: both animations are confirmations, and neither is the only
   way to perceive its state — the copy button also swaps its icon and
   announces through a live region. */
@media (prefers-reduced-motion:reduce) {
  .zh-pkg, .zh .card { transition:none; }
}