body .portal-view.ambassadors-view {
  position: fixed!important; inset: 0!important; height: 100dvh!important; min-height: 0!important;
  padding: 0!important; display: block!important; overflow: hidden!important; background: var(--portal-background)!important;
}
body .portal-view.ambassadors-view::before, body .portal-view.ambassadors-view::after { display: none!important; }
body .ambassadors-title { position: absolute; top: 4dvh; left: 6vw; margin: 0; font-family: Modak,Arial,sans-serif!important; font-weight: 400!important; color: var(--circle-blue)!important; font-size: clamp(30px,4vw,72px); }
body .portal-view.ambassadors-view.is-active .ambassadors-title {
  white-space: nowrap!important; overflow-wrap: normal!important; word-break: normal!important;
  width: max-content!important; max-width: 82vw!important; font-size: min(4vw,72px)!important;
}
.ambassadors-view.is-active .ambassadors-title { animation: ambassadors-title-enter 3.8s cubic-bezier(.22,1,.36,1) both; }
@keyframes ambassadors-title-enter {
  from { translate: -110vw 0; }
  to { translate: 0 0; }
}
.ambassadors-pair { position: absolute; inset: 0; pointer-events: none; }
.ambassadors-orb { position: absolute; isolation: isolate; aspect-ratio: 1; border-radius: 50%; transition: transform 3.8s cubic-bezier(.22,1,.36,1),opacity 3.2s cubic-bezier(.22,1,.36,1); opacity: 0; }
.ambassadors-video { width: min(40vw,68dvh); left: 9vw; top: 51%; translate: 0 -50%; transform: translateX(-110vw); --orb-color: var(--circle-orange); }
.ambassadors-copy { width: min(29vw,50dvh); right: 10vw; top: 51%; translate: 0 -50%; transform: translateX(110vw); --orb-color: var(--circle-blue); }
.ambassadors-orb::before { content: ''; position: absolute; inset: -6%; border-radius: 50%; background: var(--orb-color); opacity: .22; z-index: -1; }
.ambassadors-core { width: 100%; height: 100%; border-radius: 50%; overflow: hidden; background: var(--orb-color); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 16px; pointer-events: auto; }
.ambassadors-core video { width: 100%; height: 100%; object-fit: cover; }
.ambassadors-core svg { width: 56px; height: 56px; fill: #fff; }
body .ambassadors-core span { color: #fff!important; font-size: clamp(18px,2vw,30px); }
.ambassadors-entered .ambassadors-orb { transform: translateX(0); opacity: 1; }
.ambassadors-switching .ambassadors-orb { transition-duration: 4.8s,3.9s; }
.ambassadors-switching:not(.ambassadors-entered) .ambassadors-video { transform: translateX(calc(-106% - 9vw)); }
.ambassadors-switching:not(.ambassadors-entered) .ambassadors-copy { transform: translateX(calc(106% + 10vw)); }
.ambassadors-reset .ambassadors-orb { transition: none; }
.ambassadors-view .ambassadors-outgoing .ambassadors-orb { transform: translateX(0); opacity: 1; pointer-events: none; transition-timing-function: cubic-bezier(.45,0,.55,1); }
.ambassadors-view .ambassadors-outgoing .ambassadors-core { pointer-events: none; }
.ambassadors-view .ambassadors-departing .ambassadors-video { transform: translateX(calc(-106% - 9vw)); opacity: 0; }
.ambassadors-view .ambassadors-departing .ambassadors-copy { transform: translateX(calc(106% + 10vw)); opacity: 0; }
.ambassadors-arrow { position: absolute; top: 51%; translate: 0 -50%; width: 56px; height: 56px; border: 0; border-radius: 50%; padding: 14px; background: #fff; color: var(--circle-orange); cursor: pointer; transition: scale .3s ease; }
.ambassadors-arrow svg { display: block; width: 100%; height: 100%; }
.ambassadors-prev { left: 2vw; } .ambassadors-next { right: 2vw; }
.ambassadors-arrow:hover { scale: 1.1; }
.ambassadors-arrow:disabled { opacity: .5; cursor: default; }
.ambassadors-dots { position: absolute; bottom: 7dvh; left: 50%; translate: -50% 0; display: flex; gap: 4px; }
.ambassadors-dots button { display: grid; place-items: center; width: 24px; height: 24px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.ambassadors-dots button::before { content: ''; display: block; width: 11px; height: 11px; box-sizing: border-box; border: 2px solid #167aa5; border-radius: 50%; background: transparent; }
.ambassadors-dots button[aria-current="true"]::before { background: var(--circle-blue, #56b8e8); scale: 1.25; }
.ambassadors-view button:focus-visible { outline: 3px solid var(--circle-blue); outline-offset: 4px; }
@media(max-width:700px) {
  body .ambassadors-title { top: 5dvh; left: 6vw; font-size: clamp(28px,7vw,44px); max-width: 80vw; }
  body .portal-view.ambassadors-view.is-active .ambassadors-title { font-size: 5.2vw!important; }
  .ambassadors-video { width: min(61vw,34dvh); left: 12vw; top: 35%; }
  .ambassadors-copy { width: min(47vw,28dvh); right: 12vw; top: 70%; }
  .ambassadors-switching:not(.ambassadors-entered) .ambassadors-video,
  .ambassadors-view .ambassadors-departing .ambassadors-video { transform: translateX(calc(-106% - 12vw)); }
  .ambassadors-switching:not(.ambassadors-entered) .ambassadors-copy,
  .ambassadors-view .ambassadors-departing .ambassadors-copy { transform: translateX(calc(106% + 12vw)); }
  .ambassadors-arrow { width: 44px; height: 44px; padding: 11px; }
  .ambassadors-dots { bottom: 3dvh; }
}
@media(prefers-reduced-motion:reduce) {
  .ambassadors-orb { transition: none; }
  .ambassadors-view.is-active .ambassadors-title { animation: none; }
}

/* Coming-soon cover: preserve the ambassador scene, but keep it inert. */
.ambassadors-background {
  position:absolute;
  inset:0;
  filter:blur(12px);
  pointer-events:none;
  user-select:none;
}
.ambassadors-coming-overlay {
  position:absolute;
  inset:0;
  z-index:2;
  display:grid;
  place-items:center;
  padding:82px 24px 30px;
  box-sizing:border-box;
  overflow:auto;
  overscroll-behavior:contain;
}
.ambassadors-coming-orb {
  width:min(72vmin, 680px);
  height:auto;
  min-height:0;
  max-width:calc(100vw - 48px);
  max-height:none;
  border-radius:50%;
  background:var(--circle-orange, #FFB812)!important;
  color:#fff!important;
}
@media(max-width:820px) {
  .ambassadors-coming-overlay { padding:82px 16px 24px; }
  .ambassadors-coming-orb {
    width:min(88vw, 72dvh, 680px);
    max-width:calc(100vw - 32px);
    padding:clamp(24px, 5vmin, 48px);
  }
  .ambassadors-coming-orb h2 { font-size:clamp(40px, 10vmin, 78px); }
  .ambassadors-coming-orb .shop-menu-return { padding:10px 18px; font-size:14px; }
}
html[lang="en"] .ambassadors-coming-orb h2 { max-width:9em; }
