/* =====================================================================
   走镖网 首页重设计 - 基于 Akamodern 模板视觉语言
   设计令牌：深蓝底 + 珊瑚红主色 + 蓝紫辅助 + Inter 字体 + 胶囊按钮
   ===================================================================== */

/* ---------- 字体 ---------- */
@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap");

:root{
  --bg:#0c0220;
  --bg-2:#14042c;
  --bg-3:#1b0a3e;
  --accent:#ff4755;
  --accent-2:#4f54fa;
  --accent-soft:rgba(255,71,85,.12);
  --text:#ffffff;
  --muted:rgba(255,255,255,.66);
  --border:rgba(255,255,255,.10);
  --card:rgba(255,255,255,.045);
  --card-2:rgba(255,255,255,.07);
  --radius:18px;
  --radius-sm:12px;
  --shadow:0 24px 60px rgba(0,0,0,.40);
  --grad:linear-gradient(135deg,#ff4755 0%,#ff6b81 100%);
  --grad-2:linear-gradient(135deg,#4f54fa 0%,#7b5cff 100%);
  --topbar-h:42px;   /* 顶栏高度，隐藏时各断点同步调整 */
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;scroll-padding-top:90px;}
html,body{min-height:100%;}
body{
  margin:0;padding:0;
  font-family:"Inter","PingFang SC","Microsoft YaHei",sans-serif;
  background:var(--bg);
  color:var(--text);
  overflow-x:hidden;
  /* 内容不足一屏时，页脚仍贴底且不落入固定联系条覆盖区 */
  display:flex;flex-direction:column;
}
body>footer{margin-top:auto;}
h1,h2,h3,h4,h5,h6{font-family:"Inter","PingFang SC","Microsoft YaHei",sans-serif;margin:0;font-weight:700;line-height:1.2;}
p{margin:0;line-height:1.7;}
a{text-decoration:none;color:inherit;transition:.3s;}
a:hover{color:var(--accent);}
ul{list-style:none;margin:0;padding:0;}
img{max-width:100%;display:block;}
.text-base{color:var(--accent);}
.muted{color:var(--muted);}

/* ---------- 通用区块 ---------- */
.section-padding{padding:0 0 96px 0;}
/* 转让市场专用：page-hero 和筛选区之间加一道呼吸感 */
.tm-market{padding-top:32px;}
.section-header{margin-bottom:54px;}
.section-header.center{text-align:center;max-width:720px;margin-left:auto;margin-right:auto;}
.section-header .sub{
  display:inline-block;color:var(--accent);font-weight:600;letter-spacing:1px;
  text-transform:uppercase;font-size:14px;margin-bottom:14px;
}
.section-header h2{font-size:40px;line-height:1.25;margin-bottom:16px;}
.section-header p{color:var(--muted);font-size:16px;}

/* ---------- 胶囊按钮 (cmn-btn) ---------- */
.cmn-btn,button.cmn-btn,input[type="submit"].cmn-btn{
  appearance:none;-webkit-appearance:none;
  position:relative;display:inline-flex;align-items:center;justify-content:center;
  gap:8px;padding:14px 30px;border-radius:50px;font-weight:600;font-size:15px;
  font-family:inherit;line-height:1;
  color:#fff!important;background:var(--accent)!important;
  border:none!important;border-color:transparent!important;
  outline:none;overflow:hidden;z-index:1;cursor:pointer;
  box-shadow:0 10px 26px rgba(255,71,85,.45);transition:.25s;
  -webkit-tap-highlight-color:transparent;
}
.cmn-btn span{position:relative;z-index:2;}
.cmn-btn::before,.cmn-btn::after{
  content:"";position:absolute;width:100%;height:100%;top:0;left:-100%;
  background:rgba(255,255,255,.12);transition:left .35s ease;z-index:0;
}
.cmn-btn::after{left:100%;}
.cmn-btn:hover::before{left:0;}
.cmn-btn:hover::after{left:0;}
.cmn-btn:hover,button.cmn-btn:hover{color:#fff!important;background:var(--accent)!important;box-shadow:0 14px 34px rgba(255,71,85,.55);transform:translateY(-2px);}
.cmn-btn:active,button.cmn-btn:active{transform:translateY(0);box-shadow:0 6px 18px rgba(255,71,85,.4);}
.cmn-btn:focus,button.cmn-btn:focus{outline:none;box-shadow:0 0 0 3px rgba(255,71,85,.35),0 10px 26px rgba(255,71,85,.45);}
.cmn-btn:disabled,button.cmn-btn:disabled{opacity:.55;cursor:not-allowed;transform:none!important;box-shadow:none!important;background:var(--accent)!important;}

.cmn-btn.outline,button.cmn-btn.outline{
  background:transparent!important;border:1.5px solid rgba(255,255,255,.25)!important;box-shadow:none;color:#fff!important;
}
.cmn-btn.outline::before,.cmn-btn.outline::after{background:var(--accent);}
.cmn-btn.outline:hover,button.cmn-btn.outline:hover{border-color:transparent!important;color:#fff!important;}

/* =====================================================================
   顶栏信息条
   ===================================================================== */
.top-bar{
  background:rgba(0,0,0,.25);border-bottom:1px solid var(--border);
  font-size:13px;color:var(--muted);
}
.top-bar .container{display:flex;align-items:center;justify-content:space-between;height:var(--topbar-h);}
.top-bar a{color:var(--muted);margin-left:18px;font-size:13px;}
.top-bar a:hover{color:var(--accent);}

/* =====================================================================
   头部 / 导航
   ===================================================================== */
.header-section{
  position:absolute;top:var(--topbar-h);left:0;width:100%;z-index:99;transition:.4s;
  background:rgba(12,2,32,.0);
}
.header-wrapper{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 0;
}
.logo{white-space:nowrap;display:flex;align-items:center;gap:10px;font-weight:800;font-size:24px;color:#fff;}
.logo .mark{
  width:40px;height:40px;border-radius:12px;background:var(--grad);
  display:flex;align-items:center;justify-content:center;font-size:22px;color:#fff;
  box-shadow:0 8px 20px rgba(255,71,85,.4);
}
.logo:hover{color:#fff;}

.main-menu{display:flex;align-items:center;gap:6px;}
.main-menu>li{position:relative;}
.main-menu>li>a{
  display:flex;align-items:center;gap:6px;padding:10px 16px;border-radius:10px;
  font-weight:500;font-size:15px;color:var(--muted);
}
.main-menu>li>a:hover,.main-menu>li.active>a{color:#fff;}
.main-menu>li.active>a{background:var(--accent-soft);color:#fff;}
.main-menu .hot{
  width:8px;height:8px;border-radius:50%;background:var(--accent);
  box-shadow:0 0 0 4px rgba(255,71,85,.25);display:inline-block;margin-left:3px;
}
.main-menu .sub-menu{
  position:absolute;top:100%;left:0;min-width:180px;background:var(--bg-3);
  border:1px solid var(--border);border-radius:14px;padding:10px;opacity:0;visibility:hidden;
  transform:translateY(12px);transition:.3s;box-shadow:var(--shadow);z-index:50;
}
.main-menu>li:hover>.sub-menu{opacity:1;visibility:visible;transform:translateY(6px);}
.main-menu .sub-menu li a{padding:9px 14px;border-radius:8px;color:var(--muted);display:block;font-size:14px;}
.main-menu .sub-menu li a:hover{background:var(--accent-soft);color:#fff;}

.contact-btn{display:flex;align-items:center;gap:12px;}
.contact-btn .login{color:var(--muted);font-weight:500;font-size:15px;}
.contact-btn .login:hover{color:#fff;}
/* 抽屉菜单内的登录/注册：桌面端隐藏（此时由 .contact-btn 和顶部 .top-bar 承担），
   手机端顶栏与 .contact-btn 都被隐藏，这两个是唯一的账号入口，必须显示。 */
.main-menu .menu-auth{display:none;}

/* 商标转让 巨型下拉菜单 */
.mega-menu{
  position:absolute;top:100%;left:0;width:760px;background:var(--bg-3);
  border:1px solid var(--border);border-radius:16px;padding:22px;
  opacity:0;visibility:hidden;transform:translateY(12px);transition:.3s;
  box-shadow:var(--shadow);z-index:60;
}
.main-menu>li.has-mega:hover>.mega-menu{opacity:1;visibility:visible;transform:translateY(6px);}
.mega-menu .mega-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px 14px;}
.mega-menu .mega-grid a{
  padding:9px 12px;border-radius:9px;color:var(--muted);font-size:13.5px;
  display:flex;justify-content:space-between;align-items:center;gap:8px;
}
.mega-menu .mega-grid a:hover{background:var(--accent-soft);color:#fff;}
.mega-menu .mega-grid a b{color:var(--accent);font-weight:600;font-size:12px;}

/* 汉堡菜单（移动端） */
.header-bar{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:8px;}
.header-bar span{width:26px;height:2px;background:#fff;border-radius:2px;transition:.3s;}
.header-bar.active span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.header-bar.active span:nth-child(2){opacity:0;}
.header-bar.active span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

/* 抽屉遮罩（仅平板及以下生效，点击关闭） */
#navMask{display:none;}

/* 外链图片兜底占位 */
.img-fallback{background:var(--bg-3) url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40'%3E%3Crect width='40' height='40' rx='8' fill='%231b0a3e'/%3E%3C/svg%3E") center/contain no-repeat;object-fit:contain;}

/* 滚动吸顶 */
.header-section.menu-fixed{
  position:fixed;top:0;background:rgba(12,2,32,.92);backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);animation:fadeInDown .5s;
}
@keyframes fadeInDown{from{opacity:0;transform:translateY(-20px);}to{opacity:1;transform:translateY(0);}}

/* =====================================================================
   搜索 Hero
   ===================================================================== */
.banner-section{
  position:relative;padding:170px 0 90px;overflow:hidden;
  background:
    radial-gradient(1000px 600px at 85% 0%,rgba(79,84,250,.20),transparent 60%),
    radial-gradient(900px 600px at 0% 100%,rgba(255,71,85,.16),transparent 55%),
    var(--bg);
}
.banner-shape{position:absolute;right:-40px;top:-40px;width:520px;opacity:.5;pointer-events:none;}
.banner-content h1{font-size:54px;line-height:1.12;margin-bottom:18px;}
.banner-content h1 .hl{color:var(--accent);}
.banner-content>p{color:var(--muted);font-size:17px;margin-bottom:30px;max-width:520px;}

/* 搜索框 */
.search-box{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  padding:14px;backdrop-filter:blur(10px);box-shadow:var(--shadow);
}
.search-tabs{display:flex;gap:8px;margin-bottom:14px;}
.search-tabs li{
  padding:8px 18px;border-radius:50px;font-size:14px;font-weight:600;cursor:pointer;
  color:var(--muted);background:rgba(255,255,255,.05);transition:.3s;
}
.search-tabs li.cur{background:var(--grad);color:#fff;box-shadow:0 8px 18px rgba(255,71,85,.35);}
/* 首页「热门类别」切换条：居中排布并给足下方间距。
   .search-tabs 的胶囊样式只对 li 生效，首页这里原本直接写 a，
   一条都没吃到样式，显示为一排普通文字；现已改为 li 包裹。 */
.hot-tabs{justify-content:center;flex-wrap:wrap;gap:10px;margin-bottom:28px;}
.hot-tabs li{display:inline-flex;align-items:center;gap:6px;}
/* .cur 是珊瑚红渐变底，内部的 .text-base（珊瑚红）在红底上看不清，激活项内类号转白 */
.hot-tabs li.cur .text-base{color:#fff;opacity:.92;}
.hot-tabs li a{display:inline-flex;align-items:center;gap:6px;color:inherit;white-space:nowrap;}
.hot-tabs li a:hover{color:var(--accent);}
.hot-tabs li.cur a:hover{color:#fff;}
.hot-tabs li:last-child{background:transparent;color:var(--muted);padding-left:0;padding-right:0;}
.hot-tabs li:last-child a:hover{color:var(--accent);}
.search-row{display:flex;gap:10px;}
.search-row input{
  flex:1;height:54px;border-radius:12px;border:1px solid var(--border);
  background:rgba(0,0,0,.25);color:#fff;padding:0 18px;font-size:15px;outline:none;
}
.search-row input::placeholder{color:rgba(255,255,255,.45);}
.search-row input:focus{border-color:var(--accent);}
.search-row .search-btn{
  width:120px;border:none;border-radius:12px;background:var(--grad);color:#fff;
  font-weight:600;font-size:15px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:6px;
  box-shadow:0 8px 20px rgba(255,71,85,.35);transition:.3s;
}
.search-row .search-btn:hover{transform:translateY(-2px);}
.search-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px;}
.search-tags a{font-size:12.5px;color:var(--muted);background:rgba(255,255,255,.05);padding:5px 12px;border-radius:50px;}
.search-tags a:hover{color:#fff;background:var(--accent-soft);}

.banner-thumb{position:relative;}
/* 轮播高度跟随左列：两列都用 stretch，轮播容器再按左列实际高度填充。
   此前 item 固定 380px，而左列（标题+搜索框+4 个快捷入口）实测 588px，
   桌面端轮播比左边矮一大截，两边底部对不齐。 */
.banner-thumb .hero-carousel{border-radius:24px;overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--border);}
.banner-thumb .hero-carousel .item{height:var(--hero-item-h,380px);background-size:cover;background-position:center;}
.banner-thumb .owl-dots{text-align:center;margin-top:18px;}
/* ≥992px 两列等高：左列内容自然撑高，右列拉伸跟齐。
   注意不能用 .row{align-items:stretch}——Bootstrap 的 .align-items-center
   是类选择器、优先级相同但加载更晚，会把它盖掉；改用 align-self 直接作用在列上。 */
@media (min-width:992px){
  .banner-section .col-lg-5{align-self:stretch;display:flex;flex-direction:column;}
  .banner-thumb{flex:1 1 auto;display:flex;flex-direction:column;min-height:0;}
  .banner-thumb .hero-carousel{flex:1 1 auto;display:flex;flex-direction:column;min-height:0;}
  .banner-thumb .hero-carousel .owl-stage{flex:1 1 auto;display:flex;align-items:stretch;}
  .banner-thumb .hero-carousel .owl-stage .owl-item{display:flex;}
  .banner-thumb .hero-carousel .item{flex:1 1 auto;height:auto;min-height:380px;}
}
.banner-thumb .owl-dots .owl-dot span{width:10px;height:10px;background:rgba(255,255,255,.25);border-radius:50px;margin:0 5px;}
.banner-thumb .owl-dots .owl-dot.active span{width:26px;background:var(--accent);}

/* 快捷入口 */
.quick-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:46px;}
.quick-card{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  padding:24px;display:flex;align-items:center;gap:16px;transition:.35s;cursor:pointer;
  /* grid项默认 min-width:auto，窄栏下内容区被压到 0，导致 h5 逐字折行
   （截图里「商标求购」竖排、「商标设计」被拆开）。min-width:0 允许收缩，
   配合 h5/p 的 nowrap 保证标题与副标题各自不断行；
   同时收紧 padding 与图标尺寸，让「商标求购」四字在 col-lg-7 内能完整放下。 */
  min-width:0;
  padding:18px 14px;gap:12px;
}
.quick-card>div{min-width:0;}
.quick-card:hover{transform:translateY(-4px);border-color:rgba(255,71,85,.4);background:var(--card-2);}
.quick-card .ic{
  width:46px;height:46px;border-radius:14px;background:var(--accent-soft);
  display:flex;align-items:center;justify-content:center;color:var(--accent);font-size:20px;flex:none;
}
.quick-card h5{font-size:15px;margin-bottom:3px;white-space:nowrap;}
.quick-card p{font-size:12px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}

/* =====================================================================
   数据看板（数字滚动）
   ===================================================================== */
.stats-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:20px;}
.counter-item{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  padding:30px 22px;text-align:center;position:relative;overflow:hidden;
}
.counter-item::after{
  content:"";position:absolute;right:-30px;top:-30px;width:90px;height:90px;border-radius:50%;
  background:var(--accent-soft);filter:blur(8px);
}
.counter-item .num{font-size:42px;font-weight:800;color:#fff;display:flex;align-items:baseline;justify-content:center;gap:4px;}
.counter-item .num .odometer{color:var(--accent);}
.counter-item .unit{font-size:18px;color:var(--accent);font-weight:700;}
.counter-item .label{margin-top:8px;color:var(--muted);font-size:14px;}

/* =====================================================================
   一口价 45 类网格
   ===================================================================== */
.cat-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;}
.cat-card{
  background:#fff;border-radius:14px;padding:16px 14px;display:flex;align-items:center;
  justify-content:space-between;gap:8px;transition:.3s;color:#1b1b1b;border:1px solid #eee;
  min-height:52px;
}
.cat-card:hover{transform:translateY(-3px);box-shadow:0 14px 30px rgba(0,0,0,.18);}
.cat-card .name{font-size:13.5px;font-weight:600;line-height:1.3;color:#222;}
.cat-card .count{
  flex:none;font-size:12px;font-weight:700;color:#fff;background:var(--accent);
  border-radius:50px;padding:3px 10px;min-width:46px;text-align:center;
}

/* =====================================================================
   为什么选择我们（特色）
   ===================================================================== */
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;}
.feature-item{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  padding:32px 28px;transition:.35s;position:relative;overflow:hidden;
}
.feature-item:hover{transform:translateY(-5px);background:var(--card-2);border-color:rgba(255,71,85,.4);}
.feature-item .fic{
  width:60px;height:60px;border-radius:16px;background:var(--accent-soft);color:var(--accent);
  display:flex;align-items:center;justify-content:center;font-size:26px;margin-bottom:18px;
}
.feature-item h4{font-size:20px;margin-bottom:10px;}
.feature-item p{color:var(--muted);font-size:14.5px;}

/* =====================================================================
   注册入口（pricing）
   ===================================================================== */
.pricing-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px;max-width:820px;margin:0 auto;}
.pricing-items{
  background:var(--card);border:1px solid var(--border);border-radius:22px;padding:38px 34px;
  text-align:center;position:relative;transition:.35s;
}
.pricing-items:hover{transform:translateY(-5px);border-color:rgba(79,84,250,.5);}
.pricing-items.featured{border-color:rgba(255,71,85,.55);background:linear-gradient(180deg,rgba(255,71,85,.10),var(--card));}
.pricing-items .badge{
  position:absolute;top:18px;right:18px;background:var(--grad);color:#fff;font-size:12px;
  font-weight:600;padding:5px 12px;border-radius:50px;
}
.pricing-items .pic{font-size:40px;color:var(--accent);margin-bottom:14px;}
.pricing-items h3{font-size:24px;margin-bottom:6px;}
.pricing-items .desc{color:var(--muted);font-size:14px;margin-bottom:18px;}
.pricing-items .price{font-size:40px;font-weight:800;color:#fff;margin-bottom:22px;}
.pricing-items .price span{font-size:16px;color:var(--muted);font-weight:500;}

/* 精品商标网格（与后端 GetTM.ashx 返回结构一致） */
/* 商标卡片 */
.brand-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px;margin-top:6px;}
.brand-grid li{list-style:none;}
.brand-grid li a{
  position:relative;display:flex;flex-direction:column;
  background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.025));
  border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;
  transition:.4s ease;box-shadow:0 10px 30px rgba(0,0,0,.25);
}
.brand-grid li a::before{
  content:"";position:absolute;inset:0;border-radius:var(--radius);padding:1px;pointer-events:none;
  background:linear-gradient(135deg,rgba(255,71,85,.55),rgba(79,84,250,.55));
  -webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:.4s;
}
.brand-grid li a:hover{transform:translateY(-6px);box-shadow:0 24px 54px rgba(255,71,85,.22);}
.brand-grid li a:hover::before{opacity:1;}
.bi-img{height:178px;display:flex;align-items:center;justify-content:center;padding:18px;
  background:radial-gradient(130px 130px at 50% 38%,rgba(79,84,250,.16),transparent 70%),#100428;}
/* 必须显式给背景色：<img> 在未加载/未完全解码时，Edge 会给它一层默认背景
   （实测backgroundColor 为随机的 rgb(194,187,175)/rgb(181,202,155) 等浅色），
   在深色卡片上表现为图片左右两条彩色竖条，且每张卡颜色都不同。
   对比实验确认：给 img 加上 #100428 后竖条立即消失。
   同时 width/height:100% + contain 让方形 SVG 在 178px 高的容器里正确缩放。 */
.bi-img img{width:100%;height:100%;object-fit:contain;background:#100428;}
/* 占位图：改用纯 CSS 绘制，不再用 SVG <img>。
   原因：Edge 对 SVG 占位图会绘制一层内部背景（getComputedStyle 读到的
   backgroundColor 是不可控的随机色 rgb(189,211,186)/rgb(166,174,180)…，
   每张卡片都不一样），在深色卡片上表现为图片左右两条彩色竖条，
   且该层无法用 CSS background 覆盖（已实测：规则命中但计算值不变）。
   纯 CSS 方案零图片请求，也不会触发浏览器的 SVG 渲染怪癖。 */
.bi-ph{
  flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;
  color:var(--accent-2);
}
.bi-ph .ph-box{
  width:78px;height:78px;border:2px dashed rgba(79,84,250,.45);border-radius:16px;
  display:flex;align-items:center;justify-content:center;position:relative;
}
.bi-ph .ph-box::before{
  content:"";width:44px;height:34px;border:2px solid rgba(79,84,250,.6);border-radius:4px;
}
.bi-ph .ph-box::after{
  content:"";position:absolute;width:8px;height:8px;border-radius:50%;
  border:2px solid rgba(79,84,250,.6);top:12px;left:14px;
}
/* 小尺寸变体：新闻缩略图等窄容器用，隐藏尺寸文字、缩小图标 */
.bi-ph-sm{gap:0;}
.bi-ph-sm .ph-txt{display:none;}
.bi-ph-sm .ph-box{width:46px;height:46px;border-radius:11px;}
.bi-ph-sm .ph-box::before{width:26px;height:20px;}
.bi-ph-sm .ph-box::after{width:6px;height:6px;top:7px;left:8px;}
.bi-ph .ph-txt{font-size:12px;color:var(--muted);opacity:.62;font-family:ui-monospace,Consolas,Menlo,monospace;}
.bi-body{padding:16px 16px 18px;display:flex;flex-direction:column;gap:8px;border-top:1px solid var(--border);}
.bi-top{display:flex;align-items:center;gap:8px;min-width:0;}
.bi-class{flex:none;background:var(--accent-soft);color:var(--accent);font-size:11px;font-weight:700;padding:3px 9px;border-radius:50px;}
.bi-name{font-size:15px;font-weight:700;color:#fff;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.bi-desc{font-size:12.5px;color:var(--muted);line-height:1.5;height:34px;overflow:hidden;}
.bi-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:2px;}
.bi-price{font-size:21px;font-weight:800;color:#fff;letter-spacing:.3px;}
.bi-cert{flex:none;display:inline-flex;align-items:center;gap:4px;font-size:11px;font-weight:600;color:#3ddc97;background:rgba(61,220,151,.12);padding:3px 9px;border-radius:50px;}
.bi-hover{position:absolute;inset:0;color:#fff;font-size:14px;font-weight:600;
  display:flex;align-items:flex-end;justify-content:center;padding-bottom:22px;opacity:0;transition:.35s ease;
  background:linear-gradient(180deg,rgba(12,2,32,0),rgba(12,2,32,.86));}
.brand-grid li a:hover .bi-hover{opacity:1;}

/* 公告条 */
.notice-bar{
  background:var(--card);border:1px solid var(--border);border-radius:14px;
  padding:14px 18px;display:flex;align-items:center;gap:14px;margin-top:0;
}
.notice-bar .ntag{
  flex:none;background:var(--grad);color:#fff;font-weight:600;font-size:13px;
  padding:6px 14px;border-radius:50px;
}
.notice-bar .nlist{flex:1;overflow:hidden;height:24px;position:relative;}
.notice-bar .nlist ul{position:absolute;width:100%;}
.notice-bar .nlist li{height:24px;line-height:24px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.notice-bar .nlist li a{color:var(--text);font-size:14px;}
.notice-bar .nlist li a:hover{color:var(--accent);}

/* =====================================================================
   买卖指南 / CTA
   ===================================================================== */
.guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-bottom:40px;}
.guide-item{
  background:var(--card);border:1px solid var(--border);border-radius:var(--radius);
  padding:30px;display:flex;align-items:center;gap:18px;transition:.35s;
}
.guide-item:hover{transform:translateY(-4px);background:var(--card-2);}
.guide-item .gic{width:56px;height:56px;border-radius:14px;background:var(--accent-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:24px;flex:none;}
.guide-item h5{font-size:17px;margin-bottom:4px;}

.cta-wrap{
  background:linear-gradient(120deg,rgba(79,84,250,.22),rgba(255,71,85,.20)),var(--bg-3);
  border:1px solid var(--border);border-radius:24px;padding:46px 44px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;
}
.cta-wrap h3{font-size:28px;margin-bottom:8px;}
.cta-wrap p{color:var(--muted);}

/* =====================================================================
   新闻资讯
   ===================================================================== */
.news-grid{display:grid;grid-template-columns:1fr 1fr;gap:34px;}
.news-col h4.title{font-size:20px;margin-bottom:18px;display:flex;align-items:center;justify-content:space-between;}
.news-col h4.title a{font-size:13px;color:var(--accent);font-weight:600;display:inline-flex;align-items:center;min-height:32px;padding:0 2px;}
.news-list li{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:13px 0;border-bottom:1px solid var(--border);
}
.news-list li a{color:var(--text);font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1;}
.news-list li a:hover{color:var(--accent);}
.news-list li .date{color:var(--muted);font-size:13px;flex:none;}

.news-cards{display:grid;grid-template-columns:1fr 1fr;gap:18px;}
.news-card{
  background:#fff;border-radius:14px;overflow:hidden;transition:.3s;border:1px solid #eee;
}
.news-card:hover{transform:translateY(-4px);box-shadow:0 16px 34px rgba(0,0,0,.18);}
.news-card img{width:100%;height:120px;object-fit:cover;}
.news-card .c-body{padding:14px 16px;}
.news-card .c-body p{font-size:14.5px;font-weight:600;color:#222;line-height:1.4;margin-bottom:8px;}
.news-card .c-body .tip{font-size:12.5px;color:#888;line-height:1.5;height:54px;overflow:hidden;}
.news-card .c-body .d{font-size:12px;color:#bbb;text-align:right;}

/* =====================================================================
   页脚
   ===================================================================== */
.footer-section{background:var(--bg-2);border-top:1px solid var(--border);padding-top:70px;}
.footer-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.4fr;gap:34px;padding-bottom:50px;}
.footer-top .f-logo{font-size:22px;font-weight:800;margin-bottom:16px;display:flex;align-items:center;gap:10px;}
.footer-top .f-logo .mark{width:36px;height:36px;border-radius:10px;background:var(--grad);display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;}
.footer-top p{color:var(--muted);font-size:14px;margin-bottom:18px;}
.footer-top .social{display:flex;gap:10px;}
.footer-top .social a{width:36px;height:36px;border:1px solid var(--border);border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;transition:.3s;}
.footer-top .social a:hover{background:var(--accent);border-color:transparent;}
.footer-top h5{font-size:17px;margin-bottom:18px;}
.footer-top .quick-link li{margin-bottom:11px;}
.footer-top .quick-link li a{color:var(--muted);font-size:14px;}
.footer-top .quick-link li a:hover{color:var(--accent);}
.footer-top .f-contact li{color:var(--muted);font-size:14px;margin-bottom:10px;}
.footer-top .f-contact li b{color:#fff;font-weight:600;}
.mail-wrapper{display:flex;gap:10px;margin-top:8px;}
.mail-wrapper input{flex:1;height:48px;border-radius:12px;border:1px solid var(--border);background:rgba(0,0,0,.25);color:#fff;padding:0 16px;outline:none;}
.mail-wrapper input::placeholder{color:rgba(255,255,255,.4);}
.mail-wrapper button{border:none;border-radius:12px;background:var(--grad);color:#fff;padding:0 22px;font-weight:600;cursor:pointer;}
.footer-bottom{
  border-top:1px solid var(--border);padding:22px 0;text-align:center;
  color:var(--muted);font-size:13.5px;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;
}
.footer-bottom .links a{color:var(--muted);margin-left:18px;font-size:13px;}
.footer-bottom .links a:hover{color:var(--accent);}
.friend-links{padding:14px 0 30px;color:var(--muted);font-size:13.5px;}
.friend-links a{color:var(--muted);margin-left:10px;}
.friend-links a:hover{color:var(--accent);}

/* =====================================================================
   固定侧边栏
   ===================================================================== */
.sideBar{position:fixed;right:14px;top:50%;transform:translateY(-50%);z-index:80;display:flex;flex-direction:column;gap:10px;}
.sideBar li{list-style:none;}
.sideBar a{
  width:46px;height:46px;border-radius:14px;background:var(--bg-3);border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px;position:relative;transition:.3s;
}
.sideBar a:hover{background:var(--grad);border-color:transparent;color:#fff;}
.sideBar .side-title{
  position:absolute;right:56px;top:50%;transform:translateY(-50%);white-space:nowrap;
  background:var(--bg-3);border:1px solid var(--border);padding:6px 12px;border-radius:10px;
  font-size:13px;opacity:0;visibility:hidden;transition:.3s;
}
.sideBar li:hover .side-title{opacity:1;visibility:visible;}
.sideBar .to-top{display:none;}
.sideBar .to-top.show{display:flex;}

/* =====================================================================
   底部咨询条
   ===================================================================== */
.contact-expand{
  position:fixed;left:0;bottom:0;width:100%;z-index:95;
  background:linear-gradient(90deg,#ff4755,#ff6b81);color:#fff;
}
.contact-expand .expand-container{max-width:1140px;margin:0 auto;height:64px;display:flex;align-items:center;justify-content:center;gap:16px;position:relative;padding:0 56px;}
.contact-expand .et-tip{font-weight:600;font-size:15px;white-space:nowrap;}
/* 输入框 + 提交按钮：始终同一行的原子组 */
.contact-expand .expand-form{display:flex;align-items:center;gap:10px;flex:0 1 376px;min-width:0;max-width:376px;}
.contact-expand input{flex:1 1 auto;min-width:0;width:100%;max-width:none;height:40px;border:none;border-radius:50px;padding:0 18px;outline:none;font-size:14px;}
.contact-expand .help-submit{
  flex:0 0 auto;height:40px;border:none;border-radius:50px;background:#0c0220;color:#fff;font-weight:600;
  padding:0 22px;cursor:pointer;font-size:14px;white-space:nowrap;transition:.3s;
}
.contact-expand .help-submit:hover{background:#1b0a3e;}
.contact-expand .expand-qq{
  flex:none;display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 18px;border-radius:50px;
  background:#0c0220;color:#fff;font-size:14px;font-weight:600;transition:.3s;
}
.contact-expand .expand-qq i{font-size:17px;}
.contact-expand .expand-qq:hover{background:#1b0a3e;color:#fff;transform:translateY(-2px);box-shadow:0 8px 20px rgba(0,0,0,.3);}
.contact-expand .expand-close{position:absolute;right:14px;top:50%;transform:translateY(-50%);cursor:pointer;font-size:20px;opacity:.85;}
.contact-expand .expand-close:hover{opacity:1;}
/* 页脚底部为固定联系条预留空间（body.expand-closed 由 main.js 在关闭时添加） */
.footer-section{padding-bottom:96px;}
body.expand-closed .footer-section{padding-bottom:0;}

/* =====================================================================
   弹窗（Bootstrap Modal 外观定制）
   ===================================================================== */
.modal-content{
  background:var(--bg-3);border:1px solid var(--border);border-radius:18px;color:#fff;
}
.modal-header{border-bottom:1px solid var(--border);}
.modal-title{font-weight:700;color:#fff;}
.modal .btn-close{filter:invert(1);}
.zb-form textarea,.zb-form input{
  width:100%;border-radius:12px;border:1px solid var(--border);background:rgba(0,0,0,.3);
  color:#fff;padding:12px 14px;outline:none;font-size:14px;resize:none;
}
.zb-form textarea:focus,.zb-form input:focus{border-color:var(--accent);}
.zb-form .err{color:#ff8a93;font-size:12px;min-height:14px;display:block;margin-top:4px;}
.zb-form dl{margin-bottom:16px;}
.zb-form dt{font-size:13px;color:var(--muted);margin-bottom:6px;}
.zb-form dd{margin:0;}
.zb-form .zb-text{height:96px;}

/* --- 打开弹窗时消除滚动条引起的页面闪动 -------------------------------
   现象：点「免费求购」等按钮后滚动条消失、整页横向闪一下。
   根因：Bootstrap Modal 只给 body 写内联 `overflow:hidden; padding-right:15px`
        （它假设滚动容器是 body），而本站实际滚动容器是 html：
        · ≥1200px：html 的滚动条真消失，clientWidth 增 15，body 补的 15 恰好抵消 → 看似正常
        · ≤1199px：1267 行的 html,body{overflow-x:clip} 让 html 滚动条保留占位，
                   clientWidth 不变，body 却凭空多减 15px → 内容重排 → 闪动
   对策：html 用 scrollbar-gutter:stable 永久预留滚动条槽位，滚动容器尺寸恒定；
        既然 html 尺寸本就不变，body 那 15px 补偿就是多余的，强制归零。
   两侧都稳定，等于零宽度变化。 */
html{scrollbar-gutter:stable;}
body.modal-open{padding-right:0 !important;}
/*   顺带修一个 Bootstrap 自带的缺陷：它只锁 body，而真正滚动的是 html，
      手机端（内容高过弹窗）背景仍会跟着滚轮走。锁定目标补到 html 上。
      html 有 scrollbar-gutter:stable 占位，锁滚动不会引起宽度变化。 */
html:has(body.modal-open){overflow-y:hidden;}
/* :has() 不支持时的兜底（由 main.js 打 class.modal-locked） */
html.modal-locked{overflow-y:hidden;}
.cmn-btn.w-100{width:100%;}

/* =====================================================================
   预加载 & 滚动进度
   ===================================================================== */
#preloader{position:fixed;inset:0;background:var(--bg);z-index:9999;display:flex;align-items:center;justify-content:center;}
#preloader #loader{width:54px;height:54px;border:4px solid rgba(255,255,255,.15);border-top-color:var(--accent);border-radius:50%;animation:spin 1s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}

#progress{
  position:fixed;right:22px;bottom:90px;width:46px;height:46px;border-radius:50%;
  background:var(--grad);display:none;place-items:center;z-index:90;cursor:pointer;
  box-shadow:0 10px 24px rgba(255,71,85,.4);
}
#progress img{width:20px;}

/* =====================================================================
   二级页面通用：面包屑 / 页头
   ===================================================================== */
.page-hero{
  position:relative;padding:150px 0 50px;overflow:hidden;
  background:radial-gradient(800px 400px at 80% 0%,rgba(79,84,250,.18),transparent 60%),var(--bg);
}
.page-hero h1{font-size:42px;margin-bottom:10px;}
/* 文章详情等正文自带 h1 的页面：视觉等价于 h1，但不重复 h1 语义 */
.page-hero .page-hero-t{font-size:42px;font-weight:700;line-height:1.2;margin-bottom:10px;color:var(--text);}
.page-hero p{color:var(--muted);font-size:16px;}
.breadcrumb-nav{margin-top:14px;color:var(--muted);font-size:14px;}
.breadcrumb-nav a{color:var(--muted);}
.breadcrumb-nav a:hover{color:var(--accent);}
.breadcrumb-nav span{margin:0 8px;opacity:.5;}

/* 商标详情 */
.detail-wrap{display:grid;grid-template-columns:340px minmax(0,1fr) 300px;gap:34px;align-items:start;}
.detail-gallery .main-img{
  position:relative;background:linear-gradient(160deg,rgba(255,255,255,.10),rgba(255,255,255,.04));
  border:1px solid var(--border);border-radius:var(--radius);height:360px;
  display:flex;align-items:center;justify-content:center;padding:30px;margin-bottom:14px;overflow:hidden;
}
.detail-gallery .main-img::after{content:"";position:absolute;inset:0;background:radial-gradient(220px 220px at 50% 42%,rgba(79,84,250,.14),transparent 70%);pointer-events:none;}
.detail-gallery .main-img img{position:relative;max-height:100%;max-width:100%;width:auto;object-fit:contain;background:#100428;filter:drop-shadow(0 12px 30px rgba(0,0,0,.4));}
.detail-gallery .img-cap{position:absolute;top:14px;left:16px;font-size:12px;color:var(--muted);letter-spacing:2px;z-index:1;}
.detail-gallery .thumbs{display:flex;gap:12px;}
/* 缩略图改用 button + CSS 占位块（同 .bi-ph 原因：SVG <img> 会带随机内部背景）。
   button 而非 div，保证键盘可达与焦点样式。 */
.detail-gallery .thumbs .th{
  width:74px;height:74px;flex:none;display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.06);border:1px solid var(--border);border-radius:12px;
  padding:8px;cursor:pointer;transition:.25s;
}
.detail-gallery .thumbs .th:hover{border-color:rgba(255,71,85,.45);}
.detail-gallery .thumbs .th.active{border-color:var(--accent);}
.detail-gallery .thumbs .th .ph-box{width:40px;height:40px;border-radius:10px;}
.detail-gallery .thumbs .th .ph-box::before{width:22px;height:17px;}
.detail-gallery .thumbs .th .ph-box::after{width:5px;height:5px;top:6px;left:7px;}
.detail-gallery .thumbs .th:focus-visible{outline:2px solid var(--accent-2);outline-offset:2px;}
.detail-info h1,.detail-info h2{font-size:30px;margin-bottom:6px;}
.detail-info .status{display:inline-block;background:var(--accent-soft);color:var(--accent);font-size:13px;font-weight:600;padding:4px 12px;border-radius:50px;margin-bottom:18px;}
.detail-info .price-row{font-size:34px;font-weight:800;color:#fff;margin-bottom:20px;}
.detail-info .price-row small{font-size:15px;color:var(--muted);font-weight:500;}
.detail-table{width:100%;border-collapse:collapse;margin-bottom:24px;}
.detail-table td{padding:12px 0;border-bottom:1px solid var(--border);font-size:14.5px;}
.detail-table td:first-child{color:var(--muted);width:120px;}
.detail-actions{display:flex;gap:14px;flex-wrap:wrap;margin-bottom:30px;}
.flow-steps{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:20px;}
.flow-steps .step{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:20px;text-align:center;}
.flow-steps .step .num{width:40px;height:40px;border-radius:50%;background:var(--grad);color:#fff;display:flex;align-items:center;justify-content:center;margin:0 auto 12px;font-weight:700;}
.flow-steps .step h5{font-size:15px;margin-bottom:6px;}

/* 详情页：右侧客服 */
.detail-service{display:flex;flex-direction:column;gap:18px;position:sticky;top:96px;}
.svc-card{background:linear-gradient(170deg,rgba(255,255,255,.07),rgba(255,255,255,.03));border:1px solid var(--border);border-radius:var(--radius);padding:26px 22px;text-align:center;box-shadow:var(--shadow);}
.svc-avatar{width:96px;height:96px;border-radius:50%;background:linear-gradient(135deg,var(--accent),var(--accent-2));display:flex;align-items:center;justify-content:center;margin:0 auto 14px;box-shadow:0 12px 28px rgba(255,71,85,.35);overflow:hidden;}
.svc-avatar svg{width:100%;height:100%;display:block;}
.svc-badge{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--accent);background:var(--accent-soft);padding:4px 12px;border-radius:50px;margin-bottom:10px;}
.svc-name{font-size:18px;font-weight:700;margin-bottom:6px;}
.svc-status{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;color:var(--muted);margin-bottom:16px;}
.svc-status .dot{width:8px;height:8px;border-radius:50%;background:#3ddc97;box-shadow:0 0 0 3px rgba(61,220,151,.2);animation:pulse 1.8s infinite;}
@keyframes pulse{0%,100%{opacity:1;}50%{opacity:.4;}}
.svc-contact{display:flex;flex-direction:column;gap:8px;margin-bottom:16px;text-align:left;}
.svc-line{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--text);background:rgba(0,0,0,.22);border:1px solid var(--border);border-radius:12px;padding:9px 12px;}
.svc-line i{color:var(--accent);width:18px;text-align:center;}
.svc-qq{margin-bottom:10px;width:100%;}
.svc-tel{margin-bottom:14px;width:100%;}
.svc-links{display:flex;gap:10px;}
.svc-links a{flex:1;font-size:13px;color:var(--muted);background:rgba(255,255,255,.05);border:1px solid var(--border);border-radius:10px;padding:9px 0;transition:.25s;}
.svc-links a:hover{color:#fff;border-color:var(--accent);}
.svc-links a i{margin-right:5px;}
/* 详情页：交易保障（位于交易流程下方） */
.guarantee-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:10px;}
.guarantee-item{display:flex;align-items:flex-start;gap:14px;background:linear-gradient(160deg,rgba(255,255,255,.06),rgba(255,255,255,.025));border:1px solid var(--border);border-radius:var(--radius);padding:24px;transition:.35s;}
.guarantee-item:hover{transform:translateY(-4px);border-color:rgba(255,71,85,.4);}
.guarantee-item .gi-ic{flex:none;width:48px;height:48px;border-radius:14px;background:var(--accent-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:22px;}
.guarantee-item h5{font-size:16px;margin-bottom:6px;}
.guarantee-item p{font-size:13px;color:var(--muted);line-height:1.6;}

/* 新闻列表 */
.news-layout{display:grid;grid-template-columns:1fr 320px;gap:34px;}
.news-cats{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:24px;}
.news-cats a{padding:8px 18px;border-radius:50px;background:var(--card);border:1px solid var(--border);color:var(--muted);font-size:14px;}
.news-cats a.cur,.news-cats a:hover{background:var(--grad);color:#fff;border-color:transparent;}
.news-row{display:flex;gap:18px;padding:20px 0;border-bottom:1px solid var(--border);}
.news-row .ni-thumb{width:160px;height:110px;flex:none;border-radius:12px;overflow:hidden;background:rgba(255,255,255,.06);}
.news-row .ni-thumb img,.news-row .ni-thumb .bi-ph{width:100%;height:100%;}
.news-row .ni-body h4{font-size:17px;margin-bottom:8px;line-height:1.4;}
.news-row .ni-body h4 a:hover{color:var(--accent);}
.news-row .ni-body p{color:var(--muted);font-size:13.5px;line-height:1.6;margin-bottom:8px;}
.news-row .ni-meta{color:var(--muted);font-size:12.5px;}
.side-box{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:22px;margin-bottom:22px;}
.side-box h4{font-size:17px;margin-bottom:16px;}
.side-box ul li{padding:9px 0;border-bottom:1px solid var(--border);font-size:14px;}
.side-box ul li a{color:var(--text);}
.side-box ul li a:hover{color:var(--accent);}

/* 文章详情 */
.article-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:40px;align-items:start;}
.article-layout .article-body{max-width:none;margin:0;}
.article-body .meta{color:var(--muted);font-size:14px;margin-bottom:24px;}
.article-body p{color:#d9d9e3;font-size:16px;line-height:1.9;margin-bottom:20px;}
.article-body h3{font-size:22px;margin:30px 0 14px;}
.article-side{position:sticky;top:96px;}
.hot-news li{display:flex;gap:8px;align-items:flex-start;}
.hot-news li::before{content:"\f105";font-family:"Font Awesome 5 Free";font-weight:900;color:var(--accent);flex:none;line-height:1.5;}
.hot-news li a{color:var(--text);font-size:14px;line-height:1.5;}
.hot-news li a:hover{color:var(--accent);}

/* 表单页（登录/注册/联系） */
.auth-wrap{max-width:460px;margin:0 auto;}
/* 左右布局：表单靠右贴容器边缘，卖点在左列里水平居中 */
.auth-wrap-row{max-width:100%;margin:0;display:grid;grid-template-columns:1fr 420px;gap:28px;align-items:start;}
.auth-wrap-row > .auth-card{order:2;}
.auth-wrap-row > .auth-side{order:1;justify-self:center;max-width:340px;width:100%;}
.auth-wrap-row .auth-card{padding:32px 34px;}
.auth-side{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:24px 26px;}
.auth-side h5{font-size:15.5px;margin-bottom:14px;display:flex;align-items:center;gap:9px;}
.auth-side h5 i{color:var(--accent);}
.auth-side ul{list-style:none;margin:0;padding:0;}
.auth-side li{display:flex;gap:9px;align-items:flex-start;padding:7px 0;color:var(--muted);font-size:13.5px;line-height:1.6;}
.auth-side li i{color:#2ed573;font-size:12px;margin-top:4px;flex:none;}
.auth-side li a{color:var(--accent);}

/* Tab 切换（密码登录 / 短信登录） */
.auth-tabs{display:flex;gap:4px;border-bottom:1px solid var(--border);margin-bottom:22px;}
.auth-tab{flex:1;padding:12px 0;background:none;border:none;border-bottom:2px solid transparent;color:var(--muted);cursor:pointer;font-size:15px;transition:all .2s;}
.auth-tab:hover{color:#fff;}
.auth-tab.active{color:var(--accent);border-bottom-color:var(--accent);font-weight:600;}
.auth-pane{display:none;}
.auth-pane.active{display:block;}

/* 短信验证码行 */
.sms-line .sms-row{display:flex;gap:10px;}
.sms-line input{flex:1;}
.sms-btn{flex:none;height:48px;padding:0 18px;border-radius:12px;border:1px solid var(--accent);background:rgba(255,71,85,.1);color:var(--accent);cursor:pointer;font-size:13.5px;white-space:nowrap;transition:background .2s;}
.sms-btn:hover:not(:disabled){background:rgba(255,71,85,.2);}
.sms-btn:disabled{opacity:.6;cursor:not-allowed;border-color:var(--border);color:var(--muted);background:transparent;}

/* 图形验证码行（真人验证，防短信接口被脚本批量调用） */
.captcha-line .captcha-row{display:flex;gap:10px;align-items:center;}
.captcha-line input{flex:1;min-width:0;}
.captcha-img{flex:none;height:44px;width:140px;border-radius:12px;border:1px solid var(--border);cursor:pointer;background:#f4f6fa;object-fit:cover;display:block;}
.captcha-img:hover{opacity:.85;}
.auth-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:38px 34px;}
.auth-card h3{font-size:24px;text-align:center;margin-bottom:6px;}
.auth-card .sub{text-align:center;color:var(--muted);font-size:14px;margin-bottom:26px;}
.form-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:0 18px;}
@media (max-width:767px){.form-grid-2{grid-template-columns:1fr;}}
.form-line{margin-bottom:18px;}
.form-line label{display:block;font-size:13.5px;color:var(--muted);margin-bottom:7px;}
.form-line input,.form-line textarea,.form-line select{
  width:100%;height:48px;border-radius:12px;border:1px solid var(--border);
  background:rgba(0,0,0,.25);color:#fff;padding:0 16px;outline:none;font-size:14.5px;
  font-family:inherit;
}
.form-line select{
  appearance:none;-webkit-appearance:none;-moz-appearance:none;
  padding-right:40px;cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat:no-repeat;background-position:right 14px center;
}
.form-line select:disabled{opacity:.55;cursor:not-allowed;}
.form-line textarea{height:120px;padding:12px 16px;resize:none;}
.form-line input:focus,.form-line textarea:focus,.form-line select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(255,71,85,.15);}
.form-line select option{color:#111;background:#fff;}
.form-line .hint{font-size:12.5px;color:var(--muted);margin-top:6px;}

/* ---------- 会员中心筛选区 (uc-filter) ---------- */
.uc-filter{display:flex;gap:12px;flex-wrap:wrap;align-items:center;}
.uc-filter .uc-filter-input{
  flex:1;min-width:220px;height:42px;border-radius:50px;
  border:1px solid var(--border);background:rgba(0,0,0,.28);color:#fff;
  padding:0 18px;outline:none;font-size:14px;font-family:inherit;
}
/* ---------- .form-line 内嵌 .ms-select（与 input 对齐） ---------- */
.form-line .ms-select{display:block;width:100%;}
.form-line .ms-select-btn{
  width:100%;height:48px;border-radius:12px;border:1px solid var(--border);
  background:rgba(0,0,0,.25);color:#fff;padding:0 16px;font-size:14.5px;
  font-family:inherit;justify-content:space-between;gap:8px;
}
.form-line .ms-select-btn:hover{border-color:rgba(255,71,85,.5);background:rgba(0,0,0,.32);}
.form-line .ms-select-btn:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(255,71,85,.18);}
.form-line .ms-select-btn:disabled{opacity:.55;cursor:not-allowed;background:rgba(0,0,0,.25)!important;}
.form-line .ms-select-caret{color:var(--muted);}
.form-line .ms-select.is-open .ms-select-caret{color:var(--accent);}
.form-line .ms-select-txt{flex:1;text-align:left;}
.form-line .ms-select-txt.is-empty{color:var(--muted);opacity:.75;}
.form-line .ms-select-menu{top:54px;}
.form-line .ms-select-opt{padding:10px 14px;font-size:14px;}

.uc-filter select{
  height:42px;border-radius:50px;border:1px solid var(--border);
  background:rgba(0,0,0,.28);color:#fff;padding:0 36px 0 14px;outline:none;
  appearance:none;-webkit-appearance:none;-moz-appearance:none;cursor:pointer;
  font-size:14px;font-family:inherit;
  background-image:url("data:image/svg+xml;charset=utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>");
  background-repeat:no-repeat;background-position:right 12px center;
}
.uc-filter select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(255,71,85,.15);}
.uc-filter select option{color:#111;background:#fff;}

/* ---------- 自定义下拉选择器 (.ms-select) ----------
   原生 <select> 的下拉面板由操作系统绘制，Windows上是白底黑字的系统样式，
   CSS 只能改触发框（appearance:none + 自定义箭头），**改不了浮层面板**——
   深色页面里会弹出一块突兀的白底，与 Akamodern 的深蓝紫+珊瑚红完全冲突。
   故用 button + 自绘浮层实现，面板样式完全可控。
   保留原<select> 作为无 JS 时的兜底（.ms-select-native），并做无障碍标注。 */
.ms-select{position:relative;}
.ms-select-btn{
  width:100%;height:48px;display:flex;align-items:center;gap:12px;
  padding:0 16px;border-radius:12px;border:1px solid var(--border);
  background:rgba(0,0,0,.25);color:#fff;font:inherit;font-size:14.5px;
  cursor:pointer;transition:.25s;text-align:left;
}
.ms-select-btn:hover{border-color:rgba(255,71,85,.5);background:rgba(0,0,0,.34);}
.ms-select-btn:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(255,71,85,.18);}
.ms-select-ico{
  width:22px;height:22px;flex:none;border-radius:7px;display:flex;align-items:center;justify-content:center;
  background:var(--accent-soft);color:var(--accent);font-size:11px;
}
.ms-select-txt{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ms-select-txt.is-empty{color:var(--muted);opacity:.75;}
.ms-select-caret{
  flex:none;font-size:12px;color:var(--muted);transition:.3s;
  display:flex;align-items:center;
}
.ms-select.is-open .ms-select-caret{transform:rotate(180deg);color:var(--accent);}
/* 浮层面板：绝对定位在触发框下方，与卡片同色系 + 渐变描边 */
.ms-select-menu{
  position:absolute;left:0;right:0;top:calc(100% + 6px);z-index:60;
  background:linear-gradient(160deg,var(--bg-3),var(--bg-2));
  border:1px solid rgba(255,255,255,.14);border-radius:14px;
  box-shadow:0 22px 48px rgba(0,0,0,.55);
  padding:6px;max-height:300px;overflow-y:auto;overscroll-behavior:contain;
  opacity:0;visibility:hidden;transform:translateY(-8px) scale(.98);
  transition:opacity .22s ease,transform .22s ease,visibility .22s;
}
.ms-select.is-open .ms-select-menu{opacity:1;visibility:visible;transform:translateY(0) scale(1);}
.ms-select-menu::-webkit-scrollbar{width:8px;}
.ms-select-menu::-webkit-scrollbar-thumb{background:rgba(255,255,255,.16);border-radius:8px;}
.ms-select-menu::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.26);}
.ms-select-opt{
  display:flex;align-items:center;gap:11px;padding:11px 13px;border-radius:10px;
  font-size:14.5px;color:var(--muted);cursor:pointer;transition:.2s;
}
.ms-select-opt:hover{background:rgba(255,255,255,.07);color:#fff;}
.ms-select-opt.is-active{
  background:linear-gradient(135deg,rgba(255,71,85,.20),rgba(79,84,250,.16));
  color:#fff;font-weight:600;
}
.ms-select-opt .ic{
  width:26px;height:26px;flex:none;border-radius:8px;display:flex;align-items:center;justify-content:center;
  background:rgba(255,255,255,.06);color:var(--muted);font-size:11px;
}
.ms-select-opt.is-active .ic{background:var(--grad);color:#fff;}
/* 原生 select 兜底：JS 可用时隐藏 */
.ms-select-native{position:absolute;left:0;top:0;width:100%;height:100%;opacity:0;pointer-events:none;}
/* 变体：筛选器里的紧凑圆角形态 */
.ms-select-sm .ms-select-btn{height:44px;border-radius:50px;padding:0 16px;font-size:14px;}
.ms-select-sm .ms-select-menu{border-radius:14px;padding:6px;}
/* 变体：外层已有 .form-line + label，内部不要再套一层 label 和 margin */
.ms-select-bare{width:100%;}
.ms-select-bare .ms-select-txt{font-size:14.5px;}
/* 变体：筛选器内纯文字胶囊（无左侧图标块，宽度紧凑） */
.ms-select-flat .ms-select-ico{display:none;}
.ms-select-flat .ms-select-btn{justify-content:space-between;gap:8px;padding:0 14px 0 16px;}
.ms-select-flat .ms-select-opt{justify-content:center;padding:9px 12px;}
.ms-select-flat .ms-select-opt .ic{display:none;}
.ms-select-flat .ms-select-opt .txt{flex:0 1 auto;}
/* 选中项右侧的对勾 */
.ms-select-opt .tick{margin-left:auto;width:14px;height:9px;flex:none;
  border-left:2px solid var(--accent);border-bottom:2px solid var(--accent);
  transform:rotate(-45deg) translateY(-2px);opacity:0;transition:.2s;}
.ms-select-opt.is-active .tick{opacity:1;}
.form-extra{display:flex;justify-content:space-between;align-items:center;font-size:13.5px;color:var(--muted);margin-bottom:22px;}
.form-extra a{color:var(--accent);}
.auth-switch{text-align:center;color:var(--muted);font-size:14px;margin-top:20px;}
.auth-switch a{color:var(--accent);}

/* 我的商标（空态） */
.empty-state{text-align:center;padding:80px 20px;}
.empty-state .ic{width:90px;height:90px;border-radius:50%;background:var(--accent-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:38px;margin:0 auto 22px;}
.empty-state h3{font-size:22px;margin-bottom:10px;}
.empty-state p{color:var(--muted);margin-bottom:24px;}

/* 网站公告：左列表 + 右详情（主从布局） */
.notice-layout{display:grid;grid-template-columns:380px minmax(0,1fr);gap:30px;align-items:start;}
.notice-aside{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:6px 20px;position:sticky;top:96px;}
.notice-aside-head{display:flex;align-items:center;gap:10px;padding:18px 2px 14px;border-bottom:1px solid var(--border);font-weight:700;font-size:17px;}
.notice-aside-head i{color:var(--accent);font-size:18px;}
.notice-aside-head em{margin-left:auto;font-style:normal;font-size:13px;color:var(--muted);font-weight:500;}
.notice-list li{display:block;padding:0;border-bottom:1px solid var(--border);transition:.25s;}
.notice-list li:last-child{border-bottom:none;}
.notice-list li a{display:flex;flex-direction:column;gap:7px;padding:16px 12px;border-radius:10px;color:var(--text);}
.notice-list li .t{font-size:15px;line-height:1.5;transition:.25s;}
.notice-list li .d{color:var(--muted);font-size:13px;}
.notice-list li:hover a{background:var(--card-2);}
.notice-list li:hover .t{color:var(--accent);}
.notice-list li.active a{background:var(--accent-soft);box-shadow:inset 3px 0 0 var(--accent);}
.notice-list li.active .t{color:var(--accent);font-weight:600;}

.notice-detail{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:40px 44px;min-height:480px;}
.nd-head{border-bottom:1px solid var(--border);padding-bottom:22px;margin-bottom:26px;}
.nd-tag{display:inline-block;font-size:12.5px;font-weight:600;color:var(--accent);background:var(--accent-soft);padding:5px 14px;border-radius:30px;margin-bottom:14px;}
.nd-title{font-size:25px;line-height:1.45;margin-bottom:16px;}
.nd-meta{display:flex;gap:22px;color:var(--muted);font-size:13.5px;}
.nd-meta span{display:inline-flex;align-items:center;gap:7px;}
.nd-body p{color:#d9d9e3;font-size:16px;line-height:1.95;margin-bottom:20px;}
.nd-foot{display:flex;gap:14px;margin-top:34px;padding-top:26px;border-top:1px solid var(--border);}
.nd-foot .cmn-btn{flex:1;justify-content:center;text-align:center;}

/* 商标列表：筛选面板 */
.filter-panel{position:relative;background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));
  border:1px solid var(--border);border-radius:var(--radius);margin-bottom:26px;box-shadow:var(--shadow);overflow:hidden;}
.filter-panel::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--accent),var(--accent-2));}
.fp-head{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;padding:18px 28px;
  border:0;border-bottom:1px solid var(--border);background:transparent;color:inherit;font:inherit;text-align:left;cursor:default;}
.fp-title{display:flex;align-items:center;gap:10px;font-size:16px;font-weight:700;flex:none;}
.fp-title i{color:var(--accent);}
/* 折叠态摘要：手机端收起时也能看到当前生效的关键条件 */
.fp-summary{flex:1;min-width:0;font-size:13px;color:var(--muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  padding-left:14px;border-left:1px solid var(--border);}
.fp-summary.is-active{color:var(--accent);}
.fp-actions{display:flex;align-items:center;gap:10px;flex:none;}
.fp-meta{font-size:13px;color:var(--muted);}
.fp-meta b{color:var(--accent);font-size:15px;font-weight:800;}
.fp-arrow{display:none;color:var(--muted);font-size:13px;transition:.3s;}
/* 桌面端面板常驻展开，头部不可点；仅手机端可点（见 767px 断点）。
   不额外开 @media (hover:hover)：基础规则保持默认指针即可，触摸端由断点内cursor:pointer 覆盖。 */
.fp-body{padding:4px 28px 22px;}
.filter-row{display:flex;gap:18px;padding:16px 0;border-bottom:1px dashed var(--border);align-items:flex-start;}
.filter-row:last-child{border-bottom:none;}
.fr-label{flex:none;width:92px;color:var(--muted);font-size:13px;font-weight:600;letter-spacing:.3px;padding-top:9px;text-align:right;border-right:2px solid var(--accent-soft);padding-right:14px;}
.fr-body{flex:1;display:flex;flex-wrap:wrap;gap:10px;align-items:center;min-width:0;}
/* 分类行：按钮 + 已选 chip 竖排，避免按钮被 chip 挤到换行 */
.cls-fr{flex-direction:column;align-items:flex-start;gap:9px;}
/* 展开的分类面板改为跨出标签列、独占筛选卡整行宽度。
   原先它在 .fr-body 内（标签占92px + 右侧还有大片空白），
   只能用到 ~730px → 46 项排成 4 列 11 行，高度 449px 顶出视口。
   跨行后可排 6~7 列 7 行，高度降到 ~300px，一屏能看完。 */
.cls-fr>.cls-panel{position:relative;left:-110px;width:calc(100% + 110px);}
.cls-toggle{display:inline-flex;align-items:center;gap:9px;background:linear-gradient(135deg,rgba(255,71,85,.16),rgba(79,84,250,.16));border:1px solid var(--border);color:#fff;border-radius:50px;padding:9px 18px;cursor:pointer;font-size:14px;transition:.3s;}
.cls-toggle:hover{border-color:var(--accent);box-shadow:0 6px 18px rgba(255,71,85,.18);}
.cls-toggle>i:first-child{color:var(--accent);}
.cls-toggle .cls-caret{margin-left:2px;transition:.3s;color:var(--muted);font-size:12px;}
.cls-toggle.open{border-color:var(--accent);}
.cls-toggle.open .cls-caret{transform:rotate(180deg);color:var(--accent);}
.cls-badge{min-width:20px;height:20px;padding:0 6px;border-radius:50px;background:var(--accent);color:#fff;
  font-size:12px;font-weight:800;line-height:20px;text-align:center;}
.cls-selected{display:flex;flex-wrap:wrap;gap:8px;}
.cls-selected.is-empty{display:none;}
.chip{display:inline-flex;align-items:center;gap:7px;background:var(--grad);color:#fff;border-radius:50px;padding:6px 8px 6px 13px;font-size:13px;font-weight:600;animation:chipIn .25s ease;}
.chip b{font-weight:800;}
.chip i{cursor:pointer;opacity:.85;width:20px;height:20px;border-radius:50%;background:rgba(255,255,255,.18);
  display:inline-flex;align-items:center;justify-content:center;font-size:11px;transition:.2s;}
.chip i:hover{opacity:1;background:rgba(255,255,255,.34);}
/* 桌面端内联分类面板 */
.cls-panel{width:100%;margin-top:14px;background:rgba(0,0,0,.28);border:1px solid var(--border);border-radius:14px;padding:16px 18px;box-shadow:inset 0 0 30px rgba(0,0,0,.25);}
.cls-panel[hidden]{display:none;}
.cls-panel-inner{display:block;}
.cls-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px;}
/* 桌面内联面板：46 个分类（45 类 + 不限）必须一次铺开，不能限高内滚。
   原 max-height:264px 会把第 6 行切掉、在页面滚动里再套一层小滚动区，
   且右侧一列被固定联系条按钮压住。现改为不限高 + 紧凑单行，
   面板整体高度由筛选卡的其他行决定，页面滚动一次到位。 */
.cls-panel .cls-grid{max-height:none;overflow:visible;padding-right:0;}
.cls-panel .cls-grid label{min-height:30px;padding:5px 10px;font-size:12.5px;}
.cls-panel .cls-grid .cls-txt{white-space:normal;line-height:1.25;}
.cls-grid::-webkit-scrollbar{width:8px;}
.cls-grid::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:8px;}
.cls-grid label{display:flex;align-items:center;gap:8px;min-height:34px;font-size:13px;color:var(--muted);cursor:pointer;background:rgba(255,255,255,.04);border:1px solid var(--border);padding:7px 11px;border-radius:10px;transition:.25s;}
.cls-grid label:hover{border-color:var(--accent);color:#fff;}
.cls-grid input{display:none;}
.cls-grid .cls-txt{display:flex;align-items:baseline;gap:3px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cls-grid .cls-txt b{font-weight:800;color:inherit;}
.cls-grid label:has(input:checked){background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 6px 16px rgba(255,71,85,.25);}
/* 选中对勾：用纯CSS 绘制，不依赖字体（FA5 无 f00c 的场景已统一处理） */
.cls-grid label:has(input:checked)::after{content:"";margin-left:auto;flex:none;width:15px;height:9px;
  border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) translateY(-2px);}
.subgroup-box{margin-top:14px;border-top:1px solid var(--border);padding-top:14px;display:none;}
.subgroup-box.show{display:block;animation:chipIn .3s ease;}
.subgroup-box .sg-title{font-size:13px;color:var(--accent);margin-bottom:10px;display:flex;align-items:center;gap:8px;font-weight:600;}
.subgroup-box .sg-title::before{content:"\f02b";font-family:"Font Awesome 5 Free";font-weight:900;}
.subgroup-box .sg-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:6px 12px;}
.subgroup-box label{display:flex;align-items:center;gap:8px;min-height:32px;font-size:12.5px;color:var(--muted);cursor:pointer;background:rgba(255,255,255,.03);border:1px solid var(--border);padding:6px 10px;border-radius:9px;transition:.25s;}
.subgroup-box label:hover{border-color:var(--accent-2);color:#fff;}
.subgroup-box label.sg-empty{justify-content:center;color:var(--muted);cursor:default;}
.subgroup-box input{display:none;}
.subgroup-box label:has(input:checked){background:var(--grad-2);color:#fff;border-color:transparent;}
.radio-row label{display:inline-flex;align-items:center;gap:0;min-height:36px;font-size:13.5px;color:var(--muted);cursor:pointer;background:rgba(255,255,255,.04);padding:8px 16px;border-radius:50px;border:1px solid var(--border);transition:.25s;white-space:nowrap;}
.radio-row label:hover{border-color:var(--accent);color:#fff;}
.radio-row input{display:none;}
.radio-row label:has(input:checked){background:var(--grad);color:#fff;border-color:transparent;box-shadow:0 6px 16px rgba(255,71,85,.22);}
.radio-row label:has(input:checked)::after{content:"";margin-left:9px;flex:none;width:13px;height:8px;
  border-left:2px solid #fff;border-bottom:2px solid #fff;transform:rotate(-45deg) translateY(-2px);}
/* 关键字：两个语义组各占一行（包含 / 排除），组内输入框与模式选择器同行 */
.kw-row{display:flex;flex-wrap:wrap;align-items:center;gap:10px 18px;}
.kw-group{display:flex;align-items:center;gap:8px;flex:1 1 260px;min-width:0;}
.kw-group .ms-select{flex:none;min-width:120px;}
.kw-field{position:relative;display:flex;align-items:center;flex:1 1 auto;min-width:0;}
.kw-field i{position:absolute;left:13px;color:var(--muted);font-size:13px;pointer-events:none;}
.kw-field input{width:100%;}
.kw-row input,.kw-row select{height:44px;border-radius:50px;border:1px solid var(--border);background:rgba(0,0,0,.28);color:#fff;padding:0 16px;outline:none;font-size:14px;transition:.25s;}
.kw-row input:focus,.kw-row select:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(255,71,85,.15);}
.kw-row select{appearance:none;-webkit-appearance:none;flex:none;width:98px;padding-right:32px;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2'><path d='M6 9l6 6 6-6'/></svg>");background-repeat:no-repeat;background-position:right 14px center;cursor:pointer;}
.kw-row select option{color:#111;}
.kw-row .excl{color:var(--muted);font-size:13px;flex:none;display:inline-flex;align-items:center;gap:6px;}
/* 面板底部操作条：桌面端也在，方便「查看 N 个结果」一键回跳 */
.fp-actions-bar{display:flex;align-items:center;justify-content:flex-end;gap:12px;padding-top:18px;}
.fp-actions-bar .cmn-btn{min-width:210px;justify-content:center;}
.fp-actions-bar .cmn-btn b{font-weight:800;}
.reset-btn{background:transparent;border:1px solid var(--border);color:var(--muted);border-radius:50px;padding:0 20px;height:44px;cursor:pointer;font-size:14px;transition:.25s;}
.reset-btn:hover{border-color:var(--accent-2);color:#fff;background:rgba(79,84,250,.12);}

/* 分类选择抽屉（手机）：从底部滑出，遮罩 + 独立滚动区+ 固定底部确认条 */
.sheet-mask{position:fixed;inset:0;background:rgba(4,1,14,.72);backdrop-filter:blur(3px);z-index:1200;opacity:0;visibility:hidden;transition:.3s;}
body.sheet-open .sheet-mask{opacity:1;visibility:visible;}
.cls-sheet{position:fixed;left:0;right:0;bottom:0;z-index:1201;display:flex;flex-direction:column;
  max-height:86vh;background:#170a33;border-top:1px solid var(--border);border-radius:20px 20px 0 0;
  box-shadow:0 -18px 50px rgba(0,0,0,.55);transform:translateY(102%);transition:transform .32s cubic-bezier(.4,0,.2,1);
  padding-bottom:env(safe-area-inset-bottom);}
body.sheet-open .cls-sheet{transform:translateY(0);}
.sheet-handle{width:44px;height:4px;border-radius:4px;background:rgba(255,255,255,.24);margin:10px auto 0;flex:none;}
.sheet-head{display:flex;align-items:flex-start;gap:12px;padding:12px 18px 14px;border-bottom:1px solid var(--border);flex:none;}
.sheet-title{font-size:16px;font-weight:700;display:flex;flex-direction:column;gap:4px;}
.sheet-title span{font-size:12.5px;color:var(--muted);font-weight:400;}
.sheet-close{margin-left:auto;flex:none;width:34px;height:34px;border-radius:50%;border:1px solid var(--border);background:rgba(255,255,255,.05);color:var(--muted);cursor:pointer;font-size:14px;transition:.25s;}
.sheet-close:hover{color:#fff;border-color:var(--accent);}
.sheet-body{flex:1 1 auto;min-height:0;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:14px 18px 6px;}
.sheet-body .cls-grid{max-height:none;overflow:visible;}
.sheet-foot{display:flex;align-items:center;gap:12px;padding:12px 18px 16px;border-top:1px solid var(--border);
  background:rgba(0,0,0,.24);flex:none;}
.sheet-foot .cmn-btn{flex:1;justify-content:center;}
.sheet-foot .cmn-btn b{font-weight:800;}
.sheet-clear{flex:none;height:46px;padding:0 22px;border-radius:50px;border:1px solid var(--border);background:rgba(255,255,255,.05);color:#ddd;cursor:pointer;font-size:14px;display:inline-flex;align-items:center;text-decoration:none;line-height:1;white-space:nowrap;}
.sheet-clear:hover{color:#fff;border-color:var(--accent);background:rgba(255,71,85,.12);}
/* 抽屉打开时锁定背景滚动（保留 x 轴 clip，理由同 body.uc-menu-open） */
body.sheet-open{overflow-y:auto;overflow-x:clip;}
.result-bar{display:flex;justify-content:space-between;align-items:center;margin:26px 0 18px;flex-wrap:wrap;gap:12px;}
.result-bar #resultCount{font-size:14px;color:var(--muted);background:rgba(255,255,255,.05);border:1px solid var(--border);padding:8px 16px;border-radius:50px;}
.result-bar #resultCount b{color:var(--accent);font-size:16px;font-weight:800;}
.sort-tabs{display:flex;gap:6px;background:rgba(255,255,255,.04);border:1px solid var(--border);border-radius:50px;padding:5px;}
.sort-tabs a{padding:7px 16px;border-radius:50px;color:var(--muted);font-size:13.5px;transition:.25s;white-space:nowrap;}
.sort-tabs a.cur,.sort-tabs a:hover{background:var(--grad);color:#fff;box-shadow:0 6px 16px rgba(255,71,85,.2);}

@keyframes chipIn{from{opacity:0;transform:scale(.85);}to{opacity:1;transform:scale(1);}}

/* 分页 */
.pagination{display:flex;justify-content:center;gap:8px;margin-top:42px;flex-wrap:wrap;}
.pagination a,.pagination span{
  min-width:42px;height:42px;padding:0 12px;border-radius:50px;border:1px solid var(--border);
  background:var(--card);display:flex;align-items:center;justify-content:center;color:var(--text);font-size:14px;transition:.25s;
}
.pagination a:hover{background:var(--grad);border-color:transparent;color:#fff;transform:translateY(-2px);box-shadow:0 8px 18px rgba(255,71,85,.2);}
.pagination a.cur{background:var(--grad);border-color:transparent;color:#fff;box-shadow:0 8px 18px rgba(255,71,85,.25);}

/* 信息块（公司介绍等） */
.prose{max-width:860px;}
.prose p{color:#d9d9e3;font-size:16px;line-height:1.9;margin-bottom:18px;}
.prose h3{font-size:22px;margin:30px 0 14px;}
.info-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:30px;}
.info-cards .ic-item{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:28px;}
.info-cards .ic-item .fic{font-size:30px;color:var(--accent);margin-bottom:14px;}
.info-cards .ic-item h4{font-size:18px;margin-bottom:8px;}

/* =====================================================================
   响应式
   ===================================================================== */

/* =====================================================================
   内容页扩展组件（注册 / 指南 / 关于 / 联系）
   ===================================================================== */
/* 居中区块标题 */
.sec-head{text-align:center;max-width:640px;margin:0 auto 36px;}
.sec-head h3{font-size:28px;margin-bottom:10px;}
.sec-head p{color:var(--muted);font-size:15px;}

/* 五步流程（flow-steps 扩展） */
.flow-steps.cols5{grid-template-columns:repeat(5,1fr);}
.flow-steps .step .desc{color:var(--muted);font-size:13px;line-height:1.6;margin-top:4px;}

/* 套餐特性列表 */
.price-feat{list-style:none;margin:0 0 20px;padding:0;text-align:left;}
.price-feat li{display:flex;gap:9px;align-items:flex-start;padding:7px 0;color:#d9d9e3;font-size:14px;border-bottom:1px dashed var(--border);}
.price-feat li:last-child{border-bottom:none;}
.price-feat li i{color:var(--accent);font-size:12px;margin-top:5px;flex:none;}

/* 注册页顶部：套餐 + 表单 双列 */
.reg-top{display:grid;grid-template-columns:minmax(0,1fr) 430px;gap:28px;align-items:start;}
.reg-plans{display:grid;gap:22px;}

/* 申请材料清单 */
.mat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:24px;}
.mat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:30px;transition:.3s;}
.mat-card:hover{border-color:rgba(79,84,250,.5);transform:translateY(-3px);}
.mat-card .mt-head{display:flex;align-items:center;gap:14px;margin-bottom:18px;}
.mat-card .mt-ic{flex:none;width:52px;height:52px;border-radius:14px;background:var(--accent-soft);color:var(--accent);font-size:22px;display:flex;align-items:center;justify-content:center;}
.mat-card h4{font-size:19px;}
.mat-card .mt-tag{font-size:12px;color:var(--muted);font-weight:500;}
.mat-list{list-style:none;margin:0;padding:0;}
.mat-list li{display:flex;gap:10px;align-items:flex-start;padding:10px 0;border-bottom:1px dashed var(--border);color:#d9d9e3;font-size:14.5px;line-height:1.6;}
.mat-list li:last-child{border-bottom:none;}
.mat-list li i{color:#2ed573;font-size:13px;margin-top:4px;flex:none;}

/* 精选要点（图标卡，替代原图片区） */
.sel-tips{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-top:26px;}
.sel-tip{position:relative;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:28px 22px;text-align:center;transition:.3s;overflow:hidden;}
.sel-tip::before{content:"";position:absolute;left:-30%;right:-30%;bottom:-60%;height:120px;background:radial-gradient(closest-side,rgba(79,84,250,.25),transparent);}
.sel-tip:hover{transform:translateY(-4px);border-color:rgba(255,71,85,.45);}
.sel-tip .st-ic{position:relative;width:64px;height:64px;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-size:26px;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;}
.sel-tip:nth-child(2) .st-ic{background:rgba(79,84,250,.14);color:#8a8dff;}
.sel-tip:nth-child(3) .st-ic{background:rgba(46,213,115,.12);color:#2ed573;}
.sel-tip:nth-child(4) .st-ic{background:rgba(255,190,60,.12);color:#ffbe3c;}
.sel-tip h4{font-size:16.5px;margin-bottom:8px;position:relative;}
.sel-tip p{color:var(--muted);font-size:13.5px;line-height:1.7;position:relative;}

/* 为什么价格翻几倍 */
.why-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:26px;}
.why-card{background:linear-gradient(180deg,rgba(255,255,255,.05),rgba(255,255,255,.02));border:1px solid var(--border);border-radius:var(--radius);padding:30px;transition:.3s;}
.why-card:hover{border-color:rgba(255,71,85,.45);transform:translateY(-3px);}
.why-card .w-tag{display:inline-block;font-size:12px;font-weight:700;color:var(--accent);background:var(--accent-soft);padding:4px 12px;border-radius:30px;margin-bottom:14px;}
.why-card h4{font-size:20px;margin-bottom:10px;}
.why-card p{color:var(--muted);font-size:14.5px;line-height:1.75;}
.why-card .w-big{font-size:32px;font-weight:800;color:#fff;margin-top:14px;}
.why-card .w-big small{font-size:14px;color:var(--muted);font-weight:500;margin-left:6px;}

/* 六大服务保障 */
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:26px;}
.feat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:26px;transition:.3s;display:flex;gap:18px;align-items:flex-start;}
.feat-card:hover{border-color:rgba(79,84,250,.5);transform:translateY(-3px);}
.feat-card .f-ic{flex:none;width:52px;height:52px;border-radius:14px;background:var(--grad-2);color:#fff;font-size:22px;display:flex;align-items:center;justify-content:center;box-shadow:0 10px 24px rgba(79,84,250,.35);}
.feat-card h4{font-size:17px;margin-bottom:6px;}
.feat-card p{color:var(--muted);font-size:13.5px;line-height:1.65;margin-bottom:10px;}
.feat-card a{font-size:13px;color:var(--accent);font-weight:600;}
.feat-card a i{font-size:11px;margin-left:4px;}

/* 安全双卡（替代原图片区） */
.safe-duo{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:26px;}
.duo-card{display:flex;gap:22px;align-items:center;background:linear-gradient(135deg,rgba(255,71,85,.10),rgba(255,255,255,.03));border:1px solid rgba(255,71,85,.25);border-radius:var(--radius);padding:30px;transition:.3s;}
.duo-card:nth-child(2){background:linear-gradient(135deg,rgba(79,84,250,.12),rgba(255,255,255,.03));border-color:rgba(79,84,250,.3);}
.duo-card:hover{transform:translateY(-3px);}
.duo-card .d-ic{flex:none;width:78px;height:78px;border-radius:50%;background:var(--grad);color:#fff;font-size:30px;display:flex;align-items:center;justify-content:center;box-shadow:0 14px 32px rgba(255,71,85,.4);}
.duo-card:nth-child(2) .d-ic{background:var(--grad-2);box-shadow:0 14px 32px rgba(79,84,250,.4);}
.duo-card h4{font-size:19px;margin-bottom:8px;}
.duo-card p{color:var(--muted);font-size:14px;line-height:1.7;}

/* CTA 横幅 */
.cta-band{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;background:linear-gradient(135deg,rgba(255,71,85,.16),rgba(79,84,250,.16));border:1px solid rgba(255,71,85,.3);border-radius:var(--radius);padding:28px 34px;margin-top:34px;}
.cta-band h4{font-size:21px;margin-bottom:6px;}
.cta-band p{color:var(--muted);font-size:14px;}

/* 公司数据 / 发展时间线 */
.about-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin:32px 0 8px;}
.stat-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:26px;text-align:center;transition:.3s;}
.stat-card:hover{border-color:rgba(255,71,85,.4);transform:translateY(-3px);}
.stat-card .v{font-size:32px;font-weight:800;color:var(--accent);}
.stat-card .v small{font-size:15px;font-weight:600;}
.stat-card .k{color:var(--muted);font-size:13.5px;margin-top:6px;}

.about-tl{position:relative;max-width:720px;margin:34px auto 10px;padding-left:26px;}
.about-tl::before{content:"";position:absolute;left:7px;top:8px;bottom:8px;width:2px;background:linear-gradient(180deg,var(--accent),var(--accent-2));border-radius:2px;}
.tl-item{position:relative;padding:0 0 26px 18px;}
.tl-item:last-child{padding-bottom:0;}
.tl-item::before{content:"";position:absolute;left:-26px;top:6px;width:16px;height:16px;border-radius:50%;background:var(--bg);border:3px solid var(--accent);box-shadow:0 0 0 4px rgba(255,71,85,.15);}
.tl-item .t-year{font-size:13px;font-weight:700;color:var(--accent);letter-spacing:.5px;}
.tl-item h4{font-size:17px;margin:4px 0 6px;}
.tl-item p{color:var(--muted);font-size:14px;line-height:1.7;}

/* 联系方式卡片 */
.ct-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:34px;}
.ct-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:26px 22px;text-align:center;transition:.3s;}
.ct-card:hover{border-color:rgba(79,84,250,.5);transform:translateY(-3px);}
.ct-card .c-ic{width:54px;height:54px;border-radius:50%;background:var(--accent-soft);color:var(--accent);font-size:22px;display:flex;align-items:center;justify-content:center;margin:0 auto 14px;}
.ct-card h5{font-size:14px;color:var(--muted);font-weight:600;margin-bottom:6px;}
.ct-card p{font-size:15px;color:var(--text);line-height:1.55;word-break:break-all;}

/* FAQ 手风琴 */
.faq-list{max-width:860px;margin:26px auto 0;}
.faq-item{background:var(--card);border:1px solid var(--border);border-radius:14px;margin-bottom:12px;overflow:hidden;}
.faq-item summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:18px 22px;font-size:15.5px;font-weight:600;transition:.25s;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:"\f078";font-family:"Font Awesome 5 Free";font-weight:900;font-size:12px;color:var(--accent);transition:.3s;}
.faq-item[open] summary{color:var(--accent);}
.faq-item[open] summary::after{transform:rotate(180deg);}
.faq-item .faq-body{padding:0 22px 18px;color:var(--muted);font-size:14px;line-height:1.8;}

/* 响应式 */

/* 对比表（私下交易 vs 平台交易） */
.cmp-wrap{overflow-x:auto;margin-top:26px;}
.cmp-table{width:100%;min-width:640px;border-collapse:separate;border-spacing:0;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;}
.cmp-table th,.cmp-table td{padding:15px 18px;text-align:center;font-size:14.5px;border-bottom:1px solid var(--border);}
.cmp-table th{background:rgba(255,255,255,.05);font-size:15px;font-weight:700;}
.cmp-table th.hl{color:var(--accent);}
.cmp-table th:first-child,.cmp-table td:first-child{text-align:left;font-weight:600;color:var(--text);white-space:nowrap;}
.cmp-table td{color:var(--muted);line-height:1.6;}
.cmp-table tbody tr{transition:.2s;}
.cmp-table tbody tr:hover{background:rgba(255,255,255,.03);}
.cmp-table tbody tr:last-child td{border-bottom:none;}
.cmp-table .good{color:#2ed573;font-weight:600;}
.cmp-table .bad{color:#ff6b81;}

/* =====================================================================
   会员中心（账户信息 / 资金 / 订单）
   ===================================================================== */
.uc-layout{display:grid;grid-template-columns:260px minmax(0,1fr);gap:26px;align-items:start;}
/* 手机版折叠菜单：桌面端隐藏，991px 及以下才出现 */
.uc-mobile-bar{display:none;}
.uc-mobile-bar .uc-menu-btn{display:inline-flex;align-items:center;gap:10px;
  background:var(--card);border:1px solid var(--border);border-radius:999px;
  color:var(--text);font-size:14.5px;font-weight:600;font-family:inherit;
  padding:11px 20px;cursor:pointer;min-height:44px;transition:.25s;}
.uc-mobile-bar .uc-menu-btn:hover{border-color:var(--accent);color:var(--accent);}
.uc-mobile-bar .uc-menu-btn i{font-size:16px;}
.uc-mobile-bar .uc-menu-btn[aria-expanded="true"]{background:var(--grad);border-color:transparent;color:#fff;}
/* 桌面端 .uc-mobile-bar 整体 display:none，里面的当前页名不参与显示；
   移动端 hero 被视觉隐藏后，它就是视觉上唯一的页面标题。 */
.uc-mobile-bar .uc-mobile-cur{margin:0;color:var(--text);font-size:15px;font-weight:700;line-height:1.3;text-align:right;}
.uc-aside{position:sticky;top:96px;background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:24px 18px;}
.uc-user{display:flex;gap:14px;align-items:center;padding-bottom:20px;border-bottom:1px solid var(--border);margin-bottom:14px;}
.uc-avatar{flex:none;width:56px;height:56px;border-radius:50%;background:var(--grad);color:#fff;font-size:22px;font-weight:800;display:flex;align-items:center;justify-content:center;}
.uc-user h4{font-size:17px;margin-bottom:5px;}
.uc-user .tag{display:inline-block;font-size:11.5px;color:var(--accent);background:var(--accent-soft);padding:2px 10px;border-radius:20px;}
.uc-menu{list-style:none;margin:0;padding:0;}
.uc-menu li a{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:12px;color:var(--muted);font-size:14.5px;transition:.25s;}
.uc-menu li a i{width:20px;text-align:center;font-size:15px;}
/* 菜单项文本容器：名称 + 副标题（路径）。
   桌面端副标题隐藏——侧栏常驻展开时路径是冗余信息；≤991px 折叠菜单里才承担面包屑的定位功能。 */
.uc-mi{display:flex;flex-direction:column;gap:2px;min-width:0;flex:1;}
.uc-mi-n{font-size:inherit;line-height:1.35;}
.uc-mi-t{display:none;font-size:12px;line-height:1.4;color:var(--text);opacity:.5;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:400;}
.uc-menu li a:hover{background:var(--card-2);color:var(--text);}
.uc-menu li a.cur{background:var(--accent-soft);color:var(--accent);font-weight:600;}
.uc-menu li a.cur .uc-mi-t{color:var(--accent);opacity:.78;}
.uc-menu .quit{margin-top:10px;border-top:1px solid var(--border);padding-top:10px;}

.uc-panel{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:30px;margin-bottom:22px;}
.uc-panel:last-child{margin-bottom:0;}
.uc-head{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:22px;}
.uc-head h3{font-size:19px;display:flex;align-items:center;gap:10px;}
.uc-head h3 i{color:var(--accent);font-size:16px;}

.uc-table{width:100%;border-collapse:separate;border-spacing:0;}
.uc-table th,.uc-table td{padding:13px 12px;text-align:left;font-size:14px;border-bottom:1px solid var(--border);}
.uc-table th{color:var(--muted);font-weight:600;font-size:13px;white-space:nowrap;}
.uc-table td{color:#d9d9e3;vertical-align:middle;}
.uc-table tbody tr{transition:.2s;}
.uc-table tbody tr:hover{background:rgba(255,255,255,.03);}
.uc-table tbody tr:last-child td{border-bottom:none;}
.uc-table .in{color:#2ed573;font-weight:600;}
.uc-table .out{color:#ff6b81;font-weight:600;}
.uc-table .nowrap{white-space:nowrap;}
.uc-table a.op{color:var(--accent);font-size:13px;font-weight:600;}

.pill{display:inline-block;font-size:12px;font-weight:600;padding:4px 12px;border-radius:20px;white-space:nowrap;}
.pill.ok{color:#2ed573;background:rgba(46,213,115,.12);}
.pill.doing{color:#4f8dff;background:rgba(79,141,255,.14);}
.pill.wait{color:#ffbe3c;background:rgba(255,190,60,.12);}
.pill.warn{color:#ff6b81;background:rgba(255,107,129,.12);}

.uc-tabs{display:flex;gap:8px;flex-wrap:wrap;}
.uc-tabs a{font-size:13.5px;color:var(--muted);padding:8px 18px;border-radius:30px;border:1px solid var(--border);transition:.25s;}
.uc-tabs a:hover{color:var(--text);border-color:rgba(255,255,255,.25);}
.uc-tabs a.cur{background:var(--grad);color:#fff;border-color:transparent;font-weight:600;}

.uc-balance{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;background:linear-gradient(135deg,rgba(255,71,85,.16),rgba(79,84,250,.16));border:1px solid rgba(255,71,85,.3);border-radius:var(--radius);padding:28px 32px;margin-bottom:22px;}
.uc-balance .b-num{font-size:38px;font-weight:800;color:#fff;}
.uc-balance .b-num small{font-size:16px;color:var(--muted);font-weight:500;}
.uc-balance .b-k{color:var(--muted);font-size:13.5px;margin-bottom:6px;}

.mini-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:22px;}
.mini-stat{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:20px;text-align:center;}
.mini-stat .v{font-size:22px;font-weight:800;color:var(--text);}
.mini-stat .k{color:var(--muted);font-size:13px;margin-top:4px;}

.uc-steps{display:grid;grid-template-columns:repeat(4,1fr);counter-reset:ucs;margin:26px 0 4px;}
.uc-step{position:relative;text-align:center;padding-top:46px;}
.uc-step::before{counter-increment:ucs;content:counter(ucs);position:absolute;top:0;left:50%;transform:translateX(-50%);width:34px;height:34px;border-radius:50%;background:var(--bg-3);border:2px solid var(--border);color:var(--muted);font-weight:700;font-size:14px;display:flex;align-items:center;justify-content:center;z-index:2;}
.uc-step::after{content:"";position:absolute;top:17px;left:calc(50% + 26px);right:calc(-50% + 26px);height:2px;background:var(--border);}
.uc-step:last-child::after{display:none;}
.uc-step h5{font-size:14.5px;margin-bottom:4px;}
.uc-step p{color:var(--muted);font-size:12.5px;}
.uc-step.done::before{background:var(--grad);border-color:transparent;color:#fff;}
.uc-step.done::after{background:var(--accent);}
.uc-step.cur::before{background:var(--accent-soft);border-color:var(--accent);color:var(--accent);box-shadow:0 0 0 5px rgba(255,71,85,.12);}

.uc-order{display:flex;gap:18px;align-items:center;background:var(--card-2);border:1px solid var(--border);border-radius:14px;padding:18px;}
.uc-order .o-img{flex:none;width:76px;height:76px;border-radius:12px;background:radial-gradient(circle at 50% 40%,rgba(255,255,255,.12),rgba(255,255,255,.03));border:1px solid var(--border);display:flex;align-items:center;justify-content:center;padding:8px;overflow:hidden;}
/* 76px 小图位：占位块需缩小并去掉尺寸文字，否则会溢出 */
.uc-order .o-img .bi-ph{gap:0;}
.uc-order .o-img .ph-box{width:40px;height:40px;border-radius:10px;}
.uc-order .o-img .ph-box::before{width:22px;height:17px;}
.uc-order .o-img .ph-box::after{width:5px;height:5px;top:6px;left:7px;}
.uc-order .o-img .ph-txt{display:none;}
.uc-order h4{font-size:17px;margin-bottom:5px;}
.uc-order .o-meta{color:var(--muted);font-size:13px;margin-bottom:8px;}
.uc-order .o-price{font-size:20px;font-weight:800;color:var(--accent);}

.safe-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:16px 0;border-bottom:1px solid var(--border);}
.safe-row:last-child{border-bottom:none;}
.safe-row .s-l{display:flex;align-items:center;gap:14px;}
.safe-row .s-ic{flex:none;width:42px;height:42px;border-radius:12px;background:var(--accent-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:17px;}
.safe-row h5{font-size:15px;margin-bottom:2px;}
.safe-row p{color:var(--muted);font-size:12.5px;}
.safe-row .r{display:flex;align-items:center;gap:12px;flex:none;}
.safe-row .r span{color:var(--muted);font-size:13px;}

/* ---- 会员中心：充值 / 提现 / 银行卡 / 发票 / 消息 ---- */
.uc-menu .uc-group{font-size:11.5px;color:rgba(255,255,255,.34);letter-spacing:.08em;padding:16px 14px 6px;font-weight:600;}
.uc-menu .uc-group:first-child{padding-top:4px;}

/* 快捷金额 */
.amt-picks{display:flex;flex-wrap:wrap;gap:10px;}
.amt-picks .cmn-btn{min-width:104px;}
.amt-picks .cmn-btn.on{border-color:var(--accent);background:var(--accent-soft);color:var(--accent);}

/* 支付方式 */
.pay-opts{display:flex;flex-direction:column;gap:10px;}
.pay-opt{display:flex;align-items:center;gap:14px;padding:14px 16px;border:1px solid var(--border);border-radius:14px;background:var(--card-2);cursor:pointer;transition:.25s;}
.pay-opt:hover{border-color:rgba(255,255,255,.22);}
.pay-opt:has(input:checked){border-color:var(--accent);background:var(--accent-soft);}
.pay-opt input{accent-color:var(--accent);width:16px;height:16px;flex:none;}
.pay-opt .p-ic{flex:none;width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:17px;background:rgba(255,255,255,.07);}
.pay-opt .p-ic.weixin{color:#2ed573;}
.pay-opt .p-ic.alipay{color:#4f8dff;}
.pay-opt .p-ic.bank{color:var(--accent);}
.pay-opt b{font-size:14.5px;font-weight:600;}
.pay-opt i{margin-left:auto;color:var(--muted);font-size:12.5px;font-style:normal;}

/* 结算条 */
.pay-sum{display:flex;align-items:center;justify-content:space-between;gap:14px;background:var(--card-2);border:1px solid var(--border);border-radius:14px;padding:16px 20px;margin-bottom:18px;flex-wrap:wrap;}
.pay-sum span{color:var(--muted);font-size:13.5px;}
.pay-sum b{color:var(--accent);font-size:24px;font-weight:800;}

/* 提示块 */
.wd-tips{background:rgba(79,84,250,.08);border:1px solid rgba(79,84,250,.24);border-radius:14px;padding:18px 20px;margin-top:22px;}
.wd-tips h5{font-size:14.5px;display:flex;align-items:center;gap:9px;margin-bottom:12px;color:#b8bcff;}
.wd-tips ul{list-style:none;margin:0;padding:0;}
.wd-tips li{color:var(--muted);font-size:13.5px;line-height:1.9;padding-left:18px;position:relative;}
.wd-tips li::before{content:"";position:absolute;left:2px;top:12px;width:5px;height:5px;border-radius:50%;background:rgba(184,188,255,.7);}
/* 段落内联链接：保持行内排版，同时把触摸热区撑到 32px（移动端可点区域 >=32px 高） */
.inline-link{display:inline-block;min-height:32px;line-height:32px;color:var(--accent);vertical-align:middle;}
.inline-link:hover{text-decoration:underline;}

/* 银行卡卡片 */
.bank-list{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;}
.bank-card{position:relative;overflow:hidden;padding:22px 24px;border-radius:18px;border:1px solid rgba(255,255,255,.14);
  background:linear-gradient(135deg,rgba(79,84,250,.34),rgba(12,2,32,.9));}
.bank-card::after{content:"";position:absolute;right:-30px;top:-30px;width:130px;height:130px;border-radius:50%;background:rgba(255,71,85,.14);}
.bank-card .b-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:18px;position:relative;z-index:1;}
.bank-card .b-bank{font-size:15px;font-weight:600;display:inline-flex;align-items:center;gap:9px;color:#fff;}
.bank-card .tag{font-size:11.5px;padding:3px 10px;border-radius:20px;background:var(--accent);color:#fff;font-weight:600;}
.bank-card .b-no{font-size:19px;font-weight:700;letter-spacing:.06em;color:#fff;margin-bottom:16px;position:relative;z-index:1;font-family:ui-monospace,Menlo,Consolas,monospace;}
.bank-card .b-bot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;font-size:12.5px;color:var(--muted);position:relative;z-index:1;}
.bank-card .b-op{display:flex;gap:14px;}
.bank-card .b-op a{color:#b8bcff;font-size:12.5px;}
.bank-card .b-op a:hover{color:#fff;}
.bank-card .b-op .del{color:#ff8f9c;}
.bank-card .bank-ops{margin-top:14px;position:relative;z-index:1;}
.bank-del{background:none;border:1px solid rgba(255,71,85,.4);color:#ff8f9c;border-radius:10px;padding:6px 12px;font-size:12.5px;cursor:pointer;transition:.2s;}
.bank-del:hover:not(:disabled){background:rgba(255,71,85,.15);}
.bank-del:disabled{opacity:.6;cursor:not-allowed;}

.pay-check{display:flex;align-items:flex-start;gap:9px;font-size:13px;color:var(--muted);cursor:pointer;}
.pay-check input{accent-color:var(--accent);width:15px;height:15px;flex:none;margin-top:2px;}

/* 消息列表 */
.msg-list{list-style:none;margin:0;padding:0;}
.msg-item{display:flex;align-items:flex-start;gap:16px;padding:20px;border:1px solid var(--border);border-radius:16px;background:var(--card-2);margin-bottom:12px;transition:.25s;}
.msg-item:hover{border-color:rgba(255,255,255,.2);background:rgba(255,255,255,.03);}
.msg-item:last-child{margin-bottom:0;}
.msg-item .m-ic{flex:none;width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:17px;}
.msg-item .m-ic.ok{background:rgba(46,213,115,.12);color:#2ed573;}
.msg-item .m-ic.warn{background:rgba(255,190,60,.12);color:#ffbe3c;}
.msg-item .m-ic.doing{background:rgba(79,141,255,.14);color:#4f8dff;}
.msg-item .m-body{flex:1;min-width:0;}
.msg-item .m-top{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:7px;}
.msg-item h5{font-size:15px;font-weight:600;}
.msg-item p{color:var(--muted);font-size:13.5px;line-height:1.75;}
.msg-item .m-time{color:var(--muted);font-size:12.5px;flex:none;}
.msg-item .m-go{flex:none;align-self:center;font-size:13px;color:var(--accent);font-weight:600;display:inline-flex;align-items:center;min-height:32px;padding:0 4px;}
.msg-item.unread{background:linear-gradient(90deg,rgba(255,71,85,.08),var(--card-2));border-color:rgba(255,71,85,.24);}
.msg-item.unread h5::after{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--accent);margin-left:9px;vertical-align:middle;}
.msg-ops{display:flex;gap:12px;flex-wrap:wrap;margin-top:22px;}

/* =====================================================================
   商标分类查询（点击分类 → 下方显示子群组，不跳转）
   ===================================================================== */
.tm-tip{text-align:center;color:var(--muted);font-size:15px;margin-bottom:24px;}
.tm-bar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;background:var(--card);border:1px solid var(--border);border-radius:999px;padding:10px 12px 10px 20px;margin-bottom:28px;}
.tm-sel{display:flex;gap:6px;flex:none;}
.tm-sel button{border:none;background:transparent;color:var(--muted);font-size:14px;padding:8px 16px;border-radius:999px;cursor:pointer;transition:.25s;font-family:inherit;}
.tm-sel button.cur{background:var(--grad);color:#fff;font-weight:600;}
.tm-bar input{flex:1;min-width:200px;background:transparent;border:none;color:var(--text);font-size:15px;padding:8px 4px;outline:none;font-family:inherit;}
.tm-bar input::placeholder{color:rgba(255,255,255,.4);}

.tm-cloud{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:34px;}
.tm-chip{border:1px solid var(--border);background:var(--card);color:var(--muted);font-size:13.5px;padding:9px 16px;border-radius:999px;cursor:pointer;transition:.25s;}
.tm-chip:hover{color:var(--text);border-color:rgba(255,255,255,.28);transform:translateY(-2px);}
.tm-chip.cur{background:var(--grad);color:#fff;border-color:transparent;font-weight:600;box-shadow:0 8px 18px rgba(255,71,85,.25);}

.tm-layout{display:grid;grid-template-columns:330px minmax(0,1fr);gap:24px;align-items:start;}
.tm-side{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:18px;position:sticky;top:96px;max-height:72vh;overflow:auto;}
.tm-side-h{display:flex;align-items:center;gap:10px;font-weight:700;font-size:16px;padding:6px 4px 14px;border-bottom:1px solid var(--border);margin-bottom:10px;}
.tm-side-h i{color:var(--accent);}
.tm-sg-list{list-style:none;margin:0;padding:0;}
.tm-sg-list li{display:flex;gap:10px;padding:10px 12px;border-radius:10px;cursor:pointer;color:var(--muted);font-size:13.5px;line-height:1.6;transition:.25s;}
.tm-sg-list li .c{flex:none;color:var(--accent-2);font-weight:700;font-size:12.5px;}
.tm-sg-list li:hover{background:var(--card-2);color:var(--text);}
.tm-sg-list li.cur{background:var(--accent-soft);color:var(--text);}
.tm-sg-list li.cur .c{color:var(--accent);}

.tm-detail{min-height:400px;}
.tm-d-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:28px 30px;margin-bottom:22px;}
.tm-d-card .code{font-size:13px;color:var(--accent);font-weight:700;letter-spacing:.5px;}
.tm-d-card h3{font-size:22px;margin:8px 0 10px;line-height:1.5;}
.tm-d-card p{color:var(--muted);font-size:14.5px;line-height:1.8;}
.tm-d-meta{display:flex;gap:22px;flex-wrap:wrap;margin-top:16px;color:var(--muted);font-size:13.5px;}
.tm-d-meta span{display:inline-flex;align-items:center;gap:7px;}
.tm-d-brands ul.brand-grid{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));}
.tm-empty{text-align:center;padding:56px 20px;color:var(--muted);}
.tm-empty i{font-size:40px;color:var(--accent-2);opacity:.6;margin-bottom:14px;display:block;}
.tm-empty p{font-size:14.5px;margin-top:8px;}

/* =====================================================================
   内容增强：资讯焦点图 / 工具箱 / 成员统计 / 需求卡
   ===================================================================== */
/* 资讯焦点图（大图头条） */
.news-focus{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:30px;}
.nf-card{position:relative;border-radius:var(--radius);overflow:hidden;border:1px solid var(--border);min-height:236px;display:flex;align-items:flex-end;transition:.35s;}
.nf-card:hover{transform:translateY(-4px);border-color:rgba(255,71,85,.45);}
.nf-card::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,2,32,.15) 0%,rgba(12,2,32,.55) 55%,rgba(12,2,32,.94) 100%);}
.nf-card .nf-img{position:absolute;inset:0;background:radial-gradient(circle at 30% 30%,rgba(79,84,250,.55),rgba(255,71,85,.32));}
.nf-card .nf-img::after{content:"";position:absolute;inset:0;background-size:cover;background-position:center;opacity:.5;}
.nf-body{position:relative;padding:24px 26px;width:100%;}
.nf-tag{display:inline-block;font-size:12px;font-weight:700;color:#fff;background:var(--grad);padding:4px 12px;border-radius:20px;margin-bottom:12px;}
.nf-body h3{font-size:20px;line-height:1.5;margin-bottom:10px;}
.nf-body h3 a:hover{color:var(--accent);}
.nf-body p{color:rgba(255,255,255,.72);font-size:13.5px;line-height:1.7;}
.nf-meta{color:rgba(255,255,255,.55);font-size:12.5px;margin-top:12px;}

/* 资讯侧栏：搜索 / 标签 / 工具箱 */
.side-search{display:flex;gap:8px;margin-bottom:18px;}
.side-search input{flex:1;min-width:0;background:rgba(0,0,0,.25);border:1px solid var(--border);border-radius:10px;padding:10px 14px;color:var(--text);font-size:13.5px;outline:none;font-family:inherit;}
.side-search input:focus{border-color:var(--accent);}
.tag-cloud{display:flex;flex-wrap:wrap;gap:8px;}
.tag-cloud a{font-size:12.5px;padding:6px 13px;border-radius:20px;background:rgba(255,255,255,.05);border:1px solid var(--border);color:var(--muted);transition:.25s;}
.tag-cloud a:hover{color:var(--accent);border-color:rgba(255,71,85,.45);}

.tool-list li{display:flex;gap:12px;align-items:flex-start;padding:11px 0;border-bottom:1px solid var(--border);}
.tool-list li:last-child{border-bottom:none;}
.tool-list .tl-ic{flex:none;width:36px;height:36px;border-radius:10px;background:var(--accent-soft);color:var(--accent);display:flex;align-items:center;justify-content:center;font-size:15px;}
.tool-list h5{font-size:14.5px;margin-bottom:3px;}
.tool-list p{color:var(--muted);font-size:12.5px;line-height:1.5;}

/* 需求/求购卡 */
.demand-card{background:linear-gradient(135deg,rgba(255,71,85,.10),rgba(255,255,255,.03));border:1px solid rgba(255,71,85,.24);border-radius:var(--radius);padding:24px 26px;margin-top:20px;}
.demand-card h4{font-size:18px;margin-bottom:8px;}
.demand-card p{color:var(--muted);font-size:13.5px;line-height:1.7;margin-bottom:16px;}

/* 成员中心统计条 */
.uc-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:22px;}
.uc-stat{background:var(--card);border:1px solid var(--border);border-radius:14px;padding:20px;text-align:center;transition:.3s;}
.uc-stat:hover{border-color:rgba(79,84,250,.5);transform:translateY(-3px);}
.uc-stat .v{font-size:24px;font-weight:800;color:var(--accent);}
.uc-stat .k{color:var(--muted);font-size:12.5px;margin-top:4px;}


/* 登录 / 注册页扩展 */
.auth-extra{margin-top:22px;padding-top:20px;border-top:1px solid var(--border);}
.auth-or{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:12.5px;margin-bottom:14px;}
.auth-or::before,.auth-or::after{content:"";flex:1;height:1px;background:var(--border);}
.auth-social{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.auth-social a{display:flex;align-items:center;justify-content:center;gap:7px;padding:10px 0;border:1px solid var(--border);border-radius:12px;color:var(--muted);font-size:13.5px;transition:.25s;}
.auth-social a:hover{color:var(--text);border-color:rgba(255,255,255,.28);transform:translateY(-2px);}
.auth-social a i{font-size:15px;color:var(--accent);}
.auth-tips{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);padding:24px 26px;margin-top:20px;}
.auth-tips h5{font-size:15.5px;margin-bottom:14px;display:flex;align-items:center;gap:9px;}
.auth-tips h5 i{color:var(--accent);}
.auth-tips ul{list-style:none;margin:0;padding:0;}
.auth-tips li{display:flex;gap:9px;align-items:flex-start;padding:7px 0;color:var(--muted);font-size:13.5px;line-height:1.6;}
.auth-tips li i{color:#2ed573;font-size:12px;margin-top:4px;flex:none;}

/* =====================================================================
   栅格修饰类（替代内联 grid-template-columns，才能被媒体查询覆盖）
   ===================================================================== */
.reg-plans{--rg-cols:1fr;display:grid;grid-template-columns:var(--rg-cols);gap:14px;}
.reg-plans-2{--rg-cols:1fr 1fr;}
.reg-plans-3{--rg-cols:repeat(3,1fr);}
.mat-grid-1{grid-template-columns:1fr;}
.reg-top-form{grid-template-columns:minmax(0,1fr) 430px;}

/* =====================================================================
   响应式（统一断点：1199 / 991 / 767 / 575）
   ===================================================================== */
@media (max-width:1199px){
  .stats-grid{grid-template-columns:repeat(3,1fr);}
  .cat-grid{grid-template-columns:repeat(4,1fr);}
  .mega-menu{width:620px;}
  .mega-menu .mega-grid{grid-template-columns:repeat(3,1fr);}
  /* 导航在平板宽度即改抽屉，避免菜单项折行 */
  .header-bar{display:flex;}
  .main-menu{
    position:fixed;top:0;right:0;height:100vh;width:min(300px,86vw);background:var(--bg-3);
    flex-direction:column;align-items:stretch;padding:80px 20px 20px;gap:4px;
    transform:translateX(100%);transition:.4s;overflow-y:auto;border-left:1px solid var(--border);z-index:100;
    visibility:hidden;pointer-events:none;overscroll-behavior:contain;
  }
  .main-menu.active{transform:translateX(0);visibility:visible;pointer-events:auto;}
  /* 抽屉开启：背景遮罩 + 锁定滚动 */
  body.menu-open{overflow:hidden;}
  body.menu-open #navMask{display:block;position:fixed;inset:0;background:rgba(4,0,14,.55);backdrop-filter:blur(2px);z-index:98;animation:fadeIn .25s;}
  @keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
  .main-menu>li>a{padding:12px 14px;white-space:nowrap;}
  .main-menu .sub-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;background:transparent;border:none;padding:0 0 0 14px;}
  .main-menu>li.has-mega .mega-menu{position:static;width:100%;opacity:1;visibility:visible;transform:none;box-shadow:none;background:transparent;border:none;padding:0 0 0 14px;display:none;}
  .main-menu>li.has-mega.open>.mega-menu{display:block;animation:chipIn .28s ease;}
  .mega-menu .mega-grid{grid-template-columns:1fr;}
  .contact-btn{display:none;}
  html,body{overflow-x:clip;}

  /* 平板：主从双栏收窄（991px 以下会被单栏规则覆盖） */
  .notice-layout{grid-template-columns:300px minmax(0,1fr);gap:22px;}
  .notice-aside{padding:4px 14px;}
  .tm-layout{grid-template-columns:280px minmax(0,1fr);gap:22px;}

  /* 底部联系条：提示语 + 表单同行，空间不足时提示语自身折行（不把表单挤到第二行） */
  .contact-expand .expand-container{flex-wrap:nowrap;justify-content:center;gap:10px 14px;padding:10px 46px 10px 20px;}
  .contact-expand .et-tip{flex:1 1 auto;min-width:0;font-size:14px;line-height:1.4;white-space:normal;}
  .contact-expand .expand-form{flex:0 1 clamp(240px,38vw,400px);min-width:0;max-width:400px;gap:10px;}
  .contact-expand input{height:42px;}
  .contact-expand .help-submit{height:42px;padding:0 20px;}
  .contact-expand .expand-qq{height:42px;padding:0 16px;}
  .footer-section{padding-bottom:110px;}
}
@media (max-width:1100px){
  .detail-wrap{grid-template-columns:300px minmax(0,1fr);}
  .detail-service{grid-column:1 / -1;position:static;flex-direction:row;flex-wrap:wrap;}
  .detail-service .svc-card{flex:1;min-width:260px;}
  /* 客服区改为横向紧凑卡：头像与信息并排，减少高度 */
  .detail-service .svc-card{display:grid;grid-template-columns:auto minmax(0,1fr);gap:0 18px;text-align:left;align-items:center;padding:22px 24px;}
  .detail-service .svc-avatar{grid-row:1 / span 5;margin:0;width:84px;height:84px;}
  .detail-service .svc-badge{align-self:start;margin-bottom:8px;justify-self:start;}
  .detail-service .svc-name{font-size:17px;margin-bottom:4px;}
  .detail-service .svc-status{margin-bottom:12px;}
  .detail-service .svc-contact{margin-bottom:12px;}
}
@media (max-width:991px){
  /* 导航抽屉规则见 1199px 断点（此处不重复） */

  /* 首页与通用区块 */
  .banner-content h1{font-size:40px;}
  .feature-grid{grid-template-columns:repeat(2,1fr);}
  .news-grid{grid-template-columns:1fr;}
  .footer-top{grid-template-columns:1fr 1fr;}
  .pricing-grid{grid-template-columns:1fr;}
  .cta-wrap{flex-direction:column;align-items:flex-start;}
  .page-hero h1{font-size:32px;}
  .page-hero .page-hero-t{font-size:32px;}

  /* 双栏 → 单栏 */
  .news-layout,.article-layout,.notice-layout,.tm-layout,.uc-layout,.reg-top,.reg-top-form{grid-template-columns:1fr;}
  .article-side,.notice-aside,.tm-side{position:static;max-height:none;}

  /* ---- 会员中心：手机版菜单折叠为图标 ---- */
  /* 手机端整个 page-hero（含 h1、副标题、面包屑）都不再显示：
     「我在哪一页」全部交给正文顶部的 .uc-mobile-bar + 菜单项路径副标题
     （.uc-mi-t）承担；桌面端（>991px）保持原样。

     这里刻意用「视觉隐藏」而不是 display:none —— h1 仍留在无障碍树和
     搜索引擎爬取视图中，只是不可见。绝不能改成 display:none：
     那会让整页丢失唯一 h1（.uc-mobile-cur 只能是 span，不能顶替 h1）。 */
  .page-hero.no-crumb-m{
    position:absolute;width:1px;height:1px;padding:0;margin:-1px;
    overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0;
  }
  /* hero 不再占位后正文会上移，必须留出 header 的高度，否则正文（.uc-mobile-bar）
     会被position:absolute + z-index:99 的 .header-section 盖住，
     按钮点不到（Playwright 报 "header-wrapper intercepts pointer events"）。
     header 高度 = 上下 padding 24px + logo 36px = 60px，再加 12px 呼吸间距。
     注意：不能写成 calc(var(--topbar-h) + 28px)——手机端顶栏已隐藏、--topbar-h 归零，
     那样只剩 28px，不够避开 header。 */
  .page-hero.no-crumb-m + .section-padding{padding-top:72px;}
  .uc-mobile-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:20px;}
  .uc-mobile-bar .uc-mobile-cur{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right;}
  .uc-aside{position:static;max-height:none;overflow:hidden;}
  /* 收起态：隐藏菜单本体，保留用户信息卡 */
  body:not(.uc-menu-open) .uc-aside .uc-menu,
  body:not(.uc-menu-open) .uc-aside .quit{display:none;}
  body:not(.uc-menu-open) .uc-aside{padding-bottom:20px;}
  /* 展开态：菜单本体显示 */
  body.uc-menu-open .uc-aside .uc-menu{display:block;animation:chipIn .26s ease;}
  /* 锁定背景滚动。注意必须保留 x 轴的 clip：直接写 overflow:hidden 会覆盖 1266 行的
     overflow-x:clip，body 一旦成为滚动容器，收起态的 .main-menu（position:fixed +
     translateX(300px)）溢出就会被计入 scrollWidth，页面出现 300px 横向滚动条。 */
  body.uc-menu-open{overflow-y:auto;overflow-x:clip;}
  /* 展开时给用户卡加个视觉分隔 */
  .uc-menu-open .uc-aside .uc-user{padding-bottom:18px;margin-bottom:6px;border-bottom:1px solid var(--border);}
  /* 折叠菜单里菜单项兼任面包屑：名称字号对齐 .breadcrumb-nav（14px），下挂一行路径副标题 */
  .uc-menu li a{padding:11px 12px;gap:12px;font-size:14px;align-items:flex-start;}
  .uc-menu li a i{width:20px;text-align:center;font-size:15px;padding-top:2px;flex:none;}
  .uc-mi-t{display:block;}
  .detail-wrap{grid-template-columns:1fr;}

  /* 通用网格降列 */
  .flow-steps,.flow-steps.cols5{grid-template-columns:repeat(2,1fr);}
  .info-cards,.mat-grid,.mat-grid-1,.sel-tips,.why-cards,.feat-grid,.safe-duo,.mini-stats,.news-focus{grid-template-columns:1fr;}
  .about-stats,.ct-cards,.uc-stats{grid-template-columns:repeat(2,1fr);}
  .guarantee-grid,.guide-grid,.news-cards,.brand-grid{grid-template-columns:repeat(2,1fr);}
  /* 会员中心：银行卡卡片在平板降为单列 */
  .bank-list{grid-template-columns:1fr;}
  .sec-head h3{font-size:24px;}

  /* 平板：区块间距与筛选面板收敛 */
  .section-padding{padding:80px 0;}
  .page-hero{padding:138px 0 46px;}
  .fp-body{padding:4px 22px 20px;}
  .filter-row{padding:14px 0;}
  .mat-card{padding:24px;}
  .uc-panel{padding:26px 22px;}
  .uc-balance{padding:26px 26px;}
  .sec-head{margin-bottom:30px;}
  .footer-section{padding-top:56px;padding-bottom:110px;}
  .footer-top{padding-bottom:40px;}
}
@media (max-width:767px){
  .section-padding{padding:64px 0;}
  .banner-section{padding:140px 0 60px;}
  .banner-content h1{font-size:32px;}
  .quick-actions{grid-template-columns:repeat(2,1fr);}
  .stats-grid{grid-template-columns:repeat(2,1fr);}
  .cat-grid{grid-template-columns:repeat(2,1fr);}
  .feature-grid,.news-cards,.guide-grid,.guarantee-grid{grid-template-columns:1fr;}
  .brand-grid{grid-template-columns:repeat(2,1fr);gap:12px;}
  .brand-grid .bi-img{height:140px;padding:12px;}
  .brand-grid .bi-body{padding:12px 12px 14px;gap:6px;}
  .brand-grid .bi-name{font-size:14px;}
  .brand-grid .bi-desc{font-size:12px;height:30px;}
  .brand-grid .bi-price{font-size:18px;}
  .brand-grid .bi-cert{font-size:10px;padding:2px 7px;}
  .footer-top{grid-template-columns:1fr;}
  .news-row{flex-direction:column;}
  .news-row .ni-thumb{width:100%;height:160px;}
  .flow-steps,.flow-steps.cols5{grid-template-columns:1fr;}
  .guarantee-grid{grid-template-columns:1fr;}
  .section-header h2{font-size:30px;}

  /* 筛选面板：手机端改为「折叠头+ 展开体」，默认只露一行摘要，避免 1161px 长面板 */
  .filter-panel{border-radius:14px;margin-bottom:18px;}
  /* 折叠态：标题 + 计数一行，摘要独占第二行并单行省略
     （摘要若换行会把面板撑成三行；右侧留52px 让位悬浮工具条，避免文字被压住） */
  .fp-head{padding:12px 58px 12px 16px;cursor:pointer;gap:8px 10px;flex-wrap:wrap;}
  .fp-title{font-size:15px;gap:8px;}
  .fp-summary{display:block;flex:1 1 100%;order:3;padding:7px 0 0;border-left:0;border-top:1px solid var(--border);
    font-size:12.5px;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .fp-actions{margin-left:auto;}
  .fp-arrow{display:block;}
  body.fp-open .fp-arrow{transform:rotate(180deg);color:var(--accent);}
  .fp-body{display:none;padding:2px 16px 16px;border-top:1px solid var(--border);
    /* 展开态限制在视口内并自身滚动：避免面板把结果区推到 2000px 以下，
       配合底部 sticky 操作条，任何时候都能直接点「查看 N 个结果」 */
    max-height:calc(100vh - var(--topbar-h) - 120px);overflow-y:auto;-webkit-overflow-scrolling:touch;}
  body.fp-open .fp-body{display:block;}
  .fp-body::-webkit-scrollbar{width:6px;}
  .fp-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:6px;}
  .fr-label{width:100%;padding-top:0;text-align:left;border-right:none;padding-right:0;border-bottom:1px solid var(--accent-soft);padding-bottom:6px;margin-bottom:2px;}
  .filter-row{flex-direction:column;gap:10px;padding:13px 0;}
  /* 手机端：抽屉承接分类选择，面板内的内联面板不再使用 */
  .cls-panel{display:none !important;}
  .cls-toggle{width:100%;justify-content:flex-start;min-height:44px;}
  .cls-toggle .cls-caret{margin-left:auto;}
  .cls-fr{gap:10px;}
  .cls-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;}
  .cls-grid label{min-height:40px;font-size:13px;padding:7px 9px;min-width:0;}
  .cls-grid label:has(input:checked)::after{width:14px;height:9px;}
  .subgroup-box .sg-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;}
  .subgroup-box label{min-height:38px;font-size:12.5px;padding:7px 9px;min-width:0;}
  .subgroup-box label span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
  /* 单选组：三列网格，触摸热区 ≥40px；9 项类型只需 3 行，避免面板过长。
     注意 .fr-body 本身是 flex 容器，1fr 在其中拿不到确定宽度会退化成单列，
     故这里用 minmax(0,1fr) + 固定占满宽度的方式显式约束轨道。 */
  .fr-body.radio-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;width:100%;}
  .radio-row label{min-height:40px;justify-content:center;font-size:13px;padding:8px 4px;min-width:0;}
  .radio-row label>*{min-width:0;}
  .radio-row label:has(input:checked)::after{margin-left:5px;width:10px;height:6px;flex:none;}
  .radio-row label{overflow:hidden;text-overflow:ellipsis;}
  /* 关键字：两个组各占整行，组内输入框与模式选择器同行 */
  .kw-row{flex-direction:column;align-items:stretch;gap:10px;width:100%;}
  .kw-group{width:100%;flex:none;}
  .kw-row select{width:96px;flex:none;}
  .kw-row .excl{order:-1;width:auto;}
  .kw-row .kw-group:last-child .excl{order:0;}
  .reset-btn{width:100%;}
  .fp-actions-bar{position:sticky;bottom:-16px;z-index:2;padding:12px 0 16px;margin-top:2px;background:#150733;
    box-shadow:0 -10px 18px -8px rgba(0,0,0,.55);}
  .fp-actions-bar .cmn-btn{flex:1;min-width:0;height:46px;}
  .fp-actions-bar .reset-btn{flex:none;width:auto;height:46px;padding:0 20px;}
  /* 结果条：横向可滑动排序，避免换行占高；右侧让位悬浮工具条 */
  .result-bar{margin:18px 0 14px;gap:10px;padding-right:46px;}
  .sort-tabs{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;justify-content:flex-start;scrollbar-width:none;}
  .sort-tabs::-webkit-scrollbar{display:none;}
  .sort-tabs a{flex:none;padding:8px 14px;font-size:13px;min-height:36px;display:inline-flex;align-items:center;}
  /* 抽屉：小屏铺满宽度，圆角与高度略收*/
  .cls-sheet{max-height:88vh;}
  .sheet-body{padding:12px 14px 6px;}
  .sheet-foot{padding:10px 14px 14px;}
  .sheet-title{font-size:15px;}

  /* 悬浮工具条：小屏收起为图标条，贴边不遮内容 */
  .sideBar{right:6px;gap:6px;}
  .sideBar a{width:38px;height:38px;font-size:15px;}
  .sideBar .side-title{display:none;}

  /* 底部联系条：手机端压缩为单行（提示语在上、表单在下但内部同行） */
  .contact-expand .expand-container{height:auto;min-height:0;flex-wrap:wrap;justify-content:flex-start;gap:7px 10px;padding:8px 38px 8px 12px;}
  .contact-expand .et-tip{flex:1 1 100%;font-size:13px;line-height:1.4;}
  .contact-expand .expand-form{flex:1 1 100%;min-width:0;max-width:none;gap:8px;}
  .contact-expand input{height:38px;font-size:13px;padding:0 14px;}
  .contact-expand .help-submit{height:38px;padding:0 16px;font-size:13px;}
  .contact-expand .expand-qq{display:none;}
  .contact-expand .expand-close{right:10px;font-size:18px;}
  .footer-section{padding-bottom:104px;}

  /* 表单与按钮组 */
  .reg-plans-2,.reg-plans-3{grid-template-columns:1fr;}
  .auth-social{grid-template-columns:1fr;}
  .nd-meta{gap:12px;}
  .uc-steps{grid-template-columns:repeat(2,1fr);gap:18px 0;}
  .uc-step::after{display:none;}

  /* ---- 平板 / 手机通用细节 ---- */
  /* 容器留白收敛 */
  .container{padding-left:20px;padding-right:20px;}
  .page-hero{padding:130px 0 42px;}

  /* ---- 手机端隐藏顶部黑色长条（.top-bar），含标语 / 登录 / 注册 ----
     .top-bar 是 position:relative 的常规流元素，隐藏后必须把 --topbar-h 归零，
     否则：
       1) .header-section 用 top:var(--topbar-h) 绝对定位，会整体下移 38px 出现空档；
       2) .page-hero 的 padding-top 是硬编码值（原本为顶栏预留），不调会多出空白。
     登录/注册入口在 header 右侧汉堡菜单内已有（主菜单含登录/注册链接），隐藏不丢功能。 */
  .top-bar{display:none;}
  /* 顶栏归零：.header-section 用 top:var(--topbar-h) 绝对定位，header 立即上移到 0 */
  :root{--topbar-h:0px;}
  /* 顶栏没了，.page-hero 顶部预留的 130px 里含38px 顶栏高度，相应下调 */
  .page-hero{padding:96px 0 42px;}

  /* 顶栏隐藏后，抽屉菜单里的「登录 / 注册」成为唯一的账号入口，必须显示出来。
     用分隔线 + 强调色与上方业务菜单区隔开。 */
  .main-menu .menu-auth{display:block;}
  .main-menu .menu-auth:first-of-type{
    margin-top:10px;padding-top:14px;border-top:1px solid var(--border);
  }
  .main-menu .menu-auth>a{color:var(--text);font-weight:600;}
  .main-menu .menu-auth:last-child>a{color:var(--accent);}

  /* 详情页：图廊与客服卡 */
  .detail-gallery .main-img{height:300px;}
  .detail-actions .cmn-btn{flex:1 1 calc(50% - 7px);}
  .svc-card{padding:24px 20px;}
  .detail-service .svc-card{grid-template-columns:auto minmax(0,1fr);padding:20px 18px;gap:0 14px;}
  .detail-service .svc-avatar{width:70px;height:70px;}
  .detail-service .svc-name{font-size:16px;}

  /* 表格：窄屏可横向滑动（触摸设备惯性滚动） */
  .cmp-wrap{-webkit-overflow-scrolling:touch;}
  .uc-table th,.uc-table td{padding:12px 10px;font-size:13.5px;}

  /* 会员中心：余额卡纵向排布，避免挤压 */
  .uc-balance{padding:24px 22px;}
  .uc-aside{padding:20px 16px;}

  /* ---- 移动端触摸热区：用纵向 padding 扩大点击范围，不改变视觉行距 ---- */
  /* 搜索区选项卡与热门标签 */
  .search-tabs li a{display:inline-flex;align-items:center;min-height:34px;}
  .search-tags a{display:inline-flex;align-items:center;min-height:32px;padding:5px 14px;}
  /* 面包屑 */
  .breadcrumb-nav{display:flex;flex-wrap:wrap;align-items:center;}
  .breadcrumb-nav a{display:inline-flex;align-items:center;padding:7px 0;}
  /* 页脚链接列表 */
  .footer-top .quick-link li{margin-bottom:4px;}
  .footer-top .quick-link li a{display:inline-flex;align-items:center;padding:7px 0;}
  /* 页脚底部政策链接 */
  .footer-bottom .links{display:flex;flex-wrap:wrap;gap:0 16px;}
  .footer-bottom .links a{display:inline-flex;align-items:center;padding:7px 0;margin-left:0;}
  /* 友情链接 */
  .friend-links a{display:inline-flex;align-items:center;padding:5px 0;}
  /* 侧栏「热门推荐」等裸列表链接 */
  .side-box li a,.side-box>p a{display:inline-flex;align-items:center;min-height:32px;}
  /* 资讯列表 / 资讯卡片标题链接 */
  .news-list h3 a,.nf-body h3 a{display:inline-flex;align-items:center;min-height:32px;}
  /* 登录/注册页的辅助跳转链接 */
  .form-extra a,.auth-switch a{display:inline-flex;align-items:center;min-height:32px;padding:0 2px;}
  /* 会员中心卡片头部「查看全部 / 查看商标」等文字操作 */
  .uc-head h3+a,.uc-head>a,.uc-head .op{display:inline-flex;align-items:center;min-height:32px;padding:0 2px;}
  /* 会员资料 / 安全设置行内「修改 / 绑定」 */
  .safe-row .r>a,.r>a{display:inline-flex;align-items:center;min-height:32px;padding:0 2px;}
  /* 联系页热线号码 */
  .ct-card p>a,.ct-card a[href^="tel:"]{display:inline-flex;align-items:center;min-height:32px;}
  /* 表格内文字操作（查看详情 / 编辑 / 下载 / 催票 等） */
  .uc-table a.op,.uc-table .op,.uc-table a[onclick]{display:inline-flex;align-items:center;min-height:32px;padding:0 2px;}
  /* 银行卡卡片上的操作与协议链接 */
  .bank-card .b-op a,.pay-check a{display:inline-flex;align-items:center;min-height:32px;padding:0 2px;}
  /* 表单提示行内的跳转链接 */
  .form-line .hint a{display:inline-flex;align-items:center;min-height:32px;padding:0 2px;}

  /* ---- 会员中心新增页：手机端 ---- */
  /* 快捷金额：两列网格，按钮不再被挤压换行 */
  .amt-picks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;}
  .amt-picks .cmn-btn{min-width:0;width:100%;}
  /* 支付方式：说明文字换行到下方 */
  .pay-opt{flex-wrap:wrap;gap:10px 12px;padding:14px;}
  .pay-opt i{width:100%;margin-left:52px;margin-top:-4px;}
  /* 结算条：金额换行突出显示 */
  .pay-sum{flex-direction:column;align-items:flex-start;gap:6px;padding:16px 18px;}
  .pay-sum b{font-size:26px;}
  /* 银行卡卡片 */
  .bank-card{padding:20px 18px;}
  .bank-card .b-no{font-size:17px;}
  .bank-card .b-bot{flex-direction:column;align-items:flex-start;gap:8px;}
  /* 消息条目：图标与正文上下排，操作链接独占一行 */
  .msg-item{flex-wrap:wrap;padding:16px 14px;gap:12px;}
  .msg-item .m-body{flex:1 1 100%;order:2;}
  .msg-item .m-ic{order:1;}
  .msg-item .m-go{order:3;flex:1 1 100%;justify-content:flex-start;padding-left:54px;}
  .msg-item .m-time{width:100%;margin-top:2px;}
  .msg-item h5{font-size:14.5px;}
  /* 提现须知 */
  .wd-tips{padding:16px 16px;}
  .wd-tips li{font-size:13px;line-height:1.85;}
  .uc-menu .uc-group{padding:12px 12px 4px;}
  /* 极窄屏：菜单项内边距与副标题再收一档，保证「名称+路径」两行不挤
     （面包屑在 ≤575px 为 13px，菜单项字号同步，保持两者视觉一致） */
  .uc-menu li a{padding:10px 11px;gap:10px;font-size:13px;}
  .uc-mi-t{font-size:11.5px;}
  .uc-menu li a i{font-size:14px;}
}
@media (max-width:575px){
  .sel-tips,.about-stats,.ct-cards,.uc-stats,.mini-stats{grid-template-columns:1fr;}
  .duo-card{flex-direction:column;text-align:center;}
  .quick-actions,.stats-grid,.cat-grid{grid-template-columns:1fr;}
  .news-cats a{padding:7px 14px;font-size:13px;}
  .nf-body{padding:20px 18px;}
  .nf-body h3{font-size:17px;}
  .notice-list li a{padding:14px 10px;}
  .uc-panel{padding:22px 18px;}
  .auth-card{padding:28px 20px;}
  .auth-wrap-row{grid-template-columns:1fr;gap:20px;margin:0 auto;}
  .auth-wrap-row > .auth-card{order:1;}
  .auth-wrap-row > .auth-side{order:2;margin-top:0;padding:18px 20px;}
  .auth-tabs{margin-bottom:18px;}
  .contact-expand .expand-container{width:auto;}

  /* ---- 极窄屏（≤575px）细节 ---- */
  /* 联系条：按钮文案缩短为「提交」，保证输入框仍有足够宽度 */
  .contact-expand .expand-container{padding:8px 32px 8px 10px;gap:6px 8px;}
  .contact-expand .et-tip{font-size:12.5px;}
  .contact-expand input{height:36px;padding:0 12px;}
  .contact-expand .help-submit{height:36px;padding:0 13px;font-size:12.5px;}
  .contact-expand .expand-close{right:8px;font-size:17px;}
  .footer-section{padding-bottom:98px;}

  /* 容器内边距收敛，避免内容贴边 */
  .container{padding-left:16px;padding-right:16px;}
  .section-padding{padding:52px 0;}
  .page-hero{padding:118px 0 38px;}

  /* 筛选面板：极窄屏用单列网格，保证分类名不被截断、触摸热区足够 */
  .fp-head{padding:11px 52px 11px 13px;}
  .fp-body{padding:2px 13px 14px;}
  .result-bar{padding-right:42px;}
  /* ≤575px：抽屉内分类名短，两列仍能完整显示（一屏多看到一倍分类）；
     若更窄（<340px）再由下面的三列降级规则处理 */
  .cls-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  .subgroup-box .sg-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
  /* ≤575px 已是手机窄屏，单选组从三列降为两列：文案不被截断，行数也不至于太多 */
  .fr-body.radio-row{grid-template-columns:repeat(2,minmax(0,1fr));}
  .kw-row select{width:88px;font-size:13.5px;padding:0 12px;}
  .kw-row input{font-size:13.5px;padding:0 14px;}
  .kw-field i{left:12px;font-size:12px;}
  .fp-actions-bar{gap:9px;}
  .fp-actions-bar .cmn-btn{font-size:13.5px;padding:0 12px;}
  .fp-actions-bar .reset-btn{padding:0 15px;font-size:13.5px;}
  .sheet-body{padding:12px 12px 6px;}
  .sheet-foot{padding:10px 12px 14px;}
  .sheet-clear{padding:0 14px;}

  /* 顶栏与 logo：手机上顶栏整体隐藏（含登录/注册入口），
     登录/注册改由 header 右侧的汉堡抽屉菜单承接。
     顶栏已 display:none，这里只需把 --topbar-h 归零，
     否则 767px 里设的 0px 会被这条 38px 覆盖回去。 */
  :root{--topbar-h:0px;}
  .header-wrapper{padding:12px 0;}
  .logo{font-size:20px;gap:8px;}
  .logo .mark{width:36px;height:36px;font-size:19px;border-radius:10px;}
  .header-bar{padding:6px;}

  /* 英雄区与标题字号 */
  .page-hero{padding:88px 0 38px;}
  .page-hero h1{font-size:26px;}
  .page-hero .page-hero-t{font-size:26px;}
  .banner-content h1{font-size:27px;}
  .section-header h2{font-size:25px;}
  .section-header p{font-size:14.5px;}
  .sec-head h3{font-size:21px;}
  .sec-head{margin-bottom:26px;}

  /* 详情页：图廊与操作按钮 */
  .detail-gallery .main-img{height:250px;padding:20px;}
  .detail-gallery .thumbs{gap:9px;}
  .detail-gallery .thumbs .th{width:62px;height:62px;padding:6px;}
  .detail-info h1,.detail-info h2{font-size:23px;}
  .detail-info .price-row{font-size:27px;}
  .detail-table td{font-size:13.5px;padding:10px 0;}
  .detail-table td:first-child{width:96px;}
  .detail-actions{gap:10px;}
  .detail-actions .cmn-btn{flex:1 1 100%;}
  .svc-card{padding:22px 18px;}
  .svc-avatar{width:76px;height:76px;font-size:18px;}
  /* 客服卡：手机上改为「头像 + 文字」两栏，按钮占满 */
  .detail-service .svc-card{grid-template-columns:auto minmax(0,1fr);padding:18px 16px;gap:0 14px;}
  .detail-service .svc-avatar{width:64px;height:64px;}
  .detail-service .svc-name{font-size:15.5px;}
  .detail-service .svc-status{font-size:12px;margin-bottom:10px;}
  .detail-service .svc-line{font-size:12.5px;padding:8px 10px;}
  .detail-service .svc-qq,.detail-service .svc-tel{width:100%;}

  /* 交易流程 / 步骤卡 */
  .flow-steps .step{padding:16px 14px;}
  .flow-steps .step h5{font-size:14px;}

  /* 表格：单元格内边距收紧 */
  .uc-table th,.uc-table td{padding:11px 9px;font-size:13px;}
  .uc-head h3{font-size:17px;}
  .uc-head{margin-bottom:16px;}

  /* 会员中心：余额卡与标签 */
  .uc-balance{padding:20px 18px;gap:14px;}
  .uc-balance .b-num{font-size:30px;}
  .uc-balance .b-num small{font-size:14px;}
  .uc-tabs a{padding:7px 14px;font-size:12.5px;}

  /* 按钮组：整行显示更好点按 */
  .detail-actions .cmn-btn,
  .reg-plans-2 .cmn-btn,
  .reg-plans-3 .cmn-btn{width:100%;}
  .cmn-btn{padding:13px 24px;font-size:14.5px;}

  /* 筛选面板：价格区间与排序控件占满 */
  .fr-body{gap:8px;}
  .filter-row{gap:8px;}

  /* 面包屑与页脚 */
  .breadcrumb-nav{font-size:13px;}
  .footer-top{gap:26px;padding-bottom:34px;}
  .footer-bottom{flex-direction:column;gap:8px;padding:18px 0;}
  .footer-bottom .links{gap:0 18px;}
  .mail-wrapper input{height:44px;}
  .mail-wrapper button{padding:0 16px;}

  /* 悬浮工具条进一步收窄 */
  .sideBar a{width:34px;height:34px;font-size:14px;border-radius:10px;}
  .sideBar{right:4px;gap:5px;}
}

/* ======================================================================
   转让市场页：筛选控件的 <a> 包装层
   ----------------------------------------------------------------------
   ⭐ 为什么需要这一段：
   style.css 里分类 / 单选控件的样式**全部挂在 <label> 上**，选中态靠
   `label:has(input:checked)`（渐变底 + 对勾 + 白字），且 `input{display:none}`
   把原生 radio 藏起来。原设计是纯表单交互（JS 读 input 状态 → fetch 列表）。

   本页把交互改成了**真链接**（每个选项都是 <a href>，服务端渲染 13 段伪静态），
   好处是爬虫能抓到、可分享、可后退。代价是需要把 <a> 变成"透明的壳"：

   1. 默认 <a> 是 inline，grid/flex 里不会撑满 → 用 display:block + width:100%
      补上，否则 label 的边框会按内容宽度缩成一截（右侧留一大片空白）。
   2. 默认 <a> 有蓝色下划线 → 去掉，文字颜色交给 label 统一控制。
   3. 移动端点按热区要够大 → label 自身 min-height 已在原样式里够用。

   ⚠ 选中态**不靠 class**，靠 label 内的 checked radio，
      所以服务端只要渲染 <input checked> 即可，不用再给 <a> 标 .on。
   ====================================================================== */
.filter-row .cls-grid > a,
.filter-row .radio-row > a{display:block; width:100%; text-decoration:none; color:inherit;}
.filter-row .cls-grid > a > label,
.filter-row .radio-row > a > label{width:100%; margin:0;}
/* 键盘可达性：<a> 聚焦时要有可见焦点框（label 上的样式管不到） */
.filter-row .cls-grid > a:focus-visible,
.filter-row .radio-row > a:focus-visible{outline:2px solid var(--accent); outline-offset:2px; border-radius:10px;}

/* ======================================================================
   转让市场页：筛选网格在 column 容器里的宽度修正
   ----------------------------------------------------------------------
   ⚠ 症状：45 个分类竖着排成一长条，每行只占 1 个（grid 退化成单列）。
   原因：`.cls-fr{flex-direction:column;align-items:flex-start}` ——
     align-items:flex-start 会让子元素**按内容宽度收缩**，
     grid 容器因此只拿到 ~150px（minmax 的下限），
     `repeat(auto-fill,minmax(150px,1fr))` 只够排 1 列。
   ✅ 修法：给 .cls-fr 下的网格容器显式 width:100%，
     让它拿满 .cls-fr 的 1184px 可用宽度 → 6~7 列，与原设计一致。
   ====================================================================== */
.cls-fr > .cls-grid{width:100%;}

/* ⚠ 类型 / 价格 / 字数三行的容器是 `.fr-body.radio-row`（**不在 .cls-fr 里**），
   与国际分类行的容器不同，别把两者的选择器写混 ——
   之前误写成 `.cls-fr > .radio-row` 结果一条都没命中，三行竖排成一列。 */
.fr-body.radio-row{
  width:100%;
  flex-direction:row;
  flex-wrap:wrap;
  align-items:center;
  align-content:flex-start;
}
/* 单选项不再被 <a> 撑成整行宽度：胶囊按钮应按文字宽度自适应 */
.fr-body.radio-row > a{
  display:inline-flex;
  width:auto;
}

/* ======================================================================
   转让市场页：底部操作条里的两个「按钮」是 <a>（伪静态要真链接）
   ⚠ 原设计是 <button class="reset-btn"> / <a class="cmn-btn">，
     两者都是 inline-flex + 圆角，作为 <a> 唯一缺的是去下划线。
     ⚠ .fp-actions-bar 是右对齐（justify-content:flex-end），
        若子项被撑成整行宽会各占一行，所以保持 inline-flex 不加 width:100%。
   ====================================================================== */
.fp-actions-bar .reset-btn,
.fp-actions-bar .cmn-btn{
  display:inline-flex;
  align-items:center;
  text-decoration:none;
  line-height:1.4;
}
.fp-actions-bar .cmn-btn b{font-weight:800;}

/* ======================================================================
   转让市场页：多选（checkbox）相关的样式补充
   ⚠ .cls-grid label / .subgroup-box label 的选中态已由原 CSS 用
     `label:has(input:checked)` 实现，这里只补 <a> 包装层与 chip 的微调。
   ====================================================================== */
/* 分类/群组项包在 <a> 里时不能被撑成整行 */
.cls-fr > .cls-grid > a,
.subgroup-box .sg-grid > a{display:block; width:100%; text-decoration:none; color:inherit;}
/* chip 区的链接：chip 自身是 inline-flex，外层 a 也要能自适应 */
.cls-selected > a{display:inline-flex; text-decoration:none;}
/* chip 里的 × 号做成可点区域（点它 = 取消该分类） */
.cls-selected .chip i{pointer-events:auto;}
/* 选中态是 checkbox 时，原样式已能命中；这里补一条兜底，
   防止 <a> 包裹后 :has 选择器在个别浏览器上失效 */
.cls-grid label:has(input[type=checkbox]:checked),
.subgroup-box label:has(input[type=checkbox]:checked){
  background:var(--grad); color:#fff; border-color:transparent;
}
/* 「不限」在多选语境下的含义是"清空全部"，选中时同样高亮 */
.cls-grid label:first-child input{pointer-events:none;}

/* ======================================================================
   转让市场页：类似群组区限高内滚
   ⚠ 多选两个大类后群组是并集（如 03 的 10 项 + 25 的 13 项 = 23 项），
     一字排开会让整页被撑到 2000px 以上，把"商标类型/价格/长度"全推到折叠线以下。
   ✅ 改为限高 320px 内滚（网格布局下很常见），超出则滚动查看。
   ⚠ 与 .cls-grid 的处理相反 —— 分类只有 45 项且固定 7 列，一屏放得下；
     群组数随选中大类数增长，不限高会失控。
   ====================================================================== */
.filter-row .subgroup-box .sg-grid{
  max-height:320px;
  overflow-y:auto;
  padding-right:6px;
  grid-template-columns:repeat(auto-fill,minmax(230px,1fr));
}
/* 细滚动条（与 .cls-grid 的风格一致） */
.filter-row .subgroup-box .sg-grid::-webkit-scrollbar{width:8px;}
.filter-row .subgroup-box .sg-grid::-webkit-scrollbar-thumb{background:rgba(255,255,255,.14);border-radius:8px;}

/* ======================================================================
   会员中心：订单 / 商标 / 资金流水的状态色
   ⚠ 原型页只有 .pill 的 4 种修饰（doing/ok/wait/warn），
     会员列表里的状态比它多（待售/交接中/已售/已下架、充值/提现…），
     这里补一组 .st-* 语义类，颜色沿用 pill 的色板保持视觉一致。
   ====================================================================== */
.st-wait    {background:rgba(255,235,59,.14);  color:#ffd54a;}
.st-trade   {background:rgba(79,84,250,.16);  color:#9aa0ff;}
.st-done    {background:rgba(46,204,113,.14); color:#4ade80;}
.st-off     {background:rgba(255,255,255,.07);color:rgba(255,255,255,.55);}
.st-income  {color:#4ade80;font-weight:700;}
.st-expense {color:#ff7a85;font-weight:700;}

/* 会员中心：金额统一用等宽数字，竖排对齐更好读 */
.uc-amount{font-variant-numeric:tabular-nums;font-weight:700;}
/* 会员中心表格里的操作按钮组 */
.uc-ops{display:flex;gap:8px;flex-wrap:wrap;}
.uc-ops a,.uc-ops button{
  font-size:13px;border-radius:50px;
  border:1px solid var(--border);background:transparent;color:var(--muted);
  cursor:pointer;transition:.2s;text-decoration:none;
}
.uc-ops a:hover,.uc-ops button:hover{border-color:var(--accent);color:#fff;}
/* 会员中心空态 */
.uc-empty{text-align:center;padding:48px 20px;color:var(--muted);}
.uc-empty .ic{font-size:34px;margin-bottom:12px;opacity:.5;}

/* ======================================================================
   ⭐⭐ 修复：带前置图标（放大镜）的输入框，文字没给图标让位
   ----------------------------------------------------------------------
   ⚠ 这是**原始 CSS 自身的缺陷**（原型页 Web/assets/css/style.css 与此文件完全相同，
     说明原稿就是坏的，只是没人真去看输入框里打字的观感）：
       .kw-field i{position:absolute;left:13px}   ← 图标绝对定位
       .kw-row input{...padding:0 16px}           ← 输入框却按"无图标"给内边距
     结果：图标浮在 13px 处，输入框文字从 16px 开始 → **两者重叠**，
     placeholder 与实际输入的文字都压在放大镜下面。

   ✅ 修法：给 .kw-field 里的输入框补左边距（图标宽 + 图标偏移 + 一点间隙）。
     ⛔ 不要改成 flex 布局放图标 —— 图标是绝对定位的（原型设计如此），
       改布局会影响 .kw-row 的对齐与移动端的换行行为。
   ⚠ 移动端也一起修（媒体查询里字号变小，图标位置 12px，左右距同步收窄）。
   ====================================================================== */
.kw-field input{
  padding-left:40px;   /* 图标(13px) + 图标宽(约13px) + 左右间隙 */
}
/* 无图标的输入框不受影响：.kw-field 里只有带 <i> 图标的那种才需要让位 */
.kw-row input:not(.kw-field input){padding-left:16px;}

@media (max-width:768px){
  .kw-field input{padding-left:37px;}   /* 图标 12px + 宽 + 间隙 */
  .kw-row input:not(.kw-field input){padding-left:14px;}
}