/* OBS 24x7 broadcast graphics — TV-grade, GPU-cheap (transform/opacity only) */
*{box-sizing:border-box;margin:0;padding:0}
html,body{width:100%;height:100%;background:#000;overflow:hidden;
  font-family:system-ui,Roboto,"Noto Sans Devanagari","Noto Sans",sans-serif}
#player,#player video{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:#000}
#player{isolation:isolate}
#player video{transition:opacity .45s ease}
#player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
/* Loader */
#loader{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;
  background:#000;color:#fff;font-size:26px;font-weight:900;letter-spacing:1px;z-index:2}
#loader::after{content:"";position:absolute;left:30%;right:30%;bottom:42%;height:4px;border-radius:99px;
  background:linear-gradient(90deg,transparent,#ff2233,transparent);
  background-size:200% 100%;animation:shimmer 1.3s linear infinite}
@keyframes shimmer{from{background-position:200% 0}to{background-position:-200% 0}}
#loader[hidden]{display:none}
/* LIVE bug */
#bug{position:absolute;top:24px;right:28px;z-index:3;display:flex;align-items:center;gap:10px;
  background:linear-gradient(135deg,#e11d2e,#8a0d1a);color:#fff;font-weight:900;font-size:28px;
  padding:8px 24px 8px 18px;border-radius:10px;letter-spacing:3px;
  box-shadow:0 6px 24px rgba(255,0,0,.4),inset 0 1px 0 rgba(255,255,255,.25)}
#bug::before{content:"";width:14px;height:14px;border-radius:50%;background:#fff;
  animation:blink 1.4s ease-in-out infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.25}}
/* Lower third — backInLeft-style overshoot entrance (animate.css pattern, GPU-cheap) */
#lower{position:absolute;left:40px;bottom:112px;z-index:3;color:#fff;
  background:linear-gradient(90deg,#d21022 0%,#7a0a14 72%,rgba(122,10,20,0) 100%);
  border-radius:10px;max-width:72vw;padding:10px 64px 14px 26px;
  border-left:6px solid #ffd7db;box-shadow:0 10px 34px rgba(0,0,0,.55);
  animation:lowerIn .65s cubic-bezier(.2,.9,.25,1.15)}
#lower.pop{animation:lowerIn .65s cubic-bezier(.2,.9,.25,1.15)}
@keyframes lowerIn{
  0%{opacity:0;transform:translateX(-180px) scale(.92)}
  70%{opacity:1;transform:translateX(10px) scale(1.01)}
  100%{opacity:1;transform:none}}
.lt-kicker{display:block;font-size:13px;font-weight:900;letter-spacing:5px;color:#ffd7db;
  margin-bottom:2px}
#lower-title{display:block;font-size:30px;font-weight:800;overflow:hidden;
  text-overflow:ellipsis;white-space:nowrap}
/* clip progress hairline */
#lower-bar{display:block;height:4px;margin-top:8px;border-radius:99px;
  background:rgba(255,255,255,.22);overflow:hidden}
#lower-bar i{display:block;height:100%;border-radius:99px;
  background:linear-gradient(90deg,#fff,#ffd7db);
  transform:scaleX(0);transform-origin:left center}
/* breaking flash wipe on rotation */
#flash{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:0;
  background:linear-gradient(105deg,transparent 20%,rgba(255,255,255,.85) 42%,rgba(255,34,51,.55) 50%,rgba(255,255,255,.85) 58%,transparent 80%);
  background-size:250% 100%;background-position:120% 0}
#flash.go{animation:flashWipe .7s cubic-bezier(.4,0,.2,1)}
@keyframes flashWipe{
  0%{opacity:0;background-position:120% 0}
  18%{opacity:1}
  100%{opacity:0;background-position:-120% 0}}
/* ambient animated glow (behind overlays, above video) */
#ambient{position:absolute;inset:0;z-index:1;pointer-events:none;overflow:hidden}
#ambient span{position:absolute;border-radius:50%;filter:blur(90px);opacity:.5}
#ambient span:first-child{width:44vw;height:44vw;left:-12vw;bottom:-16vw;
  background:radial-gradient(circle,rgba(255,34,51,.34),transparent 65%);
  animation:drift1 16s ease-in-out infinite alternate}
#ambient span:last-child{width:36vw;height:36vw;right:-10vw;top:-12vw;
  background:radial-gradient(circle,rgba(56,130,248,.3),transparent 65%);
  animation:drift2 20s ease-in-out infinite alternate}
@keyframes drift1{to{transform:translate(6vw,-4vw) scale(1.15)}}
@keyframes drift2{to{transform:translate(-5vw,5vw) scale(1.1)}}
/* bug shine sweep */
#bug{overflow:hidden}
#bug .shine{position:absolute;top:0;bottom:0;width:40%;left:-60%;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.5),transparent);
  animation:shine 4.5s ease-in-out infinite}
@keyframes shine{0%,55%{left:-60%}90%,100%{left:130%}}
/* Ticker */
#tick{position:absolute;left:0;right:0;bottom:0;z-index:3;
  background:linear-gradient(90deg,#b00d1c,#7d0a14);color:#fff;
  overflow:hidden;white-space:nowrap;font-size:25px;font-weight:600;padding:13px 0;
  border-top:2px solid rgba(255,255,255,.22)}
#ticktx{display:inline-block;padding-left:100%;animation:tick 32s linear infinite;will-change:transform}
@keyframes tick{to{transform:translateX(-100%)}}
/* Clock */
#clock{position:absolute;top:24px;left:28px;z-index:3;color:#fff;font-size:26px;font-weight:700;
  padding:8px 20px;border-radius:10px;font-variant-numeric:tabular-nums;
  background:rgba(5,8,15,.62);border:1px solid rgba(255,255,255,.16);
  box-shadow:0 6px 20px rgba(0,0,0,.4)}
#bug,#lower,#tick,#clock{letter-spacing:0}
[hidden]{display:none!important}
