/* Ban VN: an nut dat truoc + logo PS5/Steam. Giu DOM de timeline GSAP entrance khong dut. */
.platform-links.platform-links-home .platform-link-home-ps5,
.platform-links.platform-links-home .platform-link-home-steam,
.platform-links.platform-links-home .platform-reserve,
.milestone-section .milestone-reserve,
.milestone-section .partner-playstation,
.milestone-section .partner-steam {
  display: none !important;
}

.home-section .home-platforms .platform-links-home {
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

/* Hang partner 1 dung left tuyet doi nen bo PS5+Steam de lai lo ~14.5vw: don 6 logo con lai
   sang trai 7.266vw, giu nguyen khoang cach giua chung. */
html[data-site='global'] .partner-saturn { left: 35.0387vw; }
html[data-site='global'] .partner-tall   { left: 44.9606vw; }
html[data-site='global'] .partner-sheet  { left: 50.8981vw; }
html[data-site='global'] .partner-cloud  { left: 57.4606vw; }
html[data-site='global'] .partner-vault  { left: 63.6715vw; }
html[data-site='global'] .partner-amd    { left: 74.4528vw; }

/* ============================================================================
   CHONG TRAN CHU BAN TIENG VIET (ban dich nam o slot "en" nen an lop [lang='en'])
   NetEase do khung [lang='en'] theo do dai chuoi ENGLISH; chuoi Viet dai hon nen
   cac khung nowrap / height co dinh duoi day bi tran. So do do o 1920x1080.
   ============================================================================ */

/* Hero — #13: QC chot xep 3 dong (Notes 25/8):
     GLOBAL RELEASE  /  XXXX.XX.XX  /  CHINH THUC RA MAT TOAN CAU
   Ban goc de ngay va title CANH NHAU tren mot dong (flex row, align baseline) nen cau VN
   dai 26 ky tu o font 5.23vw thanh 2257px > khung 1478px. Doi thanh cot: ngay dung giua
   lam diem nhan, title xuong dong duoi va nho hon ngay.
   Title 3.2vw = 61px -> chuoi 26 ky tu ~990px, gon trong khung 1478px. */
html[data-site='global'][lang='en'] .home-section .home-release-copy .home-release-main {
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  white-space: normal;
}
html[data-site='global'][lang='en'] .home-section .home-release-title {
  font-size: max(3.2vw, 5.69vh);
}
/* Vung trong cho khoi nay chi 311px: nut play het o 530px (top 40.9% + cao 8.19%), hang
   nut store bat dau 841px (top 77.85%). Khoi 3 dong = kicker 31 + 4.5 + ngay 124.5 + gap 15
   + title 71 = 246px, canh giua vung -> top 52% (562px), ket thuc 808px, con ho 33px.
   Ngay va title phai ep line-height: 'normal' cho font 124px ra ~150px, du 26px lam de. */
html[data-site='global'][lang='en'] .home-section .home-release-copy {
  top: 52%;
}
html[data-site='global'][lang='en'] .home-section .home-release-date {
  line-height: 1;
}
html[data-site='global'][lang='en'] .home-section .home-release-title {
  line-height: 1.15;
}

/* Chuoi ra mat tach tung ky tu thanh span flex: 33 glyph + 9 khoang cach = 843px
   vuot khung inline 23.867188% (458px) do JS gan (184%) -> phai !important. */
html[data-site='global'][lang='en'] .coming-soon-section .coming-soon-copy {
  width: 48% !important;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

/* Tieu de gioi thieu khu vuc dang nowrap trong cot .district-intro-content 423px:
   'Một Viên Ngọc Sáng\nTrên Sóng Nước Ngầm' = 1202px (284%). pre-line vua cho xuong
   dong vua giu \n cua ban dich; font nho lai de moi tieu de gon trong 2 dong. */
html[data-site='global'][lang='en'] .district-intro-title {
  font-size: 3.2vh;
  line-height: 4.1vh;
  white-space: pre-line;
}

/* Nut dang ky khung cung 1.2rem (120px) ma 'Đăng Ký Ngay' = 152px,
   'Đăng Ký Trước Thành Công' = 296px (247%) -> cho nut tu gian theo chu. */
html[data-site='global'][lang='en'] .action-buttons .action-item .btn-reserve {
  width: auto;
  min-width: 1.2rem;
  padding: 0 0.12rem;
  white-space: nowrap;
}

/* 2 bong thoai Tà Phi con nowrap: dialog1 = 378px/329px (115%),
   dialog3 = 558px/545px (102%). Cho xuong dong, bubble SVG keo theo chieu cao. */
html[data-site='global'][lang='en'] .tafei-dialog-anim .z_Frame_1467_000,
html[data-site='global'][lang='en'] .tafei-dialog-anim .z_Frame_1466_000 {
  height: auto;
  min-height: 0.6rem;
  white-space: normal;
  background-size: 100% 100%;
}

/* Quote nhan vat (roleGalleryQuote*): rule goc la white-space:pre nen chu chay thang ra
   ngoai khung. Dung [class*="layout-"] de BANG do uu tien voi rule
   '.role-image-scroll-track.layout-X ...' cua NetEase (nap sau nen thang), va phu ca 6
   nhan vat gom layout-captain ma ban truoc thieu. */
html[data-site='global'][lang='en'] .role-image-scroll-track[class*="layout-"] .role-image-scroll-title h2,
html[data-site='global'][lang='en'] .role-image-scroll-track[class*="layout-"] .role-image-scroll-title p {
  white-space: pre-line;
}

/* Dau thanh chong cua tieng Viet (e-hoi, a-nga, o-ngã) cao hon chu Latin: line-height goc
   6.25vh cho font 5.5556vh = ti le 1.125, lam dau dong duoi cham chu dong tren. Noi len 1.38. */
html[data-site='global'][lang='en'] .role-image-scroll-track[class*="layout-"] .role-image-scroll-title h2,
html[data-site='global'][lang='en'] .role-image-scroll-track[class*="layout-"] .role-image-scroll-title p {
  line-height: 7.6389vh;
}

/* Cho wrap roi thi height co dinh cat mat dong thu 2 tro di. */
html[data-site='global'][lang='en'] .role-image-scroll-track[class*="layout-"] .role-image-scroll-title {
  height: auto;
}

/* ============================================================================
   NUT TAI BAN VN — 3 nut: iOS (Coming Soon) / Google Play / LEVEL UP
   Anh nut la anh DAY DU (nen pill + icon + chu, khong co le trong suot) nen tat
   ::after (nen mo), ::before (icon) va ca vien cua NetEase. Dung lai o 'ps5' lam
   LEVEL UP de khong phai sua DOM (GSAP khong dut). Class dl-ios / dl-android /
   dl-levelup la hook cho script gan link ngoai.
   Doi anh nhanh: dat bien --btn-ios / --btn-android / --btn-levelup tu static data CMS.
   ============================================================================ */

/* Khung nut lay dung ti le anh (630x160) thay vi % co dinh — % co dinh lam o rong
   gan gap doi anh, nen vien NetEase vien ra thanh khung to bao quanh nut nho. */
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-ps5,
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-app-store,
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-google-play {
  display: block !important;
  width: auto;
  aspect-ratio: 630 / 160;
  border: 0;
  border-radius: 0;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-ps5::before,
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-ps5::after,
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-app-store::before,
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-app-store::after,
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-google-play::before,
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-google-play::after {
  display: none !important;
}
/* Thu tu hien thi: iOS -> Google Play -> LEVEL UP (DOM goc la ps5 dung dau) */
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-app-store { -webkit-order: 1; order: 1; }
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-google-play { -webkit-order: 2; order: 2; }
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-ps5 { -webkit-order: 3; order: 3; }

/* iOS chot dung icon Pre-regis (duyet 25/8), khong con Coming Soon */
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-app-store {
  background-image: var(--btn-ios, url(../assets/btn-ios-live.png));
}
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-google-play {
  background-image: var(--btn-android, url(../assets/btn-google.png));
}
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-ps5 {
  background-image: var(--btn-levelup, url(../assets/btn-levelup.png));
}

/* Chua co link (script/CMS chua gan) thi khong co attribute href — bam vao khong di dau,
   con gan link vao la bam duoc ngay, khong phai sua CSS. */
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-google-play,
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-ps5,
html[data-site='global'] .coming-soon-section .platform-link-flat-google-play,
html[data-site='global'] .coming-soon-section .platform-link-flat-levelup,
html[data-site='global'] .game-icons .game-icon.dl-levelup {
  cursor: pointer;
}
/* NetEase doi nen mo qua ::after khi hover, ma minh da tat ::after de dap anh nut,
   nen phan hoi hover lay bang do sang. */
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-google-play:hover,
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-ps5:hover,
html[data-site='global'] .coming-soon-section .platform-link-flat-google-play:hover,
html[data-site='global'] .coming-soon-section .platform-link-flat-levelup:hover {
  -webkit-filter: brightness(1.12);
  filter: brightness(1.12);
}

/* Frame 2 (Coming-Soon) — 3 nut PHANG ban tieng Viet.
   NetEase chi co 1 the <img> dai gop (bake san PS5/Steam, khong bam duoc) nen bundle da
   thay bang 3 the <a> that; o day chi dap anh + dan deu 3 nut ra ngang khung. */
/* Khung goc 28.44% chi vua 3 nut nen chung dinh nhau: noi ra 36% (giu tam man hinh
   bang left 32%) de moi khe rong ~139px. */
html[data-site='global'] .coming-soon-section .coming-soon-platforms {
  left: 32%;
  width: 36%;
}
html[data-site='global'] .coming-soon-section .coming-soon-platforms .platform-links {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
html[data-site='global'] .coming-soon-section .platform-link-flat {
  display: block;
  -webkit-box-flex: 0;
  -webkit-flex: none;
  -ms-flex: none;
  flex: none;
  height: 100%;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
/* Nut LEVEL UP phang cao 93px, 2 nut kia 106px — de aspect-ratio rieng thi ca 3 cung
   cao khung ma khong nut nao bi keo gian. */
html[data-site='global'] .coming-soon-section .platform-link-flat-app-store {
  aspect-ratio: 470 / 106;
  background-image: var(--btn-ios-flat, url(../assets/btn-ios-flat.png));
}
html[data-site='global'] .coming-soon-section .platform-link-flat-google-play {
  aspect-ratio: 470 / 106;
  background-image: var(--btn-android-flat, url(../assets/btn-google-flat.png));
}
html[data-site='global'] .coming-soon-section .platform-link-flat-levelup {
  aspect-ratio: 470 / 93;
  background-image: var(--btn-levelup-flat, url(../assets/btn-levelup-flat.png));
}

/* ============================================================================
   BUGLIST QC 25/8
   ============================================================================ */

/* Bo nut Feedback (module leihuo-feedback tu render vao app, an ca cum thay vi xoa
   DOM de khong dut ref feedback trong app.vue). */
leihuo-feedback,
.leihuo-feedback {
  display: none !important;
}

/* #5 — Tat nut bam tren cac hinh anh phan "Doi Tac": NetEase render moi logo thanh
   <a href> tro trang doi tac; ban VN chi trung bay logo. */
html[data-site='global'] .milestone-partners .partner-logo {
  pointer-events: none;
  cursor: default;
}

/* Bo nut chon ngon ngu (hinh dia cau, goc tren ben phai) — ban VN chi co tieng Viet.
   Nut o footer NetEase tat bang co #js_show_language_switch = no trong layout. */
html[data-site='global'] .action-buttons .action-item.action-language {
  display: none !important;
}

/* #14 — nut iOS: ban dau la "Coming Soon" nen chan bam bang pointer-events:none, ma cai do
   chan luon :hover -> nut tro hoan toan. Tu 25/8 iOS chot dung icon Pre-regis + OneLink
   (da duyet) nen mo bam va hover sang len nhu 2 nut kia. */
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-app-store,
html[data-site='global'] .coming-soon-section .platform-link-flat-app-store {
  pointer-events: var(--btn-ios-events, auto);
  cursor: var(--btn-ios-cursor, pointer);
}
html[data-site='global'] .platform-links.platform-links-home .platform-link-home-app-store:hover,
html[data-site='global'] .coming-soon-section .platform-link-flat-app-store:hover {
  -webkit-filter: brightness(1.12);
  filter: brightness(1.12);
}

/* #9 — keo slider so anh xong la mat het chu, cuon lai cung khong hien.
   Goc: startDrag() bat CA HAI class is-dragging (transient) va has-slider-interaction
   (dinh vinh vien, sinh ra de tat hint mui ten "keo di"). endDrag() chi bo is-dragging.
   Ma index_4992a866.css lai gop ca 2 class vao mot rule opacity:0 cho .city-compare-copy
   -> keo mot lan la chu tat vinh vien. Day la bug san trong bundle NetEase.
   Chua o day thay vi sua file goc: dang keo (is-dragging) van an nhu y do thiet ke,
   tha tay ra la chu hien lai. */
html[data-site='global'] .city-compare-section.has-slider-interaction:not(.is-dragging) .city-compare-copy,
html[data-site='global'] .city-compare-section.has-slider-interaction:not(.is-dragging) .city-compare-mask {
  opacity: 1;
}

/* ============================================================================
   ICON SOCIAL — dung bo 7 icon cua design (sns-*.png) thay icon NetEase, de 7 kenh VN
   cung mot phong cach. NetEase chi co san 5 icon va khong co threads/zalo; icon cua ho
   cao khong deu (discord 0.25rem vs tiktok 0.31rem) nen cho chung cao 0.28rem, be rong
   theo aspect-ratio anh goc (cao 64px).
   ============================================================================ */
html[data-site='global'] .action-buttons .sns-list.sns-list-global .channel-item {
  height: 0.28rem;
  width: auto;
  background-size: contain;
}
html[data-site='global'] .action-buttons .sns-list.sns-list-global .channel-item.facebook {
  aspect-ratio: 125 / 128;
  background-image: url(../assets/sns-facebook.png);
}
html[data-site='global'] .action-buttons .sns-list.sns-list-global .channel-item.tiktok {
  aspect-ratio: 112 / 128;
  background-image: url(../assets/sns-tiktok.png);
}
html[data-site='global'] .action-buttons .sns-list.sns-list-global .channel-item.yt {
  aspect-ratio: 175 / 128;
  background-image: url(../assets/sns-yt.png);
}
html[data-site='global'] .action-buttons .sns-list.sns-list-global .channel-item.discord {
  aspect-ratio: 170 / 128;
  background-image: url(../assets/sns-discord.png);
}
html[data-site='global'] .action-buttons .sns-list.sns-list-global .channel-item.instagram {
  aspect-ratio: 129 / 128;
  background-image: url(../assets/sns-instagram.png);
}
html[data-site='global'] .action-buttons .sns-list.sns-list-global .channel-item.threads {
  aspect-ratio: 110 / 128;
  background-image: url(../assets/sns-threads.png);
}
html[data-site='global'] .action-buttons .sns-list.sns-list-global .channel-item.zalo {
  aspect-ratio: 124 / 128;
  background-image: url(../assets/sns-zalo.png);
}

/* #21 (soat cheo tu mobile) — tieu de khu News tren PC cung la ANH BAKE chu "NEWS"
   (title_bc1e915d.svg, 287x77) va KHONG co override cho [lang='en'], nen ban VN van ra
   "NEWS". Khac mobile: the nay CO san text $t('newsTitle') = "Tin Tuc", chi bi
   font-size:0 + background che -> bo background va tra lai font that.
   1rem = 75px o khung nay (287px / 3.82667rem) nen 0.72rem ~ 54px, vua khung cao 77px. */
html[data-site='global'][lang='en'] .news-section .news-container .news-left .news-title {
  width: auto;
  background: none;
  font-size: 0.72rem;
  font-weight: 900;
  line-height: 1.02667rem;
  color: #fff;
  white-space: nowrap;
}

/* ============================================================================
   TRAN / DE CHU — do THAT tren trang test (browser, 1912x885), khong phai uoc luong
   ============================================================================ */

/* Ban va 24/8 dat white-space:pre-line o .district-intro-title nhung KHONG an: NetEase
   khai rieng `white-space:nowrap; width:max-content` tren SPAN CON .district-intro-copy-sharp,
   ma white-space khong ke thua xuong khi con tu khai. Do duoc: 5 khu vuc tran +19..+241px.
   Chi sua span con; KHONG dat width cho .district-intro-copy-blurred — khoi do co
   padding 19.67px de chua blur, cho width:100% la no phinh ra 19px moi ben. */
html[data-site='global'][lang='en'] .district-intro-title .district-intro-copy-sharp {
  width: 100%;
  white-space: pre-line;
}

/* Thoai o man video nhan vat: .p1 la inline-block + nowrap, chi xuong dong nho <br> ma
   translate() tu chen tu ky tu newline trong chuoi goc. Chuoi VN khong co newline nao
   nen ra 1 dong dai — do duoc 4 thoai tran +162..+1013px. */
html[data-site='global'][lang='en'] .role-video-section .role-info .msg .p1 {
  display: block;
  white-space: pre-line;
}

/* Quote Ta Phi: 5 dong o font 5.5556vh vuot day .role-image-scroll-stage (overflow:hidden)
   6px -> mat dong cuoi. Ha font de con 4 dong. */
html[data-site='global'][lang='en'] .role-image-scroll-track.layout-tafei .role-image-scroll-title h2,
html[data-site='global'][lang='en'] .role-image-scroll-track.layout-tafei .role-image-scroll-title p {
  font-size: 4.4444vh;
  line-height: 6.1vh;
}

/* Quote Saimo: khong bi cat nhung chu cham panel-2 va anh 4-5px (do duoc, 5 layout kia sach).
   Ha nhe 10% la du, khong can thu nho manh nhu tafei. */
html[data-site='global'][lang='en'] .role-image-scroll-track.layout-saimo .role-image-scroll-title h2,
html[data-site='global'][lang='en'] .role-image-scroll-track.layout-saimo .role-image-scroll-title p {
  font-size: 5vh;
  line-height: 6.9vh;
}

/* #39 — dau mu chu "A" o dong dau bi cat dinh: line-height 23.9px cho font 19.9px
   (ti le 1.2) khong du cho dau chong cua tieng Viet. Noi len 1.42 + cho khoi thoai
   cao tu do de bong gian theo. */
html[data-site='global'][lang='en'] .role-video-section .role-info .msg .p1 {
  line-height: 1.42;
  padding-top: 0.06em;
}

/* #35 — 4 bong thoai Ta Phi: do duoc chu cao hon bong 1px (min-height 44.81px cho 2 dong
   x 23.9px = 47.8px). Cho bong tu gian theo chu thay vi khoa min-height. */
html[data-site='global'][lang='en'] .tafei-dialog-anim .z_Frame_1465_000,
html[data-site='global'][lang='en'] .tafei-dialog-anim .z_Frame_1466_000,
html[data-site='global'][lang='en'] .tafei-dialog-anim .z_Frame_1467_000,
html[data-site='global'][lang='en'] .tafei-dialog-anim .z_Frame_1468_000 {
  height: auto;
  min-height: 0;
  /* #23 — padding goc do cho chuoi tieng Trung nen lech han nhau giua 4 bong:
     1467 padding-left = 0 (chu dinh met mep, tran ra ngoai bong), 1465 = 20.47/5.65,
     1466 = 20.47/20.47, 1468 = 12.70/12.70. Can lai bang nhau theo em de scale cung font. */
  padding: 0.1em 0.64em;
  background-size: 100% 100%;
}


/* #8 — 2 link THOA THUAN / DIEU KHOAN dinh lien nhau, nhin thanh mot cum chu
   "THOA THUAN DIEU KHOAN" chu khong ra 2 link rieng (do footer-vn.css chi thiet ke cho
   MOT link nen .privacy-links khong co gap). Specificity: rule goc
   `html .footer-nav .footer-right .privacy-link` = (0,3,1), rule nay (0,4,1) nen thang
   du footer-vn.css nap sau. */
html[data-site='global'] .footer-nav .footer-right .privacy-links {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.24rem;
}
/* Gach doc phan tach cho ro la 2 muc rieng */
html[data-site='global'] .footer-nav .footer-right .privacy-link + .privacy-link::before {
  content: '';
  display: inline-block;
  width: 1px;
  height: 0.14rem;
  margin-right: 0.24rem;
  background: #6b6b6b;
  vertical-align: middle;
}

/* Footer khong bam duoc: GSAP ScrollTrigger sinh 12 the .pin-spacer (giu cho cho section
   bi pin), cai lon nhat 1897x7007px va pointer-events:auto nen phu len footer va an het
   click. Do bang elementFromPoint: 5/5 link + icon deu tra ve .pin-spacer.
   Khong dung pin-spacer (cua GSAP, sua la de vo hieu ung pin) — nang footer len tren:
   spacer cao nhat dang z-index 10 nen 30 la du. */
html[data-site='global'] .footer-nav,
html[data-site='global'] #g-footer {
  position: relative;
  z-index: 30;
}

/* #7 (QC cap nhat) — GIU logo Naked Rain, THEM NetEase + VNGGames, thu tu
   NAKED RAIN -> NETEASE -> VNGGAMES. Truoc do la MOT anh gop VNG x NetEase
   (footer-logo-vng-netease.png, 3.39x0.49rem) nen phai thay bang 3 anh roi.
   Cao chung 0.49rem = dung chieu cao anh gop cu; be rong theo ti le tung logo:
   naked-rain 140x62, netease 665x250, vnggames 367x256. */
html[data-site='global'] .footer-nav .footer-left .vng-logo.brand-logos {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0.22rem;
}
html[data-site='global'] .footer-nav .footer-left .vng-logo.brand-logos img {
  display: block;
  width: auto;
  height: 0.49rem;
}

/* ============================================================================
   OVERLAY TRAILER YOUTUBE — nut play o KV. Link .mp4 van chay player cua NetEase,
   rieng link YouTube phai nhung iframe nen dung overlay nay.
   ============================================================================ */
.vn-trailer {
  position: fixed;
  z-index: 10000;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
      -ms-flex-pack: center;
          justify-content: center;
  background: rgba(0, 0, 0, 0.92);
}
.vn-trailer-frame {
  position: relative;
  width: 80vw;
  max-width: 1600px;
  aspect-ratio: 16 / 9;
}
.vn-trailer-frame iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}
.vn-trailer-close {
  position: absolute;
  top: 32px;
  right: 32px;
  width: 48px;
  height: 48px;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
}
.vn-trailer-close::before,
.vn-trailer-close::after {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 30px;
  height: 2px;
  background: #fff;
  content: '';
}
.vn-trailer-close::before { -webkit-transform: translate(-50%, -50%) rotate(45deg); transform: translate(-50%, -50%) rotate(45deg); }
.vn-trailer-close::after { -webkit-transform: translate(-50%, -50%) rotate(-45deg); transform: translate(-50%, -50%) rotate(-45deg); }

/* Moc qua cuoi: the poster dung, carousel 4 mau son Itasha (theo codebase NetEase 26/8) */
.milestone-section .milestone-social-reward {
  position: relative;
  top: -9.375vw;
  left: 0.1563vw;
  z-index: 2;
  width: 10.3125vw;
  height: 19.4922vw;
  overflow: hidden;
  border: 0.0781vw solid #424244;
  border-radius: 0.1563vw;
  background: #08060a;
  box-sizing: border-box;
}
.milestone-section .milestone-social-reward::before,
.milestone-section .milestone-social-reward::after {
  content: none;
}
.milestone-section .social-reward-carousel,
.milestone-section .social-reward-slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}
.milestone-section .social-reward-slide {
  z-index: 1;
  object-fit: fill;
  opacity: 0;
  -webkit-transition: opacity 0.45s ease;
  transition: opacity 0.45s ease;
}
.milestone-section .social-reward-slide.active {
  z-index: 2;
  opacity: 1;
}
.milestone-section .social-reward-controls {
  position: absolute;
  top: 15.625vw;
  left: 0.4688vw;
  z-index: 5;
  width: 9.2969vw;
  height: 1.0938vw;
  background: url(../assets/reward-carousel-arrows_8ef69513.svg) center / 100% 100% no-repeat;
  pointer-events: none;
}
.milestone-section .social-reward-controls button {
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  pointer-events: auto;
}
.milestone-section .social-reward-prev,
.milestone-section .social-reward-next {
  position: absolute;
  top: 0;
  width: 1.0938vw;
  height: 1.0938vw;
}
.milestone-section .social-reward-prev { left: 0; }
.milestone-section .social-reward-next { right: 0; }
.milestone-section .social-reward-pagination {
  position: absolute;
  top: 0.3125vw;
  left: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.6055vw;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}
.milestone-section .social-reward-pagination button {
  width: 0.4844vw;
  height: 0.4844vw;
  border: 0.0605vw solid transparent;
  border-radius: 50%;
  background: rgba(246, 246, 246, 0.5);
  box-sizing: border-box;
}
.milestone-section .social-reward-pagination button.active {
  border-color: #00a2ff;
  background: #f6f6f6;
  -webkit-transform: scale(1.125);
  transform: scale(1.125);
}
html .milestone-section .milestone-social-reward .social-reward-title {
  top: auto;
  bottom: 0;
  z-index: 4;
  height: auto;
  min-height: 14%;
  background: transparent;
  color: #f6f6f6;
  font-family: 'MiSans', sans-serif;
  font-size: 0.9375vw;
  font-weight: 330;
  line-height: 1vw;
  letter-spacing: -0.0188vw;
  text-align: center;
  text-transform: uppercase;
}
.milestone-section .milestone-social-copy {
  top: 21.7578vw;
  z-index: 3;
}
/* The poster trum len truc nen bo marker + vach tim moc social (codebase moi cung bo) */
.milestone-section .milestone-scale-markers span:last-child::before,
.milestone-section .milestone-scale-markers span:last-child::after {
  content: none;
}

/* ============================================================================
   #32 — TRUC MOC: port layout Global (drop NetEase 26/8)
   Ban VN dang de vien tren/duoi cua .milestone-scale chay HET be ngang man hinh nen
   thanh chay tiep qua phai va the moc 7.000.000 dam len no. Global doi thanh mot khoi
   track bo goc 9.0625vw -> 76.9336vw, ticks cat dung day track, va tach cum social
   bang mot vach doc rieng.
   ============================================================================ */
.milestone-section .milestone-scale {
  border: 0;
}
.milestone-section .milestone-scale::before {
  position: absolute;
  top: 0;
  left: 9.0625vw;
  width: 67.8711vw;
  height: 100%;
  border-top: 0.01rem solid rgba(107, 107, 107, 0.47);
  border-bottom: 0.01rem solid rgba(107, 107, 107, 0.47);
  border-radius: 0.3125vw;
  background: rgba(240, 240, 240, 0.07);
  box-sizing: border-box;
  content: '';
}
/* Vach ngan cach truoc cum moc social. Global co han the .milestone-social-divider,
   bundle VN chua co the do nen dung ::after cua .milestone-scale — scale bat dau dung
   toa do top 1.3281vw ma Global dat cho vach. */
.milestone-section .milestone-scale::after {
  position: absolute;
  top: 0;
  left: 78.3008vw;
  width: 0.1563vw;
  height: 19.5313vw;
  border: 0.01rem solid rgba(107, 107, 107, 0.47);
  border-radius: 0.3906vw;
  background: rgba(240, 240, 240, 0.07);
  box-sizing: border-box;
  opacity: 0.7;
  content: '';
}
/* Global bo mask va them lop gradient thu 2 = vach cao o dung 5 vi tri moc, thay cho
   cac span .milestone-scale-markers ma ban Global da xoa khoi DOM. */
.milestone-section .milestone-scale .milestone-ticks {
  height: 1.7188vw;
  background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #d9d9d9), color-stop(0.0586vw, #d9d9d9), color-stop(0.0586vw, transparent)), -webkit-gradient(linear, left top, right top, color-stop(0, #d9d9d9), color-stop(0.02rem, #d9d9d9), color-stop(0.02rem, transparent));
  background-image: linear-gradient(90deg, #d9d9d9 0, #d9d9d9 0.0586vw, transparent 0.0586vw), linear-gradient(90deg, #d9d9d9 0, #d9d9d9 0.02rem, transparent 0.02rem);
  background-position: 14.6094vw 0;
  background-size: 0.6733635vw 0.7813vw, 14.1406333vw 1.7188vw;
  mask: none;
  -webkit-mask: none;
}
.milestone-section .milestone-scale .is-passed {
  -webkit-clip-path: inset(0 calc(100% - var(--milestone-passed-position, 0)) 0 9.0625vw);
  clip-path: inset(0 calc(100% - var(--milestone-passed-position, 0)) 0 9.0625vw);
}
.milestone-section .milestone-scale .is-after {
  -webkit-clip-path: inset(0 23.0664vw 0 75.8203vw);
  clip-path: inset(0 23.0664vw 0 75.8203vw);
}
.milestone-section .milestone-scale-markers {
  display: none;
}
.milestone-section .milestone-progress::before,
.milestone-section .milestone-progress::after {
  height: 2.9297vw;
}
.milestone-section .milestone-progress::after {
  right: 0.3945vw;
}
/* Vien tren/duoi hang the qua cung chay het be ngang va bi the moc 7.000.000 dam len;
   Global da bo han (GSAP van set borderColor nhung khong con border-width nen vo hai). */
.milestone-section .milestone-rewards-wrap {
  border: 0;
}
/* Canh giua cum chu 7.000.000 vao dung tam the poster nhu Global */
.milestone-section .milestone-social-copy {
  left: 80.8008vw;
}
/* Nhan gio thu 6 ('03 : 00 : 00') roi dung tren cum moc 7.000.000 — Global da bo han
   khoi mang TIMELINE. Grid van 6 cot nen an the thu 6 la 5 nhan con lai giu nguyen cho. */
.milestone-section .milestone-times span:nth-child(6) {
  display: none;
}