/* Offline mirror card polish: match the large two-column manager cards. */
:root {
  --offline-brand-label: "Love Meet";
  --offline-verify-label: "Verified";
  --offline-region-label: "Bangkok";
  --offline-hero-label: "Private Match\A Safe local preview";
}

html[lang="zh-CN"] {
  --offline-brand-label: "Love约会";
  --offline-verify-label: "已验证";
  --offline-region-label: "曼谷";
  --offline-hero-label: "私密邂逅\A安全、本地、无需登录";
}

html[lang="zh-TW"] {
  --offline-brand-label: "Love約會";
  --offline-verify-label: "已驗證";
  --offline-region-label: "曼谷";
  --offline-hero-label: "私密邂逅\A安全、本地、無需登入";
}

html[lang="ko"] {
  --offline-brand-label: "love 만남";
  --offline-verify-label: "검증됨";
  --offline-region-label: "방콕";
  --offline-hero-label: "밤의 전쟁\A안전한 비공개 만남";
}

html[lang="ja"] {
  --offline-brand-label: "Love出会い";
  --offline-verify-label: "認証済み";
  --offline-region-label: "バンコク";
  --offline-hero-label: "プライベートな出会い\A安全なローカルプレビュー";
}

html[lang="es"] {
  --offline-brand-label: "Love Citas";
  --offline-verify-label: "Verificado";
  --offline-region-label: "Bangkok";
  --offline-hero-label: "Encuentro privado\A Vista previa segura sin iniciar sesión";
}

html[lang="fr"] {
  --offline-brand-label: "Love Rencontre";
  --offline-verify-label: "Vérifié";
  --offline-region-label: "Bangkok";
  --offline-hero-label: "Rencontre privée\A Aperçu local sécurisé";
}

html[lang="de"] {
  --offline-brand-label: "Love Treffen";
  --offline-verify-label: "Verifiziert";
  --offline-region-label: "Bangkok";
  --offline-hero-label: "Private Begegnung\A Sichere lokale Vorschau";
}

html[lang="pt-BR"] {
  --offline-brand-label: "Love Encontro";
  --offline-verify-label: "Verificado";
  --offline-region-label: "Bangkok";
  --offline-hero-label: "Encontro privado\A Prévia local segura";
}

html[lang="ru"] {
  --offline-brand-label: "Love Встречи";
  --offline-verify-label: "Проверено";
  --offline-region-label: "Бангкок";
  --offline-hero-label: "Приватная встреча\A Безопасный локальный просмотр";
}

html[lang="ar"] {
  --offline-brand-label: "Love لقاء";
  --offline-verify-label: "تم التحقق";
  --offline-region-label: "بانكوك";
  --offline-hero-label: "لقاء خاص\A معاينة محلية آمنة";
}

html[lang="hi"] {
  --offline-brand-label: "Love मिलन";
  --offline-verify-label: "सत्यापित";
  --offline-region-label: "बैंकॉक";
  --offline-hero-label: "निजी मिलन\A सुरक्षित स्थानीय पूर्वावलोकन";
}

html[lang="id"] {
  --offline-brand-label: "Love Bertemu";
  --offline-verify-label: "Terverifikasi";
  --offline-region-label: "Bangkok";
  --offline-hero-label: "Pertemuan privat\A Pratinjau lokal aman";
}

html[lang="vi"] {
  --offline-brand-label: "Love Gặp gỡ";
  --offline-verify-label: "Đã xác minh";
  --offline-region-label: "Bangkok";
  --offline-hero-label: "Gặp gỡ riêng tư\A Xem trước cục bộ an toàn";
}

html[lang="th"] {
  --offline-brand-label: "Love พบกัน";
  --offline-verify-label: "ยืนยันแล้ว";
  --offline-region-label: "กรุงเทพฯ";
  --offline-hero-label: "การพบกันแบบส่วนตัว\A ตัวอย่างในเครื่องที่ปลอดภัย";
}

html[lang="it"] {
  --offline-brand-label: "Love Incontro";
  --offline-verify-label: "Verificato";
  --offline-region-label: "Bangkok";
  --offline-hero-label: "Incontro privato\A Anteprima locale sicura";
}

html[lang="tr"] {
  --offline-brand-label: "Love Buluşma";
  --offline-verify-label: "Doğrulandı";
  --offline-region-label: "Bangkok";
  --offline-hero-label: "Özel buluşma\A Güvenli yerel önizleme";
}

html[lang="nl"] {
  --offline-brand-label: "Love Ontmoeting";
  --offline-verify-label: "Geverifieerd";
  --offline-region-label: "Bangkok";
  --offline-hero-label: "Privé ontmoeting\A Veilige lokale preview";
}

html[lang="pl"] {
  --offline-brand-label: "Love Spotkanie";
  --offline-verify-label: "Zweryfikowano";
  --offline-region-label: "Bangkok";
  --offline-hero-label: "Prywatne spotkanie\A Bezpieczny lokalny podgląd";
}

.header_content .img {
  font-size: 0 !important;
}

.header_content .img::after {
  content: var(--offline-brand-label);
  display: inline-block;
  margin-left: 2vw;
  color: #ffc9dd;
  font-size: 3.6vw;
  line-height: 1;
  vertical-align: middle;
}

.banner_swiper {
  position: relative !important;
  overflow: hidden !important;
}

.banner_swiper .banner_img {
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}

.banner_swiper::before {
  content: "";
  position: absolute;
  z-index: 8;
  left: 0;
  top: 0;
  bottom: 0;
  width: min(70vw, 538px);
  border-radius: 0;
  background: linear-gradient(90deg, #1b1515 0%, #1b1515 84%, rgba(27, 21, 21, 0.96) 100%);
  box-shadow: 8px 0 22px rgba(0, 0, 0, 0.22);
  pointer-events: none;
}

.banner_swiper::after {
  content: var(--offline-hero-label);
  position: absolute;
  z-index: 9;
  left: 5.2vw;
  bottom: 5.4vw;
  width: min(54vw, 410px);
  color: #f3c7a2;
  font-size: clamp(14px, 3.6vw, 24px);
  line-height: 1.22;
  font-weight: 800;
  letter-spacing: 0.02em;
  white-space: pre-line;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.7);
  pointer-events: none;
}

.tu_list[data-v-2207f582],
.tu_list[data-v-72199a72] {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 5vw 3.6vw;
  padding: 3.2vw 3.6vw 18vw !important;
}

/* Detail page polish for cards opened from the manager grid. */
.feiziInfo[data-v-3663e17f] {
  min-height: calc(100vh - 13.333vw);
  background: #1f1c1f;
  padding-bottom: 8vw;
}

.feiziInfo .topInfo[data-v-3663e17f] {
  margin: 3.2vw 3.4vw 0;
  padding: 4.2vw 4vw !important;
  border: 1px solid #6f614d;
  border-radius: 2.4vw;
  background: linear-gradient(120deg, #222, #303030);
  color: #f3c7a2;
}

.feiziInfo .topInfo div:first-child span[data-v-3663e17f]:first-child {
  color: #f3c7a2 !important;
  font-size: 7.2vw !important;
  line-height: 1.1;
  font-weight: 700;
}

.feiziInfo .topInfo > div:nth-child(2)[data-v-3663e17f] {
  display: flex;
  flex-wrap: wrap;
  gap: 2vw;
  margin: 3.2vw 0 2.4vw !important;
  color: #ddd !important;
  font-size: 3.7vw !important;
  line-height: 1.5;
}

.feiziInfo .topInfo > div:nth-child(3)[data-v-3663e17f] {
  width: 100% !important;
  display: flex;
  flex-wrap: wrap;
  gap: 2vw;
}

.feiziInfo .topInfo .item[data-v-3663e17f] {
  min-width: 14vw;
  margin: 0 0 2vw 0 !important;
  padding: 1.4vw 4vw !important;
  border-radius: 7vw !important;
  background: #efc49a !important;
  color: #5b4633 !important;
  text-align: center;
  font-size: 3.6vw !important;
  font-weight: 700;
}

.feiziInfo .topInfo > div:last-child[data-v-3663e17f] {
  display: flex;
  align-items: center;
  gap: 2vw;
  margin-top: 1vw;
}

.feiziInfo .topInfo > div:last-child span[data-v-3663e17f] {
  color: #f3c7a2 !important;
  font-size: 3.3vw !important;
}

.feiziInfo .cenInfo[data-v-3663e17f] {
  padding: 3.5vw 0 0 !important;
}

.feiziInfo .cenInfo + div[data-v-3663e17f],
.feiziInfo .topInfo + div[data-v-3663e17f] {
  padding-bottom: 0 !important;
  height: 1px;
  background: #3b3430 !important;
}

.feiziInfo .imgswiper[data-v-3663e17f] {
  width: auto !important;
  margin: 0 3.4vw 3.2vw !important;
  padding-bottom: 1.5vw;
  gap: 2vw;
}

.feiziInfo .imgswiper > div[data-v-3663e17f] {
  width: 18vw !important;
  height: 18vw !important;
  margin-right: 0 !important;
  flex: 0 0 auto;
}

.feiziInfo .imgswiper .imgI[data-v-3663e17f] {
  width: 18vw !important;
  height: 18vw !important;
  overflow: hidden;
  border: 0.8vw solid transparent;
  border-radius: 1.6vw;
}

.feiziInfo .imgswiper .active[data-v-3663e17f] {
  border: 0.8vw solid #f3c7a2 !important;
}

.feiziInfo .imgswiper .van-image__img[data-v-3663e17f] {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  border-radius: 0.8vw;
}

.feiziInfo .cenInfo > div > div > .van-image[data-v-3663e17f] {
  display: block !important;
  width: calc(100% - 6.8vw) !important;
  height: auto !important;
  margin: 0 auto 5vw;
  border: 1px solid #6f614d;
  border-radius: 2.2vw;
  overflow: hidden;
  background: #111;
}

.feiziInfo .cenInfo > div > div > .van-image > .van-image__img[data-v-3663e17f] {
  position: static !important;
  display: block;
  width: 100% !important;
  height: auto !important;
  object-fit: contain !important;
}

@media (min-width: 900px) {
  .feiziInfo[data-v-3663e17f] {
    min-height: calc(100vh - 98px);
    padding-bottom: 72px;
  }

  .feiziInfo .topInfo[data-v-3663e17f] {
    margin: 28px 56px 0;
    padding: 32px 36px !important;
    border-radius: 18px;
  }

  .feiziInfo .topInfo div:first-child span[data-v-3663e17f]:first-child {
    font-size: 52px !important;
  }

  .feiziInfo .topInfo > div:nth-child(2)[data-v-3663e17f] {
    gap: 18px;
    margin: 22px 0 18px !important;
    font-size: 28px !important;
  }

  .feiziInfo .topInfo .item[data-v-3663e17f] {
    min-width: 110px;
    padding: 10px 28px !important;
    border-radius: 40px !important;
    font-size: 26px !important;
  }

  .feiziInfo .topInfo > div:last-child span[data-v-3663e17f] {
    font-size: 24px !important;
  }

  .feiziInfo .imgswiper[data-v-3663e17f] {
    margin: 28px 56px 28px !important;
    gap: 16px;
  }

  .feiziInfo .imgswiper > div[data-v-3663e17f],
  .feiziInfo .imgswiper .imgI[data-v-3663e17f] {
    width: 112px !important;
    height: 112px !important;
  }

  .feiziInfo .imgswiper .imgI[data-v-3663e17f],
  .feiziInfo .imgswiper .active[data-v-3663e17f] {
    border-width: 6px !important;
    border-radius: 12px;
  }

  .feiziInfo .cenInfo > div > div > .van-image[data-v-3663e17f] {
    width: calc(100% - 112px) !important;
    margin-bottom: 42px;
    border-radius: 16px;
  }
}

.tu_list[data-v-72199a72] {
  padding-top: 16vw !important;
}

.tu_list .tu_item[data-v-2207f582],
.tu_list .tu_item[data-v-72199a72] {
  position: relative !important;
  aspect-ratio: 1.24 / 1;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  display: block !important;
  border: 0.8vw solid #6f614d !important;
  border-radius: 2.4vw !important;
  background: #171417 !important;
  box-shadow: none !important;
  isolation: isolate;
}

.tu_list .tu_item[data-v-2207f582]::before,
.tu_list .tu_item[data-v-72199a72]::before {
  content: "";
  position: absolute;
  z-index: 3;
  top: 2.9vw;
  left: 2.2vw;
  width: 1.2vw;
  height: 4.8vw;
  border-radius: 2vw;
  background: #f2c89d;
  box-shadow: 2vw 0 0 #f2c89d, 4vw 0 0 #f2c89d;
  opacity: 0.92;
}

.tu_list .tu_item .sm_in_c[data-v-2207f582],
.tu_list .tu_item .sm_in_c[data-v-72199a72] {
  position: absolute !important;
  inset: 0;
  z-index: 0;
  width: 100% !important;
  height: 100% !important;
  border-radius: 1.6vw !important;
  object-fit: cover !important;
}

.tu_list .tu_item .renzh[data-v-2207f582],
.tu_list .tu_item .renzh[data-v-72199a72] {
  position: absolute !important;
  z-index: 4;
  top: 3vw !important;
  right: -7.8vw !important;
  width: 24vw;
  height: 5.2vw;
  padding: 0 !important;
  line-height: 5.2vw;
  text-align: center;
  font-size: 0 !important;
  font-style: normal;
  color: #1b1612 !important;
  background: #efc49a !important;
  transform: rotate(45deg) !important;
}

.tu_list .tu_item .renzh[data-v-2207f582]::after,
.tu_list .tu_item .renzh[data-v-72199a72]::after {
  content: var(--offline-verify-label, "Verified");
  font-size: 2.9vw;
  font-weight: 700;
}

.tu_list .tu_item .info_box[data-v-2207f582],
.tu_list .tu_item .info_box[data-v-72199a72] {
  position: absolute !important;
  z-index: 2;
  left: 0;
  right: 0;
  bottom: 0;
  height: 25%;
  padding: 1.6vw 2vw !important;
  background: rgba(45, 38, 32, 0.58);
  color: #f0c49b;
}

.tu_list .tu_item .info_box[data-v-2207f582]::after,
.tu_list .tu_item .info_box[data-v-72199a72]::after {
  content: none !important;
  display: none !important;
}

.tu_list .tu_item .info_box .offline-card-region-tag {
  position: absolute;
  top: 1.7vw;
  right: 1.8vw;
  min-width: 10vw;
  height: 4.8vw;
  padding: 0 2.4vw;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 6vw;
  color: #66513e;
  background: #efc49a;
  font-size: 2.8vw;
  font-weight: 700;
}

.tu_list .tu_item .info_box .c_id[data-v-2207f582],
.tu_list .tu_item .info_box .c_id[data-v-72199a72] {
  position: absolute;
  top: 1.6vw;
  left: 2vw;
  width: calc(100% - 16vw) !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #f0c49b !important;
  text-align: left !important;
  font-size: 3.3vw;
  line-height: 4.8vw;
  font-weight: 700;
}

.tu_list .tu_item .info_box .c_c[data-v-2207f582],
.tu_list .tu_item .info_box .c_c[data-v-72199a72] {
  display: none !important;
}

.tu_list .tu_item .info_box .c_b_k[data-v-2207f582],
.tu_list .tu_item .info_box .c_b_k[data-v-72199a72] {
  position: absolute;
  left: 2vw;
  bottom: 1.4vw;
  padding-top: 0 !important;
  display: flex !important;
  align-items: center;
  color: #dedede !important;
  font-size: 2.8vw !important;
  font-weight: 700;
  line-height: 3.8vw;
}

.tu_list .tu_item .info_box .c_b_k .sm_in[data-v-2207f582],
.tu_list .tu_item .info_box .c_b_k .sm_in[data-v-72199a72] {
  width: 3.5vw !important;
  height: 3.5vw !important;
  margin-right: 0.8vw;
  opacity: 0.86;
}

.tu_list .tu_item .info_box .c_b_k .sm_in.cc[data-v-2207f582],
.tu_list .tu_item .info_box .c_b_k .sm_in.cc[data-v-72199a72] {
  margin-left: 2.4vw !important;
}

@media (min-width: 900px) {
  .tu_list[data-v-2207f582],
  .tu_list[data-v-72199a72] {
    gap: 34px 28px;
    padding-left: 56px !important;
    padding-right: 56px !important;
  }

  .tu_list[data-v-72199a72] {
    padding-top: 118px !important;
  }

  .tu_list .tu_item[data-v-2207f582]::before,
  .tu_list .tu_item[data-v-72199a72]::before {
    top: 28px;
    left: 28px;
    width: 9px;
    height: 48px;
    box-shadow: 20px 0 0 #f2c89d, 40px 0 0 #f2c89d;
  }

  .tu_list .tu_item .renzh[data-v-2207f582],
  .tu_list .tu_item .renzh[data-v-72199a72] {
    top: 28px !important;
    right: -58px !important;
    width: 178px;
    height: 36px;
    line-height: 36px;
  }

  .tu_list .tu_item .renzh[data-v-2207f582]::after,
  .tu_list .tu_item .renzh[data-v-72199a72]::after {
    font-size: 24px;
  }

  .tu_list .tu_item .info_box[data-v-2207f582],
  .tu_list .tu_item .info_box[data-v-72199a72] {
    height: 94px;
    padding: 15px 20px !important;
  }

  .tu_list .tu_item .info_box[data-v-2207f582]::after,
  .tu_list .tu_item .info_box[data-v-72199a72]::after {
    top: 16px;
    right: 18px;
    min-width: 86px;
    height: 32px;
    padding: 0 18px;
    font-size: 22px;
  }

  .tu_list .tu_item .info_box .c_id[data-v-2207f582],
  .tu_list .tu_item .info_box .c_id[data-v-72199a72] {
    top: 15px;
    left: 20px;
    width: calc(100% - 132px) !important;
    font-size: 28px;
    line-height: 34px;
  }

  .tu_list .tu_item .info_box .c_b_k[data-v-2207f582],
  .tu_list .tu_item .info_box .c_b_k[data-v-72199a72] {
    left: 20px;
    bottom: 14px;
    font-size: 22px !important;
    line-height: 28px;
  }

  .tu_list .tu_item .info_box .c_b_k .sm_in[data-v-2207f582],
  .tu_list .tu_item .info_box .c_b_k .sm_in[data-v-72199a72] {
    width: 22px !important;
    height: 22px !important;
    margin-right: 7px;
  }

  .tu_list .tu_item .info_box .c_b_k .sm_in.cc[data-v-2207f582],
  .tu_list .tu_item .info_box .c_b_k .sm_in.cc[data-v-72199a72] {
    margin-left: 20px !important;
  }
}

/* Manager profile detail: match the clicked-card reference screens. */
.feiziInfo[data-v-3663e17f] {
  padding: 0 0 24vw !important;
  background: #1f1c1f !important;
}

.feiziInfo .topInfo[data-v-3663e17f],
.feiziInfo .imgswiper[data-v-3663e17f],
.feiziInfo > div[style][data-v-3663e17f] {
  display: none !important;
}

.offline-detail-panel {
  color: #f3c7a2;
}

.offline-video-card {
  width: 100%;
  background: #000;
  overflow: hidden;
}

.offline-video-poster {
  position: relative;
  width: 100%;
  height: 122vw;
  max-height: 850px;
  min-height: 520px;
  overflow: hidden;
  background: #000;
}

.offline-video-poster::before {
  content: "";
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  right: 0;
  height: 7.4vw;
  max-height: 48px;
  background: #000;
}

.offline-video-poster img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: center top;
}

.offline-video-controls {
  height: 18vw;
  min-height: 92px;
  max-height: 118px;
  padding: 0 3.8vw;
  display: flex;
  align-items: center;
  gap: 4.2vw;
  color: #fff;
  background: #000;
  font-size: 3.8vw;
  font-weight: 700;
}

.offline-video-controls .play {
  font-size: 4.6vw;
}

.offline-video-controls .spacer {
  flex: 1;
}

.offline-video-controls::after {
  content: "";
  position: absolute;
  left: 3.8vw;
  right: 3.8vw;
  bottom: 4.3vw;
  height: 0.85vw;
  border-radius: 2vw;
  background: linear-gradient(90deg, #bfbfbf 0 30%, #707070 30% 100%);
}

.offline-video-controls {
  position: relative;
}

.offline-voice-row {
  position: relative;
  height: 8.6vw;
  min-height: 48px;
  margin: 2vw 2.6vw 0;
  padding: 0 2.5vw;
  display: flex;
  align-items: center;
  gap: 2vw;
  border: 1px solid #8a6f55;
  border-radius: 1.2vw;
  background: linear-gradient(120deg, #222, #2f2f2f);
  color: #f3c7a2;
  font-size: 3.4vw;
  font-weight: 800;
  overflow: hidden;
}

.offline-voice-row .voice-icon,
.offline-basic-card .basic-icon {
  color: #f3c7a2;
  font-size: 4.6vw;
  font-weight: 900;
  line-height: 1;
}

.offline-voice-row .verify-ribbon {
  margin-left: auto;
  width: 18vw;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #3b2619;
  background: linear-gradient(105deg, transparent 0 20%, #f3c7a2 22% 100%);
  font-size: 3.4vw;
  font-weight: 800;
}

.offline-profile-id {
  margin: 3vw 2.6vw 2vw;
  color: #f2f2f2;
  font-size: 4.6vw;
  line-height: 1;
  font-weight: 800;
}

.offline-score-card,
.offline-basic-card {
  margin: 0 2.6vw 2vw;
  border: 1px solid #80674f;
  border-radius: 1.2vw;
  background: linear-gradient(120deg, #202020, #2f2f2f);
  color: #f4f4f4;
}

.offline-score-card {
  min-height: 22vw;
  display: grid;
  grid-template-columns: 28% 1fr;
  align-items: center;
  padding: 3vw 3.5vw;
}

.offline-score-left {
  text-align: center;
  color: #f3c7a2;
}

.offline-score-left span,
.offline-score-left em {
  display: block;
  color: #eee;
  font-size: 3vw;
  font-style: normal;
  font-weight: 800;
}

.offline-score-left strong {
  display: block;
  margin: 1.4vw 0;
  color: #f3c7a2;
  font-size: 8vw;
  line-height: 0.9;
}

.offline-score-right {
  color: #fff;
  font-size: 3.3vw;
  line-height: 1.72;
  font-weight: 700;
}

.offline-score-right p {
  margin: 0;
}

.offline-basic-card {
  padding: 3.6vw 5vw;
}

.offline-basic-card p {
  margin: 0 0 2.5vw;
  display: flex;
  align-items: center;
  gap: 2vw;
  color: #fff;
  font-size: 3.6vw;
  line-height: 1.25;
  font-weight: 800;
}

.offline-basic-card p:last-child {
  margin-bottom: 0;
}

.offline-basic-card b {
  color: #fff;
}

.feiziInfo .cenInfo[data-v-3663e17f] {
  padding: 0 !important;
}

.feiziInfo .cenInfo > div[style][data-v-3663e17f],
.feiziInfo .cenInfo div[style*="background-color: rgb(102"][data-v-3663e17f],
.feiziInfo .cenInfo div[style*="background-color: #666"][data-v-3663e17f] {
  display: none !important;
}

.feiziInfo .cenInfo > div > div > .van-image[data-v-3663e17f] {
  width: calc(100% - 5.2vw) !important;
  margin: 1vw auto 6.5vw !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
}

.feiziInfo .cenInfo > div > div > .van-image > .van-image__img[data-v-3663e17f] {
  width: 100% !important;
  height: auto !important;
  display: block !important;
  object-fit: contain !important;
  border-radius: 0 !important;
}

.offline-match-button {
  width: 66%;
  height: 9.2vw;
  min-height: 54px;
  max-height: 70px;
  margin: 0 auto 4vw;
  display: block;
  border: 1px solid #9d6d41;
  border-radius: 999px;
  background: linear-gradient(180deg, #ffd8b3, #eab276);
  color: #2a2521;
  font-size: 3.6vw;
  font-weight: 800;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

.offline-match-progress {
  position: fixed;
  z-index: 1300;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 8vw;
  background: rgba(10, 8, 9, 0.72);
  backdrop-filter: blur(4px);
}

body.offline-match-progress-open {
  overflow: hidden;
}

.offline-match-progress-card {
  width: min(82vw, 520px);
  border: 1px solid rgba(238, 194, 146, 0.75);
  border-radius: 22px;
  padding: 7vw 6vw 6vw;
  background: linear-gradient(180deg, #2b2828 0%, #171516 100%);
  box-shadow: 0 20px 70px rgba(0, 0, 0, 0.55), inset 0 1px 0 rgba(255, 255, 255, 0.08);
  color: #f6d1ae;
  text-align: center;
}

.offline-match-progress-icon {
  width: 15vw;
  height: 15vw;
  max-width: 92px;
  max-height: 92px;
  min-width: 64px;
  min-height: 64px;
  margin: 0 auto 4vw;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: radial-gradient(circle at 35% 28%, #fff3e2 0%, #ffc684 26%, #ee7b87 58%, #8b3853 100%);
  color: #fff3f6;
  font-size: clamp(34px, 8vw, 62px);
  line-height: 1;
  text-shadow: 0 2px 10px rgba(112, 16, 44, 0.35);
  animation: offlineMatchHeart 0.9s ease-in-out infinite;
}

.offline-match-progress-title {
  font-size: clamp(20px, 4.5vw, 30px);
  font-weight: 900;
  color: #ffd3a9;
}

.offline-match-progress-desc {
  margin-top: 2.4vw;
  color: rgba(255, 236, 218, 0.88);
  font-size: clamp(14px, 3.3vw, 20px);
  font-weight: 700;
  line-height: 1.55;
}

.offline-match-progress-bar {
  height: 3.2vw;
  max-height: 18px;
  min-height: 12px;
  margin-top: 6vw;
  overflow: hidden;
  border: 1px solid rgba(246, 198, 151, 0.58);
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
}

.offline-match-progress-bar span {
  width: 0;
  height: 100%;
  display: block;
  border-radius: inherit;
  background: linear-gradient(90deg, #ffe2bd 0%, #f6b673 45%, #ff7f9b 100%);
  box-shadow: 0 0 18px rgba(255, 171, 116, 0.65);
  transition: width 0.08s linear;
}

.offline-match-progress-foot {
  margin-top: 2.6vw;
  display: flex;
  justify-content: space-between;
  color: rgba(255, 235, 216, 0.84);
  font-size: clamp(13px, 3vw, 18px);
  font-weight: 800;
}

.offline-match-progress-foot em {
  font-style: normal;
}

.offline-match-progress-close {
  width: 66%;
  min-height: 44px;
  margin: 5.4vw auto 0;
  display: none;
  border: 1px solid #9d6d41;
  border-radius: 999px;
  background: linear-gradient(180deg, #ffd8b3, #eab276);
  color: #28221e;
  font-size: clamp(16px, 3.6vw, 22px);
  font-weight: 900;
}

.offline-match-progress.is-complete .offline-match-progress-close {
  display: block;
}

@keyframes offlineMatchHeart {
  0%, 100% {
    transform: scale(1);
  }
  45% {
    transform: scale(1.13);
  }
}

.nav-bar .van-nav-bar__title {
  color: #f3c7a2 !important;
  font-size: 4.7vw !important;
  font-weight: 900 !important;
}

.tabber_view[data-v-b12f4bba] {
  background: #1f1c1f !important;
}

.tabber_view .van-tabbar-item__text {
  white-space: nowrap;
  font-size: 3vw;
  font-weight: 700;
}

@media (min-width: 700px) {
  .offline-video-poster {
    height: 820px;
    max-height: none;
  }

  .offline-video-poster::before {
    height: 50px;
    max-height: none;
  }

  .offline-video-controls {
    height: 118px;
    padding: 0 28px;
    gap: 28px;
    font-size: 25px;
  }

  .offline-video-controls .play {
    font-size: 30px;
  }

  .offline-video-controls::after {
    left: 28px;
    right: 28px;
    bottom: 30px;
    height: 6px;
  }

  .offline-voice-row {
    height: 56px;
    margin: 14px 20px 0;
    padding: 0 18px;
    border-radius: 8px;
    gap: 14px;
    font-size: 23px;
  }

  .offline-voice-row .voice-icon,
  .offline-basic-card .basic-icon {
    font-size: 30px;
  }

  .offline-voice-row .verify-ribbon {
    width: 128px;
    font-size: 23px;
  }

  .offline-profile-id {
    margin: 22px 20px 16px;
    font-size: 32px;
  }

  .offline-score-card,
  .offline-basic-card {
    margin: 0 20px 14px;
    border-radius: 8px;
  }

  .offline-score-card {
    min-height: 160px;
    padding: 22px 26px;
  }

  .offline-score-left span,
  .offline-score-left em {
    font-size: 20px;
  }

  .offline-score-left strong {
    margin: 12px 0;
    font-size: 56px;
  }

  .offline-score-right {
    font-size: 22px;
  }

  .offline-basic-card {
    padding: 26px 36px;
  }

  .offline-basic-card p {
    margin-bottom: 18px;
    gap: 14px;
    font-size: 24px;
  }

  .feiziInfo .cenInfo > div > div > .van-image[data-v-3663e17f] {
    width: calc(100% - 40px) !important;
    margin: 8px auto 44px !important;
  }

  .offline-match-button {
    height: 62px;
    margin-bottom: 28px;
    font-size: 24px;
  }

  .nav-bar .van-nav-bar__title {
    font-size: 32px !important;
  }

  .tabber_view .van-tabbar-item__text {
    font-size: 20px;
  }
}

/* Lottery entry loading screen: dark photo wall + pulsing heart. */
.offline-lottery-loader {
  position: fixed;
  z-index: 900;
  top: 0;
  left: 0;
  right: 0;
  bottom: min(14.667vw, 118px);
  overflow: hidden;
  background: #141114;
  opacity: 1;
  transition: opacity 0.65s ease, visibility 0.65s ease;
  pointer-events: auto;
}

body.offline-lottery-loading .van-toast {
  display: none !important;
}

.offline-lottery-loader.is-done {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

.offline-lottery-mosaic {
  position: absolute;
  inset: -10vw -16vw;
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-auto-rows: 28vw;
  gap: 2vw;
  transform: rotate(-13deg) scale(1.18);
  transform-origin: center;
  opacity: 0.62;
  filter: saturate(0.75) brightness(0.72);
}

.offline-lottery-mosaic img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  border-radius: 0.8vw;
  background: #242124;
}

.offline-lottery-shade {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at center, rgba(255, 255, 255, 0.06), rgba(0, 0, 0, 0.18) 28%, rgba(0, 0, 0, 0.64) 62%, rgba(0, 0, 0, 0.82)),
    rgba(18, 18, 18, 0.48);
}

.offline-lottery-orbit {
  position: absolute;
  left: 50%;
  top: 50%;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background: rgba(255, 255, 255, 0.08);
  animation: lotteryOrbitPulse 1.35s ease-in-out infinite;
}

.offline-lottery-orbit.orbit-a {
  width: 78vw;
  height: 78vw;
  max-width: 720px;
  max-height: 720px;
}

.offline-lottery-orbit.orbit-b {
  width: 43vw;
  height: 43vw;
  max-width: 410px;
  max-height: 410px;
  animation-delay: 0.18s;
  background: rgba(255, 255, 255, 0.1);
}

.offline-lottery-heart {
  position: absolute;
  left: 50%;
  top: 51%;
  transform: translate(-50%, -50%);
  font-size: clamp(72px, 14vw, 150px);
  line-height: 1;
  filter:
    drop-shadow(0 0 14px rgba(255, 70, 110, 0.95))
    drop-shadow(0 0 34px rgba(255, 96, 132, 0.5));
  animation: lotteryHeartBeat 0.88s ease-in-out infinite;
}

.offline-lottery-text {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(51% + clamp(82px, 14vw, 155px));
  text-align: center;
  color: #fff;
  font-size: clamp(24px, 4vw, 42px);
  font-weight: 900;
  letter-spacing: 0.05em;
  text-shadow: 0 3px 10px rgba(0, 0, 0, 0.8);
}

@keyframes lotteryHeartBeat {
  0%, 100% {
    transform: translate(-50%, -50%) scale(1);
  }
  15% {
    transform: translate(-50%, -50%) scale(1.18);
  }
  32% {
    transform: translate(-50%, -50%) scale(0.95);
  }
  52% {
    transform: translate(-50%, -50%) scale(1.11);
  }
  72% {
    transform: translate(-50%, -50%) scale(1);
  }
}

@keyframes lotteryOrbitPulse {
  0%, 100% {
    transform: translate(-50%, -50%) scale(0.96);
    opacity: 0.72;
  }
  50% {
    transform: translate(-50%, -50%) scale(1.05);
    opacity: 0.92;
  }
}

.lottery .sumValueTwoSides .c_u_item[data-v-1dd68214] {
  justify-content: center !important;
  padding: 0 !important;
}

.lottery .sumValueTwoSides .c_u_item img[data-v-1dd68214] {
  display: none !important;
}

.lottery .sumValueTwoSides .text_k,
.lottery .sumValueTwoSides .text_k[data-v-1dd68214] {
  color: rgba(255, 255, 255, 0.86) !important;
  font-size: clamp(24px, 7.2vw, 54px) !important;
  line-height: 1 !important;
  font-weight: 900 !important;
}

@media (min-width: 700px) {
  .offline-lottery-mosaic {
    inset: -100px -160px;
    grid-auto-rows: 255px;
    gap: 18px;
  }
}

/* Global language selector in the top-right navigation area. */
.offline-language-switcher {
  position: fixed;
  top: max(7px, env(safe-area-inset-top));
  right: 10px;
  z-index: 1600;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans", Arial, sans-serif;
}

.offline-language-button {
  height: 34px;
  min-width: 66px;
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  border: 1px solid rgba(243, 199, 162, 0.62);
  border-radius: 999px;
  color: #f3c7a2;
  background: rgba(31, 28, 31, 0.82);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28);
  font-size: 14px;
  font-weight: 800;
}

.offline-language-button strong {
  color: #f3c7a2;
  font-size: 13px;
  line-height: 1;
}

.offline-language-panel {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  width: min(82vw, 330px);
  max-height: min(70vh, 560px);
  padding: 8px;
  display: none;
  overflow-y: auto;
  border: 1px solid rgba(243, 199, 162, 0.45);
  border-radius: 16px;
  background: rgba(30, 27, 30, 0.97);
  box-shadow: 0 22px 55px rgba(0, 0, 0, 0.5);
}

.offline-language-switcher.is-open .offline-language-panel {
  display: block;
}

.offline-language-option {
  width: 100%;
  min-height: 48px;
  padding: 7px 9px;
  display: grid;
  grid-template-columns: 34px 1fr 22px;
  align-items: center;
  gap: 8px;
  border: 0;
  border-radius: 12px;
  color: #eee;
  background: transparent;
  text-align: left;
}

.offline-language-option:hover,
.offline-language-option.is-active {
  background: rgba(243, 199, 162, 0.14);
}

.offline-language-option .flag {
  font-size: 22px;
  line-height: 1;
}

.offline-language-option .names {
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.offline-language-option b {
  color: #fff;
  font-size: 14px;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.offline-language-option small {
  margin-top: 2px;
  color: #bcb8b8;
  font-size: 11px;
  line-height: 1.2;
}

.offline-language-option .check {
  color: #f3c7a2;
  font-size: 15px;
  font-weight: 900;
  opacity: 0;
}

.offline-language-option.is-active .check {
  opacity: 1;
}

.container.page .items[data-offline-language-page="1"] {
  display: grid !important;
  gap: 10px !important;
  padding: 18px 16px 28px !important;
  background: #1f1c1f !important;
}

.offline-language-list-option {
  width: 100%;
  min-height: 58px;
  padding: 10px 14px;
  display: grid;
  grid-template-columns: 36px 1fr 26px;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(243, 199, 162, 0.34);
  border-radius: 14px;
  color: #eee;
  background: linear-gradient(120deg, #222, #2b2b2b);
  text-align: left;
}

.offline-language-list-option.is-active {
  border-color: rgba(243, 199, 162, 0.82);
  background: rgba(243, 199, 162, 0.13);
}

.offline-language-list-option .flag {
  font-size: 24px;
}

.offline-language-list-option .names {
  display: flex;
  flex-direction: column;
}

.offline-language-list-option b {
  color: #fff;
  font-size: 15px;
}

.offline-language-list-option small {
  margin-top: 3px;
  color: #bcb8b8;
  font-size: 12px;
}

.offline-language-list-option .check {
  color: #f3c7a2;
  font-size: 18px;
  font-weight: 900;
  opacity: 0;
}

.offline-language-list-option.is-active .check {
  opacity: 1;
}

@media (min-width: 700px) {
  .offline-language-switcher {
    top: 12px;
    right: calc((100vw - min(100vw, 768px)) / 2 + 18px);
  }

  .offline-language-button {
    height: 38px;
    min-width: 74px;
    font-size: 15px;
  }
}
