*{box-sizing:border-box}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:#111}
.scoreboard{width:min(calc(100vw - 32px),1920px);margin:16px auto;background:#fff;border-radius:16px;box-shadow:0 10px 30px rgba(16,24,40,.08);overflow:hidden;min-height:calc(100vh - 32px);display:flex;flex-direction:column}

/* Safari-spezifische Fixes für Browser-Menüleiste - nur min-height anpassen */
@supports (-webkit-touch-callout: none) {
  .scoreboard{min-height:calc(100vh - 60px)}
}
.header{display:flex}
.header .header-block{flex:1;display:flex;flex-direction:column;gap:6px;align-items:center;justify-content:center;padding:20px 28px}
.header .left{background:#ff5b37;color:#fff}
.header .right{background:#5b7dff;color:#fff}
.header .header-block.leader{position:relative}
.header .header-block.leader:after{content:"führt";position:absolute;bottom:6px;right:10px;background:rgba(255,255,255,.22);color:#fff;padding:4px 8px;border-radius:6px;font-weight:700;font-size:clamp(12px,1.2vw,16px);letter-spacing:.4px}
@keyframes pulseGlow{0%{box-shadow:0 0 0 0 rgba(255,215,0,.7)}70%{box-shadow:0 0 0 16px rgba(255,215,0,0)}100%{box-shadow:0 0 0 0 rgba(255,215,0,0)}}
.header .header-block.leader{animation:pulseGlow 2.4s ease-out infinite}
.score{font-size:clamp(58px,8vw,135px);font-weight:800;line-height:1}
.name{font-size:clamp(20px,2vw,36px);font-weight:600;opacity:.95}
.content{display:grid;grid-template-columns:1fr 1.1fr 1fr;gap:28px;padding:28px;flex:1;min-height:0}

/* Safari-spezifische Skalierungs-Fixes */
@supports (-webkit-touch-callout: none) {
  .content{gap:clamp(16px,3vw,32px);padding:clamp(16px,3vw,32px)}
  .center{min-height:0;overflow:hidden;display:flex;flex-direction:column;justify-content:center}
  .competitor{min-height:0;overflow:hidden}
  .photo{width:clamp(120px,15vw,280px);height:clamp(160px,20vw,360px)}
  .apparatus-symbol{width:clamp(80px,10vw,140px);height:clamp(80px,10vw,140px)}
  .apparatus-symbol svg{width:clamp(80px,10vw,140px);height:clamp(80px,10vw,140px)}
  .apparatus-symbol img{width:clamp(80px,10vw,140px);height:clamp(80px,10vw,140px)}
  .apparatus-symbol.boden img{width:clamp(100px,12vw,175px);height:clamp(100px,12vw,175px)}
}
.competitor{display:flex;flex-direction:column;align-items:center;justify-content:center}
.competitor-name{font-size:clamp(16px,1.8vw,24px);font-weight:700;color:#111;margin-bottom:8px;text-align:center}
.photo{width:clamp(176px,20vw,275px);height:clamp(231px,25vw,352px);border-radius:12px;object-fit:cover;background:#eef1f7}
.competitor.active{outline:6px solid #00b341; outline-offset:6px; border-radius:16px}
.active-badge{display:none;margin-top:8px;background:#00b341;color:#fff;padding:6px 10px;border-radius:8px;font-weight:700;font-size:clamp(12px,1.2vw,18px)}
.competitor.active .active-badge{display:inline-block}

/* Visual grouping: Two separate frames around inactive athlete and notes */
.competitor.inactive{outline:4px solid #4a90e2;outline-offset:6px;border-radius:16px}
.center.notes-for-left{outline:4px solid #4a90e2;outline-offset:6px;border-radius:16px}
.center.notes-for-right{outline:4px solid #4a90e2;outline-offset:6px;border-radius:16px}
.center{display:flex;flex-direction:column;gap:20px;align-items:center;justify-content:center}
.rating-label{font-size:clamp(16px,1.8vw,24px);font-weight:700;color:#111;margin-bottom:8px;text-align:center}
.labels,.values{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;width:100%}
.label{background:#f1f4fb;padding:8px 12px;border-radius:8px;text-align:center;font-weight:600;color:#475467;font-size:clamp(12px,1.1vw,18px)}
.value{background:#fff;border:1px solid #e6e8ee;padding:12px;border-radius:10px;text-align:center;font-size:clamp(24px,2.2vw,40px);font-weight:700}
.endnote-label{font-size:clamp(16px,1.8vw,24px);font-weight:700;color:#1e40af;text-align:center;margin-bottom:-8px}
.endnote{margin-top:0px;font-size:clamp(14px,1.4vw,20px);color:#475467;background:#e8f4fd;padding:8px 12px;border-radius:10px;border:2px solid #4a90e2}
.endnote strong{font-size:clamp(24px,2.4vw,40px);color:#1e40af;margin-left:6px}
.endnote span{display:none}

/* Geräte-Symbole */
.apparatus-symbol{width:120px;height:120px;margin:4px auto 4px;display:flex;align-items:center;justify-content:center;color:#4a90e2;background:none;border:none}
.apparatus-symbol svg{width:120px;height:120px;fill:currentColor}
.apparatus-symbol img{width:120px;height:120px;object-fit:contain}
.apparatus-symbol.boden img{width:150px;height:150px}

/* Portrait-Elemente standardmäßig verstecken */
.notes-row{display:none}

/* Portrait-spezifische Elemente standardmäßig verstecken */
.portrait-rating-section,
.portrait-inactive-competitor,
.portrait-center,
.portrait-active-competitor{display:none}

/* Mobile Portrait Layout */
@media (max-width:768px) and (orientation:portrait){
  .scoreboard{min-height:100vh;border-radius:0}
  .header{flex-direction:column;padding:8px}
  .header .header-block{padding:8px 12px;gap:6px}
  .score{font-size:clamp(36px,10vw,60px)}
  .name{font-size:clamp(14px,3vw,18px)}
  
  /* Portrait Layout: Aktiver Turner unten, bewerteter Turner + Wertung nebeneinander oben */
  .content{grid-template-columns:1fr;gap:8px;padding:8px;display:flex;flex-direction:column}
  
  /* Obere Reihe: Bewerteter Turner + Wertung nebeneinander */
  .portrait-rating-section{display:flex;gap:12px;align-items:stretch;margin-bottom:8px}
  .portrait-inactive-competitor{flex:0 0 auto;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100%}
  .portrait-center{flex:1;display:flex;flex-direction:column;gap:6px}
  
  .portrait-inactive-competitor .competitor-name{font-size:clamp(12px,2.5vw,16px);margin-bottom:4px;text-align:center}
  .portrait-inactive-competitor .photo{width:clamp(80px,20vw,120px);height:clamp(100px,25vw,150px);border-radius:8px;object-fit:cover}
  
  .portrait-center .rating-label{font-size:clamp(12px,2.5vw,16px);margin-bottom:4px;text-align:center}
  .portrait-center .apparatus-symbol{width:50px;height:50px;margin:0 auto 4px}
  .portrait-center .apparatus-symbol svg{width:50px;height:50px}
  .portrait-center .apparatus-symbol img{width:50px;height:50px;object-fit:contain}
  .portrait-center .apparatus-symbol.boden img{width:65px;height:65px}
  
  /* Labels und Werte nebeneinander im Portrait */
  .portrait-center .labels,.portrait-center .values{display:none}
  .portrait-center .notes-row{display:flex;justify-content:space-between;align-items:center;padding:4px 6px;background:#f1f4fb;border-radius:6px;margin:1px 0}
  .portrait-center .notes-row .label{background:none;padding:0;font-size:clamp(10px,2vw,14px);font-weight:600;color:#475467;margin-right:6px}
  .portrait-center .notes-row .value{background:none;border:none;padding:0;font-size:clamp(10px,2vw,14px);font-weight:700;color:#111}
  
  .portrait-center .endnote-label{display:none}
  .portrait-center .endnote{font-size:clamp(12px,2.5vw,16px);margin-top:4px;background:#e8f4fd;padding:6px 10px;border-radius:6px;border:2px solid #4a90e2;display:flex;align-items:center;justify-content:space-between}
  .portrait-center .endnote strong{font-size:clamp(12px,2.5vw,16px);color:#1e40af;margin-left:6px}
  .portrait-center .endnote span{display:inline;font-size:clamp(10px,2vw,14px);font-weight:600;color:#475467;margin-right:6px}
  
  /* Untere Reihe: Aktiver Turner */
  .portrait-active-competitor{display:flex;flex-direction:column;align-items:center;margin-top:8px}
  .portrait-active-competitor .competitor-name{font-size:clamp(14px,3vw,18px);margin-bottom:6px;text-align:center;font-weight:700}
  .portrait-active-competitor .photo{width:clamp(120px,30vw,180px);height:clamp(150px,37vw,220px);border-radius:10px}
  .portrait-active-competitor .active-badge{font-size:clamp(10px,2.5vw,14px);padding:4px 8px;margin-top:6px;background:#00b341;color:#fff;border-radius:6px;font-weight:700}
  
  /* Rahmen im Portrait-Modus anpassen */
  .portrait-inactive-competitor{outline:2px solid #4a90e2;outline-offset:2px;border-radius:8px;padding:4px}
  .portrait-center{outline:2px solid #4a90e2;outline-offset:2px;border-radius:8px;padding:4px}
  .portrait-active-competitor{outline:3px solid #00b341;outline-offset:3px;border-radius:10px;padding:6px}
  
  /* Zeige Portrait-Elemente im Portrait-Modus */
  .portrait-rating-section{display:flex}
  .portrait-inactive-competitor{display:flex}
  .portrait-center{display:flex}
  .portrait-active-competitor{display:flex}
  
  /* Verstecke normale Desktop-Layout Elemente im Portrait */
  .competitor{display:none}
  .center{display:none}
}

@media (max-width:900px) and (orientation:landscape){
  .content{grid-template-columns:1fr;}
  .photo{width:180px;height:180px}
  .notes-row{display:none}
}



