/* Overlay-Elemente (Editor-Vorschau + OBS-Ausgabe). Basis: 1920x1080-Buehne. */
.ovStage{position:absolute;left:0;top:0;width:1920px;height:1080px;overflow:hidden;transform-origin:0 0;background:transparent}
.ovEl{position:absolute;box-sizing:border-box}
.ovIn{width:100%;height:100%;position:relative;box-sizing:border-box}
.ovEl[data-hidden="1"]{display:none}
.ovEl *{box-sizing:border-box}

/* Textbox: Hintergrund-Layer kann schraeg gestellt werden (Parallelogramm) */
.ovTxt{position:relative;width:100%;height:100%;display:flex;color:var(--tc,#fff);font-family:var(--ff);font-size:var(--fs,48px);
  font-weight:var(--fw,700);font-style:var(--fi,normal);text-transform:var(--tt,none);letter-spacing:var(--ls,0);line-height:1.15;
  padding:var(--pad,0px);justify-content:var(--jc,center);align-items:var(--ai,center);text-align:var(--ta,center)}
.ovTxt .ovBg{position:absolute;inset:0;background:var(--bg,transparent);border-radius:var(--rad,0);transform:skewX(var(--skew,0deg));
  border:var(--bw,0px) solid var(--bc,transparent);box-shadow:var(--sh,none)}
.ovTxt .ovTx{position:relative;max-width:100%;overflow-wrap:anywhere;transform:skewX(var(--tskew,0deg)) rotate(var(--trot,0deg));
  -webkit-text-stroke:var(--ow,0) var(--oc,#000);paint-order:stroke fill;text-shadow:var(--ts,none)}
.ovTx .ovCh{display:inline-block;white-space:pre}
.ovTx .ovWd{display:inline-block;white-space:pre}

/* Text-Effekte (pro Buchstabe) */
@keyframes fxRise{from{opacity:0;transform:translateY(40px)}to{opacity:1;transform:none}}
@keyframes fxDrop{from{opacity:0;transform:translateY(-70px) rotate(-12deg)}to{opacity:1;transform:none}}
@keyframes fxPop{0%{opacity:0;transform:scale(0)}70%{opacity:1;transform:scale(1.4)}100%{transform:scale(1)}}
@keyframes fxBlur{from{opacity:0;filter:blur(14px)}to{opacity:1;filter:none}}
@keyframes fxSlant{from{opacity:0;transform:translateX(-30px) skewX(-30deg)}to{opacity:1;transform:none}}
@keyframes fxFlip{from{opacity:0;transform:perspective(400px) rotateX(-90deg)}to{opacity:1;transform:none}}
@keyframes fxWave{0%,100%{transform:translateY(0)}50%{transform:translateY(-.22em)}}
@keyframes fxRainbow{to{color:var(--c2,#fff);filter:hue-rotate(360deg)}}
@keyframes fxJitter{0%,100%{transform:translate(0,0)}25%{transform:translate(1px,-2px)}50%{transform:translate(-2px,1px)}75%{transform:translate(2px,2px)}}
@keyframes fxNeon{0%,18%,22%,25%,53%,57%,100%{opacity:1}20%,24%,55%{opacity:.35}}
@keyframes fxShimmer{to{background-position:-200% 0}}
.fx-letterRise .ovCh,.fx-letterDrop .ovCh,.fx-letterPop .ovCh,.fx-blurReveal .ovCh,.fx-letterSlant .ovCh,.fx-letterFlip .ovCh{opacity:0;animation-duration:var(--fxd,500ms);animation-fill-mode:both;animation-timing-function:cubic-bezier(.2,.9,.3,1.2);animation-delay:calc(var(--delay,0ms) + var(--i) * var(--stag,45ms))}
.fx-letterRise .ovCh{animation-name:fxRise}.fx-letterDrop .ovCh{animation-name:fxDrop}.fx-letterPop .ovCh{animation-name:fxPop}
.fx-blurReveal .ovCh{animation-name:fxBlur}.fx-letterSlant .ovCh{animation-name:fxSlant}.fx-letterFlip .ovCh{animation-name:fxFlip}
.fx-wordSlide .ovWd{opacity:0;animation:fxSlant var(--fxd,500ms) cubic-bezier(.2,.9,.3,1) both;animation-delay:calc(var(--delay,0ms) + var(--i) * 160ms)}
.fx-letterWave .ovCh{animation:fxWave 1.2s ease-in-out infinite;animation-delay:calc(var(--i) * 80ms)}
.fx-letterRainbow .ovCh{animation:fxRainbow 3s linear infinite;animation-delay:calc(var(--i) * -150ms)}
.fx-jitter .ovCh{animation:fxJitter .25s steps(2) infinite;animation-delay:calc(var(--i) * -40ms)}
.fx-neon .ovTx{animation:fxNeon 3s linear infinite;text-shadow:0 0 6px var(--c2,#fff),0 0 18px var(--c2,#fff),0 0 40px var(--c2,#fff)}
.fx-shimmer .ovTx{background:linear-gradient(100deg,var(--tc,#fff) 30%,var(--c2,#fff) 50%,var(--tc,#fff) 70%);background-size:200% 100%;
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:fxShimmer 2.4s linear infinite;-webkit-text-stroke:0}

/* Hintergrund-Glanz (Dauer-Effekt "shine") */
.ovTxt.shine .ovBg{overflow:hidden}
.ovTxt.shine .ovBg::after{content:"";position:absolute;top:0;bottom:0;width:40%;left:-60%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);animation:ovShine 2.6s ease-in-out infinite}
@keyframes ovShine{to{left:130%}}

/* Bild / Video / Box */
.ovMedia{width:100%;height:100%;display:block;object-fit:var(--fit,contain);border-radius:var(--rad,0);border:var(--bw,0px) solid var(--bc,transparent);box-shadow:var(--sh,none)}
.ovBox{width:100%;height:100%;background:var(--bg,#9146ff);border-radius:var(--rad,0);border:var(--bw,0px) solid var(--bc,transparent);transform:skewX(var(--skew,0deg));box-shadow:var(--sh,none)}

/* Ziel-Balken */
.ovGoal{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;gap:10px;font-family:var(--ff);color:var(--tc,#fff);font-size:var(--fs,34px);font-weight:var(--fw,700)}
.ovGoalRow{display:flex;gap:16px;align-items:center;-webkit-text-stroke:var(--ow,0) var(--oc,#000);paint-order:stroke fill}
.ovGoalIn{position:absolute;inset:0;display:flex;align-items:center;gap:12px;padding:0 16px;font-size:.62em;z-index:2;-webkit-text-stroke:var(--ow,0) var(--oc,#000);paint-order:stroke fill}
.ovGoalTrack{position:relative;height:var(--bh,36px);background:var(--tr,rgba(255,255,255,.18));border-radius:var(--rad,18px);overflow:hidden;transform:skewX(var(--skew,0deg));border:var(--bw,0px) solid var(--bc,transparent)}
.ovGoalFill{position:absolute;background:var(--fillbg,linear-gradient(90deg,var(--b1,#9146ff),var(--b2,#e0a3ff)));border-radius:var(--frad,inherit);transition:width 1.2s cubic-bezier(.2,.8,.2,1),height 1.2s cubic-bezier(.2,.8,.2,1);overflow:hidden}
.ovGoalFill.f-right{left:0;top:0;bottom:0;width:0}.ovGoalFill.f-left{right:0;top:0;bottom:0;width:0}.ovGoalFill.f-up{left:0;right:0;bottom:0;height:0}.ovGoalFill.f-down{left:0;right:0;top:0;height:0}
.ovGoal.vert .ovGoalTrack{flex:1 1 auto;height:auto;min-height:40px;width:var(--bh,36px);align-self:center}
.ovGoalFill.stripes::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(-45deg,rgba(255,255,255,.22) 0 12px,transparent 12px 24px);animation:ovStripe 1s linear infinite}
@keyframes ovStripe{to{background-position:34px 0}}

/* Event-Liste */
.ovList{width:100%;height:100%;display:flex;flex-direction:column;gap:var(--gap,8px);overflow:hidden;font-family:var(--ff);font-size:var(--fs,30px);font-weight:var(--fw,700);color:var(--tc,#fff);justify-content:var(--lj,flex-start)}
.ovRow{position:relative;display:flex;align-items:center;gap:12px;padding:8px 18px;flex:0 0 auto;-webkit-text-stroke:var(--ow,0) var(--oc,#000);paint-order:stroke fill}
.ovRow .ovBg{position:absolute;inset:0;background:var(--bg,rgba(20,20,28,.8));border-radius:var(--rad,10px);transform:skewX(var(--skew,0deg));border-left:var(--bw,0px) solid var(--bc,#9146ff);z-index:0}
.ovRow>*:not(.ovBg){position:relative;z-index:1}
.ovRow .ovAmt{margin-left:auto;opacity:.85}

/* Alerts */
.ovAlertHost{width:100%;height:100%;position:relative}
.ovAlert{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--agap,12px);pointer-events:none}
.ovAlert .ovAMedia{flex:0 1 auto;max-width:100%;max-height:var(--amh,62%);object-fit:contain;border-radius:var(--arad,0)}
.ovAlert .ovATxt{width:100%;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center}
.ovAlert.over{justify-content:flex-end}
.ovAlert.over .ovAMedia{position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:cover}
.ovAlert.over .ovATxt{margin-bottom:6%}
.ovAlert .ovTxt{height:auto;min-height:0;width:auto;max-width:100%;margin:0 auto}
.ovAlert .ovTxt .ovBg{inset:0}
.ovAlert .ovTxt.line1{--fs:var(--fs1,64px)}
.ovAlert .ovTxt.line2{--fs:var(--fs2,36px);--fw:600}

/* Chat */
.ovChat{width:100%;height:100%;display:flex;flex-direction:column;justify-content:flex-end;gap:var(--gap,6px);overflow:hidden;font-family:var(--ff);font-size:var(--fs,28px);color:var(--tc,#fff);font-weight:var(--fw,600)}
.ovMsg{position:relative;padding:6px 16px;flex:0 0 auto;line-height:1.25;overflow-wrap:anywhere;-webkit-text-stroke:var(--ow,0) var(--oc,#000);paint-order:stroke fill}
.ovMsg .ovBg{position:absolute;inset:0;background:var(--bg,rgba(15,15,20,.7));border-radius:var(--rad,8px);transform:skewX(var(--skew,0deg));z-index:0}
.ovMsg>*:not(.ovBg){position:relative;z-index:1}
.ovMsg .nm{font-weight:800;margin-right:8px}
.ovMsg img.em{height:1.4em;vertical-align:middle;margin:0 1px}

/* Umfrage */
.ovPoll{width:100%;height:100%;display:flex;flex-direction:column;gap:10px;justify-content:center;font-family:var(--ff);font-size:var(--fs,30px);font-weight:var(--fw,700);color:var(--tc,#fff)}
.ovPollQ{font-size:1.15em;margin-bottom:4px;-webkit-text-stroke:var(--ow,0) var(--oc,#000);paint-order:stroke fill}
.ovPollOpt{position:relative;height:var(--bh,52px);border-radius:var(--rad,10px);background:var(--tr,rgba(255,255,255,.16));overflow:hidden;display:flex;align-items:center;padding:0 16px;gap:12px;transform:skewX(var(--skew,0deg))}
.ovPollOpt{border:var(--bw,0px) solid var(--bc,transparent)}
.ovPollOpt .f{position:absolute;background:var(--fillbg,linear-gradient(90deg,var(--b1,#9146ff),var(--b2,#e0a3ff)));border-radius:var(--frad,0);transition:width .8s cubic-bezier(.2,.8,.2,1),height .8s cubic-bezier(.2,.8,.2,1)}
.ovPollOpt .f-right{left:0;top:0;bottom:0;width:0}.ovPollOpt .f-left{right:0;top:0;bottom:0;width:0}.ovPollOpt .f-up{left:0;right:0;bottom:0;height:0}.ovPollOpt .f-down{left:0;right:0;top:0;height:0}
.ovPoll.vert{justify-content:flex-start}.ovPollCols{display:flex;flex:1;gap:14px;min-height:0}
.ovPoll.vert .ovPollOpt{flex:1;height:auto;flex-direction:column;justify-content:space-between;align-items:center;padding:12px 6px;transform:none;text-align:center}
.ovPoll.vert .ovPollOpt .pc{margin:0}
.ovPollOpt span{position:relative;z-index:1}
.ovPollOpt .pc{margin-left:auto}

/* Standbild (Editor-Vorschau): keine Text-/Buchstaben-Animationen */
.ovStatic .ovCh,.ovStatic .ovWd{opacity:1 !important;animation:none !important}
.ovStatic .ovTx,.ovStatic .ovTxt,.ovStatic .ovAMedia{animation:none !important}

.ovList.bp-right .ovRow .ovBg{border-left:0;border-right:var(--bw,0px) solid var(--bc,#9146ff)}
.ovList.bp-top .ovRow .ovBg{border-left:0;border-top:var(--bw,0px) solid var(--bc,#9146ff)}
.ovList.bp-none .ovRow .ovBg{border:0}
.ovMsg .tm{font-weight:400;opacity:.75;font-size:.8em;margin-right:8px}
.ovMsg img.bdg{width:1.1em;height:1.1em;vertical-align:middle;margin-right:5px;border-radius:2px}
.ovMsg .bd-tr{position:absolute;top:4px;right:8px;z-index:1}.ovMsg .bd-tr img.bdg{margin:0 0 0 3px}

/* Alert-Ebenen */
.ovAlert.lay{display:block}
.ovAlert .ovALay{position:absolute;pointer-events:none}
.ovAlert .ovALayIn,.ovAlert .ovALayLoop{width:100%;height:100%;position:relative}
.ovAlert.lay .ovALay.m .ovAMedia{position:absolute;inset:0;width:100%;height:100%;max-height:none;max-width:none;object-fit:contain}
.ovAlert.lay .ovALay.t .ovATxt{position:absolute;inset:0;width:100%;height:100%}
