.showroom__grid {
  display: grid;
  gap: 1.25rem;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
}

.showroom__card {
  overflow: hidden;
  padding: 1rem;
}

.showroom__card img {
  aspect-ratio: 4 / 3;
  background: color-mix(in srgb, var(--color-theater-surface) 80%, var(--color-theater-bg));
  display: block;
  object-fit: cover;
  width: 100%;
}

.showroom__back {
  color: var(--color-accent);
  display: inline-block;
  margin-block-end: 0.75rem;
}

.showroom__scene {
  border-radius: 0.25rem;
  overflow: hidden;
  position: relative;
}

.showroom__scene--interactive {
  cursor: grab;
  touch-action: none;
  user-select: none;
}

.showroom__scene--interactive:active {
  cursor: grabbing;
}

.showroom__still {
  -webkit-user-drag: none;
  display: block;
  max-height: 44rem;
  object-fit: cover;
  pointer-events: none;
  user-select: none;
  width: 100%;
}

.showroom__slots {
  inset: 0;
  pointer-events: none;
  position: absolute;
}

.showroom__cutout {
  -webkit-user-drag: none;
  filter: drop-shadow(0 0.35rem 0.55rem rgb(0 0 0 / 35%));
  object-fit: contain;
  pointer-events: none;
  position: absolute;
  transform: translate(-50%, -50%);
  user-select: none;
  z-index: 2;
}

/* Slot UV marks floor contact — keep feet on the bay, not the image center. */
.showroom__cutout--feet {
  transform: translate(-50%, -92%);
}

.showroom__slot {
  border: 0.12rem dashed color-mix(in srgb, var(--color-accent) 55%, transparent);
  border-radius: 50%;
  opacity: 0.55;
  position: absolute;
  transform: translate(-50%, -50%);
  z-index: 3;
}

.showroom__picker {
  margin-block: 1.5rem;
}

.showroom__picker--compact {
  margin-block: 0.75rem 1rem;
}

.showroom__picker--compact .showroom__picker-list {
  display: flex;
  gap: 0.5rem;
  grid-template-columns: none;
  overflow-x: auto;
  padding-block-end: 0.25rem;
  scroll-snap-type: x mandatory;
}

.showroom__picker--compact .showroom__picker-item {
  flex: 0 0 auto;
  scroll-snap-align: start;
  width: 6.5rem;
}

.showroom--deep-enter .page-header--compact {
  margin-block-end: 0.5rem;
}

.showroom--deep-enter .showroom__enter360 {
  /* Still available if auto-enter fails; keep quiet until needed */
  opacity: 0.92;
}

.showroom-360-debug {
  background: color-mix(in srgb, var(--color-theater-bg) 88%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-spot) 45%, transparent);
  border-radius: 0.25rem;
  color: var(--color-stage-ink);
  font-family: ui-monospace, monospace;
  font-size: 0.72rem;
  left: 0.5rem;
  line-height: 1.45;
  max-width: min(22rem, calc(100% - 1rem));
  padding: 0.45rem 0.55rem;
  pointer-events: none;
  position: absolute;
  top: 0.5rem;
  white-space: pre-wrap;
  z-index: 4;
}

.showroom__picker-list {
  display: grid;
  gap: 0.75rem;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  list-style: none;
  margin: 0;
  padding: 0;
}

@media (min-width: 640px) {
  .showroom__picker-list {
    grid-template-columns: repeat(auto-fill, minmax(9rem, 1fr));
  }
}

.showroom__picker-item {
  /* shell from .selectable-tile; keep showroom-specific layout hooks */
  height: 100%;
  width: 100%;
}

.showroom__picker-item img,
.showroom__picker-item .selectable-tile__media {
  aspect-ratio: 4 / 3;
  object-fit: cover;
  width: 100%;
}

.showroom__hint {
  margin-block: 0.5rem 1rem;
  opacity: 0.85;
}

.showroom__enter360 {
  display: grid;
  gap: 0.5rem;
  justify-items: start;
  margin-block: 0.75rem 1rem;
}

.showroom__enter360 .btn {
  width: auto;
}

.showroom__hint[data-showroom-360-status]:not([hidden]) {
  margin-block: 0;
  max-width: 36rem;
}

.showroom--detail {
  padding-block-end: 1rem;
}

@media (max-width: 640px) {
  .showroom--detail {
    padding-block-end: 5.5rem;
  }

  .showroom__picker-list {
    gap: 0.65rem;
  }

  .showroom__enter360 .btn {
    min-height: 2.75rem;
    width: 100%;
  }
}

/* Immersive Enter-360 shell (full viewport) — opened via .is-open + scroll lock */
html.showroom-immersive-scroll-lock,
html.showroom-immersive-scroll-lock body {
  overflow: hidden;
}

.showroom-immersive {
  background: var(--color-theater-bg);
  display: none;
  flex-direction: column;
  inset: 0;
  position: fixed;
  z-index: 1100;
}

.showroom-immersive.is-open {
  display: flex;
}

/* Ready-gate: warm veil over the canvas until the first house paint. */
.showroom-immersive__veil {
  align-items: center;
  background:
    radial-gradient(ellipse 70% 55% at 50% 42%, rgb(58 48 38 / 55%), transparent 72%),
    linear-gradient(165deg, #1c1814 0%, #2a231c 48%, #161310 100%);
  display: flex;
  flex-direction: column;
  gap: 0.65rem;
  inset: 0;
  justify-content: center;
  opacity: 1;
  pointer-events: auto;
  position: absolute;
  text-align: center;
  transition: opacity 0.55s ease, visibility 0.55s ease;
  visibility: visible;
  z-index: 25;
}

.showroom-immersive[data-house-booting="false"] .showroom-immersive__veil,
.showroom-immersive__veil.is-done {
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}

.showroom-immersive__veil-brand {
  color: color-mix(in srgb, #f3e6d4 88%, transparent);
  font-family: var(--font-display, var(--font-sans));
  font-size: clamp(1.35rem, 3.2vw, 1.85rem);
  font-weight: 650;
  letter-spacing: 0.04em;
  margin: 0;
}

.showroom-immersive__veil-copy {
  color: color-mix(in srgb, #e8dcc8 72%, transparent);
  font-size: 0.95rem;
  margin: 0;
  max-width: 18rem;
}

.showroom-immersive__veil-copy::after {
  animation: showroom-veil-pulse 1.35s ease-in-out infinite;
  content: "";
  display: inline-block;
  margin-inline-start: 0.15rem;
}

@keyframes showroom-veil-pulse {
  0%,
  100% {
    opacity: 0.35;
  }
  50% {
    opacity: 1;
  }
}

@media (prefers-reduced-motion: reduce) {
  .showroom-immersive__veil {
    transition-duration: 0.01ms;
  }

  .showroom-immersive__veil-copy::after {
    animation: none;
  }
}

/* Hide help / tour chips while the room is still booting. */
.showroom-immersive[data-house-booting="true"] .showroom-house-help {
  opacity: 0;
  pointer-events: none;
  visibility: hidden;
}

/* Door plaques own quote / bulk — kill legacy overlay chrome (keep visible exit chrome). */
.showroom-immersive.is-open .showroom-immersive__chrome,
.showroom-immersive.is-open .showroom-immersive__exit:not(.showroom-immersive__exit--chrome),
.showroom-immersive.is-open .showroom-immersive__ctas,
.showroom-immersive.is-open .showroom-immersive__cta,
.showroom-immersive.is-open .showroom-immersive__lead-links {
  display: none !important;
  visibility: hidden !important;
  pointer-events: none !important;
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  clip: rect(0 0 0 0) !important;
}

/* Keep site header/footer from sitting above the walk-in room. */
html.showroom-immersive-scroll-lock .site-header,
html.showroom-immersive-scroll-lock .site-footer,
html.showroom-immersive-scroll-lock .site-nav-drawer,
html.showroom-immersive-scroll-lock .site-nav-backdrop {
  display: none !important;
}

.showroom-immersive__chrome {
  display: flex;
  justify-content: flex-start;
  padding: max(0.65rem, env(safe-area-inset-top, 0px))
    max(0.75rem, env(safe-area-inset-inline-end, 0px))
    0.35rem
    max(0.75rem, env(safe-area-inset-inline-start, 0px));
  pointer-events: none;
  position: absolute;
  inset-block-start: 0;
  inset-inline: 0;
  z-index: 3;
}

.showroom-immersive__exit {
  background: color-mix(in srgb, #000 55%, transparent);
  border: 1px solid rgb(255 255 255 / 28%);
  border-radius: 0.25rem;
  color: var(--color-stage-ink);
  cursor: pointer;
  font: inherit;
  font-size: 0.9rem;
  min-height: 2.5rem;
  padding: 0.4rem 0.85rem;
  pointer-events: auto;
}

.showroom-immersive__exit--chrome {
  /* Physical top-left so close is always findable in FA RTL + EN LTR. */
  position: absolute;
  z-index: 40;
  top: max(0.75rem, env(safe-area-inset-top, 0px));
  left: max(0.75rem, env(safe-area-inset-left, 0px));
  right: auto;
  display: none;
  align-items: center;
  justify-content: center;
  min-height: 2.5rem;
  min-width: 2.5rem;
  padding: 0;
  border-radius: 999px;
  border: 1px solid rgb(255 255 255 / 40%);
  background: color-mix(in srgb, #000 70%, transparent);
  color: #fff;
  font-size: 1.4rem;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  pointer-events: auto;
}

.showroom-immersive.is-open .showroom-immersive__exit--chrome {
  display: inline-flex !important;
  visibility: visible !important;
  clip: auto !important;
  width: auto !important;
  height: auto !important;
  overflow: visible !important;
}

.showroom-immersive__exit--chrome:hover,
.showroom-immersive__exit--chrome:focus-visible {
  border-color: rgb(255 255 255 / 55%);
  background: color-mix(in srgb, #000 75%, transparent);
  outline: none;
}

.showroom-immersive__viewer {
  flex: 1 1 auto;
  margin: 0;
  min-height: 0;
  position: relative;
  width: 100%;
}

.showroom-immersive.is-open .showroom__viewer,
.showroom-immersive.is-open .showroom-immersive__viewer {
  border: 0;
  height: 100%;
  margin: 0;
}

.showroom-immersive__ctas {
  background: linear-gradient(
    to top,
    color-mix(in srgb, #000 72%, transparent) 0%,
    color-mix(in srgb, #000 28%, transparent) 55%,
    transparent 100%
  );
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  justify-content: center;
  padding: 1.75rem max(0.75rem, env(safe-area-inset-inline-end, 0px))
    max(0.85rem, env(safe-area-inset-bottom, 0px))
    max(0.75rem, env(safe-area-inset-inline-start, 0px));
  pointer-events: none;
  position: absolute;
  inset-block-end: 0;
  inset-inline: 0;
  z-index: 3;
}

.showroom-immersive__cta {
  pointer-events: auto;
}

.showroom-immersive__ctas .btn--ghost {
  background: color-mix(in srgb, #000 35%, transparent);
  border-color: rgb(255 255 255 / 35%);
  color: var(--color-stage-ink);
}

.showroom__viewer.is-active {
  border: 1px solid color-mix(in srgb, var(--color-accent) 45%, transparent);
  margin-block: 1rem;
}

.showroom-immersive.is-open .showroom__viewer.is-active {
  border: 0;
  margin: 0;
}

/* In-room slot product sheet (tap gold circle → pick → remount). */
.showroom-house-picker {
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 8;
}

.showroom-house-picker:not([hidden]) {
  pointer-events: auto;
}

.showroom-house-picker__backdrop {
  background: rgb(8 6 4 / 55%);
  border: 0;
  cursor: pointer;
  inset: 0;
  padding: 0;
  position: absolute;
}

.showroom-house-picker__sheet {
  background:
    linear-gradient(180deg, rgb(42 36 30 / 98%) 0%, rgb(22 18 14 / 98%) 100%);
  border: 1px solid rgb(232 197 122 / 28%);
  border-radius: 1rem 1rem 0 0;
  bottom: 0;
  box-shadow: 0 -0.75rem 2.5rem rgb(0 0 0 / 45%);
  inset-inline: 0;
  max-height: min(58vh, 28rem);
  overflow: auto;
  padding: 1rem 1rem max(1rem, env(safe-area-inset-bottom, 0px));
  position: absolute;
  z-index: 1;
}

.showroom-house-picker__head {
  align-items: center;
  display: flex;
  gap: 0.75rem;
  justify-content: space-between;
  margin-block-end: 0.45rem;
}

.showroom-house-picker__title {
  color: #f6efe4;
  font-size: 1.15rem;
  font-weight: 650;
  letter-spacing: 0.01em;
  margin: 0;
}

.showroom-house-picker__close {
  background: rgb(255 255 255 / 6%);
  border: 1px solid rgb(255 255 255 / 22%);
  border-radius: 0.35rem;
  color: #f6efe4;
  cursor: pointer;
  font: inherit;
  font-size: 0.85rem;
  min-height: 2.35rem;
  padding: 0.35rem 0.8rem;
}

.showroom-house-picker__close:hover {
  background: rgb(255 255 255 / 12%);
}

.showroom-house-picker__hint {
  color: rgb(246 239 228 / 78%);
  font-size: 0.86rem;
  line-height: 1.45;
  margin: 0 0 0.85rem;
}

.showroom-house-picker__mode {
  display: grid;
  gap: 0.65rem;
  margin-block-end: 0.35rem;
}

/* Author `display` beats UA [hidden] — without this, pack/singles stays visible on sofa/dining. */
.showroom-house-picker__mode[hidden] {
  display: none !important;
}

.showroom-house-picker__mode-btn {
  background: rgb(255 255 255 / 5%);
  border: 1px solid rgb(232 197 122 / 35%);
  border-radius: 0.55rem;
  color: #f6efe4;
  cursor: pointer;
  font: inherit;
  font-size: 0.95rem;
  font-weight: 600;
  min-height: 3rem;
  padding: 0.7rem 1rem;
  text-align: start;
}

.showroom-house-picker__mode-btn--pack {
  background: linear-gradient(135deg, rgb(201 168 108 / 28%), rgb(255 255 255 / 4%));
}

.showroom-house-picker__mode-btn:hover {
  border-color: rgb(232 197 122 / 65%);
  background: rgb(232 197 122 / 16%);
}

.showroom-house-picker__list {
  display: grid;
  gap: 0.65rem;
  grid-template-columns: repeat(auto-fill, minmax(8.5rem, 1fr));
}

.showroom-house-picker__list .showroom-house-picker__tile,
.showroom-house-picker__list .showroom-carnival__product,
.showroom-house-picker__list [data-product-id] {
  background: rgb(255 255 255 / 5%);
  border: 1px solid rgb(255 255 255 / 14%);
  border-radius: 0.55rem;
  color: #f6efe4;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  max-width: none;
  overflow: hidden;
  padding: 0.45rem;
  text-align: start;
  width: 100%;
}

.showroom-house-picker__list .showroom-house-picker__tile:hover,
.showroom-house-picker__list [data-product-id]:hover {
  border-color: rgb(232 197 122 / 55%);
  background: rgb(232 197 122 / 12%);
}

.showroom-house-picker__list .selectable-tile__media,
.showroom-house-picker__list img {
  aspect-ratio: 4 / 3;
  border-radius: 0.35rem;
  display: block;
  object-fit: cover;
  width: 100%;
}

.showroom-house-picker__list .selectable-tile__role {
  color: rgb(232 197 122 / 90%);
  font-size: 0.72rem;
  font-weight: 600;
}

.showroom-house-picker__list .selectable-tile__label {
  color: #f6efe4;
  font-size: 0.82rem;
  font-weight: 550;
  line-height: 1.3;
}

/* Floating fabric / remove panel on planted furniture tap. */
.showroom-house-float {
  background: rgb(24 20 16 / 96%);
  border: 1px solid rgb(232 197 122 / 32%);
  border-radius: 0.75rem;
  box-shadow: 0 0.65rem 1.75rem rgb(0 0 0 / 45%);
  max-width: min(16.5rem, calc(100vw - 1.5rem));
  padding: 0.75rem;
  position: fixed;
  width: 13.75rem;
  z-index: 12;
}

.showroom-house-float[hidden] {
  display: none !important;
}

.showroom-house-float__head {
  align-items: center;
  display: flex;
  gap: 0.5rem;
  justify-content: space-between;
  margin-block-end: 0.4rem;
}

.showroom-house-float__title {
  color: #f6efe4;
  font-size: 0.92rem;
  font-weight: 650;
  margin: 0;
}

.showroom-house-float__close {
  background: transparent;
  border: 1px solid rgb(255 255 255 / 22%);
  border-radius: 0.3rem;
  color: #f6efe4;
  cursor: pointer;
  font: inherit;
  font-size: 0.75rem;
  padding: 0.2rem 0.45rem;
}

.showroom-house-float__label {
  color: rgb(246 239 228 / 70%);
  font-size: 0.75rem;
  margin: 0 0 0.4rem;
}

.showroom-house-float__swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem;
  margin-block-end: 0.65rem;
}

.showroom-house-float__swatch {
  border: 2px solid rgb(255 255 255 / 20%);
  border-radius: 999px;
  cursor: pointer;
  height: 1.85rem;
  padding: 0;
  width: 1.85rem;
}

.showroom-house-float__swatch[aria-pressed="true"] {
  border-color: #e8c57a;
  box-shadow: 0 0 0 2px rgb(232 197 122 / 35%);
}

.showroom-house-float__actions {
  display: grid;
  gap: 0.4rem;
}

.showroom-house-float__action {
  background: rgb(255 255 255 / 6%);
  border: 1px solid rgb(255 255 255 / 18%);
  border-radius: 0.4rem;
  color: #f6efe4;
  cursor: pointer;
  font: inherit;
  font-size: 0.8rem;
  min-height: 2.2rem;
  padding: 0.35rem 0.55rem;
}

.showroom-house-float__action--danger {
  border-color: rgb(220 120 100 / 45%);
  color: #f0c4b8;
}

.showroom__hint.is-error {
  color: var(--color-danger);
}

.showroom__viewer-canvas {
  cursor: grab;
  display: block;
  height: 100%;
  outline: none;
  touch-action: none;
  width: 100%;
}

.showroom__viewer-canvas.is-dragging,
.showroom__viewer-canvas:active {
  cursor: grabbing;
}

.showroom__viewer-hint {
  background: color-mix(in srgb, var(--color-surface-elevated) 94%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-border) 85%, transparent);
  border-radius: 0.5rem;
  box-shadow: 0 0.4rem 1.1rem rgb(20 18 16 / 18%);
  color: var(--color-text);
  font-size: 0.88rem;
  inset-block-end: 0.85rem;
  inset-inline-start: 50%;
  line-height: 1.45;
  margin: 0;
  max-width: min(92%, 36rem);
  padding: 0.55rem 0.95rem;
  pointer-events: none;
  position: absolute;
  text-align: center;
  transform: translateX(-50%);
  transition: opacity 0.45s ease;
  z-index: 2;
}

.showroom__viewer-hint.is-faded {
  opacity: 0;
}

/* Immersive house help bubble — physical center (RTL-safe), close + perf row. */
.showroom-house-help {
  inset: 0;
  pointer-events: none;
  position: absolute;
  z-index: 6;
}

.showroom-house-help__bubble {
  box-sizing: border-box;
  background: color-mix(in srgb, var(--color-surface-elevated) 96%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-border) 80%, transparent);
  border-radius: 1.15rem;
  box-shadow: 0 0.75rem 2rem rgb(18 14 10 / 28%);
  color: var(--color-text);
  /* Physical centering — inset-inline-start + translateX(-50%) breaks in RTL */
  top: max(0.85rem, env(safe-area-inset-top, 0px));
  left: 50%;
  right: auto;
  width: min(26rem, calc(100vw - 1.5rem));
  max-width: calc(100vw - 1.5rem);
  max-height: min(72dvh, 28rem);
  opacity: 0;
  overflow: auto;
  padding: 0.85rem 1rem 1rem;
  pointer-events: none;
  position: absolute;
  transform: translateX(-50%) translateY(-0.45rem) scale(0.96);
  transition: opacity 0.35s ease, transform 0.35s ease;
  visibility: hidden;
}

/* Phone: keep help under the immersive × so closing the hint is not the exit. */
@media (max-width: 768px) {
  .showroom-house-help__bubble {
    top: max(3.85rem, calc(env(safe-area-inset-top, 0px) + 3.35rem));
    max-height: min(62dvh, 24rem);
    width: min(26rem, calc(100vw - 1.25rem));
  }
}

.showroom-house-help[data-open="true"] .showroom-house-help__bubble {
  opacity: 1;
  pointer-events: auto;
  transform: translateX(-50%) translateY(0) scale(1);
  visibility: visible;
}

.showroom-house-help__head {
  align-items: flex-start;
  display: flex;
  gap: 0.65rem;
  justify-content: space-between;
  margin-block-end: 0.45rem;
  /* Room for physically pinned close (RTL puts flex-end close next to immersive exit). */
  padding-inline-end: 2.75rem;
  position: relative;
}

.showroom-house-help__title {
  font-size: 1.05rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  line-height: 1.35;
  margin: 0;
  padding-block-start: 0.15rem;
}

.showroom-house-help__close {
  appearance: none;
  background: color-mix(in srgb, var(--color-text) 6%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-border) 70%, transparent);
  border-radius: 999px;
  color: var(--color-text);
  cursor: pointer;
  flex-shrink: 0;
  font-size: 1.25rem;
  font-weight: 600;
  line-height: 1;
  min-height: 2.25rem;
  min-width: 2.25rem;
  padding: 0;
  /* Always physical top-right — never share a corner with immersive exit (top-left). */
  position: absolute;
  top: 0;
  right: 0;
  left: auto;
}

.showroom-house-help__close:hover,
.showroom-house-help__close:focus-visible {
  border-color: var(--color-accent);
  color: var(--color-accent);
  outline: none;
}

.showroom-house-help__perf {
  align-items: flex-start;
  border-block-start: 1px solid color-mix(in srgb, var(--color-border) 70%, transparent);
  cursor: pointer;
  display: flex;
  gap: 0.55rem;
  margin-block-start: 0.85rem;
  padding-block-start: 0.75rem;
}

.showroom-house-help__perf input {
  accent-color: var(--color-accent);
  flex-shrink: 0;
  margin-block-start: 0.2rem;
}

.showroom-house-help__perf-copy {
  display: grid;
  gap: 0.2rem;
}

.showroom-house-help__perf-label {
  color: var(--color-text);
  font-size: 0.88rem;
  font-weight: 650;
  line-height: 1.35;
}

.showroom-house-help__perf-hint {
  color: var(--color-muted);
  font-size: 0.78rem;
  line-height: 1.4;
}

.showroom-house-help__list {
  display: grid;
  gap: 0.4rem;
  list-style: none;
  margin: 0;
  padding: 0;
}

.showroom-house-help__list li {
  font-size: 0.9rem;
  line-height: 1.45;
  padding-inline-start: 0.85rem;
  position: relative;
}

.showroom-house-help__list li::before {
  color: var(--color-accent, #9a7b4f);
  content: "•";
  font-weight: 700;
  inset-inline-start: 0;
  position: absolute;
}

.showroom-house-help__chip {
  background: color-mix(in srgb, var(--color-surface-elevated) 92%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-border) 75%, transparent);
  border-radius: 999px;
  box-shadow: 0 0.35rem 0.9rem rgb(18 14 10 / 22%);
  color: var(--color-text);
  cursor: pointer;
  font-size: 0.82rem;
  font-weight: 650;
  /* Physical bottom-left — never share a corner with the tour chip (LTR/RTL safe). */
  bottom: max(1rem, env(safe-area-inset-bottom, 0px));
  left: max(1rem, env(safe-area-inset-left, 0px));
  right: auto;
  line-height: 1.2;
  opacity: 0;
  padding: 0.55rem 0.9rem;
  pointer-events: none;
  position: absolute;
  transition: opacity 0.3s ease, transform 0.3s ease;
  transform: translateY(0.35rem);
  visibility: hidden;
  z-index: 7;
}

.showroom-house-help[data-open="false"] .showroom-house-help__chip {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
  visibility: visible;
}

.showroom-house-help__chip:focus-visible {
  outline: 2px solid var(--color-accent, #9a7b4f);
  outline-offset: 2px;
}

/* Single step-guide control — physical bottom-right (FA + EN). */
.showroom-house-help__story-chip {
  appearance: none;
  background: color-mix(in srgb, var(--color-accent, #9a7b4f) 18%, var(--color-surface-elevated));
  border: 1px solid color-mix(in srgb, var(--color-accent, #9a7b4f) 55%, transparent);
  border-radius: 999px;
  box-shadow: 0 0.35rem 0.9rem rgb(18 14 10 / 22%);
  color: var(--color-accent, #9a7b4f);
  cursor: pointer;
  font-size: 0.82rem;
  font-weight: 700;
  bottom: max(1rem, env(safe-area-inset-bottom, 0px));
  right: max(1rem, env(safe-area-inset-right, 0px));
  left: auto;
  line-height: 1.2;
  padding: 0.55rem 0.95rem;
  pointer-events: auto;
  position: absolute;
  z-index: 8;
}

.showroom-house-help__story-chip:hover,
.showroom-house-help__story-chip:focus-visible {
  border-color: var(--color-accent, #9a7b4f);
  background: color-mix(in srgb, var(--color-accent, #9a7b4f) 24%, transparent);
  outline: none;
}

.showroom-house-toast {
  background: color-mix(in srgb, var(--color-surface-elevated) 94%, transparent);
  border: 1px solid color-mix(in srgb, var(--color-border) 80%, transparent);
  border-radius: 0.75rem;
  box-shadow: 0 0.45rem 1.2rem rgb(18 14 10 / 22%);
  color: var(--color-text);
  font-size: 0.9rem;
  font-weight: 600;
  bottom: max(4.25rem, calc(env(safe-area-inset-bottom, 0px) + 3.5rem));
  left: 50%;
  right: auto;
  margin: 0;
  max-width: min(90vw, 22rem);
  width: max-content;
  opacity: 0;
  padding: 0.55rem 0.95rem;
  pointer-events: none;
  position: absolute;
  text-align: center;
  transform: translateX(-50%) translateY(0.4rem);
  transition: opacity 0.28s ease, transform 0.28s ease;
  visibility: hidden;
  z-index: 5;
}

.showroom-house-toast.is-visible {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
  visibility: visible;
}

.showroom__viewer-pano {
  cursor: grab;
  height: 100%;
  max-width: none;
  object-fit: cover;
  user-select: none;
  width: 200%;
}

.showroom__viewer-cutout {
  filter: drop-shadow(0 0.4rem 0.6rem rgb(0 0 0 / 40%));
  object-fit: contain;
  pointer-events: none;
  position: absolute;
  transform: translate(-50%, -50%);
  z-index: 2;
}