.play-hero-art:has(.curiosity-cabinet)::before { display: none; }
.curiosity-cabinet {
  width: 100%;
  min-width: 0;
  padding-block: 12px 6px;
  position: relative;
  color: var(--ink);
}
.cabinet-heading { margin: 0 0 6px 4%; }
.cabinet-heading span, .cabinet-invite-kicker { font: 700 9px/1.5 Arial,sans-serif; letter-spacing: .2em; }
.cabinet-heading h2 { margin: 0; font: 700 13px/1.4 var(--play-display); }
.cabinet-figure { margin: 0; }
.cabinet-collage { width: 100%; aspect-ratio: 3 / 2; position: relative; isolation: isolate; }
.cabinet-decoration { position: absolute; inset: 0; display: block; width: 100%; height: 100%; object-fit: contain; pointer-events: none; user-select: none; }
.cabinet-stage { perspective: 930px; cursor: grab; touch-action: pan-y; }
.cabinet-stage.is-grabbing { cursor: grabbing; }
.cabinet-collage .cabinet-stage { position: absolute; z-index: 1; left: 31%; top: 6%; width: 38%; height: 88%; margin: 0; }
.cabinet-world {
  width: 100%;
  height: 100%;
  transform: rotateX(var(--cabinet-rotate-x,0deg)) rotateY(var(--cabinet-rotate-y,0deg));
  transition: transform .42s cubic-bezier(.2,.8,.2,1);
  user-select: none;
}
.cabinet-stage.is-grabbing .cabinet-world { transition-duration: .08s; }
.cabinet-world img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
  filter: grayscale(1) brightness(.74);
  transition: filter 1.1s;
}
[data-cabinet="lit"] .cabinet-world img { filter: grayscale(1) brightness(1.12); }
.cabinet-figure figcaption { margin: 6px 4% 0; text-align: right; color: var(--muted); font-size: 11px; letter-spacing: .05em; }
.cabinet-figure figcaption span { margin-right: 4px; font-size: 17px; }
.cabinet-controls { display: flex; align-items: start; gap: 10px; margin: 5px 4% 0; font-size: 12px; }
.cabinet-guide-arrow { font: 26px/1.2 Arial,sans-serif; }
.cabinet-controls p { margin: 0 0 4px; }
.cabinet-action {
  border: 0;
  border-bottom: 1px solid currentColor;
  background: transparent;
  color: inherit;
  padding: 4px 0;
  font-size: 12px;
  font-weight: 750;
}
.cabinet-action:not([hidden]) { display: inline-block; margin-right: 11px; }
.cabinet-action span { margin-left: 5px; }
.cabinet-action:hover { opacity: .7; }
.cabinet-unlock:not([hidden]) { padding: 5px 8px; background: #f6d987; color: #1a1713; }
.cabinet-invite {
  width: min(440px,calc(100% - 30px));
  max-height: 90dvh;
  padding: 24px;
  background: #202020;
  color: #f6f2e9;
  border: 1px solid #b7b1a2;
  box-shadow: 8px 8px #080808;
}
.cabinet-invite::backdrop { background: #080808c9; backdrop-filter: blur(4px); }
.cabinet-invite img { display: block; width: 90px; height: 90px; margin-bottom: 6px; }
.cabinet-close { position: absolute; right: 9px; top: 9px; width: 40px; height: 40px; border: 1px solid #b7b1a2; background: transparent; color: inherit; font-size: 22px; }
.cabinet-invite h3 { margin: 6px 0; font: 800 28px/1.25 var(--play-display); }
.cabinet-invite p { margin: 0 0 16px; font-size: 13px; }
.cabinet-invite label { display: block; font-size: 12px; font-weight: 750; }
.cabinet-invite small { display: block; margin-top: 5px; color: #d6ccbd; font-size: 10px; }
.cabinet-name-row { display: flex; gap: 7px; margin: 4px 0; }
.cabinet-name-row input { flex: 1; min-width: 0; padding: 8px 10px; border: 1px solid #aa9778; background: #f7efe0; color: #29251f; font-size: 14px; }
.cabinet-name-row button { padding: 8px 10px; border: 1px solid #f4cb83; background: #f4cb83; color: #302817; font-size: 12px; font-weight: 750; white-space: nowrap; }
@media (max-width: 820px) {
  .curiosity-cabinet { padding-block: 22px 8px; }
}
@media (prefers-reduced-motion: reduce) {
  .cabinet-world, .cabinet-world img { transition: none; }
}