/* A shared, living room landscape for members and the hosting team. */
.room-bubble {
  --blob-shape: 42% 58% 65% 35% / 48% 38% 62% 52%;
  --blob-next: 57% 43% 36% 64% / 38% 57% 43% 62%;
  --float-time: 11s;
  --morph-time: 17s;
  border-radius: var(--blob-shape);
  border: 0;
  background: radial-gradient(ellipse at 27% 19%, #FFFFFFB3, transparent 53%),
    radial-gradient(ellipse at 82% 87%, var(--room-glow), transparent 74%), var(--room-core);
  box-shadow: inset 1px 2px 14px #FFFFFF80, 0 18px 34px #416D8B19;
  animation: blob-drift var(--float-time) ease-in-out infinite,
    blob-breathe var(--morph-time) ease-in-out infinite;
  animation-delay: -3s, -5s;
  will-change: translate, border-radius;
}
.room-bubble:after { border-radius: inherit; opacity: .16; }
.room-bubble.is-joined:before { border: 0; border-radius: inherit; }
.room-bubble:hover, .room-bubble:focus-visible { animation-play-state: paused; }
.room-bubble:hover { box-shadow: inset 1px 2px 14px #FFFFFF80, 0 22px 38px #416D8B24; }
.room-position-1 {
  --blob-shape: 59% 41% 38% 62% / 45% 61% 39% 55%;
  --blob-next: 39% 61% 56% 44% / 60% 41% 59% 40%;
  --float-time: 13s; --morph-time: 19s;
  animation-delay: -7s, -11s;
}
.room-position-2 {
  --blob-shape: 38% 62% 53% 47% / 59% 42% 58% 41%;
  --blob-next: 62% 38% 43% 57% / 42% 63% 37% 58%;
  --float-time: 10s; --morph-time: 16s;
  animation-delay: -1s, -8s;
}
.room-position-3 {
  --blob-shape: 62% 38% 63% 37% / 39% 52% 48% 61%;
  --blob-next: 42% 58% 38% 62% / 58% 38% 62% 42%;
  --float-time: 12s; --morph-time: 18s;
  animation-delay: -5s, -2s;
}
.bubble-shine { background: #FFFFFF45; width: 48%; height: 25%; filter: blur(16px); }
.bubble-count { color: #466673; }
.bubble-map-caption { z-index: 3; pointer-events: none; }
.blob-motion {
  position: absolute; right: 18px; top: 15px; z-index: 4;
  display: flex; align-items: center; gap: 5px; min-height: 40px;
  padding: 8px 11px; border-radius: 22px; background: #FFFFFFA1;
  border: 1px solid #FFFFFFBC; color: #496B78; font-size: 10px;
}
.blob-motion .icon { width: 14px; height: 14px; }
.blob-motion:disabled { opacity: .75; }
.host-room-garden { margin: 35px 0 0; }
.host-room-garden>.section-heading h2 { font-family: 'Instrument Serif',Georgia,serif; font-size: 35px; font-weight: 400; }
.host-room-garden .bubble-map { height: 490px; }
.host-room-garden .room-position-0 { width: 230px; height: 230px; }
.host-room-garden .room-position-1 { width: 205px; height: 205px; }
.host-room-garden .room-position-2 { width: 219px; height: 219px; }
.host-room-garden .room-position-3 { width: 177px; height: 177px; }
.host-room-garden .bubble-content>strong { font-size: 32px; }
.host-room-garden .room-position-3 .bubble-content>strong { font-size: 27px; }
.guest-home-blobs { display: flex; gap: 24px; justify-content: space-around; flex-wrap: wrap; padding: 24px 5px; }
.guest-home-blobs .room-bubble-mini { position: relative; top: auto; left: auto; transform: none; width: 190px; height: 177px; padding: 24px; }
.guest-home-blobs .bubble-content>strong { font-size: 29px; }
.guest-home-blobs .bubble-icon>.icon { height: 27px; width: 27px; }
.room-cover-orb, .room-empty-orb { border-radius: 42% 58% 65% 35% / 48% 38% 62% 52%; }
.rooms-still .room-bubble, .motion-paused .room-bubble, .calm .room-bubble { animation: none; translate: none; will-change: auto; }
@keyframes blob-drift { 0%,100% { translate: 0 0; } 50% { translate: 3px -7px; } }
@keyframes blob-breathe { 0%,100% { border-radius: var(--blob-shape); } 50% { border-radius: var(--blob-next); } }
@media(max-width:1050px) and (min-width:761px) {
  .host-room-garden .room-position-0 { width: 200px; height: 215px; }
  .host-room-garden .room-position-1 { width: 175px; height: 185px; }
  .host-room-garden .room-position-2 { width: 185px; height: 205px; }
  .host-room-garden .room-position-3 { width: 160px; height: 166px; }
  .host-room-garden .bubble-content>strong { font-size: 28px; }
}
@media(max-width:760px) {
  .blob-motion { top: 9px; right: 9px; min-height: 39px; font-size: 8px; padding: 8px 9px; gap: 4px; }
  .blob-motion .icon { height: 12px; width: 12px; }
  .bubble-map-caption { max-width: 160px; font-size: 14px; }
  .room-bubble { padding: 16px; }
  .host-room-garden .bubble-map { height: 448px; }
  .host-room-garden .room-position-0 { width: 174px; height: 174px; }
  .host-room-garden .room-position-1 { width: 132px; height: 132px; }
  .host-room-garden .room-position-2 { width: 158px; height: 158px; }
  .host-room-garden .room-position-3 { width: 142px; height: 142px; }
  .host-room-garden .room-position-0 .bubble-content>strong { font-size: 28px; }
  .host-room-garden .room-position-1 .bubble-content>strong { font-size: 23px; }
  .host-room-garden .room-position-2 .bubble-content>strong { font-size: 25px; }
  .host-room-garden .room-position-3 .bubble-content>strong { font-size: 23px; }
  .guest-home-blobs { display: grid; grid-template-columns: 1fr 1fr; gap: 18px 10px; padding: 18px 0; }
  .guest-home-blobs .room-bubble-mini { width: 100%; height: 165px; padding: 20px; }
  .guest-home-blobs .bubble-content>strong { font-size: 25px; }
}
@media(max-width:370px) {
  .host-room-garden .room-position-0 { width: 156px; height: 162px; }
  .host-room-garden .room-position-1 { width: 119px; height: 125px; }
  .host-room-garden .room-position-2 { width: 145px; height: 153px; }
  .host-room-garden .room-position-3 { width: 129px; height: 135px; }
}
@media(prefers-reduced-motion:reduce) {
  .room-bubble { animation: none; translate: none; will-change: auto; }
}