/* Tok 桥 · 全站样式。不加载网络字体，中文用系统字体；等宽字体只给邀请码和线网总图上的编号。 */

:root{
  --zhi:#F2F0E9;        /* 纸底（和海报画的纸色一致） */
  --zhi2:#EAE7DE;       /* 页脚、浅底块 */
  --ka:#FFFDF9;         /* 卡面 */
  --mo:#1B2029;         /* 墨 */
  --mo2:#3B414C;        /* 次墨 */
  --hui:#5C626C;        /* 灰字 */
  --xian:rgba(27,32,41,.09);   /* 细线：全站卡片只用这一种 */
  --xian2:rgba(27,32,41,.16);  /* 输入框的线 */
  --ying:0 8px 24px rgba(27,32,41,.06);   /* 阴影：只给邀请码卡和可点的大卡 */
  --r1:8px; --r2:16px;
  --f1:13px; --f2:15px; --f3:17px; --f4:22px; --f5:30px; --f6:52px;
  --duan:96px;          /* 段与段之间 */
  --H:#D9472F; --H-d:#B5361F; --H-t:#F7E2DC;
  --J:#2C7FCB; --J-d:#1E5F9E; --J-t:#DCEAF6;
  --C:#23885A; --C-d:#1A6B46; --C-t:#DDEFE5;
  --B:#8A3F9E; --B-d:#74318A; --B-t:#EEE0F1;
  --lv:#1A6B46;         /* 品牌绿：只给注册按钮和利益点里的数字 */
  --zh:"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans CJK SC","Source Han Sans SC",system-ui,sans-serif;
  --lu:"Overpass","DIN Alternate","Bahnschrift","Avenir Next","Helvetica Neue",Arial,var(--zh);
  --ma:"Overpass Mono","SF Mono","Menlo","Consolas","Roboto Mono",monospace;
  --lc:var(--mo); --ld:var(--mo); --lt:var(--zhi2);
}
@media (max-width:720px){
  :root{--f2:14px;--f3:16px;--f4:19px;--f5:24px;--f6:28px;--duan:56px}
}
/* 线色作用域：任何元素挂 xl-x-<线号>，里面的 --lc / --ld / --lt 就换成这一组的颜色 */
.xl-x-H{--lc:var(--H);--ld:var(--H-d);--lt:var(--H-t)}
.xl-x-J{--lc:var(--J);--ld:var(--J-d);--lt:var(--J-t)}
.xl-x-C{--lc:var(--C);--ld:var(--C-d);--lt:var(--C-t)}
.xl-x-B{--lc:var(--B);--ld:var(--B-d);--lt:var(--B-t)}
.xl-x-Q{--lc:var(--mo);--ld:var(--mo);--lt:var(--zhi2)}
.xl-s-H{stroke:var(--H)}.xl-s-J{stroke:var(--J)}.xl-s-C{stroke:var(--C)}.xl-s-B{stroke:var(--B)}
.xl-sd-H{stroke:var(--H)}.xl-sd-J{stroke:var(--J)}.xl-sd-C{stroke:var(--C)}.xl-sd-B{stroke:var(--B)}

/* ---------- 基础 ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--zhi);color:var(--mo);font:var(--f3)/1.75 var(--zh);overflow-x:hidden;-webkit-font-smoothing:antialiased}
a{color:inherit;text-decoration-thickness:1px;text-underline-offset:4px}
img{max-width:100%;height:auto;display:block}
h1,h2,h3{letter-spacing:0;text-wrap:balance}
h1{font-weight:700}
h2,h3{font-weight:600}
b,strong{font-weight:600}
code{font-family:inherit}
.xl-kuang{max-width:1280px;margin:0 auto;padding:0 40px}
.xl-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.xl-tiao{position:absolute;left:8px;top:-60px;z-index:60;background:var(--mo);color:#fff;padding:8px 12px;border-radius:var(--r1)}
.xl-tiao:focus{top:8px}
:focus-visible{outline:2px solid var(--mo);outline-offset:2px;border-radius:4px}
.xl-zheng{display:block;min-height:50vh}
.xl-nw{white-space:nowrap}
/* 正文里的【按钮名】 */
.xl-an{display:inline-block;padding:0 5px;margin:0 2px;border-radius:6px;background:var(--zhi2);font-size:max(13px,.92em);line-height:1.55;white-space:nowrap}
.xl-an-hou{margin-left:-.4em}
/* 小标签：带线色的一小块（栏目名、实时查询、篇数） */
.xl-biaoqian{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0 0 14px;font-size:var(--f1);line-height:1.4}
.xl-biaoqian > a,.xl-biaoqian > span:first-child{display:inline-flex;align-items:center;gap:7px;min-height:28px;padding:0 12px;border-radius:999px;background:var(--lt);color:var(--ld);font-weight:600;text-decoration:none}
.xl-biaoqian > a::before,.xl-biaoqian > span:first-child::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--lc)}
@media (hover:hover){.xl-biaoqian > a:hover{background:var(--ka);box-shadow:inset 0 0 0 1px var(--lc)}}
.xl-biaoqian > span + span{color:var(--hui)}
.xl-x-Q .xl-biaoqian > a,.xl-biaoqian.xl-x-Q > a,.xl-biaoqian.xl-x-Q > span:first-child{background:var(--zhi2);color:var(--mo2)}
/* 工具页抬头只写类型（实时查询 / 计算器），不带圆点（p11e） */
.xl-gj-lei > span:first-child::before{display:none}
.xl-meta{margin:0;font-size:var(--f1);line-height:1.6;color:var(--hui)}

/* ---------- 页头 ---------- */
.xl-tou{position:relative;z-index:20;background:var(--zhi)}
.xl-tou-in{display:flex;align-items:center;justify-content:space-between;gap:24px;height:64px}
.xl-logo{display:inline-flex;align-items:center;gap:9px;color:var(--mo);text-decoration:none;min-height:44px}
.xl-logo svg{flex:none;width:28px;height:28px}
.xl-logo-a,.xl-logo-b{fill:none;stroke-width:5.5;stroke-linecap:round}
.xl-logo-a{stroke:var(--H)}.xl-logo-b{stroke:var(--C)}
.xl-logo-o{fill:#fff;stroke:var(--mo);stroke-width:3.2}
.xl-logo b{font:600 22px/1 var(--lu)}
.xl-logo b i{font-style:normal}
.xl-dao ul{display:flex;gap:28px;list-style:none;margin:0;padding:0}
.xl-dao a{position:relative;display:flex;align-items:center;gap:8px;min-height:44px;color:var(--mo2);text-decoration:none;font-size:var(--f2);font-weight:500;line-height:1.3;white-space:nowrap}
.xl-dao a i{flex:none;width:10px;height:3px;border-radius:2px;background:var(--lc)}
.xl-dao .xl-dao-fu i{width:8px;height:8px;border-radius:50%;background:none;box-shadow:inset 0 0 0 2px var(--mo)}
@media (hover:hover){.xl-dao a:hover{color:var(--mo)}}
.xl-dao a[aria-current]{color:var(--mo)}
.xl-dao a[aria-current]::after{content:"";position:absolute;left:18px;right:0;bottom:4px;height:2px;border-radius:1px;background:var(--lc)}
.xl-dao .xl-dao-fu[aria-current]::after{left:16px}
.xl-caidan{display:none}
.xl-sedai{display:flex;height:3px}
.xl-sedai i{display:block;background:var(--lc)}
@media (min-width:1001px) and (max-width:1200px){
  .xl-dao ul{gap:18px}
  .xl-dao a{font-size:14px}
}

/* ---------- 页脚 ---------- */
.xl-wei{margin-top:var(--duan);background:var(--zhi2);padding:48px 0 40px;font-size:var(--f1);line-height:1.8;color:var(--mo2)}
.xl-wei-in{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 64px}
.xl-wei-a p{margin:8px 0 0;max-width:40em}
.xl-wei-a .xl-logo{margin-bottom:6px}
.xl-wei-b ul{list-style:none;margin:0 0 8px;padding:0;display:flex;flex-wrap:wrap;gap:0 20px}
.xl-wei-b a{display:inline-flex;align-items:center;min-height:36px;text-decoration:none}
@media (hover:hover){.xl-wei-b a:hover{text-decoration:underline}}
.xl-wei-c{padding-top:8px!important;border-top:1px solid var(--xian)!important}
.xl-wei-n{margin:16px 0 0;color:var(--hui)}

/* ---------- 段落节奏：段与段之间只用留白，段标题统一一种大小，说明在标题正下方 ---------- */
.xl-qu{padding-top:var(--duan)}
.xl-qu-tou{margin:0 0 32px;max-width:40em}
.xl-qu-tou h2{margin:0;font-size:var(--f5);line-height:1.3}
.xl-qu-tou p{margin:10px 0 0;font-size:var(--f2);line-height:1.7;color:var(--hui)}

/* ---------- 首页首屏 ---------- */
.xl-shou{position:relative;padding:40px 0 16px}
.xl-shou-in{position:relative;z-index:1}
.xl-shou-zuo{width:640px;max-width:100%}
.xl-shou-hua{position:absolute;top:0;bottom:0;right:0;left:calc(max(40px, (100% - 1200px) / 2) + 688px);display:flex;align-items:center}
.xl-shou-hua picture,.xl-shou-hua img{display:block;width:100%;height:auto}
/* 画的纸色有纹理，四周不加框：上、下、左三边各羽化一小截，和页面的纸底接上（不往左渐隐到字后面，画和字之间留着空） */
.xl-shou-hua picture{-webkit-mask-image:linear-gradient(to bottom,transparent,#000 9%,#000 91%,transparent),linear-gradient(to right,transparent,#000 7%);-webkit-mask-composite:source-in;mask-image:linear-gradient(to bottom,transparent,#000 9%,#000 91%,transparent),linear-gradient(to right,transparent,#000 7%);mask-composite:intersect}
.xl-meiti{display:flex;align-items:center;gap:10px;margin:0 0 16px;font-size:var(--f1);line-height:1.4;letter-spacing:.06em;color:var(--hui)}
.xl-meiti::before{content:"";width:20px;height:3px;border-radius:2px;background:var(--H)}
.xl-shou h1{margin:0;font-size:var(--f6);line-height:1.15;letter-spacing:-.005em;text-wrap:wrap}
.xl-fubiao{margin:16px 0 0;max-width:36em;font-size:var(--f3);line-height:1.7;color:var(--mo2)}
/* 给有旧账号的人的三个入口：导航，不比注册按钮抢。上面一行小字和眉题一样前面一道红色短横（p11e：15px、正文深灰）。
   桌面写完整说法（.xl-ru-q），≤1000px 写短说法（.xl-ru-d），一行排三个小入口 */
.xl-ru{margin:28px 0 0}
.xl-ru-t{display:flex;align-items:center;gap:10px;margin:0 0 12px;font-size:var(--f2);line-height:1.4;color:var(--mo2)}
.xl-ru-t::before{content:"";flex:none;width:20px;height:3px;border-radius:2px;background:var(--H)}
.xl-ru ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;list-style:none;margin:0;padding:0}
.xl-ru a{display:flex;align-items:flex-start;justify-content:space-between;gap:6px;height:100%;min-height:68px;padding:11px 12px 11px 14px;border-radius:12px;background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian);color:var(--mo);text-decoration:none;font-size:var(--f2);line-height:1.5;text-wrap:balance}
.xl-ru-d{display:none}
.xl-ru a svg{flex:none;align-self:flex-end;margin-bottom:3px;fill:none;stroke:var(--hui);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
@media (hover:hover){
  .xl-ru a:hover{box-shadow:inset 0 0 0 1px var(--mo2)}
  .xl-ru a:hover svg{stroke:var(--mo)}
}
.xl-shou .xl-ka{margin-top:24px}
/* 推荐注册教程的那一行（首页只此一处）：一行文字链 */
.xl-tuijian{margin:16px 0 0;font-size:var(--f2);line-height:1.6;color:var(--mo2)}
.xl-tuijian a{padding:6px 0;text-decoration:none}
.xl-tuijian .xl-tj-w{white-space:nowrap}
.xl-tuijian .xl-tj-m{text-decoration:underline;text-decoration-color:var(--xian2);text-underline-offset:4px}
@media (hover:hover){.xl-tuijian a:hover .xl-tj-m{text-decoration-color:var(--mo)}}
.xl-tuijian svg{display:inline-block;margin-left:4px;vertical-align:-2px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* ---------- 邀请码卡：很淡的细线 + 很淡的阴影；三种字号（小字 / 正文 / 码） ---------- */
.xl-ka{padding:24px 28px;border-radius:var(--r2);background:var(--ka);box-shadow:0 0 0 1px var(--xian),var(--ying);font-size:var(--f3);line-height:1.6}
.xl-ka p{margin:0}
.xl-ka-t{font-size:var(--f1);font-weight:600;line-height:1.5;color:var(--mo)}
.xl-ka-pang,.xl-ka-lb{margin-top:2px!important;font-size:var(--f1);line-height:1.6;color:var(--hui);text-wrap:pretty}
.xl-ka-ma{display:flex;align-items:center;justify-content:space-between;gap:12px;height:60px;margin-top:14px;padding:0 8px 0 20px;border-radius:12px;background:var(--C-t)}
.xl-ka-zhi{font:600 var(--f5)/1 var(--ma);letter-spacing:.1em;color:var(--mo);user-select:all}
.xl-ka-fu{flex:none;min-width:64px;min-height:44px;padding:0 14px;border:0;border-radius:var(--r1);background:transparent;color:var(--lv);font:600 var(--f3)/1 var(--zh);cursor:pointer}
@media (hover:hover){.xl-ka-fu:hover{background:rgba(255,255,255,.6)}}
.xl-ka-fu.xl-fu-ok{color:var(--mo)}
.xl-ka-li{margin-top:14px!important;font-size:var(--f3);line-height:1.65;color:var(--mo2);text-wrap:pretty}
.xl-ka-li b{color:var(--lv)}
.xl-ka-qu{display:flex;align-items:center;gap:12px 18px;margin-top:18px}
.xl-ka-lian{flex:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 26px;border-radius:999px;background:var(--lv);color:#fff;font-size:var(--f3);font-weight:600;text-decoration:none;white-space:nowrap}
.xl-ka-lian svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
@media (hover:hover){.xl-ka-lian:hover{background:#145538}}
.xl-ka-pi{font-size:var(--f1);line-height:1.6;color:var(--hui);text-wrap:pretty}
.xl-ka-pi a{color:inherit}
/* 召回卡：说明 → 链接 + 披露 → 码（码只在新注册时有用，排在后面） */
.xl-ka-shuo{margin-top:6px!important;font-size:var(--f3);line-height:1.7;color:var(--mo2);text-wrap:pretty}
.xl-ka-ci{margin-top:20px;padding-top:16px;border-top:1px solid var(--xian)}
.xl-ka-ci .xl-ka-ma{margin-top:8px}
/* 文章里的码卡 */
.xl-zw .xl-ka{margin:28px 0 32px}

/* ---------- 首页第二段：先选你现在的情况 ---------- */
/* p11e：左栏六个选项（2 列 × 3 行），右栏结果面板（白卡，和选项同一种细线、圆角）。面板按内容高，两栏顶边对齐；默认选中第 2 种（radio 带 checked）。
   radio 是选项块和结果面板的兄弟元素，纯 CSS 切换 */
.xl-pick-ge{display:grid;grid-template-columns:minmax(0,6fr) minmax(0,5fr);gap:32px;align-items:start}
.xl-pick-xuan{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.xl-ent{display:flex;align-items:center;min-height:72px;padding:14px 18px;border-radius:14px;background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian);font-size:var(--f3);line-height:1.55;cursor:pointer;text-wrap:balance;scroll-margin-top:16px}
@media (hover:hover){.xl-ent:hover{box-shadow:inset 0 0 0 1px var(--mo2)}}
#xl-k1:checked ~ .xl-pick-xuan label[for=xl-k1],#xl-k2:checked ~ .xl-pick-xuan label[for=xl-k2],#xl-k3:checked ~ .xl-pick-xuan label[for=xl-k3],
#xl-k4:checked ~ .xl-pick-xuan label[for=xl-k4],#xl-k5:checked ~ .xl-pick-xuan label[for=xl-k5],#xl-k6:checked ~ .xl-pick-xuan label[for=xl-k6]{background:#fff;box-shadow:inset 0 0 0 2px var(--lc),var(--ying);font-weight:600}
#xl-k1:focus-visible ~ .xl-pick-xuan label[for=xl-k1],#xl-k2:focus-visible ~ .xl-pick-xuan label[for=xl-k2],#xl-k3:focus-visible ~ .xl-pick-xuan label[for=xl-k3],
#xl-k4:focus-visible ~ .xl-pick-xuan label[for=xl-k4],#xl-k5:focus-visible ~ .xl-pick-xuan label[for=xl-k5],#xl-k6:focus-visible ~ .xl-pick-xuan label[for=xl-k6]{outline:2px solid var(--mo);outline-offset:3px}
.xl-res{--rp:26px;border-radius:14px;background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian);scroll-margin-top:16px}
.xl-res > div{display:none;padding:22px var(--rp) 6px}
#xl-k1:checked ~ .xl-res .xl-res-1,#xl-k2:checked ~ .xl-res .xl-res-2,#xl-k3:checked ~ .xl-res .xl-res-3,
#xl-k4:checked ~ .xl-res .xl-res-4,#xl-k5:checked ~ .xl-res .xl-res-5,#xl-k6:checked ~ .xl-res .xl-res-6{display:block}
.xl-res-t{display:flex;align-items:flex-start;gap:10px;margin:0 0 16px;font-size:var(--f2);line-height:1.5;color:var(--mo2)}
/* p11c：句首每组一个线色圆点（装饰），后面是「要看 N 篇，在「组名」这一组」 */
.xl-res-dian{flex:none;display:flex;gap:4px;margin-top:calc(var(--f2) * .75 - 4px)}
.xl-res-dian i{display:block;width:8px;height:8px;border-radius:50%;background:var(--lc)}
.xl-res-zu{white-space:nowrap}
.xl-res-t > span:last-child{text-wrap:balance}
/* 步骤：圆环 + 竖线（空心圆环只用在线路图和步骤上） */
.xl-res-bu{list-style:none;margin:0;padding:0;counter-reset:xl-rb}
.xl-res-bu li{counter-increment:xl-rb;position:relative;padding:0 0 10px 34px;font-size:var(--f2);line-height:1.6;text-wrap:pretty}
.xl-res-bu li::before{content:counter(xl-rb);position:absolute;left:0;top:1px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:inset 0 0 0 2px var(--lc);font:600 13px/22px var(--zh);text-align:center;color:var(--mo)}
.xl-res-bu li:not(:last-child)::after{content:"";position:absolute;left:10px;top:26px;bottom:2px;width:2px;border-radius:1px;background:var(--lt)}
.xl-res-duo .xl-res-bu{--lc:var(--mo2);--lt:var(--zhi2)}
/* 先读这一篇：面板里不再套卡，上面一道细线隔开；整块可点 */
.xl-res-di{display:block;margin:8px calc(var(--rp) * -1) 0;padding:14px var(--rp) 18px;border-top:1px solid var(--xian);text-decoration:none}
.xl-res-di small{display:block;margin-bottom:2px;font-size:var(--f1);color:var(--hui)}
.xl-res-di span{font-size:var(--f2);font-weight:600;line-height:1.6;text-decoration:underline;text-decoration-color:var(--xian2);text-underline-offset:4px}
@media (hover:hover){.xl-res-di:hover span{text-decoration-color:var(--mo)}}

/* ---------- 首页第三段：四组文章 ---------- */
.xl-sx{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px;list-style:none;margin:0;padding:0}
.xl-sx a{display:flex;flex-direction:column;height:100%;border-radius:var(--r2);background:var(--ka);box-shadow:var(--ying);overflow:hidden;text-decoration:none;color:var(--mo);transition:transform .2s}
.xl-sx-tu{position:relative;display:block;aspect-ratio:3/2;overflow:hidden;background:var(--zhi)}
.xl-sx-tu img{width:100%;height:100%;object-fit:cover}
.xl-sx-tu::after{content:"";position:absolute;inset:0;background:var(--zhi);opacity:.06}
/* 紫色那张是满版深色：降一点饱和、提一点亮，再多罩一层纸色，和另外三张浅底线稿放在一起不像一块色斑 */
.xl-sx-wen{display:flex;flex-direction:column;gap:6px;padding:18px 20px 22px}
.xl-sx-wen b{position:relative;padding-top:14px;font-size:var(--f3);line-height:1.45}
.xl-sx-wen b::before{content:"";position:absolute;left:0;top:0;width:20px;height:3px;border-radius:2px;background:var(--lc);transition:width .2s}
.xl-sx-wen small{font-size:var(--f1);color:var(--hui)}
.xl-sx-p{font-size:var(--f2);line-height:1.65;color:var(--mo2);text-wrap:pretty}
@media (hover:hover){
  .xl-sx a:hover{transform:translateY(-2px)}
  .xl-sx a:hover .xl-sx-wen b::before{width:40px}
}

/* ---------- 首页第四段：三个小工具（浅色小卡，整卡可点） ---------- */
.xl-gjq-u{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;list-style:none;margin:0;padding:0}
.xl-gjq-x{display:flex;flex-direction:column;gap:10px;height:100%;padding:22px 24px;border-radius:var(--r2);background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian);text-decoration:none;color:var(--mo)}
@media (hover:hover){.xl-gjq-x:hover{box-shadow:inset 0 0 0 1px var(--mo2)}}
.xl-gjq-t{font-size:var(--f2);color:var(--mo2)}
.xl-gjq-z{display:flex;align-items:center;gap:12px;min-height:40px;font-size:var(--f4);font-weight:600;line-height:1.35}
.xl-gjq-z .xl-dui{flex:1 1 auto}
.xl-gjq-x2{font-size:var(--f1);line-height:1.6;color:var(--hui)}
.xl-gjq-ju{font-size:var(--f2);font-weight:400;line-height:1.65;color:var(--mo2)}
.xl-gjq-qu{display:inline-flex;align-items:center;gap:4px;margin-top:auto;font-size:var(--f2);font-weight:600;color:var(--mo)}
.xl-gjq-qu svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.xl-gjq .xl-gjq-x2.xl-dui{margin-top:auto;align-items:end}
/* 各种状态的文字叠在同一格里，只切换看不看得见：格子高度始终是最高的那一种，读到数据时页面不跳 */
.xl-dui{display:grid}
.xl-dui > *{grid-area:1/1;visibility:hidden}
[data-zhuang="dai"] .xl-dui > [data-z~="dai"],[data-zhuang="cha"] .xl-dui > [data-z~="cha"],[data-zhuang="ok"] .xl-dui > [data-z~="ok"],
[data-zhuang="weihu"] .xl-dui > [data-z~="weihu"],[data-zhuang="duan"] .xl-dui > [data-z~="duan"],
[data-zhuang="huo"] .xl-dui > [data-z~="huo"],[data-zhuang="bei"] .xl-dui > [data-z~="bei"]{visibility:visible}
/* 状态灯：线路图上的站点圆点。正常 = 绿，系统维护 = 红，没查到 = 灰色空心，查询中 = 灰 */
.xl-deng{flex:none;width:14px;height:14px;border-radius:50%;background:#C9C6BC}
[data-zhuang="ok"] .xl-deng{background:var(--C);box-shadow:0 0 0 4px var(--C-t)}
[data-zhuang="weihu"] .xl-deng{background:var(--H);box-shadow:0 0 0 4px var(--H-t)}
[data-zhuang="duan"] .xl-deng{background:transparent;box-shadow:inset 0 0 0 2px #A6A398}

/* ---------- 首页第五段：常见问题（默认收起） ---------- */
.xl-sywd-lie{max-width:820px;border-top:1px solid var(--xian)}
.xl-sywd-x{border-bottom:1px solid var(--xian)}
.xl-sywd-x summary{display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:64px;padding:14px 0;cursor:pointer;list-style:none}
.xl-sywd-x summary::-webkit-details-marker{display:none}
.xl-sywd-x summary h3{margin:0;font-size:var(--f3);line-height:1.5;text-wrap:balance}
.xl-sywd-x summary::after,.xl-wenda summary::after,.xl-quan-zhe summary::after,.xl-mulu-zhe summary::after{content:"";flex:none;width:9px;height:9px;margin-right:6px;border-right:1.6px solid var(--mo2);border-bottom:1.6px solid var(--mo2);transform:translateY(-3px) rotate(45deg);transition:transform .2s}
details[open] > summary::after{transform:translateY(2px) rotate(225deg)}
.xl-sywd-x p{margin:0 0 20px;max-width:46em;font-size:var(--f2);line-height:1.85;color:var(--mo2)}
.xl-sywd-x p a{text-decoration-color:var(--xian2)}
@media (hover:hover){.xl-sywd-x p a:hover{text-decoration-color:var(--mo)}}
.xl-sywd-zw{display:inline-block;margin:0 0 8px;padding:0 8px;border-radius:var(--r1);background:var(--H-t);color:var(--H-d);font-size:var(--f1)}

/* ---------- 首页最后：全部文章（收起） ---------- */
.xl-quan-zhe{border-radius:var(--r2);background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian)}
.xl-quan-zhe summary{display:flex;align-items:center;gap:16px;min-height:64px;padding:12px 24px;cursor:pointer;list-style:none}
.xl-quan-zhe summary::-webkit-details-marker{display:none}
.xl-quan-zhe summary span{font-size:var(--f3);font-weight:600}
.xl-quan-zhe summary small{flex:1 1 auto;font-size:var(--f1);color:var(--hui)}
.xl-sy-suoyin{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px 40px;padding:8px 24px 28px}
.xl-sy-zu h3{display:flex;align-items:baseline;gap:10px;margin:0 0 8px;padding-top:12px;border-top:2px solid var(--lc);font-size:var(--f2)}
.xl-sy-zu h3 a{text-decoration:none}
@media (hover:hover){.xl-sy-zu h3 a:hover{text-decoration:underline}}
.xl-sy-zu h3 small{font-size:var(--f1);font-weight:400;color:var(--hui)}
.xl-sy-zu ul{list-style:none;margin:0;padding:0}
.xl-sy-zu li a{display:block;padding:6px 0;font-size:var(--f2);line-height:1.6;text-decoration:none;color:var(--mo2)}
@media (hover:hover){.xl-sy-zu li a:hover{color:var(--mo);text-decoration:underline}}
.xl-sy-pai ul{display:flex;flex-wrap:wrap;gap:4px 16px}
/* p11e：「全部文章」「按情况找」两个文字链挪进折叠内容的末尾，占满一行 */
.xl-sy-qu{grid-column:1 / -1;display:flex;flex-wrap:wrap;gap:4px 28px;margin:0;padding-top:12px;border-top:1px solid var(--xian);font-size:var(--f2)}
.xl-sy-qu a{display:inline-flex;align-items:center;min-height:44px;text-decoration-color:var(--xian2)}
@media (hover:hover){.xl-sy-qu a:hover{text-decoration-color:var(--mo)}}

/* ---------- 面包屑 ---------- */
.xl-mianbao{display:flex;flex-wrap:wrap;align-items:center;gap:0 8px;margin:0 0 24px;font-size:var(--f1);line-height:1.5;color:var(--hui)}
.xl-mianbao a{display:inline-flex;align-items:center;min-height:32px;text-decoration:none}
@media (hover:hover){.xl-mianbao a:hover{color:var(--mo);text-decoration:underline}}
.xl-mianbao span[aria-hidden]{color:#B9B6AC}

/* ---------- 文章页：顶上一条细的阅读顺序条 ---------- */
.xl-zhanxu{background:var(--ka);box-shadow:0 1px 0 var(--xian)}
.xl-zhanxu-in{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:24px;align-items:center;min-height:60px}
.xl-zhanxu-zhong{display:flex;align-items:center;gap:18px}
.xl-zhanxu-ming{display:flex;align-items:center;gap:8px;margin:0;font-size:var(--f1);line-height:1.4;color:var(--mo2);white-space:nowrap}
.xl-zhanxu-ming i{width:14px;height:3px;border-radius:2px;background:var(--lc)}
.xl-dian{display:flex;align-items:center;gap:14px;list-style:none;margin:0;padding:0;position:relative}
.xl-dian::before{content:"";position:absolute;left:6px;right:6px;top:50%;height:2px;margin-top:-1px;background:var(--lc);opacity:.5}
.xl-dian li{position:relative;display:flex}
.xl-dian a,.xl-dian li > span{position:relative;display:block;width:14px;height:14px;border-radius:50%;background:var(--ka);box-shadow:inset 0 0 0 2px var(--lc)}
.xl-dian a::after{content:"";position:absolute;inset:-10px}
@media (hover:hover){.xl-dian a:hover{background:var(--lt)}}
.xl-dian .xl-ben > span{background:var(--lc)}
.xl-lin{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-size:var(--f1);line-height:1.4;color:var(--mo2);text-decoration:none}
.xl-lin svg{flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
@media (hover:hover){a.xl-lin:hover{color:var(--mo)}}
@media (hover:hover){a.xl-lin:hover span{text-decoration:underline;text-underline-offset:3px}}
.xl-lin-kong{color:var(--hui)}
.xl-lin-shang{justify-self:start}
.xl-zhanxu-xia{display:flex;justify-content:flex-end;flex-wrap:wrap;gap:0 20px}

/* ---------- 文章页：两栏（目录 + 正文栏） ---------- */
.xl-wz{padding-top:24px}
.xl-wz-ge{display:grid;grid-template-columns:minmax(0,720px);gap:0}
.xl-wz-ge.xl-you-mulu{grid-template-columns:224px minmax(0,720px);gap:0 80px}
.xl-wz-zuo{position:sticky;top:24px;align-self:start;max-height:calc(100vh - 48px);overflow:auto;padding-top:6px}
.xl-wz-zhong{min-width:0}
.xl-ceng{display:contents}   /* 文章页的包裹层：只为把正文零件和可选的问答放到更深的层级（见 wenzhang.html 里的说明），不参与排版 */
.xl-wz-tou h1{margin:0 0 12px;font-size:var(--f5);line-height:1.3;text-wrap:wrap}
/* 文章页横幅：桌面约 3:1（720 宽时 240 高，p11b 由 16:7 改来），让「简单说」进首屏；手机 172px 高不变（见 ≤720）。
   画是 3:2，裁掉上下各一截；主体偏上 / 偏下的那几张，模板按文件名加 xl-wz-hua-yNN，只在宽屏挪 object-position */
.xl-wz-hua{margin:28px 0 0;border-radius:14px;overflow:hidden;aspect-ratio:3/1;background:var(--zhi2)}
.xl-wz-hua img{width:100%;height:100%;object-fit:cover}
@media (min-width:721px){
  .xl-wz-hua-y30 img{object-position:50% 30%}
  .xl-wz-hua-y70 img{object-position:50% 70%}
}
/* 简单说：浅底 + 左边一条线色竖线 */
.xl-jielun{margin:28px 0 0;padding:18px 22px 18px 24px;border-radius:0 12px 12px 0;background:var(--ka);box-shadow:inset 3px 0 0 var(--lc)}
.xl-mokuai-t{margin:0 0 10px;font-size:var(--f1);font-weight:600;line-height:1.4;color:var(--mo)}
.xl-jielun ul{margin:0;padding:0 0 0 1.1em}
.xl-jielun li{margin:0 0 6px;font-size:var(--f2);line-height:1.75;color:var(--mo2);text-wrap:pretty}
.xl-jielun li:last-child{margin-bottom:0}
.xl-jielun li::marker{color:#A6A398}
/* 本页目录：一条细竖线，当前项加粗加线色 */
.xl-mulu p{margin:0 0 12px;font-size:var(--f1);font-weight:600;color:var(--mo)}
.xl-mulu ol{list-style:none;margin:0;padding:0;border-left:1px solid var(--xian2)}
.xl-mulu li{padding:4px 0}
/* p11e：目录项不截断（原来两行加省略号，像没写完），长的照常折行，19 篇里最长三行 */
.xl-mulu a{display:block;margin-left:-1px;padding:0 0 0 14px;border-left:2px solid transparent;font-size:var(--f2);line-height:1.55;color:var(--hui);text-decoration:none;text-wrap:pretty}
@media (hover:hover){.xl-mulu a:hover{color:var(--mo)}}
.xl-mulu li.xl-dao-zai a{border-left-color:var(--lc);color:var(--mo);font-weight:600}
.xl-wz-zhe{display:none}
.xl-mulu-zhe{border-radius:12px;background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian)}
.xl-mulu-zhe summary{display:flex;align-items:center;gap:10px;min-height:48px;padding:0 16px;cursor:pointer;list-style:none;font-size:var(--f2);font-weight:600}
.xl-mulu-zhe summary::-webkit-details-marker{display:none}
.xl-mulu-zhe summary span{flex:1 1 auto}
.xl-mulu-zhe .xl-mulu{padding:0 16px 12px}
.xl-mulu-zhe .xl-mulu li{padding:0}
.xl-mulu-zhe .xl-mulu a{padding:10px 0 10px 14px;min-height:44px}

/* ---------- 正文 ---------- */
.xl-zw{margin-top:36px;font-size:var(--f3);line-height:1.8;counter-reset:xl-tu}
.xl-zw > p{margin:0 0 1em;text-wrap:pretty}
.xl-zw > h2{margin:2.4em 0 .7em;font-size:var(--f4);line-height:1.4;scroll-margin-top:24px;text-wrap:pretty}
.xl-zw > h2:first-child{margin-top:0}
.xl-zw > h3{margin:1.8em 0 .5em;font-size:var(--f3);line-height:1.55;text-wrap:pretty}
.xl-zw ul,.xl-zw ol{margin:0 0 1em;padding-left:1.4em}
.xl-zw li{margin:0 0 .4em;text-wrap:pretty}
.xl-zw li::marker{color:var(--hui)}
.xl-zw a{text-decoration-color:var(--xian2);text-decoration-thickness:1px}
@media (hover:hover){.xl-zw a:hover{text-decoration-color:var(--lc);color:var(--mo)}}
.xl-zw code{font-size:.9em;background:var(--zhi2);padding:1px 6px;border-radius:4px}
.xl-zw blockquote{margin:0 0 1em;padding:2px 0 2px 16px;border-left:2px solid var(--xian2);color:var(--mo2)}
.xl-zhanwei{padding:14px 16px;border-radius:var(--r1);background:var(--H-t)}

/* 步骤（空心圆环只在这里和线路图上用） */
.xl-bu{margin:1.2em 0 1.6em}
.xl-bu ol{counter-reset:xl-bu;list-style:none;margin:0;padding:0}
.xl-bu li{counter-increment:xl-bu;position:relative;margin:0;padding:2px 0 16px 44px;min-height:44px}
.xl-bu li::before{content:counter(xl-bu);position:absolute;left:0;top:1px;width:28px;height:28px;border-radius:50%;background:var(--ka);box-shadow:inset 0 0 0 2px var(--lc);font:600 var(--f1)/28px var(--zh);text-align:center;color:var(--mo)}
.xl-bu li:not(:last-child)::after{content:"";position:absolute;left:13px;top:34px;bottom:4px;width:2px;border-radius:1px;background:var(--lt)}
.xl-bu li:last-child{padding-bottom:2px}
.xl-bu li p{margin:0}

/* 分流：一张浅卡，几条连着写时拼成一张，中间一道细线 */
.xl-fen{display:grid;grid-template-columns:minmax(0,1fr) 28px minmax(0,1.25fr);gap:14px;align-items:start;margin:0;padding:16px 20px;background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian);border-radius:12px;font-size:var(--f2);line-height:1.7}
.xl-zw > .xl-fen,.xl-zw > p + .xl-fen{margin-top:1.2em}
.xl-fen:has(+ .xl-fen){border-bottom-left-radius:0;border-bottom-right-radius:0}
.xl-fen + .xl-fen{margin-top:-1px;border-top-left-radius:0;border-top-right-radius:0}
.xl-fen:not(:has(+ .xl-fen)){margin-bottom:1.6em}
.xl-fen p{margin:0;text-wrap:pretty}
.xl-fen small{display:block;font-size:var(--f1);font-weight:400;color:var(--hui)}
.xl-fen-kan{font-weight:600;text-wrap:balance}
.xl-fen-jt{position:relative;height:2px;margin-top:calc(var(--f1) * 1.7 + var(--f2) * .85 - 1px);background:var(--lc)}
/* p11c：右边两格不带小标签；zuo 第一行和左边「你的情况」下面那行字对齐（让出小标签那一行的高度） */
.xl-fen-you{padding-top:calc(var(--f1) * 1.7)}
.xl-fen-jt::after{content:"";position:absolute;right:-1px;top:-4px;width:8px;height:8px;border-top:2px solid var(--lc);border-right:2px solid var(--lc);transform:rotate(45deg)}
.xl-fen-ting{margin-top:8px!important;padding-top:8px;border-top:1px solid var(--xian);color:var(--mo2)}

/* 提醒：浅底，不加外框；左边一条竖线分轻重 */
.xl-ti{margin:1.4em 0 1.6em;padding:16px 20px 8px 22px;border-radius:0 12px 12px 0;font-size:var(--f2);line-height:1.8}
.xl-ti p{margin:0 0 8px;text-wrap:pretty}
.xl-ti ul,.xl-ti ol{margin:0 0 8px;padding-left:1.3em}
.xl-ti-t{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:0 0 4px!important}
.xl-ti-lei{font-size:var(--f1);font-weight:600}
.xl-ti-t b{font-weight:600}
.xl-ti-shuoming{background:var(--ka);box-shadow:inset 3px 0 0 #A6A398}
.xl-ti-shuoming .xl-ti-lei{color:var(--hui)}
.xl-ti-zhuyi{background:#FBF0E8;box-shadow:inset 3px 0 0 #E0A27F}
.xl-ti-zhuyi .xl-ti-lei{color:var(--H-d)}
/* p11e：「重要」底色降到和「注意」同一档浅色，只靠左边更粗的一道红线和「重要」实心小块分级别 */
.xl-ti-jinggao{background:#FBEEEA;box-shadow:inset 4px 0 0 var(--H)}
/* 「重要」比「注意」醒目：标签做成实心小块（深一档的红底白字，13px 字对比度够），「注意」只是带色的字（p11b 标签改字后） */
.xl-ti-jinggao .xl-ti-lei{padding:1px 8px;border-radius:var(--r1);background:var(--H-d);color:#fff;line-height:1.5}

/* 官方原文：比本站自己的卡片轻一档，只有左边一道细线 */
.xl-yuan{margin:1.4em 0 1.6em;padding:2px 0 2px 18px;border-left:2px solid var(--xian2)}
.xl-yuan blockquote{margin:0 0 6px;padding:0;border:0;font-size:var(--f2);line-height:1.85;color:var(--mo)}
.xl-yuan blockquote p{margin:0}
.xl-yuan blockquote p::before{content:"「"}.xl-yuan blockquote p::after{content:"」"}
.xl-yuan figcaption{display:flex;flex-wrap:wrap;gap:0 14px;font-size:var(--f1);line-height:1.7;color:var(--hui)}
.xl-yuan figcaption a{display:inline-block;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;vertical-align:top;color:var(--hui);text-decoration-color:var(--xian2)}
.xl-yuan-wz{display:none}

/* 截图：手机竖图（深色手机框 + 圆角）、并排、官方页面片段、网页横图、占位 */
.xl-zw{--tuk:250px}
.xl-tu{margin:1.6em 0 1.8em;counter-increment:xl-tu}
.xl-tu-k{display:block}
.xl-tu figcaption{font-size:var(--f1);line-height:1.65;color:var(--hui)}
.xl-tu figcaption::before{content:"图 " counter(xl-tu);display:block;margin-bottom:2px;font-weight:600;color:var(--mo2)}
.xl-tu-shouji .xl-tu-k{padding:4px;background:var(--mo);border-radius:26px;box-shadow:0 14px 30px -18px rgba(27,32,41,.55)}
.xl-tu-shouji img{border-radius:22px;background:#0F1217}
.xl-zw > .xl-tu-shouji{display:grid;grid-template-columns:var(--tuk) minmax(0,1fr);gap:28px;align-items:end}
.xl-zw > .xl-tu-shouji figcaption{padding-bottom:8px}
.xl-bingpai{display:grid;gap:20px;margin:1.6em 0 1.8em;align-items:start}
.xl-bingpai-2{grid-template-columns:repeat(2,minmax(0,var(--tuk)))}
.xl-bingpai-3{grid-template-columns:repeat(3,minmax(0,210px))}
.xl-bingpai .xl-tu{margin:0}
.xl-bingpai figcaption{margin-top:10px}
.xl-bingpai .xl-tu-pian{max-width:none}
.xl-tu-pian{max-width:400px}
.xl-tu-pian .xl-tu-k{border-radius:var(--r1);overflow:hidden;background:#fff;box-shadow:0 0 0 1px var(--xian),0 6px 16px -12px rgba(27,32,41,.35)}
.xl-tu-pian img{width:100%;height:auto}
.xl-tu-pian figcaption{margin-top:8px}
.xl-tu-pian figcaption::before{display:inline;margin:0 6px 0 0}
.xl-zw > .xl-tu-ai{margin:1.2em 0 1.4em}
.xl-zw > .xl-tu-gao{max-width:none;display:grid;grid-template-columns:280px minmax(0,1fr);gap:28px;align-items:end}
.xl-zw > .xl-tu-gao figcaption{margin:0;padding-bottom:8px}
.xl-zw > .xl-tu-gao figcaption::before{display:block;margin:0 0 2px}
.xl-tu-wangye .xl-tu-k{border-radius:12px;overflow:hidden;box-shadow:0 0 0 1px var(--xian)}
.xl-tu-wangye figcaption{margin-top:10px}
/* 截图外层是「看原图」链接（新标签页打开图片文件）：图注末尾一句小字常显，悬停 / 键盘聚焦时图角再出同一句 */
a.xl-tu-k{position:relative;cursor:zoom-in;color:inherit;text-decoration:none}
a.xl-tu-k::after{content:"点开看原图";position:absolute;right:8px;bottom:8px;padding:2px 8px;border-radius:999px;background:var(--mo);color:#fff;font:500 13px/1.6 var(--zh);pointer-events:none;opacity:0;transition:opacity .15s}
.xl-tu-shouji a.xl-tu-k::after{right:14px;bottom:14px}
a.xl-tu-k:focus-visible::after{opacity:1}
@media (hover:hover){a.xl-tu-k:hover::after{opacity:1}}
.xl-tu figcaption::after{content:"· 点开看原图";margin-left:6px;color:#8A8E95;white-space:nowrap}
.xl-tuwei{display:grid;gap:4px;margin:1.4em 0;padding:18px 20px;border-radius:12px;background:var(--H-t);font-size:var(--f2)}
.xl-tuwei b{color:var(--H-d)}

/* 表格：表头不铺底色、不用粗线，只留细线 */
.xl-biao{overflow-x:auto;margin:1.2em 0 1.6em;-webkit-overflow-scrolling:touch;background:linear-gradient(to left,var(--zhi) 40%,rgba(242,240,233,0)) right center/28px 100% no-repeat local,radial-gradient(farthest-side at 100% 50%,rgba(27,32,41,.16),rgba(27,32,41,0)) right center/12px 100% no-repeat scroll}
.xl-biao table{width:100%;min-width:480px;border-collapse:collapse;font-size:var(--f2);line-height:1.65}
.xl-biao th,.xl-biao td{padding:12px 16px 12px 0;text-align:left;vertical-align:top;border-bottom:1px solid var(--xian)}
.xl-biao thead th{font-size:var(--f1);font-weight:600;color:var(--hui);border-bottom-color:var(--xian2)}
.xl-biao tbody tr:last-child td{border-bottom:0}
.xl-biao th{min-width:5.5em}
.xl-biao td:first-child{font-weight:600}

/* ---------- 参考的官方页面 / 常见问题 / 接着可以看 ---------- */
.xl-yiju,.xl-wenda,.xl-shunlu{margin:64px 0 0}
.xl-yiju .xl-mokuai-t,.xl-shunlu .xl-mokuai-t,.xl-gj-ling .xl-mokuai-t{margin:0 0 12px;font-size:var(--f3);font-weight:600}
.xl-wenda h2{margin:0 0 8px;font-size:var(--f3);line-height:1.5}
.xl-yiju ol{list-style:none;margin:0;padding:0;border-top:1px solid var(--xian)}
.xl-yiju li{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 14px;padding:10px 0;border-bottom:1px solid var(--xian);font-size:var(--f2);line-height:1.6}
.xl-yiju b{font-weight:400;color:var(--mo)}
.xl-yiju-wz{min-width:0;max-width:100%;font-size:var(--f1);color:var(--hui);overflow-wrap:anywhere}
span.xl-yiju-wz{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
a.xl-yiju-wz{color:var(--hui);text-decoration-color:var(--xian2)}
.xl-yiju p{margin:12px 0 0;font-size:var(--f1);color:var(--hui)}
.xl-wenda details{border-bottom:1px solid var(--xian)}
.xl-wenda details:first-of-type{border-top:1px solid var(--xian)}
.xl-wenda summary{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:56px;padding:12px 0;cursor:pointer;list-style:none;font-weight:600;font-size:var(--f2);line-height:1.6}
.xl-wenda summary::-webkit-details-marker{display:none}
.xl-wenda details p{margin:0 0 16px;font-size:var(--f2);line-height:1.85;color:var(--mo2)}
.xl-shunlu-u{list-style:none;margin:0 0 24px;padding:0;border-top:1px solid var(--xian)}
.xl-shunlu-u li{position:relative;border-bottom:1px solid var(--xian)}
.xl-shunlu-u a{display:flex;align-items:center;gap:12px;min-height:56px;padding:12px 0;font-size:var(--f2);font-weight:600;line-height:1.55;text-decoration:none}
.xl-shunlu-u a::before{content:"";flex:none;width:12px;height:3px;border-radius:2px;background:var(--lc)}
@media (hover:hover){.xl-shunlu-u a:hover{text-decoration:underline;text-decoration-color:var(--xian2)}}
.xl-lupai-t{margin:0 0 10px;font-size:var(--f1);font-weight:600;color:var(--hui)}
/* 按情况找的标签：浅底、不加描边、不加圆圈 */
.xl-lupai{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.xl-lupai a,.xl-lupai span{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 14px;border-radius:var(--r1);background:var(--zhi2);font-size:var(--f2);line-height:1.4;color:var(--mo2);text-decoration:none}
@media (hover:hover){.xl-lupai a:hover{background:#E1DDD2;color:var(--mo)}}
.xl-lupai small{font-size:inherit;color:inherit}
.xl-lupai span{color:var(--hui)}

/* ---------- 列表页（栏目 / 按情况找 / 全部文章 / 查找 / 站务 / 404） ---------- */
.xl-lie{padding-top:24px}
.xl-lie-tou{max-width:760px;margin:0 0 32px}
.xl-quan .xl-lie-tou{max-width:none}
.xl-quan .xl-daoyu{text-wrap:balance}
.xl-lie-tou h1{margin:0 0 12px;font-size:var(--f5);line-height:1.3}
.xl-daoyu{margin:0;font-size:var(--f2);line-height:1.8;color:var(--mo2)}
.xl-daoyu p{margin:0 0 10px}
.xl-daoyu p:last-child{margin-bottom:0}
.xl-xianlie{max-width:820px}
.xl-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--xian)}
.xl-list li{position:relative;display:grid;grid-template-columns:minmax(0,1fr);gap:20px;align-items:center;padding:18px 0;border-bottom:1px solid var(--xian)}
.xl-list li.xl-you-tu{grid-template-columns:minmax(0,1fr) 120px}
.xl-list a{font-size:var(--f3);font-weight:600;line-height:1.5;text-decoration:none}
.xl-list a::before,.xl-paizu a::before,.xl-cha-jg a::before{content:"";position:absolute;inset:0;z-index:2}
@media (hover:hover){.xl-list li:hover a{text-decoration:underline;text-decoration-color:var(--xian2);text-underline-offset:4px}}
.xl-list p{margin:6px 0 0;font-size:var(--f2);line-height:1.7;color:var(--mo2);text-wrap:pretty}
.xl-list .xl-hang-meta{display:flex;flex-wrap:wrap;gap:2px 14px;margin-top:6px;font-size:var(--f1);color:var(--hui)}
.xl-hang-lm{display:inline-flex;align-items:center;gap:6px;color:var(--mo2)}
.xl-hang-lm::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--lc)}
.xl-hang-tu{display:block;width:120px;aspect-ratio:3/2;border-radius:10px;overflow:hidden;background:var(--zhi2)}
.xl-hang-tu img{width:100%;height:100%;object-fit:cover}
.xl-fanye{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0 0;font-size:var(--f2)}
.xl-fanye a,.xl-fanye span{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian);text-decoration:none}
.xl-fanye span{background:var(--mo);color:#fff;box-shadow:none}
.xl-cha-hui{display:flex;flex-wrap:wrap;gap:10px;margin:32px 0 0;font-size:var(--f2)}
.xl-cha-hui a{display:inline-flex;align-items:center;min-height:44px;padding:0 20px;border-radius:999px;background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian);text-decoration:none}
@media (hover:hover){.xl-cha-hui a:hover{box-shadow:inset 0 0 0 1px var(--mo2)}}

/* 栏目页：列表在左（进首屏），右栏是画 + 一张小卡（小线路图 + 读完这一组接着看哪一篇） */
.xl-lan-ge{display:grid;grid-template-columns:minmax(0,820px) 320px;justify-content:space-between;gap:0 48px;align-items:start}
.xl-lan-you{position:sticky;top:24px}
.xl-lan-hua{border-radius:14px;overflow:hidden;aspect-ratio:3/2;background:var(--zhi2)}
.xl-lan-hua img{width:100%;height:100%;object-fit:cover}
.xl-lan-ka{margin-top:16px;padding:16px;border-radius:14px;background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian)}
.xl-xd-svg{display:block;width:100%;height:auto;margin:0 0 12px}
.xl-xd-svg path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.xl-xd-gui path{stroke-width:20}
.xl-xd-dang path{stroke-width:14;stroke-linecap:butt}
.xl-xd-an{opacity:.18}
.xl-xd-huan circle{fill:#fff;stroke:var(--mo);stroke-width:7}
.xl-xd-dian{fill:#fff;stroke:var(--lc);stroke-width:8}
.xl-xd-an.xl-sd-H{stroke:var(--H)}.xl-xd-an.xl-sd-J{stroke:var(--J)}.xl-xd-an.xl-sd-C{stroke:var(--C)}.xl-xd-an.xl-sd-B{stroke:var(--B)}
.xl-xd-chu{fill:transparent}
.xl-xd-zhan{cursor:pointer}
.xl-xd-zhan:focus-visible .xl-xd-dian{fill:var(--lc)}
@media (hover:hover){.xl-xd-zhan:hover .xl-xd-dian{fill:var(--lc)}}
.xl-xd-zhan:focus-visible{outline:none}
.xl-xd-zhan:focus-visible .xl-xd-chu{stroke:var(--mo);stroke-width:5}
.xl-lan-jie{margin:0;font-size:var(--f2);line-height:1.7;color:var(--mo2)}
.xl-lan-jie a{color:var(--mo);text-decoration-color:var(--xian2)}
@media (hover:hover){.xl-lan-jie a:hover{text-decoration-color:var(--mo)}}
.xl-lan .xl-lie-tou{margin-bottom:24px}
/* 列表下面的「这一组怎么读」（data/xian.yaml 的 daoyu，p11b 放回来） */
.xl-lan-dao{max-width:760px;margin-top:48px}
.xl-lan-dao h2{margin:0 0 10px;font-size:var(--f3);font-weight:600;line-height:1.4}
.xl-lan-dao p{margin:0;font-size:var(--f2);line-height:1.85;color:var(--mo2);text-wrap:pretty}

/* 全部文章：顶上线网总图，下面按栏目分组 */
.xl-tu-qu{position:relative;margin:0 0 48px;padding:24px 28px;border-radius:var(--r2);background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian)}
.xl-ditu{position:relative;width:100%;aspect-ratio:1200/700;container-type:inline-size}
.xl-gui-svg{position:absolute;inset:0;width:100%;height:100%}
.xl-gui-svg path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.xl-gui path{stroke-width:11}
.xl-dang path{stroke-width:8;stroke-linecap:butt}
.xl-huan circle{fill:#fff;stroke:var(--mo);stroke-width:4}
.xl-xianzu,.xl-xian ol,.xl-xian li{list-style:none;margin:0;padding:0}
.xl-xian-t{margin:0}
/* p11c：标牌只写组名（不再是「H 线」），字放到 14px；右边两组的标牌右端对齐，不伸出图外 */
.xl-xian-t .xl-hui{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);z-index:3;display:inline-flex;align-items:center;height:28px;padding:0 12px;border-radius:14px;background:var(--ld);color:#fff;font:600 14px/1 var(--zh);white-space:nowrap;text-decoration:none}
.xl-xian-you .xl-hui{transform:translate(-100%,-50%)}
@media (hover:hover){.xl-xian-t .xl-hui:hover{background:var(--mo)}}
.xl-xian-zhu{display:none}
.xl-zhan{position:absolute;left:var(--x);top:var(--y);width:0;height:0;color:var(--mo);text-decoration:none;z-index:2}
.xl-zhan::before{content:"";position:absolute;left:-8px;top:-8px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 0 0 3.5px var(--lc)}
.xl-zhan:focus-visible::before{background:var(--lc)}
@media (hover:hover){.xl-zhan:hover::before{background:var(--lc)}}
.xl-zhan:focus-visible{outline:none}
.xl-zhan-m{position:absolute;display:block;line-height:1.3;text-shadow:0 0 3px var(--ka),0 0 3px var(--ka),0 0 4px var(--ka),0 0 6px var(--ka)}
.xl-zhan-m b{font-size:clamp(13px,1.36cqw,15px);font-weight:600}
.xl-zhan:focus-visible .xl-zhan-m b{text-decoration:underline;text-decoration-color:var(--lc);text-underline-offset:3px}
@media (hover:hover){.xl-zhan:hover .xl-zhan-m b{text-decoration:underline;text-decoration-color:var(--lc);text-underline-offset:3px}}
.xl-ce-u .xl-zhan-m{bottom:15px;left:0;width:calc(var(--w) + 1.5cqw);transform:translateX(-50%);text-align:center;text-wrap:balance}
.xl-ce-d .xl-zhan-m{top:15px;left:0;width:calc(var(--w) + 1.5cqw);transform:translateX(-50%);text-align:center;text-wrap:balance}
.xl-ce-r .xl-zhan-m{left:16px;top:0;transform:translateY(-50%);white-space:nowrap}
.xl-ce-l .xl-zhan-m{right:16px;top:0;transform:translateY(-50%);white-space:nowrap;text-align:right}
.xl-zhan-kong{display:none}
/* p11d：图例放进图左上角那块空白（标牌和站名都在 y≥70 以下，左上角没有东西），图下面不再单占一行 */
.xl-tuli{position:absolute;top:24px;left:28px;margin:0}
.xl-tuli ul{display:flex;flex-wrap:wrap;gap:8px 24px;list-style:none;margin:0;padding:0;font-size:var(--f1);color:var(--mo2)}
.xl-tuli li{display:inline-flex;align-items:center;gap:8px}
/* p11e：图例的小图标和图上一个样：圆点 = 小号白芯、线色圈（和 .xl-zhan::before 同一画法，缩小一号）；空心圈 = 粗黑大圈（和图上的换乘圈一样） */
.xl-tuli-dian,.xl-tuli-huan{flex:none;display:block;border-radius:50%;background:#fff}
.xl-tuli-dian{width:12px;height:12px;margin:0 2px;box-shadow:0 0 0 3px var(--H)}
.xl-tuli-huan{width:22px;height:22px;box-shadow:inset 0 0 0 3.5px var(--mo)}
/* p11d：四组文章占满版心，宽屏 2 列（一行两组），每篇只留标题和小画；小工具一行三张小卡；按情况找的标签一行五个排满 */
.xl-quan-zu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 64px;align-items:start;margin:0 0 56px}
.xl-quan-x{margin:0 0 56px}
.xl-quan > :last-child{margin-bottom:0}
.xl-quan-zu .xl-quan-x{margin:0}
.xl-quan-x h2{display:flex;align-items:baseline;gap:8px;margin:0 0 4px;padding-top:14px;border-top:2px solid var(--lc);font-size:var(--f4);line-height:1.4}
.xl-quan-x h2 a{text-decoration:none}
@media (hover:hover){.xl-quan-x h2 a:hover{text-decoration:underline;text-decoration-color:var(--xian2)}}
.xl-quan-x h2 small{font-size:var(--f2);font-weight:400;color:var(--hui)}
.xl-quan-x .xl-list{border-top:0}
.xl-quan-zu .xl-list a{line-height:1.5}
.xl-quan-zu .xl-hang-wen{line-height:1.5}
@media (min-width:721px){
  .xl-quan-zu .xl-hang-wen,.xl-quan-gj b{text-wrap:balance}
  .xl-quan-zu .xl-list li{padding:10px 0}
  .xl-quan-zu .xl-list li.xl-you-tu{grid-template-columns:minmax(0,1fr) 60px;gap:20px}
  .xl-quan-zu .xl-hang-tu{width:60px;border-radius:var(--r1)}
}
.xl-quan-wx h2{border-top-color:var(--mo2)}
.xl-quan-gj{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;list-style:none;margin:16px 0 0;padding:0}
.xl-quan-gj a{display:flex;flex-direction:column;gap:4px;height:100%;padding:16px 20px;border-radius:var(--r2);background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian);color:var(--mo);text-decoration:none}
@media (hover:hover){.xl-quan-gj a:hover{box-shadow:inset 0 0 0 1px var(--mo2)}}
.xl-quan-gj small{font-size:var(--f1);line-height:1.5;color:var(--hui)}
.xl-quan-gj b{font-size:var(--f3);font-weight:600;line-height:1.5}
.xl-quan-pai-t{display:flex;align-items:center;justify-content:space-between;gap:12px 24px;flex-wrap:wrap;padding-top:10px;border-top:2px solid var(--mo2)}
.xl-quan-pai-t h2{margin:0;padding-top:0;border-top:0}
.xl-quan-pai-t .xl-cha-hui{margin:0}
.xl-quan-pai .xl-lupai{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin-top:16px}
.xl-quan-pai .xl-lupai a{display:flex;justify-content:space-between;min-height:44px;white-space:nowrap}
.xl-quan-pai .xl-lupai small{color:var(--hui)}
/* p11d：1001–1100px 宽时线网总图左右留白收窄，图本身变宽，八个字的站名排得下一行（站名 13px 已是下限，不能再小） */
@media (min-width:1001px) and (max-width:1100px){
  .xl-tu-qu{padding:20px 12px}
  .xl-tuli{top:20px;left:24px}
}
/* 线网总图第一次进入视口时画出来（只在宽屏、只一次；脚本加 xl-hua-dai / xl-hua-qi） */
@media (prefers-reduced-motion:no-preference) and (min-width:1001px){
  .xl-hua-dai .xl-gui path{stroke-dasharray:1;stroke-dashoffset:1}
  .xl-hua-dai .xl-dang,.xl-hua-dai .xl-huan{opacity:0}
  .xl-hua-dai .xl-zhan::before{transform:scale(0)}
  .xl-hua-qi .xl-gui path{stroke-dashoffset:0;transition:stroke-dashoffset 1.1s cubic-bezier(.45,0,.2,1)}
  .xl-hua-qi .xl-dang,.xl-hua-qi .xl-huan{opacity:1;transition:opacity .3s .8s}
  .xl-hua-qi .xl-zhan::before{transform:none;transition:transform .28s calc(.3s + var(--i) * 90ms) cubic-bezier(.3,1.6,.6,1)}
}

/* 按情况找 */
.xl-paizu{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px;list-style:none;margin:0;padding:0}
.xl-paizu li{position:relative;padding:20px 22px;border-radius:14px;background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian)}
@media (hover:hover){.xl-paizu li:hover{box-shadow:inset 0 0 0 1px var(--mo2)}}
.xl-paizu a{font-size:var(--f3);font-weight:600;text-decoration:none}
.xl-paizu small{margin-left:10px;font-size:var(--f1);color:var(--hui)}
.xl-paizu p{margin:6px 0 0;font-size:var(--f2);line-height:1.7;color:var(--mo2)}
.xl-lupai-wei{margin:24px 0 0;font-size:var(--f1);color:var(--hui)}
.xl-lie-ge{display:grid;grid-template-columns:minmax(0,820px) 280px;justify-content:space-between;gap:0 48px;align-items:start}
.xl-lie-you{position:sticky;top:24px;padding:20px;border-radius:14px;background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian)}

/* 站内查找 */
.xl-cha{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:12px;align-items:center;max-width:640px}
.xl-cha label{font-size:var(--f2);color:var(--hui)}
.xl-cha input,.xl-app-dui input,.xl-dd input:not([type=checkbox]){min-height:48px;padding:0 14px;border:0;border-radius:var(--r1);background:#fff;box-shadow:inset 0 0 0 1px var(--xian2);font:var(--f3) var(--zh);color:var(--mo)}
.xl-cha input:focus,.xl-app-dui input:focus,.xl-dd input:not([type=checkbox]):focus{outline:none;box-shadow:inset 0 0 0 2px var(--mo2)}
.xl-cha button,.xl-app-dui button{min-height:48px;padding:0 24px;border:0;border-radius:999px;background:var(--mo);color:#fff;font:600 var(--f2) var(--zh);cursor:pointer}
@media (hover:hover){.xl-cha button:hover,.xl-app-dui button:hover{background:#000}}
.xl-cha-zt{margin:16px 0 8px;font-size:var(--f2);color:var(--hui)}
.xl-cha-jg{list-style:none;margin:0;padding:0;max-width:760px}
.xl-cha-jg li{position:relative;padding:14px 0;border-bottom:1px solid var(--xian)}
.xl-cha-jg a{font-weight:600;font-size:var(--f3);text-decoration:none}
@media (hover:hover){.xl-cha-jg li:hover a{text-decoration:underline;text-decoration-color:var(--xian2)}}
.xl-cha-jg p{margin:2px 0 0;font-size:var(--f2);color:var(--mo2)}
.xl-cha-pai{max-width:760px;margin:40px 0 0}
.xl-cha-kong .xl-cha-pai{margin-top:16px}

/* 站务页 */
.xl-zhanwu .xl-zw{max-width:720px;margin-top:0}
.xl-zhanwu .xl-zw > h2{margin-top:2em}
.xl-zhanwu .xl-lie-tou{margin-bottom:24px}

/* 404 */
.xl-lie.xl-404{padding-top:64px}
.xl-404-xian{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;list-style:none;margin:0;padding:0;max-width:760px}
.xl-404-xian a{display:flex;align-items:center;gap:12px;min-height:56px;padding:8px 18px;border-radius:12px;background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian);text-decoration:none;font-size:var(--f2);font-weight:600}
.xl-404-xian a::before{content:"";flex:none;width:12px;height:3px;border-radius:2px;background:var(--lc)}
@media (hover:hover){.xl-404-xian a:hover{box-shadow:inset 0 0 0 1px var(--mo2)}}
.xl-404-xian small{margin-left:auto;font-size:var(--f1);font-weight:400;color:var(--hui)}

/* ---------- 小工具 ---------- */
.xl-wx-ka{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;list-style:none;margin:0;padding:0}
.xl-wx-x{position:relative;display:flex;flex-direction:column;border-radius:var(--r2);background:var(--ka);box-shadow:var(--ying);overflow:hidden}
.xl-wx-tu{display:block;aspect-ratio:3/2;background:var(--zhi2)}
.xl-wx-tu img{width:100%;height:100%;object-fit:cover}
.xl-wx-x > div{padding:18px 20px 22px}
.xl-wx-x small{display:block;margin-bottom:4px;font-size:var(--f1);color:var(--hui)}
.xl-wx-x a{font-size:var(--f3);font-weight:600;line-height:1.5;text-decoration:none}
.xl-wx-x a::before{content:"";position:absolute;inset:0}
@media (hover:hover){.xl-wx-x:hover a{text-decoration:underline;text-decoration-color:var(--xian2)}}
.xl-wx-x p{margin:6px 0 0;font-size:var(--f2);line-height:1.7;color:var(--mo2);text-wrap:pretty}
/* 工具页：正文栏 + 右栏（画 + 另外两个工具） */
.xl-gj-ge{display:grid;grid-template-columns:minmax(0,760px) 300px;justify-content:space-between;gap:0 48px;align-items:start}
.xl-gj-tou{margin:0 0 28px}
.xl-gj-tou h1{margin:0 0 12px;font-size:var(--f5);line-height:1.3;text-wrap:wrap}
.xl-gj-ling{position:sticky;top:24px}
.xl-gj-hua{margin:0 0 20px;border-radius:14px;overflow:hidden;aspect-ratio:3/2;background:var(--zhi2)}
.xl-gj-hua img{width:100%;height:100%;object-fit:cover}
.xl-gj-ling .xl-gj-ling-u{display:grid;gap:10px;list-style:none;margin:0;padding:0}
.xl-gj-ling .xl-gj-ling-u a{display:block;padding:14px 16px;border-radius:12px;background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian);text-decoration:none}
@media (hover:hover){.xl-gj-ling .xl-gj-ling-u a:hover{box-shadow:inset 0 0 0 1px var(--mo2)}}
.xl-gj-ling .xl-gj-ling-u small{display:block;font-size:var(--f1);color:var(--hui)}
.xl-gj-ling .xl-gj-ling-u b{display:block;font-size:var(--f2);line-height:1.55}
.xl-gj-ling .xl-cha-hui{margin-top:16px}
.xl-gj-ling .xl-cha-hui a{min-height:40px;padding:0 16px;font-size:var(--f2)}
.xl-gj-lai{margin:14px 0 0;font-size:var(--f1);line-height:1.7;color:var(--hui)}
.xl-gj .xl-zw{margin-top:40px}
.xl-gjk{margin:0}
.xl-gjk-h{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.xl-gjk-zhu{margin:0 0 16px;font-size:var(--f2);line-height:1.7;color:var(--mo2)}
/* 结果卡（系统状态、App 系统要求）：一张浅色卡，大字结论 + 一句说明 + 查询时刻 */
.xl-jg{padding:26px 28px 22px;border-radius:var(--r2);background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian)}
.xl-jg-tou{display:flex;align-items:center;gap:16px}
.xl-jg-tou .xl-deng{width:16px;height:16px}
.xl-jg-da{margin:0;font-size:var(--f5);line-height:1.25}
.xl-jg-da b{font-weight:600}
[data-zhuang="ok"] .xl-jg-da b{color:var(--C-d)}
[data-zhuang="weihu"] .xl-jg-da b{color:var(--H-d)}
.xl-jg-shuo{margin:12px 0 0;font-size:var(--f2);line-height:1.75;color:var(--mo2)}
.xl-jg-shuo > *{text-wrap:pretty}
.xl-jg-di{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 20px;margin-top:18px;padding-top:14px;border-top:1px solid var(--xian)}
.xl-jg-shi{margin:0;font-size:var(--f1);color:var(--hui)}
.xl-jg-an{min-height:44px;padding:0 4px;border:0;background:none;color:var(--mo);font:600 var(--f2) var(--zh);text-decoration:underline;text-decoration-color:var(--xian2);text-underline-offset:4px;cursor:pointer}
@media (hover:hover){.xl-jg-an:hover{text-decoration-color:var(--mo)}}
.xl-jg-an:disabled{color:#A6A398;cursor:default;text-decoration:none}
.xl-app-shu{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:16px;margin:0}
.xl-app-shu > div{min-width:0}
.xl-app-shu dt{font-size:var(--f1);color:var(--hui)}
.xl-app-shu dd{margin:2px 0 0;font-size:var(--f4);font-weight:600;line-height:1.35}
.xl-app-zd dd{font-size:var(--f5);line-height:1.25}
.xl-app-zd dd b{font-weight:600}
.xl-app .xl-jg-shuo{margin-top:16px;padding-top:14px;border-top:1px solid var(--xian);font-size:var(--f1);color:var(--hui)}
.xl-app-dui{display:grid;gap:8px;margin:28px 0 0}
.xl-app-dui label{font-size:var(--f2);font-weight:600}
.xl-app-hang{display:flex;gap:10px;max-width:420px}
.xl-app-hang input{flex:1 1 auto;min-width:0}
.xl-app-an{margin:0;font-size:var(--f1);color:var(--hui)}
.xl-app-an a{color:var(--mo2)}
.xl-app-jg p{display:none;margin:16px 0 0;padding:16px 18px;border-radius:12px;background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian);font-size:var(--f2);line-height:1.75}
.xl-app-jg[data-jg="gou"] [data-j="gou"],.xl-app-jg[data-jg="bugou"] [data-j="bugou"],.xl-app-jg[data-jg="cuo"] [data-j="cuo"],.xl-app-jg[data-jg="deng"] [data-j="deng"]{display:block}
.xl-app-jg[data-jg="gou"] [data-j="gou"]{box-shadow:inset 3px 0 0 var(--C)}
.xl-app-jg[data-jg="bugou"] [data-j="bugou"]{box-shadow:inset 3px 0 0 var(--H)}
.xl-app-beiju{display:none}
.xl-app-jg[data-lai="bei"] .xl-app-beiju{display:inline}
/* 多久能提现：每一项一张可勾选的横条，勾上以后才在条内展开时间框和这一项的结果 */
.xl-dd-xuan{display:grid;gap:10px}
.xl-dd-x{border-radius:14px;background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian);transition:box-shadow .15s}
.xl-dd-x:has(input[type=checkbox]:checked),.xl-dd-x.xl-dd-on{background:#fff;box-shadow:inset 0 0 0 1px var(--xian2),var(--ying)}
.xl-dd-tou{display:flex;align-items:center;gap:14px;min-height:60px;padding:10px 20px;cursor:pointer}
.xl-dd-tou input{flex:none;width:20px;height:20px;margin:0;accent-color:var(--mo)}
.xl-dd-ming{flex:1 1 auto;font-size:var(--f3);font-weight:600;line-height:1.45}
.xl-dd-shi{flex:none;font-size:var(--f2);color:var(--mo2);white-space:nowrap}
.xl-dd-zhan{display:none;grid-template-columns:auto minmax(0,240px) 1fr;gap:10px 14px;align-items:center;padding:0 20px 18px 54px}
.xl-dd-x:has(input[type=checkbox]:checked) .xl-dd-zhan,.xl-dd-x.xl-dd-on .xl-dd-zhan{display:grid}
.xl-dd-tl{font-size:var(--f1);color:var(--hui)}
.xl-dd-zhan input{width:100%;background:var(--zhi)}
.xl-dd-xr{margin:0;font-size:var(--f2);color:var(--mo)}
.xl-dd-xr time{font-weight:600}
.xl-dd-xs,.xl-dd-ling{grid-column:1 / -1;margin:0;font-size:var(--f1);line-height:1.7;color:var(--hui)}
.xl-dd-zong{margin:20px 0 0;padding:24px 28px;border-radius:var(--r2);background:var(--ka);box-shadow:var(--ying),inset 0 0 0 1px var(--xian)}
.xl-dd-zong p{margin:0}
.xl-dd-zt{font-size:var(--f2);color:var(--mo2)}
.xl-dd-zda{margin-top:4px!important;font-size:var(--f5);font-weight:600;line-height:1.3}
.xl-dd-zc{margin-top:4px!important;font-size:var(--f1);color:var(--hui)}
.xl-dd-lie{list-style:none;margin:18px 0 0;padding:16px 0 0;border-top:1px solid var(--xian);display:grid;gap:12px}
.xl-dd-r1{display:flex;flex-wrap:wrap;justify-content:space-between;gap:2px 16px;font-size:var(--f1);color:var(--mo2)}
.xl-dd-r1 b{font-weight:600;color:var(--mo)}
.xl-dd-90{margin:48px 0 0;scroll-margin-top:24px}
.xl-dd-90 h3,.xl-dd-bt{margin:0 0 8px;font-size:var(--f4);line-height:1.4;scroll-margin-top:24px}
.xl-dd-bt{margin-top:48px}
.xl-dd-90-ge{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.xl-dd-90-x{display:grid;gap:8px;align-content:start;padding:18px 20px;border-radius:14px;background:var(--ka);box-shadow:inset 0 0 0 1px var(--xian)}
.xl-dd-90-x label{font-size:var(--f2);font-weight:600}
.xl-dd-90-x input{background:var(--zhi)}
.xl-dd-90-x p{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:4px 0 0;font-size:var(--f1);color:var(--hui)}
.xl-dd-90-x b{font-size:var(--f3);font-weight:600;color:var(--mo)}
.xl-dd-90-x small{font-size:var(--f1)}

.xl-yangban{padding:10px 14px;border-radius:var(--r1);background:var(--H-t);color:var(--H-d);font-size:var(--f1)}

/* ========== ≤1240：文章页目录收进折叠条 ========== */
@media (max-width:1240px){
  .xl-wz-ge.xl-you-mulu{grid-template-columns:minmax(0,720px);gap:0}
  .xl-wz-zuo{display:none}
  .xl-wz-zhe{display:block;margin-top:24px}
}

/* ========== ≤1099：首页首屏单栏，画是页头下面一条 ========== */
@media (max-width:1099px){
  .xl-shou{padding-top:0}
  .xl-shou-hua{position:static;display:block;margin:0 0 36px}
  .xl-shou-hua img{width:100%;height:220px;object-fit:cover}
  .xl-shou-zuo{width:auto;max-width:640px}
}

/* ========== ≤1000：导航收进「目录」，多栏改单栏 ========== */
@media (max-width:1000px){
  .xl-kuang{padding:0 28px}
  .xl-caidan{display:inline-flex;align-items:center;gap:8px;min-height:44px;min-width:44px;padding:0 4px 0 10px;font-size:var(--f2);font-weight:500;cursor:pointer;-webkit-user-select:none;user-select:none}
  .xl-caidan-d{display:inline-grid;grid-template-columns:repeat(2,6px);gap:3px}
  .xl-caidan-d i{width:6px;height:6px;border-radius:50%;background:var(--lc)}
  #xl-caidan:focus-visible + .xl-caidan{outline:2px solid var(--mo);outline-offset:2px}
  .xl-dao{display:none;position:absolute;left:0;right:0;top:100%;z-index:30;padding:8px 20px 16px;background:var(--ka);box-shadow:0 12px 24px rgba(27,32,41,.08),0 1px 0 var(--xian)}
  #xl-caidan:checked ~ .xl-dao{display:block}
  .xl-dao ul{flex-direction:column;gap:0}
  .xl-dao li + li{border-top:1px solid var(--xian)}
  .xl-dao a{min-height:52px;font-size:var(--f3)}
  .xl-dao a[aria-current]::after{display:none}
  .xl-dao a[aria-current]{font-weight:600}
  .xl-pick-ge{grid-template-columns:minmax(0,1fr);gap:16px}
  /* 首屏三个入口（p11e）：写短说法，一行排三个小入口，白底细线圆角，每个 44px 高 */
  .xl-ru{margin-top:18px}
  .xl-ru-t{margin-bottom:10px}
  .xl-ru ul{display:flex;gap:8px}
  .xl-ru li{flex:1 1 auto}
  .xl-ru a{align-items:center;justify-content:center;height:44px;min-height:44px;padding:0 10px;border-radius:var(--r1);font-size:14px;line-height:1;white-space:nowrap}
  .xl-ru-q,.xl-ru a svg{display:none}
  .xl-ru-d{display:inline}
  .xl-sx{grid-template-columns:repeat(2,minmax(0,1fr))}
  .xl-gjq-u{grid-template-columns:minmax(0,1fr)}
  .xl-sy-suoyin{grid-template-columns:repeat(2,minmax(0,1fr))}
  .xl-lan-ge,.xl-lie-ge,.xl-gj-ge{grid-template-columns:minmax(0,1fr);gap:32px}
  .xl-lan-ge{display:flex;flex-direction:column;gap:0}
  .xl-lan-zuo,.xl-lan-you{display:contents}
  .xl-lan-hua{order:-1;aspect-ratio:auto;height:120px;margin:0 0 24px}
  .xl-lan-hua img{height:120px}
  .xl-lan-ka{order:5;margin-top:24px;padding:0;background:none;box-shadow:none}
  .xl-lan-ka .xl-xd-svg{display:none}
  .xl-lie-you,.xl-gj-ling{position:static}
  .xl-gj-hua{display:none}
  .xl-tu-qu{display:none}
  .xl-quan-zu{grid-template-columns:minmax(0,1fr);gap:48px;margin-bottom:48px}
  .xl-quan-x{margin-bottom:48px}
  .xl-quan-gj{grid-template-columns:minmax(0,1fr);gap:10px}
  .xl-quan-pai .xl-lupai{display:flex}
  .xl-quan-pai .xl-lupai a{display:inline-flex;justify-content:flex-start}
  .xl-wx-ka{grid-template-columns:minmax(0,1fr)}
  .xl-wx-x{flex-direction:row}
  .xl-wx-tu{flex:none;width:34%;aspect-ratio:auto}
  .xl-zhanxu-in{grid-template-columns:minmax(0,1fr) auto;gap:12px}
  .xl-lin-shang,.xl-dian{display:none}
  .xl-zhanxu-zhong{min-width:0}
  .xl-zhanxu-ming{white-space:normal}
  .xl-wei-in{grid-template-columns:minmax(0,1fr)}
}

/* ========== ≤720：手机 ========== */
@media (max-width:720px){
  .xl-kuang{padding:0 20px}
  .xl-tou-in{height:56px}
  .xl-logo b{font-size:20px}
  .xl-logo svg{width:26px;height:26px}
  /* 首屏：页头 → 窄条画（64px 高，p11e 由约 110px 压下来，取景留住桥面四色线）→ H1 → 副标 → 三个小入口 → 邀请码卡 → 文字链 */
  .xl-shou-hua{margin:0 0 16px}
  .xl-shou-hua img{width:100%;height:64px;object-fit:cover;object-position:50% 80%}
  .xl-meiti{display:none}
  .xl-shou h1{line-height:1.25}
  .xl-fubiao{margin-top:8px;font-size:var(--f3);line-height:1.6}
  .xl-shou .xl-ka{margin-top:16px}
  .xl-ka{padding:18px 18px 16px;border-radius:14px}
  .xl-ka-ma{height:52px;margin-top:12px;padding-left:16px}
  .xl-ka-li{margin-top:12px!important;line-height:1.6}
  .xl-ka-qu{flex-direction:column;align-items:stretch;gap:8px;margin-top:14px}
  .xl-ka-lian{width:100%}
  .xl-tuijian{margin-top:12px}
  .xl-tuijian{line-height:1.7}
  .xl-tuijian a{padding:12px 0}
  .xl-qu-tou{margin-bottom:24px}
  /* 第二段：选项一列，选项 → 步骤 → 小线路图 */
  .xl-pick-xuan{grid-template-columns:minmax(0,1fr);gap:8px}
  .xl-ent{min-height:56px;padding:12px 16px;border-radius:12px}
  .xl-res{--rp:18px;border-radius:12px}
  .xl-res > div{padding-top:18px}
  .xl-sx{grid-template-columns:minmax(0,1fr);gap:12px}
  .xl-sx a{display:grid;grid-template-columns:96px minmax(0,1fr);border-radius:14px}
  .xl-sx-tu{aspect-ratio:auto;height:100%;min-height:112px}
  .xl-sx-wen{padding:14px 16px 16px;gap:4px}
  .xl-sx-wen b{padding-top:10px}
  .xl-gjq-x{padding:18px 20px}
  .xl-sy-suoyin{grid-template-columns:minmax(0,1fr);padding:4px 20px 24px}
  .xl-quan-zhe summary{padding:12px 20px}
  .xl-sy-zu li a{min-height:44px;display:flex;align-items:center}
  /* 手机上可点的东西 ≥44px：分组标题、栏目小标签（看着 28px，点击区用 ::after 撑到 44px）、引文出处网址、工具页底下两个按钮 */
  .xl-sy-zu h3 a,.xl-quan-x h2 a{display:inline-flex;align-items:center;min-height:44px}
  .xl-sy-zu h3{padding-top:4px}
  .xl-biaoqian > a{position:relative}
  .xl-biaoqian > a::after{content:"";position:absolute;left:0;right:0;top:-8px;bottom:-8px}
  .xl-yuan figcaption a{padding:11px 0;margin:-11px 0}
  .xl-gj-ling .xl-cha-hui a{min-height:44px}
  .xl-sywd-x summary{min-height:56px}
  .xl-lupai a,.xl-lupai span{min-height:44px}
  /* 文章页 */
  /* 阅读顺序条：左右各两行。左「栏目名 / 第 N 篇 / 共 N 篇」，右「下一篇（或接着看）/ 短名 →」 */
  .xl-zhanxu-in{min-height:56px;gap:16px;padding-top:6px;padding-bottom:6px}
  .xl-zhanxu-ming{display:block;font-size:var(--f1);line-height:1.45;color:var(--mo)}
  .xl-zhanxu-ming i,.xl-zx-d{display:none}
  .xl-zhanxu-ming .xl-nw{display:block;color:var(--hui)}
  .xl-zhanxu-xia{flex-direction:column;align-items:flex-end;gap:0}
  .xl-zhanxu-xia .xl-fenzhi{display:none}
  .xl-lin-xia{gap:8px;text-align:right}
  .xl-lin-w{display:flex;flex-direction:column;align-items:flex-end;line-height:1.45}
  .xl-lin-l{color:var(--hui)}
  .xl-lin-m{color:var(--mo);font-weight:600}
  .xl-lin-h{display:none}
  .xl-wz{padding-top:20px}
  .xl-wz .xl-mianbao{display:none}
  .xl-wz-hua{margin-top:20px;aspect-ratio:auto;height:172px;border-radius:12px}
  .xl-jielun{margin-top:20px;padding:14px 16px 14px 18px}
  .xl-zw{margin-top:28px;line-height:1.75}
  .xl-mianbao a{min-height:44px}
  .xl-mulu-zhe .xl-mulu a{font-size:var(--f3)}
  .xl-fen{grid-template-columns:minmax(0,1fr);gap:8px;padding:14px 16px}
  .xl-fen-jt{display:none}
  .xl-fen-you{padding-top:0;padding-left:12px;box-shadow:inset 2px 0 0 var(--lc)}
  .xl-ti{padding:14px 16px 6px 18px}
  .xl-zw > .xl-tu-shouji{display:block}
  .xl-zw > .xl-tu-shouji .xl-tu-k{width:fit-content;max-width:min(76vw,290px);margin:0 auto}
  .xl-tu-shouji img{max-height:64vh;width:auto}
  .xl-zw > .xl-tu-shouji figcaption{margin-top:10px;padding:0}
  .xl-bingpai{display:flex;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 2px 8px;-webkit-overflow-scrolling:touch}
  .xl-bingpai .xl-tu{flex:0 0 64%;scroll-snap-align:start}
  .xl-bingpai .xl-tu-pian{flex-basis:58%}
  .xl-zw > .xl-tu-pian{max-width:92%}
  .xl-zw > .xl-tu-gao{display:block;max-width:none}
  .xl-zw > .xl-tu-gao .xl-tu-k{width:min(68vw,260px);margin:0 auto}
  .xl-zw > .xl-tu-gao figcaption{margin-top:10px;padding:0}
  .xl-biao table{line-height:1.6}
  .xl-biao-l2 table{min-width:0}
  .xl-biao-l2 :is(th,td):first-child{width:40%}
  .xl-biao-l3 table{min-width:540px}
  .xl-biao-l4 table,.xl-biao-l5 table{min-width:660px}
  .xl-biao th,.xl-biao td{padding:10px 12px 10px 0}
  .xl-biao-l3 :is(th,td):first-child,.xl-biao-l4 :is(th,td):first-child,.xl-biao-l5 :is(th,td):first-child{position:sticky;left:0;z-index:1;width:7.6em;min-width:7.6em;max-width:7.6em;padding-right:12px;background:var(--zhi);box-shadow:inset -1px 0 0 var(--xian)}
  .xl-yiju,.xl-wenda,.xl-shunlu{margin-top:48px}
  .xl-yiju li{display:block}
  .xl-yiju-wz{display:block}
  a.xl-yiju-wz{display:flex;align-items:center;min-height:44px}
  .xl-wei{padding:36px 0 32px}
  .xl-wei-b a{min-height:44px}
  /* 列表页 */
  .xl-list li.xl-you-tu{grid-template-columns:minmax(0,1fr)}
  .xl-hang-tu{display:none}
  .xl-list li{padding:16px 0}
  .xl-lan-dao{margin-top:36px}
  .xl-lan-hua{height:104px;margin-bottom:20px;border-radius:12px}
  .xl-lan-hua img{height:104px}
  .xl-404-xian{grid-template-columns:minmax(0,1fr)}
  /* 404 四个按钮 2 × 2（p11e，原来折成 3 + 1） */
  .xl-404 .xl-cha-hui{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .xl-404 .xl-cha-hui a{justify-content:center}
  .xl-lie.xl-404{padding-top:40px}
  .xl-cha{grid-template-columns:minmax(0,1fr) auto}
  .xl-cha label{grid-column:1 / -1}
  .xl-wx-x{flex-direction:column}
  .xl-wx-tu{width:auto;aspect-ratio:auto;height:120px}
  /* 工具 */
  .xl-jg,.xl-dd-zong{padding:20px}
  .xl-app-shu{grid-template-columns:repeat(2,minmax(0,1fr))}
  .xl-app-zd{grid-column:1 / -1}
  .xl-dd-tou{min-height:56px;padding:10px 16px;gap:12px}
  .xl-dd-tou input{width:22px;height:22px}
  .xl-dd-ming{font-size:var(--f3)}
  .xl-dd-shi{font-size:var(--f1)}
  .xl-dd-zhan{grid-template-columns:minmax(0,1fr);padding:0 16px 16px 50px;gap:8px}
  .xl-dd-tl{margin-bottom:-4px}
  .xl-dd-90-ge{grid-template-columns:minmax(0,1fr)}
  .xl-dd-90-x{padding:16px}
}

/* 减少动态效果：动画和过渡一律关掉 */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}
@media print{.xl-tou,.xl-zhanxu,.xl-wei,.xl-wz-zuo,.xl-shou-hua,.xl-gjq,.xl-gj-ling{display:none}}