.Po4BvhR1CK2tJaywJ6AN path {
  fill: var(--icon-path-fill);
}
.Oz4yDjua3Qe6thqkZYf_ path {
  transition: 0.2s all;
}
.Oz4yDjua3Qe6thqkZYf_:hover path {
  fill: var(--icon-hover-fill);
}
/* ！！！切勿直接改动该文件，该文件由 generator.ts 自动生成！！！ */
/* !!! DONT MODIFY THIS FILE DIRECTLY, THIS FILE IS GENERATED BY generator.ts AUTOMATICALLY !!! */
.ibW4Oa5B7s2zJKKZ4pCg {
  user-select: none;
}
.AtqKyJetjrG4smuk35Np {
  max-width: 346px;
  width: auto;
  height: 36px;
  background-color: var(--quark-style-white-color, #fff);
  padding-left: 10px;
  padding-right: 4px;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  border: 1px solid var(--quark-style-gray-20-color, rgba(6, 10, 38, 0.12));
  box-shadow: 0 12px 32px -6px var(--quark-style-gray-30-fixed-color, rgba(6, 10, 38, 0.24));
  border-radius: 10px;
}
.ibW4Oa5B7s2zJKKZ4pCg .g6iGsZa_KHMeW2yICzQQ {
  height: 28px;
  display: flex;
  align-items: center;
  margin-right: 6px;
}
.ibW4Oa5B7s2zJKKZ4pCg .e4UXx38MPgfHdym_Lzt0 {
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  height: 28px;
  padding: 0 6px;
  margin-right: 2px;
  border-radius: 6px;
  column-gap: 4px;
}
.ibW4Oa5B7s2zJKKZ4pCg .e4UXx38MPgfHdym_Lzt0:hover:not(.ibW4Oa5B7s2zJKKZ4pCg .kNOcXLDT_cCrcoY8LTm8) {
  background: var(--quark-style-gray-10-color, rgba(6, 10, 38, 0.06));
}
.ibW4Oa5B7s2zJKKZ4pCg .kNOcXLDT_cCrcoY8LTm8 {
  cursor: default;
}
.ibW4Oa5B7s2zJKKZ4pCg .kNOcXLDT_cCrcoY8LTm8 .Va3czASiR9Zztyl_lD4M {
  color: var(--quark-style-gray-40-color, rgba(6, 10, 38, 0.4)) !important;
}
.ibW4Oa5B7s2zJKKZ4pCg .e4UXx38MPgfHdym_Lzt0 .Va3czASiR9Zztyl_lD4M {
  font-size: 12px;
  color: var(--quark-style-gray-color, #060A26);
  line-height: 16px;
  white-space: nowrap;
  position: relative;
}
.ibW4Oa5B7s2zJKKZ4pCg .llw0qsmiI_08u93bFdNg {
  position: relative;
  width: 28px;
  height: 28px;
  overflow: visible !important;
}
.ibW4Oa5B7s2zJKKZ4pCg .LEo8kpqIERehkv8AhAfG {
  width: 28px;
  height: 28px;
  display: flex;
  justify-content: center;
  align-items: center;
  cursor: pointer;
  border-radius: 6px;
  overflow: visible !important;
}
.ibW4Oa5B7s2zJKKZ4pCg .LEo8kpqIERehkv8AhAfG:hover {
  background: var(--quark-style-gray-10-color, rgba(6, 10, 38, 0.06));
}
.ibW4Oa5B7s2zJKKZ4pCg .zoNmooxAnbLEJSN8m1Jg {
  box-sizing: border-box;
  position: absolute;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 110px;
  max-height: 136px;
  height: auto;
  top: 36px;
  right: -5px;
  padding: 4px 0;
  background-color: var(--quark-style-white-color, #fff);
  border: 1px solid var(--quark-style-gray-20-color, rgba(6, 10, 38, 0.12));
  box-shadow: 0 4px 16px -6px var(--quark-style-gray-20-fixed-color, rgba(6, 10, 38, 0.12));
  border-radius: 8px;
  overflow: visible !important;
  row-gap: 4px;
}
.ibW4Oa5B7s2zJKKZ4pCg .O1imPofna4elG_8NcQnR {
  top: -77px;
}
.ibW4Oa5B7s2zJKKZ4pCg .mdH0IY7jS3Swn5vdX6tz {
  width: 102px;
  height: 28px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  cursor: pointer;
  column-gap: 8px;
  border-radius: 6px;
  padding: 0 6px;
  box-sizing: border-box;
}
.ibW4Oa5B7s2zJKKZ4pCg .mdH0IY7jS3Swn5vdX6tz:hover:not(.ibW4Oa5B7s2zJKKZ4pCg .dEdHLVmn_L2GAzb_cmwt) {
  background: var(--quark-style-gray-10-color, rgba(6, 10, 38, 0.06));
}
.ibW4Oa5B7s2zJKKZ4pCg .dEdHLVmn_L2GAzb_cmwt {
  cursor: default;
}
.ibW4Oa5B7s2zJKKZ4pCg .dEdHLVmn_L2GAzb_cmwt .zEraruudgjR2MToGu4Kw {
  color: var(--quark-style-gray-40-color, rgba(6, 10, 38, 0.4)) !important;
}
.ibW4Oa5B7s2zJKKZ4pCg .XfCMwvO0DsqFCeyzPYP2 {
  width: 16px;
  height: 16px;
}
.ibW4Oa5B7s2zJKKZ4pCg .zEraruudgjR2MToGu4Kw {
  font-size: 12px;
  color: var(--quark-style-gray-color, #060A26);
}
.ibW4Oa5B7s2zJKKZ4pCg .KZeoAuXbMIkWzOT4PcH5 {
  width: 100%;
  height: 1px;
  background: var(--quark-style-gray-10-color, rgba(6, 10, 38, 0.06));
}
.ZL32C_XdLL8UQRZ3zObd {
  display: flex;
  align-items: center;
}
.u5llx7cIQZLdrjP5Vag1 {
  width: 28px;
  height: 28px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 16px;
  cursor: pointer;
  margin-right: 12px;
  background: var(--quark-style-gray-60-color, rgba(6, 10, 38, 0.6));
}
.ZL32C_XdLL8UQRZ3zObd .LEo8kpqIERehkv8AhAfG {
  border-radius: 16px !important;
  background: var(--quark-style-gray-60-color, rgba(6, 10, 38, 0.6)) !important;
}
.ZL32C_XdLL8UQRZ3zObd .zoNmooxAnbLEJSN8m1Jg {
  right: 0 !important;
}
.ZL32C_XdLL8UQRZ3zObd {
  overflow: visible !important;
}

/* ===== 底部主导航（1:1 复刻 NG 凸起激活态） ===== */
.ng-bottom-nav{position:fixed;z-index:100;right:50%;bottom:0;transform:translateX(50%);width:min(100%,920px);min-height:78px;padding:8px max(8px,env(safe-area-inset-right)) calc(6px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-left));display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:end;overflow:visible;isolation:isolate;background:transparent;}
.ng-bottom-nav::before{content:"";position:absolute;z-index:0;right:0;bottom:0;left:0;height:calc(46px + env(safe-area-inset-bottom));pointer-events:none;background:rgba(8,13,40,.96);border-radius:22px 22px 0 0;box-shadow:0 -8px 24px rgba(20,36,62,.22);backdrop-filter:blur(18px) saturate(135%);-webkit-backdrop-filter:blur(18px) saturate(135%);}
.ng-bottom-nav__item{position:relative;z-index:1;min-width:0;min-height:68px;padding:2px 3px 1px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#a9b1dc;text-decoration:none;border-radius:18px;-webkit-tap-highlight-color:transparent;transition:color .25s ease,background-color .25s ease,transform .12s ease;}
.ng-bottom-nav__item:active{transform:scale(.94);}
.ng-bottom-nav__icon{position:relative;z-index:1;width:46px;height:46px;display:grid;place-items:center;transform-origin:center bottom;transition:transform .28s cubic-bezier(.22,1,.36,1);}
.ng-bottom-nav__icon img{width:100%;height:100%;object-fit:contain;display:block;opacity:.8;filter:brightness(.82) saturate(.92) drop-shadow(0 3px 6px rgba(11,18,31,.3));transition:opacity .25s ease,filter .25s ease;}
.ng-bottom-nav__item[aria-current="page"] .ng-bottom-nav__icon img{opacity:1;filter:drop-shadow(0 6px 16px rgba(118,92,255,.65));}
.ng-bottom-nav__label{position:relative;z-index:2;min-width:42px;max-width:100%;margin-top:-4px;padding:2px 7px 3px;font-size:10px;font-weight:700;line-height:1.2;color:#fff;text-align:center;white-space:nowrap;text-overflow:ellipsis;border:1px solid rgba(118,92,255,.3);border-radius:999px;background:#11172f;box-shadow:0 3px 8px rgba(11,18,31,.18);}
.ng-bottom-nav__item[aria-current="page"]{color:#765cff;background:transparent;}
.ng-bottom-nav__item[aria-current="page"] .ng-bottom-nav__icon{transform:translateY(-6px) scale(1.16);}
.ng-bottom-nav__item[aria-current="page"] .ng-bottom-nav__label{border-color:#a78bfa;background:linear-gradient(180deg,#7c66ff,#5b44e0);}
.ng-bottom-nav__item[aria-current="page"]::after{content:"";position:absolute;right:28%;bottom:-3px;left:34%;height:2px;border-radius:99px 99px 0 0;background:#765cff;}
.ng-bottom-nav__item--home .ng-bottom-nav__label{min-width:50px;}
#cardsScroll{padding-bottom:calc(92px + env(safe-area-inset-bottom)) !important;scroll-padding-bottom:92px;}
@media(max-width:360px){.ng-bottom-nav{padding-inline:5px}.ng-bottom-nav__item{min-height:59px}.ng-bottom-nav__icon{width:38px;height:38px}.ng-bottom-nav__label{min-width:38px;padding-inline:6px;font-size:9px}}
@media(orientation:landscape) and (max-height:560px){.ng-bottom-nav{min-height:58px;padding-top:4px}.ng-bottom-nav__item{min-height:48px}}

/* ===== 平台卡片：深色宇宙玻璃风（1:1 复刻 NG） ===== */
#cardsScroll{
  background:
    radial-gradient(900px 520px at 10% -8%, rgba(118,92,255,.16), transparent 55%),
    radial-gradient(820px 520px at 112% -2%, rgba(56,189,248,.12), transparent 50%),
    linear-gradient(180deg, rgba(10,14,42,.34), rgba(7,10,30,.92) 30%, #06091d 100%);
}
#cardsScroll .section h2{ color:#eaf0ff; }
.card-row--platform{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; padding:0; background:none; border:none; box-shadow:none; border-radius:0; }
.card--platform{
  position:relative; display:grid; grid-template-columns:62px minmax(0,1fr) 92px;
  grid-template-areas:"avatar meta go"; align-items:center; gap:13px; padding:16px;
  border-radius:22px; border:1px solid rgba(125,112,255,.38); color:#f5f4ff;
  background:
    radial-gradient(circle at 86% 6%, rgba(70,197,255,.14), transparent 34%),
    linear-gradient(145deg, rgba(114,91,255,.16), rgba(0,0,0,0) 48%),
    rgba(13,18,52,.8);
  box-shadow:0 6px 20px rgba(3,9,23,.28), inset 0 1px 0 rgba(255,255,255,.05);
  backdrop-filter:blur(12px) saturate(1.1); -webkit-backdrop-filter:blur(12px) saturate(1.1);
  opacity:0; animation:iosCardIn .62s cubic-bezier(.22,1,.36,1) forwards;
  animation-delay:var(--stagger,0ms);
  transition:transform .3s cubic-bezier(.22,1,.36,1), border-color .3s, box-shadow .3s;
}
.card--platform:hover{
  transform:translateY(-3px); border-color:rgba(146,136,255,.66);
  box-shadow:0 16px 36px rgba(3,9,23,.45), 0 0 0 1px rgba(125,112,255,.28), inset 0 1px 0 rgba(255,255,255,.09);
}
.card--platform .avatar{
  grid-area:avatar; width:62px; height:62px; border-radius:50%; object-fit:cover;
  border:2px solid rgba(87,132,205,.68);
  box-shadow:0 0 0 4px rgba(116,91,255,.1), 0 0 22px rgba(52,205,255,.18);
  background:linear-gradient(145deg,#1c3557,#10233c);
}
.card--platform .meta{ grid-area:meta; min-width:0; }
.card--platform .title{ font-size:17px; font-weight:800; color:#edf4ff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.card--platform .desc{ margin-top:3px; font-size:13px; line-height:1.35; font-weight:400; color:#94a6bf; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; }
.card--platform .go{
  grid-area:go; display:inline-flex; align-items:center; justify-content:center;
  width:92px; height:36px; border-radius:10px; font-size:12px; font-weight:600; color:#fff;
  text-decoration:none; border:1px solid rgba(126,225,255,.66);
  background:linear-gradient(120deg,#415ddd,#6443ba);
  box-shadow:0 6px 14px rgba(80,70,200,.38), inset 0 1px 0 rgba(255,255,255,.18);
  transition:transform .15s, filter .25s, box-shadow .25s;
}
.card--platform .go:hover{ filter:brightness(1.12); box-shadow:0 9px 22px rgba(100,80,230,.55), inset 0 1px 0 rgba(255,255,255,.24); }
.card--platform .go:active{ transform:scale(.95); }
.card-rec-badge{
  position:absolute; top:0; right:10px; z-index:2; display:inline-flex; align-items:center;
  height:20px; padding:1px 9px; font-size:11px; font-weight:700; color:#fff;
  border-radius:0 0 7px 7px; letter-spacing:.5px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.4), 0 4px 11px rgba(0,0,0,.28);
}
.badge-color-hot{ background:linear-gradient(120deg,#d91f3e 0%,#f33f32 45%,#ff8b20 100%); }
.badge-color-premium{ background:linear-gradient(120deg,#6536de 0%,#8b4df2 48%,#cf4fc4 100%); }
.badge-color-verified{ background:linear-gradient(120deg,#1559d7 0%,#167df0 48%,#12a4f3 100%); }
@media(max-width:860px){ .card-row--platform{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:540px){
  .card-row--platform{ grid-template-columns:1fr; gap:10px; }
  .card--platform{ padding:13px; grid-template-columns:54px minmax(0,1fr) 84px; gap:11px; }
  .card--platform .avatar{ width:54px; height:54px; }
  .card--platform .title{ font-size:15px; }
  .card--platform .go{ width:84px; height:34px; }
}

/* ===== 第二轮：顶部品牌区/跑马灯/logo条/标题tab 深色宇宙风 ===== */
body{
  background:
    radial-gradient(1100px 620px at 10% -8%, rgba(118,92,255,.16), transparent 42%),
    radial-gradient(900px 560px at 98% 0%, rgba(56,189,248,.12), transparent 44%),
    radial-gradient(820px 620px at 50% 122%, rgba(118,92,255,.1), transparent 52%),
    linear-gradient(160deg,#070b22 0%,#0b1030 52%,#06091d 100%) !important;
  background-attachment:fixed !important;
  color:#e7ecff;
}
.top-bg{ opacity:.16 !important; filter:brightness(.32) saturate(1.3) !important; }
.fixed-area{ background:linear-gradient(180deg, rgba(7,10,30,.55), rgba(7,10,30,0)) !important; }
/* 顶部品牌玻璃面板 */
header{
  background:linear-gradient(145deg, rgba(113,84,255,.14), rgba(0,0,0,0) 40%, rgba(40,200,255,.1)), rgba(13,18,52,.8) !important;
  border:1px solid rgba(125,112,255,.38) !important;
  box-shadow:0 6px 20px rgba(3,9,23,.28) !important;
  backdrop-filter:blur(18px) saturate(1.22); -webkit-backdrop-filter:blur(18px) saturate(1.22);
  border-radius:22px !important;
}
header::before{ opacity:0 !important; }
header::after{ background:linear-gradient(90deg,transparent,rgba(125,112,255,.55),transparent) !important; }
.brand .title{ color:#f5f4ff !important; }
.brand-logo{ filter:drop-shadow(0 6px 14px rgba(118,92,255,.4)); }
.nav-links a{ color:#e7ecff !important; }
/* 右上主按钮 */
.nav-main-btn{
  background:linear-gradient(120deg,#415ddd,#6443ba) !important;
  color:#fff !important;
  border:1px solid rgba(126,225,255,.6) !important;
  box-shadow:0 8px 20px rgba(80,70,200,.45), inset 0 1px 0 rgba(255,255,255,.2) !important;
  text-shadow:none !important;
}
.nav-main-btn:hover{ filter:brightness(1.1); box-shadow:0 10px 26px rgba(100,80,230,.6), inset 0 1px 0 rgba(255,255,255,.24) !important; }
/* 轮播控件协调 */
.carousel-wrap{ border:1px solid rgba(125,112,255,.3) !important; box-shadow:0 14px 34px rgba(3,9,23,.4) !important; }
.car-btn{ background:rgba(13,18,52,.62) !important; color:#e7ecff !important; border:1px solid rgba(125,112,255,.42) !important; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.car-btn:hover{ background:rgba(80,70,200,.55) !important; }
.dot{ background:rgba(255,255,255,.25) !important; border-color:rgba(255,255,255,.3) !important; }
.dot.active{ background:#765cff !important; box-shadow:0 0 12px rgba(118,92,255,.7) !important; }
/* 跑马灯深色玻璃 */
.marquee-wrap{
  background:linear-gradient(145deg, rgba(113,84,255,.14), rgba(0,0,0,0) 40%, rgba(40,200,255,.1)), rgba(13,18,52,.8) !important;
  border:1px solid rgba(125,112,255,.38) !important;
  border-radius:22px !important;
  box-shadow:0 6px 20px rgba(3,9,23,.28) !important;
  backdrop-filter:blur(18px) saturate(1.22); -webkit-backdrop-filter:blur(18px) saturate(1.22);
}
.marquee-wrap::before{ background:linear-gradient(135deg,#765cff,#415ddd) !important; }
.marquee-text{ color:#b8c8e0 !important; text-shadow:none !important; }
/* 圆形 logo 条：去外壳、深蓝圆紫边 */
.icon-ticker{
  background:transparent !important;
  border:none !important;
  box-shadow:none !important;
  padding:5px 2px !important;
}
.icon-item{
  width:56px; height:56px;
  background:#11173e !important;
  border:1px solid rgba(125,112,255,.4) !important;
  box-shadow:0 0 0 3px rgba(116,91,255,.08), 0 6px 16px rgba(3,9,23,.35) !important;
  padding:3px;
}
.icon-item:hover{ border-color:rgba(146,136,255,.75) !important; box-shadow:0 0 0 4px rgba(116,91,255,.16),0 0 22px rgba(52,205,255,.22) !important; }
/* 区块标题 */
.ng-section-title{
  text-align:center; font-size:24px; font-weight:700; color:#edf4ff;
  letter-spacing:1px; margin:14px 0 12px;
  text-shadow:0 0 24px rgba(118,92,255,.4);
}
/* tab 深色玻璃 */
.category-tabs{
  background:rgba(13,18,52,.6) !important;
  border:1px solid rgba(125,112,255,.3) !important;
  box-shadow:0 6px 18px rgba(3,9,23,.3) !important;
  backdrop-filter:blur(14px) saturate(1.2); -webkit-backdrop-filter:blur(14px) saturate(1.2);
}
.tab-btn{
  background:rgba(255,255,255,.06) !important;
  color:#c7d2fe !important;
  border:1px solid rgba(125,112,255,.28) !important;
  box-shadow:none !important;
}
.tab-btn:hover{ background:rgba(125,112,255,.18) !important; color:#fff !important; }
.tab-btn.active{
  background:linear-gradient(120deg,#415ddd,#6443ba) !important;
  color:#fff !important;
  border-color:rgba(126,225,255,.55) !important;
  box-shadow:0 8px 18px rgba(80,70,200,.5) !important;
}
/* 深色下的空状态与页脚文字 */
#cardGrid [style*="color:#"]{ color:#9fb0d0 !important; }
.site-footer, .site-footer .text, .brand-footer .name{ color:#9fb0d0 !important; }
@media(max-width:768px){ .icon-item{ width:46px; height:46px; } .ng-section-title{ font-size:20px; } }

/* ===== 第二轮补充：热门游戏/工具 tab 图标卡片深色化（平台卡不受影响） ===== */
#cardGrid .card-row:not(.card-row--platform){
  background:none !important; border:none !important; box-shadow:none !important;
  padding:0 !important; border-radius:0 !important; gap:10px;
}
#cardGrid .card:not(.card--platform){
  background:linear-gradient(145deg, rgba(113,84,255,.14), rgba(0,0,0,0) 46%), rgba(13,18,52,.72) !important;
  border:1px solid rgba(125,112,255,.3) !important;
  border-radius:16px !important;
  box-shadow:0 6px 16px rgba(3,9,23,.28), inset 0 1px 0 rgba(255,255,255,.05) !important;
  padding:12px 6px !important;
  backdrop-filter:blur(10px) saturate(1.15); -webkit-backdrop-filter:blur(10px) saturate(1.15);
}
#cardGrid .card:not(.card--platform):hover{
  border-color:rgba(146,136,255,.62) !important;
  transform:translateY(-3px);
  box-shadow:0 14px 28px rgba(3,9,23,.48), 0 0 0 1px rgba(125,112,255,.22) !important;
}
#cardGrid .card:not(.card--platform) .title{ color:#dbe3ff !important; }
#cardGrid .card:not(.card--platform) .avatar{
  border-color:rgba(87,132,205,.5) !important;
  background:#11173e !important;
  box-shadow:0 4px 12px rgba(3,9,23,.4) !important;
}

/* ===== 第三轮：宇宙背景/品牌logo/分享按钮/图标悬停放大 ===== */
body{
  background:
    linear-gradient(180deg, rgba(6,9,29,.55), rgba(6,9,29,.82) 30%, rgba(6,9,29,.92)),
    url('../../images/bg-cosmos.webp') center top / cover no-repeat fixed,
    #06091d !important;
}
.top-bg{ display:none !important; }
.brand-logo{ height:42px !important; width:auto; object-fit:contain; }
/* 分享邀请按钮 */
.nav-share-btn{
  display:inline-flex; align-items:center; gap:8px;
  height:44px; padding:0 18px; border-radius:14px; cursor:pointer;
  background:linear-gradient(120deg,#415ddd,#6443ba);
  color:#fff; border:1px solid rgba(126,225,255,.6);
  box-shadow:0 8px 20px rgba(80,70,200,.45), inset 0 1px 0 rgba(255,255,255,.2);
  font-size:14px; font-weight:700; letter-spacing:.5px;
  transition:filter .25s, box-shadow .25s, transform .15s;
}
.nav-share-btn:hover{ filter:brightness(1.1); box-shadow:0 10px 26px rgba(100,80,230,.6), inset 0 1px 0 rgba(255,255,255,.24); }
.nav-share-btn:active{ transform:scale(.96); }
.nav-share-btn .share-icon{ width:20px; height:20px; object-fit:contain; }
/* 圆形链接 logo 悬停放大（仅桌面，移动端不变） */
.icon-item img{ transition:transform .28s cubic-bezier(.22,1,.36,1); }
@media(min-width:769px){
  .icon-item:hover img{ transform:scale(1.22); }
}

/* ===== 第三轮修正：header 星球 hero-art + 方块分享按钮 ===== */
body{
  background:
    radial-gradient(1100px 620px at 10% -8%, rgba(118,92,255,.16), transparent 42%),
    radial-gradient(900px 560px at 98% 0%, rgba(56,189,248,.12), transparent 44%),
    linear-gradient(160deg,#070b22 0%,#0b1030 52%,#06091d 100%) !important;
  background-attachment:fixed !important;
}
header{ position:relative; overflow:hidden; }
header .nav{ position:relative; z-index:1; }
.ng-theme-hero-art{
  position:absolute; right:0; top:0; bottom:0; width:380px; pointer-events:none; z-index:0;
  background:url('../../images/bg-cosmos.webp') right center / cover no-repeat;
  opacity:.55;
  -webkit-mask-image:linear-gradient(90deg, transparent 0%, #000 55%);
  mask-image:linear-gradient(90deg, transparent 0%, #000 55%);
}
.nav-share-btn{
  width:44px !important; height:44px !important; min-width:0 !important; padding:0 !important;
  display:inline-flex; align-items:center; justify-content:center;
  border-radius:14px; cursor:pointer;
  background:linear-gradient(135deg,#6f5bff,#563fd0);
  border:1px solid rgba(200,190,255,.55);
  box-shadow:0 0 0 4px rgba(116,91,255,.12), 0 13px 32px rgba(55,39,178,.38), 0 0 24px rgba(51,213,255,.16);
  transition:filter .25s, box-shadow .25s, transform .12s;
}
.nav-share-btn:hover{ filter:brightness(1.12); }
.nav-share-btn:active{ transform:scale(.92); }
.nav-share-btn.copied{ background:linear-gradient(135deg,#10b981,#059669) !important; box-shadow:0 0 0 4px rgba(16,185,129,.18),0 13px 30px rgba(5,150,105,.4) !important; }
.nav-share-btn .share-svg{ width:21px; height:21px; fill:none; stroke:#fff; stroke-width:1.9; stroke-linecap:round; stroke-linejoin:round; }

/* ===== 邀请有礼弹窗（复刻目标站） ===== */
.invite-modal{ position:fixed; inset:0; z-index:9999; display:none; align-items:center; justify-content:center; padding:20px; }
.invite-modal.show{ display:flex; }
.invite-backdrop{ position:absolute; inset:0; background:rgba(3,6,20,.66); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.invite-panel{ position:relative; width:100%; max-width:520px; max-height:90vh; overflow:auto;
  background:linear-gradient(180deg,#131a3d,#0c1130);
  border:1px solid rgba(125,112,255,.35); border-radius:22px;
  box-shadow:0 30px 80px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.05);
  animation:inviteIn .28s cubic-bezier(.22,1,.36,1); }
@keyframes inviteIn{ from{opacity:0; transform:translateY(16px) scale(.97);} to{opacity:1; transform:none;} }
.invite-head{ display:flex; align-items:center; justify-content:space-between; gap:10px; padding:18px 22px;
  background:linear-gradient(120deg,#6f5bff,#3b82f6); border-radius:22px 22px 0 0; }
.invite-head-t{ display:flex; align-items:center; gap:12px; }
.invite-gift{ width:34px; height:34px; color:#fff; flex:0 0 auto; }
.invite-head strong{ display:block; font-size:19px; color:#fff; font-weight:800; line-height:1.1; }
.invite-head span{ display:block; font-size:12px; color:rgba(255,255,255,.85); margin-top:3px; }
.invite-close{ width:34px; height:34px; border-radius:10px; border:none; cursor:pointer; flex:0 0 auto;
  background:rgba(0,0,0,.28); color:#fff; font-size:16px; line-height:1; transition:background .2s; }
.invite-close:hover{ background:rgba(0,0,0,.45); }
.invite-body{ padding:20px 22px 24px; }
.invite-card{ background:rgba(13,18,52,.7); border:1px solid rgba(125,112,255,.25); border-radius:16px; padding:16px; }
.invite-card-top{ display:flex; gap:12px; align-items:center; }
.invite-card-icon{ width:46px; height:46px; border-radius:14px; flex:0 0 auto; display:flex; align-items:center; justify-content:center;
  background:linear-gradient(135deg,#6f5bff,#563fd0); box-shadow:0 6px 14px rgba(86,63,208,.4); color:#fff; }
.invite-card-top span{ display:block; font-size:11px; color:#8b96d4; }
.invite-card-top strong{ display:block; font-size:16px; color:#eaf0ff; margin:2px 0; }
.invite-card-top em{ display:inline-block; font-style:normal; font-size:11px; font-weight:700; color:#fff; background:linear-gradient(135deg,#fb923c,#ef4444); padding:3px 9px; border-radius:999px; }
.invite-card p{ font-size:12.5px; color:#9aa6d0; line-height:1.6; margin:12px 0 0; }
.invite-prog-head{ display:flex; justify-content:space-between; font-size:12.5px; color:#c4cdf0; margin:14px 0 6px; }
.invite-prog{ height:8px; border-radius:99px; background:rgba(255,255,255,.08); overflow:hidden; }
.invite-prog i{ display:block; height:100%; background:linear-gradient(90deg,#6f5bff,#38bdf8); border-radius:99px; }
.invite-status{ margin-top:8px; text-align:center; font-size:12.5px; color:#9aa6d0; background:rgba(255,255,255,.04); border-radius:10px; padding:8px; }
.invite-site{ margin:16px 0 4px; }
.invite-site strong{ display:block; font-size:15px; color:#eaf0ff; }
.invite-site span{ display:block; font-size:12px; color:#8b96d4; margin-top:2px; }
.invite-label{ display:block; font-size:12.5px; color:#9aa6d0; margin:14px 0 6px; }
#inviteLink{ width:100%; box-sizing:border-box; padding:11px 14px; border-radius:12px;
  background:rgba(255,255,255,.06); border:1px solid rgba(125,112,255,.3); color:#eaf0ff; font-size:13px; outline:none; }
.invite-actions{ display:flex; gap:10px; margin-top:14px; }
.invite-btn{ flex:1; height:44px; border-radius:12px; border:none; cursor:pointer; font-size:14px; font-weight:700; transition:filter .2s, transform .12s; }
.invite-btn.primary{ background:linear-gradient(135deg,#6f5bff,#3b82f6); color:#fff; box-shadow:0 8px 20px rgba(86,63,208,.4); }
.invite-btn:not(.primary){ background:rgba(255,255,255,.08); color:#cdd6f5; border:1px solid rgba(125,112,255,.3); }
.invite-btn:hover{ filter:brightness(1.08); }
.invite-btn:active{ transform:scale(.98); }
@media(max-width:520px){ .invite-panel{ max-height:94vh; } .invite-body{ padding:16px; } }

/* ===== 礼物图 + 去掉推荐平台标题与tab ===== */
.invite-gift{ width:34px; height:34px; object-fit:contain; }
.invite-card-icon img{ width:30px; height:30px; object-fit:contain; }
#ngSectionTitle, #categoryTabs{ display:none !important; }

/* ===== 客服视图 ===== */
.service-view{ position:fixed; top:68px; bottom:0; left:0; right:0; z-index:90; display:none; overflow-y:auto;
  padding:20px 16px calc(96px + env(safe-area-inset-bottom));
  background:
    radial-gradient(1000px 600px at 12% -6%, rgba(118,92,255,.16), transparent 44%),
    linear-gradient(160deg,#070b22 0%,#0b1030 55%,#06091d 100%); }
.service-view.show{ display:block; animation:svcIn .3s ease; }
@keyframes svcIn{ from{opacity:0; transform:translateY(10px);} to{opacity:1; transform:none;} }
.svc-title{ text-align:center; font-size:24px; font-weight:800; color:#eaf0ff; letter-spacing:.02em; margin:8px 0 4px; }
.svc-title span{ color:#765cff; }
.svc-title::after{ content:""; display:block; width:56px; height:3px; margin:10px auto 0; border-radius:99px;
  background:linear-gradient(90deg,#765cff,#38bdf8); }
.svc-grid{ display:grid; grid-template-columns:1fr; gap:14px; margin:22px auto 0; max-width:860px; }
@media(min-width:640px){ .svc-grid{ grid-template-columns:1fr 1fr; } .svc-card:nth-child(odd){ grid-column:1; } .svc-card:nth-child(even){ grid-column:2; } }
.svc-card{ padding:16px; border-radius:18px;
  background:linear-gradient(145deg, rgba(113,84,255,.12), rgba(0,0,0,0) 46%), rgba(13,18,52,.78);
  border:1px solid rgba(125,112,255,.3);
  box-shadow:0 8px 22px rgba(3,9,23,.3);
  }
.svc-card-top{ display:flex; align-items:center; gap:12px; margin-bottom:14px; }
.svc-logo{ width:46px; height:46px; border-radius:14px; flex:0 0 auto; display:flex; align-items:center; justify-content:center; color:#fff; }
.svc-logo--tg{ background:linear-gradient(135deg,#38bdf8,#2563eb); box-shadow:0 6px 14px rgba(37,99,235,.4); }
.svc-logo--ww{ background:linear-gradient(135deg,#fff2e8,#ffe3cc); box-shadow:0 6px 14px rgba(255,122,26,.32); }
.svc-logo--qq{ background:linear-gradient(135deg,#eef4ff,#dbe7ff); box-shadow:0 6px 14px rgba(59,110,220,.3); color:#1f3b8a; }
.svc-logo--img{ background:#f4f6fb; box-shadow:0 6px 14px rgba(30,41,90,.18); }
.svc-logo img{ width:100%; height:100%; object-fit:contain; border-radius:inherit; padding:6px; }
.svc-logo svg{ width:26px; height:26px; }
.svc-meta{ flex:1; min-width:0; }
.svc-meta strong{ display:block; font-size:16px; color:#eaf0ff; font-weight:700; }
.svc-online{ display:inline-flex; align-items:center; gap:5px; font-size:11px; color:#34d399; margin-top:3px; }
.svc-online i{ width:6px; height:6px; border-radius:50%; background:#34d399; box-shadow:0 0 6px #34d399; }
.svc-meta em{ display:block; font-style:normal; font-size:12px; color:#9aa6d0; margin-top:2px; }
.svc-btn{ display:flex; align-items:center; justify-content:center; gap:7px; width:100%; height:46px; border-radius:13px;
  border:none; cursor:pointer; font-size:15px; font-weight:700; text-decoration:none; transition:filter .2s, transform .12s; }
.svc-btn--primary{ background:linear-gradient(135deg,#7c66ff,#5b44e0); color:#fff; box-shadow:0 8px 20px rgba(91,68,224,.4); }
.svc-btn--copy{ background:rgba(118,92,255,.22); color:#c4b5fd; border:1px solid rgba(125,112,255,.4); }
.svc-btn:hover{ filter:brightness(1.1); }
.svc-btn:active{ transform:scale(.98); }
.svc-tip{ max-width:860px; margin:18px auto 0; padding:14px 16px; border-radius:14px;
  background:rgba(118,92,255,.08); border:1px solid rgba(125,112,255,.25);
  display:flex; gap:12px; align-items:flex-start; color:#c4b5fd; }
.svc-tip strong{ display:block; font-size:13px; color:#eaf0ff; }
.svc-tip p{ font-size:12.5px; color:#9aa6d0; line-height:1.6; margin:3px 0 0; }

/* 客服卡片排版修正：名称+在线同行；TG 旁小复制按钮 */
.svc-meta-top{ display:flex; align-items:center; justify-content:space-between; gap:8px; }
.svc-meta-top strong{ font-size:16px; color:#eaf0ff; font-weight:700; }
.svc-online{ display:inline-flex; align-items:center; gap:5px; font-size:11px; color:#34d399; }
.svc-action-row{ display:flex; gap:8px; align-items:stretch; }
.svc-action-row .svc-btn{ flex:1; }
.svc-copy-sm{ width:46px; flex:0 0 auto; border-radius:13px; cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  background:rgba(118,92,255,.22); color:#c4b5fd; border:1px solid rgba(125,112,255,.4);
  transition:filter .2s, transform .12s; }
.svc-copy-sm:hover{ filter:brightness(1.15); }
.svc-copy-sm:active{ transform:scale(.92); }
.svc-copy-sm.copied{ background:#10b981; color:#fff; border-color:#10b981; }

/* ===== 发现页 ===== */
#discoverView .dc-list{ display:flex; flex-direction:column; gap:14px; margin:18px auto 0; max-width:860px; }
#discoverView .dc-section{ margin-top:30px; }
#discoverView .dc-card{ position:relative; display:flex; align-items:center; gap:14px; padding:18px;
  border-radius:18px; text-decoration:none;
  background:linear-gradient(145deg, rgba(113,84,255,.12), rgba(0,0,0,0) 46%), rgba(13,18,52,.78);
  border:1px solid rgba(125,112,255,.3);
  box-shadow:0 8px 22px rgba(3,9,23,.3);
  backdrop-filter:blur(14px) saturate(1.2); -webkit-backdrop-filter:blur(14px) saturate(1.2);
  transition:transform .2s, border-color .2s; }
#discoverView .dc-card:hover{ border-color:rgba(146,136,255,.6); transform:translateY(-2px); }
#discoverView .dc-ico{ width:48px; height:48px; flex:0 0 auto; display:flex; align-items:center; justify-content:center; }
#discoverView .dc-ico img{ width:48px; height:48px; object-fit:contain; filter:drop-shadow(0 4px 10px rgba(118,92,255,.35)); }
#discoverView .dc-meta{ flex:1; min-width:0; }
#discoverView .dc-meta strong{ display:block; font-size:17px; color:#eaf0ff; font-weight:700; }
#discoverView .dc-meta span{ display:block; font-size:13px; color:#9aa6d0; margin-top:3px; }
#discoverView .dc-meta em{ display:inline-block; font-style:normal; font-size:13px; color:#7c8cf8; margin-top:6px; }
#discoverView .dc-arrow{ flex:0 0 auto; color:#7c8cf8; }
#discoverView .dc-arrow--orange{ color:#f59e0b; }
#discoverView .dc-badge18{ position:absolute; top:12px; right:14px; font-size:11px; font-weight:800; color:#fff;
  background:linear-gradient(135deg,#ef4444,#f97316); padding:3px 8px; border-radius:999px; box-shadow:0 4px 10px rgba(239,68,68,.4); }

.dc-link--red{ color:#f87171 !important; }
.dc-link--cyan{ color:#22d3ee !important; }

/* ===== 官方公告页 ===== */
#noticeView .nc-tabs{ display:flex; gap:12px; margin:18px auto 0; max-width:860px; }
#noticeView .nc-tab{ flex:1; padding:13px 0; border-radius:13px; cursor:pointer;
  font-size:15px; font-weight:600; text-align:center;
  background:rgba(255,255,255,.06); color:#9aa6d0; border:1px solid rgba(125,112,255,.25);
  transition:background .2s, color .2s; }
#noticeView .nc-tab.is-active{ background:linear-gradient(135deg,#7c66ff,#5b44e0); color:#fff;
  border-color:transparent; box-shadow:0 8px 18px rgba(91,68,224,.4); }
#noticeView .nc-list{ display:flex; flex-direction:column; gap:14px; margin:16px auto 0; max-width:860px; }
#noticeView .nc-card{ display:flex; gap:14px; padding:18px; border-radius:18px;
  background:linear-gradient(145deg, rgba(113,84,255,.12), rgba(0,0,0,0) 46%), rgba(13,18,52,.78);
  border:1px solid rgba(125,112,255,.3);
  box-shadow:0 8px 22px rgba(3,9,23,.3);
  }
#noticeView .nc-ico{ width:46px; height:46px; flex:0 0 auto; }
#noticeView .nc-ico img{ width:46px; height:46px; object-fit:contain; filter:drop-shadow(0 4px 10px rgba(118,92,255,.35)); }
#noticeView .nc-body{ flex:1; min-width:0; }
#noticeView .nc-title{ display:flex; align-items:center; gap:8px; }
#noticeView .nc-title strong{ font-size:15px; color:#a78bfa; font-weight:700; }
#noticeView .nc-badge{ font-size:11px; font-weight:700; color:#7c66ff; background:rgba(118,92,255,.16);
  padding:2px 8px; border-radius:999px; border:1px solid rgba(125,112,255,.3); }
#noticeView .nc-body h3{ font-size:16px; color:#eaf0ff; font-weight:700; margin:8px 0 5px; }
#noticeView .nc-body p{ font-size:14px; color:#9aa6d0; line-height:1.6; }

/* ===== 大舞台页 ===== */
#stageView .st-head{ display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin:10px auto 0; max-width:860px; }
#stageView .st-title h2{ font-size:26px; color:#eaf0ff; font-weight:800; }
#stageView .st-title p{ font-size:13px; color:#9aa6d0; margin-top:4px; }
#stageView .st-actions{ display:flex; gap:8px; }
#stageView .st-pub{ padding:9px 16px; border-radius:11px; cursor:pointer; font-size:13px; font-weight:600;
  background:rgba(255,255,255,.06); color:#9aa6d0; border:1px solid rgba(125,112,255,.3); }
#stageView .st-pub--primary{ background:linear-gradient(135deg,#7c66ff,#5b44e0); color:#fff; border-color:transparent;
  box-shadow:0 6px 14px rgba(91,68,224,.35); }
#stageView .st-tip{ max-width:860px; margin:14px auto 0; font-size:12px; color:#7c8cb8; }
#stageView .st-list{ display:flex; flex-direction:column; gap:14px; margin:14px auto 0; max-width:860px; }
#stageView .st-card{ padding:16px; border-radius:16px;
  background:linear-gradient(145deg, rgba(113,84,255,.10), rgba(0,0,0,0) 46%), rgba(13,18,52,.72);
  border:1px solid rgba(125,112,255,.28);
  backdrop-filter:blur(12px) saturate(1.2); -webkit-backdrop-filter:blur(12px) saturate(1.2); }
#stageView .st-user{ display:flex; align-items:center; gap:10px; }
#stageView .st-avatar{ width:38px; height:38px; border-radius:50%; overflow:hidden; background:rgba(118,92,255,.2);
  border:2px solid rgba(125,112,255,.4); }
#stageView .st-avatar img{ width:100%; height:100%; object-fit:cover; }
#stageView .st-user strong{ font-size:15px; color:#eaf0ff; }
#stageView .st-text{ font-size:15px; color:#dbe4ff; margin:12px 0 10px; line-height:1.5; }
#stageView .st-media{ width:170px; height:170px; border-radius:12px; background:rgba(0,0,0,.35);
  border:1px solid rgba(125,112,255,.2); }
#stageView .st-media--video{ display:flex; align-items:center; justify-content:center; }
#stageView .st-play{ width:42px; height:42px; border-radius:50%; background:rgba(124,102,255,.85); color:#fff;
  display:flex; align-items:center; justify-content:center; font-size:16px; }
#stageView .st-foot{ display:flex; align-items:center; justify-content:space-between; margin-top:12px; }
#stageView .st-time{ font-size:12px; color:#6b7aa8; }
#stageView .st-ops{ display:flex; gap:8px; }
#stageView .st-ops button{ font-size:12px; color:#9aa6d0; background:none; border:none; cursor:pointer; padding:4px 8px; }
#stageView .st-input{ margin-top:12px; padding:10px 12px; border-radius:10px; font-size:12px; color:#6b7aa8;
  background:rgba(255,255,255,.04); border:1px solid rgba(125,112,255,.18); }

/* ===== 投稿弹窗 ===== */
.publish-modal{ position:fixed; inset:0; z-index:120; display:none; }
.publish-modal.is-open{ display:block; }
.publish-modal .pm-mask{ position:absolute; inset:0; background:rgba(3,6,20,.72); backdrop-filter:blur(4px); }
.publish-modal .pm-panel{ position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
  width:min(92vw,480px); max-height:88vh; overflow-y:auto; padding:24px; border-radius:20px;
  background:linear-gradient(160deg, rgba(35,30,90,.96), rgba(13,18,52,.96));
  border:1px solid rgba(125,112,255,.4);
  box-shadow:0 24px 60px rgba(3,6,20,.6), inset 0 1px 0 rgba(255,255,255,.08); }
.publish-modal .pm-close{ position:absolute; top:16px; right:16px; width:34px; height:34px; border-radius:10px;
  background:rgba(118,92,255,.2); color:#c4b5fd; border:1px solid rgba(125,112,255,.4); cursor:pointer;
  display:flex; align-items:center; justify-content:center; }
.publish-modal h3{ font-size:20px; color:#fff; font-weight:800; }
.publish-modal .pm-sub{ font-size:12px; color:#9aa6d0; margin:6px 0 18px; }
.publish-modal .pm-label{ display:block; font-size:13px; color:#dbe4ff; font-weight:600; margin:14px 0 8px; }
.publish-modal .pm-label em{ font-style:normal; color:#7c8cb8; font-weight:400; font-size:12px; margin-left:6px; }
.publish-modal .pm-input,.publish-modal .pm-textarea{ width:100%; box-sizing:border-box;
  background:rgba(255,255,255,.05); border:1.5px solid rgba(125,112,255,.25); border-radius:12px;
  padding:11px 14px; color:#eaf0ff; font-size:14px; outline:none; }
.publish-modal .pm-input:focus,.publish-modal .pm-textarea:focus{ border-color:#7c66ff; background:rgba(255,255,255,.08); }
.publish-modal .pm-input::placeholder,.publish-modal .pm-textarea::placeholder{ color:#6b7aa8; }
.publish-modal .pm-textarea{ min-height:130px; resize:vertical; }
.publish-modal .pm-check{ display:flex; align-items:center; gap:8px; font-size:13px; color:#dbe4ff; margin:10px 0 0; cursor:pointer; }
.publish-modal .pm-count{ text-align:right; font-size:12px; color:#7c8cb8; margin-top:4px; }
.publish-modal .pm-file{ display:flex; align-items:center; gap:10px; padding:12px; border-radius:12px;
  border:1.5px dashed rgba(125,112,255,.4); background:rgba(255,255,255,.03); cursor:pointer; }
.publish-modal .pm-file input{ display:none; }
.publish-modal .pm-file span{ padding:6px 12px; border-radius:8px; background:rgba(118,92,255,.2); color:#c4b5fd; font-size:13px; }
.publish-modal .pm-file i{ font-style:normal; font-size:12px; color:#6b7aa8; }
.publish-modal .pm-foot{ display:flex; justify-content:flex-end; gap:10px; margin-top:20px; }
.publish-modal .pm-btn{ padding:10px 20px; border-radius:11px; font-size:14px; font-weight:600; cursor:pointer; border:none; }
.publish-modal .pm-btn--ghost{ background:rgba(255,255,255,.08); color:#dbe4ff; }
.publish-modal .pm-btn--primary{ background:linear-gradient(135deg,#7c66ff,#5b44e0); color:#fff;
  box-shadow:0 8px 18px rgba(91,68,224,.4); }
/* 点赞/评论交互态 */
#stageView .st-ops button.is-liked{ color:#f472b6; }
#stageView .st-toast{ position:fixed; left:50%; bottom:120px; transform:translateX(-50%);
  background:rgba(20,16,50,.95); color:#fff; padding:10px 18px; border-radius:10px; font-size:13px;
  border:1px solid rgba(125,112,255,.4); z-index:130; opacity:0; transition:opacity .2s; pointer-events:none; }
#stageView .st-toast.show{ opacity:1; }

/* ===== 优惠大厅 ===== */
#offerView .of-head{ display:flex; align-items:flex-end; justify-content:space-between; margin:10px auto 0; max-width:860px; }
#offerView .of-eyebrow{ display:block; font-style:normal; font-size:12px; letter-spacing:.18em; color:#a78bfa; font-weight:700; }
#offerView .of-head h2{ font-size:24px; color:#eaf0ff; font-weight:800; margin-top:4px; }
#offerView .of-count{ font-size:12px; color:#7c8cb8; }
#offerView .of-tabs{ display:flex; gap:12px; margin:16px auto 0; max-width:860px; }
#offerView .of-tab{ flex:1; padding:12px 0; border-radius:12px; cursor:pointer; font-size:14px; font-weight:600;
  background:rgba(255,255,255,.05); color:#9aa6d0; border:1px solid rgba(125,112,255,.25); }
#offerView .of-tab b{ margin-left:4px; font-size:12px; opacity:.8; }
#offerView .of-tab.is-active{ background:linear-gradient(135deg,#7c66ff,#5b44e0); color:#fff; border-color:transparent;
  box-shadow:0 8px 18px rgba(91,68,224,.35); }
#offerView .of-list{ display:flex; flex-direction:column; gap:14px; margin:16px auto 0; max-width:860px; }
#offerView .of-card{ position:relative; display:flex; align-items:center; gap:16px; padding:24px; border-radius:18px; text-decoration:none; overflow:hidden; min-height:180px;
  background:linear-gradient(120deg, rgba(20,16,60,.92), rgba(40,30,90,.7));
  border:1px solid rgba(125,112,255,.32);
  box-shadow:0 10px 26px rgba(3,9,23,.3);
  }
#offerView .of-info{ flex:1; min-width:0; position:relative; z-index:2; }
#offerView .of-tag{ font-size:12px; font-weight:700; color:#a78bfa; }
#offerView .of-info h3{ font-size:19px; color:#eaf0ff; font-weight:800; margin:8px 0 6px; }
#offerView .of-gold{ display:block; font-size:16px; color:#fbbf24; font-weight:800; }
#offerView .of-progress{ display:block; font-size:13px; color:#9aa6d0; margin-top:6px; }
#offerView .of-more{ display:inline-block; font-size:13px; color:#7c8cf8; margin-top:10px; }
#offerView .of-art{ position:absolute; right:0; top:0; bottom:0; width:58%; z-index:1; }
#offerView .of-art img{ width:100%; height:100%; object-fit:cover; }

/* ===== 活动详情 ===== */
#offerDetailView .od-back{ display:inline-flex; align-items:center; gap:6px; margin:6px 0 0;
  padding:9px 14px; border-radius:11px; cursor:pointer; font-size:13px; font-weight:600;
  background:rgba(255,255,255,.06); color:#dbe4ff; border:1px solid rgba(125,112,255,.3); }
#offerDetailView .od-hero{ position:relative; margin:14px auto 0; max-width:860px; border-radius:18px; overflow:hidden;
  background:linear-gradient(120deg, rgba(20,16,60,.92), rgba(40,30,90,.7)); border:1px solid rgba(125,112,255,.32);
  padding:24px; min-height:180px; display:flex; align-items:center; }
#offerDetailView .od-hero-info{ flex:1; min-width:0; position:relative; z-index:2; }
#offerDetailView .od-hero-info h2{ font-size:24px; color:#eaf0ff; font-weight:800; margin:10px 0 8px; }
#offerDetailView .od-hero-art{ position:absolute; right:0; top:0; bottom:0; width:55%; }
#offerDetailView .od-hero-art img{ width:100%; height:100%; object-fit:cover; }
#offerDetailView .od-progress{ margin:14px auto 0; max-width:860px; padding:16px 18px; border-radius:14px;
  background:rgba(13,18,52,.78); border:1px solid rgba(125,112,255,.3); }
#offerDetailView .od-pg-row{ display:flex; justify-content:space-between; align-items:center; font-size:14px; color:#dbe4ff; }
#offerDetailView .od-pg-row b{ color:#fff; }
#offerDetailView .od-pg-row em{ font-style:normal; font-size:12px; color:#34d399; }
#offerDetailView .od-bar{ margin-top:10px; height:6px; border-radius:999px; background:rgba(255,255,255,.08); overflow:hidden; }
#offerDetailView .od-bar i{ display:block; width:0; height:100%; border-radius:999px;
  background:linear-gradient(90deg,#7c66ff,#5b44e0); }
#offerDetailView .od-rules{ margin:14px auto 30px; max-width:860px; padding:18px; border-radius:14px;
  background:rgba(13,18,52,.78); border:1px solid rgba(125,112,255,.3); }
#offerDetailView .od-rules h3{ font-size:15px; color:#eaf0ff; font-weight:700; }
#offerDetailView .od-rules p{ font-size:13px; color:#9aa6d0; line-height:1.7; margin-top:8px; }
#offerDetailView .od-rules .od-note{ font-size:12px; color:#6b7aa8; margin-top:6px; }

/* 活动横版封面卡 */
#offerView .of-card{ position:relative; display:block; border-radius:18px; overflow:hidden; aspect-ratio:1500/600;
  box-shadow:0 10px 26px rgba(3,9,23,.3); }
#offerView .of-cover{ width:100%; height:100%; object-fit:cover; display:block; }
#offerView .of-shade{ position:absolute; inset:0; background:linear-gradient(90deg, rgba(8,6,30,.94) 0%, rgba(8,6,30,.6) 48%, rgba(8,6,30,0) 75%); }
#offerView .of-copy{ position:absolute; left:26px; top:50%; transform:translateY(-50%); z-index:2;
  display:flex; flex-direction:column; gap:6px; max-width:62%; }
#offerView .of-copy strong{ font-size:22px; color:#fff; font-weight:800; line-height:1.2; }
#offerView .of-copy .of-gold{ font-size:18px; color:#fbbf24; font-weight:800; }
#offerView .of-copy .of-meta{ font-size:13px; color:#9aa6d0; }
#offerView .of-cta{ display:inline-flex; align-items:center; gap:4px; font-size:13px; color:#7c8cf8; margin-top:6px; }
/* 详情 hero 封面 */
#offerDetailView .od-hero{ position:relative; margin:14px auto 0; max-width:860px; border-radius:18px; overflow:hidden;
  aspect-ratio:1500/600; }
#offerDetailView .od-cover{ width:100%; height:100%; object-fit:cover; display:block; }
#offerDetailView .od-shade{ position:absolute; inset:0; background:linear-gradient(90deg, rgba(8,6,30,.94) 0%, rgba(8,6,30,.6) 48%, rgba(8,6,30,0) 75%); }
#offerDetailView .od-hero-copy{ position:absolute; left:26px; top:50%; transform:translateY(-50%); z-index:2;
  display:flex; flex-direction:column; gap:6px; max-width:62%; }
#offerDetailView .od-hero-copy h2{ font-size:24px; color:#fff; font-weight:800; margin:0; }

/* ===== 试玩大厅 ===== */
#gameHallView .gh-tabs{ display:flex; gap:12px; margin:18px auto 0; max-width:860px; }
#gameHallView .gh-tab{ flex:1; padding:13px 0; border-radius:13px; cursor:pointer; font-size:15px; font-weight:600;
  background:rgba(255,255,255,.05); color:#9aa6d0; border:1px solid rgba(125,112,255,.25); }
#gameHallView .gh-tab.is-active{ background:linear-gradient(135deg,#7c66ff,#5b44e0); color:#fff; border-color:transparent;
  box-shadow:0 8px 18px rgba(91,68,224,.35); }
#gameHallView .gh-section{ margin-top:28px; }
#gameHallView .gh-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; margin:16px auto 0; max-width:860px; }
@media(max-width:640px){ #gameHallView .gh-grid{ grid-template-columns:1fr; } }
#gameHallView .gh-card{ position:relative; display:block; border-radius:16px; overflow:hidden; text-decoration:none; min-height:160px;
  border:1px solid rgba(125,112,255,.28);
}
#gameHallView .gh-card::before{ content:""; position:absolute; inset:0; z-index:1;
  background:linear-gradient(90deg, rgba(8,6,30,.92) 0%, rgba(8,6,30,.65) 45%, rgba(8,6,30,0) 78%); }
#gameHallView .gh-info{ position:relative; z-index:2; min-width:0; padding:20px; display:flex; flex-direction:column; align-items:flex-start; height:100%; box-sizing:border-box; }
#gameHallView .gh-info strong{ font-size:22px; color:#fff; font-weight:800; }
#gameHallView .gh-info span{ font-size:13px; color:#9aa6d0; margin-top:4px; }
#gameHallView .gh-enter{ margin-top:auto; margin-top:14px; padding:8px 16px; border-radius:10px; cursor:pointer;
  background:linear-gradient(135deg,#7c66ff,#5b44e0); color:#fff; font-size:13px; font-weight:600; border:none;
  box-shadow:0 6px 14px rgba(91,68,224,.35); }
#gameHallView .gh-art{ position:absolute; inset:0; width:100%; height:100%; background-size:cover; background-position:center; z-index:0;
}
#gameHallView .gh-art--1{ background:url(../../images/game/card-1.webp) center/cover; }
#gameHallView .gh-art--2{ background:url(../../images/game/card-2.webp) center/cover; }
#gameHallView .gh-art--3{ background:url(../../images/game/card-3.webp) center/cover; }
#gameHallView .gh-art--4{ background:url(../../images/game/card-4.webp) center/cover; }
#gameHallView .gh-art--5{ background:url(../../images/game/card-5.webp) center/cover; }
#gameHallView .gh-art--6{ background:url(../../images/game/card-6.webp) center/cover; }

#gameHallView .gh-art--7{ background:url(../../images/game/card-7.webp) center/cover; }
#gameHallView .gh-art--8{ background:url(../../images/game/card-8.webp) center/cover; }
#gameHallView .gh-art--9{ background:url(../../images/game/card-9.webp) center/cover; }
#gameHallView .gh-art--10{ background:url(../../images/game/card-10.webp) center/cover; }
#gameHallView .gh-art--11{ background:url(../../images/game/card-11.webp) center/cover; }
#gameHallView .gh-art--12{ background:url(../../images/game/card-12.webp) center/cover; }
#gameHallView .gh-art--13{ background:url(../../images/game/card-13.webp) center/cover; }

#gameHallView .gh-tab img{ width:20px; height:20px; vertical-align:middle; margin-right:6px; }
/* ===== 领奖弹窗（深色默认 + 浅色覆盖） ===== */
.claim-modal{position:fixed;inset:0;z-index:1200;display:none;}
.claim-modal.show{display:block;}
.claim-backdrop{position:absolute;inset:0;background:rgba(5,8,20,.62);backdrop-filter:blur(3px);}
.claim-panel{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(420px,92vw);max-height:88vh;overflow:auto;background:#141a33;border:1px solid rgba(255,255,255,.08);border-radius:20px;box-shadow:0 24px 60px rgba(0,0,0,.5);}
.claim-head{display:flex;align-items:center;justify-content:space-between;padding:18px 20px;border-bottom:1px solid rgba(255,255,255,.07);}
.claim-head strong{font-size:16px;color:#fff;}
.claim-close{background:none;border:none;color:#9aa6c8;font-size:16px;cursor:pointer;}
.claim-body{padding:18px 20px 22px;}
.claim-reward{background:linear-gradient(135deg,rgba(245,158,11,.16),rgba(245,158,11,.06));border:1px solid rgba(245,158,11,.3);border-radius:12px;padding:10px 14px;font-size:13px;color:#fbbf24;margin-bottom:14px;display:none;}
.claim-reward.show{display:block;}
.claim-body label{display:block;font-size:12px;color:#a9b4d6;margin:10px 0 6px;}
.claim-body input{width:100%;padding:11px 13px;border-radius:11px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:#fff;font-size:14px;box-sizing:border-box;}
.claim-body input:focus{outline:none;border-color:#f59e0b;}
.claim-submit{width:100%;margin-top:18px;padding:13px;border:none;border-radius:12px;background:linear-gradient(135deg,#f59e0b,#ea580c);color:#fff;font-size:15px;font-weight:700;cursor:pointer;}
.claim-tip{margin-top:12px;font-size:11px;color:#8a94b8;text-align:center;line-height:1.6;}
.invite-claim-btn{width:100%;margin-top:14px;}
body.theme-light .claim-panel{background:#fff;border-color:rgba(15,23,42,.08);}
body.theme-light .claim-head strong{color:#111827;}
body.theme-light .claim-close{color:#64748b;}
body.theme-light .claim-body label{color:#475569;}
body.theme-light .claim-body input{background:#f8fafc;border-color:rgba(15,23,42,.14);color:#111827;}
body.theme-light .claim-tip{color:#94a3b8;}
