/* Infinity Twitch Live Switch — neon pink/cyan theme matched to the Infinity chatroom. */
.itr-twitch {
  --itr-pink: #fa248f;
  --itr-pink-light: #ff6fb2;
  --itr-cyan: #16d9e8;
  --itr-cyan-light: #9af8ff;
  width: 100%; max-width: 100%; height: 600px; box-sizing: border-box;
  overflow: hidden; isolation: isolate;
  border: 1px solid rgba(231, 31, 122, .72);
  border-radius: 6px;
  background: #07090e; color: #f6f7fb;
  box-shadow: 0 0 0 1px rgba(0, 214, 235, .13), 0 14px 38px rgba(0, 0, 0, .48), 0 0 18px rgba(247, 16, 137, .15);
  font: 400 14px/1.45 Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
}
.itr-twitch, .itr-twitch * { box-sizing: border-box; }
.itr-twitch__status {
  position: absolute; top: 16px; right: 16px; z-index: 3;
  display: inline-flex; align-items: center; gap: 8px; flex-shrink: 0;
  padding: 7px 12px; border-radius: 999px;
  color: #e4e7f1; font-size: 10px; font-weight: 800;
  letter-spacing: .1em; white-space: nowrap;
  background: rgba(8, 14, 25, .72); border: 1px solid rgba(255,255,255,.09);
  backdrop-filter: blur(10px);
  box-shadow: 0 10px 24px rgba(0,0,0,.35);
}
.itr-twitch__status:before {
  content: ""; height: 8px; width: 8px; border-radius: 50%; flex-shrink: 0;
  background: #94d3d9; box-shadow: 0 0 8px rgba(21, 217, 234, .5);
}
.itr-twitch__status--offline { color: #ffc0dc; }
.itr-twitch__status--offline:before { background: #ff438b; box-shadow: 0 0 9px #ff438b9e; }
.itr-twitch__status--ready { color: #b3f7ff; }
.itr-twitch__status--ready:before { background: #16d9e8; box-shadow: 0 0 10px #16d9e8a8; }
.itr-twitch__status--live { color: #b6ffdc; }
.itr-twitch__status--live:before { background: #00ff91; box-shadow: 0 0 12px #00f991c9; }

.itr-twitch__stage {
  position: relative; width: 100%; height: 100%; min-height: 0;
  background: radial-gradient(ellipse 67% 64% at 6% 6%, rgba(5, 176, 210, .14), transparent 76%),
              radial-gradient(ellipse 61% 66% at 96% 96%, rgba(226, 0, 106, .19), transparent 76%),
              linear-gradient(130deg, #070d14 0%, #080b11 47%, #100811 100%);
}
.itr-twitch__stage:before {
  content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 0;
  background: linear-gradient(150deg, rgba(255, 255, 255, .035), transparent 20%, transparent 80%, rgba(255, 255, 255, .018)),
              repeating-linear-gradient(0deg, transparent 0 51px, rgba(255, 255, 255, .018) 52px),
              repeating-linear-gradient(90deg, transparent 0 51px, rgba(255, 255, 255, .016) 52px);
}
.itr-twitch__offline {
  position: relative; z-index: 1; height: 100%; width: 100%; padding: 28px 22px;
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  text-align: center;
}
.itr-twitch__orb {
  width: 78px; height: 78px; flex: 0 0 auto; margin-bottom: 25px;
  display: grid; place-items: center; border-radius: 50%;
  border: 1px solid rgba(24, 225, 245, .85);
  background: radial-gradient(circle at 30% 20%, #1f3550, #0b111b 55%, #0a0711 100%);
  box-shadow: inset 0 1px 2px rgba(255, 255, 255, .17), 0 0 0 7px rgba(12, 206, 235, .045),
              0 0 22px rgba(20, 198, 238, .22), 0 0 42px rgba(245, 10, 129, .13), 0 13px 26px #0008;
}
.itr-twitch__power {
  display: block; width: 25px; height: 25px; position: relative; transform: rotate(-37deg);
  border: 4px solid #13d9e9; border-top-color: transparent; border-radius: 50%;
  filter: drop-shadow(0 0 6px rgba(17, 225, 238, .57));
}
.itr-twitch__power:before {
  position: absolute; content: ""; width: 4px; height: 18px; left: 6px; top: -11px;
  border-radius: 2px; background: #13d9e9; transform: rotate(37deg);
}
.itr-twitch__eyebrow {
  color: #56edfd; font-size: 11px; font-weight: 850; letter-spacing: .24em;
  margin-bottom: 12px; text-shadow: 0 0 15px rgba(19, 217, 233, .35);
}
.itr-twitch__headline {
  color: #fff; font-size: clamp(23px, 3vw, 36px); font-weight: 850;
  letter-spacing: -.025em; line-height: 1.15; text-transform: uppercase;
  margin: 0 0 15px; padding: 0; text-shadow: 0 2px 15px #000c;
}
.itr-twitch__copy {
  color: #c0c3d5; font-size: 14px; line-height: 1.65;
  max-width: 440px; margin: 0 0 24px;
}
.itr-twitch__button {
  display: inline-flex; gap: 10px; align-items: center; justify-content: center;
  padding: 12px 24px; min-height: 45px; border-radius: 23px;
  border: 1px solid #1ca9c2; cursor: pointer;
  color: #effeff !important; text-decoration: none !important;
  background: linear-gradient(180deg, #263641, #111c27 46%, #0b111b 100%);
  box-shadow: inset 0 1px rgba(255, 255, 255, .18), inset 0 -1px rgba(0, 0, 0, .65),
              0 0 0 1px rgba(251, 37, 144, .22), 0 8px 20px #0009;
  font: 800 13px/1.3 Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  transition: border-color .18s, box-shadow .18s, background .18s, transform .18s;
}
.itr-twitch__button:hover, .itr-twitch__button:focus-visible {
  border-color: #ff3f9c; color: white !important;
  background: linear-gradient(180deg, #3d2948, #251b35 48%, #111622);
  box-shadow: 0 0 19px rgba(240, 19, 137, .24), inset 0 1px rgba(255, 255, 255, .23);
  transform: translateY(-1px);
}
.itr-twitch__button:focus-visible { outline: 2px solid #80f2ff; outline-offset: 3px; }
.itr-twitch__small { margin-top: 19px; color: #949bad; font-size: 11px; }
.itr-twitch__video { position: relative; height: 100%; width: 100%; z-index: 1; background: #030306; }
.itr-twitch__video iframe { display: block; height: 100%; width: 100%; border: 0; }
.itr-twitch [hidden] { display: none !important; }
@media(max-width:600px) {
  /* The entire player remains exactly 600px high on mobile as well. */
  .itr-twitch__status { top: 12px; right: 12px; padding: 6px 10px; font-size: 9px; }
  .itr-twitch__offline { padding: 17px 15px; }
  .itr-twitch__headline { font-size: 23px; }
  .itr-twitch__orb { width: 59px; height: 59px; margin-bottom: 17px; }
  .itr-twitch__copy { font-size: 12px; margin-bottom: 16px; }
  .itr-twitch__eyebrow { font-size: 10px; margin-bottom: 9px; }
  .itr-twitch__button { min-height: 40px; padding: 9px 17px; font-size: 12px; }
  .itr-twitch__small { margin-top: 14px; }
}
@media(prefers-reduced-motion:reduce) {
  .itr-twitch__button { transition: none; }
}