/* 检修通道：纵向字段条 + 详情，不使用卡片墙。 */
.tabs { min-width:0; }
.service-tabs { display:grid; grid-template-columns:280px minmax(0,1fr); gap:28px; }
.tab-list { display:flex; gap:10px; align-items:stretch; min-width:0; }
.service-tabs .tab-list { flex-direction:column; }
.tab {
  position:relative; display:flex; align-items:center; gap:12px; min-height:48px;
  padding:14px 18px; border:1px solid var(--border); border-radius:var(--r-sm);
  background:var(--bg-panel); color:var(--text-muted); text-align:left;
}
.tab-copy { display:block; min-width:0; }
.tab-copy b { display:block; color:var(--text); font-size:15px; }
.tab-copy small { display:block; font-family:var(--font-mono); font-size:12px; margin-top:4px; }
.tab[aria-selected="true"] { background:var(--bg-panel2); color:var(--text); }
.tab[aria-selected="true"]::before { content:""; position:absolute; inset:8px auto 8px 0; width:4px; border-radius:var(--r-tiny); background:var(--accent); }
.tab:hover { border-color:var(--accent); }
.tab-panel { min-width:0; }
.tab-panel p { color:var(--text-muted); }
.tab-panel .key { color:var(--success); }
.platform-tabs .tab-list { overflow-x:auto; padding-bottom:10px; overscroll-behavior-inline:contain; }
.platform-tabs .tab { flex-shrink:0; }
.toc {
  position:sticky; top:12px; z-index:10; display:flex; gap:8px; flex-wrap:wrap;
  padding:12px; margin-bottom:32px; border:1px solid var(--border);
  border-radius:var(--r-md); background:var(--bg-panel); color:var(--text);
}
.toc a { display:flex; align-items:center; min-height:44px; padding:8px 12px; border-radius:var(--r-sm); font-size:14px; }
.toc a:hover { background:var(--bg-panel2); color:var(--text); }
.toc.is-static { position:static; }
.faq-item { border:1px solid var(--border); border-radius:var(--r-md); background:var(--bg-panel); color:var(--text); margin-bottom:12px; }
.faq-item summary { position:relative; cursor:pointer; padding:18px 48px 18px 20px; font-weight:700; list-style:none; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after { content:"+"; position:absolute; right:20px; top:16px; color:var(--accent); font-family:var(--font-mono); font-size:22px; }
.faq-item[open] summary::after { content:"−"; }
.faq-answer { padding:0 20px 20px; color:var(--text-muted); }
.faq-answer p:last-child { margin-bottom:0; }
.term-card { border-left:4px solid var(--success); }
.term-card h3 { font-family:var(--font-mono); font-size:21px; }
.term-category { font-family:var(--font-mono); color:var(--text-muted); font-size:12px; margin-bottom:12px; }
.client-card { margin-bottom:24px; }
.client-heading { display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:18px; }
.app-icon { width:56px; height:56px; flex-shrink:0; }
.client-heading h3 { margin:0; }
.client-heading .client-title { min-width:0; flex:1; }
.client-version { font-family:var(--font-mono); font-size:13px; color:var(--text-muted); }
.client-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:20px; }
.badge-row,.tag-row { display:flex; gap:8px; flex-wrap:wrap; align-items:center; }
.label,.tag { display:inline-flex; align-items:center; gap:6px; max-width:100%; padding:4px 9px; border:1px solid var(--border); border-radius:var(--r-xs); background:var(--bg-panel2); color:var(--text); font-size:12px; font-weight:700; overflow-wrap:anywhere; }
.label-first { background:var(--accent); color:var(--ink); border-color:var(--accent); }
.label-recommended { background:var(--success); color:var(--ink); border-color:var(--success); }
.label-retired { background:var(--bg-panel2); color:var(--text-muted); }
.label-warning { background:var(--warn); color:var(--ink); border-color:var(--warn); }
.label-error { background:var(--error); color:var(--ink); border-color:var(--error); }
.article-card { display:flex; flex-direction:column; }
.article-meta { display:flex; gap:12px; align-items:center; flex-wrap:wrap; margin-bottom:18px; font-family:var(--font-mono); font-size:12px; color:var(--text-muted); }
.article-card h3 { font-size:22px; }
.article-card p { color:var(--text-muted); }
.article-link { margin-top:auto; padding-top:14px; color:var(--text); font-size:14px; font-weight:700; }
.article-link:hover { color:var(--accent); }
.callout { margin:24px 0; padding:20px 24px; border:1px solid var(--border); border-left:4px solid var(--accent); border-radius:var(--r-sm); background:var(--bg-panel); color:var(--text); }
.callout p:last-child { margin-bottom:0; }
.callout-note { border-left-color:var(--success); }
.callout-warning { border-left-color:var(--warn); }
.table-scroll { overflow-x:auto; max-width:100%; min-width:0; overscroll-behavior-inline:contain; border:1px solid var(--border); border-radius:var(--r-md); }
.data-table { width:100%; border-collapse:collapse; background:var(--bg-panel); color:var(--text); font-size:14px; }
.data-table th,.data-table td,.prose table th,.prose table td,.article-body table th,.article-body table td {
  min-width:7em; padding:14px 18px; text-align:left; 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-panel2); color:var(--text); font-weight:700; }
.data-table tr:last-child td { border-bottom:0; }
.prose table,.article-body table { display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; max-width:100%; min-width:0; border-collapse:collapse; background:var(--bg-panel); color:var(--text); }
.prose table code,.article-body table code,.data-table code { overflow-wrap:anywhere; white-space:normal; }
.dl-fab {
  position:fixed; right:max(18px,env(safe-area-inset-right)); bottom:max(18px,env(safe-area-inset-bottom));
  z-index:30; display:flex; align-items:center; gap:10px; min-height:48px;
  max-width:calc(100vw - 36px); padding:12px 16px; border:1px solid var(--accent);
  border-radius:var(--r-md); background:var(--bg-panel); color:var(--text); box-shadow:var(--shadow-panel);
  font-size:14px; font-weight:800;
}
.dl-fab svg { width:20px; height:20px; flex-shrink:0; fill:none; stroke:var(--accent); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.dl-fab:hover { background:var(--bg-panel2); color:var(--text); }
.article-download { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:40px; }
.article-download h3 { margin-bottom:8px; }
.article-download p { color:var(--text-muted); }
.article-download .btn { flex-shrink:0; }
.has-article-fab .site-footer { padding-bottom:96px; }

/* 静态手机检修台：与已确认首屏共用。 */
.stage { position:relative; width:1180px; height:460px; margin:14px auto 0; }
.beams { position:absolute; left:0; top:0; width:1180px; height:460px; z-index:1; pointer-events:none; }
.bl-0 { stop-color:var(--accent); stop-opacity:.44; }
.bl-1 { stop-color:var(--accent); stop-opacity:.12; }
.br-0 { stop-color:var(--success); stop-opacity:.36; }
.br-1 { stop-color:var(--success); stop-opacity:.1; }
.halo-l { fill:var(--accent); opacity:.22; }
.halo-r { fill:var(--success); opacity:.2; }
.ground { position:absolute; left:430px; top:436px; width:320px; height:26px; border-radius:var(--r-circle); background:radial-gradient(ellipse at center,var(--shadow-2),var(--clear) 70%); z-index:1; }
.k-ink { stroke:var(--ink); stroke-width:3; stroke-linejoin:round; stroke-linecap:round; }
.f-violet { fill:var(--violet); }
.f-deep { fill:var(--violet-deep); }
.f-pink { fill:var(--accent); }
.f-green { fill:var(--success); }
.f-hi { fill:var(--hilite); }
.s-hi { fill:none; stroke:var(--hilite); stroke-width:3; stroke-linecap:round; }
.s-ink { fill:none; stroke:var(--ink); stroke-width:2.4; stroke-linecap:round; }
.pedestal { position:absolute; left:410px; top:378px; width:360px; height:78px; z-index:2; overflow:visible; }
.rig { position:absolute; left:486px; top:8px; width:208px; height:360px; z-index:4; transform:rotate(4deg); transform-origin:50% 382px; }
.cradle { position:absolute; left:-31px; bottom:-34px; width:270px; height:92px; overflow:visible; }
.phone { position:absolute; inset:0; border-radius:var(--r-device); background:linear-gradient(160deg,var(--bg-panel2) 0%,var(--violet-deep) 100%); color:var(--text); border:3px solid var(--ink); box-shadow:7px 8px 0 var(--ink),0 34px 60px -22px var(--shadow-2); }
.phone::before { content:""; position:absolute; left:3px; top:30px; width:4px; height:72px; border-radius:var(--r-xs); background:var(--hilite); }
.phone::after { content:""; position:absolute; right:-8px; top:92px; width:5px; height:46px; border-radius:0 var(--r-xs) var(--r-xs) 0; background:var(--ink); }
.screen { position:absolute; inset:9px; border-radius:var(--r-screen); background:var(--bg); color:var(--text); border:2px solid var(--ink); overflow:hidden; display:flex; flex-direction:column; }
.screen::after { content:""; position:absolute; inset:0; background:linear-gradient(125deg,var(--glare) 0 24%,var(--clear) 24.5%); pointer-events:none; }
.sbar { position:relative; height:18px; flex-shrink:0; display:flex; align-items:center; justify-content:flex-end; gap:5px; padding:0 12px; }
.cam { position:absolute; left:50%; top:5px; width:8px; height:8px; margin-left:-4px; border-radius:var(--r-circle); background:var(--ink); border:1.5px solid var(--border); }
.sig { display:flex; align-items:flex-end; gap:1.5px; height:7px; }
.sig i { display:block; width:2px; background:var(--text-muted); border-radius:var(--r-tiny); }
.sig i:nth-child(1) { height:3px; }
.sig i:nth-child(2) { height:5px; }
.sig i:nth-child(3) { height:7px; }
.bat { width:12px; height:6px; border:1px solid var(--text-muted); border-radius:var(--r-tiny); position:relative; }
.bat::after { content:""; position:absolute; left:1px; top:1px; bottom:1px; width:6px; border-radius:var(--r-tiny); background:var(--text-muted); }
.appbar { height:34px; flex-shrink:0; display:flex; align-items:center; gap:8px; padding:0 10px; background:var(--bg-panel); color:var(--text); border-bottom:1px solid var(--line); }
.appbar svg { width:14px; height:14px; fill:none; stroke:var(--text); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
.appbar b { font-size:13px; font-weight:800; }
.grp { height:20px; flex-shrink:0; display:flex; align-items:flex-end; padding:0 10px 2px; font-size:9px; font-weight:700; letter-spacing:.06em; color:var(--text-muted); }
.set-row { min-height:42px; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:5px 10px; border-bottom:1px solid var(--line); }
.set-txt { display:flex; flex-direction:column; min-width:0; line-height:1.3; }
.set-txt b { font-size:11px; font-weight:700; color:var(--text); }
.set-txt em { font-style:normal; font-size:9px; color:var(--text-muted); }
.set-txt .mono { font-size:8.5px; }
.chev { flex-shrink:0; font-size:14px; line-height:1; color:var(--text-muted); }
.tg { position:relative; flex-shrink:0; width:26px; height:14px; border-radius:var(--r-pill); background:var(--bg-panel2); border:1px solid var(--border); }
.tg::after { content:""; position:absolute; top:1px; left:1px; width:10px; height:10px; border-radius:var(--r-circle); background:var(--text-muted); }
.tg.is-on { background:var(--success); border-color:var(--success); }
.tg.is-on::after { left:13px; background:var(--ink); }
.fab { position:absolute; right:12px; bottom:10px; z-index:1; width:40px; height:40px; border-radius:var(--r-circle); background:var(--accent); color:var(--ink); border:2px solid var(--ink); box-shadow:3px 3px 0 var(--ink); display:grid; place-items:center; }
.fab svg { width:14px; height:14px; fill:currentColor; margin-left:2px; }
.card { position:absolute; z-index:3; width:300px; display:flex; flex-direction:column; border:1px solid var(--clear); border-radius:var(--r-lg); background:linear-gradient(var(--bg-panel),var(--bg-panel)) padding-box,var(--grad-edge) border-box; color:var(--text); box-shadow:var(--shadow-panel); }
.c-sub { left:70px; top:16px; height:164px; transform:rotate(-3deg); }
.c-share { left:70px; top:200px; height:132px; transform:rotate(-3deg); box-shadow:0 2px 0 var(--shadow-1),0 14px 28px -10px var(--shadow-2),0 18px 30px -18px var(--accent-glow); }
.c-route { left:810px; top:16px; height:164px; transform:rotate(3deg); }
.c-core { left:810px; top:200px; height:132px; transform:rotate(3deg); box-shadow:0 2px 0 var(--shadow-1),0 14px 28px -10px var(--shadow-2),0 18px 30px -18px var(--success-glow); }
.c-share::after,.c-core::after { content:""; position:absolute; left:14%; right:14%; bottom:-1px; height:1px; border-radius:var(--r-tiny); }
.c-share::after { background:var(--accent); box-shadow:0 0 12px 1px var(--accent-glow); }
.c-core::after { background:var(--success); box-shadow:0 0 12px 1px var(--success-glow); }
.chrome { height:28px; flex-shrink:0; display:flex; align-items:center; gap:10px; padding:0 12px; background:var(--bg-panel2); color:var(--text); border-bottom:1px solid var(--border); border-radius:var(--r-chrome) var(--r-chrome) 0 0; }
.dots { display:flex; gap:5px; flex-shrink:0; }
.dots i { display:block; width:7px; height:7px; border-radius:var(--r-circle); }
.dots i:nth-child(1) { background:var(--accent); }
.dots i:nth-child(2) { background:var(--violet); }
.dots i:nth-child(3) { background:var(--success); }
.chrome-title { font-family:var(--font-mono); font-size:11.5px; font-weight:600; color:var(--text); }
.chrome-tag { margin-left:auto; font-family:var(--font-mono); font-size:10px; color:var(--text-muted); border:1px solid var(--border); border-radius:var(--r-xs); padding:0 6px; line-height:16px; }
.card-body { flex:1; display:flex; flex-direction:column; gap:8px; padding:11px 14px 12px; min-width:0; border-radius:0 0 var(--r-chrome) var(--r-chrome); }
.fld-label { font-family:var(--font-mono); font-size:10px; color:var(--text-muted); line-height:1; margin-bottom:-3px; }
.fld { min-height:26px; display:flex; align-items:center; padding:4px 9px; border:1px solid var(--border); border-radius:var(--r-sm); background:var(--bg); color:var(--text); font-family:var(--font-mono); font-size:10.5px; overflow-wrap:anywhere; }
.row-mini { display:flex; align-items:center; justify-content:space-between; font-size:11.5px; font-weight:600; color:var(--text); }
.mini-btn { align-self:flex-start; display:inline-flex; align-items:center; gap:6px; min-height:24px; padding:2px 10px; border:1px solid var(--border); border-radius:var(--r-sm); background:var(--bg-panel2); color:var(--text); font-size:11px; font-weight:700; }
.mini-btn svg { width:12px; height:12px; flex-shrink:0; fill:none; stroke:var(--text-muted); stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.link-line { padding:3px 8px; border:1px solid var(--line); border-radius:var(--r-xs); background:var(--bg); color:var(--text-muted); font-family:var(--font-mono); font-size:10.5px; line-height:1.5; overflow-wrap:anywhere; }
.link-line .k,.code .ck { color:var(--success); }
.code { margin:0; padding:0; border:0; background:var(--clear); color:var(--text-muted); font-family:var(--font-mono); font-size:10.5px; line-height:1.48; white-space:pre; }
.code .cv { color:var(--text); }
.core-opts { display:flex; flex-direction:column; gap:6px; }
.opt { display:flex; align-items:center; gap:10px; min-height:34px; padding:4px 10px; border:1px solid var(--line); border-radius:var(--r-sm); }
.opt.is-sel { border-color:var(--border); background:var(--bg-panel2); color:var(--text); }
.radio { flex-shrink:0; width:12px; height:12px; border-radius:var(--r-circle); border:1.5px solid var(--border); }
.opt.is-sel .radio { border-color:var(--success); box-shadow:inset 0 0 0 2px var(--bg-panel2),inset 0 0 0 6px var(--success); }
.opt-txt { display:flex; flex-direction:column; line-height:1.3; }
.opt-txt b { font-family:var(--font-mono); font-size:12px; font-weight:700; color:var(--text); }
.opt-txt em { font-style:normal; font-size:10px; color:var(--text-muted); }

/* 终端窗口用于真实配置示例，不替换已确认的手机首屏。 */
.terminal { border:1px solid var(--clear); border-radius:var(--r-lg); background:linear-gradient(var(--bg-panel),var(--bg-panel)) padding-box,var(--grad-edge) border-box; color:var(--text); box-shadow:var(--shadow-panel); min-width:0; }
.terminal .chrome { height:36px; }
.terminal pre { border:0; border-radius:0 0 var(--r-chrome) var(--r-chrome); margin:0; padding:24px; background:var(--bg-panel); color:var(--text-muted); }
.terminal .ck { color:var(--success); }
.preview-grid { 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-sm); background:var(--bg-panel); color:var(--text); font-family:var(--font-mono); font-size:12px; }
.swatch::before { content:""; display:block; height:54px; margin-bottom:12px; border-radius:var(--r-xs); border:1px solid var(--border); background:var(--swatch); }
.sw-bg { --swatch:var(--bg); }
.sw-panel { --swatch:var(--bg-panel); }
.sw-panel2 { --swatch:var(--bg-panel2); }
.sw-border { --swatch:var(--border); }
.sw-accent { --swatch:var(--accent); }
.sw-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-violet { --swatch:var(--violet); }
.sw-deep { --swatch:var(--violet-deep); }
.sw-ink { --swatch:var(--ink); }
.sw-line { --swatch:var(--line); }
.sw-hilite { --swatch:var(--hilite); }
.sw-glare { --swatch:var(--glare); }
.sw-chip { --swatch:var(--chip); }
.sw-field { --swatch:var(--field); }
.sw-dot { --swatch:var(--dot); }
.sw-dot-faint { --swatch:var(--dot-faint); }
.sw-shadow1 { --swatch:var(--shadow-1); }
.sw-shadow2 { --swatch:var(--shadow-2); }
.sw-soft { --swatch:var(--accent-soft); }
.sw-glow { --swatch:var(--accent-glow); }
.sw-green-glow { --swatch:var(--success-glow); }
.sw-edge { --swatch:var(--grad-edge); }
.sw-clear { --swatch:var(--clear); }
.sample-stack { display:flex; flex-wrap:wrap; gap:14px; align-items:center; }
.preview-footer { margin-top:48px; }
@media (max-width:1240px) {
  .stage { left:50%; margin-left:-590px; transform:scale(.86); transform-origin:top center; margin-bottom:-64px; }
}
@media (max-width:1060px) {
  .stage { transform:scale(.72); margin-bottom:-128px; }
}
@media (max-width:760px) {
  .stage { left:auto; transform:none; margin:28px auto 0; width:auto; height:auto; padding:0 var(--gutter) 40px; display:grid; gap:14px; }
  .beams,.pedestal,.ground,.star { display:none; }
  .rig { position:relative; left:auto; top:auto; margin:0 auto 46px; transform:rotate(2deg); }
  .card { position:relative; left:auto; top:auto; width:auto; height:auto; transform:none; }
  .service-tabs { grid-template-columns:minmax(0,1fr); gap:18px; }
  .service-tabs .tab-list { flex-direction:row; overflow-x:auto; padding-bottom:8px; overscroll-behavior-inline:contain; }
  .service-tabs .tab { flex-shrink:0; min-width:160px; }
  .toc { flex-wrap:nowrap; overflow-x:auto; }
  .toc a { flex-shrink:0; }
  .article-download { flex-direction:column; align-items:flex-start; }
}
@media (max-width:640px) {
  .rig { transform:none; }
  .client-actions .btn { width:100%; }
}