:root{--bg:#f6f4ef;--fg:#232019;--dim:#6b6459;--line:#e2dcd0;--gold:#8a5f14;--panel:#fff}
@media(prefers-color-scheme:dark){:root{--bg:#15140f;--fg:#ece7dc;--dim:#9a9384;--line:#2c2a22;--gold:#d0a75e;--panel:#1c1a14}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:16px/1.75 -apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}
a{color:var(--gold);text-decoration:none}a:hover{text-decoration:underline}
.wrap{max-width:760px;margin:0 auto;padding:22px 20px 56px}
.top{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--dim);border-bottom:1px solid var(--line);padding-bottom:12px}
.top b{color:var(--fg);font-size:15px;letter-spacing:.02em}
h1{font-size:27px;line-height:1.35;margin:20px 0 6px;letter-spacing:.01em}
.sub{color:var(--dim);font-size:13.5px;margin-bottom:20px}
.lede{font-size:17px;line-height:1.8;margin:0 0 22px;padding-left:13px;border-left:3px solid var(--gold)}
h2{font-size:16px;margin:26px 0 8px;color:var(--gold);letter-spacing:.04em}
h3 a{display:inline-flex;align-items:center;min-height:26px}
p{margin:0 0 12px}
ul{margin:0 0 14px;padding-left:20px}li{margin:5px 0}
.cta{display:inline-flex;align-items:center;gap:7px;margin:24px 0 8px;padding:11px 20px;border-radius:11px;background:var(--gold);color:#fff;font-size:15.5px;font-weight:600}
.cta:hover{text-decoration:none;filter:brightness(1.06)}
.note{font-size:13px;color:var(--dim);border-top:1px solid var(--line);margin-top:30px;padding-top:14px;line-height:1.7}
.lic{display:flex;flex-wrap:wrap;gap:4px 16px;align-items:center;margin-top:10px;font-size:12px;color:var(--dim);line-height:1.7}
/* 备案链接原来只有 20px 高（12px 字 × 1.7 行高），比 WCAG 2.2 的最小点击尺寸 24px 还小。
   这是全站每一页都有的两条链接，手指点偏一次就跳到别的站去了。 */
.lic a{color:var(--dim);display:inline-flex;align-items:center;min-height:26px;padding:0 2px}.lic a:hover{color:var(--fg)}
.idx li a{display:inline-flex;align-items:center;min-height:32px}
.rel{margin-top:26px;padding:14px 16px;background:var(--panel);border:1px solid var(--line);border-radius:12px}
.rel h2{margin-top:0}
.rel a{display:inline-block;margin:3px 12px 3px 0;font-size:14px}
/* 手机上这些内链原来只有 25px 高，比页脚那两条 44px 的备案链接还难按。
   窄屏改成带底纹的块，点击高度 40px，不改变桌面端的紧凑排布。 */
@media(max-width:600px){.rel a{min-height:44px;line-height:28px;padding:8px 13px;margin:4px 8px 4px 0;background:var(--panel);border:1px solid var(--line);border-radius:9px}.idx li a{min-height:40px}.lic a{min-height:40px}}
.crumb{font-size:12.5px;color:var(--dim);margin:14px 0 0}.crumb a{display:inline-flex;align-items:center;min-height:26px;padding:0 2px}
@media(max-width:620px){h1{font-size:22px}.lede{font-size:16px}.wrap{padding:16px 15px 44px}}


/* ---- 说明页配图（z124）----
   说明页是静态 HTML（nginx 直出，不经过前端框架），样式只能随页内联。
   三张横排：桌面三列 → 手机横滑一张 70% 宽。理由与模块页图解同一条：
   390px 下三列每张只有 105px，图看不清、说明折成四行。
   图 560² WebP、loading="lazy"，不进首屏关键路径。 */
.plx{margin:26px 0 10px}
.plx-hd{display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;margin-bottom:10px}
.plx-hd b{font-size:14px;letter-spacing:.02em}
.plx-hd span{font-size:12px;color:var(--dim)}
.plx-row{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px}
.plx-row li{min-width:0}
.plx-fig{position:relative;aspect-ratio:1/1;border-radius:10px;overflow:hidden;border:1px solid var(--line);background:var(--panel)}
.plx-fig img{display:block;width:100%;height:100%;object-fit:cover}
.plx-no{position:absolute;top:6px;left:6px;width:17px;height:17px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10.5px;line-height:1;background:var(--gold);color:#fff;opacity:.8}
.plx-t{display:block;margin-top:7px;font-size:13px;font-weight:600}
.plx-d{margin:3px 0 0;font-size:12px;line-height:1.65;color:var(--dim)}
@media(max-width:620px){
  .plx{margin:20px 0 6px}
  .plx-row{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:4px;scrollbar-width:none}
  .plx-row::-webkit-scrollbar{display:none}
  .plx-row li{flex:0 0 70%;scroll-snap-align:start}
}