/* Livestream rooms — stages & private rooms. Dresses in the living
   glass beside social.css; transform/opacity only, and everything
   stills for reduced motion. */

.rm-card { max-width: 860px; width: min(860px, 94vw); max-height: 92vh; overflow-y: auto; }
.rm-kicker { letter-spacing: .22em; font-size: .72rem; color: var(--gold, #c9a227); }
.rm-line { color: #efe6d0; font-size: .92rem; margin: 8px 0 0; }
.rm-stagebox { position: relative; margin-top: 10px; }
.rm-video {
  width: 100%; aspect-ratio: 16 / 9; max-height: 46vh; object-fit: cover;
  background: #0a0512; border-radius: 14px; border: 1px solid rgba(201, 162, 39, .35);
}
/* The Blackout Door (build .13): the doorway panel is TRUE black —
   there is no video element behind it, nothing to unveil. It fills
   the stage frame exactly as the picture would. */
.rm-doorway {
  width: 100%; aspect-ratio: 16 / 9; max-height: 46vh; overflow-y: auto;
  background: #000; border-radius: 14px; border: 1px solid rgba(201, 162, 39, .35);
  display: flex; align-items: center; justify-content: center;
}
.rm-doorway-card { text-align: center; padding: 18px 22px; max-width: 520px; }
.rm-doorway-stage { color: var(--gold, #c9a227); letter-spacing: .14em; font-size: .8rem; margin-bottom: 8px; }
.rm-doorway-line { color: #efe6d0; line-height: 1.6; margin: 0 0 10px; }
.rm-doorway-price { color: #efe6d0; font-size: 1.05rem; margin: 0 0 12px; }
.rm-stagefx { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.rm-cols { display: grid; grid-template-columns: 1fr 1.2fr; gap: 16px; margin-top: 14px; text-align: left; }
@media (max-width: 720px) { .rm-cols { grid-template-columns: 1fr; } }
.rm-rosterbox h3, .rm-chatbox h3 { margin: 0 0 8px; font-size: .95rem; color: var(--gold, #c9a227); }
.rm-entrance { margin: 0 0 8px; padding: 8px 12px; border: 1px solid var(--gold, #c9a227); border-radius: 10px; background: rgba(201,162,39,.12); color: var(--gold, #e8c95a); font-size: .9rem; }
.rm-seat {
  display: flex; align-items: center; justify-content: space-between; gap: 8px;
  padding: 6px 8px; border: 1px solid rgba(201, 162, 39, .18); border-radius: 10px; margin-bottom: 6px;
}
.rm-seat-name { display: inline-flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.rm-seat-name img { width: 26px; height: 26px; border-radius: 50%; object-fit: cover; }
.rm-seat-tools { display: inline-flex; gap: 6px; flex-wrap: wrap; }
.rm-seat-tools .call-btn { padding: 3px 9px; font-size: .76rem; }
.rm-chatlog { max-height: 180px; }
.rm-sys { color: var(--gold, #c9a227); font-style: italic; font-size: .84rem; }
.rm-sweep {
  background: none; border: none; color: #ff8f8f; cursor: pointer; font-size: .8rem; padding: 0 2px;
}
.rm-toggle { display: inline-flex; align-items: center; gap: 7px; font-size: .88rem; color: #efe6d0; cursor: pointer; }

/* Make-it-big (EmberBig): the room in focus. The stage takes the pane,
   the roster becomes a slim strip, the murmur folds to one tap — and
   the room's controls (Report, Block, Leave, the host's tools) stay in
   the page below the stage, exactly where they always were. */
#rmChatToggle { display: none; }
.rm-roomwrap:fullscreen, .rm-roomwrap.big-focus {
  background: radial-gradient(1200px 700px at 50% -10%, rgba(122, 18, 40, .35), transparent 60%), #0a0509;
  overflow-y: auto; padding: 18px; text-align: center;
}
.rm-roomwrap.big-focus { position: fixed; inset: 0; z-index: 1200; }
.rm-roomwrap:fullscreen .rm-video, .rm-roomwrap.big-focus .rm-video { max-height: 64vh; }
.rm-roomwrap:fullscreen .rm-cols, .rm-roomwrap.big-focus .rm-cols { grid-template-columns: 210px 1fr; align-items: start; }
.rm-roomwrap:fullscreen .rm-rosterbox, .rm-roomwrap.big-focus .rm-rosterbox { max-height: 42vh; overflow-y: auto; }
.rm-roomwrap:fullscreen #rmChatToggle, .rm-roomwrap.big-focus #rmChatToggle { display: inline-flex; }
.rm-roomwrap:fullscreen .rm-chatlog, .rm-roomwrap.big-focus .rm-chatlog { display: none; }
.rm-roomwrap:fullscreen .room-chat-form, .rm-roomwrap.big-focus .room-chat-form { display: none; }
.rm-roomwrap:fullscreen.chat-open .rm-chatlog, .rm-roomwrap.big-focus.chat-open .rm-chatlog { display: block; }
.rm-roomwrap:fullscreen.chat-open .room-chat-form, .rm-roomwrap.big-focus.chat-open .room-chat-form { display: flex; }
@media (max-width: 720px) {
  .rm-roomwrap:fullscreen .rm-cols, .rm-roomwrap.big-focus .rm-cols { grid-template-columns: 1fr; }
  .rm-roomwrap:fullscreen .rm-rosterbox, .rm-roomwrap.big-focus .rm-rosterbox { max-height: 18vh; }
}

/* the Live now rail */
.rm-rail { margin: 14px 0; padding: 16px; text-align: left; }
.rm-rail-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.rm-rail-head h2 { margin: 0; font-size: 1.15rem; }
.rm-rail-actions { display: inline-flex; gap: 6px; flex-wrap: wrap; }
/* GO LIVE on the rail (build .23) wears the docked pill's light —
   one name, one treatment, everywhere it is offered. */
.call-btn.rm-golive { border: 1px solid #ffd98a; background: linear-gradient(180deg, #c22436, #7d1020); color: #fff3d6; font-weight: 700; box-shadow: 0 0 14px rgba(255,64,64,.4), inset 0 1px 0 rgba(255,255,255,.3); }
.rm-rail-sub { margin: 14px 0 8px; font-size: .98rem; color: var(--gold, #c9a227); }
.rm-stage-card {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 9px 10px; border: 1px solid rgba(201, 162, 39, .22); border-radius: 12px; margin-top: 8px;
}
.rm-stage-card.mine { border-color: rgba(64, 200, 120, .45); }
.rm-stage-main { display: inline-flex; align-items: baseline; gap: 8px; flex-wrap: wrap; }
.rm-live-dot {
  width: 9px; height: 9px; border-radius: 50%; background: #e5484d; align-self: center;
  box-shadow: 0 0 8px rgba(229, 72, 77, .8); animation: rmPulse 1.8s ease-in-out infinite;
}
@keyframes rmPulse { 0%, 100% { opacity: 1; } 50% { opacity: .45; } }

/* the Room Ward, inside Fair Watch */
.ward-stage { border: 1px solid rgba(201, 162, 39, .25); border-radius: 12px; padding: 10px 12px; margin-top: 10px; }
.ward-stage .ward-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; flex-wrap: wrap; }
.ward-roster { margin-top: 8px; font-size: .88rem; }
.ward-roster .rm-seat { border-color: rgba(201, 162, 39, .12); }

@media (prefers-reduced-motion: reduce) {
  .rm-live-dot { animation: none; }
}

/* ---- Live visibility + stage treats (Phase 3 addenda) ---- */
/* Big by default: the picture takes the theater's share of the screen. */
.rm-video { max-height: 60vh; }
@media (max-width: 720px) {
  .rm-video { max-height: 60vh; }
  .rm-rosterbox { max-height: 20vh; overflow-y: auto; }
}

/* THE LIVE MARQUEE */
#liveMarquee { margin: 0 0 10px; }
.live-marquee { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left;
  padding: 9px 14px; border-radius: 12px; cursor: pointer;
  background: linear-gradient(90deg, rgba(120,10,25,.55), rgba(50,4,14,.65));
  border: 1px solid rgba(255,90,110,.5); color: #ffe9ec;
  box-shadow: 0 0 18px rgba(220,40,70,.35); font-size: .92rem; }
.lm-dot { width: 10px; height: 10px; border-radius: 50%; background: #ff3b57; flex: none;
  animation: lm-breathe 1.6s ease-in-out infinite; }
@keyframes lm-breathe { 0%,100% { opacity: 1; } 50% { opacity: .35; } }
.lm-text { flex: 1; }
.lm-go { color: #ffc2cd; font-size: .82rem; white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { .lm-dot { animation: none; } }

/* THE BIG RAIL — full-width stage cards */
.rm-stage-card.big { flex-direction: column; align-items: stretch; gap: 8px; padding: 12px; }
.rm-stage-card.big.pick { border-color: rgba(255, 205, 90, .75); box-shadow: 0 0 22px rgba(255, 190, 60, .28); }
.rm-stage-photo { position: relative; height: 92px; border-radius: 12px; overflow: hidden;
  background: radial-gradient(120% 160% at 20% 0%, #3a1030 0%, #14040f 70%);
  display: flex; align-items: center; justify-content: center; }
.rm-stage-photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.rm-stage-mono { font-size: 2.2rem; color: rgba(255, 217, 226, .75); font-family: Georgia, serif; }
.rm-live-seal { position: absolute; top: 8px; left: 10px; z-index: 2; padding: 2px 9px; border-radius: 999px;
  background: rgba(160, 10, 35, .85); color: #fff; font-size: .72rem; letter-spacing: .12em;
  animation: lm-breathe 1.8s ease-in-out infinite; }
.rm-pick-seal { position: absolute; top: 8px; right: 10px; z-index: 2; padding: 2px 9px; border-radius: 999px;
  background: rgba(146, 104, 10, .9); color: #ffe9a8; font-size: .72rem; letter-spacing: .1em; }
.rm-spot-seal { position: absolute; top: 34px; right: 10px; z-index: 2; padding: 2px 9px; border-radius: 999px;
  background: rgba(64, 32, 96, .92); color: #e8d8ff; font-size: .72rem; letter-spacing: .1em;
  box-shadow: 0 0 12px rgba(150, 110, 255, .45); }
.rm-stage-title { font-size: 1.25rem; font-family: Georgia, serif; color: #ffe9d6; }
@media (prefers-reduced-motion: reduce) { .rm-live-seal { animation: none; } }

/* THE GOLDEN FRAME — a candle-arch around the video area */
.rm-stagebox.golden { border-radius: 18px; padding: 6px;
  background: linear-gradient(170deg, rgba(255, 205, 90, .22), rgba(120, 84, 8, .12));
  box-shadow: 0 0 0 2px rgba(255, 205, 90, .65), 0 0 34px rgba(255, 190, 60, .35); }
.rm-stagebox.golden::after { content: '★ THE HOUSE SEAL ★'; position: absolute; top: -11px; left: 50%;
  transform: translateX(-50%); padding: 1px 12px; border-radius: 999px; z-index: 3;
  background: #7a5a08; color: #ffe9a8; font-size: .68rem; letter-spacing: .18em; white-space: nowrap; }

/* THE INTERMISSION CARD */
.rm-intermission { position: absolute; inset: 0; z-index: 4; display: flex; align-items: center; justify-content: center;
  background: rgba(10, 3, 16, .72); border-radius: 14px; }
.rm-intermission[hidden] { display: none; }
.rm-inter-card { text-align: center; padding: 22px 30px; border-radius: 16px; color: #ffe9d6;
  font-family: Georgia, serif; font-size: 1.25rem;
  background: linear-gradient(165deg, rgba(70, 20, 60, .75), rgba(16, 4, 24, .85));
  border: 1px solid rgba(255, 205, 90, .5); box-shadow: 0 10px 30px rgba(0, 0, 0, .5); }
.rm-inter-title { display: block; margin-top: 6px; font-size: 1rem; color: #ffd9e2; }
.rm-inter-by { display: block; margin-top: 4px; font-size: .78rem; color: #cbb6c2; font-family: inherit; }

/* HOUSE APPLAUSE banner */
.rm-applause-banner { position: absolute; top: 12px; left: 50%; transform: translateX(-50%); z-index: 5;
  padding: 6px 16px; border-radius: 999px; background: rgba(122, 18, 44, .9); color: #ffe3ea;
  font-size: .9rem; box-shadow: 0 6px 18px rgba(0, 0, 0, .45); white-space: nowrap; }
.rm-applause-banner[hidden] { display: none; }

/* Guest seats: tiles beside the stage */
.rm-gueststrip { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 10px; }
.rm-guest-tile { position: relative; width: 180px; max-width: 44vw; }
.rm-guest-tile video { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 12px;
  background: #0a0512; border: 1px solid rgba(255, 205, 90, .5); }
.rm-guest-tile span { position: absolute; left: 8px; bottom: 6px; font-size: .72rem; color: #ffe9d6;
  text-shadow: 0 1px 4px #000; }
.rm-guest-tile { cursor: pointer; }
.rm-guest-open { position: absolute; top: 6px; right: 6px; z-index: 2; padding: 3px 8px;
  border-radius: 999px; border: 1px solid rgba(255, 205, 90, .65); cursor: pointer;
  background: rgba(5, 3, 9, .82); color: #ffe9d6; font-size: .72rem; }
.rm-guest-open:hover, .rm-guest-open:focus-visible { background: rgba(122, 18, 44, .92); }
.rm-guest-focus { position: absolute; inset: 0; z-index: 8; display: flex; flex-direction: column;
  overflow: hidden; border-radius: 14px; background: #050309; }
.rm-guest-focus[hidden] { display: none; }
.rm-guest-focus-head { display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 8px 10px; background: rgba(10, 5, 18, .92); color: #ffe9d6; text-align: left; }
.rm-guest-focus-name { font-size: .9rem; }
.rm-guest-focus-video { flex: 1; min-height: 0; width: 100%; object-fit: contain; background: #050309; }
.rm-camera-note { max-width: 360px; font-size: .78rem; line-height: 1.35; color: #d9c3a7; text-align: left; }
.rm-guestinvite, .rm-housenote { margin-top: 12px; padding: 12px 14px; border-radius: 14px; text-align: left;
  background: linear-gradient(160deg, rgba(122, 18, 44, .3), rgba(30, 6, 20, .55));
  border: 1px solid rgba(255, 180, 140, .4); }
.rm-housenote { border-color: rgba(140, 200, 255, .4); background: linear-gradient(160deg, rgba(20, 50, 90, .35), rgba(8, 10, 26, .55)); }
.rm-linkgate { margin-top: 12px; padding: 12px 14px; border-radius: 14px; text-align: left;
  border: 1px solid rgba(255, 200, 100, .45); background: linear-gradient(160deg, rgba(90, 60, 10, .35), rgba(10, 8, 20, .55)); }
.rm-linkgate p { margin: 0 0 10px; line-height: 1.55; }
.rm-earpiece { display: inline-flex; gap: 6px; align-items: center; }
.rm-earpiece .input { min-width: 220px; }
.rm-earpiece-note { font-size: .74rem; color: #b9a8c4; }
.rm-status { font-size: .7rem; padding: 1px 8px; border-radius: 999px; background: rgba(0, 0, 0, .35);
  border: 1px solid rgba(255, 255, 255, .16); white-space: nowrap; }

/* ---- the video area, maxed (addendum 5) ---- */
.rm-glimpse-seal { position: absolute; top: 8px; right: 10px; z-index: 2; padding: 2px 9px; border-radius: 999px;
  background: rgba(20, 60, 90, .88); color: #cfeaff; font-size: .7rem; letter-spacing: .1em; }
.rm-pick-seal { right: 10px; }
.rm-stage-photo .rm-glimpse-seal { top: 34px; }

/* THE FLOATING STAGE dock — the same element, moved; no animation of
   the docking under any motion preference beyond a still fade. */
.rm-float-dock { position: fixed; right: 12px; bottom: 12px; width: min(320px, 46vw); z-index: 90;
  border-radius: 16px; box-shadow: 0 14px 40px rgba(0,0,0,.6); cursor: pointer;
  border: 1px solid rgba(255,205,90,.55); background: #0a0512; padding: 4px; }
.rm-float-dock .rm-video { max-height: 30vh; }
.rm-float-dock .rm-intermission, .rm-float-dock .rm-applause-banner { display: none; }

/* THE WARMTH METER */
.rm-warmth { display: flex; align-items: center; gap: 8px; margin-top: 10px; }
.rm-warmth-bar { flex: 1; height: 8px; border-radius: 999px; background: rgba(255,255,255,.08); overflow: hidden; }
.rm-warmth-bar i { display: block; height: 100%; width: 0%;
  background: linear-gradient(90deg, #b3402a, #ff9a3c, #ffd76a); border-radius: 999px;
  transition: width .6s ease; }
.rm-warmth-text { font-size: .76rem; color: #d9c3a7; white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { .rm-warmth-bar i { transition: none; } }

/* THE SPOTLIGHT LINE */
.rm-spotlight { margin-top: 10px; padding: 9px 13px; border-radius: 12px; text-align: left;
  background: linear-gradient(90deg, rgba(146,104,10,.35), rgba(60,40,4,.4));
  border: 1px solid rgba(255,205,90,.6); color: #ffeecb; }
.rm-spotlight[hidden] { display: none; }
.rm-spot-k { color: #ffd76a; letter-spacing: .06em; }

/* RAISED HANDS */
.rm-hands { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 10px; }
.rm-hands-k { font-size: .8rem; color: #ffe9d6; }
.rm-hand-chip { padding: 3px 6px 3px 10px; border-radius: 999px; font-size: .8rem;
  background: rgba(30,20,50,.7); border: 1px solid rgba(160,140,255,.45); color: #e6ddff; }

/* THE GREEN ROOM */
.rm-lights { margin-top: 12px; padding: 14px; border-radius: 12px; text-align: center;
  background: rgba(0,0,0,.55); color: #ffd9e2; font-family: Georgia, serif; font-size: 1.1rem; }
.rm-lights[hidden] { display: none; }

/* FAIR STAGE NIGHTS board */
.rm-night-row { padding: 6px 4px; border-bottom: 1px dashed rgba(201,162,39,.18); text-align: left; }
.rm-night-claim { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
.rm-night-claim .input { max-width: 170px; }

/* THE FRAMES RACK — local overlays on a publisher's own tile. The
   Golden Frame (.golden, staff-bestowed) outranks every rack frame:
   its shadow and seal paint above these borders. */
.rm-stagebox[data-frame="candle"] .rm-video, .rm-guest-tile[data-frame="candle"] video,
.call-video-local[data-frame="candle"] { border: 3px solid #e8b64c; box-shadow: 0 0 18px rgba(255,180,60,.45), inset 0 0 22px rgba(255,170,50,.25); }
.rm-stagebox[data-frame="stained"] .rm-video, .rm-guest-tile[data-frame="stained"] video,
.call-video-local[data-frame="stained"] { border: 4px solid #5a3d99; box-shadow: inset 0 0 0 2px #2a7f7f, inset 0 0 26px rgba(90,61,153,.55), 0 0 14px rgba(42,127,127,.4); }
.rm-stagebox[data-frame="thorn"] .rm-video, .rm-guest-tile[data-frame="thorn"] video,
.call-video-local[data-frame="thorn"] { border: 3px solid #2e4a2a; box-shadow: inset 0 0 20px rgba(20,40,18,.7), 0 0 12px rgba(140,30,50,.45); }
.rm-stagebox.golden .rm-video { border-color: rgba(255,205,90,.9); }

/* THE RECORD BANNER (build .22): while a consented capture runs,
 * this strip stands over the room and cannot be tucked away — it is
 * painted from the server's word, for every seat, doorway included. */
.rm-rec-banner {
  margin-top: 10px; padding: 9px 14px; border-radius: 12px;
  background: rgba(120, 10, 20, .38); border: 1px solid rgba(255, 90, 90, .55);
  color: #ffd9d9; font-weight: 600; text-align: center;
}
.rm-rec-banner .call-btn { margin-left: 10px; }
.rm-rec-ask {
  margin-top: 10px; padding: 12px 14px; border-radius: 12px;
  background: rgba(120, 10, 20, .22); border: 1px dashed rgba(255, 90, 90, .5);
  text-align: center;
}

/* The priority line (Velvet VIP): a quiet card while a seat is waited for. */
.rm-waitpanel { position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%); z-index: 1200; width: min(430px, calc(100vw - 24px)); }
.rm-waitcard { border: 1px solid var(--gold, #c9a227); border-radius: 14px; background: #171126; color: #e9e2f2; padding: 14px 16px; box-shadow: 0 12px 34px rgba(0,0,0,.55); }
.rm-wait-title { font-weight: 700; color: var(--gold, #e8c95a); margin-bottom: 4px; }
.rm-wait-line { margin: 0 0 10px; font-size: .92rem; line-height: 1.45; }
