/* Park Mirror viewer — consolidated from captions viewer.css + mirror-specific rules. */
html, body { margin: 0; padding: 0; background: #000; color: #fff; height: 100%; }
body { font-family: -apple-system, "Helvetica Neue", Arial, sans-serif; }
.viewer { overflow: hidden; }
.msg { font-size: 3.5vh; color: #fa6; min-height: 4vh; }

/* Shared chrome bar (matches captions viewer). */
.bar { position: absolute; left: 0; right: 0; bottom: 0; height: 64px; display: flex; align-items: center;
  padding: 0 2vw; background: #111; box-sizing: border-box; z-index: 2; }
.bar .spacer { flex: 1; }
.bar button { font-size: 28px; width: 80px; height: 52px; margin-left: 12px; background: #333; color: #fff;
  border: 0; border-radius: 10px; }
.chip { font-size: 22px; padding: 6px 14px; border-radius: 20px; background: #333; color: #ccc; }
.chip.live { background: #164; color: #8f8; }
.chip.warn { background: #540; color: #fc6; }
.chip.bad { background: #600; color: #f99; }
.code { font-size: 22px; color: #888; margin-left: 16px; letter-spacing: 0.1em; }

/* Landing. */
.mirror-landing { max-width: 900px; margin: 0 auto; padding: 6vh 4vw; text-align: center; }
.mirror-landing h1 { font-size: 7vh; margin: 0 0 4vh; }
.mirror-landing label { display: block; font-size: 4vh; color: #aaa; margin-bottom: 2vh; }
.mirror-landing input { font-size: 12vh; width: 80%; text-align: center; letter-spacing: 0.15em; background: #111;
  color: #fff; border: 3px solid #9ad; border-radius: 16px; padding: 1vh 2vw; text-transform: uppercase;
  box-sizing: border-box; }
.mirror-landing button { display: block; margin: 4vh auto 0; font-size: 6vh; padding: 2vh 10vw; background: #2a7;
  color: #fff; border: 0; border-radius: 16px; }

/* Stage. */
#video { position: absolute; top: 0; left: 0; width: 100%; height: calc(100% - 64px); background: #000;
  object-fit: contain; }
.banner { position: absolute; left: 0; right: 0; top: 0; padding: 2vh 3vw; font-size: 4vh; text-align: center;
  display: none; z-index: 3; }
.banner.bad { display: block; background: #600; color: #f99; }
.hint { position: absolute; left: 0; right: 0; top: 45%; text-align: center; font-size: 5vh; color: #777;
  pointer-events: none; z-index: 1; }
