/* 橙子电竞 — 按蓝湖 PC 稿校准（奶油底 + 主橙） */
:root {
  --green: #ff9a3c;
  --green-2: #ff8a00;
  --green-dark: #e56d00;
  --nav-text: #3d2a1a;
  --streamer-text: #6b4a2e;
  --cz-orange: #F2680A;
  --cz-orange-2: #ffb347;
  --cz-orange-deep: #e05600;
  --cz-cream: #fff6df;
  --cz-bg: #fff6df;
  --cz-card: #ffffff;
  --cz-brown: #5c3d2e;
}

body {
  color: var(--nav-text);
  background-color: var(--cz-bg);
  background-image: url('../images/bg-pc.jpg');
  background-repeat: no-repeat;
  background-position: top center;
  background-size: 100% auto;
}

#loader {
  background:
    url('../images/loader-bg.png') center / cover no-repeat,
    linear-gradient(180deg, #fff6df 0%, #ffe8c4 100%) !important;
}
.loader-text { color: #1a1a1a !important; }

/* 导航 */
.nav {
  background: rgba(255, 246, 223, 0.88);
  backdrop-filter: blur(10px);
}
.nav.scrolled {
  background: rgba(255, 246, 223, 0.96);
  box-shadow: 0 4px 20px rgba(255, 138, 0, 0.08);
}
.brand {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
  flex-shrink: 0;
}
.brand-logo {
  display: block;
  height: 52px;
  width: auto;
  max-width: 180px;
  object-fit: contain;
  object-position: left center;
}
.nav-link { color: var(--cz-brown); font-weight: 700; }
.nav-link.active,
.nav-link:hover { color: var(--cz-orange); }
.nav-link.active::after,
.nav-link.active::before {
  background: var(--cz-orange) !important;
}

.gradient-title {
  background: linear-gradient(180deg, #ffb347 0%, #ff8a00 45%, #ff6a00 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}

/* Hero：英文标题 / 数据 / 分隔线 */
.hero-title-en,
.hero-title-en.gradient-title,
.hero-title-en .lm-inner {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #424242 !important;
  color: #424242 !important;
}
.hero-divider {
  background: #000 !important;
  border-radius: 2px;
}
.hero-stats .stat-num {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #B15900 !important;
  color: #B15900 !important;
}
.hero-stats .stat-label {
  color: #424242 !important;
  font-weight: 700 !important;
}

.badge-pill {
  display: inline-flex !important;
  align-items: center;
  gap: 6px;
  background: var(--cz-orange) !important;
  color: #fff !important;
  border: none !important;
  box-shadow: 0 4px 12px rgba(255, 138, 0, 0.25);
}
.badge-check {
  width: 18px;
  height: 18px;
  object-fit: contain;
  flex-shrink: 0;
  /* 白勾黑底切片：在橙色徽章上用 screen 去掉黑底 */
  mix-blend-mode: screen;
}

.hero {
  position: relative;
  overflow: hidden;
  /* 导航下方留白，整体略下移 */
  padding-top: 230px !important;
}
.hero-inner {
  align-items: start !important;
}
.hero-left { position: relative; z-index: 3; }
.hero-right {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
}

.hero-badges {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

/* 徽章到「橙子电竞」标题 75px */
.hero-title-row {
  position: relative;
  display: inline-block;
  margin-top: 75px !important;
  vertical-align: top;
}
.hero-title-row .hero-title {
  margin-top: 0;
  background: none;
  -webkit-background-clip: initial;
  background-clip: initial;
  color: transparent;
  line-height: 0;
}
.hero-brand-img {
  display: block;
  height: 96px;
  width: auto;
  max-width: min(520px, 42vw);
  object-fit: contain;
  mix-blend-mode: screen;
}
.hero-deco-star {
  position: absolute;
  right: -28px;
  top: -22px;
  width: 70px;
  height: auto;
  pointer-events: none;
  mix-blend-mode: screen;
  z-index: 2;
}

/* 原型：皇冠在「完成订单」这一列正下方 */
.stat-orders {
  position: relative;
}
.hero-deco-crown {
  position: absolute;
  left: 50%;
  top: calc(100% + 6px);
  transform: translateX(-40%);
  width: 64px;
  height: auto;
  pointer-events: none;
  mix-blend-mode: screen;
  z-index: 2;
}
/* 给皇冠腾出一点与分隔线的间距，避免压住文案 */
.hero-stats {
  margin-bottom: 28px;
}
.hero-divider {
  margin-top: 48px !important;
}

.hero-mascot {
  position: relative;
  z-index: 2;
  width: 720px !important;
  max-width: min(720px, 52vw) !important;
  margin: -24px -40px 0 0 !important;
  filter: drop-shadow(0 18px 40px rgba(255, 138, 0, 0.18));
}

.section-title h2 {
  color: var(--cz-orange) !important;
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #F2680A !important;
}
.section-title p { color: #a88868; }
.section-title::before,
.section-title::after { display: none !important; }
.section-title:hover h2 {
  background: none !important;
  -webkit-text-fill-color: #F2680A !important;
  color: #F2680A !important;
}
.section-title:hover p { color: #a88868 !important; }

.reviews-section .section-title p {
  font-size: 15px !important;
  letter-spacing: 0.28em;
  color: #91877A !important;
  font-weight: 600;
}

/* —— 官方资讯 tabs —— */
.activity-feed {
  background: rgba(255, 255, 255, 0.88) !important;
  border: 1px solid rgba(242, 104, 10, 0.12) !important;
  box-shadow: 0 14px 34px rgba(242, 104, 10, 0.08) !important;
}
.activity-feed-tabs {
  border-bottom: 1px solid rgba(158, 130, 100, 0.22) !important;
  align-items: flex-end;
  gap: 22px !important;
}
.activity-feed-tab {
  font-size: 18px !important;
  color: #9E8264 !important;
  font-weight: 700 !important;
  padding: 8px 2px 12px !important;
  line-height: 1.1;
}
.activity-feed-tab:hover { color: #F2680A !important; }
.activity-feed-tab.active {
  font-size: 27px !important;
  color: #1a1a1a !important;
}
.activity-feed-tab.active::after {
  width: 28px !important;
  height: 4px !important;
  background: #F2680A !important;
}

/* 资讯条目：橙黄渐变徽章 + 淡黄选中/悬停 */
.activity-feed-item {
  border-bottom: 1px solid rgba(158, 130, 100, 0.14) !important;
  border-radius: 12px !important;
}
.activity-feed-item:hover,
.activity-feed-item:focus-visible {
  background: #FFF4D6 !important;
  outline: none;
}
.activity-feed-badge,
.activity-feed-badge.c0,
.activity-feed-badge.c1,
.activity-feed-badge.c2,
.activity-feed-badge.c3,
.activity-feed-badge.c4,
.activity-feed-badge.c5,
.activity-feed-badge.c6,
.activity-feed-badge.c7,
.activity-feed-badge.c8,
.activity-feed-badge.c9 {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 86px !important;
  min-width: 86px !important;
  height: 35px !important;
  padding: 0 !important;
  box-sizing: border-box;
  background: linear-gradient(90deg, #F2680A 0%, #FFC14D 100%) !important;
  box-shadow: 0 2px 8px rgba(242, 104, 10, 0.28) !important;
  color: #fff !important;
  border-radius: 999px !important;
  font-size: 14px !important;
  line-height: 1 !important;
}
.activity-feed-title {
  color: #3A3A3A !important;
  font-weight: 700 !important;
}
.activity-feed-view {
  flex: none;
  font-size: 13px;
  font-weight: 700;
  color: #91877A !important;
  white-space: nowrap;
}
.activity-feed-hint {
  margin: 14px 0 2px;
  font-size: 12px !important;
  font-weight: 700;
  color: #F2680A;
  line-height: 1.4;
}

/* 活动 Banner 下方 chips */
.activity-chip {
  height: 58px !important;
  border: 1px solid rgba(242, 104, 10, 0.28) !important;
  background: #fff !important;
  color: #5B471F !important;
  border-radius: 999px !important;
  box-shadow: 0 4px 12px rgba(242, 104, 10, 0.08);
}
.activity-chip:hover {
  border-color: #F2680A !important;
  color: #F2680A !important;
}
.activity-chip.active {
  background: #F2680A !important;
  border-color: #F2680A !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(242, 104, 10, 0.28) !important;
}

/* —— 游戏选择 —— */
.games-section { padding-top: 48px; padding-bottom: 24px; }
.games-section .games-title {
  display: flex;
  align-items: center;
  gap: 18px;
  margin-bottom: 8px;
}
.games-section .games-title::before,
.games-section .games-title::after { display: none !important; }
.games-title-text h2 {
  margin: 0;
  color: #F2680A !important;
  font-size: 60px !important;
  font-weight: 900 !important;
  letter-spacing: 1px;
  line-height: 1.05;
  background: none !important;
  -webkit-text-fill-color: #F2680A !important;
}
.games-title-text p {
  margin: 6px 0 0;
  color: #4F4F4F !important;
  font-size: 21px !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
.games-section .section-deco {
  width: 92px;
  height: 92px;
  object-fit: contain;
  mix-blend-mode: screen;
  flex-shrink: 0;
}
.games-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-top: 28px;
}
.game-card {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 18px 20px;
  background: #FFFCF4 !important;
  border-radius: 18px;
  box-shadow: 0 8px 24px rgba(242, 104, 10, 0.08);
  border: 1px solid rgba(242, 104, 10, 0.1);
  text-decoration: none;
  color: inherit;
  transition: transform .2s ease, box-shadow .2s ease;
}
.game-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 28px rgba(242, 104, 10, 0.16);
}
.game-card.is-active {
  border-color: rgba(242, 104, 10, 0.55);
  box-shadow: 0 12px 28px rgba(242, 104, 10, 0.2);
  background: #FFF7E8 !important;
}
.game-card.is-soon {
  background: #E8E1CC !important;
  opacity: 1;
  pointer-events: none;
}
.game-card-icon {
  width: 64px; height: 64px; border-radius: 14px; object-fit: cover; flex-shrink: 0;
  background: #fff3e0;
}
.game-card-body { flex: 1; min-width: 0; }
.game-card-name-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}
.game-card-name {
  font-size: 18px; font-weight: 800; color: #2b2118;
}
.game-card-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.game-card-tag {
  font-size: 12px; font-weight: 700; padding: 3px 10px; border-radius: 999px;
}
.game-card-tag.tag-hot {
  background: #F2680A;
  color: #fff;
}
.game-card-tag.tag-strategy {
  background: #8b6cff;
  color: #fff;
}
.game-card-tag.tag-soon {
  background: #f0d7b0;
  color: #8a6a3a;
}
.game-card-tag.tag-muted {
  background: #efe6d8;
  color: #6b5438;
}
.game-card-desc {
  font-size: 13px;
  color: #5E5E5E !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.game-card-cta {
  font-size: 15px;
  font-weight: 800;
  color: #5B471F !important;
  white-space: nowrap;
  flex-shrink: 0;
}
.game-card.is-soon .game-card-cta { color: #939393 !important; }

/* —— 玩法菜单橙系 —— */
.menu-section {
  background: linear-gradient(180deg,
    rgba(255, 249, 240, 0) 0%,
    #FFF9F0 120px,
    #FFF6E8 calc(100% - 220px),
    rgba(255, 246, 232, 0) 100%) !important;
}
.menu-topbar {
  align-items: center !important;
  gap: 24px !important;
  margin-bottom: 28px !important;
}
.menu-heading .menu-kicker,
.menu-heading h2 {
  background: none !important;
  -webkit-background-clip: initial !important;
  background-clip: initial !important;
  -webkit-text-fill-color: #F2680A !important;
  color: #F2680A !important;
}
.menu-kicker {
  color: #F2680A !important;
  letter-spacing: 0.18em !important;
  font-size: 14px !important;
  font-weight: 800 !important;
}
.menu-heading h2 {
  color: #F2680A !important;
  font-size: 48px !important;
  font-weight: 900 !important;
  margin-top: 4px !important;
  line-height: 1.1 !important;
}
.menu-heading-desc {
  margin-top: 10px;
  font-size: 16px;
  font-weight: 600;
  color: #5B471F;
  line-height: 1.5;
}
.menu-utilities {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  justify-content: flex-end;
  gap: 14px;
  padding-bottom: 0 !important;
}
.menu-utilities .menu-entry,
.menu-utility-btn {
  box-sizing: border-box;
  width: 199px !important;
  min-width: 199px !important;
  max-width: 199px !important;
  height: 63px !important;
  min-height: 63px !important;
  padding: 0 20px !important;
  color: #5B471F !important;
  background: #FFFFFF !important;
  border: 1px solid rgba(91, 71, 31, 0.12) !important;
  border-radius: 999px !important;
  box-shadow: 0 6px 16px rgba(242, 104, 10, 0.08) !important;
  font-size: 18px !important;
  font-weight: 800 !important;
}
.menu-utilities .menu-utility-vip,
.menu-utilities .menu-utility-btn:nth-child(2):not(.is-highlight) {
  background: #FFF9E5 !important;
  border-color: rgba(91, 71, 31, 0.1) !important;
  color: #5B471F !important;
}
.menu-utilities .menu-entry.is-highlight,
.menu-section .menu-utilities .menu-entry.is-highlight,
.menu-utilities .menu-utility-btn.is-highlight {
  background: linear-gradient(90deg, #FF6E1F 0%, #FDBB47 100%) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 8px 20px rgba(255, 110, 31, 0.28) !important;
}
.menu-utilities .menu-entry-tag,
.menu-utilities .menu-entry-arrow { display: none !important; }
.menu-utilities .menu-entry-name { color: inherit !important; }

/* 搜索框 / 分类标签：与顶栏（标题到 VIP）同宽 */
.menu-search {
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 20px !important;
  background: #fff !important;
  border: 1px solid rgba(91, 71, 31, 0.14) !important;
  border-radius: 999px !important;
  box-shadow: 0 6px 18px rgba(242, 104, 10, 0.06) !important;
}
.menu-search:focus-within {
  border-color: rgba(242, 104, 10, 0.45) !important;
  box-shadow: 0 8px 22px rgba(242, 104, 10, 0.12) !important;
}
.menu-search svg { color: #F2680A; }
.menu-search input { color: #3A3A3A !important; }
.menu-search input::placeholder { color: #91877A !important; }
.menu-search-clear { background: #F2680A !important; }

.menu-tabs {
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 18px !important;
  justify-content: flex-start !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  gap: 10px !important;
}
.menu-category-tab {
  color: #5B471F !important;
  background: #fff !important;
  border: 1px solid rgba(91, 71, 31, 0.14) !important;
  border-radius: 999px !important;
  box-shadow: 0 2px 8px rgba(91, 71, 31, 0.04);
}
.menu-category-tab:hover {
  color: #F2680A !important;
  background: #fff !important;
  box-shadow: 0 4px 12px rgba(242, 104, 10, 0.12) !important;
}
.menu-category-tab.active {
  background: linear-gradient(90deg, #FF6E1F 0%, #FDBB47 100%) !important;
  border-color: transparent !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(255, 110, 31, 0.28) !important;
}
.menu-category-tab.active::before { box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.85); }

.menu-promotion-filters {
  gap: 8px !important;
  padding: 0 !important;
  background: transparent !important;
  border-radius: 0 !important;
}
.menu-promotion-filters button {
  box-sizing: border-box;
  width: 87px !important;
  min-width: 87px !important;
  height: 47px !important;
  min-height: 47px !important;
  padding: 0 !important;
  color: #5B471F !important;
  background: #FFF9E5 !important;
  border: 0 !important;
  border-radius: 999px !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  box-shadow: none !important;
}
.menu-promotion-filters button[aria-pressed="true"] {
  background: #FFFFFF !important;
  border: 0 !important;
  color: #5B471F !important;
  box-shadow: 0 4px 12px rgba(91, 71, 31, 0.08) !important;
}

.menu-category-heading::before { display: none !important; content: none !important; }
.menu-group-heading h4::before {
  background: #F2680A !important;
  box-shadow: 0 2px 8px rgba(242, 104, 10, 0.25) !important;
}
.menu-category-heading h3 { color: #9B4A00 !important; }
.menu-group-heading h4 { color: #91877A !important; }
.menu-entry {
  color: #3A3A3A !important;
  background: #fff !important;
  border: 1px solid rgba(91, 71, 31, 0.12) !important;
  border-radius: 14px !important;
  box-shadow: 0 2px 10px rgba(91, 71, 31, 0.05) !important;
}
.menu-entry:hover,
.menu-entry.active {
  color: #3A3A3A !important;
  border-color: rgba(242, 104, 10, 0.35) !important;
  box-shadow: 0 8px 20px rgba(242, 104, 10, 0.12) !important;
}
.menu-entry::before { background: #F2680A !important; }
.menu-entry-name { color: #3A3A3A !important; }
.menu-entry-arrow { color: #91877A !important; }
.menu-filterbar #menu-current-category { color: #5B471F !important; }

/* —— 荣耀殿堂 —— */
.hall-section { padding-top: 56px; }
.hall-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 36px;
}
.hall-title {
  margin-bottom: 0 !important;
  flex: 1;
  min-width: 0;
}
.hall-title h2 {
  font-size: 60px !important;
  font-weight: 900 !important;
  letter-spacing: 2px !important;
  line-height: 1.05 !important;
  color: #F2680A !important;
}
.hall-title p {
  margin-top: 10px !important;
  font-size: 18px !important;
  font-weight: 600 !important;
  letter-spacing: 0.42em !important;
  color: #91877A !important;
  text-transform: uppercase;
}
.hall-crest {
  width: 110px;
  height: auto;
  flex-shrink: 0;
  object-fit: contain;
  mix-blend-mode: normal;
  filter: drop-shadow(0 10px 24px rgba(242, 104, 10, 0.22));
}
.hall-tabs {
  display: inline-flex;
  align-items: stretch;
  gap: 0;
  width: 220px;
  height: 52px;
  padding: 0;
  border-radius: 999px;
  background-color: transparent;
  background-image: url('../images/＜编组＞@2x.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  box-shadow: 0 6px 18px rgba(91, 71, 31, 0.1);
  overflow: hidden;
  flex-shrink: 0;
}
.hall-tab {
  flex: 1;
  border: 0;
  background: transparent !important;
  padding: 0;
  border-radius: 0;
  font-weight: 800;
  color: #5B471F;
  cursor: pointer;
  font-size: 15px;
  line-height: 52px;
  text-align: center;
}
.hall-tab.active {
  background: transparent !important;
  color: #fff !important;
}
.hall-tabs[data-active="supreme"] {
  transform: scaleX(-1);
}
.hall-tabs[data-active="supreme"] .hall-tab {
  transform: scaleX(-1);
}
.hall-top {
  display: grid; grid-template-columns: 1fr 1fr; gap: 16px; margin-bottom: 16px;
}
.hall-card {
  position: relative; display: flex; align-items: center; gap: 18px;
  padding: 28px 28px; border-radius: 20px; overflow: hidden; min-height: 148px;
  background: linear-gradient(135deg, #ffb347 0%, #ff8a00 100%); color: #fff;
}
.hall-card.rank-2 { background: linear-gradient(135deg, #ffc46a 0%, #f2680a 100%); }
.hall-card.rank-sm {
  background: linear-gradient(135deg, #ffe0b2 0%, #ff9a3c 100%); color: #5c3a1e;
  min-height: 120px;
  padding: 22px 20px;
}
/* 前五：整卡直接展示背景图（固定高度，避免被图片撑开） */
.hall-card.is-poster {
  padding: 0;
  background: #fff3e0;
  align-items: stretch;
  height: 148px;
  min-height: 148px;
  max-height: 148px;
}
.hall-card.rank-sm.is-poster {
  height: 120px;
  min-height: 120px;
  max-height: 120px;
}
.hall-card-poster {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.hall-top-row3 {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 20px;
}
.hall-rank-num { font-size: 42px; font-weight: 900; opacity: .85; line-height: 1; }
.hall-card-info { flex: 1; }
.hall-card-name { font-size: 20px; font-weight: 800; }
.hall-card-badge {
  display: inline-block; margin-top: 6px; padding: 2px 10px; border-radius: 999px;
  background: rgba(255,255,255,.28); font-size: 12px; font-weight: 700;
}
.hall-card-metric { margin-top: 8px; font-size: 13px; opacity: .95; }
.hall-list {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 28px;
  padding: 10px 22px 14px;
  background: #fff;
  border-radius: 22px;
  box-shadow: 0 10px 28px rgba(91, 71, 31, 0.06);
}
.hall-list-item {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 64px;
  padding: 10px 6px;
  background: transparent;
  border-radius: 0;
  border: 0;
  border-bottom: 1px solid rgba(91, 71, 31, 0.08);
}
.hall-list-rank {
  width: 36px;
  flex: 0 0 36px;
  font-weight: 900;
  font-style: italic;
  color: var(--cz-orange);
  font-size: 22px;
}
.hall-list-avatar {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  object-fit: cover;
  flex: 0 0 40px;
}
.hall-list-who {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex: 0 1 auto;
}
.hall-list-name {
  font-weight: 700;
  color: #2b2118;
  white-space: nowrap;
}
.hall-list-svip {
  height: 22px;
  width: auto;
  display: block;
  flex-shrink: 0;
}
.hall-list-metric {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-left: 8px;
  min-width: 0;
  flex: 1 1 auto;
}
.hall-list-flame {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
}
.hall-list-metric-text {
  font-size: 13px;
  font-weight: 600;
  color: #5E5E5E;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.hall-list-tag {
  margin-left: auto;
  flex: 0 0 auto;
  padding: 4px 12px;
  border-radius: 999px;
  background: #F3F1EC;
  color: #6B655C;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.hall-list-badge { display: none; }
.hall-more {
  display: block;
  width: fit-content;
  margin: 14px 0 0 auto;
  padding: 0;
  border: 0;
  background: none;
  color: #91877A;
  font-weight: 700;
  font-size: 14px;
  cursor: pointer;
  text-align: right;
}
.hall-panel[hidden] { display: none !important; }

/* —— 荣耀殿堂弹窗 —— */
.hall-modal {
  position: fixed;
  inset: 0;
  z-index: 10040;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
}
.hall-modal[hidden] { display: none !important; }
.hall-modal-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(40, 28, 16, 0.48);
  backdrop-filter: blur(2px);
}
.hall-modal-dialog {
  position: relative;
  z-index: 1;
  width: min(720px, 100%);
  max-height: min(860px, 92vh);
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 28px;
  box-shadow: 0 24px 64px rgba(40, 28, 16, 0.22);
  overflow: hidden;
}
.hall-modal-head {
  position: relative;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 18px 56px 12px;
}
.hall-modal-tabs {
  display: inline-flex;
  align-items: stretch;
  width: 220px;
  height: 48px;
  border-radius: 999px;
  background-color: transparent;
  background-image: url('../images/＜编组＞@2x.png');
  background-repeat: no-repeat;
  background-position: center;
  background-size: 100% 100%;
  overflow: hidden;
  box-shadow: 0 6px 18px rgba(91, 71, 31, 0.1);
}
.hall-modal-tab {
  flex: 1;
  border: 0;
  background: transparent;
  color: #5B471F;
  font-weight: 800;
  font-size: 15px;
  line-height: 48px;
  cursor: pointer;
}
.hall-modal-tab.active { color: #fff; }
.hall-modal-tabs[data-active="supreme"] { transform: scaleX(-1); }
.hall-modal-tabs[data-active="supreme"] .hall-modal-tab { transform: scaleX(-1); }
.hall-modal-close {
  position: absolute;
  top: 16px;
  right: 16px;
  width: 36px;
  height: 36px;
  border: 0;
  border-radius: 50%;
  background: #F0EEE8;
  color: #6B655C;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
}
.hall-modal-close:hover { background: #e6e2d8; }
.hall-modal-body {
  flex: 1 1 auto;
  overflow: auto;
  padding: 8px 22px 28px;
  -webkit-overflow-scrolling: touch;
}
.hall-modal-top1 {
  margin-bottom: 14px;
}
.hall-modal-grid4 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  margin-bottom: 18px;
}
.hall-modal-card {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  min-height: 120px;
  padding: 16px 18px;
  border-radius: 18px;
  overflow: hidden;
  color: #fff;
  background: linear-gradient(135deg, #ffb347 0%, #ff8a00 100%);
  box-shadow: 0 10px 24px rgba(242, 104, 10, 0.16);
}
.hall-modal-card.is-top1 { min-height: 148px; }
.hall-modal-card.is-rank2 {
  background: linear-gradient(135deg, #cfd8dc 0%, #90a4ae 100%);
}
.hall-modal-card-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  opacity: 0.42;
  pointer-events: none;
}
.hall-modal-card.is-poster {
  padding: 0;
  background: #fff3e0;
  height: 120px;
  min-height: 120px;
  max-height: 120px;
}
.hall-modal-card.is-top1.is-poster {
  height: 148px;
  min-height: 148px;
  max-height: 148px;
}
.hall-modal-card.is-poster .hall-modal-card-bg {
  position: absolute;
  inset: 0;
  opacity: 1;
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.hall-modal-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(20,12,6,0.05) 20%, rgba(20,12,6,0.72) 100%);
  pointer-events: none;
}
.hall-modal-card.is-poster::after { display: none; }
.hall-modal-card-body {
  position: relative;
  z-index: 1;
}
.hall-modal-rank-row {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 8px;
}
.hall-modal-rank-crown {
  width: 22px;
  height: auto;
}
.hall-modal-rank-label {
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-shadow: 0 2px 8px rgba(0,0,0,0.25);
}
.hall-modal-card.is-top1 .hall-modal-rank-label { font-size: 28px; }
.hall-modal-card-name {
  font-size: 22px;
  font-weight: 900;
  line-height: 1.15;
}
.hall-modal-card.is-top1 .hall-modal-card-name { font-size: 30px; }
.hall-modal-card-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
}
.hall-modal-svip {
  height: 22px;
  width: auto;
  display: block;
}
.hall-modal-metric {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  font-weight: 700;
}
.hall-modal-flame {
  width: 14px;
  height: 14px;
}
.hall-modal-detail {
  margin-top: 6px;
  font-size: 13px;
  font-weight: 600;
  opacity: 0.92;
}
.hall-modal-list {
  display: flex;
  flex-direction: column;
  background: #fff;
}
.hall-modal-list .hall-list-item {
  border-bottom: 1px solid rgba(91, 71, 31, 0.08);
}
.hall-modal-list .hall-list-item:last-child { border-bottom: 0; }
.hall-modal-empty {
  padding: 48px 16px;
  text-align: center;
  color: #91877A;
  font-weight: 700;
}
body.hall-modal-open { overflow: hidden; }

/* —— 合作主播 —— */
.streamers-section {
  padding-top: 72px !important;
  padding-bottom: 48px;
}
.streamers-section .container { position: relative; }
.streamers-head {
  position: relative;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 8px;
  min-height: 120px;
}
.streamers-title { margin-bottom: 0 !important; }
.streamers-title h2 {
  font-size: 56px !important;
  letter-spacing: 2px !important;
  line-height: 1.05 !important;
}
.streamers-title p {
  margin-top: 8px !important;
  font-size: 16px !important;
  letter-spacing: 0.28em !important;
  color: #91877A !important;
  font-weight: 600 !important;
}
.streamers-more {
  position: absolute;
  top: 8px;
  right: 0;
  border: 0;
  background: none;
  color: #5B471F;
  font: inherit;
  font-size: 14px;
  font-weight: 700;
  cursor: pointer;
  z-index: 2;
}
.streamers-deco {
  position: absolute;
  top: 28px;
  right: 24px;
  width: 120px;
  height: 120px;
  object-fit: contain;
  mix-blend-mode: screen;
  pointer-events: none;
  filter: drop-shadow(0 12px 28px rgba(242, 104, 10, 0.2));
}
.streamer-sub {
  margin: 0 0 28px !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  color: #F2680A !important;
}
.streamer-rows {
  display: block;
  width: 100%;
  max-width: 980px;
  margin: 0 auto;
}
.streamer-row {
  display: flex !important;
  flex-wrap: wrap !important;
  justify-content: center;
  align-items: center;
  gap: 12px 14px !important;
  width: 100%;
}
.streamer-row.indent { padding-left: 0 !important; }
.streamer-pill {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: 48px !important;
  padding: 0 22px !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #5B471F !important;
  background: linear-gradient(180deg, #FFFCF8 0%, #FFF3E0 100%) !important;
  border: 1.5px solid rgba(242, 104, 10, 0.32) !important;
  border-radius: 999px !important;
  box-shadow: 0 4px 12px rgba(242, 104, 10, 0.06);
  text-align: center;
  justify-content: center;
  white-space: nowrap !important;
}
.streamer-pill:hover {
  background: #FFF3E0 !important;
  border-color: #F2680A !important;
  color: #F2680A !important;
}
.streamer-pill.hot {
  background: linear-gradient(90deg, #FF6E1F 0%, #FDBB47 100%) !important;
  border-color: transparent !important;
  color: #5B471F !important;
}
.streamer-pill.hot:hover {
  background: linear-gradient(90deg, #F2680A 0%, #FFB347 100%) !important;
  color: #5B471F !important;
}

/* —— 联系我们：整体居中，一行两卡 —— */
.contact-section {
  padding-top: 96px !important;
  padding-bottom: 40px;
}
.contact-section > .container {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.contact-head {
  position: relative;
  width: 100%;
  max-width: 920px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  text-align: center;
  margin-bottom: 36px;
  min-height: 120px;
  padding-top: 8px;
}
.contact-title {
  margin-bottom: 0 !important;
  text-align: center;
}
.contact-title h2 {
  font-size: 56px !important;
  letter-spacing: 2px !important;
}
.contact-title p {
  margin-top: 8px !important;
  font-size: 16px !important;
  letter-spacing: 0.28em !important;
  color: #91877A !important;
  font-weight: 600 !important;
}
.contact-deco {
  position: absolute;
  top: -28px;
  right: 24px;
  width: 132px;
  height: auto;
  object-fit: contain;
  pointer-events: none;
  z-index: 2;
  filter: drop-shadow(0 10px 22px rgba(242, 104, 10, 0.16));
}
.contact-grid {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 22px !important;
  max-width: 920px !important;
  width: 100% !important;
  margin: 0 auto !important;
}
.contact-card {
  min-height: 168px !important;
  padding: 28px 30px !important;
  border-radius: 22px !important;
  background: linear-gradient(135deg, #ffffff 0%, #FFF9E5 100%) !important;
  border: 1.5px solid rgba(242, 104, 10, 0.28) !important;
  box-shadow: 0 10px 28px rgba(242, 104, 10, 0.08) !important;
}
.contact-card::after {
  background: radial-gradient(circle 170px at var(--mouse-x, 50%) var(--mouse-y, 50%), rgba(242, 104, 10, 0.12), rgba(242, 104, 10, 0) 70%) !important;
}
.contact-card:hover {
  border-color: rgba(242, 104, 10, 0.5) !important;
  box-shadow: 0 16px 36px rgba(242, 104, 10, 0.16) !important;
}
.contact-card-primary {
  background: linear-gradient(145deg, #FFFCF4 0%, #FFE8C4 100%) !important;
  border-color: rgba(242, 104, 10, 0.45) !important;
}
.contact-card-text {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0;
  min-width: 0;
}
.contact-card-icon {
  width: 42px !important;
  height: 42px !important;
  margin-bottom: 16px !important;
  border-radius: 50% !important;
  background: linear-gradient(135deg, #FF6E1F 0%, #FDBB47 100%) !important;
  color: #fff !important;
}
.contact-card-icon-img { background: #fff !important; }
.contact-card-name {
  font-size: 26px !important;
  color: #F2680A !important;
  letter-spacing: 0.5px !important;
}
.contact-card-desc {
  margin-top: 8px !important;
  font-size: 16px !important;
  color: #5E5E5E !important;
}
.contact-card-qr {
  width: 112px !important;
  height: 112px !important;
  border-radius: 14px !important;
  border: 1.5px solid rgba(242, 104, 10, 0.35) !important;
}
.contact-card-link {
  background: linear-gradient(135deg, #FF6E1F 0%, #FDBB47 100%) !important;
  border-color: transparent !important;
}
.contact-card-link .contact-card-name,
.contact-card-link .contact-card-desc,
.contact-card-link .contact-card-cta-text {
  color: #fff !important;
}
.contact-card-link .contact-card-icon {
  background: #fff !important;
}
.contact-card-cta-arrow {
  background: #fff !important;
  color: #F2680A !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12) !important;
}
.contact-card-link:hover .contact-card-cta-arrow {
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.16) !important;
}

/* —— Footer（对齐设计稿） —— */
.footer {
  margin-top: 80px !important;
  background: #151515 !important;
  border-top: 0 !important;
  padding: 56px 0 26px !important;
}
.footer .sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.footer-inner {
  display: flex !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  gap: 48px !important;
  padding-bottom: 32px !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.12);
}
.footer-main {
  flex: 1;
  min-width: 0;
}
.footer-brand {
  display: flex !important;
  align-items: center !important;
  gap: 0 !important;
  margin-bottom: 28px;
}
.footer-logo-img {
  width: 180px !important;
  max-width: 100%;
  height: auto !important;
  mix-blend-mode: normal !important;
  margin-bottom: 0 !important;
  display: block;
}
.footer-links {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 26px;
  margin-bottom: 16px;
}
.footer-links a {
  color: rgba(255, 255, 255, 0.72) !important;
  text-decoration: none;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.02em;
}
.footer-links a:hover { color: #F2680A !important; }
.footer-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  color: rgba(255, 255, 255, 0.38);
  font-size: 12px;
  line-height: 1.8;
}
.footer-meta-link {
  color: inherit;
  text-decoration: none;
}
.footer-meta-link:hover { color: rgba(255, 255, 255, 0.7); }
.footer-beian-row {
  margin-top: 4px;
}
.footer-beian-row[hidden] { display: none !important; }
.footer-beian {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: rgba(255, 255, 255, 0.38);
  font-size: 12px;
  text-decoration: none;
  line-height: 1.6;
}
.footer-beian img {
  width: 16px;
  height: 16px;
  object-fit: contain;
  flex-shrink: 0;
}
.footer-beian:hover { color: rgba(255, 255, 255, 0.7); }
.footer-social {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 16px;
  padding-top: 18px;
  min-width: 200px;
}
.footer-line {
  display: flex !important;
  align-items: center;
  gap: 10px;
  color: rgba(255, 255, 255, 0.78) !important;
  font-size: 15px !important;
  margin: 0 !important;
  font-weight: 600;
  line-height: 1.2;
}
.footer-social-icon {
  width: 28px;
  height: 28px;
  object-fit: contain;
  flex-shrink: 0;
  border-radius: 6px;
}
.footer-social-label { color: rgba(255, 255, 255, 0.78); }
.footer-copy {
  display: flex;
  justify-content: center;
  align-items: center;
  padding-top: 20px !important;
  color: rgba(255, 255, 255, 0.35) !important;
  font-size: 13px !important;
  border-top: 0 !important;
  text-align: center;
}

.nav-toggle { display: none !important; }

@media (max-width: 1100px) {
  .games-grid { grid-template-columns: 1fr 1fr; }
  .hall-top, .hall-top-row3, .hall-list { grid-template-columns: 1fr; }
  .hall-head { flex-wrap: wrap; justify-content: center; }
  .hall-crest { width: 84px; }
  .streamers-deco { width: 88px; height: 88px; top: 16px; right: 8px; }
  .contact-grid { grid-template-columns: 1fr !important; }
  .footer-inner { flex-direction: column; }
  .footer-social { text-align: left; }
  .hero-brand-img { height: 64px; max-width: 70vw; }
  .hero-deco-star { width: 48px; right: -16px; top: -12px; }
  .hero-deco-crown { width: 48px; top: calc(100% + 2px); }
  .badge-check { width: 14px; height: 14px; }
  .activity-feed-tab.active { font-size: 22px !important; }
  .games-title-text h2 { font-size: 42px !important; }
  .games-title-text p { font-size: 16px !important; }
  .games-section .section-deco { width: 64px; height: 64px; }
  .games-grid { grid-template-columns: 1fr 1fr; }
}