/* the secret room: Amazing Man and Toby */
body.room { background: #0b0918; }
.room-main { width: min(1320px, calc(100% - 24px)); margin: 0 auto; padding: 92px 0 60px; text-align: center; }
.room-main .kicker { justify-content: center; margin-bottom: 14px; }
.room-stage { position: relative; margin: 0 auto; border: var(--px) solid #000; box-shadow: 10px 10px 0 #0009, 0 0 0 4px #2a2150; background: #120e27; }
#room { display: block; width: 100%; height: 100%; image-rendering: pixelated; cursor: default; touch-action: manipulation; }
.room-bubbles { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.bubble { position: absolute; transform: translate(-50%, -100%); white-space: nowrap; font: 14px/1.25 var(--ui); color: #2c2140; background: #fff8e8; padding: 7px 10px 8px;
  box-shadow: 0 -3px 0 #2c2140, 0 3px 0 #2c2140, -3px 0 0 #2c2140, 3px 0 0 #2c2140, 5px 6px 0 3px #0006; animation: bubble-in .18s steps(3) both; }
.bubble::after { content: ""; position: absolute; left: 50%; bottom: -9px; width: 6px; height: 6px; background: #fff8e8; box-shadow: 0 3px 0 #2c2140, -3px 0 0 #2c2140, 3px 0 0 #2c2140; transform: translateX(-50%); }
.bubble.toby { background: #ffe9f1; }
.bubble.toby::after { background: #ffe9f1; }
@keyframes bubble-in { from { opacity: 0; transform: translate(-50%, -80%); } }
.room-ctrls { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; align-items: center; margin: 22px 0 8px; }
.room-ctrls .chip[aria-pressed="true"] { background: var(--gold); color: var(--ink); }
.room-cap { max-width: 720px; margin: 18px auto 0; color: #e3dcf6; font-size: 17px; }
.room-motto { font: clamp(26px, 4vw, 40px)/1.1 var(--display); color: var(--gold); margin: 26px 0 4px; text-shadow: 0 0 18px #ff5fa288, 0 4px 0 #0008; }
.room-back a { color: var(--muted); }
@media (prefers-reduced-motion: reduce) { .bubble { animation: none; } }