/* ============================================================   xc_card 发卡商店 · zinc 设计令牌 v1.5（2026-10-07）   规范来源：/design/tokens.css —— 换值不换名。   本文件是样式源文件，经 xc_card_newstyle() 压缩合并到 style/style.css；   手改 style/style.css 会被后台"保存样式"覆盖，必须改这里。   暗色：html.dark-theme（跟随主站 xb_theme cookie，见 header.php 内联脚本）   支付按钮保留微信绿/支付宝蓝品牌色，其余一律 zinc 黑灰。   ============================================================ */:root{  --bg:#fafafa;  --surface:#ffffff;  --surface-2:#f4f4f5;  --surface-3:#fafafa;  --surface-hover:#ebebec;  --border:#e4e4e7;  --border-strong:#d4d4d8;  --text:#09090b;  --text-body:#3f3f46;  --text-2:#71717a;  --text-3:#a1a1aa;  --primary:#18181b;  --primary-hover:#27272a;  --on-primary:#ffffff;  --danger:#dc2626;  --success:#10b981;  --success-text:#059669;  --warning:#f59e0b;  --warning-text:#b45309;  --ring:#e4e4e7;  --ring-strong:#d4d4d8;  --shadow-ring:0 0 0 1px var(--ring);  --shadow-ring-sm:0 0 0 1px var(--ring),0 1px 2px rgba(0,0,0,.04);  --shadow-ring-lg:0 0 0 1px var(--ring),0 8px 30px rgba(0,0,0,.08);  --shadow-ring-pop:0 0 0 1.5px var(--primary),0 1px 2px rgba(0,0,0,.04);  --focus-ring:#71717a;  --focus-halo:rgba(24,24,27,.08);  --radius-lg:12px;  --radius:8px;  --radius-sm:6px;  --radius-pill:999px;  --price:#dc2626;  --pay-wechat:#07c160;  --pay-alipay:#1677ff;  /* 兼容旧引用 */  --Colors:#18181b;  color-scheme:light;}html.dark-theme{  --bg:#18181b;  --surface:#1f1f23;  --surface-2:#27272a;  --surface-3:#232327;  --surface-hover:#3f3f46;  --border:#2e2e33;  --border-strong:#3f3f46;  --text:#fafafa;  --text-body:#d4d4d8;  --text-2:#a1a1aa;  --text-3:#71717a;  --primary:#fafafa;  --primary-hover:#e4e4e7;  --on-primary:#18181b;  --danger:#ff7076;  --success:#34d399;  --success-text:#34d399;  --warning:#fbbf24;  --warning-text:#fbbf24;  --ring:#2e2e33;  --ring-strong:#3f3f46;  --shadow-ring:0 0 0 1px var(--ring);  --shadow-ring-sm:0 0 0 1px var(--ring),0 1px 2px rgba(0,0,0,.16);  --shadow-ring-lg:0 0 0 1px var(--ring),0 8px 30px rgba(0,0,0,.5);  --shadow-ring-pop:0 0 0 1.5px var(--primary),0 1px 2px rgba(0,0,0,.16);  --focus-ring:#a1a1aa;  --focus-halo:rgba(250,250,250,.08);  --price:#ff7076;  --Colors:#fafafa;  color-scheme:dark;}html.theme-switching,html.theme-switching *,html.theme-switching *::before,html.theme-switching *::after{transition:none!important}html,body,div,header,nav,head,span,object,iframe,section,figure,aside,article,h1,h2,h3,h4,img,ol,ul,dl,p {margin:0;padding:0;border:0;background:transparent;}body{background-color:var(--bg);color:var(--text-body);font:400 14px/1.7 -apple-system,BlinkMacSystemFont,"PingFang SC","MiSans","HarmonyOS Sans SC","Microsoft YaHei","Segoe UI",Roboto,sans-serif;-webkit-font-smoothing:antialiased;}*,*:before,*:after {box-sizing: border-box;}.clear {clear:both;}.clear:after {clear: both;display: table;content: " ";}article,aside,dialog,footer,header,section,footer,nav,figure,menu {display:block}h1,h2,h3,h4,h5 {line-height:1.75;font-weight:600;color:var(--text);text-rendering:optimizelegibility;}h1 {font-size:24px;}h2 {font-size:18px;}h3 {font-size:16px;}h4 {font-size:15px;}h5 {font-size:14px;}.lf {float:left;}.lr {float:right;}li {list-style:none;}a {color:var(--text-2);vertical-align:baseline;text-decoration:none;font-size:100%;transition:color .15s ease-out 0s;}a:hover{color:var(--text)}table {border-spacing:0;border-collapse:collapse;}:focus{outline: 0}a:focus-visible,button:focus-visible,input:focus-visible{outline:none;border-radius:var(--radius-sm);box-shadow:0 0 0 2px var(--bg),0 0 0 4px var(--focus-ring)}.center{margin:0 auto;max-width: 1266px;padding: 0 10px;}.num{font-variant-numeric:tabular-nums}input {transition: border linear 0.2s, box-shadow linear 0.2s;}input:focus {outline: 0;border-color: var(--focus-ring) !important;box-shadow: 0 0 0 3px var(--focus-halo) !important;color:var(--text) !important;}.errors{border:1px solid var(--danger) !important;}/********************************************/header{height: 64px;line-height: 64px;width: 100%;background: #18181b;border-bottom: 1px solid #18181b;user-select: none;position: sticky;top: 0;z-index: 999;}header>div>ul>li>a, header>div>a{color:#a1a1aa}header>div>ul>li>a:hover, header>div>a:hover{color:#fafafa}header>div .xc-theme-toggle{color:#a1a1aa;background:transparent;border:1px solid #3f3f46}header>div .xc-theme-toggle:hover{color:#fafafa;background:#27272a}header .logo{width: 120px;height: 40px;margin-top: 12px;}header>div>a{font-size: 13px;color: var(--text-2);margin-left: 12px;}header>div>a:hover{color:var(--text)}header>div>a>img{width: 14px;height: 14px;margin-right: 4px;vertical-align: -2px;filter: invert(58%) sepia(6%) saturate(180%) hue-rotate(180deg);}header>div>ul{display: inline-block;margin-left: 20px;}header>div>ul>li{float: left;}header>div>ul>li>a{margin: 0 10px;color: var(--text-2);font-size: 14px;}header>div .nav_buts{display: none;}/* 顶栏暗色跟随开关 */.xc-theme-toggle{cursor: pointer;border: 1px solid var(--border-strong);border-radius: var(--radius-pill);height: 30px;line-height: 28px;padding: 0 12px;font-size: 12px;color: var(--text-2);background: var(--surface);margin-left: 12px;transition: color .15s,border-color .15s,background .15s;}.xc-theme-toggle:hover{color:var(--text);border-color:var(--text-3);background:var(--surface-2)}.xc-theme-toggle .xc-tt-lt{margin-left:4px}header>div>a.xc-theme-toggle{color:var(--text-2)}/* ---------- 首页 hero 与商品卡 ---------- *//* margin-top:0——主题联动版下内容区与主题导航的间距由 .xc-page 顶垫统一（2026-10-07 间距修正） */.xc-hero{margin-top: 0;padding: 28px 24px;background: var(--surface);border: 1px solid var(--border);border-radius: var(--radius-lg);box-shadow: var(--shadow-ring-sm);}.xc-hero h1{font-size: 22px;font-weight: 700;letter-spacing: -.01em;margin-bottom: 4px}.xc-hero p{font-size: 13px;color: var(--text-3)}.xc-hero-row{display: flex;align-items: center;gap: 12px;flex-wrap: wrap;margin-top: 16px}.xc-searchbox{position: relative;flex: 1;min-width: 220px;max-width: 420px;}.xc-searchbox input{width: 100%;height: 38px;line-height: 38px;padding: 0 14px 0 36px;border: 1px solid var(--border-strong);border-radius: var(--radius-pill);background: var(--surface) url(img/search.svg) 12px 10px no-repeat;background-size: 16px 16px;font-size: 13px;color: var(--text);}html.dark-theme .xc-searchbox input{background-image: url(img/search_h.svg)}.xc-searchbox input:focus{border-color: var(--focus-ring) !important;box-shadow: 0 0 0 3px var(--focus-halo) !important}.xc-searchbox input::placeholder{color:var(--text-3)}.xc-search-count{font-size: 12px;color: var(--text-3)}.xc-chips{display: flex;gap: 8px;flex-wrap: wrap}.xc-chips a{padding: 5px 14px;font-size: 13px;color: var(--text-2);background: var(--surface);border: 1px solid var(--border-strong);border-radius: var(--radius-pill);transition: color .15s,background .15s,border-color .15s;}.xc-chips a:hover{color: var(--text);background: var(--surface-2)}.xc-chips a.xc-all{color: var(--on-primary);background: var(--primary);border-color: var(--primary)}.xc-chips a.xc-all:hover{background: var(--primary-hover)}.xc-cate-sec{margin-top: 28px}.xc-cate-hd{display: flex;align-items: baseline;justify-content: space-between;margin-bottom: 12px}.xc-cate-hd h2{font-size: 17px;font-weight: 600;padding-left: 10px;border-left: 3px solid var(--primary);line-height: 1.3;}.xc-cate-hd .xc-cate-count{font-size: 12px;color: var(--text-3)}.xc-grid{display: grid;grid-template-columns: repeat(auto-fill,minmax(300px,1fr));gap: 14px;}.xc-card{display: block;padding: 16px 18px;background: var(--surface);border: 1px solid var(--border);border-radius: var(--radius-lg);box-shadow: var(--shadow-ring-sm);transition: border-color .15s,box-shadow .15s,transform .15s;}.xc-card:hover{border-color: var(--border-strong);box-shadow: var(--shadow-ring-lg);transform: translateY(-2px);}.xc-card-name{font-size: 14px;font-weight: 500;color: var(--text);line-height: 1.55;margin-bottom: 10px;word-break: break-all;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;min-height: 43px;}.xc-card-ft{display: flex;align-items: center;justify-content: space-between;gap: 10px}.xc-card-price{font-size: 18px;font-weight: 700;color: var(--price)}.xc-card-price .xc-price-sym{font-size: 12px;font-weight: 600;margin-right: 1px}.xc-card-price s{font-size: 12px;color: var(--text-3);font-weight: 400;margin-left: 6px}.xc-badge{display: inline-flex;align-items: center;gap: 5px;padding: 2px 10px;font-size: 12px;border-radius: var(--radius-pill);background: var(--surface-2);color: var(--text-2);}.xc-badge i{width: 6px;height: 6px;border-radius: 50%;background: var(--success);flex: none}.xc-badge.xc-low{color: var(--warning-text);background: rgba(245,158,11,.12)}.xc-badge.xc-low i{background: var(--warning)}.xc-badge.xc-soldout{color: var(--text-3)}.xc-badge.xc-soldout i{background: var(--text-3)}.xc-card-buy{font-size: 12px;color: var(--on-primary);background: var(--primary);border-radius: var(--radius-pill);padding: 4px 14px;transition: background .15s;}.xc-card:hover .xc-card-buy{background: var(--primary-hover)}.xc-none-tip{padding: 40px 0;text-align: center;color: var(--text-3);font-size: 13px;}/* ---------- md1 标题条 ---------- */.md1{background-color: var(--surface);padding: 20px;margin-top: 24px;font-size: 18px;color: var(--text);padding-left: 20px;font-weight: 600;border: 1px solid var(--border);user-select: none;border-radius: var(--radius-lg);box-shadow: var(--shadow-ring-sm);}.xc-crumbs{display: flex;align-items: center;flex-wrap: wrap;gap: 6px;font-size: 13px;color: var(--text-3);margin-top: 20px;}.xc-crumbs a{color: var(--text-2)}.xc-crumbs a:hover{color: var(--text);text-decoration: underline}.xc-crumbs i{font-style: normal;color: var(--border-strong)}.xc-crumbs span{color: var(--text);font-weight: 500}.md2{margin-top: 40px;background-color: var(--surface);position: relative;padding: 44px 40px;min-height: 50px;border-radius: var(--radius-lg);border: 1px solid var(--border);box-shadow: var(--shadow-ring-sm);}.md2-title,.md3-title,.md4-title{position: absolute;color: var(--on-primary);display: inline-block;padding: 8px 26px 8px 20px;font-size: 14px;left: 0px;top: -17px;user-select: none;background: var(--primary);border-radius: var(--radius) var(--radius) var(--radius) 0;font-weight: 500;}.md2 .md2-cent{width:50%;display: inline-block;float: left;}.md2 .md2-content{width: 50%;display: inline-block;float: right;max-height: 345px;border-radius: var(--radius);overflow: hidden;overflow-y: auto;scrollbar-width:thin;scrollbar-color: var(--border-strong);}.md2 .md2-contentshoppage{max-height: 280px;}.md2 .md2-content::-webkit-scrollbar{width:2px;}.md2 .md2-content::-webkit-scrollbar-thumb {background: var(--border-strong);}.md2 .act_cent{border: 1px dashed var(--border-strong);background-color: var(--surface-2);}.md2 .md2-content-txt {padding: 10px 10px 0 10px;user-select: none;color: var(--text-body);}.md2 .md2-content-txt p{font-size: 14px;line-height: 1.6em;margin-bottom: 14px;letter-spacing: .3px;}.md2 .md2-content-txt p img{width:90%;height: auto;border-radius: var(--radius-sm);}.md2 .md2-cent p , .md2 .md2-cent .select{line-height: 45px;height: 45px;margin-bottom: 15px;position: relative;}.md2 .md2-cent .select::before{content: '';background-image: url(img/sanjiao.svg);background-repeat: no-repeat;background-position: left top;background-size: 100%;width: 15px;height: 15px;display: inline-block;position: absolute;right: 50px;top: 15px;z-index: 9999;filter: invert(40%);}.md2 .md2-cent .selectshop::before{transform: rotate(180deg);}.md2 .md2-cent p span , .md2 .md2-cent .select span{float: left;color: var(--text-2);margin-right: 20px;user-select: none;}.md2 .md2-cent p input{padding-left: 10px;height: 42px;line-height: 42px;font-size: 15px;color: var(--text);border: 1px solid var(--border-strong);border-radius: var(--radius);background: var(--surface);width: 100%;max-width: calc(100% - 120px);}.md2 .md2-cent p .name-zi{background-color: rgba(16,185,129,.12);color: var(--success-text);line-height: 25px;height: 25px;padding: 0 10px;border-radius: var(--radius-pill);margin-top: 8px;font-size: 12px;}.md2 .md2-cent p input::-webkit-input-placeholder{color:var(--text-3);font-size: 12px;}.md2 .md2-cent p input:-ms-input-placeholder{color:var(--text-3);font-size: 12px;}.md2 .md2-cent>form>p .name , .md2 .md2-cent .select .name{display: inline-block;height: 42px;line-height: 42px;color: var(--text);border: 1px solid var(--border-strong);border-radius: var(--radius);background: var(--surface);width: 100%;max-width: calc(100% - 120px);padding-left: 10px;font-size: 14px;}.md2 .md2-cent .select ul{background-color: var(--surface);position: absolute;left: 84px;top: 50px;z-index: 9999999;border: 1px solid var(--border);border-radius: var(--radius);box-shadow: var(--shadow-ring-lg);padding: 5px 0;display: none;width: 100%;max-width: calc(100% - 120px);}.md2 .md2-cent .select ul li{padding: 0 10px;line-height: 36px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;cursor: pointer;font-size: 14px;color: var(--text-body);}.md2 .md2-cent .select ul li:hover{background-color: var(--surface-2);transition: .5s all;}.md2 .md2-cent .select ul .act{background-color: var(--surface-2) !important;color: var(--text) !important;font-weight: 500;}.md2 .md2-cent>form>p .shop_price{color: var(--price);margin: 0;margin-right: 5px;font-weight: bold;font-size: 18px;}.md2 .md2-cent>form>p s{font-size: 12px;color: var(--text-3);}.md2 .md2-cent>form>p:last-child{margin-bottom: 0;}/* 数量步进器 */.xc-stepper{display: inline-flex;align-items: center;border: 1px solid var(--border-strong);border-radius: var(--radius);overflow: hidden;background: var(--surface);}.xc-stepper button{width: 38px;height: 40px;border: 0;background: var(--surface);font-size: 18px;color: var(--text-2);cursor: pointer;line-height: 38px;padding: 0;user-select: none;transition: background .15s,color .15s;}.xc-stepper button:hover{background: var(--surface-2);color: var(--text)}.xc-stepper input{border: 0 !important;border-left: 1px solid var(--border) !important;border-right: 1px solid var(--border) !important;border-radius: 0 !important;width: 56px !important;max-width: none !important;text-align: center;height: 40px !important;line-height: 40px !important;padding: 0 !important;font-size: 15px;color: var(--text);box-shadow: none !important;}.md3{margin-top: 40px;background-color: var(--surface);position: relative;padding: 44px 40px;min-height: 50px;border-radius: var(--radius-lg);border: 1px solid var(--border);box-shadow: var(--shadow-ring-sm);}.md3-cent>div{display: inline-flex;align-items: center;margin-right: 16px;border: 1px solid var(--border-strong);padding: 0 22px;border-radius: var(--radius);cursor: pointer;overflow: hidden;user-select: none;height: 46px;line-height: 44px;font-size: 15px;color: var(--text-body);transition: border-color .15s,box-shadow .15s,color .15s;}.md3-cent>div:hover{border-color: var(--text-3);box-shadow: var(--shadow-ring-sm);}.md3-cent>div.act{border-color: var(--text);box-shadow: var(--shadow-ring-pop);color: var(--text);font-weight: 500;}.md3-cent>div img{width: 22px;height: 22px;vertical-align: middle;margin-right: 10px;margin-top: -2px;}.md3-price{line-height: 52px;height: 52px;margin-bottom: 30px;background-color: var(--surface-2);padding-left: 20px;font-size: 16px;color: var(--text-2);border-radius: var(--radius);user-select: none;}.md3-price span{margin: 0 6px;color: var(--price);font-size: 24px;font-weight: 700;}/* div.footer——仅旧独立模板的单行页脚（<div class="footer">）；主题联动页的   <footer class="footer"> 四栏页脚归主题样式管，不得被本规则覆盖（2026-10-07） */div.footer{background-color: var(--surface);line-height: 64px;text-align: center;margin-top: 30px;border-top: 1px solid var(--border);font-size: 12px;color: var(--text-3);}.alert{padding: 15px 20px 20px 20px;background-color: var(--surface-2);}.alert img{width: 90px;height: 90px;float: left;}.alert_div{float: left;margin-left: 20px;display: inline-block;user-select: none;}.alert_div .alert_div_p{line-height: 30px;height: 30px;margin-bottom: 5px;color: var(--text);font-weight: 500;}.alert_div .alert_div_p2{font-size: 14px;color: var(--price);}.alert_div .alert_div_p2 span{margin: 0 3px;color: var(--success-text);}.alert_div a{display: inline-block;padding: 6px 24px;background-color: var(--primary);color: var(--on-primary);border-radius: var(--radius);margin-top: 10px;font-size: 15px;transition: background .15s;}.alert_div a:hover{background-color: var(--primary-hover);color: var(--on-primary)}.md4{margin-top: 40px;margin-bottom: 40px;background-color: var(--surface);position: relative;padding: 44px 40px;min-height: 50px;border-radius: var(--radius-lg);border: 1px solid var(--border);box-shadow: var(--shadow-ring-sm);}.md4-div{background-color: var(--surface-2);padding: 16px 20px;font-size: 14px;color: var(--text-2);border-radius: var(--radius);}.md4-div p{line-height: 24px;margin-bottom: 5px;}.smd{background-color: var(--surface);width: 100%;padding: 30px;margin-top: 24px;position: relative;border: 1px solid var(--border);border-radius: var(--radius-lg);box-shadow: var(--shadow-ring-sm);}.smd input{height: 44px;line-height: 44px;width: 100%;border: 1px solid var(--border-strong);border-radius: var(--radius-pill);padding-left: 20px;background: var(--surface);color: var(--text);}.smd input:focus{border-color: var(--focus-ring) !important;box-shadow: 0 0 0 3px var(--focus-halo) !important}.smd input::placeholder{color:var(--text-3)}.smd button{background-image: url(img/search_h.svg);background-repeat: no-repeat;background-position: top;background-size: 30px 30px;width: 80px;height: 40px;background-color: transparent;border: 0;position: absolute;right: 24px;top: 34px;cursor: pointer;filter: invert(40%);}.smd2{min-height: 550px;width: 100%;background-color: var(--surface);margin-top: 24px;border-radius: var(--radius-lg);border: 1px solid var(--border);position: relative;padding: 30px;box-shadow: var(--shadow-ring-sm);}.smd2-img{position: absolute;width: 100px;height: 160px;left: calc(50% - 50px);top: calc(50% - 80px);display: none;}.smd2-img-div{background-image: url(img/log.svg);background-repeat: no-repeat;background-position: top;background-size: cover;width: 100px;height: 100px;opacity: .5;}.smd2-img p{height: 60px;line-height: 60px;font-size: 20px;color: var(--text-3);text-align: center;}.smd2-div{position: relative;border: 1px solid var(--border);height: 100%;min-height: 550px;width: 100%;padding: 30px;border-radius: var(--radius);}.smd2-div-title{position: absolute;height: 30px;line-height: 30px;background-color: var(--surface-2);top: -15px;left: 20px;font-size: 13px;display: inline-block;padding: 0 15px;border-radius: var(--radius-pill);color: var(--text-2);font-weight: 500;}.data-title{height: 38px;line-height: 38px;border: 1px solid var(--border);border-radius: var(--radius) var(--radius) 0 0;padding-left: 12px;background-color: var(--surface-2);font-size: 12px;color: var(--text-2);}.data-ul{padding: 16px 20px;border: 1px solid var(--border);border-top: 0;}.data-ul li{font-size: 14px;line-height: 30px;color: var(--text);font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;word-break: break-all;}.data-title-top2{margin-top: 20px;}.data-do{padding: 12px;border: 1px solid var(--border);border-top: 0;border-radius: 0 0 var(--radius) var(--radius);}.data-do>span{color: var(--warning-text);font-size: 12px;}.data-do>div{background-color: var(--surface-2);padding: 10px 15px;font-size: 12px;margin-top: 10px;border-radius: var(--radius);overflow: hidden;color: var(--text-2);}.data-do>div>p{line-height: 30px;}.data-do>div>p>span{color: var(--text);font-weight: 500;}.alert_ispay{padding: 35px 20px;background-color: var(--surface-2);background-image: url(img/wenhao.svg);background-repeat: no-repeat;background-position: 20px;background-size: 50px 59px;padding-left: 90px;color: var(--text);}.quer_tip{font-size: 12px;color: var(--warning-text);margin-top: 10px;display: block;}.xc-copyall{float: right;margin-right: 15px;color: var(--text-2);cursor: pointer;}.xc-copyall:hover{color: var(--text)}.in4divs,.in5divs{min-height: calc(100vh - 200px);}/* 旧 in4 列表样式保留兜底（新模板用 xc-grid 卡片） */.in4 h2{font-size: 15px;font-weight: 600;height: 20px;line-height: 20px;padding-left: 10px;border-left: 3px solid var(--primary);}.in4 ul{border: 1px dashed var(--border-strong);margin: 20px 0 0 0;border-radius: var(--radius);}.in4 li{font-size: 13px;height: 40px;line-height: 40px;border-bottom: 1px dashed var(--border);padding-left: 10px;font-weight: 400;}.in4 li a{color: var(--text-2);display: inline-block;width: calc(100% - 200px);word-break: keep-all;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}.in4 li a img{width: 16px;font-weight: bold;vertical-align: text-bottom;margin-right: 5px;filter: invert(40%);}.in4 li>div{display: inline-block;float: right;text-align: right;width: 200px;}.in4 li>div>span{margin-right: 15px;}.in4 li>div>span:first-child{color: var(--price);}.in4 li>div>span:last-child{color: var(--success-text);}.in4 li>div>span s{margin-left: 5px;}.in4 li:last-child{border-bottom: 0;}.in4:last-child{margin-bottom: 40px;}.in5 h2{font-size: 15px;font-weight: 600;height: 20px;line-height: 20px;padding-left: 10px;border-left: 3px solid var(--primary);}.in5 ul{border-radius: var(--radius);border-top: 1px solid var(--border);padding: 15px 0 0 0;margin: 20px 0 0 0;}.in5 ul li{width: calc(100% / 4);float: left;display: inline-block;padding: 5px;}.in5 ul li a{border: 1px solid var(--border);display: block;border-radius: var(--radius);box-shadow: var(--shadow-ring-sm);transition: all .3s ease-out 0s;}.in5 .inimgdivs{width: 100%;position: relative;overflow: hidden;}.in5 .inimgdivs::before{content: "";width: 100%;padding-bottom: calc(100% / 3 * 2);display: block;}.in5 ul li a img{position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 99;}.inimgdivs div{position: absolute;left: 0;top: 0;width: 100%;height: 100%;z-index: 109;background-color: rgba(9,9,11,.62);color: #fff;display: none;}.in5 ul li a:hover .inimgdivs div{display: block;}.in5 .inimgdivs div span{height: 32px;line-height: 32px;width: 82px;text-align: center;position: absolute;left: calc(50% - 41px);top: calc(50% - 16px);background-color: var(--primary);border-radius: var(--radius-pill);font-size: 14px;animation-name: bounceIn;animation-duration: 1s;animation-fill-mode: both;}@keyframes bounceIn {0% {opacity: 0;transform: scale(.3)}50% {opacity: 1;transform: scale(1.05)}70% {transform: scale(.9)}100% {opacity: 1;transform: scale(1)}}.in5spans{height: 40px;line-height: 40px;}.in5spans span{font-size: 12px;margin-left: 10px;font-weight: 400;float: left;color: var(--price);}.in5spans span:last-child{float: right;margin-right: 10px;color: var(--text-3);}.in5name{height: 40px;line-height: 40px;font-weight: 400;font-size: 14px;padding-left: 10px;padding-right: 10px;border-bottom: 1px solid var(--border);word-break: keep-all;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;color: var(--text);}.kefuas{position: relative;}.kefuasdiv{position: absolute;top: 52px;border: 1px solid var(--border);padding: 8px;background-color: var(--surface);height: auto;line-height: normal;border-radius: var(--radius);display: none;box-shadow: var(--shadow-ring-lg);}.kefuas:hover div{display: block;}.kefuasdiv::before{border: 8px solid transparent;border-bottom-color: var(--surface);content: "";left: 0;margin-left: 20px;position: absolute;top: -16px;width: 16px;height: 16px;}.kefuasdiv img{width: 100px;height: 100px;display: block;border-radius: var(--radius-sm);}.kefuasdiv span{color: var(--text-2);font-size: 12px;text-align: center;display: block;margin-top: 8px;}@media screen and (max-width:850px){.in5 ul li{width: calc(100% / 3);}}@media screen and (max-width:600px){.in5 ul li{width: calc(100% / 2);}.md1{padding: 14px;margin-top: 14px;}.in5 ul {margin: 10px 0 0 0;}}@media screen and (max-width:480px){.in5 ul li{width: 100%;}.xc-grid{grid-template-columns: 1fr;}.xc-card-name{min-height: 0}}@media screen and (max-width:560px){.in4 li {height: unset;line-height: unset;padding: 15px 12px;}.in4 li a {display: block;width: 100%;margin-bottom: 8px;}.in4 li>div {float: unset;width: 100%;text-align: left;}.in4 li>div>span {margin-right: 15px;display: block;margin: 8px 0;}.in4 li>div>span:last-child {margin-bottom: 0px;}.xc-hero{padding: 20px 16px}.xc-hero h1{font-size: 18px}}@media screen and (max-width:767px){.md2,.md3,.md4{padding: 36px 20px;}.md2 .md2-cent{width:100%;}.md2 .md2-content{width:100%;margin-top: 20px;}.md2 .md2-cent p input{max-width: calc(100% - 90px);}.md2 .md2-cent>form>p .name{max-width: calc(100% - 90px);margin-right: 0px;}.md2 .md2-cent .select .name{max-width: calc(100% - 90px);margin-right: 0px;}.md4-div{padding: 10px;}.body_nav{transform: translateX(200px);position: fixed;}header>div>ul{display: none;position: fixed;left: -200px;width: 200px;height: 100vh;background-color: #18181b;z-index: 99999999;margin-left: 0px;}header>div>ul li{float: none;height: 45px;line-height: 45px;border-bottom: 1px solid #27272a;}header>div>ul li a{display: block;padding: 0 15px;color: #fafafa;}.navb{position: fixed;width: 100%;height: 100vh;top: 0;left: 0;display: flex;align-items: center;justify-content: center;background: rgba(9,9,11,.45);z-index: 9999;}.nav_but_close{position: absolute;top: calc(50% - 30px);font-size: 12px;background-color: #27272a;border: 1px solid #3f3f46;right: -30px;border-radius:0 20px 20px 0;width: 30px;text-align: center;z-index: 10000000;cursor: pointer;padding: 20px 0;display: inline-block;}.nav_but_close img{width: 18px;height: 18px;display: block;filter: invert(40%);}.md2 .md2-cent .select::before{right: 20px;}header>div .nav_buts{display:inline-block;}.xc-theme-toggle{display: none}}@media screen and (max-width:756px){.to ul{display: none;}}@media screen and (max-width:660px){.md3-cent{text-align: center;}.md3-cent>div{margin: 0 10px;}.smd {padding: 10px;}.smd button {right: 4px;top: 16px;}.smd input{padding-left: 12px;}.smd2 {padding: 20px 10px;}.smd2-div-title {font-size: 12px;padding: 0 8px;height: 24px;line-height: 24px;top: -12px;}.smd2-div {padding: 25px 10px;}}@media screen and (max-width:470px){.md3-cent>div{margin: 0 6px;font-size: 13px;height: 40px;line-height: 38px;padding: 0 14px;}.md3-cent>div img{width: 18px;height: 18px;margin-top: -2px;}}@media screen and (max-width:400px){header a{font-size: 12px;}header a img{display: none;}header a .logo{display: block;}.kefuas:hover div {left: -20px;}}.shopname{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}.shopnameshoppage{overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}.copy_code{cursor: pointer;position: relative;display: table;padding-right: 20px;}.copy_code::before{position: absolute;content: '';background-image: url(img/copy.svg);background-size: 14px 14px;background-repeat: no-repeat;width: 14px;height: 14px;right: 0;top: 8px;filter: invert(60%);opacity: 0;transition: opacity .15s;}.copy_code:hover::before{opacity: 1}.data-code-dows{float: right;margin-right: 15px;color: var(--text-2);cursor: pointer;}.data-code-dows:hover{color: var(--text)}/* 补偿后台自定义CSS里按旧80px头部调的logo偏移（新头部64px） */@media screen and (max-width: 1100px){header .center .logo{margin-top: 12px !important;height: auto;}}/* ============================================================   v1.6 主题联动版式（2026-10-07）：内容片段由主题 header/footer 包裹，   令牌/夜间模式由 /design/tokens.css + html.night 接管，本节只管版式。   ============================================================ */.xc-page{padding:20px 10px 48px}.xc-crumbs{margin-top:0}.xc-shop-grid{display:grid;grid-template-columns:5fr 4fr;gap:14px;margin-top:16px;align-items:start}.xc-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-ring-sm)}.xc-panel-hd{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:14px 20px;border-bottom:1px solid var(--border);font-size:15px;color:var(--text)}.xc-panel-hd b{font-weight:600}.xc-panel-bd{padding:18px 20px}/* 购买表单行（原 md2 表单行样式的面板版） */.xc-buy-panel form p{line-height:44px;height:44px;margin:0 0 14px;position:relative}.xc-buy-panel form p:last-child{margin-bottom:0}.xc-buy-panel form p>span:first-child{float:left;color:var(--text-2);margin-right:20px;user-select:none}.xc-buy-panel form p input{padding-left:10px;height:42px;line-height:42px;font-size:15px;color:var(--text);border:1px solid var(--border-strong);border-radius:var(--radius);background:var(--surface);width:100%;max-width:calc(100% - 110px);}.xc-buy-panel form p input::placeholder{color:var(--text-3);font-size:12px}.xc-buy-panel form p .name{display:inline-block;height:42px;line-height:42px;color:var(--text);border:1px solid var(--border-strong);border-radius:var(--radius);background:var(--surface);width:100%;max-width:calc(100% - 110px);padding-left:10px;font-size:14px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}.xc-buy-panel .shop_price{color:var(--price);font-weight:700;font-size:18px}.xc-buy-panel .name-zi{background:rgba(16,185,129,.12);color:var(--success-text);line-height:25px;height:25px;padding:0 10px;border-radius:var(--radius-pill);font-size:12px;display:inline-block;}/* 商品说明面板 */.xc-info-panel .md2-content-txt{max-height:460px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:var(--border-strong)}.xc-info-panel .md2-content-txt p{font-size:14px;line-height:1.7;margin-bottom:12px}.xc-info-panel .md2-content-txt img{max-width:100%;height:auto;border-radius:var(--radius-sm)}.xc-info-panel .xc-empty-desc{display:flex;align-items:center;min-height:200px}/* 支付条 */.xc-pay-panel{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:16px 20px;margin-top:14px;}.xc-pay-total{font-size:15px;color:var(--text-2);user-select:none}.xc-pay-total .md3_prices{font-size:26px;color:var(--price);font-weight:700;margin:0 6px;font-style:normal}.xc-plain-panel{margin-top:14px}.xc-plain-panel .md4-div{background:var(--surface-2);border-radius:var(--radius)}@media screen and (max-width:900px){.xc-shop-grid{grid-template-columns:1fr}.xc-info-panel .md2-content-txt{max-height:300px}.xc-pay-panel{flex-direction:column;text-align:center}.xc-pay-panel .md3-cent{margin:0 auto}}/* ---------- v1.6.2 商品页页头 / 查单入口 / 购买列（2026-10-07） ---------- *//* 页头：第一行=面包屑（左）+「查询订单」胶囊（右），第二行=商品标题 */.xc-pagehead-top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.xc-title{font-size:22px;font-weight:700;letter-spacing:-.01em;color:var(--text);line-height:1.3;margin:8px 0 0;overflow-wrap:anywhere}/* 查单 ghost 胶囊（首页 hero 与商品页页头共用） */.xc-ghostbtn{display:inline-flex;align-items:center;gap:6px;height:34px;padding:0 16px;border:1px solid var(--border-strong);border-radius:var(--radius-pill);background:var(--surface);color:var(--text-2);font-size:13px;line-height:1;white-space:nowrap;user-select:none;flex:none;transition:color .15s,background .15s,border-color .15s,box-shadow .15s;}.xc-ghostbtn:hover{color:var(--text);background:var(--surface-2);border-color:var(--text-3);text-decoration:none}.xc-ghostbtn svg{width:15px;height:15px;stroke:currentColor;flex:none}/* 支付面板上移：与购买表单同栏纵排（移动端随网格自然落回表单下方） */.xc-buy-col{display:flex;flex-direction:column;gap:14px;min-width:0}.xc-buy-col .xc-pay-panel{margin-top:0}.xc-buy-col .xc-pay-panel .md3-cent{display:flex;gap:12px;flex-wrap:wrap}.xc-buy-col .xc-pay-panel .md3-cent>div{margin-right:0}/* 桌面端双栏等高（2026-10-07「两边齐平」）：行高取两栏较高者，   购买面板拉伸填满、说明面板内容区自适应滚动，两栏底边恒对齐 */@media screen and (min-width:901px){.xc-shop-grid{align-items:stretch}.xc-buy-col{height:100%}.xc-buy-col .xc-buy-panel{flex:1;display:flex;flex-direction:column}.xc-buy-col .xc-buy-panel .xc-panel-bd{flex:1}.xc-info-panel{display:flex;flex-direction:column}.xc-info-panel .xc-panel-bd{flex:1;display:flex;flex-direction:column;min-height:0}.xc-info-panel .md2-content-txt{flex:1;min-height:0}}@media screen and (max-width:600px){.xc-title{font-size:18px}/* 移动端窄屏：面包屑末段与 H1 同文案重复，只留「服务首页/分类」 */.xc-pagehead .xc-crumbs span:last-child,.xc-pagehead .xc-crumbs i:last-of-type{display:none}}@media screen and (max-width:900px){.xc-buy-col .xc-pay-panel .md3-cent{justify-content:center}}header>div>a {margin: 0px 15px;}header .logo{width: 200px;}.kefuas{z-index: 9;}.md2-contentshoppage,.act_cent {max-height: 345px !important;}.danhtml{overflow: hidden;text-overflow: ellipsis;} @media screen and (max-width: 1100px) {header .logo {width: 120px;height: auto;margin-top: 28px;}}