/* The welcome remains inside the room; header and real controls stay reachable. */
.vm-welcome-host[data-screensaver="true"] :is(.vm-welcome__invitation, .vm-welcome__actions, .vm-welcome__carousel) {
  visibility: hidden;
  pointer-events: none;
}
.game-ui #screensaver-button { white-space: nowrap; }
.game-ui #screensaver-button:focus-visible { outline: 3px solid #7950b6; outline-offset: 3px; }
#stage[data-exhibit="true"] #screensaver-button {
  position: absolute; bottom: 8px; right: 12px;
  visibility: visible; pointer-events: auto;
}
#stage[data-exhibit="true"][data-screensaver="true"] :is(#stress-exhibit, #exit-exhibit, #screensaver-button) {
  display: none;
}
.vm-welcome-host, .vm-welcome-host * { box-sizing: border-box; }
.vm-welcome-host {
  position: absolute;
  z-index: 10;
  inset: var(--welcome-safe-top, 116px) 20px var(--welcome-safe-bottom, 134px);
  display: grid;
  align-items: center;
  justify-items: center;
  pointer-events: none;
  color: #183d40;
  font-family: "Helvetica Neue", "PingFang SC", sans-serif;
  --welcome-ink: #183d40;
  --welcome-muted: #486768;
  --welcome-focus: #126b69;
  --welcome-control: #f4faf8;
  --welcome-control-hover: #e3f0ec;
  --welcome-control-active: #d3e5df;
}
.vm-welcome-host[hidden] { display: none !important; }
.vm-welcome__panel {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(8px, 1.2vh, 14px);
  width: min(100%, 1280px);
  max-height: 100%;
  /* Fixed headroom for the U's tilted rectangle; never animate this padding. */
  padding: 30px 22px 14px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  text-align: center;
  pointer-events: auto;
}
.vm-welcome__brand {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: clamp(108px, 17vh, 180px);
  height: clamp(108px, 17vh, 180px);
  margin: -5px 0 -8px;
  pointer-events: none;
}
.vm-welcome__brand[hidden] { display: none; }
.vm-welcome__logo {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  mix-blend-mode: multiply;
  filter: drop-shadow(0 12px 12px rgb(33 105 118 / .1));
  pointer-events: none;
}
.vm-welcome-host[data-logo-motion="true"] .vm-welcome__logo {
  --u2-rest-scale: 1;
  transform-origin: 50% 50%;
  animation: u2-idle-wiggle 5200ms cubic-bezier(.42, 0, .58, 1) infinite;
  /* Use the image's existing glass lighting, not a moving blur layer. */
  filter: none;
}
.vm-welcome__language {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  gap: 8px;
  min-height: 22px;
  margin: 0;
  color: var(--welcome-muted);
  font-size: 13px;
  font-weight: 650;
  line-height: 1.6;
}
.vm-welcome__language-name { letter-spacing: .05em; }
.vm-welcome__native-name { font-size: 12px; font-weight: 500; }
.vm-welcome__copy { width:100%; display:flex; flex-direction:column; align-items:center; gap:clamp(8px,1.2vh,14px); }
.vm-welcome__sentence-slot { display:grid; width:100%; align-items:center; justify-items:center; }
.vm-welcome__sentence-slot > .vm-welcome__sentence { grid-area:1 / 1; }
.vm-welcome__measure { visibility:hidden; pointer-events:none; user-select:none; }
.vm-welcome__sentence {
  width: min(100%, 1120px);
  min-height: 2.6em;
  margin: 0;
  color: var(--welcome-ink);
  font-size: clamp(28px, 4.2vw, 66px);
  line-height: 1.3;
  text-align: center;
  text-wrap: balance;
  word-break: normal;
  overflow-wrap: normal;
  hyphens: none;
  letter-spacing: 0;
  text-shadow: 0 2px 0 rgb(255 255 255 / .8);
}
.vm-welcome__sentence[data-language="zh"] { max-width: 1080px; }
.vm-welcome__sentence[data-language="en"],
.vm-welcome__sentence[data-language="vi"],
.vm-welcome__sentence[data-language="ms"],
.vm-welcome__sentence[data-language="id"],
.vm-welcome__sentence[data-language="fil"] { font-size: clamp(25px, 3.55vw, 55px); line-height: 1.32; }
.vm-welcome__sentence[data-language="lo"],
.vm-welcome__sentence[data-language="km"],
.vm-welcome__sentence[data-language="my"] { font-size: clamp(25px, 3.1vw, 48px); line-height: 1.55; }
.vm-welcome__invitation { margin: 0; color: var(--welcome-muted); font-size: 15px; line-height: 1.6; letter-spacing: .03em; }
.vm-welcome__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 7px; pointer-events: auto; }
.vm-welcome__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 48px;
  min-width: 138px;
  padding: 10px 24px;
  border: 1px solid #aac6c0;
  border-radius: 18px;
  color: var(--welcome-ink);
  background: var(--welcome-control);
  box-shadow: 0 4px 0 #cadfd7, inset 0 1px 0 #ffffff;
  font: 700 15px/1.4 "Helvetica Neue", "PingFang SC", sans-serif;
  cursor: pointer;
  transition: background 120ms ease-out, transform 100ms ease-out, box-shadow 100ms ease-out;
}
.vm-welcome__button--primary { background: #c7ede0; border-color: #89baaa; box-shadow: 0 4px 0 #92c6b5, inset 0 1px 0 #effff8; }
.vm-welcome__carousel { display: flex; align-items: center; justify-content: center; gap: 10px; pointer-events: auto; }
.vm-welcome__carousel-button {
  min-height: 40px;
  min-width: 84px;
  padding: 8px 11px;
  border: 1px solid transparent;
  border-radius: 12px;
  color: var(--welcome-muted);
  background: transparent;
  font: 600 12px/1.5 "Helvetica Neue", "PingFang SC", sans-serif;
  cursor: pointer;
  transition: background 120ms ease-out, transform 100ms ease-out;
}
.vm-welcome__position { min-width: 52px; color: #5a7272; font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.vm-welcome__button:focus-visible, .vm-welcome__carousel-button:focus-visible { outline: 3px solid var(--welcome-focus); outline-offset: 3px; }
.vm-welcome__button:active { background: var(--welcome-control-active); transform: translateY(3px) scale(.98); box-shadow: 0 1px 0 #cadfd7; }
.vm-welcome__button--primary:active { background: #a2d7c5; }
.vm-welcome__carousel-button:active { background: var(--welcome-control-active); transform: scale(.97); }
.vm-welcome__button:disabled, .vm-welcome__carousel-button:disabled { opacity: .42; cursor: not-allowed; pointer-events: none; }
.vm-welcome__button[aria-busy="true"] { opacity: .7; cursor: wait; pointer-events: none; }
.vm-welcome__sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; border: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

@media (hover: hover) {
  .vm-welcome__button:hover { background: var(--welcome-control-hover); }
  .vm-welcome__button--primary:hover { background: #b3e2d2; }
  .vm-welcome__carousel-button:hover { background: #edf6f2; color: var(--welcome-ink); }
}
@media (pointer: coarse) {
  .vm-welcome__carousel-button { min-height: 44px; }
}
@media (max-width: 1100px) {
  .vm-welcome-host { --welcome-safe-bottom: 180px; }
  .vm-welcome__brand { width: 118px; height: 118px; }
  .vm-welcome__panel { padding-inline: 12px; }
}
@media (max-width: 700px) {
  .vm-welcome-host { inset-inline: 12px; --welcome-safe-top: 108px; --welcome-safe-bottom: 250px; }
  .vm-welcome__panel { gap: 8px; padding-inline: 6px; }
  .vm-welcome__brand { width: 92px; height: 92px; margin-block: -3px; }
  .vm-welcome__language { font-size: 12px; gap: 6px; }
  .vm-welcome__sentence { font-size: 30px; line-height: 1.35; }
  .vm-welcome__sentence[data-language] { min-height: 0; }
  .vm-welcome__sentence[data-language="en"],
  .vm-welcome__sentence[data-language="vi"],
  .vm-welcome__sentence[data-language="ms"],
  .vm-welcome__sentence[data-language="id"],
  .vm-welcome__sentence[data-language="fil"] { font-size: 25px; }
  .vm-welcome__sentence[data-language="lo"],
  .vm-welcome__sentence[data-language="km"],
  .vm-welcome__sentence[data-language="my"] { font-size: 23px; line-height: 1.55; }
  .vm-welcome__invitation { font-size: 12px; }
  .vm-welcome__actions { gap: 9px; margin-top: 3px; }
  .vm-welcome__button { min-width: 126px; padding: 8px 16px; font-size: 14px; }
  .vm-welcome__carousel { gap: 5px; }
}
@media (max-height: 740px) {
  .vm-welcome__brand { width: 82px; height: 82px; }
  .vm-welcome__panel { gap: 7px; }
  .vm-welcome__sentence { font-size: clamp(25px, 3.6vw, 48px); }
}
@media (max-height: 620px) {
  .vm-welcome__brand { display: none; }
  .vm-welcome__invitation { display: none; }
  .vm-welcome__sentence { min-height: 0; }
  .vm-welcome__sentence[data-language] { font-size: clamp(22px, 3vw, 36px); }
}
@media (prefers-reduced-motion: reduce) {
  .vm-welcome-host *, .vm-welcome__button, .vm-welcome__carousel-button { animation: none !important; transition: none !important; }
  .vm-welcome__button:active, .vm-welcome__carousel-button:active { transform: none; }
}
@media (forced-colors: active) {
  .vm-welcome__button, .vm-welcome__carousel-button { border-color: ButtonText; box-shadow: none; }
  .vm-welcome__sentence { text-shadow: none; }
  .vm-welcome__logo { mix-blend-mode: normal; filter: none; }
}
