.hero-logo{width:min(95%,600px);height:auto;max-height:340px;object-fit:contain;border-radius:12px;mask-image:radial-gradient(ellipse closest-side,#000 82%,transparent 100%)}
.broadcast-controls{margin-bottom:22px;padding-bottom:18px;border-bottom:1px solid var(--line)}.broadcast-controls>div{display:flex;gap:6px;margin:10px 0}.broadcast-controls button{flex:1;font-size:10px;padding:10px 4px;border-color:#856c37;background:linear-gradient(150deg,#5d492029,#aa80221f);color:#ffe1a0}.broadcast-controls small{font-size:8px;color:#97a6c0;display:block;line-height:1.6}.broadcast-controls button:nth-child(2){border-color:#7b4454;color:#ffb5b8}.broadcast-controls button:disabled{opacity:.3}
.broadcast-bumper{position:absolute;inset:0;z-index:12;overflow:hidden;display:flex;align-items:center;justify-content:center;background:radial-gradient(ellipse at 50% 40%,#224d9e 0,#061942 60%,#030819 100%);isolation:isolate;perspective:1100px;container-type:inline-size}
.broadcast-bumper:before{content:'';position:absolute;inset:0;background:repeating-conic-gradient(from 0deg at 50% 50%,transparent 0deg 19deg,#eab74b25 19.5deg 20deg,transparent 20.5deg 40deg);animation:bumper-turn 25s linear infinite;opacity:.65}
.broadcast-bumper:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(125deg,transparent 20%,#fff6bb80 40%,transparent 55%);mix-blend-mode:screen;transform:translateX(-150%);animation:bumper-wipe 1.1s .15s both;animation-delay:calc(.15s + var(--elapsed,0s))}
.bumper-content{z-index:3;position:relative;width:100%;padding:5%;text-align:center;display:flex;align-items:center;flex-direction:column}.bumper-kicker{font-size:clamp(8px,1.1vw,15px);font-weight:800;letter-spacing:5px;color:#c4d7fc;animation:bumper-caption .7s .5s both;animation-delay:calc(.5s + var(--elapsed,0s))}
.bumper-logo-wrap{position:relative;width:min(92%,760px);margin:18px auto 15px;animation:bumper-logo 1.6s cubic-bezier(.16,1,.3,1) .35s both;animation-delay:calc(.35s + var(--elapsed,0s));transform-style:preserve-3d}
.bumper-logo{display:block;width:100%;height:auto;max-height:54vh;object-fit:contain;filter:drop-shadow(0 18px 25px #0009);mask-image:radial-gradient(ellipse closest-side,#000 86%,transparent 100%)}
.bumper-glint{position:absolute;inset:5% 0;background:linear-gradient(110deg,transparent 30%,#fff8d099 49%,transparent 60%);mix-blend-mode:screen;mask-image:radial-gradient(ellipse closest-side,#000 80%,transparent);animation:bumper-glint 1.2s 1.4s both;animation-delay:calc(1.4s + var(--elapsed,0s));pointer-events:none}
.bumper-content h2{font:800 clamp(30px,4.3vw,76px)/1 var(--heading);letter-spacing:3px;color:#ffe3a0;text-shadow:0 3px #694314,0 0 35px #d7a95566;animation:bumper-caption .65s 1.1s both;animation-delay:calc(1.1s + var(--elapsed,0s));margin:0}
.bumper-subtitle{font-size:clamp(7px,1vw,12px);letter-spacing:4px;margin-top:18px;color:#9cb8e5;animation:bumper-caption .6s 1.7s both;animation-delay:calc(1.7s + var(--elapsed,0s))}
.bumper-orbit{position:absolute;width:80%;aspect-ratio:1;border:2px solid #ffd98899;border-radius:50%;box-shadow:0 0 12px #ffd9884d,inset 0 0 12px #ffd9884d;transform:rotateX(64deg) rotateZ(-30deg);animation:bumper-orbit 8s linear infinite;opacity:.5}.orbit-two{width:100%;border-color:#4197ff66;transform:rotateX(68deg) rotateZ(30deg);animation-direction:reverse}
.bumper-tunnel{position:absolute;inset:-30%;background:radial-gradient(circle at 50% 50%,transparent 25%,#ffcb5822 26%,transparent 26.5%,transparent 36%,#4599ff22 36.5%,transparent 37%,transparent 45%,#ffcb581a 46%,transparent 46.5%);animation:bumper-tunnel 3s ease-out infinite}
.bumper-streaks{position:absolute;inset:0;overflow:hidden}.bumper-streaks i{position:absolute;left:-40%;width:180%;height:3px;top:20%;background:linear-gradient(90deg,transparent,#ffde8e,transparent);box-shadow:0 0 18px #f5d178;transform:rotate(-25deg);animation:bumper-streak 1.2s .2s both;animation-delay:calc(.2s + var(--elapsed,0s))}.bumper-streaks i:nth-child(2){top:70%;animation-delay:calc(.4s + var(--elapsed,0s));height:8px;background:linear-gradient(90deg,transparent,#2594ff,transparent)}.bumper-streaks i:nth-child(3){top:80%;animation-delay:calc(.6s + var(--elapsed,0s));height:2px}
.bumper-progress{height:2px;width:180px;margin:25px auto 0;background:#ffffff16;border-radius:5px;overflow:hidden}.bumper-progress i{display:block;height:100%;background:#ffe298;transform-origin:left;animation:bumper-progress 7.6s linear both;animation-delay:var(--elapsed,0s)}.break .bumper-progress i{animation-duration:6s}.return .bumper-progress i{animation-duration:5.6s}.holding .bumper-progress{opacity:0}.holding .bumper-content h2{animation:bumper-breathe 3s ease-in-out infinite}.holding .bumper-logo-wrap{animation:none}.holding .bumper-kicker,.holding .bumper-subtitle{animation:none}
.audience .broadcast-bumper{position:fixed;inset:0;z-index:100;border-radius:0}.audience .bumper-logo-wrap{width:min(80%,1000px)}.audience .bumper-logo{max-height:65vh}.audience .bumper-kicker{font-size:clamp(10px,1.2vw,19px)}.theme-options{display:grid;gap:10px}.theme-options button{border-color:#9b7d40;color:#ffe1a0}.theme-options button.selected{background:#a879272c;border-color:#e5b658}#themeStatus{margin:18px 0;color:#b8d8c3;font-size:12px}.youtube-dock{position:fixed;bottom:18px;right:18px;width:360px;max-width:calc(100vw - 28px);z-index:130;background:#08152c;border:1px solid #61789e;border-radius:9px;box-shadow:0 8px 40px #0009;overflow:hidden}.youtube-label{display:flex;align-items:center;justify-content:space-between;font-size:8px;color:#d0d9ec;letter-spacing:.5px;padding:6px 12px}.youtube-label button{padding:3px 7px;font-size:11px;border:0;background:none}.youtube-dock iframe{width:100%;height:203px;min-width:200px;min-height:200px;display:block;border:0}.audience .top-actions{position:relative}.on-break .stage-top{visibility:hidden}
@keyframes bumper-logo{0%{opacity:0;transform:translateZ(-700px) rotateY(-55deg) rotateZ(-14deg) scale(.3)}50%{opacity:1}78%{transform:translateZ(35px) rotateY(3deg) rotateZ(1deg) scale(1.04)}100%{opacity:1;transform:translateZ(0) rotateY(0) rotateZ(0) scale(1)}}
@keyframes bumper-caption{from{opacity:0;transform:translateY(25px);filter:blur(5px)}to{opacity:1;transform:none;filter:blur(0)}}@keyframes bumper-turn{to{transform:rotate(360deg)}}@keyframes bumper-orbit{to{transform:rotateX(64deg) rotateZ(330deg)}}@keyframes bumper-tunnel{from{transform:scale(.7);opacity:.7}to{transform:scale(1.6);opacity:0}}@keyframes bumper-wipe{to{transform:translateX(150%)}}@keyframes bumper-glint{from{transform:translateX(-110%);opacity:0}40%{opacity:.8}to{transform:translateX(110%);opacity:0}}@keyframes bumper-streak{from{transform:translateX(-100%) rotate(-25deg);opacity:0}30%{opacity:1}to{transform:translateX(100%) rotate(-25deg);opacity:0}}@keyframes bumper-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes bumper-breathe{50%{opacity:.65;text-shadow:0 3px #694314,0 0 60px #f6c459aa}}
@media(max-width:800px){.broadcast-controls button{padding:14px 5px;font-size:12px}.broadcast-controls small{font-size:10px}.bumper-content h2{font-size:30px}.bumper-kicker{font-size:8px;letter-spacing:2px}.bumper-subtitle{font-size:7px;letter-spacing:2px}.audience .bumper-logo-wrap{width:95%}.audience .bumper-logo{max-height:55vh}.youtube-dock{bottom:10px;right:10px;width:320px}.hero-logo{max-height:230px}}
@media(prefers-reduced-motion:reduce){.broadcast-bumper *{animation:none!important}.bumper-progress{display:none}}
