/* ============================================================
   昭途商行 · B方案「辰光浅境」
   明亮雾白 / 冰蓝 / 暖金 / 玻璃拟态 / 星空轨道
   ============================================================ */
:root{
  --primary:#24499f;
  --primary-dark:#173170;
  --primary-light:#5b7fd1;
  --gold:#d7aa4c;
  --gold-dark:#b88631;
  --gold-light:#f2d383;
  --orange:#ef9a35;
  --orange-grad:linear-gradient(135deg,#f6c36f,#df8d31);
  --bg:#f3f7ff;
  --topbar:#f8fbff;
  --footer:#10234f;
  --text:#202a3d;
  --text-2:#5e6b82;
  --text-3:#9aa7bc;
  --border:#e1e8f5;
  --red:#dc5b5b;
  --green:#28a969;
  --radius:12px;
  --glass:rgba(255,255,255,.82);
  --glass-strong:rgba(255,255,255,.92);
  --glass-border:rgba(105,139,205,.18);
  --shadow:0 10px 30px rgba(45,82,150,.10);
  --shadow-hover:0 18px 44px rgba(45,82,150,.18);
}

body{
  background:
    radial-gradient(circle at 16% -8%,rgba(255,255,255,.98) 0,transparent 34%),
    radial-gradient(circle at 88% 6%,rgba(214,229,255,.82) 0,transparent 32%),
    radial-gradient(circle at 50% 108%,rgba(244,231,202,.38) 0,transparent 30%),
    linear-gradient(180deg,#f9fcff 0%,#edf4ff 48%,#f8fbff 100%);
  background-attachment:fixed;
}

a{color:var(--primary)}
.text-gold{color:var(--gold-dark)}

/* ---------- 顶部与导航 ---------- */
.topbar{
  background:rgba(248,251,255,.82);
  border-bottom:1px solid var(--glass-border);
  backdrop-filter:blur(16px) saturate(1.25);
  -webkit-backdrop-filter:blur(16px) saturate(1.25);
}
.topbar .tb-user,.topbar .tb-right a:hover{color:var(--primary)}
.main-header{
  background:rgba(255,255,255,.78);
  border-bottom:1px solid var(--glass-border);
  box-shadow:0 10px 30px rgba(45,82,150,.08);
  backdrop-filter:blur(18px) saturate(1.28);
  -webkit-backdrop-filter:blur(18px) saturate(1.28);
}
.header-logo img{
  height:62px;
  filter:drop-shadow(0 8px 14px rgba(35,72,159,.14));
}
.header-logo .logo-text{color:var(--primary-dark)}

.btn-primary{
  background:linear-gradient(135deg,var(--primary-dark),var(--primary) 56%,var(--primary-light));
  box-shadow:0 10px 22px rgba(36,73,159,.20);
}
.btn-primary:hover{
  background:linear-gradient(135deg,var(--primary),#3f68c2);
  transform:translateY(-1px);
}
.btn-gold{
  background:linear-gradient(135deg,var(--gold-dark),var(--gold) 58%,var(--gold-light));
  box-shadow:0 10px 22px rgba(215,170,76,.22);
}
.btn-outline{
  color:var(--primary);
  border-color:var(--primary);
  background:rgba(255,255,255,.66);
}
.btn-orange{box-shadow:0 10px 22px rgba(223,141,49,.18)}

/* ---------- 通用卡片与表单 ---------- */
.card{
  background:var(--glass);
  border:1px solid var(--glass-border);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.tag{
  background:#edf4ff;
  color:var(--primary);
  border:1px solid #dce7fb;
}
.input:focus,
.form-item input:focus,
.form-item select:focus,
.form-item textarea:focus{
  border-color:var(--primary-light);
  box-shadow:0 0 0 4px rgba(91,127,209,.14);
}
input[type=radio],input[type=checkbox]{accent-color:var(--primary)}
.pagination .cur{
  background:linear-gradient(135deg,var(--primary-dark),var(--primary));
  border-color:var(--primary);
}

/* ---------- 页脚 ---------- */
.main-footer{
  background:
    radial-gradient(circle at 82% 0,rgba(215,170,76,.12),transparent 32%),
    linear-gradient(180deg,#13295c,#0d1d45);
  border-top:1px solid rgba(255,255,255,.08);
}
.footer-col a:hover{color:var(--gold-light)}

/* ---------- 悬浮与弹层 ---------- */
.float-bar,.modal{
  background:var(--glass-strong);
  border:1px solid var(--glass-border);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.float-bar .fb-brand,
.float-bar .fb-kefu{
  background:linear-gradient(135deg,var(--primary-dark),var(--primary));
}
.toast{
  background:rgba(16,35,79,.92);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}

/* ---------- 商品卡片 ---------- */
.product-card{
  background:var(--glass);
  border:1px solid var(--glass-border);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.pc-img{background:#e9f1ff}
.pc-price{color:var(--primary-dark)}
.pc-rent{
  background:linear-gradient(135deg,var(--primary),var(--primary-light));
  color:#fff;
  box-shadow:0 8px 16px rgba(36,73,159,.18);
}
.pc-safe{
  background:#fff8e8;
  color:var(--gold-dark);
}
.pc-skins .tag-weapon{background:#edf4ff;color:var(--primary);border-color:#dce7fb}
.pc-skins .tag-operator{background:#fbf3df;color:var(--gold-dark);border-color:#efdfb6}
.pc-attrs{
  background:rgba(248,251,255,.86);
  border-color:#e3ebf9;
}

/* ============================================================
   首页
   ============================================================ */
.side-menu,
.user-card,
.zone-card,
.deal-showcase,
.recommend,
.home-seo{
  background:var(--glass);
  border:1px solid var(--glass-border);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}
.side-menu a:hover{background:linear-gradient(90deg,#edf5ff,#f9fcff)}
.sm-ico,
.uc-avatar,
.uc-login-btn{
  background:linear-gradient(145deg,var(--primary-dark),var(--primary) 58%,var(--primary-light));
  box-shadow:0 10px 20px rgba(36,73,159,.20);
}
.side-menu a:hover .sm-arrow{color:var(--primary)}
.banner{
  border:1px solid rgba(255,255,255,.72);
  box-shadow:0 18px 42px rgba(45,82,150,.18);
}
.uc-balance{
  background:rgba(247,250,255,.88);
  border-color:#e3ebf9;
}
.uc-balance:hover{
  background:#f0f6ff;
  border-color:#d4e1f8;
}
.uc-ico{
  background:#e9f1ff;
  color:var(--primary);
}
.uc-go .go-rent{
  background:linear-gradient(160deg,#edf5ff,#dfeaff);
  color:var(--primary-dark);
  box-shadow:0 10px 22px rgba(36,73,159,.12);
}
.uc-go .go-rent small{color:var(--primary)}
.uc-go .go-rent::after{background:linear-gradient(135deg,var(--primary),var(--primary-light))}
.uc-go .go-sale{
  background:linear-gradient(160deg,#fff8e8,#ffefcd);
  color:#765017;
  box-shadow:0 10px 22px rgba(215,170,76,.14);
}
.uc-go .go-sale small{color:var(--gold-dark)}
.uc-go .go-sale::after{background:linear-gradient(135deg,var(--gold-dark),var(--gold))}
.zone-card:hover{border-color:#d4e1f8}
.ds-tag{
  color:var(--gold-dark);
  background:#fbf3df;
  border-color:#efdfb6;
}
.ds-card{
  background:rgba(255,255,255,.86);
  border-color:#f0e4c8;
}
.ds-card img{background:#edf4ff}
.ds-date{color:var(--gold-dark)}
.rec-head .more{color:var(--primary)}
.home-seo h2,.home-seo h3{color:var(--primary-dark)}
.home-seo a{color:var(--primary)}

/* ============================================================
   登录 / 注册页
   ============================================================ */
.auth-page{
  background:
    radial-gradient(circle at 12% -10%,rgba(255,255,255,.98),transparent 34%),
    radial-gradient(circle at 90% 4%,rgba(214,229,255,.86),transparent 34%),
    radial-gradient(circle at 50% 108%,rgba(244,231,202,.42),transparent 30%),
    linear-gradient(180deg,#f9fcff,#edf4ff 55%,#f8fbff);
  background-attachment:fixed;
}
.auth-top img{
  height:42px;
  filter:drop-shadow(0 8px 14px rgba(35,72,159,.14));
}
.auth-top .at-slogan{
  color:var(--text-2);
  border-left-color:#d3def1;
}
.auth-card{
  background:rgba(255,255,255,.86);
  border:1px solid rgba(255,255,255,.82);
  box-shadow:0 22px 66px rgba(45,82,150,.20);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
}
.auth-left{
  background:linear-gradient(150deg,#e9f2ff 0%,#fbfdff 56%,#fff7e6 100%);
  color:var(--primary);
  border-right:1px solid #e1e9f7;
}
.auth-left::before{
  content:"";
  position:absolute;
  z-index:0;
  right:22px;
  top:42px;
  width:184px;
  height:184px;
  border:1px dashed rgba(36,73,159,.22);
  border-radius:50%;
  transform:rotate(18deg);
}
.auth-left::after{
  background:radial-gradient(circle,rgba(215,170,76,.28),transparent 68%);
}
.auth-slogan-big,
.auth-desc{position:relative;z-index:1}
.auth-slogan-big{color:var(--primary-dark)}
.auth-slogan-big span{color:var(--gold-dark)}
.auth-desc{color:var(--text-2)}
.auth-feat{position:relative;z-index:1}
.auth-feat .af-ico{
  background:rgba(255,255,255,.74);
  border:1px solid rgba(36,73,159,.20);
  color:var(--primary);
  box-shadow:0 8px 16px rgba(36,73,159,.10);
}
.auth-feat b{color:var(--text)}
.auth-feat small{color:var(--text-2)}
.auth-bottom{color:var(--text-2)}
.auth-title{color:var(--primary-dark)}
.auth-sub a{color:var(--gold-dark)}
.auth-input input{
  background:#f7faff;
  border-color:#e1e8f5;
}
.auth-input input:focus{
  background:#fff;
  border-color:var(--primary-light);
  box-shadow:0 0 0 4px rgba(91,127,209,.14);
}
.auth-row a,.auth-agree a{color:var(--primary)}
.auth-btn{
  background:linear-gradient(135deg,var(--primary-dark),var(--primary) 55%,var(--primary-light));
  box-shadow:0 12px 24px rgba(36,73,159,.22);
}
.auth-btn:hover{
  filter:brightness(1.06);
  transform:translateY(-1px);
}

/* ============================================================
   桌面端用户卡保持满高，两个入口向下延展填满空白
   ============================================================ */
@media (min-width:901px){
  .user-card{
    display:flex;
    flex-direction:column;
    align-self:stretch;
  }
  .uc-go{
    flex:1;
    grid-template-rows:1fr;
  }
  .uc-go a{
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:space-between;
    gap:7px;
  }
}

/* ============================================================
   移动端适配
   ============================================================ */
@media (max-width:768px){
  body{background-attachment:scroll}
  .header-logo img{height:40px}
  .mobile-tab{
    background:rgba(255,255,255,.9);
    border-top:1px solid var(--glass-border);
    backdrop-filter:blur(16px);
    -webkit-backdrop-filter:blur(16px);
  }
  .mobile-tab .mt-item.mt-on{color:var(--primary)}
  .mobile-tab .mt-pub{color:var(--gold-dark)}
  .mobile-tab .mt-plus{
    background:linear-gradient(135deg,var(--gold),var(--gold-light));
    box-shadow:0 8px 18px rgba(215,170,76,.42);
  }
  .auth-top img{height:34px}
  .auth-left{border-right:0;border-bottom:1px solid #e1e9f7}
  .auth-left::before{display:none}
  .auth-slogan-big{color:var(--primary-dark)}
}
@media (min-width:769px) and (max-width:900px){
  .banner{height:340px}
  .banner .slide.img-slide img{object-position:center center}
}