:root{--serif:"Songti SC","Noto Serif SC","STSong","SimSun",serif;--sans:"Inter","PingFang SC","Microsoft YaHei","Noto Sans SC",system-ui,-apple-system,sans-serif;--mono:"JetBrains Mono",Consolas,Menlo,monospace}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font-family:var(--body-font,var(--sans));-webkit-text-size-adjust:100%}
a{color:var(--text);text-decoration:none}
.in{max-width:var(--page-w,560px);margin:0 auto;padding-left:var(--page-pad,20px);padding-right:var(--page-pad,20px)}
/* 提示条 / 标题区 */
.topbar{background:var(--banner-bg);color:var(--banner-text);border-bottom:1px solid var(--banner-line);font-size:var(--banner-size,12px);font-weight:700;line-height:1.7;text-align:var(--banner-align,left)}
.topbar .in{padding-top:9px;padding-bottom:9px}
.band{background:var(--head-bg);color:var(--head-text);border-bottom:var(--head-border,0px) solid var(--head-border-color,var(--accent))}
.band .in{padding-top:var(--head-pt,22px);padding-bottom:var(--head-pb,22px)}
h1{margin:0;display:flex;flex-wrap:wrap;align-items:center;justify-content:var(--head-justify,flex-start);gap:6px 12px;font-family:var(--head);font-size:var(--title-size,36px);line-height:1.15;letter-spacing:-.5px}
.hn{font-weight:800}.ht{font-weight:300;letter-spacing:0}
.vbar{display:inline-block;width:3px;height:1.15em;background:currentColor;flex:none}
/* 页面骨架 */
.wrap{max-width:var(--page-w,560px);margin:0 auto;padding:18px var(--page-pad,20px) calc(36px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;gap:var(--section-gap,18px)}
.notice{margin:0;font-size:var(--notice-size,12px);line-height:1.7;color:var(--muted);text-align:var(--notice-align,left)}
.block{font-size:var(--block-size,12px);line-height:1.8;color:var(--muted);text-align:var(--block-align,left)}
.foot{margin:0;font-size:var(--foot-size,12px);line-height:1.7;color:var(--muted);text-align:var(--foot-align,center);padding-top:10px}
.site-link{display:block;text-decoration:none;-webkit-tap-highlight-color:transparent}
.banners{max-width:var(--page-w,560px);margin:0 auto;display:flex;flex-direction:column;gap:0}
.banners .site-link,.footimgs .site-link{display:block;line-height:0}
.footimgs{max-width:var(--page-w,560px);margin:0 auto;display:flex;flex-direction:column;gap:0;padding-bottom:env(safe-area-inset-bottom,0px)}
.site-banner{display:block;width:100%;height:auto;border-radius:var(--radius);border:var(--bn-w,0px) solid var(--bn-color,transparent)}
.site-copyright{display:block;width:100%;height:auto;border:var(--fb-w,0px) solid var(--fb-color,transparent)}
/* 主页：产品网格与卡片 */
.grid{display:grid;grid-template-columns:repeat(var(--cols),minmax(0,1fr));gap:var(--row-gap,26px) var(--col-gap,14px)}
.card{display:flex;flex-direction:column;gap:var(--card-gap,12px);min-width:0}
.media{position:relative;min-width:0}
.img{position:relative;display:block;aspect-ratio:var(--ratio,4/5);overflow:hidden;border-radius:var(--radius);background:var(--img-bg,#1B1C1E);border:var(--img-border,0px) solid var(--line)}
.img img{width:100%;height:100%;object-fit:var(--img-fit,cover);display:block}
.ph{width:100%;height:100%;min-height:80px;display:flex;align-items:center;justify-content:center;color:var(--muted);font-size:11px}
.body{display:flex;flex-direction:column;gap:5px}
.head{display:flex;align-items:baseline;gap:8px}
.no{font-family:var(--mono);font-size:11px;font-weight:700;color:var(--accent)}
.card h2{margin:0;font-size:var(--name-size,15px);font-weight:var(--name-weight,800);line-height:1.4}
.nl-1 .card h2,.nl-2 .card h2,.nl-3 .card h2{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}
.nl-1 .card h2{-webkit-line-clamp:1;line-clamp:1}
.nl-2 .card h2{-webkit-line-clamp:2;line-clamp:2}
.nl-3 .card h2{-webkit-line-clamp:3;line-clamp:3}
.specs{font-size:var(--spec-size,13px);color:var(--muted);line-height:1.7}
.pg-detail .specs{font-size:var(--dspec-size,13px)}
.specs span+span::before{content:" · ";white-space:pre}
.sl-col .specs span{display:block}
.sl-col .specs span+span::before{content:none}
.specs .lb{font-weight:700}
.specs .sk{font-weight:var(--wsku-v,400)}.specs .sk .lb{font-weight:var(--wsku-l,700)}
.specs .mt{font-weight:var(--wmat-v,400)}.specs .mt .lb{font-weight:var(--wmat-l,700)}
.specs .wt{font-weight:var(--wwt-v,400)}.specs .wt .lb{font-weight:var(--wwt-l,700)}
.mk{font-size:var(--sp-size,12px);color:var(--muted);text-decoration:line-through}
.sp{font-size:var(--sp-size,12px);color:var(--muted);line-height:1.5}
.sp b{font-size:var(--sp-size,12px);font-weight:var(--wsp,700);color:var(--accent)}
.note{font-size:11px;color:var(--muted)}
.more{display:block;padding:6px 0 0;font-size:var(--more-size,12px);font-weight:700;color:var(--more,var(--text))}
/* 卡片样式：无底 / 卡片框 / 仅描边 / 仅底色 */
.cs-box .card,.cs-line .card,.cs-fill .card{gap:0;padding-bottom:12px;border-radius:var(--radius)}
.cs-box .card,.cs-fill .card{background:var(--card)}
.cs-box .card,.cs-line .card{border:1px solid var(--line)}
.cs-box .card .img,.cs-line .card .img,.cs-fill .card .img{border-radius:var(--radius) var(--radius) 0 0}
.cs-box .card .body,.cs-line .card .body,.cs-fill .card .body{padding:var(--card-gap,12px) 12px 0}
/* 价格块 */
.pbadge{display:flex;align-items:baseline;gap:8px;padding:6px var(--ppx,12px) 5px;background:var(--price-bg);background:color-mix(in srgb,var(--price-bg) var(--price-alpha,100%),transparent);color:var(--price);line-height:1.1;height:var(--pbh,auto)}
.ph-on .pbadge{align-items:center}
.pbadge em{font-style:normal;font-size:var(--plabel,10px);font-weight:700;line-height:1.25;opacity:.85}
.pbadge strong{font-size:var(--price-size,22px);font-weight:var(--wprice,800);line-height:1.1;white-space:nowrap;letter-spacing:.2px}
.ps-corner .media .pbadge{position:absolute;left:calc(var(--img-border,0px)*var(--pin-on,0));bottom:calc(var(--img-border,0px)*var(--pin-on,0))}
.ps-bar .media .pbadge{position:absolute;left:calc(var(--img-border,0px)*var(--pin-on,0));right:calc(var(--img-border,0px)*var(--pin-on,0));bottom:calc(var(--img-border,0px)*var(--pin-on,0));align-items:center;justify-content:space-between;padding:7px var(--ppx,12px)}
.ps-bar .pbadge strong{margin-left:auto}
.ps-below .media .pbadge{align-items:center;justify-content:space-between;margin-top:10px;padding:8px var(--ppx,12px)}
.ps-below .pbadge strong{margin-left:auto}
.pc-r.ps-corner .media .pbadge{left:auto;right:calc(var(--img-border,0px)*var(--pin-on,0))}
.pc-t.ps-corner .media .pbadge,.pc-t.ps-bar .media .pbadge{bottom:auto;top:calc(var(--img-border,0px)*var(--pin-on,0))}
.sh-notch .pbadge{clip-path:polygon(0 0,calc(100% - var(--notch,10px)) 0,100% var(--notch,10px),100% 100%,0 100%)}
.sh-round .pbadge{border-radius:var(--pradius,8px)}
.sh-pill .pbadge{border-radius:999px;padding-left:calc(var(--ppx,12px) + 4px);padding-right:calc(var(--ppx,12px) + 4px)}
.sh-round .media .pbadge,.sh-pill .media .pbadge{margin-left:8px;margin-right:8px}
.sh-round.ps-corner .media .pbadge,.sh-round.ps-bar .media .pbadge,.sh-pill.ps-corner .media .pbadge,.sh-pill.ps-bar .media .pbadge{margin-bottom:8px}
.pc-t.sh-round.ps-corner .media .pbadge,.pc-t.sh-round.ps-bar .media .pbadge,.pc-t.sh-pill.ps-corner .media .pbadge,.pc-t.sh-pill.ps-bar .media .pbadge{margin-bottom:0;margin-top:8px}
.sh-round.ps-below .media .pbadge,.sh-pill.ps-below .media .pbadge{margin-left:0;margin-right:0}
.pbadge strong::first-letter{font-size:15px;font-weight:var(--wprice-fl,700);opacity:.85}
/* 详情页 */
.back{display:inline-block;font-size:var(--back-size,13px);font-weight:700;color:var(--accent)}
.gallery{display:flex;flex-direction:column;gap:var(--gallery-gap,18px)}
.slide{margin:0}
.slide img{width:100%;height:auto;display:block;border-radius:var(--radius);background:var(--gallery-bg,var(--card));border:var(--gb-w,0px) solid var(--gb-color,transparent)}
.slide .ph{aspect-ratio:4/5;background:var(--gallery-bg,var(--card));border-radius:var(--radius);border:var(--gb-w,0px) solid var(--gb-color,transparent)}
.cap{text-align:center;font-size:var(--cap-size,13px);line-height:1.6;color:var(--cap-fg,var(--muted));margin-top:8px;overflow-wrap:anywhere}
.dname{margin:0;font-family:var(--head);font-weight:var(--dname-weight,800);line-height:1.3;font-size:var(--dname-size,24px);text-align:var(--dname-align,left)}
.desc{font-size:var(--desc-size,14px);line-height:calc(var(--desc-line,180)/100);color:var(--text);overflow-wrap:anywhere}
.desc img{max-width:100%;height:auto}
.price{margin-top:6px}
.price .pbadge{position:static;display:inline-flex;margin:0;padding:8px calc(var(--ppx,12px) + 4px) 7px}
.price .pbadge strong{font-size:calc(var(--price-size,22px)*var(--dprice-scale,140)/100);margin-left:0}
.price .pbadge strong::first-letter{font-size:20px}
.price .pbadge em{font-size:calc(var(--plabel,10px) + 2px)}
.ps-bar .price .pbadge,.ps-below .price .pbadge{display:flex;width:100%}
.ps-bar .price .pbadge strong,.ps-below .price .pbadge strong{margin-left:auto}
.pl-c .media .pbadge{align-items:center}
.pl-t .media .pbadge{align-items:flex-start}
.pl-b .media .pbadge{align-items:baseline}
/* 详情页：图片说明做成图上色块（cx-c 贴角 / cx-b 满宽条），颜色和形状跟价格块一致 */
/* 图上色块：边框画在 figure 上、说明条按 figure 的内边缘定位——偏移量由"框内/框外"决定，不再和边框宽度做小数运算，
   所以缩放页面或边框宽度带小数时，说明条和边框之间不会露出 1~2px 的缝（缝里是图片本身的颜色） */
.cx-c .slide,.cx-b .slide{position:relative;--cap-o:calc(var(--gb-w,0px)*(var(--pin-on,1) - 1));border:var(--gb-w,0px) solid var(--gb-color,transparent);border-radius:var(--radius);background:var(--gallery-bg,var(--card))}
.cx-c .slide img,.cx-b .slide img,.cx-c .slide .ph,.cx-b .slide .ph{border:0;border-radius:max(0px,calc(var(--radius) - var(--gb-w,0px)))}
.cx-c .cap,.cx-b .cap{position:absolute;left:var(--cap-o);bottom:var(--cap-o);margin:0;padding:6px 12px;max-width:calc(100% - 2*var(--cap-o));text-align:left;font-weight:700;line-height:1.35;color:var(--cap-fg,var(--price));background:var(--price-bg);background:color-mix(in srgb,var(--price-bg) var(--cap-alpha,var(--price-alpha,100%)),transparent)}
.cx-b .cap{right:var(--cap-o);max-width:none}
.cp-r.cx-c .cap{left:auto;right:var(--cap-o)}
.cp-t.cx-c .cap,.cp-t.cx-b .cap{bottom:auto;top:var(--cap-o)}
/* 说明条高度按图宽比例：cqw = 图片宽度的 1%，手机/电脑上占图的比例一致；文字多到放不下时自动撑高。
   只有设了高度（body 带 ch-on）才生效，不设时和以前完全一样；浏览器不认 cqw 时这句自动忽略，退回自动高度 */
.cx-c.ch-on .slide,.cx-b.ch-on .slide{container-type:inline-size}
.cx-c.ch-on .cap,.cx-b.ch-on .cap{box-sizing:border-box;min-height:var(--cap-h);display:grid;align-content:center}
.cx-c.sh-notch .cap,.cx-b.sh-notch .cap{clip-path:polygon(0 0,calc(100% - var(--notch,10px)) 0,100% var(--notch,10px),100% 100%,0 100%)}
.cx-c.sh-round .cap,.cx-b.sh-round .cap{border-radius:var(--pradius,8px);margin:8px}
.cx-c.sh-pill .cap,.cx-b.sh-pill .cap{border-radius:18px;margin:8px;padding-left:16px;padding-right:16px}
/* 图片说明：对齐 / 粗细（默认=原样） */
.ca-c .cap{text-align:center}.ca-l .cap{text-align:left}.ca-r .cap{text-align:right}
.cw-n .cap{font-weight:400}.cw-b .cap{font-weight:700}
.hn{font-size:var(--hn-size,1em)}
.ht{font-size:var(--ht-size,1em)}