/* 掌玩前台移动端体验 v2.2.2 */
:root {
  --zw-safe-bottom: env(safe-area-inset-bottom, 0px);
  --zw-mobile-gutter: 14px;
}
html { -webkit-text-size-adjust: 100%; }
body { overscroll-behavior-y: none; }
body.mobile-nav-open { overflow: hidden; }
.is-touching { transform: scale(.985) !important; transition-duration: .06s !important; }

@media (max-width: 968px) {
  .header { height: 64px !important; }
  .header .container { width: 100% !important; padding: 0 14px !important; }
  .logo { min-width: 0; }
  .logo span { max-width: calc(100vw - 126px); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .nav.show {
    position: fixed !important;
    top: 72px !important;
    left: 12px !important;
    right: 12px !important;
    max-height: calc(100dvh - 88px) !important;
    overflow-y: auto !important;
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px !important;
    padding: 12px !important;
  }
  .nav.show a { justify-content: flex-start; padding: 10px 12px !important; border: 1px solid rgba(255,255,255,.06); background: rgba(255,255,255,.025); }
  .nav.show #navGuest, .nav.show #navUser { display: contents !important; }
  .mobile-nav-open::before { content:""; position:fixed; inset:64px 0 0; z-index:89; background:rgba(0,0,0,.58); backdrop-filter:blur(4px); }
}

@media (max-width: 640px) {
  body { padding-bottom: calc(70px + var(--zw-safe-bottom)); }
  body.page-login, body.page-register, body.page-publish, body.page-user-center,
  body.page-game-detail, body.page-account-detail { padding-bottom: var(--zw-safe-bottom); }
  .container { width: 100% !important; padding-left: var(--zw-mobile-gutter) !important; padding-right: var(--zw-mobile-gutter) !important; }
  .header { position: sticky !important; top: 0; z-index: 100; }
  .header .container { padding-left: 12px !important; padding-right: 12px !important; }
  .logo-icon { flex: 0 0 38px; }

  .banner-section { padding: 10px 0 4px !important; }
  .banner { aspect-ratio: 4 / 5 !important; max-height: 520px !important; min-height: 0 !important; border-radius: 18px !important; }
  .banner-slide-content { padding: 18px 16px 52px !important; justify-content: flex-end !important; }
  .banner-slide-content h2 { font-size: clamp(23px, 7vw, 31px) !important; line-height: 1.16 !important; max-width: 10em !important; }
  .banner-slide-content p { font-size: 13px !important; line-height: 1.6 !important; max-width: 94% !important; -webkit-line-clamp: 2 !important; }
  .banner-eyebrow { font-size: 10px !important; padding: 5px 9px !important; }
  .banner-actions { gap: 8px !important; flex-wrap: wrap; }
  .banner-actions a, .banner-actions button { min-height: 40px !important; padding: 0 14px !important; font-size: 13px !important; }
  .banner-arrow { display: none !important; }
  .banner-bottom { left: 16px !important; right: 16px !important; bottom: 14px !important; }
  .notice-bar { margin-top: 10px !important; padding: 10px 12px !important; font-size: 12px !important; }

  .section { padding: 26px 0 !important; }
  .section-head { margin-bottom: 14px !important; align-items: flex-end; }
  .section-title { font-size: 21px !important; letter-spacing: -.02em; }
  .section-title .sub { display: block; margin: 4px 0 0 12px !important; font-size: 11px !important; }
  .category-tabs { margin-left: calc(var(--zw-mobile-gutter) * -1); margin-right: calc(var(--zw-mobile-gutter) * -1); padding: 2px var(--zw-mobile-gutter) 8px !important; scroll-snap-type: x proximity; }
  .category-tab { flex: 0 0 auto; min-height: 38px !important; padding: 8px 13px !important; font-size: 12px !important; scroll-snap-align: start; }

  .game-toolbar, .search-bar { gap: 8px !important; padding: 9px !important; margin-bottom: 10px !important; border-radius: 14px !important; }
  .search-input-wrap, .search-input, .search-select, .search-btn { min-height: 46px !important; }
  .search-select, .search-btn { flex-basis: calc(50% - 4px) !important; width: auto !important; }
  .search-btn { padding: 0 14px !important; }
  .game-result-bar { padding: 0 2px; font-size: 12px !important; }

  .games-grid, .accounts-grid { gap: 13px !important; }
  .game-card, .account-card { border-radius: 17px !important; box-shadow: 0 10px 28px rgba(0,0,0,.22) !important; }
  .game-cover, .account-cover { aspect-ratio: 16/10 !important; }
  .game-info, .account-body { padding: 14px !important; }
  .game-name { font-size: 17px !important; }
  .game-title, .account-desc { min-height: 0 !important; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
  .game-btns, .account-footer { gap: 7px !important; }
  .game-btn, .account-btn { min-height: 40px !important; font-size: 13px !important; }

  .mobile-tabbar {
    display: block !important;
    padding: 5px 5px calc(5px + var(--zw-safe-bottom)) !important;
    background: rgba(7,9,17,.94) !important;
    box-shadow: 0 -12px 36px rgba(0,0,0,.34);
  }
  .mobile-tabbar-items { height: 56px; align-items: center; }
  .mobile-tabbar a { position: relative; min-height: 50px !important; border-radius: 13px; justify-content: center; gap: 2px !important; font-size: 10px !important; }
  .mobile-tabbar a.active { background: linear-gradient(180deg,rgba(139,92,246,.18),rgba(139,92,246,.04)); }
  .mobile-tabbar a.active::before { content:""; position:absolute; top:0; width:22px; height:2px; border-radius:99px; background:#a78bfa; box-shadow:0 0 12px #8b5cf6; }
  .mobile-tabbar a .icon { font-size: 19px !important; line-height: 1; }
  .float-contact { right: 12px !important; bottom: calc(80px + var(--zw-safe-bottom)) !important; }
  .float-toggle { width: 50px !important; height: 50px !important; }
  .float-panel { right: 0 !important; width: min(310px, calc(100vw - 24px)) !important; }

  .form-panel, .auth-page, .page-wrap { min-height: calc(100dvh - 64px) !important; padding: 14px 0 24px !important; }
  .form-box, .auth-card, .publish-card, .profile-card, .card { border-radius: 18px !important; }
  .form-box, .auth-card { padding: 20px 16px !important; }
  input, select, textarea, .form-input, .form-select, .form-textarea { font-size: 16px !important; }
  textarea { min-height: 112px; }
  .captcha-row { align-items: stretch !important; }
  .captcha-row > * { min-height: 48px !important; }

  .game-hero, .account-header, .detail-grid > *, .sidebar > .card, .account-info, .contact-section { border-radius: 18px !important; }
  .game-hero, .account-header { padding: 14px !important; }
  .detail-grid { gap: 12px !important; }
  .image-gallery, .gallery { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px !important; }
  .gallery-item, .account-img { border-radius: 11px !important; }
  .lightbox img { max-width: 96vw !important; max-height: 82dvh !important; }

  .modal, .sponsor-modal, #ruleModal { padding: 12px !important; align-items: flex-end !important; }
  .modal-box, .sponsor-modal-box, #ruleModal > div { width: 100% !important; max-width: none !important; max-height: 88dvh !important; border-radius: 22px 22px 14px 14px !important; padding: 20px 16px !important; }
}

@media (max-width: 380px) {
  :root { --zw-mobile-gutter: 11px; }
  .search-select, .search-btn { flex-basis: 100% !important; }
  .nav.show { grid-template-columns: 1fr; }
  .banner { aspect-ratio: 3 / 4 !important; }
}

/* ============ v2.2.1 赞助用户徽章高对比度修复 ============
   修复 site-theme-v3 的半透明背景覆盖问题，统一为醒目的金色认证徽章。 */
.sponsor-badge {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-height: 32px !important;
  padding: 0 13px 0 10px !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: 0 !important;
  color: #3b2600 !important;
  white-space: nowrap !important;
  opacity: 1 !important;
  filter: none !important;
  background: linear-gradient(135deg, #ffe27a 0%, #ffc12e 48%, #ffa807 100%) !important;
  border: 1px solid #ffc84a !important;
  box-shadow: 0 5px 14px rgba(255, 169, 0, .38), inset 0 1px 0 rgba(255, 255, 255, .62) !important;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .24) !important;
  vertical-align: middle !important;
}
.sponsor-badge .sponsor-svg {
  width: 15px !important;
  height: 15px !important;
  color: #3b2600 !important;
  stroke: #3b2600 !important;
  opacity: 1 !important;
}
.sponsor-badge:hover {
  transform: translateY(-1px) scale(1.02) !important;
  background: linear-gradient(135deg, #ffea99 0%, #ffca3a 48%, #ffae12 100%) !important;
  border-color: #ffd36b !important;
  box-shadow: 0 7px 18px rgba(255, 169, 0, .48), inset 0 1px 0 rgba(255, 255, 255, .7) !important;
}
.sponsor-badge-compact {
  min-height: 27px !important;
  padding: 0 9px 0 7px !important;
  border-radius: 7px !important;
  font-size: 11px !important;
  gap: 4px !important;
}
.sponsor-badge-compact .sponsor-svg {
  width: 12px !important;
  height: 12px !important;
}

@media (max-width: 768px) {
  .sponsor-badge {
    min-height: 30px !important;
    padding: 0 11px 0 8px !important;
    border-radius: 8px !important;
    font-size: 12px !important;
  }
  .sponsor-badge .sponsor-svg {
    width: 14px !important;
    height: 14px !important;
  }
  .sponsor-badge-compact {
    min-height: 25px !important;
    padding: 0 8px 0 6px !important;
    font-size: 10px !important;
  }
}


/* ============ v2.2.2 首页账号卡片信息完整显示修复 ============
   使用首页专属类名，避免通用主题样式把账号图片拉得过高、将正文挤到首屏之外。 */
.home-accounts-grid {
  align-items: start !important;
}
.home-account-card {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  min-width: 0 !important;
  height: auto !important;
  overflow: hidden !important;
  border: 1px solid rgba(139, 92, 246, .48) !important;
  background: linear-gradient(158deg, rgba(20, 24, 40, .98), rgba(9, 12, 22, .99)) !important;
}
.home-account-card::before {
  z-index: 0 !important;
}
.home-account-card .home-account-cover {
  position: relative !important;
  z-index: 1 !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  aspect-ratio: 16 / 10 !important;
  flex: 0 0 auto !important;
  background: #f7f7f8 !important;
  overflow: hidden !important;
}
.home-account-card .home-account-cover::after {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  pointer-events: none !important;
  background: linear-gradient(180deg, transparent 58%, rgba(4, 6, 13, .56) 100%) !important;
}
.home-account-card .home-account-cover img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center !important;
}
.home-account-game-badge {
  position: absolute !important;
  left: 12px !important;
  bottom: 11px !important;
  z-index: 2 !important;
  max-width: calc(100% - 24px) !important;
  padding: 4px 9px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, .18) !important;
  border-radius: 999px !important;
  color: #fff !important;
  background: rgba(8, 11, 20, .72) !important;
  backdrop-filter: blur(9px) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.4 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.home-account-card .home-account-body {
  position: relative !important;
  z-index: 3 !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 176px !important;
  padding: 14px 15px 15px !important;
  visibility: visible !important;
  opacity: 1 !important;
  overflow: visible !important;
}
.home-account-code {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  width: 100% !important;
  min-height: 27px !important;
  margin: -2px 0 9px !important;
  padding: 5px 8px !important;
  overflow: hidden !important;
  border-left: 3px solid #f5b82e !important;
  color: #ffd469 !important;
  background: linear-gradient(90deg, rgba(245, 184, 46, .16), rgba(245, 184, 46, .04)) !important;
  font-family: ui-monospace, "SF Mono", Menlo, monospace !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  line-height: 1.35 !important;
  cursor: pointer !important;
}
.home-account-code span {
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.home-account-code .copy-icon {
  flex: 0 0 auto !important;
  opacity: .78 !important;
}
.home-account-title-row {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  min-height: 32px !important;
  margin-bottom: 10px !important;
  flex-wrap: wrap !important;
}
.home-account-title {
  display: block !important;
  min-width: 0 !important;
  flex: 1 1 120px !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: #fff !important;
  font-size: 16px !important;
  font-weight: 850 !important;
  line-height: 1.35 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}
.home-account-tags {
  display: flex !important;
  align-items: center !important;
  gap: 8px !important;
  margin-bottom: 10px !important;
  flex-wrap: wrap !important;
}
.home-account-tag {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 31px !important;
  padding: 5px 11px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  line-height: 1.2 !important;
  white-space: nowrap !important;
}
.home-account-tag.server {
  color: #72e2ff !important;
  border: 1px solid rgba(6, 182, 212, .55) !important;
  background: rgba(6, 182, 212, .12) !important;
}
.home-account-tag.coin {
  color: #ffd35d !important;
  border: 1px solid rgba(245, 184, 46, .52) !important;
  background: rgba(245, 184, 46, .12) !important;
}
.home-account-tag.coin i {
  width: 6px !important;
  height: 6px !important;
  margin-right: 6px !important;
  border-radius: 50% !important;
  background: #ffc125 !important;
  box-shadow: 0 0 9px rgba(255, 193, 37, .75) !important;
}
.home-account-tag.muted {
  color: #8790a5 !important;
  border: 1px solid rgba(255, 255, 255, .09) !important;
  background: rgba(255, 255, 255, .035) !important;
}
.home-account-intro {
  display: -webkit-box !important;
  min-height: 20px !important;
  margin: 0 0 10px !important;
  overflow: hidden !important;
  color: #8f98ae !important;
  font-size: 12px !important;
  line-height: 1.55 !important;
  -webkit-box-orient: vertical !important;
  -webkit-line-clamp: 1 !important;
}
.home-account-bottom {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding-top: 9px !important;
  border-top: 1px solid rgba(255, 255, 255, .07) !important;
}
.home-account-detail {
  flex: 0 0 auto !important;
  color: #c4b5fd !important;
  font-size: 12px !important;
  font-weight: 800 !important;
}
.home-account-detail:hover {
  color: #fff !important;
}

@media (min-width: 641px) {
  .home-accounts-grid {
    grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)) !important;
  }
}

@media (max-width: 640px) {
  .home-account-card .home-account-cover {
    aspect-ratio: 16 / 9 !important;
  }
  .home-account-card .home-account-body {
    min-height: 170px !important;
    padding: 13px 14px 14px !important;
  }
  .home-account-title {
    font-size: 15px !important;
  }
  .home-account-code {
    font-size: 10px !important;
  }
  .home-account-tag {
    min-height: 30px !important;
    font-size: 12px !important;
  }
}

/* v2.2.5：首页游戏卡片尺寸与类型筛选显示修复 */
.game-cover {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  height: auto !important;
  aspect-ratio: 4 / 3 !important;
  overflow: hidden !important;
}
.game-cover > img {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center !important;
}
.game-active-filter {
  display: inline-flex;
  align-items: center;
  margin-left: 8px;
  padding: 3px 9px;
  border-radius: 999px;
  color: #ddd6fe;
  background: rgba(124,58,237,.14);
  border: 1px solid rgba(124,58,237,.28);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
@media (min-width: 641px) {
  .games-grid {
    grid-template-columns: repeat(auto-fill, minmax(220px, 260px)) !important;
    justify-content: start !important;
    align-items: start !important;
    gap: 16px !important;
  }
  .game-card { width: 100% !important; }
  .game-info { padding: 14px !important; }
  .game-name { font-size: 17px !important; margin-bottom: 5px !important; }
  .game-title { min-height: 36px !important; margin-bottom: 9px !important; }
  .game-type-row { min-height: 22px !important; margin-bottom: 6px !important; }
  .game-meta { margin-top: 8px !important; margin-bottom: 10px !important; }
  .game-btn, .account-btn { min-height: 38px !important; }
}
@media (max-width: 640px) {
  .game-cover { aspect-ratio: 16 / 10 !important; }
  .game-active-filter { margin-left: 4px; margin-top: 4px; }
}


/* ============ v2.2.9 账号卡片“区服 / 金币”翡翠绿色高级徽章补丁 ============
   仅影响：首页账号展示卡片、游戏专区内账号卡片。
   不影响游戏卡片、后台、数据及账号详情字段。
*/
.home-account-card .home-account-tags,
.account-card .account-meta {
  gap: 9px !important;
}

/* 首页账号卡片：通用翡翠玻璃徽章 */
.home-account-card .home-account-tag.server,
.home-account-card .home-account-tag.coin {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  min-height: 33px !important;
  padding: 6px 13px !important;
  color: #ecfff5 !important;
  border: 1px solid rgba(76, 255, 167, .62) !important;
  background:
    linear-gradient(135deg, rgba(10, 72, 48, .96) 0%, rgba(5, 128, 76, .88) 52%, rgba(8, 78, 54, .96) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .20),
    inset 0 -1px 0 rgba(0, 0, 0, .18),
    0 5px 15px rgba(0, 196, 103, .18),
    0 0 0 1px rgba(30, 255, 143, .06) !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, .48) !important;
  letter-spacing: .15px !important;
  backdrop-filter: blur(10px) saturate(135%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(135%) !important;
}
.home-account-card .home-account-tag.server::before,
.home-account-card .home-account-tag.coin::before {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  top: -70% !important;
  left: -32% !important;
  width: 48% !important;
  height: 240% !important;
  transform: rotate(24deg) !important;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.20), transparent) !important;
  pointer-events: none !important;
}
.home-account-card .home-account-tag.server {
  border-color: rgba(78, 230, 151, .55) !important;
  background:
    linear-gradient(135deg, rgba(8, 58, 42, .98) 0%, rgba(8, 108, 68, .93) 55%, rgba(6, 63, 46, .98) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 5px 14px rgba(0, 148, 85, .17) !important;
}
.home-account-card .home-account-tag.coin {
  color: #f2fff7 !important;
  border-color: rgba(91, 255, 169, .76) !important;
  background:
    linear-gradient(135deg, #087a49 0%, #09b866 48%, #067a49 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    0 6px 17px rgba(0, 224, 118, .25),
    0 0 13px rgba(34, 255, 142, .10) !important;
  font-weight: 900 !important;
}
.home-account-card .home-account-tag.coin i {
  width: 7px !important;
  height: 7px !important;
  margin-right: 7px !important;
  background: #a7ffca !important;
  border: 1px solid rgba(255,255,255,.72) !important;
  box-shadow: 0 0 5px #6dffa7, 0 0 12px rgba(33,255,137,.78) !important;
}

/* 游戏专区账号卡片：只覆盖账号卡片中的 tag，不影响游戏头部标签 */
.account-card .account-meta .tag.server,
.account-card .account-meta .tag.coin {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  display: inline-flex !important;
  align-items: center !important;
  min-height: 33px !important;
  padding: 6px 13px !important;
  border-radius: 999px !important;
  color: #ecfff5 !important;
  border: 1px solid rgba(76, 255, 167, .62) !important;
  background:
    linear-gradient(135deg, rgba(10, 72, 48, .96) 0%, rgba(5, 128, 76, .88) 52%, rgba(8, 78, 54, .96) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 0 -1px 0 rgba(0,0,0,.18),
    0 5px 15px rgba(0,196,103,.18) !important;
  text-shadow: 0 1px 4px rgba(0,0,0,.48) !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
  letter-spacing: .15px !important;
  backdrop-filter: blur(10px) saturate(135%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(135%) !important;
}
.account-card .account-meta .tag.server::before,
.account-card .account-meta .tag.coin::before {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  top: -70% !important;
  left: -32% !important;
  width: 48% !important;
  height: 240% !important;
  transform: rotate(24deg) !important;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.20), transparent) !important;
  pointer-events: none !important;
}
.account-card .account-meta .tag.server {
  border-color: rgba(78, 230, 151, .55) !important;
  background:
    linear-gradient(135deg, rgba(8, 58, 42, .98) 0%, rgba(8, 108, 68, .93) 55%, rgba(6, 63, 46, .98) 100%) !important;
}
.account-card .account-meta .tag.coin {
  color: #f2fff7 !important;
  border-color: rgba(91, 255, 169, .76) !important;
  background: linear-gradient(135deg, #087a49 0%, #09b866 48%, #067a49 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.24),
    0 6px 17px rgba(0,224,118,.25),
    0 0 13px rgba(34,255,142,.10) !important;
  font-weight: 900 !important;
}

@media (max-width: 640px) {
  .home-account-card .home-account-tag.server,
  .home-account-card .home-account-tag.coin,
  .account-card .account-meta .tag.server,
  .account-card .account-meta .tag.coin {
    min-height: 31px !important;
    padding: 5px 11px !important;
    font-size: 11px !important;
  }
}

/* ============ v2.3.2 红黑熔岩服务器区服胶囊补丁 ============
   将区服标签统一升级为红黑熔岩发光胶囊，并使用服务器机柜 SVG 图标。
   金币标签继续保留 v2.2.9 的翡翠绿色高级样式。
*/
.server-rack-icon {
  width: 14px !important;
  height: 14px !important;
  flex: 0 0 14px !important;
  display: block !important;
  color: #ffd7ae !important;
  stroke: currentColor !important;
  filter: drop-shadow(0 0 3px rgba(255, 174, 76, .92)) drop-shadow(0 0 8px rgba(255, 90, 31, .45)) !important;
}

/* 首页游戏卡片、首页账号卡片、游戏详情头部和游戏专区账号卡片 */
.game-card .game-meta .tag.server,
.home-account-card .home-account-tag.server,
.game-hero .meta .tag.server,
.account-card .account-meta .tag.server,
.meta-tag.server-pill {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 7px !important;
  min-height: 33px !important;
  padding: 6px 13px !important;
  border-radius: 999px !important;
  color: #fff3eb !important;
  border: 1px solid rgba(255, 103, 54, .82) !important;
  background:
    radial-gradient(circle at 18% 8%, rgba(255, 203, 120, .22), transparent 30%),
    radial-gradient(circle at 78% 18%, rgba(255, 94, 48, .20), transparent 28%),
    linear-gradient(135deg, rgba(26, 7, 7, .98) 0%, rgba(79, 10, 10, .96) 42%, rgba(148, 30, 12, .97) 72%, rgba(28, 8, 8, .98) 100%) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .12),
    inset 0 -1px 0 rgba(0, 0, 0, .34),
    0 6px 16px rgba(159, 18, 18, .26),
    0 0 0 1px rgba(255, 120, 66, .08),
    0 0 18px rgba(255, 88, 34, .16) !important;
  text-shadow: 0 1px 4px rgba(0, 0, 0, .62), 0 0 8px rgba(255, 136, 77, .18) !important;
  font-size: 12px !important;
  font-weight: 850 !important;
  line-height: 1.2 !important;
  letter-spacing: .18px !important;
  white-space: nowrap !important;
  backdrop-filter: blur(10px) saturate(138%) !important;
  -webkit-backdrop-filter: blur(10px) saturate(138%) !important;
  transition: transform .2s ease, border-color .2s ease, box-shadow .2s ease !important;
}

.game-card .game-meta .tag.server::before,
.home-account-card .home-account-tag.server::before,
.game-hero .meta .tag.server::before,
.account-card .account-meta .tag.server::before,
.meta-tag.server-pill::before {
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  top: -80% !important;
  left: -28% !important;
  width: 45% !important;
  height: 255% !important;
  transform: rotate(24deg) !important;
  background: linear-gradient(90deg, transparent, rgba(255, 219, 153, .24), transparent) !important;
  pointer-events: none !important;
}

.game-card .game-meta .tag.server::after,
.home-account-card .home-account-tag.server::after,
.game-hero .meta .tag.server::after,
.account-card .account-meta .tag.server::after,
.meta-tag.server-pill::after {
  content: "" !important;
  position: absolute !important;
  inset: 1px !important;
  border-radius: inherit !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.12), transparent 44%),
    radial-gradient(circle at 82% 82%, rgba(255, 143, 84, .16), transparent 28%);
  pointer-events: none !important;
  z-index: -1 !important;
}

.game-card .game-meta .tag.server:hover,
.home-account-card .home-account-tag.server:hover,
.game-hero .meta .tag.server:hover,
.account-card .account-meta .tag.server:hover,
.meta-tag.server-pill:hover {
  transform: translateY(-1px) !important;
  border-color: rgba(255, 181, 126, .98) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .18),
    0 8px 20px rgba(167, 24, 24, .34),
    0 0 22px rgba(255, 106, 44, .26) !important;
}

/* 账号详情页的标签间距与尺寸适配 */
.account-meta .meta-tag.server-pill {
  min-height: 30px !important;
  padding: 5px 11px !important;
}

@media (max-width: 640px) {
  .server-rack-icon {
    width: 13px !important;
    height: 13px !important;
    flex-basis: 13px !important;
  }

  .game-card .game-meta .tag.server,
  .home-account-card .home-account-tag.server,
  .game-hero .meta .tag.server,
  .account-card .account-meta .tag.server,
  .meta-tag.server-pill {
    min-height: 31px !important;
    padding: 5px 11px !important;
    gap: 6px !important;
    font-size: 11px !important;
  }
}