/* stylesheet_sll_hf.css — 站点页头/页尾 v2  (生成物, 勿手改)
   生成器: 18a-admin/docs/prototype/home_v3/hf/extract_css.py
   源:     18a-admin/docs/prototype/home_v3/index.html 的 <style> 块
   ★文件名以 style 开头是【故意的】: html_header.php 会自动加载 style*.css,
     字母序排在 stylesheet.css 之后 -> 能覆盖老表。
   ★已做的安全化: body/img/a/h1..h5 五条全局规则已限定到 .hdr/.ftr 内;
     与老站重名的 8 个类已加 sllhf- 前缀。别把它们改回全局。 */
/* html{overflow-x:clip} 是 sticky 页头的前提: 改成 hidden 会让 body 变成滚动容器,
   页头就相对 body 粘而不是相对视口 -> 永远不置顶 (CLAUDE.md §6.26) */
:root{--brand:#1B5FA8;--brand-d:#164E8A;--brand-l:#EFF5FC;--blue:#0EA5E9;--logo:#4CAF16;--ink:#111827;--ink2:#4B5563;--ink3:#8A97A6;--bg:#fff;--bg2:#F7F8FA;--line:#E5E7EB;--dark:#0D1B2A;--max:1360px;--gut:22px;--r:12px;--rb:8px;--sh:0 8px 24px rgba(17,24,39,.10);--f:'Radio Canada Big',-apple-system,BlinkMacSystemFont,'Segoe UI',Arial,sans-serif}
html{overflow-x:clip}
.hdr,.ftr{margin:0;font-family:var(--f);font-size:16px;line-height:1.6;color:var(--ink);background:var(--bg)}
.hdr img,.ftr img{max-width:100%;height:auto;display:block}
.hdr a,.ftr a{color:inherit;text-decoration:none}
.hdr h1,.ftr h1,.hdr h2,.ftr h2,.hdr h3,.ftr h3,.hdr h4,.ftr h4,.hdr h5,.ftr h5{margin:0;line-height:1.2;letter-spacing:-.02em}
.wrap{max-width:var(--max);margin:0 auto;padding:0 20px}
.wrap.narrow{max-width:960px}
.sllhf-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:46px;padding:0 22px;border-radius:var(--rb);font-family:var(--f);font-size:15.5px;font-weight:600;border:1.5px solid transparent;cursor:pointer;transition:.15s}
.sllhf-btn:hover{transform:translateY(-1px);box-shadow:var(--sh)}
.sllhf-btn-p{background:var(--brand);color:#fff}
.sllhf-btn-p:hover{background:var(--brand-d)}
.sllhf-btn-sm{height:38px;padding:0 16px;font-size:14px}
.anno{background:#164E8A;color:#EAF3FB;font-size:13.5px;height:36px;display:flex;align-items:center}
.anno .wrap{display:flex;justify-content:center;gap:36px;white-space:nowrap}
.anno b{color:#BFE3FF}
.hdr{position:sticky;top:-33px;z-index:100;background:#fff;border-bottom:1px solid var(--line)}
.hdr-u{position:relative;z-index:3;border-bottom:1px solid var(--line);font-size:12.5px;color:var(--ink2);height:33px}
.hdr-u .wrap{display:flex;align-items:center;justify-content:space-between;height:32px;gap:16px}
.hdr.compact{background:var(--brand-d)}
.hdr.compact{border-bottom-color:transparent}
.hdr.compact .nav>li>a,.hdr.compact .nav .hot>a,.hdr.compact .hdr-r .icb,.hdr.compact .icb .sllhf-nm{color:#fff}
.hdr.compact .nav>li>a:hover{color:#BFE3FF}
.hdr.compact .hdr-r .icb .ic,.hdr.compact .sbtn{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.30);color:#fff}
.hdr.compact .hdr-r .icb:hover .ic,.hdr.compact .sbtn:hover{background:rgba(255,255,255,.22);border-color:rgba(255,255,255,.5);color:#fff}
.hdr.compact .tagnew{background:#fff;color:var(--brand)}
.nav>li>a{transition:height .18s ease}
.hdr-m,.logo img{transition:height .18s ease,width .18s ease}
.cdrop{position:relative}
.cbtn{display:inline-flex;align-items:center;gap:6px;height:32px;padding:0;border:0;background:none;font:inherit;color:var(--ink2);cursor:pointer}
.cbtn i{width:0;height:0;border:4px solid transparent;border-top-color:currentColor;margin-top:3px}
.cbtn:hover,.cdrop:focus-within .cbtn{color:var(--brand)}
.cmenu{position:absolute;right:-10px;left:auto;top:100%;z-index:60;min-width:292px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 16px 34px rgba(17,24,39,.15);padding:6px;opacity:0;visibility:hidden;transform:translateY(-4px);transition:opacity .15s,transform .15s,visibility .15s}
.cdrop:hover .cmenu,.cdrop:focus-within .cmenu{opacity:1;visibility:visible;transform:none}
.cmenu a{display:block;padding:8px 10px;border-radius:7px;color:var(--ink)}
.cmenu a:hover{background:var(--brand-l)}
.cmenu b{display:block;font-size:12.5px}
.cmenu em{font-style:normal;font-size:12px;color:var(--ink2)}
.cmenu .cm-all{margin-top:4px;padding-top:9px;border-top:1px solid var(--line);color:var(--brand);font-weight:600;font-size:12.5px}
.c-cut{color:var(--ink3)}
.hdr-u .l{display:flex;gap:18px;white-space:nowrap}
.hdr-u .r{display:flex;align-items:center;gap:20px;flex:0 0 auto}
.pill{display:inline-flex;align-items:center;gap:5px;padding:2px 8px;border:1px solid var(--line);border-radius:20px;font-size:12px}
.hdr-u .ext{display:inline-flex;align-items:center;gap:5px;font-weight:600;color:var(--ink)}
.hdr-u .ext em{font-style:normal;font-weight:400;color:var(--ink3);font-size:11.5px}
.hdr-u .ext:hover{color:var(--brand)}
.amz-a{display:inline-block;width:14px;height:14px;border-radius:3px;background:#ff9900;color:#111;font-weight:800;font-size:11px;line-height:14px;text-align:center}
.hdr-m{display:flex;align-items:center;gap:18px;height:65px}
.logo img{width:240px;height:auto}
.nav{display:flex;gap:2px;flex:1 1 auto;min-width:0}
.nav>li>a{display:flex;align-items:center;gap:6px;height:65px;padding:0 35px 0 11px;font-size:15px;font-weight:600;white-space:nowrap}
.nav>li>a:hover{color:var(--brand)}
.nav .hot>a{color:var(--brand)}
.tagnew{background:var(--brand);color:#fff;font-size:9.5px;font-weight:700;padding:2px 5px;border-radius:3px}
.cv{width:7px;height:7px;border-right:1.6px solid currentColor;border-bottom:1.6px solid currentColor;transform:rotate(45deg);margin-top:-4px;opacity:.55}
.mega{position:absolute;top:100%;left:50%;transform:translateX(-50%);background:#fff;border:1px solid var(--line);border-radius:0 0 14px 14px;box-shadow:0 18px 44px rgba(17,24,39,.13);display:none;z-index:120}
.nav>li:hover .mega,.nav>li:focus-within .mega{display:flex}
.mega-s{width:min(620px,calc(100vw - 40px));padding:22px 24px;flex-direction:column}
.mgrid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.mcol h4{font-size:11.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;color:var(--brand);margin-bottom:8px;padding-bottom:6px;border-bottom:1px solid var(--line)}
.mcol a{display:flex;justify-content:space-between;gap:8px;font-size:14px;color:var(--ink2);padding:5px 0}
.mcol a:hover{color:var(--brand)}
.mcol a em{font-style:normal;font-size:11px;color:var(--ink3);font-family:ui-monospace,Menlo,monospace}
.mega-c{width:min(560px,calc(100vw - 40px));padding:14px;flex-direction:column;gap:1px}
.mcard{display:flex;gap:12px;align-items:flex-start;padding:10px 11px;border-radius:10px;transition:background .15s}
.mcard:hover{background:var(--bg2)}
.mcard .mci{flex:0 0 34px;height:34px;border-radius:9px;background:var(--bg2);border:1px solid var(--line);display:flex;align-items:center;justify-content:center;color:var(--brand);transition:.15s}
.mcard:hover .mci{background:#fff;border-color:var(--brand)}
.mcard .mci svg{width:18px;height:18px}
.mcard .mct{min-width:0}
.mcard .mct b{display:block;font-size:14px;font-weight:600;color:var(--ink);line-height:1.3}
.mcard:hover .mct b{color:var(--brand)}
.mcard .mct b .tagnew{margin-left:5px;vertical-align:1px;font-style:normal}
.mcard .mct i{display:block;font-style:normal;font-size:12.5px;color:var(--ink3);line-height:1.45;margin-top:2px;text-wrap:pretty}
.mega-c .mfoot{margin:10px 11px 2px;padding-top:11px;font-size:12.5px}
.mfoot{margin-top:16px;padding-top:12px;border-top:1px solid var(--line);display:flex;justify-content:space-between;gap:16px;font-size:13.5px}
.mfoot a{font-weight:600;color:var(--blue)}
.mega-all{width:min(1440px,calc(100vw - 40px));height:560px;overflow:hidden}
.mrail{flex:0 0 300px;overflow-y:auto;border-right:1px solid var(--line);padding:10px 0;background:var(--bg2)}
.mrail a{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;padding:7px 16px 7px 15px;font-size:13.5px;line-height:1.38;color:var(--ink2);border-left:3px solid transparent;text-align:left}
.mrail a>span{flex:1 1 auto;min-width:0}
.mrail a em{flex:0 0 auto;padding-top:2px;min-width:26px;text-align:right;font-style:normal;font-size:11px;color:var(--ink3);font-family:ui-monospace,Menlo,monospace}
.mrail a.on{background:#fff;color:var(--brand);border-left-color:var(--brand);font-weight:600}
.mpanes{flex:1 1 auto;overflow-y:auto;padding:22px 26px}
.mp{display:none}
.mp.on{display:block}
.mp-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;border-bottom:1px solid var(--line);padding-bottom:10px;margin-bottom:14px}
.mp-h a{font-size:17px;font-weight:700;color:var(--ink)}
.mp-h span{font-size:12px;color:var(--ink3)}
.mp-g{columns:3;column-gap:26px}
.mg{break-inside:avoid;margin-bottom:10px;min-width:0}
.mg .l2{display:flex;justify-content:space-between;align-items:baseline;gap:10px;font-size:13.5px;font-weight:700;color:var(--ink);padding:3px 0;text-align:left}
.mg .l2:hover{color:var(--brand)}
.mg .l2 em{font-style:normal;font-size:11px;color:var(--ink3);font-family:ui-monospace,Menlo,monospace;font-weight:400}
.mg .l3{margin:2px 0 0 2px;padding-left:11px;border-left:2px solid var(--line)}
.mg .l3 a{display:block;font-size:12.5px;line-height:1.45;color:var(--ink2);padding:3px 0;border-left:0;text-align:left}
.mg .l4{margin:1px 0 3px 9px;padding-left:9px;border-left:1px dashed var(--line)}
.mg .l4 a{display:block;font-size:11.5px;line-height:1.4;color:var(--ink3);padding:2px 0;text-align:left}
.mg .l4 a:hover{color:var(--brand)}
.mg .l3 a:hover{color:var(--brand)}
.hdr-r{display:flex;align-items:center;gap:20px;flex:0 0 auto}
.hdr-r>.sbtn{margin-right:20px}
.sbtn{border:1px solid var(--line);background:var(--bg2);color:var(--ink2);width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer}
.sbtn:hover,.hdr.s-open .sbtn{color:#fff;background:var(--brand);border-color:var(--brand)}
.srch{display:none;position:absolute;left:0;right:0;top:100%;z-index:5;background:#fff;border-bottom:1px solid var(--line);box-shadow:0 14px 30px rgba(17,24,39,.12);padding:14px 0}
.hdr.s-open .srch{display:block}
.srch-w{display:flex;justify-content:flex-end;margin:0 auto}
.srch .in{display:flex;align-items:center;width:min(640px,100%);background:var(--bg2);border:1px solid var(--line);border-radius:26px;height:50px;padding:0 8px 0 20px}
.srch input{border:0;background:none;outline:none;font-family:var(--f);font-size:14.5px;flex:1;min-width:0;color:var(--ink)}
.srch button{border:0;background:var(--brand);color:#fff;width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer}
.icb{display:flex;align-items:center;gap:6px;font-size:14px;font-weight:600;color:var(--ink2);white-space:nowrap}
.icb:hover{color:var(--brand)}
.icb .sllhf-nm{max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:inline-block}
.hdr-r .icb .ic{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:var(--bg2);display:flex;align-items:center;justify-content:center;flex:0 0 auto;position:relative;transition:border-color .16s,color .16s,background .16s}
.hdr-r .icb:hover .ic{border-color:var(--brand);color:var(--brand);background:#fff}
.hdr-r .icb svg{width:20px;height:20px}
.cartn{background:var(--brand);color:#fff;font-size:11px;font-weight:700;border-radius:10px;padding:1px 6px}
.hdr-r .icb .cartn{position:absolute;top:-4px;right:-4px;min-width:11px;padding:1px 5px;border:2px solid var(--bg);border-radius:10px;line-height:1.25}
.burger{display:none;flex-direction:column;gap:4px;background:none;border:0;padding:8px;cursor:pointer}
.burger i{width:22px;height:2px;background:var(--ink);border-radius:2px}
.usp .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.ftr{background:var(--dark);color:#A9B2BE;padding:48px 0 0;font-size:14px}
.ftr h4{color:#fff;font-size:13px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;margin-bottom:12px}
.ftr a{color:#A9B2BE}
.ftr a:hover{color:#fff}
.ftr .wrap,.usp .wrap{max-width:min(1760px,92vw)}
.ftr-top{display:grid;grid-template-columns:1.4fr 1fr 1.1fr 1.3fr 1.1fr;gap:34px;padding-bottom:30px;border-bottom:1px solid #26303F}
.ftr-top li{margin-bottom:7px;font-size:13.5px}
.ftr-top p{font-size:13.5px;margin:12px 0 0}
.trade{background:#18212F;border:1px solid #2A3547;border-radius:12px;padding:14px;margin-top:16px}
.trade b{color:#fff;display:block}
.trade p{margin:4px 0 10px;font-size:12.5px}
.cinfo{font-size:12.5px;line-height:1.65}
.cinfo b{color:#C6CEDA}
.soc{margin-top:20px}
.soc-h{display:block;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:#8E99A8;font-weight:700;margin-bottom:10px}
.soc-row{display:flex;flex-wrap:wrap;gap:7px}
.si{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:8px;flex:0 0 auto;background:#1B2634;border:1px solid #2B3646;color:#B9C3D0;transition:background .16s,color .16s,border-color .16s,transform .16s}
.si svg{width:17px;height:17px;display:block}
.si:hover{transform:translateY(-2px);color:#fff}
.si.yt:hover{background:#FF0000;border-color:#FF0000}
.si.fb:hover{background:#1877F2;border-color:#1877F2}
.si.tw:hover{background:#000;border-color:#4A5666}
.si.am:hover{background:#FF9900;border-color:#FF9900;color:#111}
.si.tp:hover{background:#00B67A;border-color:#00B67A}
.si.ig:hover{background:#E1306C;border-color:#E1306C}
.si.pi:hover{background:#E60023;border-color:#E60023}
.si.tt:hover{background:#000;border-color:#4A5666}
.ftr-bot{padding:18px 0;font-size:12.5px;color:#8E99A8}
.ftr-bot p{margin:0;max-width:none;line-height:1.7}
.ftr-bot.line{border-top:1px solid #26303F;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px}
.ftr-pay{padding:18px 0 4px;border-top:1px solid #26303F}
.pay-h{display:block;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:#8E99A8;font-weight:700;margin-bottom:10px}
.ftr ul{list-style:none;margin:0;padding:0}
.ftr-pay{display:grid;grid-template-columns:1fr 1.35fr;gap:30px}
.chips{display:flex;flex-wrap:wrap;gap:7px}
.chip{display:inline-flex;align-items:center;height:26px;padding:0 11px;border-radius:6px;background:rgba(255,255,255,.07);border:1px solid #2B3646;color:#DCE3EC;font-size:12px;font-weight:600;letter-spacing:.01em;white-space:nowrap}
.pay-note{margin:10px 0 0;font-size:12px;line-height:1.6;color:#8E99A8}
.pay-note a{color:#BFE3FF;font-weight:600}
@media(max-width:1320px){
  .nav>li>a{padding:0 8px;font-size:14.5px}
}
@media(max-width:1100px){
  .hdr-u .l{display:none}
  .sbtn{width:34px;height:34px}
  .icb .sllhf-nm{display:none}
  .hdr-r .icb .ic{width:34px;height:34px}
  .hdr-r>.sbtn{margin-right:10px}
}
@media(max-width:992px){
  .ftr-pay{grid-template-columns:1fr;gap:18px}
  .srch .in{width:100%}
  .nav{display:none}
  .burger{display:flex}
  .usp .wrap{grid-template-columns:repeat(2,1fr)}
  .ftr-top{grid-template-columns:1fr 1fr}
  .anno .wrap>span:nth-child(-n+2){display:none}
}
@media(max-width:600px){
  .wrap{padding:0 12px}
  .usp .wrap,.ftr-top{grid-template-columns:1fr}
  .hero-cta .sllhf-btn{width:100%}
  .srch{display:none}
  .logo img{width:170px}
  .c-cut{display:none}
}
.anno .wrap{justify-content:flex-start}
.anno .anno-rv{margin-left:auto;display:flex;gap:18px}
.anno .anno-rv a{color:#EAF3FB;text-decoration:none}
.anno .anno-rv a:hover{color:#fff;text-decoration:underline}
.anno .anno-rv b{margin-right:4px}
.anno .anno-tp,.anno .anno-gg{font-style:normal;margin-right:5px}
.anno .anno-tp{color:#00B67A}
.anno .anno-gg{color:#FBBC04}
@media(max-width:1319px){
  .anno .wrap>span:first-child{display:none}
}
@media(max-width:640px){
  .anno .wrap>span:nth-child(3){display:none}
  .anno .anno-rv{margin:0 auto}
}
@media(max-width:480px){
  .anno .anno-rv{gap:12px;font-size:12px}
}
.cinfo span{display:block;margin-top:10px}
.cinfo span:first-child{margin-top:0}
.cinfo b{display:block;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:#8E99A8;font-weight:700;line-height:1.5}

/* ===== 接入老站的适配层 (extract_css.py 生成, 改这里去改生成器) ===== */

/* ① box-sizing: 草稿原文是 *{box-sizing:border-box}, 提取时被排除了(星号会波及全站)。
      局部化到页头页尾内。不加的话 .wrap 的 max-width:1360 + 左右 padding 20 = 实际 1400。 */
.hdr,.ftr,.hdr *,.ftr *{box-sizing:border-box}

/* ② 老页头是 #header_m{position:fixed}, 所以 .main_bg 有 margin-top:170px 给它让位。
      v2 页头是 sticky, 自己占文档流 —— 那 170px 就变成页头下面一块空白。
      ★用兄弟选择器限定★: 关掉 v2 开关时页面上没有 .hdr, 这条自动失效, 老页头的补偿原样回来。
      不要改 stylesheet.css 里的 .main_bg —— 那样回滚开关就救不了布局了。 */
.hdr ~ .main_bg{margin-top:0}

/* ③ 页尾里 EZ-Pages 动态输出自带 .footer-links / .list-style-none, 老表给了它们样式,
      这里拉回新页尾的列表观感(与写死的那几栏一致)。 */
.ftr .footer-links{list-style:none;margin:0;padding:0}
.ftr .footer-links li{margin:0}

/* ④ 购物车角标: 老表 stylesheet.css 的 #topcartnr 是【ID 选择器】(1,0,0),
      优先级压过新页头的 .cartn / .hdr-r .icb .cartn (0,1,0 / 0,3,0) ->
      角标一直是老的绿色 #22b476 + 老的定位(right:-5px;top:0;height:15px)。
      这里用 .hdr #topcartnr (1,1,0) 压回去, 值与 .cartn + .hdr-r .icb .cartn 合并后一致。
      ★不要去改 stylesheet.css 里的 #topcartnr★ —— 那条还管着老页头(v2 开关关掉时要用)。 */
.hdr #topcartnr{position:absolute;top:-4px;right:-4px;left:auto;bottom:auto;display:block;
  height:auto;min-width:11px;padding:1px 5px;line-height:1.25;font-size:11px;font-weight:700;
  color:#fff;background:var(--brand);border:2px solid var(--bg);border-radius:10px}

/* ⑤ ☠☠ 老表 stylesheet.css 里有两条【裸标签】规则, 直接命中 v2 的 <header class="hdr"> 和 <footer class="ftr">:
        header{background:#fff;margin:0;text-align:center}
        footer{width:100%;height:auto;overflow:hidden;padding:50px 0 40px;background:#f7f7f7;border-top:2px solid #424242}
      标签(0,0,1) 输给类(0,1,0), 所以背景/内边距被新样式压住了 —— 但【新样式没有声明过的属性原样生效】:
        text-align:center 就这么继承进了整个页头页尾, 巨型分类菜单里 2/3/4 级分类全部居中
        (业务 2026-09-09 反馈「所有下拉的分类全部是居中的」); footer 头上还挂着一条 2px 灰线。
      ★这是 §6.27③ 的【反向版】★: 那条讲「草稿的裸标签会砸老站」, 这条是「老站的裸标签砸新页头」。
      新增任何裸标签样式时, 两个方向都要各查一遍。 */
.hdr,.ftr{text-align:left}
.ftr{border-top:0}

/* ⑥ 货币下拉 #currPopup: 老表是 #currPopup{position:absolute;right:0}, 而 .pill 没有 position ->
      它的定位父级变成 .hdr-u(position:relative) -> 点一下下拉就跑到页头条的最右端/屏幕外
      (业务 2026-09-09 反馈「点一下,下拉跑右上角去了」)。
      ★根因是【缺一个定位上下文】, 不是 z-index★ —— 判据见 CLAUDE.md §6.26②。
      ★不要去改 stylesheet.css 里的 #currPopup★ —— 那条还管着老页头(v2 开关关掉时要用)。 */
.hdr .pill.curr{position:relative;cursor:pointer}
.hdr #currency_switcher{display:inline-flex;align-items:center;gap:5px;color:inherit;cursor:pointer}
.hdr #currPopup{top:calc(100% + 9px);left:50%;right:auto;bottom:auto;transform:translateX(-50%);
  min-width:132px;padding:5px 0;background:var(--bg);border:1px solid var(--line);border-radius:10px;
  box-shadow:0 14px 30px rgba(17,24,39,.16);z-index:200}
.hdr #currPopup ul li a{display:block;padding:6px 14px;font-size:12.5px;line-height:1.5;
  color:var(--ink2);white-space:nowrap}
.hdr #currPopup ul li a:hover{background:var(--brand-l);color:var(--brand)}

/* ⑦ 货币药丸「太大了」: 里面那个 <i class="iconfont iconsanjiao"> 是老站图标字体,
      老表给 .iconfont 的 font-size:16px/line-height:25.6px 把药丸整体撑到 32px 高,
      而旁边的 Track order 只有 20px —— 所以它看起来比谁都大(业务 2026-09-09 反馈)。
      ★这是本轮第三次同一个模式★: 复用老站的 class/id, 老表针对它写的字号/尺寸就原样带进来了
      (前两次: #topcartnr 角标绿色 / #currPopup 定位)。接入前 grep 一遍那个 class 是必做动作。 */
.hdr .pill{padding:1px 9px;line-height:18px}
.hdr .pill .iconfont{font-size:9px;line-height:1;height:auto;margin-left:1px;opacity:.75}
/* 币种旁边那面国旗(USD/EUR/GBP/CAD/AUD 各一面, 见 build_header.py)。
   ★必须给 box-shadow 当描边★: 荷兰/英国这类白底旗在白色页头上会和背景糊在一起。 */
.hdr .pill .flag-cur{display:block;width:19px;height:10px;border-radius:1.5px;margin-left:1px;
  box-shadow:0 0 0 1px rgba(17,24,39,.14);flex:0 0 auto}
/* 收起(.compact)后页头是品牌蓝, 那道深色描边看不见了 -> 换成浅色 */
.hdr.compact .pill .flag-cur{box-shadow:0 0 0 1px rgba(255,255,255,.45)}

/* ⑧ 迷你购物车弹窗右对齐到【1360 的版心】而不是浏览器右边缘。
      老表 #carttopcontainer{position:absolute;right:-1px}, 而 .hdr-m/.hdr-r 都是 static ->
      定位父级一路找到 .hdr(position:sticky, sticky 也会建立包含块) = 整个视口宽,
      于是弹窗贴着屏幕右边缘; 窄屏上会被挤出去看不到产品信息(业务 2026-09-09 反馈)。
      给版心 .hdr-m 加 position:relative 即可。
      ⚠ 这会连带把 .mega 的包含块从 .hdr 换成 .hdr-m —— 实测几何完全不变
      (.wrap 本身居中, 且它的下边缘就是 .hdr 的下边缘), 上线前后量过 mega 的 rect。 */
.hdr .hdr-m{position:relative}
.hdr #carttopcontainer{top:100%;right:0;left:auto}

/* ⑨ 页头收起(.compact)后主行是品牌蓝, 角标默认也是品牌蓝 -> 会和底色糊在一起。
      收起时换成【白底蓝字】。这条必须写在 ADAPT 层: #topcartnr 是老站的 id,
      得用 .hdr.compact #topcartnr (1,2,0) 才压得过老表的 #topcartnr (1,0,0)。 */
.hdr.compact #topcartnr{background:#fff;color:var(--brand);border-color:transparent}

/* ⑩ 页头版心必须和【页面版心】逐像素对齐(业务 2026-09-09:「两边留 GAP 导致和下面的页面无法对齐」)。
      草稿的 .wrap 是 max-width:1360 + padding:0 20px, 而老站的页面容器 .mainWrapper 是
      【一套四档的固定宽度、零内边距】(stylesheet.css):
          >=980 -> 980 / >=1200 -> 1160 / >=1320 -> 1280 / >=1400 -> 1360
      两套算法不一样, 所以内容左边缘差着那 20px padding —— 1600px 视口下实测
      页面正文左边 113px、页头 LOGO 左边 133px。
      ★对齐的正确做法是【照抄同一套阶梯】, 不是把 padding 删掉★ ——
      删 padding 只在 >=1400 那一档碰巧对得上, 1200~1400 之间照样错位。
      断点和宽度必须与 stylesheet.css 那四条逐字一致, 那边改了这边要跟着改。
      ★页尾也一起★ —— 草稿给 .ftr .wrap 单独写了 max-width:min(1760px,92vw)(比页头宽),
      那样页头/正文/页尾就是三条不同的左边线。全站一条竖线才是业务要的。
      ☠☠ 2026-09-10: 四档一律用 width:min(Npx,100%) 而不是裸的 width:Npx ——
      【滚动条陷阱】老站那四条是包在 @media(min-width:980px) 里的, 这里当初抄成了
      「基础无条件 980px + 靠 max-width:979px 去覆盖」。而 @media 的宽度【含滚动条】、
      documentElement.clientWidth【不含】: 视口正好 980 时 max-width:979 不匹配 ->
      版心保持 980, 而内容区只有 965 -> 实测溢出 15px。min(...,100%) 一行同时封住四档。
      2026-09-11: 公告条 .anno .wrap 也并进这套阶梯 —— 右侧加了 Trustpilot/Google 评分(左对齐 + 右靠边),
      不对齐的话公告条左右边线比页头各缩进约 77px, 一眼看得出。 */
.hdr .wrap,.hdr .srch-w,.anno .wrap{max-width:none;padding:0;width:min(980px,100%)}
@media(min-width:1200px){.hdr .wrap,.hdr .srch-w,.anno .wrap{width:min(1160px,100%)}}
@media(min-width:1320px){.hdr .wrap,.hdr .srch-w,.anno .wrap{width:min(1280px,100%)}}
@media(min-width:1400px){.hdr .wrap,.hdr .srch-w,.anno .wrap{width:min(1360px,100%)}}
@media(max-width:979px){.hdr .wrap,.hdr .srch-w,.anno .wrap{width:auto;padding:0 12px}}

/* ⑩b 页尾【不跟】页头那套固定阶梯, 改成自适应、上限 1440(业务 2026-09-09:
      「页尾信息比较多, 1360 在 2K-4K 上看着挤; 但 12-14 寸小屏要能自适应」)。
      ★为什么页头页尾这次可以不一样★ —— ⑩ 那条要的是「页头和正文左边一条竖线」,
      页尾在正文【下面】、不与任何内容并排, 宽一点不会露出错位; 而它有 5 列要摆。
      ★不用 100vw★(§6.27④: 100vw 含滚动条, 会横向溢出 ~15px 再被 overflow 悄悄裁掉)。
      width:auto 让它跟着父级(.ftr 全宽块)流动, 由 max-width 封顶、padding 留边:
        1280 视口 -> 内容 1232 | 1440 -> 1392 | >=1488 -> 封顶 1440 | 1024 -> 976
      box-sizing:border-box 已由 ① 给 .ftr * 设过, 所以 max-width 就是含 padding 的外宽。 */
.ftr .wrap{width:auto;max-width:1488px;padding:0 24px;margin:0 auto}
@media(max-width:979px){.ftr .wrap{padding:0 12px}}
/* 版心跟着老站阶梯之后, 1200~1319 那一档只有 1160(原来是"视口宽-40"), 页头会被压窄 ——
   实测 1135px 视口下 LOGO 被 flex 挤成 203px(草稿里 .logo 没写 flex, 默认可收缩)。
   两条一起解决, 实测 980 版心里 LOGO 满 240 + 导航 548 + 右侧 156, 一点不溢出: */
.hdr .logo{flex:0 0 auto}                       /* LOGO 永不被挤扁 */
@media(max-width:1199px){.hdr .icb .sllhf-nm{display:none}}   /* 账户名提前藏(草稿里是 1100), 省约 60px */

/* ⑫ ☠ 手机窄屏(<600px): 页头第一行右侧那组 .hdr-u .r 撑破屏幕(2026-09-10 实测)。
      .hdr-u .r 是 flex:0 0 auto(不收缩) + 531px 宽; 而 @media(max-width:1100px) 当初
      只隐藏了【左边】的 tagline .l, 右边这组从来没人处理过。
      真实窄视口实测(iframe 包一层避开 headless 的 ~500px 最小布局宽度; 且排除
      visibility:hidden 的下拉面板和被 overflow 容器接住的元素 —— 不排除会得到一堆假阳性):
          360px 视口 溢出 187px | 375 -> 172 | 399 -> 148 | 585 -> 0
      被 html{overflow-x:clip}(§6.26) 悄悄裁掉, 用户看不到也点不到。
      ★手机上留【功能】去【营销展示】★: 留 货币切换 + Track order + Contact us,
        去 YouTube + Amazon store(页尾还有一份, 不会丢入口)。
      ⚠️ 这两条现在【在手机上还看不到】—— 手机走 templates/mobile 的老页头。
         这是为「以后 PC 自适应版批量替换旧移动模板」提前做的(业主 2026-09-10 定的两条线)。 */
@media(max-width:600px){.hdr-u .r .yt,.hdr-u .r .amz{display:none}}

/* ⑪ 邮件订阅框: 这几个 class 是订阅【模块】在 PHP 渲染时才吐出来的(.mailer-form / .mailform-group /
      button.btn-submit), 草稿 markup 里根本没有 -> 写在草稿 <style> 里会被 keep() 当"没人用的规则"丢掉。
      ★凡是运行时才出现的 class, 样式必须写在 ADAPT 里★。
      另外 button 上那个 class="btn" 是模块写死的, 不经过 sllhf- 改名, 所以这里按标签选, 别按 .btn 选。 */
.ftr-sub{margin:0 0 16px}
.ftr-sub form,.ftr-sub .mailform-group{display:flex;gap:8px;margin:0}
.ftr-sub input[type=text]{flex:1 1 auto;min-width:0;height:38px;padding:0 12px;border-radius:8px;
  background:#18212F;border:1px solid #2B3646;color:#fff;font-family:var(--f);font-size:13px;outline:none}
.ftr-sub input[type=text]::placeholder{color:#7C8798}
.ftr-sub input[type=text]:focus{border-color:var(--blue);background:#1B2634}
.ftr-sub button{flex:0 0 auto;height:38px;padding:0 16px;border:0;border-radius:8px;background:var(--brand);
  color:#fff;font-family:var(--f);font-size:13px;font-weight:600;cursor:pointer;line-height:1}
.ftr-sub button:hover{background:#2E7ACb}
/*  ⚠ 这里必须写 .sllhf-nm 不是 .nm —— ADAPT 是在【类改名之后】拼上去的, 不会再过一遍改名。 */

/* ============================================================================
   手机端页头 + 分类抽屉（2026-09-16 上线，业主拍板参考 superbrightleds 的模式）
   ★只在 ≤992px 生效，桌面端一条规则都不碰。
   ★抽屉的分类数据由 jscript_sll_hf.js 从页面上已有的 .mega-all DOM 里读，
     HTML 一个字没改 —— 676 条分类内链原样保留，SEO 零影响。
   ★交互：全屏覆盖 + 逐层进入（不是手风琴，24 个一级 / 676 个分类用手风琴会太长）
     每层首行「Shop all X」直达分类页，顶部 ‹ 返回上一级，右上 × 关闭。
   ★回滚：删掉本段 + jscript_sll_hf.js 里的 ⑥ 段即可（或用 deploy 的 _ROLLBACK.sh）。
   ☠ .mdr-row em 必须写 !important —— 站点级 CSS 在窄屏把 em 整个 display:none 了。
   ============================================================================ */
@media(max-width:992px){
  .hdr .hdr-m{display:flex;align-items:center;gap:6px;min-height:56px;position:relative;padding:6px 12px 6px 46px}   /* ☠ 右侧必须留 padding, 否则购物车图标贴屏幕边(业主真机反馈) */
  .hdr .burger{display:flex!important;position:absolute;left:2px;top:50%;margin-top:-22px;width:44px;height:44px;flex-direction:column;align-items:center;justify-content:center;gap:5px}
  .hdr .burger i{width:20px;height:2px}
  .hdr .logo{flex:1 1 auto;min-width:0}
  .hdr .logo img{width:auto;max-width:100%;height:30px}
  .hdr .hdr-r{flex:0 0 auto;gap:0;margin-left:auto}
  .hdr .hdr-r .icb .ic,.hdr .hdr-r .sbtn{width:40px;height:40px}
  .hdr .hdr-r .sllhf-nm{display:none}
  .hdr .hdr-u .r .trk,.hdr .hdr-u .r .pill.curr{display:none}
  html.mdr-open,html.mdr-open body{overflow:hidden}

  .mdr{position:fixed;inset:0;text-align:left;z-index:2000;background:#fff;display:none;overflow:hidden;font-family:inherit;color:#0F172A}
  .mdr.on{display:block}
  .mdr-bar{position:absolute;top:0;left:0;right:0;height:56px;display:flex;align-items:center;gap:6px;padding:0 6px;border-bottom:1px solid #E5E9F0;background:#fff;z-index:5}
  .mdr-bar .bk{display:none}
  .mdr.deep .mdr-bar .bk{display:block}
  .mdr-bar .t{flex:1;font-size:16px;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding-left:10px}
  .mdr-bar button{width:44px;height:44px;border:0;background:none;font-size:24px;line-height:1;color:#0F172A;cursor:pointer}

  .mdr-screen{position:absolute;top:56px;left:0;right:0;bottom:0;background:#fff;overflow-y:auto;-webkit-overflow-scrolling:touch;transform:translateX(100%);transition:transform .22s ease;padding-bottom:40px}
  .mdr-screen.in{transform:none}
  .mdr-screen.home{transform:none}

  .mdr-line{display:flex;align-items:stretch;border-bottom:1px solid #EEF1F6}
  .mdr-row{flex:1;text-align:left;display:flex;align-items:center;gap:10px;min-height:46px;padding:0 6px 0 16px;font-size:14.5px;color:#0F172A;text-decoration:none}
  .mdr-row .t{flex:1}
  .mdr-row em{display:inline!important;font-style:normal;font-size:12.5px;color:#8A94A6;padding-right:4px}
  .mdr-go{width:48px;border:0;border-left:1px solid #EEF1F6;background:none;color:#5B6B80;font-size:0;cursor:pointer;position:relative}
  .mdr-go:after{content:"";position:absolute;top:50%;left:50%;width:9px;height:9px;margin:-5px 0 0 -6px;border-right:2px solid #8A94A6;border-bottom:2px solid #8A94A6;transform:rotate(-45deg)}
  .mdr-row.has{padding-right:0}

  .mdr-all{text-align:left;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:46px;padding:0 16px;background:#F4F7FB;border-bottom:1px solid #E5E9F0;font-size:14.5px;font-weight:700;color:#0B57A4;text-decoration:none}
  .mdr-all em{display:inline!important;font-style:normal;font-weight:400;font-size:12.5px;color:#64748B}
  .mdr-back{display:block;width:100%;text-align:left;min-height:46px;padding:0 18px;border:0;border-bottom:1px solid #EEF1F6;background:#fff;color:#5B6B80;font-size:14px;cursor:pointer}

  .mdr-foot{border-top:8px solid #F1F4F8;margin-top:6px}
  .mdr-foot h5{margin:0;padding:14px 16px 5px;font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;color:#8A94A6}
  .mdr-foot a{display:flex;align-items:center;min-height:44px;padding:0 16px;font-size:14.5px;color:#0F172A;text-decoration:none;border-bottom:1px solid #EEF1F6}
  .mdr-foot .mut{color:#8A94A6;font-size:12.5px}
  .mdr-foot .two{display:grid;grid-template-columns:1fr 1fr}
  .mdr-foot .two a{border-right:1px solid #EEF1F6}

  /* 2026-09-16 第二轮（业主真机反馈）：
     ① 页头收起(.compact)是品牌蓝底 -> 汉堡三条杠必须转白, 不然看不见；
     ② 右侧三个圆图标太挤 -> 缩到 38px 并给出间距；
     ③ 抽屉首屏直接展开 24 个一级分类, 分类区加小标题；
     ④ 「Browse all 676 categories」挪到分类列表最后, 不再误触跳 site_map；
     ⑤ 行高 53 -> 46, 字号 15 -> 14.5（业主: 行间距可以稍小点）。 */
  .hdr.compact .burger i{background:#fff}
  .hdr .hdr-r{gap:8px;padding-right:2px}
  .hdr .hdr-r .icb .ic,.hdr .hdr-r .sbtn{width:38px;height:38px}
  .mdr-h{margin:0;padding:16px 16px 6px;font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;color:#8A94A6;background:#fff;border-top:8px solid #F1F4F8}
  .mdr-all-end{background:#fff;color:#0B57A4;border-top:1px solid #EEF1F6;font-weight:600}
  /* 正文在窄屏贴边（.centerColumn 左右 padding 是 0）—— 全站补一个 16px 水槽 */
  /* 窄屏正文水槽：★放在 #columnCenter 上★ —— 分类页/产品列表页的 .sll-head/.sll-prose/#navBreadCrumb/.sll-also
     都是 .centerColumn 的【兄弟】而不是子元素，只给 .centerColumn 加 padding 会漏掉它们（业主 09-16 连报两次「左边距还是没改好」）。
     ☠ 加在这一层之后，.centerColumn 自己就不要再加，否则叠成 32px。 */
  #columnCenter{padding-left:12px;padding-right:12px;box-sizing:border-box}   /* 09-16 业主：16 -> 10 -> 12px（10 有点小） */

  /* 抽屉打开时把浮在最上层的回顶按钮和 LiveChat 气泡收起来（它们 z-index 比抽屉高）。
     ★只是 display:none，关掉抽屉立刻回来；LiveChat 本体不动（业主要求保留）。 */
  html.mdr-open #back-to-top,html.mdr-open #slc-bubble,html.mdr-open #slc-panel{display:none!important}

  /* ===== 2026-09-16 第三轮（业主真机逐页反馈）=====================================
     ① 回顶按钮原来 right:173px（按 1360 版心算的）→ 窄屏靠右, 并抬到客服气泡上面；
     ② 面包屑路径太长会挤成好几行 → 单行 + 左右滑动；
     ③ 正文里的图片/视频一律按比例缩放, 绝不压变形（业主: PC 看不出问题, 手机会被挤扁）；
     ④ 选项卡 / 账户导航这类横条 → 不换行, 改左右滑动（业主: 希望是左右滑动不是自动跳行）；
     ⑤ 一页结帐步骤条 → 已完成的只留图标, 把宽度让给当前步骤的文字（业主原话）；
     ⑥ 真正放不下的表格由 jscript_sll_hf.js ⑦ 段自动套横向滚动壳（订单历史那种已堆叠成卡片的不动）。 */
  #back-to-top{right:12px!important;left:auto!important;bottom:96px!important}
  #navBreadCrumb{white-space:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;font-size:12px;padding-bottom:2px;scrollbar-width:none}
  #navBreadCrumb::-webkit-scrollbar{display:none}
  #columnCenter img{max-width:100%!important;height:auto!important}
  /* ☠ 上一条是给「正文内容图片」防压扁用的，但会误伤靠 height:100% + object-fit 撑满方框的组件图 ——
     首页分类格(1:1 框)图片下面空出一大块就是它（业主 09-16 截图）。组件图单独还原（特异度高于上一条）。 */
  #columnCenter .hb-cat .ph img,#columnCenter .hb-prod .ph img,#columnCenter .hb-fac img,#columnCenter .sll-cart-item__img img,
  #columnCenter .sll-subcat .sll-subcat-img img,#columnCenter .sll-product .sll-product-img img,#columnCenter .sll-products-live .productslistimg img{height:100%!important}
  #columnCenter iframe,#columnCenter video,#columnCenter embed{max-width:100%!important;width:100%!important}
  .sll-acct-nav{flex-wrap:wrap!important;overflow:visible!important}   /* 业主 09-16: 账户页不要滑动, 自动换行 */
  .sll-tblx{display:block;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .TabbedPanelsTabGroup{flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;-webkit-overflow-scrolling:touch;scrollbar-width:none;touch-action:pan-x}   /* ☠ Spry 那套 CSS 有 overflow:hidden, 不加 !important 压不住 */
  .TabbedPanelsTabGroup::-webkit-scrollbar{display:none}
  .TabbedPanelsTabGroup>li{flex:0 0 auto!important;white-space:nowrap}
  .sll-steps{display:flex!important;flex-wrap:nowrap!important;gap:6px}
  .sll-steps>li{flex:0 0 auto!important;min-width:0}
  .sll-steps>li>span{display:none}
  .sll-steps>li.is-here{flex:1 1 auto!important;min-width:0}
  .sll-steps>li.is-here>span{display:inline;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}
/* YouTube 视频 16:9（只在支持 aspect-ratio 的浏览器上动高度, 不支持就保留原 height, 免得塌成 0） */
@supports (aspect-ratio:16/9){@media(max-width:992px){#columnCenter iframe[src*="youtube"],#columnCenter iframe[src*="youtu.be"]{aspect-ratio:16/9;height:auto!important}}}
/* ☠ 2026-09-16 修：下面这几段原来被误插在上一行 @supports 的花括号里、却不在 @media 里 ->
     桌面端也生效了（业主 PC 截图：账户页订单表在电脑上也变成了卡片）。原因是追加规则时用「插在文件最后一个 } 前」，
     而最后一行恰好是单行的 @supports{@media{…}}。现在单独包一层 @media(max-width:992px)。
     ★以后往本文件追加窄屏规则：直接写一个完整的 @media 块追加到文件末尾，不要再「插进最后一个 }」★ */
@media(max-width:992px){
  /* 面包屑最后一层 = 当前页自己（<a class="bread-active">，本来就没有 href，不是内链）。
     窄屏路径放不下时把它藏掉，只留能点的层级。★JSON-LD BreadcrumbList 一个字不动★
     —— 结构化数据是 tpl_main_page.php 另外生成的，5 层齐全，富媒体结果不受影响。
     层级 ≥3 才藏（由 JS 打 .bc-cut 类），否则只剩一个孤零零的 Home。 */
  /* 面包屑下拉（JS ⑧ 段生成）：原来的整条路径隐藏, 换成一个按钮 + 下拉全路径
     2026-09-16 二改（业主：太靠左、行距太高）：
       · #navBreadCrumb 在 #columnCenter 外面, 吃不到 16px 水槽 -> 自己加左右 16px；
       · 行高 40px -> 上下 8px + 1.35 行高（约 34px）；
       · ☠ 老 stylesheet.css 有 #navBreadCrumb span{font-size:11px;margin:0 6px}，当前页那行和按钮文字都是 span，
         会被缩成 11px 还往右偏 -> 这里全部 !important 重置。 */
  #navBreadCrumb.bc-drop{text-align:left;position:relative;white-space:normal;overflow:visible;padding:6px 12px 4px !important;margin:0 !important}
  #navBreadCrumb.bc-drop>li,#navBreadCrumb.bc-drop>span{display:none}
  #navBreadCrumb.bc-drop.bc-off>li,#navBreadCrumb.bc-drop.bc-off>span{display:inline}
  #navBreadCrumb.bc-drop.bc-off .bc-btn,#navBreadCrumb.bc-drop.bc-off .bc-panel{display:none}
  #navBreadCrumb .bc-btn{display:inline-flex;align-items:center;gap:8px;max-width:100%;height:32px;padding:0 10px 0 12px;border:1px solid var(--line);border-radius:8px;background:#fff;font:inherit;font-size:13px;line-height:1;color:var(--ink2);cursor:pointer}
  #navBreadCrumb .bc-btn .bc-btn-t{font-size:13px !important;margin:0 !important;color:inherit !important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #navBreadCrumb .bc-btn .bc-cv{width:0;height:0;border:4px solid transparent;border-top-color:currentColor;margin-top:4px;flex:0 0 auto}
  #navBreadCrumb.is-open .bc-btn{border-color:var(--brand);color:var(--brand)}
  #navBreadCrumb .bc-panel{text-align:left;position:absolute;z-index:120;top:calc(100% + 2px);left:12px;right:12px;max-width:420px;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 12px 30px rgba(17,24,39,.14);padding:4px 0;overflow:hidden}
  #navBreadCrumb .bc-row{display:block;text-align:left;margin:0 !important;padding-top:8px;padding-bottom:8px;padding-right:14px;min-height:0;line-height:1.35 !important;font-size:14px !important;color:var(--ink) !important;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  #navBreadCrumb .bc-row+.bc-row{border-top:1px solid var(--bg2)}
  #navBreadCrumb .bc-row:hover{background:var(--bg2)}
  #navBreadCrumb .bc-row.is-cur{color:var(--ink3) !important;font-size:13.5px !important}

  /* 「也买了」整块在 .centerColumn【外面】（#columnCenter 的兄弟节点），吃不到上面那条 16px 水槽，
     所以标题会顶到屏幕边 —— 单独补。 */

  /* 账户页「Previous Orders」表格: 业主要求不用左右滑动, 直接堆叠成卡片（和订单历史页一个样子）。
     表头标签用 ::before 补回去（列固定 6 列: 日期/单号/收货人/状态/金额/操作）。 */
  .sll-orders .sll-tablewrap{overflow:visible!important}
  #prevOrders,#prevOrders tbody,#prevOrders tr,#prevOrders td{display:block;width:auto!important}
  #prevOrders thead,#prevOrders tr.tableHeading,#prevOrders tr:has(> th){display:none!important}   /* 表头在 tbody 里的 tr.tableHeading, 光藏 thead 不够（业主：这里导航有意义吗）*/
  #prevOrders tr.sll-order-row{border:1px solid #E5E9F0;border-radius:10px;padding:10px 12px;margin:0 0 12px}
  #prevOrders td{display:flex;align-items:baseline;justify-content:space-between;gap:14px;padding:5px 0;border:0!important;text-align:right}
  #prevOrders td::before{content:attr(data-l);flex:0 0 auto;font-size:11.5px;letter-spacing:.05em;text-transform:uppercase;color:#8A94A6;text-align:left}
  #prevOrders td:nth-child(1)::before{content:"Order date"}
  #prevOrders td:nth-child(2)::before{content:"Order no."}
  #prevOrders td:nth-child(3)::before{content:"Shipped to"}
  #prevOrders td:nth-child(4)::before{content:"Status"}
  #prevOrders td:nth-child(5)::before{content:"Order total"}
  #prevOrders td:nth-child(6){justify-content:flex-end;padding-top:10px}
  #prevOrders td:nth-child(6)::before{content:""}
  #prevOrders address{font-style:normal;text-align:right}
  #prevOrders .sll-order-acts{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}

  /* 产品属性下拉：老结构里 select 外面那层 div.back 是 413px 定宽, 比正文还宽 -> 顶出屏幕。 */
  #productAttributes select,#productAttributes .back,#productAttributes div[id^="cpsxdx"]{max-width:100%!important;width:100%!important;box-sizing:border-box}
  #productAttributes select{text-overflow:ellipsis}
}

/* 面包屑下拉的「桌面态还原」必须是全局规则, 不能放在窄屏 @media 里：
   页面在手机宽度生成过下拉按钮、再拉宽到桌面时, JS 会加 .bc-off；如果隐藏规则只在 ≤992px 生效,
   桌面上按钮就以浏览器默认灰框样式露出来（业主 09-16 截图：完整路径后面多了个灰色按钮）。 */
#navBreadCrumb.bc-drop.bc-off .bc-btn,#navBreadCrumb.bc-drop.bc-off .bc-panel{display:none !important}
#navBreadCrumb.bc-drop.bc-off>li,#navBreadCrumb.bc-drop.bc-off>span{display:inline-block !important}

/* 内容页两列卡片在手机上不铺满（2026-09-16 业主：led_strip_wiring_diagrams.html「两个框放不下，一个应该自适应全宽」）
   ☠ 卡片是内容 HTML 里的内联样式：flex:1 1 calc((100% - 18px)/2); min-width:300px; max-width:calc((100% - 18px)/2)
      手机上「一半宽」< 300px，min-width 胜出 -> 卡片卡死 300px、右边空一块。内联样式只能 !important 压。
   按样式特征匹配（同时含 min-width:300px 和 max-width:calc( ），BLOG/附加页同类两列卡片一起修。 */
@media(max-width:700px){
  #columnCenter [style*="min-width:300px"][style*="max-width:calc("],
  #columnCenter [style*="min-width: 300px"][style*="max-width: calc("]{flex:1 1 100% !important;max-width:100% !important;min-width:0 !important}
}

/* 手机端 H1（2026-09-16 业主：「标题排两行理解不了，字体在移动端太大了？」）
   ☠ 分类页/产品页 H1 带 text-wrap:balance（均衡换行）—— 浏览器会故意把标题拆成长度相近的两行，
     第一行明明还有空也会提前断（如 Non-white Single / Color COB Strip）。手机上改回普通换行；
     字号 32px -> 26px（产品名更长 -> 23px）。桌面端不动。 */
@media(max-width:700px){
  .sll-head h1,.sll-pg h1,.sll-h1,.centerColumn h1.sll-page-h1{text-wrap:wrap !important;font-size:26px !important;line-height:1.22 !important;letter-spacing:-.01em}
  .sll-pi h1,.sll-pi h1.productGeneral,#productName{text-wrap:wrap !important;font-size:23px !important;line-height:1.25 !important}
}

/* 页头「Contact us」下拉在手机端伸出屏幕左边（2026-09-16 业主截图）：
   电脑端 Contact us 在工具栏最右, 所以 .cmenu 写的是 right:-10px 往左展开 292px；手机端它排到了左边, 往左展开就出屏。
   手机端让 .cdrop 不再做定位基准, 面板改以整条工具栏 .hdr-u（本身 position:relative）为基准, 左右各留 16px。 */
@media(max-width:992px){
  .hdr .hdr-u .cdrop{position:static}
  .hdr .hdr-u .cmenu{left:12px;right:12px;min-width:0;width:auto;max-width:420px;top:100%}
}

/* 手机端小字（2026-09-16 全站附加页批量检测：73 页里 specials / 购物车 / 规格书中心 / 知识地图有 < 12px 的正文级文字）
   Google 移动端易读性门槛是 12px。产品卡的 Options / See All Discount Pricing 原来 10px，折扣标 11px -> 统一 12px。 */
@media(max-width:760px){
  .plg-opt-tag,.plg-qty-hint,.plg-badge-discount,.productPriceDiscount{font-size:12px !important}
  #columnCenter [style*="position:absolute"][style*="font-size:11px"]{font-size:12px !important}
}

/* 2026-09-16 边距改 10px 之后的两处跟进：
   ① 附加页 .centerColumn.sll-pg 在窄屏自带 12px 左右内边距，叠加外层 #columnCenter 10px = 22px，标题比面包屑多缩一截 -> 窄屏去掉，只保留外层 10px；
   ② 产品卡底行 .plg-bottom-row 是不换行 flex（总宽 ~142px），Options 标签 + 「See All Discount Pricing」挤一行，字号提到 12px 后被挤成三行 ->
      允许换行，折扣提示单独一行、不折行，放不下省略号。 */
@media(max-width:992px){
  #columnCenter > .centerColumn{padding-left:0 !important;padding-right:0 !important}
}
@media(max-width:760px){
  .plg-bottom-row{flex-wrap:wrap !important;row-gap:4px}
  .plg-bottom-row .plg-qty-hint{flex:1 1 100% !important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left !important}
}

/* 产品图全屏查看器（JS ⑬b 生成，只在手机端打开）：先适配屏幕，点图 1:1 可拖动，左右滑切换 */
html.sll-lb-open,html.sll-lb-open body{overflow:hidden}
html.sll-lb-open #back-to-top,html.sll-lb-open #slc-bubble,html.sll-lb-open #slc-panel{display:none !important}
.sll-lb{position:fixed;inset:0;z-index:3000;background:#0b0f14;display:none;flex-direction:column}
.sll-lb.on{display:flex}
.sll-lb-bar{flex:0 0 52px;display:flex;align-items:center;justify-content:space-between;padding:0 6px 0 16px;color:#cbd5e1;font-size:14px}
.sll-lb-x{width:44px;height:44px;border:0;background:none;color:#fff;font-size:30px;line-height:1;cursor:pointer}
.sll-lb-stage{flex:1 1 auto;min-height:0;overflow:hidden;display:flex;align-items:center;justify-content:center;touch-action:pan-y}
.sll-lb-img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;cursor:zoom-in;-webkit-user-select:none;user-select:none}
.sll-lb.zoom .sll-lb-stage{display:block;overflow:auto;-webkit-overflow-scrolling:touch;touch-action:auto}
.sll-lb.zoom .sll-lb-img{max-width:none;max-height:none;cursor:zoom-out}
.sll-lb-prev,.sll-lb-next{position:absolute;top:50%;margin-top:-22px;width:40px;height:44px;border:0;border-radius:8px;background:rgba(15,23,42,.55);color:#fff;font-size:28px;line-height:1;cursor:pointer}
.sll-lb-prev{left:8px}.sll-lb-next{right:8px}
.sll-lb.zoom .sll-lb-prev,.sll-lb.zoom .sll-lb-next,.sll-lb.zoom .sll-lb-hint{display:none}
.sll-lb-hint{flex:0 0 40px;display:flex;align-items:center;justify-content:center;color:#94a3b8;font-size:12.5px}
@media(max-width:820px){ #scrollImg a.sll-cur img,#smallImg a.sll-cur img{outline:2px solid var(--brand,#1B5FA8);outline-offset:-2px} }

/* 手机端附加页：内容自带的透明外层左右内边距（DB 里 inline 的 section/div padding:Npx 20px、BLOG 外层 padding:0 15px）
   和 #columnCenter 的 12px 叠加成 27~32px。手机上去掉这层，统一只留 12px 全站边距（业主 2026-09-16）。
   只动无背景/无边框/无阴影的外层；带底色的 hero/卡片内边距保留。73 页审计命中 199 个，全部是整宽外层。 */
@media(max-width:767px){
 #columnCenter section[style*="px 20px"]:not([style*="background"]):not([style*="border"]):not([style*="shadow"]),
 #columnCenter div[style^="padding:"][style*="px 20px"]:not([style*="background"]):not([style*="border"]):not([style*="shadow"]),
 #columnCenter div[style*="max-width:1360px"][style*="padding:0 15px"]:not([style*="background"]){padding-left:0 !important;padding-right:0 !important}
}

/* 推荐商品横滑（tpl_modules_featured_products.php，购物车空页 / 分类页共用）2026-09-17
   原 jCarouselLite 给 #box、ul、li 写死像素宽度 + ul 负 left 位移；这里全部压掉，改成原生横向滚动 + 吸附。
   每屏张数：>1100 五个 / 861~1100 四个 / 601~860 三个 / ≤600 两个；卡片间距 14px（手机 10px）。 */
#featuredProducts #scroll.sll-feat-rail{position:relative;overflow:visible;margin:10px 0 0;padding:0 34px}
#featuredProducts .sll-feat-rail #box{float:none;margin:0;width:auto !important;overflow-x:auto !important;overflow-y:hidden !important;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;scrollbar-width:none;left:auto !important}
#featuredProducts .sll-feat-rail #box::-webkit-scrollbar{display:none}
#featuredProducts .sll-feat-rail #box ul{--n:5;--g:14px;display:flex;gap:var(--g);width:auto !important;left:auto !important;position:static !important}
#featuredProducts .sll-feat-rail #box li{float:none !important;flex:0 0 calc((100% - (var(--n) - 1) * var(--g)) / var(--n));width:auto !important;height:auto !important;padding:0 !important;scroll-snap-align:start;box-sizing:border-box !important}
#featuredProducts .sll-feat-rail #box li > *{height:100%;box-sizing:border-box}
#featuredProducts .sll-feat-rail #prev,#featuredProducts .sll-feat-rail #next{top:50%;margin-top:-22px;z-index:3}
@media(max-width:1100px){#featuredProducts .sll-feat-rail #box ul{--n:4}}
@media(max-width:860px){#featuredProducts .sll-feat-rail #box ul{--n:3}}
@media(max-width:600px){
 #featuredProducts #scroll.sll-feat-rail{padding:0}
 #featuredProducts .sll-feat-rail #box ul{--n:2;--g:10px}
 #featuredProducts .sll-feat-rail #prev,#featuredProducts .sll-feat-rail #next{display:none}   /* 手机靠手指滑，箭头压在卡片上反而挡字 */
}

/* 手机端分类页产品列表工具条 + 分类页小字位置（2026-09-17 业主，只动手机，PC 不变）
   原来：「Sort by:」标签 + 排序框 + 数量一行，页码/网格列表切换图标再掉第二行，工具条 ~96px 高，顶部还有一份页码。
   现在：一行 = [排序框][1–20 of 30 products][网格|列表图标 靠右]；「Sort by:」只对读屏保留（排序框里本来就是 Recommended 等选项，看得懂）；
   顶部页码在手机上隐藏，翻页统一在列表【底部右下角】；底部条只留页码靠右，不再重复数量。
   目录分类页（#best-sellers）标题下那行「1–20 of 30 products」和工具条重复，手机上藏标题下那份。 */
@media(max-width:760px){
  #columnCenter .mu-list-number-boxs.sll-listbar{flex-wrap:nowrap;gap:8px;padding:6px 8px;margin-bottom:12px}
  #columnCenter .sll-listbar .sll-listbar-l{flex:1 1 auto;min-width:0;flex-wrap:nowrap;gap:8px}
  #columnCenter .sll-listbar .sll-listbar-r{flex:0 0 auto;flex-wrap:nowrap;gap:0}
  #columnCenter .sll-listbar .custom-sorter-wrapper{flex:0 0 auto}
  #columnCenter .sll-listbar label{position:absolute !important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;margin:0}
  #columnCenter .sll-listbar select{max-width:142px;font-size:13px}   /* 09-17 业主：「Recommended」被截成 Recommend… -> 128 放到 142，刚好完整；不加回 Sort by 字样（390px 放不下） */
  #columnCenter .mu-list-number-boxs.sll-listbar .navSplitPagesResult{flex:1 1 auto;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:12.5px;text-align:right}   /* 09-17 业主：数量靠右 */
  #columnCenter .mu-list-number-boxs.sll-listbar:not(.sll-listbar--bottom) .navSplitPagesLinks{display:none !important}
  #columnCenter .sll-listbar .plv-btn{width:32px;height:30px}
  /* 底部条：只留页码，靠右 */
  #columnCenter .mu-list-number-boxs.sll-listbar.sll-listbar--bottom{justify-content:flex-end;background:none;border:0;padding:0;margin:16px 0 0}
  #columnCenter .sll-listbar--bottom .sll-listbar-l,#columnCenter .sll-listbar--bottom .plv-toggle{display:none}
  #columnCenter .sll-listbar--bottom .navSplitPagesLinks{margin:0 !important;white-space:nowrap}
  #columnCenter .sll-listbar .navSplitPagesLinks a,#columnCenter .sll-listbar .navSplitPagesLinks strong.current{min-width:34px;padding:6px 9px}
  #columnCenter .sll-cat-catalog #best-sellers > .sll-section-head .sll-note{display:none}

  /* 分类页 H2 横条下的小字（如「3 types · pick one to see its products →」）靠右 */
  #columnCenter .sll-cat .sll-section-head--bar .sll-note--cta{margin-left:auto;text-align:right}

  /* 子分类卡片底部：「Read more」「View products →」各自不折行；一行放不下时 View products 整体掉到下一行并靠右 */
  #columnCenter .sll-subcat-foot{flex-wrap:wrap;gap:4px 10px}
  #columnCenter .sll-subcat-foot .sll-more,#columnCenter .sll-subcat-foot .sll-go{white-space:nowrap}
  #columnCenter .sll-subcat-foot .sll-go{margin-left:auto}

  /* 目录分类页热销卡片底行 .plg-bottom-fea 和 .plg-bottom-row 同病（上一轮只改了 row）：Options 一行，折扣提示单独一行不折行 */
  #columnCenter .plg-bottom-fea{flex-wrap:wrap !important;row-gap:4px}
  #columnCenter .plg-bottom-fea .plg-qty-hint{flex:1 1 100% !important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left !important}
}

/* 手机分类抽屉 第四版（2026-09-17 业主：参考 superbrightleds「简洁，清楚，干净，明了」；覆盖上面 .mdr 的旧样式，JS 在 ⑥）
   · 不显示产品数量；子级页顶栏是灰底「‹ Back」+ ×，下面粗体大标题 = 当前分类名，首行普通样式「Shop all X」（去掉原来蓝底那行，和标题重复）
   · 有下级的行：右侧 34px 描边方框箭头（点文字进分类页，点方框进下一级）
   · 首屏分区：Explore（带图标）/ Shop by category / Account / Help & contact，粗体区块标题 + 深色分隔线 */
@media(max-width:992px){
  .mdr{color:#1F2937}
  .mdr-bar{height:56px;padding:0 8px 0 4px;border-bottom:1px solid #E5E7EB;background:#fff}
  .mdr.deep .mdr-bar{background:#F3F4F6}
  .mdr-bar .bk{display:flex !important;align-items:center;gap:6px;width:auto;height:44px;padding:0 10px 0 8px;font-size:17px;font-weight:700;color:#111827;pointer-events:none}
  .mdr.deep .mdr-bar .bk{pointer-events:auto}
  .mdr:not(.deep) .mdr-bar .bk svg{display:none}
  .mdr-bar .bk .t{padding:0;font-size:17px;font-weight:700}
  .mdr-bar > .t{display:none}
  .mdr-bar .x{margin-left:auto;display:flex;align-items:center;justify-content:center;width:44px;height:44px;color:#111827}
  .mdr-h{border-top:0;background:#fff;margin:0;padding:22px 16px 10px;font-size:17px;font-weight:700;letter-spacing:0;text-transform:none;color:#111827;border-bottom:1px solid #D1D5DB}
  .mdr-screen > .mdr-h:first-child{padding-top:14px}
  .mdr-title{padding:18px 16px 12px;font-size:20px;line-height:1.25;font-weight:700;color:#111827;border-bottom:1px solid #D1D5DB}
  .mdr-line{align-items:center;border-bottom:1px solid #E5E7EB;padding-right:12px}
  .mdr-row{min-height:52px;padding:0 10px 0 16px;gap:12px;font-size:15px;font-weight:400;color:#1F2937}
  .mdr-row .ico{flex:0 0 20px;color:#374151}
  .mdr-row em{display:none !important}
  .mdr-go{flex:0 0 34px;width:34px;height:34px;border:1px solid #D1D5DB;border-radius:6px;background:#fff}
  .mdr-go:after{width:8px;height:8px;margin:-4px 0 0 -6px;border-color:#374151;border-width:0 2px 2px 0}
  .mdr-go:active{background:#F3F4F6}
  .mdr-row:active{background:#F9FAFB}
}

/* ===== 手机端简化 · 全站通用（2026-09-17 业主批准清单一：1 页脚折叠 / 2 隐藏页头工具行 / 3 商品卡片精简）===== */
/* 2 页头第二行「Track order / Contact us」—— 抽屉菜单 Account / Help & contact 里都有，手机上隐藏，省一行 */
@media(max-width:992px){
  .hdr .hdr-u{display:none !important}
  /* ☠ 2026-09-17 业主：隐藏后下滑页头被切掉一截。.hdr 是 sticky top:-33px（负值 = .hdr-u 高度，让工具行滚走、主行贴顶），
     工具行不在了就必须归 0，否则主行往上多缩 33px。 */
  .hdr{top:0}
}
@media(max-width:760px){
  /* 1 页脚：有标题的链接列折叠（JS ⑬c 加 .ftr-acc / .open），公司介绍 3 行，物流/支付只留标签不留长说明 */
  .ftr .ftr-top{gap:0}
  .ftr .ftr-top > div:first-child{padding-bottom:18px}
  .ftr .ftr-acc{border-top:1px solid #26303F}
  .ftr .ftr-acc > h4{position:relative;margin:0;padding:15px 30px 15px 0;cursor:pointer;-webkit-user-select:none;user-select:none}
  .ftr .ftr-acc > h4::after{content:"";position:absolute;right:6px;top:50%;width:8px;height:8px;margin-top:-6px;border-right:2px solid #8E99A8;border-bottom:2px solid #8E99A8;transform:rotate(45deg);transition:transform .2s}
  .ftr .ftr-acc.open > h4::after{transform:rotate(-135deg);margin-top:-2px}
  .ftr .ftr-acc > :not(h4){display:none}
  .ftr .ftr-acc.open > :not(h4){display:block}
  .ftr .ftr-acc.open{padding-bottom:12px}
  .ftr .ftr-acc:last-child{border-bottom:1px solid #26303F}
  .ftr .ftr-bot p.ftr-clamp{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;cursor:pointer}
  .ftr .ftr-pay{gap:14px}
  .ftr .ftr-pay .pay-note{display:none}

  /* 3 商品卡片（分类列表 / 特价 / 新品 / 首页与购物车推荐）：去掉每张卡都一样的「Options + See All Discount Pricing」行；
     折扣只留划线价 + 角标，去掉重复的「xx% off」文字。详情页价格区不受影响（选择器限定在卡片里）。 */
  .plg-card .plg-bottom-row,.plg-bottom-fea,.sll-products-live .plg-bottom-row{display:none !important}
  .plg-card .productPriceDiscount,.plg-price-section .productPriceDiscount,.centerBoxContentsbk .productPriceDiscount,.sll-products-live .productPriceDiscount{display:none !important}
  /* 2026-09-17 业主：底行去掉后价格成了卡片最后一行，贴着边框底 -> 价格行下面留 5px */
  #columnCenter .sll-products-live .centerBoxContentsProducts .centerBoxContentsbk .plg-price-fea,#columnCenter .centerBoxContentsbk .plg-price-fea,#columnCenter .plg-card .plg-price-section{margin-bottom:5px !important}
}
/* 抽屉 Contact us 二级页：方式名 + 灰色小字（邮箱/号码）（2026-09-17） */
@media(max-width:992px){
  .mdr-row .sub{flex:1 1 100%;display:block;font-size:13px;color:#6B7280;padding-left:32px;margin-top:-2px}
  .mdr-row:has(.sub){flex-wrap:wrap;row-gap:0;padding-top:9px;padding-bottom:9px}
  .mdr-row:has(.sub) .t{flex:1 1 calc(100% - 40px)}
}

/* ===== 手机端简化 · 表单和内容页 12-15（2026-09-17 业主批准；≤760px，电脑端不变）===== */
.hb-more{display:none}
@media(max-width:760px){
  /* 12 注册页：底部「Your Personal Details」说明框和表单里的提示重复 -> 隐藏（按钮文字 JS ⑬e） */
  .sll-reg-sidenote{display:none}
  /* 13 登录页：两块的说明段落（In order to continue… / Create a Customer Profile…）隐藏，新客户只留 3 条好处 + Sign Up */
  .sll-auth__new > .information,.sll-auth__returning > .information{display:none}
  /* 14 联系我们：表单区（.sll-cu-top）视觉上排到最前，介绍/数据块（.sll-cu-hero，含 H1）排到表单后面；HTML 顺序不变，H1 仍是源码第一个标题 */
  #contactUsDefault.sll-cu{display:flex;flex-direction:column}
  #contactUsDefault .sll-cu-top{order:-1;margin-bottom:20px}
  /* 15 首页 About us 段落 5 行 + Read more（JS ⑬e） */
  .hb-about p.hb-txt.hb-clamp{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5;overflow:hidden}
  .hb-more{display:inline-flex;align-items:center;gap:6px;margin:6px 0 4px;padding:4px 0;border:0;background:none;font:inherit;font-size:14.5px;font-weight:600;color:#1B5FA8;cursor:pointer}
  .hb-more::after{content:"";width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg)}
  .hb-more[data-open="1"]::after{transform:rotate(-135deg);margin-top:4px}
}
/* 抽屉第五版（2026-09-17）：下一层第一行「Shop all X」加粗当标题；首屏去掉 Explore 标题后第一行贴顶 */
@media(max-width:992px){
  .mdr-line--all{background:#F9FAFB;border-bottom:1px solid #D1D5DB}
  .mdr-line--all .mdr-row{font-weight:700;font-size:16px;color:#111827;min-height:56px}
}
/* 抽屉菜单链接悬停 / 按下效果（2026-09-17 业主，参考 superbrightleds：鼠标移上去文字变蓝）*/
@media(max-width:992px){
  .mdr-row{transition:color .15s,background-color .15s}
  .mdr-row .ico{transition:color .15s}
  .mdr-row:hover,.mdr-row:focus-visible{color:#1B5FA8;text-decoration:none}
  .mdr-row:hover .ico,.mdr-row:focus-visible .ico{color:#1B5FA8}
  .mdr-row:hover .sub{color:#4B6A91}
  .mdr-row:active{color:#164E8A;background:#F3F6FA}
  .mdr-line--all .mdr-row:hover{color:#1B5FA8}
  .mdr-go{transition:border-color .15s,background-color .15s}
  .mdr-go:hover{border-color:#1B5FA8;background:#F3F6FA}
  .mdr-go:hover:after{border-color:#1B5FA8}
  .mdr-bar .bk:hover,.mdr-bar .x:hover{color:#1B5FA8}
}
/* 页脚折叠标题里的真按钮（2026-09-18 无障碍）：外观完全继承原 h4 */
.ftr .ftr-acc > h4 > .ftr-acc-btn{all:unset;display:block;width:100%;color:inherit;font:inherit;letter-spacing:inherit;text-transform:inherit;cursor:default}
@media(max-width:760px){.ftr .ftr-acc > h4 > .ftr-acc-btn{cursor:pointer}}