/* =========================================================
   DANANG2NITE — PHASE 63
   MOBILE PREMIUM VISUAL QA / FINAL POLISH
   Screenshot-driven, travel-use-first refinement.
   Loaded LAST at max-width: 820px.
   ========================================================= */

:root{
  --m63-edge:12px;
  --m63-radius:18px;
  --m63-border:rgba(255,255,255,.085);
  --m63-text:#f6f1ea;
  --m63-muted:#aaa29a;
}

/* ---------- HEADER ---------- */
.site-header{
  min-height:62px!important;
  border-bottom:1px solid rgba(255,255,255,.055)!important;
  background:rgba(8,8,9,.94)!important;
  backdrop-filter:blur(18px)!important;
  -webkit-backdrop-filter:blur(18px)!important;
  box-shadow:0 9px 28px rgba(0,0,0,.18)!important;
}
.site-header__main{
  width:calc(100% - 20px)!important;
  min-height:62px!important;
  gap:7px!important;
}
.site-brand{gap:8px!important;min-width:0}
.site-brand__mark{
  width:40px!important;
  height:34px!important;
  flex:0 0 auto;
  border-radius:8px 12px 8px 12px!important;
}
.site-brand__text strong{
  font-size:12px!important;
  letter-spacing:1.25px!important;
}
.site-brand__text small{
  margin-top:2px!important;
  font-size:5.5px!important;
  letter-spacing:.7px!important;
}
.d2n-menu-toggle{
  width:39px!important;
  height:39px!important;
  border-radius:50%!important;
  background:rgba(255,255,255,.016)!important;
}
.site-language-trigger{
  min-height:36px!important;
  padding-inline:9px!important;
  border-radius:999px!important;
  background:rgba(255,255,255,.014)!important;
}
.site-language-trigger__label{display:none!important}
.site-language-trigger strong{font-size:8px!important}

/* ---------- MOBILE HOME ---------- */
body.page-home .home-hero{
  width:calc(100% - (var(--m63-edge) * 2))!important;
  padding-top:10px!important;
  gap:10px!important;
}
body.page-home .home-hero__copy{
  padding:19px 16px 17px!important;
  border-radius:19px!important;
  border-color:var(--m63-border)!important;
}
body.page-home .home-hero__copy h1{
  margin-top:10px!important;
  font-size:37px!important;
  line-height:.98!important;
  letter-spacing:-1.2px!important;
}
body.page-home .home-hero__copy p{
  margin-top:10px!important;
  font-size:13.5px!important;
  line-height:1.5!important;
}
body.page-home .hero-actions{
  margin-top:14px!important;
  gap:7px!important;
}
body.page-home .hero-actions .button{
  min-height:43px!important;
  padding-inline:12px!important;
  font-size:11px!important;
}
body.page-home .home-hero__signature{
  margin-top:14px!important;
  padding-top:10px!important;
}
body.page-home .featured-story{
  border-radius:19px!important;
  border-color:var(--m63-border)!important;
}
body.page-home .featured-story__overlay{
  padding:14px 14px 13px!important;
}
body.page-home .featured-story h2{
  font-size:22px!important;
  line-height:1.08!important;
  letter-spacing:-.45px!important;
}
body.page-home .featured-story p{
  margin-top:7px!important;
  font-size:13px!important;
  line-height:1.48!important;
  -webkit-line-clamp:2!important;
}
body.page-home .story-link{
  margin-top:10px!important;
  font-size:9px!important;
}

/* Explore should scan immediately in two columns. */
body.page-home .d2n-category-deck{
  width:calc(100% - (var(--m63-edge) * 2))!important;
  padding-block:16px 19px!important;
}
body.page-home .d2n-category-deck__intro{margin-bottom:10px!important}
body.page-home .d2n-category-deck__rail{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:7px!important;
}
body.page-home .d2n-category-chip{
  min-height:61px!important;
  padding:9px 10px!important;
  border-radius:13px!important;
}
body.page-home .d2n-category-chip>strong{
  font-size:11.5px!important;
  line-height:1.2!important;
}
body.page-home .d2n-category-section{
  width:calc(100% - (var(--m63-edge) * 2))!important;
  padding-block:29px 31px!important;
}
body.page-home .d2n-category-section__head{
  margin-bottom:12px!important;
  align-items:center!important;
}
body.page-home .d2n-category-section__number{font-size:27px!important}
body.page-home .d2n-category-section__head h2{
  font-size:23px!important;
  line-height:1.08!important;
}
body.page-home .d2n-category-section__more{
  min-height:34px!important;
  padding-inline:10px!important;
  font-size:8px!important;
}

/* ---------- MOBILE CARD SYSTEM ---------- */
body.page-home .d2n-category-story,
body.page-home .home-place-card,
body.page-magazine-list .d2n-index-card,
body.page-places-list .place-card{
  border-radius:18px!important;
  border-color:var(--m63-border)!important;
  box-shadow:0 12px 30px rgba(0,0,0,.17)!important;
}
body.page-home .d2n-category-story__body,
body.page-magazine-list .d2n-index-card__body,
body.page-places-list .place-card__body,
body.page-home .home-place-card .place-card__body{
  padding:14px 14px 13px!important;
}
body.page-home .d2n-category-story h3,
body.page-magazine-list .d2n-index-card h2,
body.page-places-list .place-card h2,
body.page-places-list .place-card h3,
body.page-home .home-place-card h3{
  font-size:20px!important;
  line-height:1.1!important;
  letter-spacing:-.35px!important;
  -webkit-line-clamp:2!important;
}
body.page-home .d2n-category-story p,
body.page-magazine-list .d2n-index-card p,
body.page-places-list .place-card p,
body.page-home .home-place-card p{
  margin-top:7px!important;
  font-size:13px!important;
  line-height:1.48!important;
  -webkit-line-clamp:2!important;
}
body.page-home .d2n-category-story__foot,
body.page-magazine-list .d2n-index-card__foot{
  margin-top:10px!important;
  padding-top:9px!important;
  min-height:35px!important;
  font-size:8px!important;
}
body.page-home .d2n-category-story__foot b,
body.page-magazine-list .d2n-index-card__foot b{
  width:28px!important;
  height:28px!important;
}

/* ---------- MAGAZINE / PLACES LIST ---------- */
body.page-magazine-list .index-hero,
body.page-places-list .index-hero{
  width:calc(100% - (var(--m63-edge) * 2))!important;
  padding-block:27px 18px!important;
}
body.page-magazine-list .index-hero h1,
body.page-places-list .index-hero h1{
  margin-top:9px!important;
  font-size:35px!important;
  line-height:1.02!important;
}
body.page-magazine-list .index-hero p,
body.page-places-list .index-hero p{
  margin-top:9px!important;
  font-size:13px!important;
  line-height:1.5!important;
}
.d2n-index-category-nav{
  width:calc(100% - (var(--m63-edge) * 2))!important;
  gap:7px!important;
  scroll-padding-inline:0 20px!important;
}
.d2n-index-category-nav__item{
  min-height:54px!important;
  border-radius:13px!important;
}
.d2n-index-category-nav__item strong{
  font-size:9.5px!important;
  line-height:1.2!important;
}
body.page-magazine-list .d2n-magazine-index,
body.page-places-list .site-section--index{
  width:calc(100% - (var(--m63-edge) * 2))!important;
  padding-top:15px!important;
  padding-bottom:46px!important;
}
body.page-magazine-list .d2n-index-grid,
body.page-places-list .places-grid--index{gap:10px!important}

/* Mobile should never display PC filler cards. */
body.page-home .is-placeholder,
body.page-magazine-list .is-placeholder,
body.page-places-list .is-placeholder,
body.page-magazine-list .d2n-placeholder-grid,
body.page-places-list .d2n-placeholder-grid{display:none!important}
body.page-magazine-list .d2n-mobile-empty,
body.page-places-list .d2n-mobile-empty{display:flex!important}

/* ---------- MAGAZINE VIEW ---------- */
body.page-magazine-view .magazine-masthead{
  width:calc(100% - 16px)!important;
  margin-top:8px!important;
  border-radius:18px!important;
}
body.page-magazine-view .magazine-masthead__copy{
  padding:15px 14px 15px!important;
}
body.page-magazine-view .magazine-masthead__meta{
  font-size:8px!important;
  gap:6px!important;
}
body.page-magazine-view .magazine-masthead h1{
  margin-top:9px!important;
  font-size:29px!important;
  line-height:1.04!important;
  letter-spacing:-.55px!important;
  text-wrap:balance!important;
}
body.page-magazine-view .magazine-article.is-title-long .magazine-masthead h1{
  font-size:26px!important;
  line-height:1.07!important;
}
body.page-magazine-view .magazine-article.is-title-xlong .magazine-masthead h1{
  font-size:23.5px!important;
  line-height:1.09!important;
}
body.page-magazine-view .magazine-masthead__subtitle{
  margin-top:8px!important;
  font-size:14px!important;
  line-height:1.4!important;
}
body.page-magazine-view .magazine-masthead__summary{
  margin-top:8px!important;
  font-size:13px!important;
  line-height:1.5!important;
}
body.page-magazine-view .magazine-masthead__foot{
  margin-top:10px!important;
  padding-top:9px!important;
}
body.page-magazine-view .magazine-reading{
  width:calc(100% - 22px)!important;
  margin-top:18px!important;
}
body.page-magazine-view .magazine-mobile-toc{
  margin-bottom:18px!important;
  border-radius:15px!important;
}
body.page-magazine-view .magazine-mobile-toc nav{
  max-height:54vh!important;
  overflow:auto!important;
  overscroll-behavior:contain;
}
body.page-magazine-view .magazine-mobile-toc nav a{
  min-height:43px!important;
  padding:8px 8px!important;
}
body.page-magazine-view .magazine-mobile-toc nav a>strong{
  font-size:12px!important;
  line-height:1.25!important;
}
body.page-magazine-view .magazine-paragraph{margin-bottom:21px!important}
body.page-magazine-view .magazine-paragraph p{
  font-size:16.5px!important;
  line-height:1.68!important;
}
body.page-magazine-view .magazine-section-heading{
  margin:32px 0 14px!important;
  padding-top:12px!important;
}
body.page-magazine-view .magazine-section-heading h2{
  font-size:22px!important;
  line-height:1.14!important;
}
body.page-magazine-view .magazine-section-heading__index{font-size:23px!important}
body.page-magazine-view .magazine-list{
  padding:13px 13px 13px 15px!important;
  border-radius:14px!important;
}
body.page-magazine-view .magazine-list li{
  font-size:15px!important;
  line-height:1.56!important;
}

/* ---------- PLACES VIEW ---------- */
body.page-places-view .place-detail{
  width:calc(100% - 16px)!important;
  padding-top:8px!important;
}
body.page-places-view .place-detail>.hero{border-radius:18px!important}
body.page-places-view .place-detail>h1{
  font-size:29px!important;
  line-height:1.04!important;
}
body.page-places-view .place-detail.is-title-long>h1{
  font-size:25px!important;
  line-height:1.08!important;
}
body.page-places-view .place-detail>.article-subtitle{
  font-size:14px!important;
  line-height:1.48!important;
}
body.page-places-view .place-detail>.gallery{margin-top:15px!important}
body.page-places-view .place-detail>section.block{
  padding:15px 14px 16px!important;
  border-radius:16px!important;
}
body.page-places-view .place-detail>section.block h2{font-size:21px!important}
body.page-places-view .rich-text,
body.page-places-view .place-detail>section.block p{
  font-size:14.5px!important;
  line-height:1.64!important;
}

/* ---------- LANGUAGE PANEL ---------- */
.site-language-panel{
  width:min(390px,calc(100vw - 12px))!important;
  max-height:min(74vh,600px)!important;
  padding:9px!important;
  border-radius:17px!important;
}
.site-languages{
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:6px!important;
}
.site-language{
  min-height:58px!important;
  padding:7px!important;
  grid-template-columns:30px minmax(0,1fr) 15px!important;
  gap:6px!important;
  border-radius:12px!important;
}
.site-language strong{
  width:29px!important;
  height:29px!important;
  font-size:7px!important;
}
.site-language span{
  min-width:0!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  font-size:10.5px!important;
  line-height:1.12!important;
}

/* ---------- SIDE MENU ---------- */
.d2n-side-menu__panel{width:min(430px,96vw)!important}
.d2n-side-menu__head{min-height:64px!important}
.d2n-side-menu__primary,
.d2n-side-menu__categories,
.d2n-side-menu__identity{padding-inline:13px!important}
.d2n-side-menu__primary{padding-top:16px!important;padding-bottom:16px!important}
.d2n-side-menu__primary-nav{gap:6px!important}
.d2n-side-menu__primary-nav a{
  min-height:72px!important;
  border-radius:13px!important;
}
.d2n-side-menu__primary-nav a>strong{
  font-size:20px!important;
  line-height:1.1!important;
}
.d2n-side-menu__categories{padding-top:15px!important;padding-bottom:16px!important}
.d2n-side-menu__category-grid{gap:6px!important}
.d2n-side-menu__category-grid a{
  min-height:67px!important;
  padding:9px!important;
  border-radius:12px!important;
}
.d2n-side-menu__category-grid a>strong{
  font-size:12px!important;
  line-height:1.2!important;
}
.d2n-side-menu__identity{padding-top:14px!important;padding-bottom:16px!important}
.d2n-side-menu__identity-mark{font-size:37px!important}
.d2n-side-menu__identity-copy strong{font-size:18px!important}
.d2n-side-menu__identity-copy p{font-size:9.5px!important}

/* ---------- FOOTER ---------- */
.site-footer{
  border-top:1px solid rgba(255,255,255,.06)!important;
  background:
    radial-gradient(circle at 88% 110%,rgba(230,37,114,.065),transparent 34%),
    #080809!important;
}
.site-footer__grid{
  width:calc(100% - 22px)!important;
  padding-block:22px 25px!important;
  gap:16px!important;
}
.site-footer p{
  margin-top:8px!important;
  color:#8f8881!important;
  font-size:11.5px!important;
  line-height:1.45!important;
}
.site-counter{
  border-radius:13px!important;
  background:rgba(255,255,255,.012)!important;
}
.site-counter span{font-size:8px!important}
.site-counter strong{font-size:18px!important}
.site-footer nav{gap:7px!important}
.site-footer nav a{
  min-height:34px!important;
  padding-inline:10px!important;
  display:inline-flex!important;
  align-items:center!important;
  border:1px solid rgba(255,255,255,.07)!important;
  border-radius:999px!important;
  font-size:10px!important;
}

/* ---------- SCRIPT QA ---------- */
html[lang^="zh"] body.page-magazine-view .magazine-masthead h1,
html[lang="ja"] body.page-magazine-view .magazine-masthead h1,
html[lang="ko"] body.page-magazine-view .magazine-masthead h1{
  font-size:27px!important;
  line-height:1.12!important;
}
html[lang="th"] body.page-magazine-view .magazine-masthead h1,
html[lang="hi"] body.page-magazine-view .magazine-masthead h1,
html[lang="ru"] body.page-magazine-view .magazine-masthead h1,
html[lang="ar"] body.page-magazine-view .magazine-masthead h1{
  font-size:25px!important;
  line-height:1.16!important;
}
html[lang="ar"] .site-brand{direction:ltr}
html[lang="ar"] .site-nav{direction:rtl}
html[lang="ar"] .site-language-panel,
html[lang="ar"] .d2n-side-menu__panel{text-align:right}
html[lang="ar"] .magazine-mobile-toc nav a{
  grid-template-columns:minmax(0,1fr) 28px!important;
}
html[lang="ar"] .magazine-mobile-toc nav a>span{grid-column:2}
html[lang="ar"] .magazine-mobile-toc nav a>strong{grid-column:1;grid-row:1}

@media(max-width:380px){
  :root{--m63-edge:10px}
  .site-brand__text strong{font-size:11px!important}
  body.page-home .home-hero__copy h1{font-size:34px!important}
  body.page-home .d2n-category-chip>strong{font-size:10.5px!important}
  body.page-home .d2n-category-story h3,
  body.page-magazine-list .d2n-index-card h2,
  body.page-places-list .place-card h2,
  body.page-places-list .place-card h3{font-size:18.5px!important}
  .site-language span{font-size:9.5px!important}
}