/* 下载与事实 */
.get-actions,.plat-actions { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.get-actions { justify-content:center; margin-top:30px; }
.get-actions > *,.plat-actions > * { min-width:0; max-width:100%; }
.get-note { margin:14px 0 0; font-size:var(--fs-caption); line-height:20px; color:var(--text-muted); }
.get-note .ver { font-family:var(--font-mono); font-size:var(--fs-code); color:var(--text); }
.store-button { display:inline-flex; align-items:center; justify-content:center; gap:12px; min-height:56px; padding:10px 20px; border:1px solid var(--ink); border-radius:var(--r-btn); background:var(--ink); color:var(--on-ink); text-decoration:none; box-shadow:var(--shadow-ink); transition:background-color var(--speed),transform var(--speed); }
.store-button:hover { background:var(--ink-hover); color:var(--on-ink); transform:translateY(-1px); }
.store-button:active { transform:translateY(1px); }
.store-button svg { width:25px; height:29px; }
.store-button span { display:block; text-align:left; }
.store-button small { display:block; font-size:11px; line-height:1.4; }
.store-button strong { display:block; font-size:var(--fs-body); line-height:1.4; font-weight:650; }
.fact-row { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:8px; margin-top:24px; }
.fact-pill,.badge,.tag { display:inline-flex; align-items:center; gap:7px; max-width:100%; padding:6px 12px; border:1px solid var(--border); border-radius:var(--r-pill); background:var(--bg-panel); color:var(--text); font-size:12px; line-height:1.5; overflow-wrap:anywhere; text-decoration:none; }
.badge { background:var(--pill-cream); color:var(--accent-dark); border-color:var(--pill-cream-line); }
.tag { background:var(--bg); color:var(--text-muted); }
.badge svg,.fact-pill svg { width:14px; height:14px; }
.plat-grid { display:flex; flex-wrap:wrap; gap:20px; margin-top:32px; }
.plat-card { position:relative; flex:1 1 310px; min-width:0; max-width:100%; padding:32px; border:1px solid var(--border); border-radius:var(--r-section); background:var(--bg); color:var(--text); box-shadow:var(--shadow-float); scroll-margin-top:28px; }
.plat-card h3 { margin:12px 0; }
.plat-card p { color:var(--text-muted); font-size:var(--fs-small); }
.plat-card > svg { width:28px; height:28px; }
.plat-card::before { display:none; content:attr(data-mine); margin-bottom:14px; width:fit-content; padding:4px 10px; background:var(--pill-cream); color:var(--accent-dark); border:1px solid var(--pill-cream-line); border-radius:var(--r-pill); font-size:12px; }
html[data-visitor-os="ios"] .plat-card[data-plat="ios"] { order:-1; }
html[data-visitor-os="mac"] .plat-card[data-plat="mac"] { order:-1; }
html[data-visitor-os="windows"] .plat-card[data-plat="windows"] { order:-1; }
html[data-visitor-os="android"] .plat-card[data-plat="android"] { order:-1; }
html[data-visitor-os="linux"] .plat-card[data-plat="linux"] { order:-1; }
html[data-visitor-os="ios"] .plat-card[data-plat="ios"]::before,
html[data-visitor-os="mac"] .plat-card[data-plat="mac"]::before,
html[data-visitor-os="windows"] .plat-card[data-plat="windows"]::before,
html[data-visitor-os="android"] .plat-card[data-plat="android"]::before,
html[data-visitor-os="linux"] .plat-card[data-plat="linux"]::before { display:block; }
.wx-open-tip { position:fixed; z-index:90; bottom:24px; left:50%; transform:translateX(-50%); width:calc(100% - var(--gutter) * 2); max-width:520px; padding:18px 22px; border:1px solid var(--pill-cream-line); border-radius:var(--r-float); background:var(--pill-cream); color:var(--accent-dark); box-shadow:var(--shadow-float); font-size:var(--fs-small); }
.wx-open-tip button { min-width:44px; min-height:44px; border:1px solid var(--border); border-radius:var(--r-btn); background:var(--bg); color:var(--text); }

/* 对象索引：选项列与内容大面板 */
.object-index { display:grid; grid-template-columns:260px minmax(0,1fr); gap:48px; align-items:start; margin-top:48px; }
.object-tabs[role="tablist"] { display:flex; flex-direction:column; gap:10px; min-width:0; }
[role="tab"] { position:relative; display:flex; align-items:center; gap:12px; min-height:52px; padding:12px 18px; border:1px solid var(--transparent); border-radius:var(--r-pill); background:var(--transparent); color:var(--text-muted); text-align:left; font-size:var(--fs-small); font-weight:600; }
[role="tab"]:hover { color:var(--text); }
[role="tab"][aria-selected="true"] { background:var(--bg); color:var(--text); border-color:var(--border); box-shadow:var(--shadow-float); }
[role="tab"][aria-selected="true"]::after { content:""; flex-shrink:0; width:6px; height:6px; margin-left:auto; border-radius:var(--r-pill); background:var(--accent); color:var(--text); box-shadow:0 0 0 3px var(--dot-halo); }
.tab-token { display:inline-grid; place-items:center; width:26px; height:26px; flex-shrink:0; border:1px solid var(--border); border-radius:var(--r-mark); font:500 12px/1 var(--font-mono); color:var(--text); }
.tab-panel { position:relative; min-width:0; padding:48px; border:1px solid var(--border); border-radius:var(--r-section); background:var(--bg); color:var(--text); box-shadow:var(--shadow-float); overflow-x:clip; }
.tab-panel p { color:var(--text-muted); }
.tab-panel .interface-words { color:var(--accent-dark); font-family:var(--font-mono); font-size:var(--fs-caption); }
.panel-object { float:right; max-width:100%; margin:-12px -12px 24px 24px; padding:15px; border:1px solid var(--border); border-radius:var(--r-float); box-shadow:var(--shadow-float); transform:rotate(3deg); font:500 var(--fs-code)/1.7 var(--font-mono); overflow-wrap:anywhere; }
.tab-panel::after { content:""; display:block; clear:both; }

/* 文档与折叠内容 */
.toc { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:36px; padding:16px; border:1px solid var(--border); border-radius:var(--r-float); background:var(--bg); color:var(--text); }
.toc a { display:block; padding:9px 14px; border-radius:var(--r-pill); font-size:var(--fs-small); text-decoration:none; color:var(--text-muted); }
.toc a:hover,.toc a[aria-current="location"] { background:var(--pill-cream); color:var(--accent-dark); }
.toc-sticky { position:sticky; top:16px; z-index:8; }
.faq-list { display:grid; gap:12px; }
.faq-item { border:1px solid var(--border); border-radius:var(--r-float); background:var(--bg); color:var(--text); box-shadow:var(--shadow-xs); }
.faq-item summary { position:relative; list-style:none; cursor:pointer; padding:22px 54px 22px 24px; font-weight:650; line-height:1.5; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after { content:"+"; position:absolute; right:24px; top:21px; color:var(--accent); font-size:var(--fs-h3); font-weight:400; }
.faq-item[open] summary::after { content:"−"; }
.faq-answer { padding:0 24px 24px; color:var(--text-muted); }
.faq-answer > :last-child { margin-bottom:0; }
.term-card { padding:28px; border:1px solid var(--border); border-radius:var(--r-float); background:var(--bg); color:var(--text); }
.term-card dt { font-family:var(--font-mono); font-size:18px; font-weight:600; }
.term-card dd { margin:12px 0 0; color:var(--text-muted); font-size:var(--fs-small); }
.term-card .tag { margin-bottom:14px; }
.callout { margin:28px 0; padding:24px 28px; border:1px solid var(--pill-cream-line); border-left:3px solid var(--accent); border-radius:var(--r-inset); background:var(--tint-cream); color:var(--accent-dark); }
.callout > :last-child { margin-bottom:0; }
.callout strong { color:var(--text); }

/* 表格：正文内任意深度的裸表格也有横滑兜底。 */
.table-scroll { max-width:100%; min-width:0; overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--border); border-radius:var(--r-inset); }
.data-table { width:100%; border-collapse:collapse; text-align:left; font-size:var(--fs-small); }
.prose table,.article-body table { display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%; min-width:0; border-collapse:collapse; text-align:left; font-size:var(--fs-small); }
.data-table :where(th,td),.prose table :where(th,td),.article-body table :where(th,td) { min-width:7em; padding:16px 20px; vertical-align:top; border-bottom:1px solid var(--border); overflow-wrap:normal; word-break:normal; }
.data-table th,.prose table th,.article-body table th { background:var(--bg-panel); color:var(--text); font-weight:650; }
.data-table td,.prose table td,.article-body table td { background:var(--bg); color:var(--text); }
.data-table tr:last-child td { border-bottom:0; }
#install table code { white-space:pre-wrap; overflow-wrap:normal; word-break:normal; }

/* 官方截图与设备入口。不绘制客户端界面。 */
.shot-row { display:flex; align-items:flex-start; justify-content:center; flex-wrap:wrap; gap:32px; }
.official-shot { flex-shrink:0; width:100%; max-width:280px; margin:0; padding:0; }
.official-shot img { display:block; width:100%; height:auto; border-radius:var(--r-shot); outline:1px solid var(--border); outline-offset:-1px; }
.official-shot figcaption { margin-top:12px; color:var(--text-muted); font-size:var(--fs-caption); line-height:1.7; }
.device-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.device-entry { display:flex; align-items:center; gap:24px; padding:28px; border:1px solid var(--border); border-radius:var(--r-float); background:var(--bg); color:var(--text); text-decoration:none; box-shadow:var(--shadow-float); }
.device-entry:hover { color:var(--text); border-color:var(--device-line); }
.device-entry > svg { width:42px; height:54px; color:var(--text-muted); }
.device-entry strong { display:block; font-size:18px; }
.device-entry small { display:block; margin-top:5px; color:var(--text-muted); font-size:var(--fs-small); }
.article-card { display:flex; flex-direction:column; align-items:flex-start; padding:32px; border:1px solid var(--border); border-radius:var(--r-section); background:var(--bg); color:var(--text); box-shadow:var(--shadow-float); }
.article-card h3 { margin-top:20px; font-size:20px; }
.article-card h3 a { color:var(--text); text-decoration:none; }
.article-card h3 a:hover { color:var(--accent); }
.article-card p { font-size:var(--fs-small); color:var(--text-muted); }
.article-card .article-link { margin-top:auto; font-size:var(--fs-small); }
.article-store-card { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:24px; margin-top:56px; padding:32px; border:1px solid var(--border); border-radius:var(--r-section); background:var(--bg-panel); color:var(--text); }
.article-store-card p { margin:8px 0 0; font-size:var(--fs-small); color:var(--text-muted); }
.article-store-copy { flex:1 1 280px; }

/* 只供博客文章使用的常驻入口。 */
.dl-fab { position:fixed; z-index:30; right:24px; bottom:24px; display:inline-flex; align-items:center; gap:10px; min-height:52px; padding:14px 20px; border:1px solid var(--border); border-radius:var(--r-pill); background:var(--bg); color:var(--text); text-decoration:none; box-shadow:var(--shadow-float); font-size:var(--fs-small); font-weight:650; }
.dl-fab:hover { color:var(--accent-dark); border-color:var(--device-line); }
.dl-fab svg { width:22px; height:22px; }

/* 仅设计预览使用的静态标本。色值仍全部来自令牌。 */
.preview-block { margin-bottom:56px; }
.preview-block > h3 { margin-bottom:24px; }
.preview-flow { display:flex; flex-wrap:wrap; align-items:center; gap:18px; }
.preview-swatches { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:14px; }
.swatch { padding:14px; border:1px solid var(--border); border-radius:var(--r-inset); background:var(--bg); color:var(--text); font-size:var(--fs-caption); }
.swatch::before { content:""; display:block; height:64px; margin-bottom:12px; border:1px solid var(--border); border-radius:var(--r-mark); background:var(--swatch,var(--bg)); color:var(--text); }
.sw-bg { --swatch:var(--bg); }
.sw-panel { --swatch:var(--bg-panel); }
.sw-panel2 { --swatch:var(--bg-panel2); }
.sw-border { --swatch:var(--border); }
.sw-hairline { --swatch:var(--hairline); }
.sw-device { --swatch:var(--device-line); }
.sw-accent { --swatch:var(--accent); }
.sw-accent-dark { --swatch:var(--accent-dark); }
.sw-text { --swatch:var(--text); }
.sw-muted { --swatch:var(--text-muted); }
.sw-success { --swatch:var(--success); }
.sw-warn { --swatch:var(--warn); }
.sw-error { --swatch:var(--error); }
.sw-hover { --swatch:var(--ink-hover); }
.sw-glow { --swatch:var(--glow); }
.sw-glow-mid { --swatch:var(--glow-mid); }
.sw-glow-zero { --swatch:var(--glow-0); }
.sw-cream { --swatch:var(--tint-cream); }
.sw-sage { --swatch:var(--tint-sage); }
.sw-mist { --swatch:var(--tint-mist); }
.sw-lilac { --swatch:var(--tint-lilac); }
.sw-pill { --swatch:var(--pill-cream); }
.sw-pill-line { --swatch:var(--pill-cream-line); }
.sw-dot { --swatch:var(--dot-halo); }
.sw-honey { --swatch:var(--band-honey); }
.sw-band-mist { --swatch:var(--band-mist); }
.sw-band-lilac { --swatch:var(--band-lilac); }
.sw-veil { --swatch:var(--veil); }
.sw-transparent { --swatch:var(--transparent); }
.shot-placeholder { display:grid; place-items:center; width:100%; aspect-ratio:750/1334; padding:20px; text-align:center; border:1px solid var(--border); border-radius:var(--r-shot); background:linear-gradient(150deg,var(--tint-mist),var(--tint-lilac)); color:var(--text-muted); font-size:var(--fs-small); }
.preview-title { font-family:var(--font-display); font-size:var(--fs-h1); font-weight:800; line-height:1.2; letter-spacing:var(--track-display); }
.preview-footer { margin-top:0; }
@media (max-width:900px) {
  .object-index { grid-template-columns:minmax(0,1fr); gap:24px; }
  .object-tabs[role="tablist"] { flex-direction:row; overflow-x:auto; padding:4px 2px 14px; scrollbar-width:thin; }
  .object-tabs [role="tab"] { flex-shrink:0; }
  .tab-panel { padding:32px; }
}
@media (max-width:640px) {
  .plat-card { flex-basis:100%; padding:24px; }
  .plat-actions { align-items:stretch; }
  .plat-actions .btn { flex:1 1 170px; }
  .fact-row { flex-direction:row; flex-wrap:wrap; gap:6px; }
  .fact-pill { font-size:11px; padding:5px 9px; }
  .device-grid { grid-template-columns:minmax(0,1fr); }
  .device-entry { padding:22px; gap:18px; }
  .shot-row { flex-direction:column; align-items:center; }
  .tab-panel { padding:24px; }
  .panel-object { float:none; width:fit-content; margin:0 0 24px; transform:none; }
  .toc { gap:4px; padding:10px; }
  .toc a { padding:8px 10px; }
  .callout { padding:20px; }
  .article-card,.article-store-card { padding:24px; }
  .dl-fab { width:52px; height:52px; min-height:52px; padding:0; right:16px; bottom:16px; justify-content:center; border-radius:var(--r-pill); }
  .dl-fab span { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
  body.blog-article { padding-bottom:84px; }
  #install table,#install tbody,#install tr,#install td { display:block; width:100%; max-width:100%; }
  #install table { overflow:visible; }
  #install thead { display:none; }
  #install tr { border-bottom:1px solid var(--border); }
  #install td { min-width:0; border-bottom:0; padding:12px 16px; }
  #install td:first-child { font-weight:700; background:var(--bg-panel); color:var(--text); }
  #install td code { display:block; max-width:100%; overflow-x:auto; white-space:pre; overflow-wrap:normal; word-break:normal; padding-block:5px; }
  .preview-title { font-size:var(--fs-h1-mobile); }
}