/* Live-Seiten (Eingang & Catering) · Full-HD, SGB schwarz/gelb */
:root { --gelb:#FEED00; --schwarz:#0F0F0F; }
* { box-sizing:border-box; }
html, body { margin:0; padding:0; height:100vh; overflow:hidden; background:var(--schwarz); color:#fff;
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; }

#app { position:fixed; top:0; left:0; right:0; bottom:112px; overflow:hidden; }

/* Kopf */
.lv-head { display:flex; align-items:center; gap:2vw; padding:3vh 4vw 0; }
.lv-head img.wappen { height:9vh; }
.lv-head .h { font-size:2.6vw; font-weight:800; line-height:1.05; }
.lv-head .h small { display:block; font-size:1.3vw; color:var(--gelb); font-weight:700; text-transform:uppercase; letter-spacing:.05em; }

/* Scoreboard */
.matchbox { display:flex; align-items:center; justify-content:center; gap:3vw; margin-top:3vh; padding:0 4vw; }
.team { display:flex; flex-direction:column; align-items:center; gap:1.4vh; width:30vw; }
.team img { height:22vh; width:auto; object-fit:contain; }
.team .tn { font-size:2vw; font-weight:800; text-align:center; line-height:1.1; }
.center { text-align:center; min-width:22vw; }
.score { font-size:9vw; font-weight:900; line-height:1; letter-spacing:.02em; }
.score .sep { color:var(--gelb); margin:0 1.5vw; }
.vs { font-size:5vw; font-weight:900; color:var(--gelb); }
.kick { font-size:2vw; font-weight:700; margin-top:1vh; }
.badge-live { display:inline-block; margin-top:1.5vh; background:#e2231a; color:#fff; font-weight:900; font-size:1.6vw;
  padding:.4vh 1.6vw; border-radius:99px; letter-spacing:.1em; animation:pulse 1.4s infinite; }
@keyframes pulse { 0%,100%{opacity:1} 50%{opacity:.55} }

.welcome-line { text-align:center; font-size:2.4vw; font-weight:800; margin-top:3vh; padding:0 6vw; }
.welcome-line b { color:var(--gelb); }

/* Tagesspiele */
.today { position:absolute; left:0; right:0; bottom:2vh; padding:0 4vw; }
.today h3 { font-size:1.3vw; text-transform:uppercase; letter-spacing:.08em; color:var(--gelb); margin:0 0 1vh; }
.today .row { display:flex; gap:1.2vw; flex-wrap:wrap; }
.today .g { background:#1a1a1a; border:1px solid #2c2c2c; border-radius:12px; padding:1vh 1.4vw; font-size:1.3vw; font-weight:600; }
.today .g .t { color:var(--gelb); font-weight:800; margin-right:.6vw; }
.today .g .sc { color:#fff; font-weight:900; margin-left:.6vw; }
.today .g.islive { border-color:#e2231a; }

/* generische Begrüßung */
.hero { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:0 8vw; }
.hero h1 { font-size:4.5vw; font-weight:900; color:var(--gelb); margin:0 0 2vh; }
.hero p { font-size:2vw; margin:.4vh 0; }

/* Quelle handball.net */
.source { position:fixed; right:2vw; bottom:calc(112px + 1.4vh); font-size:1vw; color:#cfcfcf; display:flex; align-items:center; gap:.6vw; z-index:20; }
.source img { height:2.2vh; width:auto; }


/* Catering: Foto + Spotlight */
#photo { position:absolute; inset:0; background:#000 center/cover no-repeat; transition:opacity .8s, transform 1.2s ease; }
#mask { position:absolute; inset:0; background:radial-gradient(circle at var(--sx,50%) var(--sy,50%), rgba(0,0,0,0) 12vw, rgba(0,0,0,.82) 26vw); opacity:0; transition:opacity .6s; }
#mask.on { opacity:1; }
.lower3 { position:absolute; left:5vw; bottom:4vh; opacity:0; transform:translateY(20px); transition:opacity .5s, transform .5s; }
.lower3.on { opacity:1; transform:none; }
.lower3 .num { display:inline-block; background:var(--gelb); color:#111; font-weight:900; font-size:3vw; padding:.2vh 1.4vw; border-radius:10px; }
.lower3 .nm { font-size:3.4vw; font-weight:900; margin-top:1vh; }
.lower3 .po { font-size:1.8vw; font-weight:700; color:var(--gelb); }

/* Catering: Live-Stand Overlay */
.scorepill { position:absolute; top:3vh; right:3vw; background:rgba(0,0,0,.72); border:2px solid var(--gelb); border-radius:16px;
  padding:1.4vh 1.8vw; display:flex; align-items:center; gap:1.2vw; z-index:15; }
.scorepill img { height:5vh; }
.scorepill .sc { font-size:3vw; font-weight:900; }
.scorepill .sc .sep { color:var(--gelb); margin:0 .6vw; }
.scorepill .lv { background:#e2231a; color:#fff; font-weight:900; font-size:1vw; padding:.2vh .8vw; border-radius:99px; letter-spacing:.08em; }