/* ========== 软件商城首页样式（由 index.html 内联样式抽离） ==========
 * 说明：手机端通过 <meta viewport width=1280> 固定渲染桌面版并整体缩放，
 *       已移除会造成结构重排的 992px 断点，仅保留 1300px 的容器内边距优化。
 */
* {margin:0; padding:0; box-sizing:border-box;}
body {font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue",Arial,sans-serif; color:#333; background:#f4f5f8;}
a {text-decoration:none; color:inherit;}
ul,li {list-style:none;}
.container {width:1250px; margin:0 auto;}
img {display:block; border:0;}

/* ========== 顶栏（高53） ========== */
.topbar {background:#fff; border-bottom:1px solid #eee; font-size:12px; color:#656565;}
.topbar-inner {display:flex; justify-content:space-between; align-items:center; height:53px;}
.topbar-left {display:flex; align-items:center;}
.topbar-left a {color:#656565; height:19px; line-height:19px; margin-right:14px; position:relative;}
.topbar-left a:hover {color:#0761ca;}
.topbar-left a.hot {color:#ff5d56; font-weight:700;}
.topbar-left .sep {display:inline-block; border-left:1px solid #e7e7e7; height:12px; width:0; margin:0 14px 0 0;}
.topbar-btns {display:flex; gap:5px;}
.topbar-btns a {background:#f1f4f5; color:#2a2a2a; height:30px; line-height:30px; width:88px; text-align:center; border-radius:2px; font-size:12px;}
.topbar-btns a:hover {background:#e4e7e8;}
/* 扫码关注：悬浮显示后台配置的官方公众号二维码 */
.topbar-qr {position:relative; display:inline-flex; align-items:center; height:19px; margin-right:14px; cursor:pointer;}
.topbar-qr > a {margin-right:0;}
.topbar-qr-pop {display:none; position:absolute; top:52px; left:50%; transform:translateX(-50%); z-index:999; background:#fff; border:1px solid #eee; box-shadow:0 4px 16px rgba(0,0,0,.12); border-radius:4px; padding:12px; width:132px; text-align:center; white-space:nowrap;}
.topbar-qr:hover .topbar-qr-pop {display:block;}
.topbar-qr-pop img {width:108px; height:108px; margin:0 auto;}
.topbar-qr-pop em {display:block; font-style:normal; font-size:12px; color:#656565; margin-top:6px;}
.topbar-qr-pop .topbar-qr-empty {color:#bbb; line-height:108px; height:108px; margin-top:0;}
.topbar-qr-pop::before {content:""; position:absolute; top:-6px; left:50%; transform:translateX(-50%) rotate(45deg); width:10px; height:10px; background:#fff; border-left:1px solid #eee; border-top:1px solid #eee;}

/* ========== 导航（高75） ========== */
.navbar-site {background:#fff; border-bottom:1px solid #eee;}
.navbar-inner {display:flex; align-items:center; height:75px;}
.navbar-logo {width:240px; font-size:26px; font-weight:800; color:#2074ff; letter-spacing:1px; display:flex; align-items:center; gap:8px; white-space:nowrap;}
.navbar-logo .fa {font-size:28px;}
.navbar-logo img {height:60px; width:auto; max-width:220px; object-fit:contain; object-position:left center; display:block;}
.nav-menu {display:flex; height:100%;}
.nav-menu a {color:#333; font-size:15px; font-weight:700; height:75px; line-height:75px; margin-right:28px; position:relative; white-space:nowrap;}
.nav-menu a:hover {color:#1450d2;}
.nav-menu a.active {color:#2074ff;}
.nav-search {margin-left:auto; display:flex; height:36px; width:240px; flex:none; border:1px solid #0761ca; overflow:hidden;}
.nav-search select {flex:none; width:66px; border:none; border-right:1px solid #eee; height:36px; padding:0 4px; font-size:14px; color:#555; outline:none; background:#fafafa;}
.nav-search .kw {flex:1; min-width:0; border:none; height:36px; padding:0 8px; outline:none; font-size:14px; color:#333;}
.nav-search .go {flex:none; width:65px; background:#2c6bea; color:#fff; border:none; height:36px; cursor:pointer; font-size:14px; padding:0;}
.nav-search .go:hover {background:#1450d2;}

/* ========== 主体 hero（背景图，内容高486） ========== */
.hero {
    background-color:#dceaf9;
    background-image:url(../../img/bj.png), linear-gradient(180deg,#eaf3fe 0%,#d8e9fb 100%);
    background-size:cover; background-position:center top; background-repeat:no-repeat;
    padding:0 0 40px;
}
.hero-grid {display:grid; grid-template-columns:240px 1fr 263px; gap:18px; align-items:start;}

/* ---------- 左侧分类面板（宽240，顶部4px蓝条） ---------- */
.side-menu {background:#fff; border-top:4px solid #2074ff; padding:14px 0 10px; display:flex; flex-direction:column; overflow:hidden; height:504px;}
.menu-item {flex:1; position:relative; display:flex; flex-direction:column; justify-content:center; padding:0 15px; min-height:0; overflow:hidden;}
.menu-name {font-size:14px; font-weight:700; color:#000; display:block; line-height:1.4; transition:color .2s;}
.menu-item:hover .menu-name {color:#2074ff;}
.menu-tags {margin-top:5px; line-height:1.4; white-space:nowrap; overflow:hidden;}
.menu-tags a {font-size:12px; color:#959cad; margin-right:16px;}
.menu-tags a:hover {color:#2074ff;}

/* ---------- 中间：轮播图 + 金刚区 ---------- */
.center-col {display:flex; flex-direction:column; gap:14px; height:486px; margin-top:18px;}
.banner-box {position:relative; flex:1; min-height:0; overflow:hidden; background:#e8eef7; border-radius:2px; perspective:1200px;}
.banner-slide {position:absolute; inset:0; opacity:0; visibility:hidden; z-index:1; transform:translateX(4%) scale(.985); transition:opacity .65s ease, transform .65s cubic-bezier(.22,.61,.36,1), visibility 0s linear .65s; will-change:opacity, transform;}
.banner-slide.active {opacity:1; visibility:visible; z-index:2; transform:none; transition:opacity .65s ease, transform .65s cubic-bezier(.22,.61,.36,1), visibility 0s;}
.banner-slide.out-left {opacity:0; visibility:visible; z-index:2; transform:translateX(-4%) scale(.985); transition:opacity .65s ease, transform .65s cubic-bezier(.22,.61,.36,1), visibility 0s;}
.banner-slide img {width:100%; height:100%; object-fit:cover; display:block;}
.banner-slide.empty {position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#9db4d4; font-size:16px; letter-spacing:1px;}
.banner-dots {position:absolute; bottom:12px; left:0; right:0; display:flex; align-items:center; justify-content:center; z-index:5;}
.banner-dots span {display:inline-block; width:10px; height:10px; border-radius:5px; background:rgba(255,255,255,.6); margin:0 5px; cursor:pointer; transition:all .25s;}
.banner-dots span.on {width:25px; background:#fff;}

.zone-row {display:grid; grid-template-columns:1fr 1fr; gap:13px; height:130px; flex:none;}
.zone-item {display:block; height:130px; overflow:hidden; background:#f0f4fa; border-radius:2px; transition:opacity .2s;}
.zone-item:hover {opacity:.92;}
.zone-item img {width:100%; height:130px; object-fit:cover; display:block;}
.zone-item .zone-text {display:flex; flex-direction:column; justify-content:center; height:130px; padding:0 22px; color:#fff; background:linear-gradient(135deg,#3aa0ff,#2074ff);}
.zone-item .zone-text b {font-size:18px; margin-bottom:6px;}
.zone-item .zone-text i {font-style:normal; font-size:12px; opacity:.92;}

/* ---------- 右侧三大优势（虚线框 + 居中蓝标题 + 白底粗体描述） ---------- */
.right-col {display:flex; flex-direction:column; gap:18px; height:486px; margin-top:18px;}
.adv-item {flex:1; display:flex; flex-direction:column; min-height:0;}
.adv-top {flex:1; min-height:0; border:1px dashed #888; background-color:#f4f7fd; background-repeat:no-repeat; background-position:6px center; background-size:auto 120px; display:flex; align-items:center; justify-content:center; padding:0 14px;}
.adv-item .adv-name {font-size:16px; color:#2074ff; line-height:1.5; text-align:center; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.adv-bottom {background:#fff; height:40px; line-height:40px; padding:0 12px; font-size:13px; font-weight:700; color:#333; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}

/* ========== 公告横条（药丸 + 橙色标签） ========== */
.notice-strip {background:#f4f5f8; padding:25px 0 0;}
.notice-inner {display:flex; align-items:center; justify-content:space-between;}
.notice-bar {display:flex; align-items:center; background:#fff; border-radius:50px; padding:0 24px; height:50px; gap:14px; font-size:14px; color:#555; flex:1; min-width:0;}
.notice-bar .cap {color:#ff5c00; font-weight:700; white-space:nowrap;}
.notice-bar .cap .fa {margin-right:6px;}
.notice-bar em {font-style:normal; width:1px; height:14px; background:#a8a8a8; flex:none;}
.notice-bar span {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#555;}
.notice-bar a {overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#555; flex:1; min-width:0;}
.notice-bar a:hover {color:#2074ff;}
/* 公告垂直轮播：条目绝对叠放，交叉滑动切换，避免切换瞬间出现空白 */
.notice-rotator {flex:1; min-width:0; height:22px; overflow:hidden; position:relative;}
.notice-rotator .nr-item {position:absolute; left:0; right:0; top:0; height:22px; line-height:22px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#555; opacity:0; visibility:hidden; transform:translateY(100%); transition:transform .55s cubic-bezier(.22,.61,.36,1), opacity .45s ease, visibility 0s linear .55s;}
.notice-rotator .nr-item a {color:#555;}
.notice-rotator .nr-item a:hover {color:#2074ff;}
.notice-rotator .nr-item.nr-active {transform:translateY(0); opacity:1; visibility:visible; transition:transform .55s cubic-bezier(.22,.61,.36,1), opacity .45s ease, visibility 0s;}
.notice-rotator .nr-item.nr-out-up {transform:translateY(-100%); opacity:0; visibility:visible; transition:transform .55s cubic-bezier(.22,.61,.36,1), opacity .45s ease, visibility 0s;}
.promise-list {display:flex; gap:24px; flex:none; margin-left:24px;}
.promise-list .p-item {display:flex; align-items:center; gap:5px; font-size:12px; color:#7d7d7d; white-space:nowrap;}
.promise-list .p-ico {width:22px; height:22px; border-radius:50%; border:1px solid #9a9a9a; color:#7d7d7d; display:flex; align-items:center; justify-content:center; font-size:12px; line-height:1; font-weight:400;}

/* ========== 通用板块标题 ========== */
.section {padding:28px 0 0;}
.sec-head {display:flex; align-items:center; margin-bottom:6px;}
.sec-head h2 {font-size:20px; font-weight:700; color:#555; line-height:32px;}
.sec-head h2 i {font-style:normal; color:#f5a623; font-weight:700; margin-left:6px;}
.sec-head .sub {font-size:14px; color:#8787a4; margin-left:12px; padding-left:14px; border-left:1px solid #dcdce6; height:32px; line-height:32px;}
.sec-head .more {margin-left:auto; font-size:14px; color:#999; line-height:32px;}
.sec-head .more:hover {color:#000;}

/* ========== 最新商品（5列，方图，hover上浮） ========== */
.goods-grid {display:grid; grid-template-columns:repeat(5,1fr); gap:15px;}
.goods-card {background:#fff; border:1px solid #eee; border-radius:4px; overflow:hidden; transition:transform .25s ease-in, box-shadow .25s ease-in;}
.goods-card:hover {transform:translateY(-5px); box-shadow:0 8px 10px #e6e6e6;}
.goods-thumb {width:100%; aspect-ratio:1/1; background:#f5f7fa; overflow:hidden; display:flex; align-items:center; justify-content:center;}
.goods-thumb img {width:100%; height:100%; object-fit:cover; display:block;}
.goods-thumb .noimg {color:#c3cdd9; font-size:34px;}
.goods-info {padding:0 10px 12px;}
.goods-tags {margin:10px 0 0; min-height:18px;}
.goods-tags span {display:inline-block; font-size:11px; color:#2074ff; border:1px solid #cfe0f8; border-radius:2px; padding:0 6px; margin-right:8px;}
.goods-name {font-size:14px; color:#555; line-height:25px; height:50px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin-top:5px;}
.goods-name:hover {color:#ff0000;}
.goods-foot {display:flex; align-items:center; border-top:1px solid #ebeef5; margin-top:6px; padding-top:2px;}
.goods-foot .goods-attrs {display:flex; align-items:center; flex-wrap:wrap; min-height:35px;}
.goods-foot .goods-attr-lead {display:inline-flex; align-items:center; color:#c5c5c5; margin:0 8px 0 2px;}
.goods-foot .goods-attrs .dt-attr-plain {width:20px; height:20px; margin:0 3px; vertical-align:middle;}
.goods-foot .goods-attr-txt {font-size:12px; color:#999; margin:0 3px;}
.goods-foot .price {margin-left:auto; color:#ff0000; font-size:14px; font-weight:700; line-height:35px;}
.goods-foot .svc-view-btn {display:inline-flex; align-items:center; justify-content:center; height:30px; padding:0 16px; font-size:13px; color:#ff7a1a; background:#fff7ee; border:1px solid #ffd2a8; border-radius:3px; white-space:nowrap; letter-spacing:.5px; transition:all .2s;}
.goods-foot .svc-view-btn:hover {color:#fff; background:#ff7a1a; border-color:#ff7a1a; box-shadow:0 2px 8px rgba(255,122,26,.28);}
.more-block {text-align:center; padding:20px 0 6px;}
.btn-orange {display:inline-block; background:#ff6600; color:#fff; font-size:14px; height:44px; line-height:44px; width:220px; border-radius:4px; transition:background .2s;}
.btn-orange:hover {background:#f25c00;}

/* ========== 促销横幅 ========== */
.promo-band {margin:26px 0 0; background:linear-gradient(90deg,#2074ff,#5aa8ff); border-radius:6px; height:76px; display:flex; align-items:center; padding:0 32px; color:#fff;}
.promo-band b {font-size:20px; letter-spacing:1px;}
.promo-band span {font-size:13px; opacity:.9; margin-left:18px;}
.promo-band .p-btn {margin-left:auto; border:1px solid rgba(255,255,255,.7); border-radius:20px; padding:6px 22px; font-size:13px;}
.promo-band .p-btn:hover {background:#fff; color:#2074ff;}

/* ========== 品牌店铺（4列，方logo） ========== */
.shop-grid {display:grid; grid-template-columns:repeat(4,1fr); gap:15px;}
.shop-card {background:#fff; border:1px solid #eee; border-radius:4px; text-align:center; overflow:hidden; transition:transform .25s ease-in, box-shadow .25s ease-in;}
.shop-card:hover {transform:translateY(-5px); box-shadow:0 8px 10px #e6e6e6;}
.shop-logo {width:100%; aspect-ratio:1/1; background:#fff; display:flex; align-items:center; justify-content:center;}
.shop-logo b {font-size:26px; font-weight:800; color:#2074ff; letter-spacing:1px;}
.shop-name {font-size:18px; color:#333; height:30px; line-height:30px; overflow:hidden; margin:0 20px;}
.shop-badges {margin:14px 0 0;}
.shop-badges span {display:inline-block; font-size:12px; color:#3faf6e; border:1px solid #c8e8d2; border-radius:2px; padding:1px 8px; margin:0 5px;}
.shop-stat {font-size:14px; color:#999; padding:12px 0 20px;}
.shop-stat i {font-style:normal; color:#555; margin:0 3px;}
.shop-btn {display:inline-block; width:187px; max-width:70%; height:32px; line-height:30px; border:1px solid #e2e2e2; border-radius:34px; font-size:15px; color:#848484; margin-bottom:24px; transition:all .2s;}
.shop-card:hover .shop-btn {border-color:#d93a3a; color:#fff; background:#d93a3a;}

/* ========== 四大榜单列（彩色头 + 彩色排名徽章） ========== */
.rank-grid {display:grid; grid-template-columns:repeat(4,1fr); gap:15px;}
.rank-col {background:#fff; border-radius:4px; overflow:hidden; height:460px;}
.rank-head {color:#fff; height:66px; display:flex; align-items:center; justify-content:center; font-size:20px; font-weight:700; position:relative;}
.rank-head a {position:absolute; right:16px; top:0; height:66px; line-height:66px; font-size:12px; font-weight:400; opacity:.85;}
.rank-head a:hover {opacity:1;}
.rank-col.c0 .rank-head {background:linear-gradient(90deg,#3a7bff,#6aa6ff);}
.rank-col.c1 .rank-head {background:linear-gradient(90deg,#22b07d,#5fd0a3);}
.rank-col.c2 .rank-head {background:linear-gradient(90deg,#ff9a2e,#ffc267);}
.rank-col.c3 .rank-head {background:linear-gradient(90deg,#8a5cf6,#b79bff);}
.rank-list {padding:8px 15px;}
.rank-item {display:flex; align-items:flex-start; margin-bottom:23px;}
.rank-item .r-badge {flex:none; width:18px; height:18px; line-height:18px; text-align:center; font-size:12px; border-radius:3px; background:#999; color:#fff; margin-right:12px; margin-top:1px;}
.rank-item .r-badge.b1 {background:#f44336;}
.rank-item .r-badge.b2 {background:#4caf50;}
.rank-item .r-badge.b3 {background:#ffc107;}
.rank-item .r-badge.b4 {background:#00bcd4;}
.rank-item .r-badge.b5 {background:#2196f3;}
.rank-item .r-badge.b6 {background:#e91e63;}
.rank-item .r-body {flex:1; min-width:0;}
.rank-item .r-name {font-size:14px; color:#666; line-height:18px; height:18px; overflow:hidden; display:block;}
.rank-item .r-name:hover {color:#08a2eb;}
.rank-item .r-foot {display:flex; align-items:baseline; margin-top:8px;}
.rank-item .r-price {color:#ff0000; font-size:14px;}
.rank-item .r-date {margin-left:auto; color:#bbb; font-size:12px;}
.rank-empty {padding:40px 0; text-align:center; color:#bbb; font-size:12px;}

/* ========== 最新动态四频道 ========== */
.news-box {background:#fff; border:1px solid #eee; border-radius:4px; padding:20px;}
.news-grid {display:grid; grid-template-columns:repeat(4,1fr); gap:20px;}
.news-col {display:flex; flex-direction:column; min-width:0;}
.news-chan {display:flex; align-items:center; justify-content:space-between; height:46px; padding:0 16px; border-radius:8px; color:#fff; font-size:17px; font-weight:600; letter-spacing:1px;}
.news-chan .more {color:#fff; font-size:13px; opacity:.85; font-weight:400;}
.news-chan .more:hover {opacity:1;}
.nc-platform .news-chan {background:linear-gradient(135deg,#5b9dff,#2074ff);}
.nc-industry .news-chan {background:linear-gradient(135deg,#8b7bff,#5a4bd6);}
.nc-tech .news-chan {background:linear-gradient(135deg,#ffa24d,#ff6a00);}
.nc-log .news-chan {background:linear-gradient(135deg,#3fd6a6,#12b886);}
.news-list {padding:4px 6px;}
.news-row {display:flex; align-items:flex-start; gap:10px; padding:11px 8px; border-bottom:1px dashed #ededed;}
.news-row:last-child {border-bottom:none;}
.news-row .idx {flex:none; width:20px; height:20px; line-height:20px; text-align:center; font-size:12px; color:#8a94a6; background:#eef1f6; border-radius:5px; margin-top:1px;}
.news-row .idx.top {color:#fff; background:#c3cad6;}
.nc-platform .news-row .idx.top {background:#2074ff;}
.nc-industry .news-row .idx.top {background:#5a4bd6;}
.nc-tech .news-row .idx.top {background:#ff6a00;}
.nc-log .news-row .idx.top {background:#12b886;}
.news-row .txt {flex:1; min-width:0; display:block;}
.news-row .n-title {display:block; font-size:14px; color:#444; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
.news-row .txt:hover .n-title {color:#2074ff;}
.news-row .n-date {display:block; font-size:12px; color:#c0c4cc; margin-top:3px;}
.news-empty {color:#bbb; font-size:13px; padding:24px 0; text-align:center;}

/* ========== 友情链接 ========== */
.friend-box {background:#fff; border-radius:4px; padding:20px 25px;}
.friend-logos {display:grid; grid-template-columns:repeat(8,1fr); gap:10px; margin-bottom:14px;}
.friend-logos a {height:37px; line-height:35px; text-align:center; border:1px solid #f1f1f1; font-size:13px; color:#888;}
.friend-logos a:hover {color:#2c6bea; border-color:#cfe0f8;}
.friend-links {display:flex; flex-wrap:wrap; gap:18px; font-size:12px; color:#999; line-height:30px;}
.friend-links .friend-label {flex:none; font-weight:700; font-size:14px; color:#333;}
.friend-links a:hover {color:#2c6bea;}

/* ========== 页脚（深色 #161616 + 竖线分隔） ========== */
.site-footer {background:#161616; margin-top:36px; padding:34px 0 30px;}
.footer-grid {display:flex;}
.footer-col {width:157px; padding-left:40px; border-left:1px solid #303030; text-align:left;}
.footer-col:first-child {border-left:0; padding-left:0;}
.footer-col h4 {font-size:15px; color:#fff; font-weight:700; margin-bottom:12px;}
.footer-col a {display:block; font-size:12px; color:#6d6d6d; margin-top:10px;}
.footer-col a:hover {color:#b5b5b5;}
.footer-contact {margin-left:auto; padding-left:48px; text-align:left; display:flex; gap:24px; align-items:flex-start;}
.footer-contact .qr-item {display:flex; flex-direction:column; align-items:center;}
.footer-contact .lab {font-size:15px; color:#8d8d8d;}
.footer-contact .tel {font-size:20px; color:#dbdbdb; font-weight:700; padding:3px 0 12px;}
.footer-contact .mail {font-size:12px; color:#8d8d8d;}
.footer-contact .qr {margin-top:10px; width:120px; height:120px; background:#fff; border-radius:4px; display:flex; align-items:center; justify-content:center; font-size:52px; color:#161616; overflow:hidden;}
.footer-contact .qr img {width:100%; height:100%; object-fit:contain;}
.footer-contact .qr-cap {margin-top:8px; font-size:12px; color:#8d8d8d; text-align:center;}
.footer-bottom {border-top:1px solid #303030; margin-top:28px; padding-top:18px; text-align:center; font-size:12px; color:#747474; line-height:2;}
.footer-bottom a {color:#747474; margin:0 8px;}
.footer-bottom a:hover {color:#b5b5b5;}

/* ========== 应用商城列表页：搜索横幅 ========== */
.mall-hero {background-color:#dceaf9; background-image:url(../../img/bj.png), linear-gradient(180deg,#eaf3fe 0%,#d8e9fb 100%); background-size:cover; background-position:center top; background-repeat:no-repeat; padding:16px 0;}
.mall-hero .ms-cap {font-size:13px; color:#5b7bb0;}

/* ========== 应用商城列表页：主体 ========== */
.mall-main {padding:18px 0 0;}

/* ---------- 筛选面板 ---------- */
.filter-box {background:#fff; border:1px solid #eee; border-radius:4px; padding:2px 20px;}
.filter-row {display:flex; align-items:flex-start; padding:14px 0; border-bottom:1px dashed #ededed;}
.filter-row:last-child {border-bottom:none;}
.filter-label {flex:none; width:82px; color:#999; font-size:14px; line-height:28px;}
.filter-opts {flex:1; min-width:0; display:flex; flex-wrap:wrap; gap:8px 4px;}
.f-opt {font-size:14px; color:#555; line-height:26px; padding:0 12px; border:1px solid transparent; border-radius:3px; white-space:nowrap; transition:all .15s;}
.f-opt:hover {color:#2074ff;}
.f-opt.active {color:#2074ff; background:#eaf2ff; border-color:#bcd6ff; font-weight:700;}

/* ---------- 已选条件 ---------- */
.chips {display:flex; align-items:center; flex-wrap:wrap; gap:10px; margin-top:14px; background:#fff; border:1px solid #eee; border-radius:4px; padding:12px 20px; font-size:13px;}
.chips .ch-cap {color:#999;}
.chip {display:inline-flex; align-items:center; gap:6px; background:#fff5e9; color:#ff7a00; border:1px solid #ffd9ad; border-radius:3px; padding:2px 10px; font-size:13px;}
.chip:hover {border-color:#ff9a4d;}
.chip .x {font-style:normal; color:#ff9a4d; font-weight:700;}

/* ---------- 排序条 ---------- */
.sort-bar {display:flex; align-items:center; margin-top:14px; background:#fff; border:1px solid #eee; border-radius:4px; padding:0 20px; height:46px; font-size:14px;}
.sort-bar a {margin-right:26px; color:#666; line-height:44px; position:relative;}
.sort-bar a:hover {color:#2074ff;}
.sort-bar a.active {color:#2074ff; font-weight:700;}
.sort-bar .count {margin-left:auto; color:#999; font-size:13px;}
.sort-bar .count b {color:#2074ff; font-weight:700; margin:0 3px;}

/* ---------- 分页 ---------- */
.pager {display:flex; justify-content:center; align-items:center; gap:6px; padding:26px 0 6px; flex-wrap:wrap;}
.pager a, .pager span {min-width:36px; height:36px; line-height:34px; text-align:center; padding:0 10px; border:1px solid #ddd; border-radius:3px; background:#fff; color:#666; font-size:14px;}
.pager a:hover {border-color:#2074ff; color:#2074ff;}
.pager .cur {background:#2074ff; border-color:#2074ff; color:#fff;}
.pager .dis {color:#ccc; background:#fafafa;}

/* ---------- 空态 ---------- */
.mall-empty {background:#fff; border:1px solid #eee; border-radius:4px; margin-top:14px; padding:70px 0; text-align:center; color:#aaa; font-size:14px;}

/* ================= 商品详情页 ================= */
.dt-wrap {padding:16px 0 0;}
.dt-top {display:flex; gap:16px; align-items:stretch;}

/* ---------- 主图 / 图集 ---------- */
.dt-gallery {width:400px; flex:none; background:#fff; border:1px solid #eee; border-radius:4px; padding:16px;}
.dt-mainimg {width:100%; aspect-ratio:1/1; background:#f5f7fa; display:flex; align-items:center; justify-content:center; overflow:hidden;}
.dt-mainimg img {width:100%; height:100%; object-fit:contain;}
.dt-mainimg .noimg {color:#c3cdd9; font-size:56px;}
.dt-thumbs {display:flex; flex-wrap:wrap; gap:8px; margin-top:12px;}
.dt-thumbs img {width:62px; height:62px; object-fit:cover; border:1px solid #eee; border-radius:3px; cursor:pointer;}
.dt-thumbs img.on {border-color:#2074ff;}
.dt-gallery-foot {display:flex; justify-content:space-between; margin-top:14px; padding-top:12px; border-top:1px solid #f0f0f0; font-size:13px; color:#888;}
.dt-gallery-foot a:hover {color:#2074ff;}
.dt-fav {cursor:pointer; transition:color .15s;}
.dt-fav i {margin-right:2px;}
.dt-fav.on {color:#f5a623;}
.dt-fav.on:hover {color:#f5a623;}

/* ---------- 商品信息 ---------- */
.dt-info {flex:1; min-width:0; background:#fff; border:1px solid #eee; border-radius:4px; padding:20px 22px;}
.dt-title {font-size:22px; font-weight:700; color:#222; line-height:1.4; min-height:2.8em; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; word-break:break-all;}
.dt-tags {margin-top:10px;}
.dt-tags span {display:inline-block; font-size:12px; color:#2074ff; border:1px solid #cfe0f8; border-radius:2px; padding:1px 8px; margin-right:8px;}
.dt-pricebox {display:flex; align-items:center; justify-content:space-between; margin-top:16px; background:linear-gradient(90deg,#fff3ec,#fff8f3); border-radius:4px; padding:16px 18px;}
.dt-price-l em {font-style:normal; font-size:13px; color:#ff5a2a; margin-right:8px;}
.dt-price {color:#ff4400; font-size:30px; font-weight:800;}
.dt-origin {margin-left:12px; color:#a5a5a5; font-size:14px; text-decoration:line-through;}
.dt-price-r {display:flex; gap:28px;}
.dt-stat {text-align:center; font-size:13px; color:#999;}
.dt-stat b {display:block; font-size:18px; color:#333; font-weight:700; margin-top:4px;}
.dt-attrs {display:flex; flex-wrap:wrap; gap:8px 26px; margin-top:16px; font-size:13px; color:#666;}
.dt-attr {display:inline-flex; align-items:center;}
.dt-attr .lab {color:#aaa; margin-right:6px;}
.dt-attr b {color:#333; font-weight:400;}
.dt-attr-ico {position:relative; display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; padding:3px; border:1px solid #e6ecf5; border-radius:6px; background:#fff; cursor:pointer; vertical-align:middle; transition:border-color .15s, box-shadow .15s;}
.dt-attr-ico:hover {border-color:#bcd6ff; box-shadow:0 2px 8px rgba(32,116,255,.15);}
.dt-attr-ico img {max-width:100%; max-height:100%; object-fit:contain; display:block;}
.dt-attr-ico::after {content:attr(data-name); position:absolute; left:50%; bottom:132%; transform:translateX(-50%); background:rgba(0,0,0,.82); color:#fff; font-size:12px; line-height:1; padding:6px 9px; border-radius:4px; white-space:nowrap; opacity:0; visibility:hidden; transition:opacity .15s; pointer-events:none; z-index:30;}
.dt-attr-ico:hover::after {opacity:1; visibility:visible;}
.dt-attr-plain {position:relative; display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; margin:0 4px; cursor:pointer; vertical-align:-4px; line-height:1; transition:transform .15s;}
.dt-attr-plain:hover {transform:scale(1.12);}
.dt-attr-plain img {max-width:100%; max-height:100%; object-fit:contain; display:block; border-radius:3px;}
.dt-attr-plain::after {content:attr(data-name); position:absolute; left:50%; bottom:150%; transform:translateX(-50%); background:rgba(0,0,0,.82); color:#fff; font-size:12px; line-height:1; padding:5px 8px; border-radius:4px; white-space:nowrap; opacity:0; visibility:hidden; transition:opacity .15s; pointer-events:none; z-index:30;}
.dt-attr-plain:hover::after {opacity:1; visibility:visible;}
.dt-qty-row {display:flex; align-items:center; margin-top:20px; font-size:14px; color:#666;}
.dt-qty-row .lab {margin-right:14px;}
.dt-qty {display:flex; align-items:center; border:1px solid #ddd; border-radius:3px; overflow:hidden;}
.dt-qty button {width:34px; height:32px; border:none; background:#f7f7f7; font-size:16px; color:#666; cursor:pointer;}
.dt-qty button:hover {background:#eef3ff; color:#2074ff;}
.dt-qty input {width:52px; height:32px; border:none; border-left:1px solid #ddd; border-right:1px solid #ddd; text-align:center; font-size:14px; outline:none;}
.dt-date {margin-left:20px; color:#bbb; font-size:13px;}
.dt-pkg-row {display:flex; align-items:flex-start; margin-top:18px; font-size:14px; color:#666;}
.dt-pkg-row .lab {flex:0 0 auto; margin-right:14px; line-height:38px; color:#999;}
.dt-pkg-list {display:flex; flex-wrap:wrap; gap:12px;}
.dt-pkg-item {position:relative; display:inline-flex; align-items:center; justify-content:center; min-width:88px; padding:0 20px; height:38px; border:1px solid #ddd; border-radius:3px; cursor:pointer; color:#333; font-size:14px; background:#fff; overflow:hidden; user-select:none; transition:border-color .15s;}
.dt-pkg-item:hover {border-color:#2074ff;}
.dt-pkg-item.on {border-color:#2074ff;}
.dt-pkg-item.on::after {content:""; position:absolute; right:0; bottom:0; width:0; height:0; border-style:solid; border-width:0 0 16px 16px; border-color:transparent transparent #2074ff transparent;}
.dt-btns {display:flex; gap:14px; margin-top:26px;}
.dt-btns button {height:46px; padding:0 34px; border-radius:4px; font-size:16px; cursor:pointer; border:1px solid transparent;}
.btn-buy {background:#2074ff; color:#fff;}
.btn-buy:hover {background:#1450d2;}
.btn-cart {background:#fff; color:#2074ff; border-color:#2074ff;}
.btn-cart:hover {background:#eef3ff;}

/* ---------- 开发商信息 ---------- */
.dt-seller {width:300px; flex:none; background:#fff; border:1px solid #eef1f6; border-radius:8px; overflow:hidden; box-shadow:0 2px 12px rgba(32,116,255,.05);}
.dt-seller-head {background:linear-gradient(135deg,#eaf3ff,#d7e8ff); padding:14px 16px;}
.dt-seller-head b {display:block; font-size:17px; font-weight:700; color:#2074ff; letter-spacing:.5px;}
.dt-seller-head span {display:block; font-size:12px; color:#6b8fc7; margin-top:5px;}
.dt-seller-body {padding:14px 16px 16px;}
.dt-shopname {display:flex; align-items:center; justify-content:center; gap:6px; font-size:16px; font-weight:700; color:#222; letter-spacing:.5px; margin-bottom:8px; padding-bottom:8px; border-bottom:1px solid #f2f4f8;}
.dt-shopicon {width:22px; height:22px; object-fit:contain; border-radius:4px; flex:none;}
.dt-row {display:flex; align-items:center; font-size:13px; color:#555; line-height:1.5; padding:4px 0;}
.dt-row .lab {flex:0 0 72px; color:#9aa3b0; font-weight:400;}
.dt-level {color:#ff9a2e; display:inline-flex; align-items:center;}
.dt-level .fa, .dt-level img {margin-right:4px;}
.dt-link {color:#2074ff;}
.dt-link:hover {text-decoration:underline;}
.dt-val {color:#333; cursor:pointer;}
.dt-badge {display:inline-flex; align-items:center; color:#3faf6e; background:#f0faf4; border:1px solid #cdeed9; border-radius:10px; padding:2px 10px; font-size:12px;}
.dt-badge .fa {margin-right:3px;}
.dt-seller-btns {display:flex; gap:12px; margin-top:12px;}
.dt-seller-btns button {flex:1; height:40px; border-radius:4px; font-size:14px; font-weight:500; cursor:pointer; border:1px solid #2074ff; transition:all .15s;}
.btn-consult {background:#2074ff; color:#fff;}
.btn-consult:hover {background:#1450d2;}
.btn-view {background:#fff; color:#2074ff;}
.btn-view:hover {background:#eef3ff;}
.btn-follow {background:#fff; color:#3faf6e; border-color:#3faf6e !important;}
.btn-follow:hover {background:#eefaf3;}
.dt-warn {margin-top:12px; background:#fff8e6; color:#c8861d; font-size:12px; line-height:1.6; border-radius:4px; padding:9px 12px;}
.dt-warn .fa {margin-right:4px;}

/* ---------- 下部：排行榜 + 标签页 ---------- */
.dt-bottom {display:flex; gap:16px; align-items:flex-start; margin-top:16px;}
.dt-rank {width:260px; flex:none; background:#fff; border:1px solid #eee; border-radius:4px; overflow:hidden;}
.dt-rank-head {text-align:center; font-size:16px; font-weight:700; color:#333; padding:16px 0; border-bottom:1px solid #f0f0f0;}
.dt-rank-list {padding:6px 12px;}
.dt-rank-item {display:flex; gap:10px; padding:12px 4px; border-bottom:1px dashed #ededed;}
.dt-rank-item:last-child {border-bottom:none;}
.dt-rank-thumb {flex:none; width:60px; height:60px; background:#f5f7fa; border-radius:3px; overflow:hidden; display:flex; align-items:center; justify-content:center; color:#c3cdd9;}
.dt-rank-thumb img {width:100%; height:100%; object-fit:cover;}
.dt-rank-body {flex:1; min-width:0; display:flex; flex-direction:column;}
.dt-rank-name {font-size:13px; color:#555; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;}
.dt-rank-item:hover .dt-rank-name {color:#2074ff;}
.dt-rank-price {margin-top:auto; color:#ff4400; font-size:14px; font-weight:700;}
.dt-rank-empty {padding:40px 0; text-align:center; color:#bbb; font-size:13px;}

.dt-content {flex:1; min-width:0; background:#fff; border:1px solid #eee; border-radius:4px;}
.dt-tabs {display:flex; border-bottom:1px solid #eee; padding:0 12px;}
.dt-tab {padding:16px 26px; font-size:15px; color:#666; cursor:pointer; border-bottom:2px solid transparent; margin-bottom:-1px;}
.dt-tab em {font-style:normal; color:#bbb;}
.dt-tab.on {color:#2074ff; font-weight:700; border-bottom-color:#2074ff;}
.dt-tab.on em {color:#2074ff;}
.dt-panel {display:none; padding:24px 26px;}
.dt-panel.on {display:block;}
.dt-attr-grid {display:grid; grid-template-columns:1fr 1fr; gap:0 30px; margin-bottom:20px; font-size:14px;}
.dt-attr-cell {display:flex; align-items:baseline; padding:10px 0; border-bottom:1px dashed #f0f0f0;}
.dt-attr-cell .lab {color:#999; flex:0 0 96px; font-weight:400;}
.dt-attr-cell .val {color:#333;}
.dt-rich {font-size:14px; color:#444; line-height:1.9; word-break:break-all;}
.dt-rich img {max-width:100%; height:auto;}
.dt-none {color:#bbb; font-size:14px; text-align:center; padding:50px 0;}
.dt-log-title {text-align:center; font-size:22px; font-weight:700; color:#333; padding:6px 0 34px; letter-spacing:1px;}
.dt-log-pager {padding:24px 0 4px;}
.dt-timeline {list-style:none; padding:0 0 10px;}
.dt-tl-item {position:relative; padding-left:96px; margin-bottom:28px;}
.dt-tl-item::before {content:''; position:absolute; left:75px; top:14px; bottom:-28px; width:2px; background:#e9e9e9;}
.dt-tl-item:last-child::before {display:none;}
.dt-tl-item:last-child {margin-bottom:6px;}
.dt-tl-date {position:absolute; left:0; top:6px; width:62px; text-align:center;}
.dt-tl-date b {display:block; font-size:26px; color:#2074ff; font-weight:700; line-height:1;}
.dt-tl-date span {display:block; font-size:12px; color:#999; margin-top:5px;}
.dt-tl-dot {position:absolute; left:71px; top:10px; width:10px; height:10px; border-radius:50%; background:#2074ff; box-shadow:0 0 0 3px #eaf2ff; z-index:2;}
.dt-tl-card {border:1px solid #eee; border-radius:4px; overflow:hidden; background:#fff;}
.dt-tl-card-head {display:flex; align-items:center; background:#f5f6f8; padding:12px 18px;}
.dt-tl-card-head .ver {font-size:15px; color:#2074ff;}
.dt-tl-card-head .tm {margin-left:auto; font-size:13px; color:#999;}
.dt-tl-card-body {padding:18px 22px; font-size:14px; color:#555; line-height:2; word-break:break-all;}
.dt-tl-card-body img {max-width:100%; height:auto;}

/* ---------- 弹窗 ---------- */
.dt-modal {display:none; position:fixed; inset:0; z-index:1000; background:rgba(0,0,0,.5); align-items:center; justify-content:center;}
.dt-modal.show {display:flex;}
.dt-modal-box {position:relative; width:320px; background:#fff; border-radius:8px; padding:28px 24px; text-align:center;}
.dt-modal-close {position:absolute; right:14px; top:12px; font-size:20px; color:#bbb; cursor:pointer;}
.dt-modal-close:hover {color:#666;}
.dt-modal-title {font-size:17px; font-weight:700; color:#333; margin-bottom:18px;}
.dt-modal-qr {width:220px; height:220px; margin:0 auto; background:#f7f9fc; border:1px solid #eee; border-radius:6px; display:flex; flex-direction:column; align-items:center; justify-content:center; color:#c3cdd9; font-size:60px; overflow:hidden;}
.dt-modal-qr img {width:100%; height:100%; object-fit:contain;}
.dt-modal-qr span {font-size:13px; color:#aaa; margin-top:8px;}
.dt-modal-tip {margin-top:14px; font-size:13px; color:#666;}

/* ========== 登录 / 注册页 ========== */
body.auth-page {padding-top:0 !important; background:#f5f7fa;}
.auth-wrap {padding:56px 0 90px; background:linear-gradient(180deg,#eaf3fe 0%,#f5f8fd 60%,#f5f7fa 100%);}
.auth-card {width:440px; margin:0 auto; background:#fff; border-radius:8px; box-shadow:0 10px 40px rgba(32,116,255,.10); overflow:hidden;}
.auth-tabs {display:flex;}
.auth-tabs a {flex:1; text-align:center; height:56px; line-height:56px; font-size:16px; color:#666; background:#f2f5fa; position:relative; transition:color .15s;}
.auth-tabs a:hover {color:#2074ff;}
.auth-tabs a.active {background:#fff; color:#2074ff; font-weight:700;}
.auth-tabs a.active::after {content:""; position:absolute; left:50%; bottom:0; transform:translateX(-50%); width:44px; height:3px; background:#2074ff; border-radius:2px;}
.auth-body {padding:30px 36px 36px;}
.auth-body .form-group {margin-bottom:18px;}
.auth-body .control-label {display:block; text-align:left; font-size:14px; color:#333; font-weight:600; margin-bottom:8px; padding:0;}
.auth-body .form-control {height:44px; line-height:1.4; border:1px solid #dfe4ec; border-radius:4px; box-shadow:none; font-size:14px; color:#333;}
.auth-body .form-control:focus {border-color:#2074ff; box-shadow:0 0 0 3px rgba(32,116,255,.12);}
.auth-body .help-block {margin:0; color:#e05b5b; font-size:12px; min-height:0;}
.auth-row-between {display:flex; align-items:center; justify-content:space-between;}
.auth-body .checkbox {display:inline-block; margin:0;}
.auth-body .checkbox label {font-size:13px; color:#888; font-weight:normal; padding-left:0;}
.auth-body .btn-forgot {font-size:13px; color:#2074ff;}
.auth-body .btn-forgot:hover {color:#1a63e0; text-decoration:none;}
.auth-submit {height:46px; line-height:46px; padding:0; background:#2074ff; border:1px solid #2074ff; border-radius:4px; font-size:16px; margin-top:6px;}
.auth-submit:hover, .auth-submit:focus {background:#1a63e0; border-color:#1a63e0;}
.auth-switch {display:block; text-align:center; margin-top:16px; font-size:13px; color:#999;}
.auth-switch:hover {color:#2074ff; text-decoration:none;}
.auth-body .input-group .form-control {border-top-right-radius:0; border-bottom-right-radius:0;}
.auth-body .input-group .btn {height:44px; line-height:24px;}

/* ========== 帮助中心页 ========== */
.hc-layout {display:flex; align-items:flex-start; gap:24px; padding:6px 0 0;}
.hc-menu {flex:0 0 220px; width:220px; background:#fff; border:1px solid #eee; border-radius:4px; overflow:hidden;}
.hc-menu-cap {font-size:16px; font-weight:700; color:#fff; background:#2074ff; padding:16px 18px;}
.hc-menu-cap i {margin-right:6px;}
.hc-menu-list {padding:8px 0;}
.hc-menu-list li {margin:0;}
.hc-menu-item {position:relative; display:block; height:48px; line-height:48px; padding:0 20px; font-size:15px; color:#444; background:#eaf1fd; border-bottom:1px solid #fff; transition:background .15s;}
.hc-menu-item:hover {background:#dbe8fc; color:#2074ff;}
.hc-menu-item.active {background:#2074ff; color:#fff; font-weight:700;}
.hc-menu-item.active::after {content:""; position:absolute; right:0; top:50%; transform:translateY(-50%); border-style:solid; border-width:7px 0 7px 9px; border-color:transparent transparent transparent #fff;}

.hc-content {flex:1 1 auto; min-width:0; background:#fff; border:1px solid #eee; border-radius:4px; padding:28px 34px 40px; min-height:460px;}
.hc-title {font-size:22px; font-weight:700; color:#2074ff; line-height:1.4; padding-bottom:16px; margin-bottom:20px; border-bottom:1px solid #f0f0f0;}
.hc-body {font-size:15px; color:#555; line-height:1.9; word-break:break-all;}
.hc-body img {max-width:100%; height:auto;}
.hc-body p {margin:0 0 12px;}
.hc-none {padding:40px 0; text-align:center; color:#999; font-size:14px;}

/* 帮助中心小屏：左侧菜单换行到正文上方 */
@media (max-width:1000px) {
    .hc-layout {flex-direction:column;}
    .hc-menu {flex:1 1 auto; width:100%;}
}

/* ========== 资讯公告详情页 ========== */
.nd-main {padding:28px 34px 40px;}
.nd-title {font-size:24px; font-weight:700; color:#222; line-height:1.5; word-break:break-all;}
.nd-meta {display:flex; flex-wrap:wrap; align-items:center; gap:24px; margin-top:14px; padding-bottom:16px; border-bottom:1px solid #f0f0f0; font-size:13px; color:#999;}
.nd-cap {margin-top:20px; height:44px; line-height:44px; padding:0 16px; font-size:16px; font-weight:700; color:#333; background:#f5f7fa; border-left:4px solid #2074ff;}
.nd-cap i {color:#2074ff; margin-right:8px;}
.nd-body {padding-top:22px; font-size:15px; color:#555; line-height:2; word-break:break-all;}
.nd-body img {max-width:100%; height:auto;}
.nd-body p {margin:0 0 14px;}
.nd-none {padding:40px 0; text-align:center; color:#999; font-size:14px;}

/* ========== 资讯公告列表页 ========== */
.notice-layout {display:flex; align-items:flex-start; gap:24px; padding:6px 0 0;}
.notice-main {flex:1 1 auto; min-width:0; background:#fff; border:1px solid #eee; border-radius:4px; padding:6px 26px 20px;}
.notice-side {flex:0 0 300px; width:300px;}

/* 左侧列表 */
.notice-list {border-top:1px solid #f0f0f0;}
.notice-item {padding:22px 2px 20px; border-bottom:1px solid #f0f0f0;}
.notice-item:first-child {border-top:0;}
.ni-title {display:block; font-size:18px; font-weight:700; color:#222; line-height:1.5;}
.ni-title:hover {color:#2074ff;}
.ni-hash {color:#2074ff; margin-right:6px; font-weight:700;}
.ni-summary {margin:10px 0 0; font-size:14px; line-height:1.9; color:#666; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; word-break:break-all;}
.ni-meta {margin-top:12px; display:flex; align-items:center; gap:16px; font-size:13px; color:#999;}
.ni-tag {display:inline-block; padding:1px 10px; font-size:12px; color:#2074ff; background:#eef4ff; border:1px solid #d7e6ff; border-radius:12px;}
.ni-date i {margin-right:4px;}
.notice-empty {padding:60px 0; text-align:center; color:#999; font-size:14px;}

/* 右侧栏 */
.side-box {background:#fff; border:1px solid #eee; border-radius:4px;}
.side-tabs {display:flex; flex-wrap:wrap; gap:10px; padding:16px;}
.side-tab {flex:0 0 calc(50% - 5px); text-align:center; height:38px; line-height:38px; font-size:14px; color:#555; background:#f5f6f8; border-radius:3px; transition:all .15s;}
.side-tab:hover {color:#2074ff;}
.side-tab.active {background:#2074ff; color:#fff;}
.side-rank {margin-top:18px; padding:16px 18px 20px;}
.side-cap {font-size:16px; font-weight:700; color:#333; padding-bottom:12px; margin-bottom:6px; border-bottom:1px solid #f0f0f0;}
.side-cap i {color:#2074ff; margin-right:6px;}
.rank-list {counter-reset:none; padding:0; margin:0;}
.rank-item {display:flex; align-items:center; gap:10px; padding:10px 0; margin-bottom:0;}
.rank-no {flex:0 0 auto; width:18px; height:18px; line-height:18px; text-align:center; font-size:12px; font-weight:700; color:#fff; background:#b6bec9; border-radius:3px;}
.rank-n1 {background:#f5483b;}
.rank-n2 {background:#3dbd5c;}
.rank-n3 {background:#f5a623;}
.rank-n4 {background:#2f7cff;}
.rank-n5 {background:#8a4bd6;}
.rank-n6 {background:#e84a8b;}
.rank-n7 {background:#5b6472;}
.rank-n8 {background:#c9a24b;}
.rank-n9 {background:#98a1ad;}
.rank-n10 {background:#b6bec9;}
.rank-title {flex:1 1 auto; font-size:14px; color:#444; line-height:1.5; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.rank-title:hover {color:#2074ff;}
.rank-empty {padding:20px 0; text-align:center; color:#999; font-size:13px;}

/* 公告页小屏：右侧栏换行到列表下方 */
@media (max-width:1000px) {
    .notice-layout {flex-direction:column;}
    .notice-side {flex:1 1 auto; width:100%;}
}

/* ========== 容器内边距优化（小屏/手机端内容不贴边，桌面结构保持不变） ========== */
@media (max-width:1268px) {
    .container {width:100%; padding:0 12px;}
}

/* ========== 更新日志：产品更新排行 / 关联商品（独立 .ulg- 前缀，避免与 rank-* 同名冲突） ========== */
.ulg-rank {padding:10px 14px;}
.ulg-item {display:flex; align-items:center; margin-bottom:14px;}
.ulg-item:last-child {margin-bottom:0;}
.ulg-no {flex:none; width:18px; height:18px; line-height:18px; text-align:center; font-size:12px; border-radius:3px; background:#c9c9c9; color:#fff; margin-right:8px;}
.ulg-n1 {background:#f44336;}
.ulg-n2 {background:#ff9800;}
.ulg-n3 {background:#ffc107;}
.ulg-link {display:flex; align-items:center; flex:1; min-width:0;}
.ulg-thumb {flex:none; width:36px; height:36px; border-radius:4px; overflow:hidden; background:#f2f3f5; display:flex; align-items:center; justify-content:center; margin-right:8px;}
.ulg-thumb img {width:100%; height:100%; object-fit:cover;}
.ulg-thumb i {color:#bbb; font-size:16px;}
.ulg-name {font-size:13px; color:#666; line-height:16px; height:16px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; flex:1; min-width:0;}
.ulg-link:hover .ulg-name {color:#08a2eb;}
.ulg-rel-box {overflow:hidden; padding:16px 18px 18px;}
.ulg-goods {display:flex; align-items:center; padding:2px 0 0;}
.ulg-goods:hover .ulg-gname {color:#2074ff;}
.ulg-goods .ulg-thumb {width:64px; height:64px; margin-right:12px; border-radius:6px; border:1px solid #f0f2f5; box-shadow:0 1px 4px rgba(0,0,0,.06);}
.ulg-ginfo {flex:1; min-width:0;}
.ulg-gname {display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; font-size:14px; font-weight:500; color:#333; line-height:20px; height:40px; overflow:hidden;}
.ulg-gprice {display:block; color:#ff4e00; font-size:17px; font-weight:700; margin-top:8px;}
.ulg-gprice em {font-style:normal; font-size:13px; margin-right:1px;}
.ulg-goods-btn {display:block; margin:14px 0 0; height:36px; line-height:36px; text-align:center; font-size:13px; color:#2074ff; background:#f3f8ff; border:1px solid #dcebff; border-radius:4px; transition:all .2s;}
.ulg-goods-btn:hover {color:#fff; background:#2074ff; border-color:#2074ff;}
.ulg-goods-btn i {margin-left:2px;}

/* ========== 会员中心 · 购物车 / 订单（.mc-*） ========== */
.mc-inner {display:flex; align-items:flex-start; gap:16px; padding:20px 0 32px;}
.mc-side {flex:0 0 220px; width:220px; background:#fff; border-radius:6px; box-shadow:0 1px 4px rgba(0,0,0,.06); overflow:hidden;}
.mc-side-user {display:flex; align-items:center; gap:10px; padding:16px 14px; border-bottom:1px solid #f0f0f0;}
.mc-side-user .u-avatar {width:44px; height:44px; border-radius:50%; overflow:hidden; background:#f2f2f2; flex:0 0 auto;}
.mc-side-user .u-avatar img {width:100%; height:100%; object-fit:cover;}
.mc-side-user .u-info {min-width:0;}
.mc-side-user .u-name {display:block; font-size:14px; color:#333; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.mc-side-user .u-money {display:block; font-size:12px; color:#2074ff; margin-top:4px;}
.mc-menu {list-style:none; margin:0; padding:8px 0;}
.mc-menu li a {display:block; padding:10px 18px; font-size:14px; color:#555; text-decoration:none; border-left:3px solid transparent; transition:.15s;}
.mc-menu li a:hover {background:#f6f9ff; color:#2074ff;}
.mc-menu li a.on {background:#f0f6ff; color:#2074ff; border-left-color:#2074ff; font-weight:600;}
.mc-main {flex:1 1 auto; min-width:0;}
.mc-card {background:#fff; border-radius:6px; box-shadow:0 1px 4px rgba(0,0,0,.06); padding:18px 20px 22px;}
.mc-card-head {font-size:16px; font-weight:600; color:#333; padding-bottom:14px; border-bottom:1px solid #f0f0f0; margin-bottom:6px;}
.mc-card-head span {font-weight:400; color:#999; font-size:13px;}

/* 购物车表格 */
.mc-cart {width:100%;}
.mc-cart-head, .mc-cart-row {display:flex; align-items:center;}
.mc-cart-head {background:#fafbfc; border:1px solid #f0f0f0; border-radius:4px; font-size:13px; color:#999; padding:10px 0; margin-top:12px;}
.mc-cart-row {border-bottom:1px solid #f2f2f2; padding:16px 0;}
.mc-cart-row > span {padding:0 8px; font-size:14px; color:#333;}
.mc-cart-head > span {padding:0 8px;}
.c-img   {flex:0 0 92px;  width:92px;}
.c-info  {flex:1 1 auto;  min-width:0;}
.c-price {flex:0 0 110px; width:110px; color:#666;}
.c-qty   {flex:0 0 130px; width:130px;}
.c-sub   {flex:0 0 120px; width:120px; color:#ff6a00; font-weight:600;}
.c-op    {flex:0 0 80px;  width:80px; text-align:center;}
.mc-cart-row .c-img img {width:64px; height:64px; object-fit:cover; border-radius:4px; background:#f2f2f2;}
.mc-name {display:block; color:#333; font-size:14px; line-height:1.5; max-height:42px; overflow:hidden; text-decoration:none;}
.mc-name:hover {color:#2074ff;}
.c-op a {color:#2074ff; text-decoration:none; font-size:13px;}
.c-op a:hover {text-decoration:underline;}

/* 合计 + 结算 */
.mc-foot {display:flex; align-items:center; justify-content:space-between; margin-top:18px; padding-top:16px; border-top:1px solid #f0f0f0;}
.mc-sum {font-size:14px; color:#666;}
.mc-sum b {color:#2074ff;}
.mc-sum em {font-style:normal; color:#ff6a00; font-size:20px; font-weight:700; margin:0 4px;}
.mc-bal {margin-left:16px; color:#999; font-size:13px;}
.mc-pay {display:inline-block; min-width:150px; height:44px; line-height:44px; text-align:center; background:#2074ff; color:#fff; border:none; border-radius:4px; font-size:16px; cursor:pointer;}
.mc-pay:hover {background:#1a63e0;}
.mc-pay:disabled {background:#c9d7ef; cursor:not-allowed;}

/* 空态 */
.mc-empty {text-align:center; color:#999; padding:60px 0; font-size:15px;}
.mc-empty a {color:#2074ff; text-decoration:none;}

/* 订单列表 */
.mc-otable {width:100%; border-collapse:collapse; margin-top:12px;}
.mc-otable th {background:#fafbfc; border:1px solid #f0f0f0; color:#999; font-weight:400; font-size:13px; padding:10px 8px; text-align:center; white-space:nowrap;}
.mc-otable td {border:1px solid #f2f2f2; font-size:13px; color:#333; padding:12px 8px; text-align:center; vertical-align:middle;}
.mc-otable td.o-no {font-family:Consolas,monospace; color:#666; white-space:nowrap;}
.mc-otable td.o-price {color:#ff6a00; font-weight:600;}
.mc-ogood {display:flex; align-items:center; gap:10px; text-align:left;}
.mc-ogood img {width:48px; height:48px; object-fit:cover; border-radius:4px; background:#f2f2f2; flex:0 0 auto;}
.mc-ogood .g-name {color:#333; text-decoration:none; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; max-width:220px;}
.mc-ogood .g-name:hover {color:#2074ff;}
.mc-tag {display:inline-block; padding:2px 10px; border-radius:10px; font-size:12px;}
.mc-tag.paid, .mc-tag.shipped, .mc-tag.served {background:#eaf7ee; color:#3aa76d;}
.mc-tag.unpaid {background:#fff3e6; color:#ff8a3d;}
.mc-tag.refunded {background:#f2f3f5; color:#999;}
.mc-tag.closed {background:#f2f3f5; color:#bbb;}
.mc-tag.servicing {background:#eef4ff; color:#2074ff;}

/* 分页 */
.mc-pager {display:flex; justify-content:center; align-items:center; gap:6px; margin-top:18px;}
.mc-pager a, .mc-pager span {display:inline-block; min-width:34px; height:34px; line-height:34px; text-align:center; border:1px solid #ddd; border-radius:3px; color:#333; font-size:13px; text-decoration:none; padding:0 8px;}
.mc-pager a:hover {border-color:#2074ff; color:#2074ff;}
.mc-pager .cur {background:#2074ff; border-color:#2074ff; color:#fff;}
.mc-pager .dis {color:#ccc; border-color:#eee;}