/*
 * Isolated stylesheet entrypoint for /trai-nghiem-360/.
 *
 * Keep tour-only rules in tour.css and tour-map.css. This entrypoint is the
 * only project stylesheet loaded by the public 360 page, after shared CSS,
 * so changes to the tour cannot accidentally be loaded on other pages.
 */
@import url("tour.css?v=15");
@import url("tour-map.css?v=23");

/* A page-level isolation hook for future 360-specific overrides. */
.page-tour-360 main {
  overflow: clip;
}

/* v4 — one unified 360 experience; the overview map lives inside the viewer. */
.page-tour-360 .real-panorama{margin-top:48px}
.page-tour-360 .real-panorama__heading h1{margin:9px 0 0;color:#17382a;font:700 clamp(36px,4.4vw,58px)/1.05 "Noto Serif VN",serif}
.page-tour-360 .real-panorama__heading h1 em{color:#ad7928;font-weight:400}
.page-tour-360 .panorama-tools{position:absolute;z-index:12;top:16px;right:16px;display:flex;gap:9px}
.page-tour-360 .panorama-tools .panorama-fullscreen{position:relative;top:auto;right:auto}
.page-tour-360 .panorama-map-toggle{display:inline-flex;min-height:40px;align-items:center;gap:8px;padding:0 12px;border:1px solid rgba(235,199,119,.75);border-radius:10px;background:rgba(5,24,15,.92);color:#fff;box-shadow:0 5px 14px rgba(0,0,0,.45),inset 0 0 0 1px rgba(255,255,255,.07);cursor:pointer;font:700 11px "Noto Sans VN",sans-serif;backdrop-filter:blur(8px)}
.page-tour-360 .panorama-map-toggle span{color:#e9c66f;font-size:18px}.page-tour-360 .panorama-map-toggle em{display:grid;min-width:20px;height:20px;place-items:center;border-radius:50%;background:#b88731;color:#fff;font-size:9px;font-style:normal}
.page-tour-360 .panorama-map-toggle:hover,.page-tour-360 .panorama-map-toggle[aria-expanded="true"]{background:#6d5423}
.page-tour-360 .panorama-map-panel{position:absolute;z-index:11;inset:70px 16px 16px auto;display:grid;width:min(560px,calc(100% - 32px));grid-template-rows:auto minmax(0,1fr) auto;overflow:hidden;border:1px solid rgba(235,199,119,.58);border-radius:13px;background:rgba(5,22,14,.96);box-shadow:0 24px 70px rgba(0,0,0,.58);opacity:0;transform:translateX(calc(100% + 32px));transition:transform .28s ease,opacity .22s ease;pointer-events:none;backdrop-filter:blur(13px)}
.page-tour-360 .panorama-map-panel.is-open{opacity:1;transform:translateX(0);pointer-events:auto}
.page-tour-360 .panorama-map-panel header,.page-tour-360 .panorama-map-panel footer{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:14px 16px;background:transparent;color:#fff;text-align:left}
.page-tour-360 .panorama-map-panel header span{display:block;color:#d8b562;font-size:8px;font-weight:800;letter-spacing:.16em}.page-tour-360 .panorama-map-panel header strong{display:block;margin-top:3px;font:600 18px "Noto Serif VN",serif}
.page-tour-360 .panorama-map-close{display:grid;width:34px;height:34px;place-items:center;border:1px solid rgba(255,255,255,.2);border-radius:50%;background:rgba(255,255,255,.06);color:#fff;cursor:pointer;font-size:23px}
.page-tour-360 .panorama-map-panel .aerial-map{width:calc(100% - 24px);max-width:none;aspect-ratio:auto;min-height:0;margin:0 12px;border-radius:9px;background-size:100% 100%!important;box-shadow:none}
.page-tour-360 .panorama-map-panel .map-point i{width:30px;height:30px;font-size:10px}.page-tour-360 .panorama-map-panel .map-point span{margin-top:5px;padding:3px 6px;font-size:8px}
.page-tour-360 .panorama-map-panel footer{color:#c5d0ca;font-size:9px}.page-tour-360 .panorama-map-panel footer span{display:flex;align-items:center;gap:7px}.page-tour-360 .panorama-map-panel footer i{width:7px;height:7px;border-radius:50%;background:#d9b55f}.page-tour-360 .panorama-map-panel footer a{color:#e7c779;text-decoration:none;font-weight:700}
@media(max-width:760px){.page-tour-360 .real-panorama{margin-top:28px}.page-tour-360 .real-panorama__heading h1{font-size:34px}.page-tour-360 .panorama-tools{top:12px;right:12px}.page-tour-360 .panorama-map-toggle b{display:none}.page-tour-360 .panorama-map-toggle{width:44px;justify-content:center;padding:0}.page-tour-360 .panorama-map-toggle em{position:absolute;top:-5px;right:-5px}.page-tour-360 .panorama-map-panel{inset:68px 10px 10px;width:auto}.page-tour-360 .panorama-map-panel .map-point span{display:none}}
@media(prefers-reduced-motion:reduce){.page-tour-360 .panorama-map-panel{transition:none}}

/* v9 — each destination is a clickable directional arrow anchored in 3D. */
.page-tour-360 .tour-360-hotspot{width:38px;height:38px;border:2px solid rgba(255,235,184,.94);border-radius:50%;background:radial-gradient(circle at 35% 30%,#e1bc67,#95631e 72%);box-shadow:0 0 0 7px rgba(218,177,87,.18),0 8px 22px rgba(0,0,0,.5);cursor:pointer}
.page-tour-360 .tour-360-hotspot:before{content:"\2191";position:absolute;inset:5px;display:grid;place-items:center;border-radius:50%;background:#fff1c7;color:#173b2c;box-shadow:0 0 10px rgba(255,225,145,.85);font:900 20px/1 "Noto Sans VN",sans-serif;transition:inset .18s ease,box-shadow .18s ease,translate .18s ease}
.page-tour-360 .tour-360-hotspot:after{content:"";position:absolute;left:50%;top:100%;width:2px;height:13px;background:linear-gradient(#f5d98c,transparent);translate:-50% 0;pointer-events:none}
.page-tour-360 .tour-360-hotspot:hover,.page-tour-360 .tour-360-hotspot:focus-visible{box-shadow:0 0 0 9px rgba(218,177,87,.25),0 10px 26px rgba(0,0,0,.58);outline:2px solid #fff1bd;outline-offset:4px}
.page-tour-360 .tour-360-hotspot:hover:before,.page-tour-360 .tour-360-hotspot:focus-visible:before{inset:3px;box-shadow:0 0 15px rgba(255,225,145,.98);translate:0 -2px}
.page-tour-360 .pnlm-tooltip span{padding:8px 11px;border:1px solid rgba(235,199,119,.55);border-radius:7px;background:rgba(5,24,15,.94);color:#fff7df;box-shadow:0 8px 24px rgba(0,0,0,.4);font:700 10px "Noto Sans VN",sans-serif;white-space:nowrap}
@media(max-width:760px){.page-tour-360 .tour-360-hotspot{width:34px;height:34px}.page-tour-360 .tour-360-hotspot:before{inset:4px;font-size:18px}}
.page-tour-360 .real-panorama__intro{display:grid;justify-items:start;gap:15px}.page-tour-360 .real-panorama__intro p{margin:0;color:#66736c;font-size:14px;line-height:1.75}.page-tour-360 .tour-manager-link{display:inline-flex;min-height:40px;align-items:center;gap:8px;padding:0 13px;border:1px solid rgba(168,115,32,.42);border-radius:7px;background:#173b2c;color:#fff8e8;text-decoration:none;font:700 11px "Noto Sans VN",sans-serif;box-shadow:0 7px 20px rgba(23,59,44,.15)}.page-tour-360 .tour-manager-link span{color:#e7c371}.page-tour-360 .tour-manager-link:hover{border-color:#b88731;background:#214c39}
@media(max-width:760px){.page-tour-360 .real-panorama__intro{gap:12px}.page-tour-360 .real-panorama__intro p{font-size:12px}.page-tour-360 .tour-manager-link{min-height:38px}}

/* v8 — VXR-style guided route in the single panorama node. */
.guided-tour{position:absolute;z-index:14;right:0;bottom:0;left:0;display:grid;justify-items:center;pointer-events:none}.guided-tour__start{display:flex;min-height:54px;align-items:center;gap:11px;margin-bottom:22px;padding:8px 17px 8px 10px;border:1px solid rgba(255,229,165,.72);border-radius:999px;background:rgba(5,24,15,.9);color:#fff;box-shadow:0 12px 35px rgba(0,0,0,.45);cursor:pointer;pointer-events:auto;backdrop-filter:blur(10px)}.guided-tour__start>span{display:grid;width:37px;height:37px;place-items:center;border-radius:50%;background:#c99a3d;color:#10251b;font-size:19px}.guided-tour__start b,.guided-tour__start small{display:block;text-align:left}.guided-tour__start b{font:700 12px "Noto Sans VN",sans-serif}.guided-tour__start small{margin-left:2px;color:#d8c9a6;font-size:9px}.guided-tour__start[aria-hidden="true"]{display:none}.guided-tour__nav{position:relative;display:grid;grid-template-columns:44px minmax(180px,1fr) 44px;gap:8px;align-items:center;min-width:min(470px,calc(100% - 24px));margin-bottom:20px;padding:9px;border:1px solid rgba(255,229,165,.58);border-radius:14px;background:rgba(4,20,13,.91);box-shadow:0 16px 44px rgba(0,0,0,.5);pointer-events:auto;backdrop-filter:blur(11px)}.guided-tour__nav[aria-hidden="true"]{display:none}.guided-tour__nav>button{display:grid;width:44px;height:44px;place-items:center;border:1px solid rgba(255,255,255,.17);border-radius:10px;background:rgba(255,255,255,.06);color:#ffe7a6;cursor:pointer;font-size:28px}.guided-tour__nav>div{text-align:center}.guided-tour__nav small{display:block;color:#d6b666;font-size:7px;font-weight:800;letter-spacing:.15em}.guided-tour__nav strong{display:block;margin:2px 0;color:#fff9e9;font:600 16px "Noto Serif VN",serif}.guided-tour__story{padding:2px 8px;border:0;background:transparent;color:#cdd9d2;cursor:pointer;font:700 9px "Noto Sans VN",sans-serif;text-decoration:underline;text-underline-offset:3px}.guided-tour__arrow{position:absolute;left:50%;bottom:calc(100% + 13px);display:grid;gap:0;transform:translateX(-50%);filter:drop-shadow(0 6px 8px rgba(0,0,0,.5));pointer-events:none}.guided-tour__arrow span{display:block;width:22px;height:22px;margin-top:-11px;border-right:4px solid #f0ca70;border-bottom:4px solid #f0ca70;transform:rotate(45deg);animation:routeArrow 1.5s ease-in-out infinite}.guided-tour__arrow span:nth-child(2){animation-delay:.16s}.guided-tour__arrow span:nth-child(3){animation-delay:.32s}.tour-360-hotspot.is-route-current{border-color:#fff4c9;box-shadow:0 0 0 12px rgba(230,188,91,.3),0 0 32px rgba(255,220,132,.9)}@keyframes routeArrow{0%,100%{opacity:.25;transform:translateY(-4px) rotate(45deg)}50%{opacity:1;transform:translateY(5px) rotate(45deg)}}
@media(max-width:760px){.guided-tour__start{margin-bottom:14px}.guided-tour__nav{grid-template-columns:42px minmax(130px,1fr) 42px;min-width:calc(100% - 18px);margin-bottom:10px}.guided-tour__nav strong{font-size:14px}.guided-tour__arrow{bottom:calc(100% + 9px)}}
@media(prefers-reduced-motion:reduce){.guided-tour__arrow span{animation:none}}

/* v2 — official overview card, one full uncropped image and scoped controls. */
.page-tour-360 .map-experience {
  padding: 46px max(4vw, 20px) 56px !important;
  background:
    radial-gradient(circle at 75% 0, rgba(203, 164, 85, .10), transparent 32%),
    #10271c;
}
.page-tour-360 .map-toolbar {
  align-items: center;
  padding: 0 0 24px;
}
.page-tour-360 .map-toolbar p { line-height: 1.65; }
.page-tour-360 .map-legend {
  min-width: 164px;
  padding: 13px 15px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 10px;
  background: rgba(4,20,13,.34);
  box-shadow: 0 10px 30px rgba(0,0,0,.12);
}
.page-tour-360 .map-admin-link {
  display: inline-flex;
  margin-top: 11px;
  padding-top: 10px;
  border-top: 1px solid rgba(255,255,255,.12);
  color: #e8cc8b;
  font-size: 11px;
  font-weight: 700;
  text-decoration: none;
}
.page-tour-360 .aerial-map {
  width: 100%;
  max-width: 1380px;
  aspect-ratio: 1280 / 531;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 16px;
  background-color: #081b12;
  background-position: center !important;
  background-size: 100% 100% !important;
  background-repeat: no-repeat !important;
  box-shadow: 0 24px 65px rgba(2,12,7,.42);
}
.page-tour-360 .map-depth {
  background: linear-gradient(180deg, rgba(4,17,11,.04), transparent 58%, rgba(4,17,11,.18));
}
.page-tour-360 .map-hint,
.page-tour-360 .map-fullscreen {
  z-index: 4;
  min-height: 38px;
  border: 1px solid rgba(255,255,255,.22);
  border-radius: 9px;
  background: rgba(5,24,15,.78);
  color: rgba(255,255,255,.94);
  box-shadow: 0 5px 18px rgba(0,0,0,.24);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}
.page-tour-360 .map-hint {
  left: 16px;
  bottom: 14px;
  display: flex;
  align-items: center;
  gap: 9px;
  padding: 0 12px;
  font-size: 11px;
}
.page-tour-360 .map-fullscreen {
  position: absolute;
  right: 16px;
  bottom: 14px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 0 12px;
  cursor: pointer;
  font: 700 11px "Noto Sans VN", sans-serif;
}
.page-tour-360 .map-fullscreen:hover,
.page-tour-360 .map-fullscreen:focus-visible {
  border-color: rgba(232,204,139,.8);
  background: rgba(36,78,58,.94);
  outline: 2px solid rgba(232,204,139,.35);
  outline-offset: 2px;
}
@media (max-width: 760px) {
  .page-tour-360 .map-experience { padding: 28px 12px 34px !important; }
  .page-tour-360 .map-toolbar { padding-inline: 6px; padding-bottom: 18px; }
  .page-tour-360 .map-legend { display: flex; align-items: center; gap: 9px; min-width: 0; margin-top: 15px; }
  .page-tour-360 .map-legend b { margin: 0 0 0 auto; }
  .page-tour-360 .map-admin-link { margin: 0; padding: 0 0 0 10px; border-top: 0; border-left: 1px solid rgba(255,255,255,.12); }
  .page-tour-360 .aerial-map { border-radius: 11px; }
  .page-tour-360 .map-hint { display: none; }
  .page-tour-360 .map-fullscreen { right: 8px; bottom: 8px; min-height: 34px; padding: 0 9px; }
  .page-tour-360 .map-fullscreen b { display: none; }
}

/* v24 - seamless dark topbar and truly viewport-bound opening scene. */
.page-tour-360 .site-header{border-bottom:0;background:#06140d;box-shadow:none;backdrop-filter:none}
.page-tour-360 .site-header .brand-copy strong{color:#fffaf0}.page-tour-360 .site-header .brand-copy em{color:#e7c779}.page-tour-360 .site-header nav a{color:#f2f5f3}.page-tour-360 .menu-toggle span{background:#f4e7c6}
.page-tour-360 main{margin:0;padding:0;background:#06140d}
.page-tour-360 .real-panorama{display:block;margin:0!important;padding:0;line-height:0}
.page-tour-360 .real-panorama__viewer{height:calc(100svh - 54px);height:calc(100dvh - 54px);min-height:0;margin:0}
.page-tour-360 .real-panorama__viewer>*{line-height:normal}
(max-width:760px){.page-tour-360 .real-panorama__viewer{height:calc(100svh - 48px);height:calc(100dvh - 48px);min-height:0}}


/* v25 - dedicated 3D cemetery map page. */
.page-map-3d main{min-height:calc(100dvh - 54px);padding:28px 0 70px;background:radial-gradient(circle at 50% 10%,#f8f3e7,#e5decd 62%,#cbc2ae)}
.page-map-3d .site-plan{margin:0 auto}
@media(max-width:760px){.page-map-3d main{min-height:calc(100dvh - 48px);padding:12px 0 42px}.page-map-3d .site-plan{margin-top:0}}


/* v26 - standalone 360 mode: no site chrome, explicit exit home. */
.page-tour-360 .site-header{display:none}
.page-tour-360 .real-panorama__viewer{height:100svh;height:100dvh;min-height:0}
.page-tour-360 .tour-close{position:absolute;z-index:12;top:16px;right:16px;display:grid;width:44px;height:44px;place-items:center;border:1px solid rgba(255,255,255,.35);border-radius:50%;background:rgba(5,24,15,.9);color:#fff;box-shadow:0 6px 18px rgba(0,0,0,.45);text-decoration:none;font:300 32px/1 system-ui;backdrop-filter:blur(8px)}
.page-tour-360 .tour-close:hover,.page-tour-360 .tour-close:focus-visible{border-color:#f2cf7e;background:#6d5423;outline:2px solid #f2cf7e;outline-offset:2px}
.page-tour-360 .panorama-fullscreen{right:72px}
.page-tour-360 .tour-manager-link--overlay{right:124px}
@media(max-width:760px){.page-tour-360 .real-panorama__viewer{height:100svh;height:100dvh;min-height:0}.page-tour-360 .tour-close{top:12px;right:12px;width:44px;height:44px}.page-tour-360 .panorama-fullscreen{right:68px}.page-tour-360 .tour-manager-link--overlay{right:120px}}

/* v27 - balanced top-right 360 control cluster. */
.page-tour-360 .tour-close,.page-tour-360 .panorama-fullscreen,.page-tour-360 .tour-manager-link--overlay{top:14px;height:38px;min-height:38px;box-sizing:border-box}
.page-tour-360 .tour-close{right:14px;width:38px;border-radius:10px;font-size:26px;font-weight:300}
.page-tour-360 .tour-close{padding:0 0 3px}.page-tour-360 .tour-close:hover{padding-bottom:3px}
.page-tour-360 .panorama-fullscreen{right:62px;width:38px}
.page-tour-360 .panorama-fullscreen svg{display:block;width:19px;height:19px;margin:auto}
.page-tour-360 .tour-manager-link--overlay{right:110px;padding:0 11px}
.page-tour-360 .tour-manager-link--overlay span{display:block;line-height:1;transform:translateY(-1px)}
(max-width:760px){.page-tour-360 .tour-close,.page-tour-360 .panorama-fullscreen,.page-tour-360 .tour-manager-link--overlay{top:12px;height:38px;min-height:38px}.page-tour-360 .tour-close{right:12px;width:38px}.page-tour-360 .panorama-fullscreen{right:60px;width:38px}.page-tour-360 .tour-manager-link--overlay{right:108px;width:38px;padding:0;justify-content:center}}

/* v28 - refined 360 markers with persistent place labels. */
.page-tour-360 .tour-360-hotspot{width:32px;height:32px;border:1px solid rgba(255,233,177,.9);background:rgba(13,42,29,.78);box-shadow:0 0 0 5px rgba(222,181,88,.14),0 7px 20px rgba(0,0,0,.42);backdrop-filter:blur(4px)}
.page-tour-360 .tour-360-hotspot:before{inset:5px;background:linear-gradient(145deg,#ffe9ad,#c69235);color:#17382a;box-shadow:0 0 12px rgba(255,218,123,.55);font-size:16px}
.page-tour-360 .tour-360-hotspot:after{top:100%;height:9px;background:linear-gradient(#ebc76f,transparent)}
.page-tour-360 .tour-360-hotspot>span{visibility:visible!important;top:auto!important;right:auto!important;bottom:calc(100% + 12px)!important;left:50%!important;width:max-content!important;max-width:190px!important;height:auto!important;margin:0!important;padding:7px 10px!important;transform:translateX(-50%);border:1px solid rgba(238,207,133,.48)!important;border-radius:999px!important;background:rgba(5,24,15,.88)!important;color:#fff8e8!important;box-shadow:0 7px 20px rgba(0,0,0,.4)!important;opacity:1!important;pointer-events:none;white-space:nowrap!important;font:700 9px/1.2 "Noto Sans VN",sans-serif!important;text-shadow:0 1px 4px rgba(0,0,0,.7);backdrop-filter:blur(7px)}
.page-tour-360 .tour-360-hotspot>span:after{display:none!important}
.page-tour-360 .tour-360-hotspot:hover,.page-tour-360 .tour-360-hotspot:focus-visible{box-shadow:0 0 0 7px rgba(222,181,88,.2),0 9px 24px rgba(0,0,0,.5)}
.page-tour-360 .tour-360-hotspot:hover>span,.page-tour-360 .tour-360-hotspot:focus-visible>span,.page-tour-360 .tour-360-hotspot.is-route-current>span{border-color:#f4d583!important;background:rgba(21,57,40,.96)!important;color:#fff3c9!important}
.page-tour-360 .tour-360-hotspot.is-route-current{box-shadow:0 0 0 9px rgba(230,188,91,.24),0 0 25px rgba(255,220,132,.75)}
(max-width:760px){.page-tour-360 .tour-360-hotspot{width:29px;height:29px}.page-tour-360 .tour-360-hotspot:before{inset:4px;font-size:15px}.page-tour-360 .tour-360-hotspot>span{bottom:calc(100% + 10px)!important;max-width:145px!important;overflow:hidden;text-overflow:ellipsis;padding:6px 8px!important;font-size:8px!important}}


/* v29 - cinematic welcome and virtual guide overlay. */
.page-tour-360{overflow:hidden}.tour-welcome{position:absolute;z-index:14;inset:0;display:grid;place-items:center;background:radial-gradient(circle at 50% 48%,rgba(16,46,31,.32),rgba(2,10,6,.76));opacity:1;transition:opacity .5s ease,visibility .5s ease;backdrop-filter:brightness(.48)}.tour-welcome.is-hidden{visibility:hidden;opacity:0;pointer-events:none}.tour-welcome button{display:flex;min-height:62px;align-items:center;gap:13px;padding:8px 24px 8px 9px;border:1px solid rgba(255,229,165,.78);border-radius:999px;background:rgba(5,24,15,.92);color:#fff;box-shadow:0 18px 55px rgba(0,0,0,.48),0 0 0 8px rgba(219,178,86,.08);cursor:pointer;font:700 14px "Noto Sans VN",sans-serif;backdrop-filter:blur(10px)}.tour-welcome button>span{display:grid;width:44px;height:44px;place-items:center;border-radius:50%;background:#d3a445;color:#10251b;font-size:17px}.tour-welcome button:hover,.tour-welcome button:focus-visible{border-color:#ffe3a0;background:#173d2b;outline:3px solid rgba(255,225,151,.24);outline-offset:4px}.page-tour-360 .tour-close{z-index:16}
.tour-guide-avatar{position:absolute;z-index:13;right:18px;bottom:18px;display:grid;width:210px;grid-template-rows:minmax(0,1fr) auto;visibility:hidden;overflow:visible;border:1px solid rgba(241,208,133,.48);border-radius:18px;background:rgba(5,24,15,.92);box-shadow:0 24px 65px rgba(0,0,0,.55);opacity:0;transform:translateY(24px);transition:opacity .4s ease,transform .4s ease,visibility .4s ease;backdrop-filter:blur(10px)}.tour-guide-avatar.is-active{visibility:visible;opacity:1;transform:none}.tour-guide-media{position:relative;height:250px;overflow:hidden;border-radius:17px 17px 0 0;background:#d9dcdf}.tour-guide-media video{display:block;width:100%;height:100%;object-fit:cover;object-position:center top}.tour-guide-media:after{position:absolute;right:0;bottom:0;left:0;height:42%;content:"";pointer-events:none;background:linear-gradient(transparent,rgba(5,24,15,.38))}.tour-guide-media>i{position:absolute;z-index:2;right:10px;top:10px;width:8px;height:8px;border-radius:50%;background:#d8ae50;box-shadow:0 0 0 5px rgba(216,174,80,.2)}.tour-guide-avatar[data-audio-state="playing"] .tour-guide-media>i{animation:guidePulse 1.2s ease-in-out infinite}@keyframes guidePulse{50%{box-shadow:0 0 0 9px rgba(216,174,80,.08);transform:scale(1.15)}}
.tour-guide-toolbar{display:grid;height:46px;grid-template-columns:1fr 1fr;border-top:1px solid rgba(255,255,255,.1)}.tour-guide-toolbar button{display:flex;align-items:center;justify-content:center;gap:6px;border:0;background:transparent;color:#f5ead1;cursor:pointer;font:700 8px "Noto Sans VN",sans-serif}.tour-guide-toolbar button+button{border-left:1px solid rgba(255,255,255,.1)}.tour-guide-toolbar button:hover,.tour-guide-toolbar button:focus-visible{background:rgba(226,187,100,.13);outline:none}.tour-guide-toolbar button>span{color:#e4bd65;font-size:14px;line-height:1}.tour-guide-toolbar button[aria-pressed="true"]{color:#aebdb5}
.tour-guide-detail{position:absolute;right:calc(100% + 12px);bottom:0;width:360px;max-height:min(420px,70dvh);overflow:auto;padding:25px 25px 22px;border:1px solid rgba(238,204,126,.5);border-radius:15px;background:rgba(5,24,15,.96);color:#fff;box-shadow:0 24px 65px rgba(0,0,0,.5);visibility:hidden;opacity:0;transform:translateX(12px);transition:opacity .22s ease,transform .22s ease,visibility .22s ease;backdrop-filter:blur(13px)}.tour-guide-detail.is-open{visibility:visible;opacity:1;transform:none}.tour-guide-detail>button{position:absolute;top:9px;right:10px;width:30px;height:30px;border:0;background:transparent;color:#c9d2cd;cursor:pointer;font-size:22px}.tour-guide-detail>span{color:#d4ae5a;font-size:7px;font-weight:800;letter-spacing:.16em}.tour-guide-detail h2{margin:8px 28px 10px 0;color:#fff6df;font:600 24px/1.15 "Noto Serif VN",serif}.tour-guide-detail p{margin:0;color:#cbd7d0;font-size:12px;line-height:1.75}
@media(max-width:760px){.tour-welcome button{min-height:56px;padding-right:19px;font-size:12px}.tour-welcome button>span{width:40px;height:40px}.tour-guide-avatar{right:10px;bottom:10px;width:138px;border-radius:13px}.tour-guide-media{height:166px;border-radius:12px 12px 0 0}.tour-guide-toolbar{height:40px}.tour-guide-toolbar button{gap:0}.tour-guide-toolbar button b{display:none}.tour-guide-toolbar button>span{font-size:16px}.tour-guide-detail{right:0;bottom:calc(100% + 9px);width:min(330px,calc(100vw - 20px));max-height:46dvh;padding:20px 19px 18px}.tour-guide-detail h2{font-size:20px}.tour-guide-detail p{font-size:11px}.guided-tour__nav{margin-right:150px;min-width:min(430px,calc(100% - 170px))}}@media(prefers-reduced-motion:reduce){.tour-welcome,.tour-guide-avatar,.tour-guide-detail{transition:none}.tour-guide-avatar[data-audio-state="playing"] .tour-guide-media>i{animation:none}}

/* v30 — unified SVG control icons */
.page-tour-360 button svg,.page-tour-360 a svg,.scene-dialog button svg{display:block;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}
.page-tour-360 .tour-close{padding:0;line-height:0}.page-tour-360 .tour-close svg{width:17px;height:17px}
.page-tour-360 .guided-tour__start>span svg,.page-tour-360 .tour-welcome button>span svg{width:19px;height:19px}
.page-tour-360 .guided-tour__nav>button svg{width:18px;height:18px;margin:auto}
.tour-guide-detail>button{display:grid;place-items:center}.tour-guide-detail>button svg{width:16px;height:16px}
.tour-guide-toolbar button>svg{width:17px;height:17px;color:#e4bd65;flex:0 0 auto}
.tour-guide-toolbar .guide-sound-off,.tour-guide-toolbar .guide-sound-loading{display:none}
.tour-guide-toolbar button[aria-pressed="true"] .guide-sound-on{display:none}.tour-guide-toolbar button[aria-pressed="true"] .guide-sound-off{display:block}
.tour-guide-avatar[data-audio-state="loading"] .guide-sound-on,.tour-guide-avatar[data-audio-state="loading"] .guide-sound-off{display:none}.tour-guide-avatar[data-audio-state="loading"] .guide-sound-loading{display:block;animation:tour-guide-spin .8s linear infinite}
.scene-close,.scene-nav{display:grid;place-items:center;padding:0}.scene-close svg{width:18px;height:18px}.scene-nav svg{width:19px;height:19px}
.narrate{display:inline-flex;align-items:center;gap:8px}.narrate svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}.narrate svg.is-spinning{animation:tour-guide-spin .8s linear infinite}
@keyframes tour-guide-spin{to{transform:rotate(360deg)}}

/* v31 — one truthful loading flow before tour start */
.tour-welcome__panel{display:grid;justify-items:center;min-width:min(360px,calc(100vw - 36px))}.tour-welcome__loading{display:grid;width:100%;justify-items:center;gap:12px;color:#fff;text-align:center}.tour-welcome__loading strong{font:600 16px "Noto Serif VN",serif}.tour-welcome__loading small{color:#d7dfda;font:500 10px "Noto Sans VN",sans-serif}.tour-welcome__progress{width:min(320px,calc(100vw - 60px));height:4px;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.17);box-shadow:inset 0 1px 2px rgba(0,0,0,.35)}.tour-welcome__progress i{display:block;width:10%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#b98b32,#f3d88f);box-shadow:0 0 14px rgba(239,202,115,.55);transition:width .35s ease}.tour-welcome__loading.is-complete{opacity:0;transform:translateY(-5px);transition:opacity .2s ease,transform .2s ease}.tour-welcome button[hidden]{display:none}.page-tour-360 .guided-tour__start{display:none!important}

/* v32 — the welcome progress is the single loading indicator */
.page-tour-360 .pnlm-load-box,.page-tour-360 .pnlm-loading-box{display:none!important}

/* v33 — contextual title revealed with the start action */
.tour-welcome__title{max-width:min(680px,calc(100vw - 40px));margin:0 0 20px;color:#fff8e8;text-align:center;text-wrap:balance;text-shadow:0 3px 22px rgba(0,0,0,.65);font:600 clamp(25px,3.4vw,46px)/1.16 "Noto Serif VN",serif;letter-spacing:-.02em}.tour-welcome__title[hidden]{display:none}@media(max-width:760px){.tour-welcome__title{margin-bottom:16px;font-size:clamp(23px,7vw,32px)}}

/* v34 — high-contrast cinematic welcome title */
.tour-welcome__title{position:relative;max-width:min(760px,calc(100vw - 42px));margin:0 0 24px;padding:0 16px;color:#f4d489;background:linear-gradient(180deg,#fff7dc 0%,#f0c96d 76%,#c99637 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;text-align:center;text-wrap:balance;text-shadow:none;filter:drop-shadow(0 4px 14px rgba(0,0,0,.78));font:600 clamp(30px,4.2vw,58px)/1.08 "Noto Serif VN",serif;letter-spacing:-.035em}.tour-welcome__title::after{content:"";display:block;width:72px;height:2px;margin:17px auto 0;border-radius:99px;background:linear-gradient(90deg,transparent,#edc66e,transparent);box-shadow:0 0 13px rgba(237,198,110,.55)}@media(max-width:760px){.tour-welcome__title{max-width:calc(100vw - 28px);margin-bottom:18px;padding:0 8px;font-size:clamp(27px,8vw,38px);line-height:1.12;letter-spacing:-.025em}.tour-welcome__title::after{width:56px;margin-top:13px}}