/* BulltriX 2.2.55 – Arena-180 live, vollkommen stumm.
   Phasen aller Animationen werden mit --bt180-shift an die Firebase-Ereigniszeit gebunden. */
.highlight-overlay.bt-live-180{
  position:fixed;inset:0;z-index:85;display:flex;align-items:center;justify-content:center;
  overflow:hidden;isolation:isolate;text-align:center;pointer-events:none;
  color:#f7fafc;font-family:'DM Sans',system-ui,sans-serif;
  background:radial-gradient(ellipse at 50% 52%,#172a3a 0%,#101e2c 43%,#060c17 83%);
  animation:none;--bt180-shift:0s;
}
.highlight-overlay.bt-live-180::before{content:none!important;animation:none!important}
.bt-live-180 .bt-live-atmosphere{position:absolute;inset:-15%;background:radial-gradient(circle at 50% 50%,rgba(255,177,76,.18),transparent 43%),linear-gradient(160deg,rgba(78,146,240,.06),transparent 55%);opacity:.45;z-index:0;animation:btLiveAtmosphere 2.1s ease-out both;animation-delay:calc(.06s + var(--bt180-shift))}
.bt-live-180 .bt-live-burst{position:absolute;width:min(96vmin,860px);height:min(96vmin,860px);left:50%;top:50%;transform:translate(-50%,-50%);z-index:1;pointer-events:none}
.bt-live-180 .bt-live-ring,.bt-live-180 .bt-live-beam,.bt-live-180 .bt-live-flare,.bt-live-180 .bt-live-shard,.bt-live-180 .bt-live-shock{position:absolute;left:50%;top:50%;opacity:0;pointer-events:none}
.bt-live-180 .bt-live-ring{border-radius:50%;border:1px solid rgba(255,195,116,.54);box-shadow:0 0 35px rgba(255,174,76,.2),inset 0 0 30px rgba(70,154,255,.13)}
.bt-live-180 .bt-live-ring.ring-1{width:31%;aspect-ratio:1;animation:btLiveRing 1.2s ease-out both;animation-delay:calc(.12s + var(--bt180-shift))}
.bt-live-180 .bt-live-ring.ring-2{width:53%;aspect-ratio:1;border-color:rgba(94,190,255,.3);animation:btLiveRing 1.48s ease-out both;animation-delay:calc(.26s + var(--bt180-shift))}
.bt-live-180 .bt-live-ring.ring-3{width:80%;aspect-ratio:1;border-color:rgba(255,195,116,.22);animation:btLiveRing 1.75s ease-out both;animation-delay:calc(.40s + var(--bt180-shift))}
.bt-live-180 .bt-live-beam{width:88%;height:12px;border-radius:99px;background:linear-gradient(90deg,transparent,rgba(99,190,255,.62) 26%,rgba(255,203,125,.92) 50%,rgba(99,190,255,.62) 74%,transparent);filter:drop-shadow(0 0 17px rgba(255,165,66,.37))}
.bt-live-180 .bt-live-beam.beam-1{--angle:0deg;animation:btLiveBeam 1.26s ease-out both;animation-delay:calc(.14s + var(--bt180-shift))}
.bt-live-180 .bt-live-beam.beam-2{--angle:60deg;animation:btLiveBeam 1.26s ease-out both;animation-delay:calc(.23s + var(--bt180-shift))}
.bt-live-180 .bt-live-beam.beam-3{--angle:-60deg;animation:btLiveBeam 1.26s ease-out both;animation-delay:calc(.32s + var(--bt180-shift))}
.bt-live-180 .bt-live-flare{width:76%;aspect-ratio:1;border-radius:50%;background:conic-gradient(from 0deg,transparent 0deg,rgba(255,196,98,.42) 14deg,transparent 32deg,transparent 60deg,rgba(92,189,255,.32) 75deg,transparent 100deg,transparent 150deg,rgba(255,191,98,.25) 167deg,transparent 187deg,transparent 240deg,rgba(92,189,255,.32) 252deg,transparent 285deg,rgba(255,187,87,.22) 312deg,transparent 335deg)}
.bt-live-180 .bt-live-flare.flare-1{animation:btLiveFlare 1.35s ease-out both;animation-delay:calc(.10s + var(--bt180-shift))}
.bt-live-180 .bt-live-flare.flare-2{animation:btLiveFlare 1.48s ease-out both;animation-delay:calc(.23s + var(--bt180-shift))}
.bt-live-180 .bt-live-flare.flare-3{animation:btLiveFlare 1.62s ease-out both;animation-delay:calc(.36s + var(--bt180-shift))}
.bt-live-180 .bt-live-shard{width:12px;height:clamp(60px,12vmin,130px);border-radius:99px;background:linear-gradient(180deg,transparent,rgba(255,206,128,.96) 45%,rgba(94,190,255,.86));filter:drop-shadow(0 0 12px rgba(255,177,75,.32))}
.bt-live-180 .bt-live-shard.shard-1{--angle:-78deg;animation-delay:calc(.44s + var(--bt180-shift))}
.bt-live-180 .bt-live-shard.shard-2{--angle:-34deg;animation-delay:calc(.50s + var(--bt180-shift))}
.bt-live-180 .bt-live-shard.shard-3{--angle:13deg;animation-delay:calc(.56s + var(--bt180-shift))}
.bt-live-180 .bt-live-shard.shard-4{--angle:54deg;animation-delay:calc(.62s + var(--bt180-shift))}
.bt-live-180 .bt-live-shard.shard-5{--angle:108deg;animation-delay:calc(.68s + var(--bt180-shift))}
.bt-live-180 .bt-live-shard.shard-6{--angle:153deg;animation-delay:calc(.74s + var(--bt180-shift))}
.bt-live-180 .bt-live-shard{animation-name:btLiveShard;animation-duration:1.12s;animation-timing-function:ease-out;animation-fill-mode:both}
.bt-live-180 .bt-live-shock{width:30%;aspect-ratio:1;border-radius:50%;border:2px solid rgba(255,217,150,.88);box-shadow:0 0 28px rgba(255,191,98,.45),inset 0 0 22px rgba(255,191,98,.20);animation:btLiveShock 1.12s ease-out both;animation-delay:calc(.40s + var(--bt180-shift))}
.bt-live-180 .bt-live-core{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;max-width:calc(100vw - 32px);width:min(92vw,1100px);padding:clamp(24px,5vmin,56px) 18px;animation:btLiveCore .83s cubic-bezier(.13,.9,.22,1) both;animation-delay:calc(.14s + var(--bt180-shift))}
.bt-live-180 .bt-live-core::before{content:'';position:absolute;inset:5% 10%;z-index:-1;background:radial-gradient(circle,rgba(255,184,90,.17),transparent 67%);filter:blur(23px)}
.bt-live-180 .bt-live-eyebrow{font-size:clamp(10px,1.5vmin,17px);font-weight:900;letter-spacing:.26em;color:#ffc48d;text-transform:uppercase}
.bt-live-180 .bt-live-heading{font-family:'Barlow Condensed','Arial Narrow',Impact,sans-serif;font-weight:900;font-size:clamp(44px,8vmin,102px);line-height:.9;letter-spacing:.02em;color:#fdfcfa;text-shadow:0 0 25px rgba(255,180,88,.13);margin:12px 0 6px}
.bt-live-180 .bt-live-number-stack{position:relative;display:grid;place-items:center;line-height:.79;margin:10px auto 4px;animation:btLiveNumberShake 1.15s cubic-bezier(.13,1.04,.23,1) both;animation-delay:calc(.40s + var(--bt180-shift))}
.bt-live-180 .bt-live-number{grid-area:1/1;display:block;font:900 clamp(155px,42vmin,510px)/.78 'Barlow Condensed','Arial Narrow',Impact,sans-serif;letter-spacing:.01em;white-space:nowrap}
.bt-live-180 .bt-live-number-echo{color:rgba(255,222,185,.3);text-shadow:0 0 55px rgba(255,181,70,.25);animation:btLiveEcho 1.58s ease-out both;animation-delay:calc(.48s + var(--bt180-shift))}
.bt-live-180 .bt-live-number-main{background:linear-gradient(180deg,#fffef8 0%,#ffeed0 24%,#ffcd79 53%,#ff9b38 100%);background-clip:text;-webkit-background-clip:text;color:transparent;filter:drop-shadow(0 0 24px rgba(255,203,117,.25)) drop-shadow(0 0 85px rgba(255,139,44,.30));animation:btLiveNumberSlam .92s cubic-bezier(.13,1.05,.24,1) both;animation-delay:calc(.4s + var(--bt180-shift))}
.bt-live-180 .bt-live-impact-line{height:clamp(5px,1vmin,9px);width:min(77vw,570px);border-radius:99px;background:linear-gradient(90deg,transparent,rgba(97,191,255,.5) 18%,#ffce82 50%,rgba(97,191,255,.5) 82%,transparent);box-shadow:0 0 23px rgba(255,183,77,.40),0 0 50px rgba(90,178,255,.15);margin:10px auto 0;animation:btLiveLine .66s ease-out both;animation-delay:calc(.56s + var(--bt180-shift))}
.bt-live-180 .bt-live-player{max-width:min(85vw,950px);overflow-wrap:anywhere;display:block;margin-top:22px;padding:12px 23px;border-radius:99px;border:1px solid rgba(255,189,103,.28);background:rgba(4,13,25,.76);font-size:clamp(20px,4vmin,43px);line-height:1.2;font-weight:900;letter-spacing:.09em;color:#fff;box-shadow:0 0 40px rgba(255,175,77,.08);animation:btLiveRise .5s ease-out both;animation-delay:calc(1.0s + var(--bt180-shift))}
.bt-live-180 .bt-live-route{display:flex;align-items:center;justify-content:center;gap:clamp(8px,2vmin,20px);margin-top:18px;animation:btLiveRise .52s ease-out both;animation-delay:calc(1.10s + var(--bt180-shift))}
.bt-live-180 .bt-live-route span{min-width:clamp(62px,13vmin,100px);padding:9px 14px;border-radius:99px;border:1px solid rgba(255,192,110,.2);background:rgba(9,24,38,.72);font-weight:900;font-size:clamp(12px,1.9vmin,20px);letter-spacing:.05em;color:#f4f8fb}
.bt-live-180 .bt-live-route i{width:clamp(13px,4vmin,43px);height:3px;background:linear-gradient(90deg,transparent,#ffbd76,transparent)}
.bt-live-180 .bt-live-caption{font-size:clamp(9px,1.5vmin,16px);font-weight:900;color:#d7e6f0;letter-spacing:.13em;margin-top:16px;animation:btLiveRise .52s ease-out both;animation-delay:calc(1.23s + var(--bt180-shift))}
.bt-live-180 .bt-live-progress{position:absolute;bottom:clamp(15px,3vmin,35px);width:min(78vw,600px);height:4px;border-radius:99px;background:rgba(255,255,255,.13);overflow:hidden;z-index:3}
.bt-live-180 .bt-live-progress span{display:block;width:100%;height:100%;border-radius:99px;background:linear-gradient(90deg,#6fbde8,#ffbb72);transform-origin:left;animation:btLiveProgress linear forwards}
@keyframes btLiveAtmosphere{0%{opacity:0;transform:scale(.85)}32%{opacity:1}100%{opacity:.45;transform:scale(1.18)}}
@keyframes btLiveRing{0%{opacity:0;transform:translate(-50%,-50%) scale(.24)}28%{opacity:.95}100%{opacity:0;transform:translate(-50%,-50%) scale(1.23)}}
@keyframes btLiveBeam{0%{opacity:0;transform:translate(-50%,-50%) scaleX(.18) rotate(var(--angle))}24%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) scaleX(1.08) rotate(var(--angle))}}
@keyframes btLiveFlare{0%{opacity:0;transform:translate(-50%,-50%) scale(.16) rotate(0deg)}22%{opacity:.92}100%{opacity:0;transform:translate(-50%,-50%) scale(1.18) rotate(43deg)}}
@keyframes btLiveShard{0%{opacity:0;transform:translate(-50%,-50%) rotate(var(--angle)) translateY(-20px) scale(.3)}18%{opacity:1}100%{opacity:0;transform:translate(-50%,-50%) rotate(var(--angle)) translateY(-240px) scale(1.05)}}
@keyframes btLiveShock{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}12%{opacity:.98}100%{opacity:0;transform:translate(-50%,-50%) scale(2.4)}}
@keyframes btLiveCore{0%{opacity:0;transform:translateY(16px) scale(.96)}100%{opacity:1;transform:translateY(0) scale(1)}}
@keyframes btLiveNumberShake{0%{transform:translateY(18px) scale(.78)}32%{transform:translateY(-8px) scale(1.08)}46%{transform:translateY(2px) scale(.99)}60%{transform:translateY(-2px) scale(1.01)}100%{transform:translateY(0) scale(1)}}
@keyframes btLiveNumberSlam{0%{opacity:0;transform:translateY(20px) scale(.66);filter:blur(7px)}55%{opacity:1;transform:translateY(-5px) scale(1.05);filter:blur(0)}100%{opacity:1;transform:translateY(0) scale(1);filter:drop-shadow(0 0 26px rgba(255,188,100,.23))}}
@keyframes btLiveEcho{0%{opacity:0;transform:translateY(22px) scale(.76)}22%{opacity:.94;transform:translateY(8px) scale(1.08)}100%{opacity:0;transform:translateY(-12px) scale(1.20)}}
@keyframes btLiveLine{0%{opacity:0;transform:scaleX(.15)}54%{opacity:1;transform:scaleX(1.05)}100%{opacity:1;transform:scaleX(1)}}
@keyframes btLiveRise{0%{opacity:0;transform:translateY(13px)}100%{opacity:1;transform:translateY(0)}}
@keyframes btLiveProgress{from{transform:scaleX(1)}to{transform:scaleX(0)}}
@media(max-width:650px){
 .bt-live-180 .bt-live-core{padding:28px 12px}.bt-live-180 .bt-live-heading{font-size:clamp(32px,8vw,64px)}
 .bt-live-180 .bt-live-number{font-size:clamp(132px,41vw,250px)}
 .bt-live-180 .bt-live-route{gap:8px}.bt-live-180 .bt-live-route span{padding:8px 11px;min-width:60px}
 .bt-live-180 .bt-live-route i{width:13px}.bt-live-180 .bt-live-caption{letter-spacing:.06em}
}
@media(prefers-reduced-motion:reduce){
 .bt-live-180 .bt-live-atmosphere,.bt-live-180 .bt-live-ring,.bt-live-180 .bt-live-beam,.bt-live-180 .bt-live-flare,.bt-live-180 .bt-live-shard,.bt-live-180 .bt-live-shock{animation:none!important;opacity:0!important}
 .bt-live-180 .bt-live-core,.bt-live-180 .bt-live-number-stack,.bt-live-180 .bt-live-number-main,.bt-live-180 .bt-live-number-echo,.bt-live-180 .bt-live-impact-line,.bt-live-180 .bt-live-player,.bt-live-180 .bt-live-route,.bt-live-180 .bt-live-caption{animation:none!important;opacity:1!important;transform:none!important}
 .bt-live-180 .bt-live-number-echo{opacity:0!important}
}
