/* ===================================================
   Grammtrinken Arena v0.8
   Build 12 – Mobile Feinschliff, Ziel-Impuls & Arena-Zufall
=================================================== */

*{margin:0;padding:0;box-sizing:border-box;}

body{
    background:radial-gradient(circle at top,#2b2b2b 0%,#111 55%,#050505 100%);
    color:#fff;
    font-family:Arial,Helvetica,sans-serif;
    min-height:100vh;
    display:flex;
    justify-content:center;
    align-items:center;
    padding:30px;
}

.arena{
    width:620px;
    max-width:95%;
    background:#1a1a1a;
    border:2px solid #555;
    border-radius:20px;
    overflow:hidden;
    box-shadow:0 20px 50px rgba(0,0,0,.70),0 0 40px rgba(255,0,0,.08);
}

.arena-header{
    padding:20px;
    text-align:center;
    border-bottom:1px solid #333;
    position:relative;
}

.logo h1{font-size:2rem;letter-spacing:4px;}
.subtitle{display:block;margin-top:6px;color:#ff4b4b;letter-spacing:6px;font-size:.95rem;}
.version{position:absolute;right:18px;top:18px;color:#888;font-size:.82rem;}

.hidden{display:none !important;}

button{
    padding:12px 22px;
    border:none;
    border-radius:8px;
    background:#c40000;
    color:white;
    font-size:1rem;
    cursor:pointer;
    transition:.25s;
}
button:hover{background:#e00000;transform:translateY(-2px);}
button:disabled{opacity:.45;cursor:not-allowed;transform:none;}
.secondary-button{background:#333;}
.secondary-button:hover{background:#444;}

/* PLAYER SETUP */
.player-setup,.mode-setup{
    padding:32px 25px 28px;
    border-bottom:1px solid #333;
    text-align:center;
}
.section-kicker{margin-bottom:6px;color:#ff5555;font-size:.78rem;font-weight:bold;letter-spacing:3px;}
.player-setup h2,.mode-setup h2{margin-bottom:6px;font-size:1.6rem;}
.player-hint{margin-bottom:22px;color:#999;font-size:.92rem;}
.player-list{display:flex;flex-direction:column;gap:10px;max-width:460px;margin:0 auto 20px;}
.player-row{display:grid;grid-template-columns:36px minmax(0,1fr) 38px;align-items:center;gap:10px;}
.player-number{display:flex;align-items:center;justify-content:center;width:34px;height:34px;border:1px solid #555;border-radius:50%;color:#ff5b5b;font-weight:bold;}
.player-name{width:100%;min-width:0;padding:10px 12px;border:1px solid #555;border-radius:7px;background:#101010;color:#fff;font-size:1rem;}
.player-name:focus{outline:2px solid rgba(255,75,75,.5);outline-offset:1px;}
.remove-player{width:36px;height:36px;padding:0;border:1px solid #555;background:#242424;color:#ccc;font-size:1.45rem;line-height:1;}
.remove-player:hover{background:#3a3a3a;color:#fff;transform:none;}
.player-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;}
#addPlayerButton{background:#333;}
#addPlayerButton:hover{background:#444;}

/* MODE SETUP */
.mode-options{display:grid;grid-template-columns:1fr 1fr;gap:14px;max-width:520px;margin:0 auto 20px;}
.mode-card{display:flex;flex-direction:column;align-items:flex-start;gap:7px;min-height:120px;padding:18px;text-align:left;background:#202020;border:1px solid #444;}
.mode-card:hover{background:#282828;transform:none;}
.mode-card.selected{border-color:#d34a4a;background:#2a1d1d;box-shadow:inset 0 0 0 1px rgba(255,80,80,.2),0 0 18px rgba(255,40,40,.08);}
.mode-title{font-weight:bold;font-size:1.05rem;color:#fff;}
.mode-description{font-size:.9rem;line-height:1.4;color:#b7b7b7;}
.prepared-players{display:flex;justify-content:center;align-items:center;gap:8px;flex-wrap:wrap;max-width:520px;margin:0 auto 22px;padding:12px;border-top:1px solid #333;border-bottom:1px solid #333;}
.prepared-label{color:#888;font-size:.82rem;text-transform:uppercase;letter-spacing:1px;}
.mode-actions{margin-top:4px;}

/* ACTIVE PLAYERS */
.active-players{display:flex;align-items:center;justify-content:center;gap:8px;flex-wrap:wrap;padding:14px 20px;border-bottom:1px solid #333;background:#151515;}
.player-chip{padding:6px 10px;border:1px solid #454545;border-radius:999px;background:#242424;color:#f2f2f2;font-size:.9rem;transition:.25s;}
.player-chip.current{border-color:#ff5555;background:#351d1d;box-shadow:0 0 12px rgba(255,70,70,.18);}

/* ARENA DISPLAY */
.arena-display{padding:28px 25px 24px;text-align:center;}
.game-status-line{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:12px;color:#aaa;font-size:.86rem;text-transform:uppercase;letter-spacing:1.5px;}
.round-counter{color:#f0f0f0;font-weight:bold;}
.mode-indicator{color:#ff6868;}
.current-player{margin-bottom:16px;font-size:1.35rem;font-weight:bold;letter-spacing:.5px;}
.display-frame{position:relative;background:#090909;border:4px solid #3b3b3b;border-radius:18px;padding:24px 20px 18px;box-shadow:inset 0 0 20px rgba(255,0,0,.08),0 0 20px rgba(255,0,0,.10);}
.display-label{position:absolute;top:10px;left:14px;color:#777;font-size:.7rem;letter-spacing:2px;}
#display{color:#ff3d3d;font-size:6rem;font-weight:bold;letter-spacing:8px;text-align:center;text-shadow:0 0 2px rgba(255,80,80,.9),0 0 8px rgba(255,40,40,.45);animation:breathe 3s ease-in-out infinite;}
.display-unit{margin-top:-8px;color:#8d8d8d;font-size:.95rem;}
#message{margin-top:18px;color:#d8d8d8;font-size:1.08rem;min-height:28px;}

/* RESULT ENTRY */
.result-entry{max-width:430px;margin:22px auto 0;padding:16px;border:1px solid #383838;border-radius:12px;background:#202020;text-align:left;}
.result-entry label{display:block;margin-bottom:8px;color:#aaa;font-size:.82rem;text-transform:uppercase;letter-spacing:1px;}
.result-input-row{display:grid;grid-template-columns:minmax(0,110px) 22px 1fr;align-items:center;gap:8px;}
.result-input-row input{width:100%;padding:11px 10px;border:1px solid #555;border-radius:7px;background:#0f0f0f;color:#fff;font-size:1.2rem;text-align:center;}
.result-input-row input:focus{outline:2px solid rgba(255,75,75,.5);outline-offset:1px;}
.result-unit{color:#aaa;}
.result-input-row button{padding:11px 14px;}

/* RESULT CARD */
.result-card{max-width:500px;margin:22px auto 0;padding:18px;border:1px solid #414141;border-radius:14px;background:#202020;}
.result-player{margin-bottom:14px;color:#fff;font-size:1.2rem;font-weight:bold;}
.result-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.result-grid div{padding:10px 8px;border-radius:8px;background:#151515;}
.result-grid span{display:block;margin-bottom:5px;color:#888;font-size:.75rem;text-transform:uppercase;letter-spacing:.8px;}
.result-grid strong{font-size:1.25rem;color:#fff;}
.exact-message{margin-top:16px;padding-top:14px;border-top:1px solid #454545;color:#ff5656;font-size:1.8rem;font-weight:bold;letter-spacing:3px;}

/* BUILD 8.1 – FÜHRUNG & ERGEBNISÜBERSICHT */
.player-chip.leader{
    border-color:#f0c84b;
    background:#2b2819;
    box-shadow:0 0 12px rgba(240,200,75,.34),0 0 28px rgba(240,200,75,.20);
    animation:leaderGlow 2.4s ease-in-out infinite;
}
.player-chip.current.leader{
    /* Während eines laufenden Versuchs bleibt ROT das Signal "ist dran". */
    border-color:#ff5555;
    background:#351d1d;
    box-shadow:0 0 12px rgba(255,70,70,.22),0 0 22px rgba(240,200,75,.14);
}

.standings-panel{
    max-width:520px;
    margin:22px auto 0;
    padding:18px;
    border:1px solid #414141;
    border-radius:14px;
    background:#181818;
    text-align:left;
}
.standings-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:16px;
    padding-bottom:13px;
    margin-bottom:10px;
    border-bottom:1px solid #333;
}
.standings-kicker{color:#ff6262;font-size:.72rem;font-weight:bold;letter-spacing:2px;}
.standings-head h3{margin-top:4px;font-size:1.15rem;}
.standings-note{color:#888;font-size:.78rem;text-align:right;max-width:170px;line-height:1.35;}
.standings-list{display:flex;flex-direction:column;gap:7px;}
.standing-row{
    display:grid;
    grid-template-columns:34px minmax(0,1fr) auto;
    align-items:center;
    gap:10px;
    padding:9px 10px;
    border:1px solid #303030;
    border-radius:9px;
    background:#111;
}
.standing-row.is-leader{border-color:#6d6031;background:#17150f;}
.standing-place{color:#777;font-weight:bold;text-align:center;}
.standing-name{font-weight:bold;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.standing-total{color:#f0f0f0;font-weight:bold;}
.standing-total small{color:#777;font-size:.72rem;font-weight:normal;margin-left:3px;}

@keyframes leaderGlow{
    0%,100%{box-shadow:0 0 10px rgba(240,200,75,.25),0 0 22px rgba(240,200,75,.12);}
    50%{box-shadow:0 0 18px rgba(240,200,75,.52),0 0 38px rgba(240,200,75,.28);}
}

/* BUILD 9 – SPIELABSCHLUSS & SIEGER */
.winner-panel{
    max-width:520px;
    margin:22px auto 0;
    padding:22px 18px;
    border:1px solid #6d6031;
    border-radius:14px;
    background:radial-gradient(circle at top,#28230f 0%,#18160f 58%,#111 100%);
    text-align:center;
    box-shadow:0 0 18px rgba(240,200,75,.18),0 0 42px rgba(240,200,75,.10);
}
.winner-kicker{color:#f0c84b;font-size:.72rem;font-weight:bold;letter-spacing:3px;}
.winner-icon{margin:10px 0 4px;font-size:2.7rem;filter:drop-shadow(0 0 10px rgba(240,200,75,.35));}
.winner-panel h2{font-size:1.45rem;margin-bottom:4px;}
.winner-name{font-size:1.85rem;font-weight:bold;color:#f4d76b;text-shadow:0 0 10px rgba(240,200,75,.28);}
.winner-score{margin-top:8px;color:#cfc7a5;font-size:.95rem;}

.controls{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;padding:0 25px 25px;}

/* BUILD 9.1 – EINHEITLICHE FELDBREITE & FINAL */
/* Die zentralen Arena-Felder teilen sich dieselbe optische Breite. */
.display-frame,
.result-entry,
.result-card,
.standings-panel,
.winner-panel{
    width:100%;
    max-width:520px;
    margin-left:auto;
    margin-right:auto;
}

.current-player,
#message{
    width:100%;
    max-width:520px;
    margin-left:auto;
    margin-right:auto;
}

.display-frame.final-state{
    border-color:#6d6031;
    background:radial-gradient(circle at center,#211e12 0%,#0d0d0b 68%,#090909 100%);
    box-shadow:inset 0 0 24px rgba(240,200,75,.09),0 0 26px rgba(240,200,75,.14);
}
.display-frame.final-state .display-label{
    color:#a99550;
}
.display-frame.final-state #display{
    color:#f0c84b;
    font-size:4.15rem;
    letter-spacing:10px;
    text-shadow:0 0 4px rgba(244,215,107,.75),0 0 18px rgba(240,200,75,.30);
    animation:finalBreathe 3.2s ease-in-out infinite;
}
@keyframes finalBreathe{
    0%,100%{opacity:.88;text-shadow:0 0 4px rgba(244,215,107,.55),0 0 16px rgba(240,200,75,.22);}
    50%{opacity:1;text-shadow:0 0 6px rgba(244,215,107,.88),0 0 25px rgba(240,200,75,.38);}
}

/* SETTINGS */
.settings{margin:0 25px 25px;padding:20px;background:#252525;border-radius:12px;border:1px solid #3c3c3c;}
.settings h2{text-align:center;margin-bottom:20px;color:#ff5555;}
.setting{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;}
.setting input,.setting select{width:120px;text-align:center;padding:7px 8px;font-size:1rem;color:#111;background:#fff;border:1px solid #aaa;border-radius:5px;}
.settingButtons{display:flex;justify-content:center;gap:12px;margin-top:20px;}

footer{border-top:1px solid #333;text-align:center;padding:15px;color:#777;font-size:.9rem;}

.flash{animation:flash .65s ease;}
@keyframes flash{0%{transform:scale(.90);opacity:.35;}35%{transform:scale(1.12);text-shadow:0 0 4px #ff5050,0 0 12px #ff4040,0 0 20px #ff1010;}100%{transform:scale(1);}}
@keyframes breathe{0%{opacity:.88;}50%{opacity:1;}100%{opacity:.88;}}

@media (max-width:600px){
    body{padding:12px;}
    .arena{max-width:100%;}
    .player-setup,.mode-setup,.arena-display{padding-left:16px;padding-right:16px;}
    .mode-options{grid-template-columns:1fr;}
    .mode-actions,.player-actions{flex-direction:column;}
    .mode-actions button,.player-actions button{width:100%;}
    #display{font-size:4.7rem;}
    .display-frame.final-state #display{font-size:3.15rem;letter-spacing:7px;}
    .result-input-row{grid-template-columns:90px 20px 1fr;}
    .result-grid{grid-template-columns:1fr;}
    .game-status-line{align-items:flex-start;flex-direction:column;gap:5px;}
}


/* BUILD 10 – REVANCHE & NEUES SPIEL */
.final-actions{
    width:100%;
    max-width:520px;
    margin:18px auto 0;
    display:flex;
    justify-content:center;
    gap:12px;
    flex-wrap:wrap;
}
.final-actions.hidden{display:none;}
.final-actions button{min-width:150px;}
.rematch-button{
    background:#8b6e12;
    border:1px solid #d6b64a;
    color:#fff7cf;
    box-shadow:0 0 14px rgba(240,200,75,.14);
}
.rematch-button:hover{
    background:#a78418;
    box-shadow:0 0 20px rgba(240,200,75,.22);
}

@media (max-width:600px){
    .final-actions{flex-direction:column;}
    .final-actions button{width:100%;}
}


/* BUILD 11 – EXAKT ERLEBNIS */
.player-chip .exact-badge{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    margin-left:6px;
    color:#f4d76b;
    font-size:.78rem;
    font-weight:bold;
    letter-spacing:0;
    filter:drop-shadow(0 0 5px rgba(240,200,75,.35));
}

.display-frame.exact-state{
    border-color:#f1d26a;
    background:radial-gradient(circle at center,#312a12 0%,#12100a 60%,#080808 100%);
    box-shadow:inset 0 0 32px rgba(255,245,190,.12),0 0 22px rgba(255,232,130,.30),0 0 52px rgba(240,200,75,.18);
    animation:exactFramePulse 1.8s ease-in-out infinite;
}
.display-frame.exact-state .display-label{color:#d7c170;}
.display-frame.exact-state #display{
    color:#fff4bc;
    font-size:4.35rem;
    letter-spacing:9px;
    text-shadow:0 0 4px rgba(255,255,255,.96),0 0 14px rgba(255,239,166,.74),0 0 34px rgba(240,200,75,.52);
    animation:exactWordBreath 1.6s ease-in-out infinite;
}

.exact-celebration{
    position:relative;
    width:100%;
    max-width:520px;
    margin:18px auto 0;
    overflow:hidden;
    padding:22px 18px 20px;
    border:1px solid #877632;
    border-radius:14px;
    background:radial-gradient(circle at 50% 0%,rgba(255,239,166,.16),rgba(28,24,12,.96) 48%,#10100d 100%);
    box-shadow:0 0 22px rgba(240,200,75,.17);
    text-align:center;
}
.exact-celebration.play{animation:exactImpact .72s cubic-bezier(.18,.84,.28,1);}
.exact-burst{
    position:absolute;
    inset:-45%;
    pointer-events:none;
    opacity:.34;
    background:repeating-conic-gradient(from 0deg,rgba(255,243,184,.20) 0deg 3deg,transparent 3deg 16deg);
    animation:exactBurst 5s linear infinite;
}
.exact-kicker,.exact-player-name,.exact-values,.exact-zero{position:relative;z-index:1;}
.exact-kicker{
    color:#f2d86f;
    font-size:1.22rem;
    font-weight:900;
    letter-spacing:4px;
    text-shadow:0 0 4px rgba(255,255,255,.65),0 0 15px rgba(255,230,120,.48),0 0 30px rgba(240,200,75,.24);
}
.exact-player-name{
    margin-top:12px;
    color:#fff;
    font-size:1.75rem;
    font-weight:900;
    letter-spacing:1.5px;
    text-shadow:0 0 10px rgba(255,255,255,.16);
}
.exact-values{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:13px;color:#d2caac;}
.exact-values strong{color:#fff;font-size:1.18rem;}
.exact-values span{color:#d9bd57;font-size:1.2rem;}
.exact-zero{margin-top:10px;color:#f2d86f;font-size:.88rem;font-weight:bold;letter-spacing:2px;}

@keyframes exactImpact{
    0%{transform:scale(.80);opacity:.05;filter:brightness(2.2);}
    42%{transform:scale(1.045);opacity:1;filter:brightness(1.45);}
    100%{transform:scale(1);opacity:1;filter:brightness(1);}
}
@keyframes exactFramePulse{
    0%,100%{box-shadow:inset 0 0 28px rgba(255,245,190,.10),0 0 18px rgba(255,232,130,.24),0 0 42px rgba(240,200,75,.13);}
    50%{box-shadow:inset 0 0 38px rgba(255,245,190,.16),0 0 28px rgba(255,232,130,.40),0 0 62px rgba(240,200,75,.24);}
}
@keyframes exactWordBreath{
    0%,100%{opacity:.90;transform:scale(.985);}
    50%{opacity:1;transform:scale(1.015);}
}
@keyframes exactBurst{to{transform:rotate(360deg);}}

@media (max-width:600px){
    .display-frame.exact-state #display{font-size:3.25rem;letter-spacing:6px;}
    .exact-kicker{font-size:1rem;letter-spacing:3px;}
    .exact-player-name{font-size:1.5rem;}
}


/* BUILD 11.1 – kurze Ruhe vor EXAKT */
.display-frame.exact-prelude{
    border-color:#2b2b2b;
    background:#050505;
    box-shadow:inset 0 0 30px rgba(0,0,0,.92),0 0 10px rgba(0,0,0,.55);
}
.display-frame.exact-prelude .display-label,
.display-frame.exact-prelude #display,
.display-frame.exact-prelude .display-unit{
    opacity:0;
}
.controls.exact-lock{
    pointer-events:none;
    opacity:.42;
}


/* BUILD 11.2 – Perfekter Treffer klarer, Spielername stärker, Treffer als einzelne Ziele */


/* BUILD 11.4 – Layout-Feinschliff */
.result-round-label{
    margin-bottom:8px;
    text-align:left;
    color:#ff6262;
    font-size:.72rem;
    font-weight:bold;
    letter-spacing:2px;
}
.result-player{margin-bottom:12px;}
/* Ergebnis steht jetzt direkt im Ergebnisfeld; der separate Zwischenraum entfällt. */
.result-card{margin-top:14px;}
/* EXAKT und FINAL bekommen denselben ruhigen Abstand zum nachfolgenden Hauptfeld. */
.exact-celebration,
.winner-panel{margin-top:18px;}


/* ===================================================
   BUILD 12.1 – MOBILE, ZIEL-GLOW & KOMPAKTE TREFFER
   =================================================== */

/*
 * Die Ziffer bleibt bewusst knackscharf. Der sichtbare Impuls
 * entsteht als Lichtfläche hinter der Zahl und nicht durch
 * weichere/unschärfere Ziffern.
 */
.display-frame::after{
    content:"";
    position:absolute;
    left:50%;
    top:50%;
    width:58%;
    height:58%;
    transform:translate(-50%,-50%) scale(.72);
    border-radius:50%;
    background:radial-gradient(circle, rgba(255,50,50,.34) 0%, rgba(210,0,0,.18) 38%, rgba(150,0,0,0) 72%);
    opacity:0;
    pointer-events:none;
    z-index:0;
}
.display-frame > *{position:relative;z-index:1;}
.display-frame.target-glow::after{
    animation:targetHalo 2.25s ease-in-out 1;
}
#display.target-highlight{
    /* Nur ein minimales Skalieren – keine zusätzliche Unschärfe. */
    animation:targetNumberAccent 2.25s ease-in-out 1;
}
@keyframes targetHalo{
    0%{opacity:0;transform:translate(-50%,-50%) scale(.70);}
    15%{opacity:.95;transform:translate(-50%,-50%) scale(1.08);}
    34%{opacity:.24;transform:translate(-50%,-50%) scale(.88);}
    50%{opacity:.78;transform:translate(-50%,-50%) scale(1.02);}
    68%{opacity:.18;transform:translate(-50%,-50%) scale(.91);}
    82%{opacity:.60;transform:translate(-50%,-50%) scale(.98);}
    100%{opacity:0;transform:translate(-50%,-50%) scale(1.08);}
}
@keyframes targetNumberAccent{
    0%,100%{transform:scale(1);}
    15%{transform:scale(1.035);}
    34%{transform:scale(1);}
    50%{transform:scale(1.022);}
    68%{transform:scale(1);}
    82%{transform:scale(1.012);}
}

@media (max-width:600px){
    .arena-header{padding:18px 12px 20px;}
    .logo{padding:0 54px;}
    .logo h1{
        font-size:clamp(1.28rem,7.2vw,1.9rem);
        letter-spacing:clamp(1.5px,1.2vw,4px);
        white-space:nowrap;
    }
    .subtitle{
        font-size:.78rem;
        letter-spacing:clamp(3px,1.5vw,6px);
    }
    .version{right:10px;top:8px;font-size:.68rem;}
    .standing-name{font-size:.92rem;}
}

@media (max-width:390px){
    .logo{padding:0 38px;}
    .logo h1{font-size:1.2rem;letter-spacing:1.4px;}
    .subtitle{font-size:.7rem;letter-spacing:3px;}
}

/* ===================================================
   BUILD 12.2 – MAGENTA-ZIELSCHEIN & LABEL-KORREKTUR
   =================================================== */

/*
 * Vergleichsvariante: Nur der Schein hinter der Zielzahl wird Magenta.
 * Die Ziffer selbst bleibt unverändert rot, scharf und kontrastreich.
 */
.display-frame::after{
    background:radial-gradient(
        circle,
        rgba(255,0,190,.42) 0%,
        rgba(220,0,160,.25) 38%,
        rgba(150,0,120,.10) 56%,
        rgba(120,0,100,0) 74%
    );
}

/*
 * Build 12.1 setzte alle direkten Kinder der Display-Box auf position:relative,
 * wodurch ZIEL/ABSCHLUSS unbeabsichtigt zentriert wurden.
 * Diese Labels bleiben wieder oben links wie vor dem Glow-Umbau.
 */
.display-frame > .display-label{
    position:absolute;
    top:10px;
    left:14px;
    right:auto;
    width:auto;
    text-align:left;
    z-index:2;
}

/* ===================================================
   BUILD 13 – SPIELERHISTORIE & ARENA-BILANZ
   =================================================== */
.statistics-overlay{
    position:fixed;
    inset:0;
    z-index:50;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:18px;
    background:rgba(0,0,0,.78);
    backdrop-filter:blur(4px);
}
.statistics-panel{
    width:min(620px,100%);
    max-height:88vh;
    overflow:auto;
    padding:22px;
    border:1px solid #545454;
    border-radius:18px;
    background:radial-gradient(circle at top,#272727 0%,#171717 62%,#101010 100%);
    box-shadow:0 22px 70px rgba(0,0,0,.72),0 0 34px rgba(255,0,190,.09);
}
.statistics-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-start;
    gap:16px;
    padding-bottom:15px;
    border-bottom:1px solid #383838;
}
.statistics-head h2{font-size:1.55rem;margin-bottom:4px;}
.statistics-head p{color:#8f8f8f;font-size:.88rem;}
.stats-close{
    flex:0 0 auto;
    width:38px;
    height:38px;
    padding:0;
    border:1px solid #555;
    border-radius:50%;
    background:#272727;
    color:#ddd;
    font-size:1.45rem;
    line-height:1;
}
.stats-close:hover{background:#383838;transform:none;}
.stats-profiles{
    display:flex;
    gap:8px;
    flex-wrap:wrap;
    margin:16px 0;
}
.stats-profile-button{
    padding:8px 12px;
    border:1px solid #494949;
    border-radius:999px;
    background:#242424;
    color:#eee;
    font-size:.88rem;
}
.stats-profile-button:hover{background:#303030;transform:none;}
.stats-profile-button.selected{
    border-color:#d34a9f;
    background:#32182b;
    box-shadow:0 0 16px rgba(255,0,190,.14);
}
.stats-empty{
    padding:28px 10px;
    color:#8e8e8e;
    text-align:center;
}
.stats-detail{
    padding-top:4px;
}
.stats-player-head{
    display:flex;
    align-items:baseline;
    justify-content:space-between;
    gap:14px;
    margin-bottom:12px;
}
.stats-player-label{color:#d65aa9;font-size:.7rem;font-weight:bold;letter-spacing:2px;}
.stats-player-head strong{font-size:1.5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.stats-grid{
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:9px;
}
.stats-grid div{
    min-height:76px;
    padding:12px;
    border:1px solid #343434;
    border-radius:10px;
    background:#121212;
}
.stats-grid span,
.stats-history span{
    display:block;
    margin-bottom:7px;
    color:#888;
    font-size:.72rem;
    text-transform:uppercase;
    letter-spacing:.8px;
}
.stats-grid strong{font-size:1.35rem;color:#fff;}
.stats-history{
    margin-top:9px;
    padding:13px 12px;
    border:1px solid #393939;
    border-radius:10px;
    background:#171717;
}
.stats-history strong{font-size:1.08rem;color:#f0d06b;letter-spacing:.5px;}

@media (max-width:600px){
    .statistics-overlay{padding:10px;align-items:flex-start;overflow:auto;}
    .statistics-panel{margin-top:10px;max-height:none;padding:17px;}
    .stats-grid{grid-template-columns:1fr 1fr;}
    .stats-grid div{min-height:72px;padding:10px;}
    .stats-grid strong{font-size:1.18rem;}
}

@media (max-width:390px){
    .stats-grid{grid-template-columns:1fr;}
}


/* ===================================================
   BUILD 14 – EXAKT VISUAL UPDATE
   Visuell an QUICK START · Schritt 6 angeglichen.
   Spiellogik und Statistik aus Build 13 bleiben unverändert.
   =================================================== */

/* Nach der kurzen Ruhephase übernimmt die EXAKT-Karte die zentrale Bühne. */
.display-frame.exact-visual-hidden{
    display:none;
}

.exact-celebration{
    position:relative;
    width:100%;
    max-width:520px;
    min-height:330px;
    margin:4px auto 0;
    padding:24px 18px 18px;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(255,24,157,.78);
    border-radius:16px;
    background:
        radial-gradient(circle at 50% 48%,rgba(255,24,157,.19) 0%,rgba(91,8,61,.10) 38%,rgba(7,7,10,.98) 72%),
        #07070a;
    box-shadow:
        inset 0 0 62px rgba(255,24,157,.09),
        0 0 18px rgba(255,24,157,.22),
        0 0 42px rgba(255,24,157,.09);
    text-align:center;
}

/* Rotierende Arena-Strahlen wie im QUICK START – sichtbar, aber hinter der Schrift. */
.exact-burst{
    position:absolute;
    inset:-38%;
    pointer-events:none;
    opacity:.68;
    background:
        repeating-conic-gradient(
            from 0deg,
            rgba(255,24,157,.48) 0deg 2deg,
            rgba(255,255,255,.08) 2deg 2.6deg,
            transparent 2.6deg 12deg
        );
    -webkit-mask:radial-gradient(circle,transparent 0 22%,#000 32% 78%,transparent 88%);
    mask:radial-gradient(circle,transparent 0 22%,#000 32% 78%,transparent 88%);
    filter:drop-shadow(0 0 5px rgba(255,24,157,.34));
    animation:exactBurst 8s linear infinite;
}

.exact-kicker,
.exact-player-name,
.exact-word,
.exact-values,
.exact-zero{
    position:relative;
    z-index:2;
}

.exact-kicker{
    margin:0;
    color:#fff;
    font-size:.82rem;
    font-weight:950;
    letter-spacing:3px;
    text-shadow:0 0 8px rgba(255,255,255,.20);
}

.exact-player-name{
    margin-top:8px;
    color:#f0dbe9;
    font-size:1.42rem;
    font-weight:900;
    letter-spacing:.8px;
    text-shadow:0 0 10px rgba(255,24,157,.18);
}

/* Der zentrale Schriftzug entspricht der QUICK-START-Sprache:
   kondensiert, dunkles Magenta-Grau innen, scharfe helle Kontur. */
.exact-word{
    margin:22px 0 13px;
    font-family:
        "Arial Narrow",
        "Liberation Sans Narrow",
        "DejaVu Sans Condensed",
        "Helvetica Neue Condensed",
        Arial,sans-serif;
    font-stretch:condensed;
    font-size:clamp(4.9rem,15vw,7.3rem);
    line-height:.82;
    font-weight:950;
    letter-spacing:-.055em;
    white-space:nowrap;
    color:#4e2540;
    -webkit-text-stroke:2px #fff1fa;
    text-shadow:
        0 0 2px rgba(255,255,255,.96),
        0 0 7px rgba(255,244,252,.88),
        0 0 14px rgba(255,24,157,.96),
        0 0 28px rgba(255,0,150,.68);
    transform:scaleX(.84);
    transform-origin:center;
}

.exact-values{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:12px;
    margin:0;
    color:#fff;
}

.exact-values strong{
    color:#fff;
    font-size:1.24rem;
    font-weight:950;
}

.exact-values span{
    color:#ff189d;
    font-size:1.34rem;
    font-weight:900;
}

.exact-zero{
    width:min(78%,330px);
    margin-top:10px;
    padding-top:9px;
    border-top:2px solid #ff189d;
    color:#fff;
    font-size:.92rem;
    font-weight:950;
    letter-spacing:1.4px;
}

.exact-zero-value{
    color:#ffd35a;
}

/* Der Impact bleibt, wird aber farblich in die neue Magenta-Sprache übersetzt. */
.exact-celebration.play{
    animation:exactImpact14 .72s cubic-bezier(.18,.84,.28,1);
}

@keyframes exactImpact14{
    0%{transform:scale(.84);opacity:.06;filter:brightness(2.2);}
    42%{transform:scale(1.035);opacity:1;filter:brightness(1.42);}
    100%{transform:scale(1);opacity:1;filter:brightness(1);}
}

@media (max-width:600px){
    .exact-celebration{
        min-height:290px;
        padding:20px 12px 16px;
    }

    .exact-kicker{
        font-size:.72rem;
        letter-spacing:2.2px;
    }

    .exact-player-name{
        font-size:1.2rem;
        margin-top:7px;
    }

    .exact-word{
        margin:19px 0 11px;
        font-size:clamp(4.25rem,21vw,5.7rem);
        transform:scaleX(.80);
    }

    .exact-values strong{
        font-size:1.08rem;
    }

    .exact-zero{
        width:84%;
        font-size:.82rem;
    }
}

@media (max-width:390px){
    .exact-word{
        font-size:4.45rem;
        transform:scaleX(.76);
    }
}


/* ===================================================
   BUILD 15 – FINAL VISUAL UPDATE
   Goldene Schwester der EXAKT-Bühne.
   =================================================== */

.winner-panel{
    position:relative;
    width:100%;
    max-width:520px;
    min-height:330px;
    margin:18px auto 0;
    padding:24px 18px 20px;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(255,211,90,.82);
    border-radius:16px;
    background:
        radial-gradient(circle at 50% 48%,rgba(255,196,40,.18) 0%,rgba(96,67,10,.10) 40%,rgba(8,8,8,.98) 73%),
        #080808;
    box-shadow:
        inset 0 0 64px rgba(255,208,72,.08),
        0 0 20px rgba(255,211,90,.24),
        0 0 44px rgba(255,196,40,.10);
    text-align:center;
}

.final-burst{
    position:absolute;
    inset:-38%;
    z-index:0;
    pointer-events:none;
    opacity:.68;
    background:
        repeating-conic-gradient(
            from 0deg,
            rgba(255,210,70,.48) 0deg 2deg,
            rgba(255,255,255,.08) 2deg 2.6deg,
            transparent 2.6deg 12deg
        );
    -webkit-mask:radial-gradient(circle,transparent 0 22%,#000 32% 78%,transparent 88%);
    mask:radial-gradient(circle,transparent 0 22%,#000 32% 78%,transparent 88%);
    filter:drop-shadow(0 0 5px rgba(255,205,70,.34));
    animation:finalBurstSpin 8s linear infinite;
}

.winner-kicker,
.winner-icon,
.final-word,
.winner-panel h2,
.winner-name,
.winner-score{
    position:relative;
    z-index:2;
}

.winner-kicker{
    margin:0;
    color:#fff;
    font-size:.82rem;
    font-weight:950;
    letter-spacing:3px;
    text-shadow:0 0 8px rgba(255,255,255,.18);
}

.winner-icon{
    margin:10px 0 0;
    font-size:2.45rem;
    filter:drop-shadow(0 0 10px rgba(255,211,90,.40));
}

.final-word{
    margin:14px 0 12px;
    font-family:
        "Arial Narrow",
        "Liberation Sans Narrow",
        "DejaVu Sans Condensed",
        "Helvetica Neue Condensed",
        Arial,sans-serif;
    font-stretch:condensed;
    font-size:clamp(4.7rem,14.5vw,7rem);
    line-height:.82;
    font-weight:950;
    letter-spacing:-.055em;
    white-space:nowrap;
    color:#5b4418;
    -webkit-text-stroke:2px #fff5c7;
    text-shadow:
        0 0 2px rgba(255,255,255,.96),
        0 0 7px rgba(255,245,199,.88),
        0 0 14px rgba(255,211,90,.96),
        0 0 28px rgba(255,184,0,.68);
    transform:scaleX(.84);
    transform-origin:center;
}

.winner-panel h2{
    margin:0;
    color:#fff;
    font-size:1.05rem;
    font-weight:950;
    letter-spacing:2px;
    text-transform:uppercase;
}

.winner-name{
    margin-top:8px;
    font-size:1.95rem;
    font-weight:950;
    color:#ffd86b;
    text-shadow:0 0 12px rgba(255,211,90,.32);
}

.winner-score{
    margin-top:12px;
    color:#fff1bf;
    font-size:1rem;
    font-weight:850;
    letter-spacing:.5px;
}

/* Gleichstand neutral halten */
.winner-panel.is-tie .winner-name,
.winner-panel.tie .winner-name{
    color:#f2f2f2;
    text-shadow:none;
}

/* leichte Impact-Animation beim Erscheinen */
.winner-panel:not(.hidden){
    animation:finalImpact15 .72s cubic-bezier(.18,.84,.28,1);
}

@keyframes finalImpact15{
    0%{transform:scale(.86);opacity:.06;filter:brightness(2.1);}
    42%{transform:scale(1.03);opacity:1;filter:brightness(1.38);}
    100%{transform:scale(1);opacity:1;filter:brightness(1);}
}

@keyframes finalBurstSpin{
    to{transform:rotate(360deg);}
}

@media (max-width:600px){
    .winner-panel{
        min-height:290px;
        padding:20px 12px 18px;
    }

    .winner-kicker{
        font-size:.72rem;
        letter-spacing:2.2px;
    }

    .winner-icon{
        font-size:2.1rem;
    }

    .final-word{
        margin:12px 0 10px;
        font-size:clamp(4.1rem,20vw,5.5rem);
        transform:scaleX(.80);
    }

    .winner-name{
        font-size:1.55rem;
    }

    .winner-score{
        font-size:.9rem;
    }
}

@media (max-width:390px){
    .final-word{
        font-size:4.25rem;
        transform:scaleX(.76);
    }
}


/* ===================================================
   BUILD 15.1 – FINAL CLEANUP
   Das alte ABSCHLUSS / FINAL-Fenster ist im Finale überflüssig.
   Die neue goldene FINAL-Bühne bleibt allein sichtbar.
   =================================================== */

.display-frame.final-visual-hidden{
    display:none;
}

/* Nach Wegfall des alten Abschlussfensters darf die FINAL-Bühne
   etwas ruhiger oben anschließen. */
.winner-panel{
    margin-top:4px;
}


/* ===================================================
   BUILD 16 – 52 g STECHEN
   Sonderaktion nur bei Gleichstand.
   =================================================== */

.tiebreak-button{
    border:1px solid rgba(255,211,90,.92);
    background:
        linear-gradient(180deg,rgba(255,211,90,.20),rgba(106,24,88,.32)),
        #171018;
    color:#fff6c9;
    font-weight:950;
    letter-spacing:1.2px;
    text-transform:uppercase;
    box-shadow:
        inset 0 0 18px rgba(255,211,90,.08),
        0 0 12px rgba(255,211,90,.18),
        0 0 22px rgba(226,0,170,.12);
}

.tiebreak-button:hover{
    transform:translateY(-1px);
    box-shadow:
        inset 0 0 20px rgba(255,211,90,.12),
        0 0 16px rgba(255,211,90,.28),
        0 0 28px rgba(226,0,170,.16);
}

@media (max-width:600px){
    .tiebreak-button{
        width:100%;
    }
}


/* ===================================================
   v0.9 – QUICK START & VORBEREITUNG INTEGRATION
   Der Build-16-Spielkern bleibt visuell und funktional erhalten.
   =================================================== */

body.overlay-open{
    overflow:hidden;
}

.setup-help-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
    margin-top:12px;
}

.setup-help-button{
    min-height:46px;
}

.quickstart-launch{
    border-color:rgba(226,0,170,.55);
    box-shadow:inset 0 0 18px rgba(226,0,170,.04);
}

.guide-overlay{
    position:fixed;
    inset:0;
    z-index:1000;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:18px;
    background:rgba(2,2,5,.84);
    backdrop-filter:blur(7px);
    -webkit-backdrop-filter:blur(7px);
}

.guide-overlay.hidden{
    display:none;
}

.guide-overlay-panel{
    width:min(760px,100%);
    max-height:calc(100vh - 36px);
    overflow:auto;
    border:1px solid rgba(255,255,255,.14);
    border-radius:18px;
    background:
        radial-gradient(circle at 50% 0%,rgba(226,0,170,.10),transparent 36%),
        linear-gradient(180deg,#15151b,#09090d);
    box-shadow:
        0 24px 80px rgba(0,0,0,.62),
        0 0 34px rgba(226,0,170,.08);
}

.guide-overlay-head,
.quickstart-overlay-bar{
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
}

.guide-overlay-head{
    padding:22px 22px 8px;
}

.guide-overlay-head h2{
    margin:4px 0 5px;
}

.guide-overlay-head p{
    margin:0;
    opacity:.74;
}

.guide-close{
    flex:0 0 auto;
    width:40px;
    height:40px;
    padding:0;
    border-radius:50%;
    font-size:1.75rem;
    line-height:1;
    background:rgba(255,255,255,.07);
    color:#fff;
    border:1px solid rgba(255,255,255,.15);
}

.preparation-grid{
    display:grid;
    gap:12px;
    padding:14px 22px 6px;
}

.preparation-card{
    display:grid;
    grid-template-columns:56px 1fr;
    gap:14px;
    align-items:center;
    padding:15px;
    border:1px solid rgba(255,255,255,.10);
    border-radius:14px;
    background:rgba(255,255,255,.035);
}

.preparation-card strong{
    display:block;
    margin-top:3px;
    font-size:1.08rem;
}

.preparation-card p{
    margin:4px 0 0;
    opacity:.72;
    line-height:1.4;
}

.preparation-icon{
    display:grid;
    place-items:center;
    width:50px;
    height:50px;
    border-radius:50%;
    font-size:1.6rem;
    background:rgba(226,0,170,.08);
    border:1px solid rgba(226,0,170,.24);
}

.preparation-label{
    display:block;
    color:#ff73d3;
    font-size:.72rem;
    font-weight:950;
    letter-spacing:1.6px;
}

.preparation-ready{
    border-color:rgba(255,211,90,.20);
}

.preparation-ready .preparation-icon{
    background:rgba(255,211,90,.07);
    border-color:rgba(255,211,90,.22);
}

.preparation-ready .preparation-label{
    color:#ffe08a;
}

.preparation-actions{
    display:flex;
    gap:10px;
    justify-content:flex-end;
    padding:16px 22px 22px;
}

.quickstart-overlay{
    padding:10px;
}

.quickstart-panel{
    width:min(900px,100%);
    height:min(900px,calc(100vh - 20px));
    display:flex;
    flex-direction:column;
    overflow:hidden;
}

.quickstart-overlay-bar{
    flex:0 0 auto;
    align-items:center;
    padding:10px 12px 9px 16px;
    border-bottom:1px solid rgba(255,255,255,.10);
    background:#0b0b10;
}

.quickstart-overlay-bar .section-kicker{
    display:block;
    margin-bottom:2px;
}

.quickstart-overlay-bar strong{
    display:block;
    font-size:1.08rem;
    letter-spacing:1px;
}

#quickStartFrame{
    display:block;
    flex:1 1 auto;
    width:100%;
    min-height:0;
    border:0;
    background:#09090d;
}

@media (max-width:600px){
    .setup-help-actions{
        grid-template-columns:1fr;
    }

    .guide-overlay{
        align-items:stretch;
        padding:8px;
    }

    .guide-overlay-panel{
        max-height:calc(100vh - 16px);
        border-radius:14px;
    }

    .guide-overlay-head{
        padding:17px 14px 6px;
    }

    .preparation-grid{
        padding:10px 14px 4px;
    }

    .preparation-card{
        grid-template-columns:48px 1fr;
        gap:11px;
        padding:13px 11px;
    }

    .preparation-icon{
        width:44px;
        height:44px;
        font-size:1.35rem;
    }

    .preparation-actions{
        display:grid;
        grid-template-columns:1fr;
        padding:13px 14px 16px;
    }

    .quickstart-overlay{
        padding:0;
    }

    .quickstart-panel{
        width:100%;
        height:100vh;
        max-height:none;
        border-radius:0;
        border-left:0;
        border-right:0;
    }

    .quickstart-overlay-bar{
        padding-top:max(8px,env(safe-area-inset-top));
    }
}

/* v0.9.1 – Integration Fix & Visual Polish */
.preparation-launch{display:inline-flex;align-items:center;justify-content:center;gap:9px}
.mini-scale-icon,.arena-scale-icon{position:relative;display:inline-block;box-sizing:border-box;border:2px solid currentColor;border-radius:5px 5px 7px 7px;background:rgba(255,255,255,.035)}
.mini-scale-icon{width:24px;height:19px}
.mini-scale-icon::before,.arena-scale-icon::before{content:"";position:absolute;left:13%;right:13%;top:-6px;height:6px;border:2px solid currentColor;border-bottom:0;border-radius:4px 4px 0 0}
.mini-scale-icon span,.scale-display{position:absolute;left:50%;bottom:3px;transform:translateX(-50%);width:10px;height:4px;border:1px solid currentColor;border-radius:1px}
.arena-scale-icon{width:38px;height:30px;color:#ff73d3}.arena-scale-icon::before{top:-9px;height:9px}.scale-display{width:16px;height:6px;bottom:5px}
.arena-cup-icon{position:relative;display:inline-block;width:30px;height:35px;box-sizing:border-box;border:2px solid #ff73d3;border-top:0;border-radius:2px 2px 8px 8px}
.arena-cup-icon::after{content:"";position:absolute;left:4px;right:4px;bottom:6px;height:10px;border-radius:0 0 5px 5px;background:rgba(255,115,211,.28)}
.cup-rim{position:absolute;left:-3px;right:-3px;top:-3px;height:6px;border:2px solid #ff73d3;border-radius:50%;background:#17171d}

@media(max-width:600px){
 .player-actions{row-gap:12px}
 .setup-help-actions{display:flex;flex-direction:column;align-items:stretch;gap:12px;margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.08)}
 .setup-help-actions .preparation-launch{width:74%;align-self:center;min-height:44px}
 .setup-help-actions .quickstart-launch{width:100%;min-height:48px}
 #statsButtonSetup{margin-bottom:2px}
}

.winner-panel.tiebreak-winner .winner-name{padding:8px 18px;border:1px solid rgba(255,218,102,.95);border-radius:10px;color:#ffe28a;background:rgba(255,205,70,.055);box-shadow:inset 0 0 16px rgba(255,218,102,.08),0 0 8px rgba(255,218,102,.55),0 0 20px rgba(255,190,35,.30);text-shadow:0 0 7px rgba(255,244,190,.65),0 0 14px rgba(255,205,70,.35)}
.winner-panel.tiebreak-winner ~ .standings-panel .standing-row,.winner-panel.tiebreak-winner ~ * .standing-row{border-color:rgba(255,255,255,.10);box-shadow:none}

/* lange Namen: Name darf schrumpfen, EXAKT-Symbol bleibt */
.round-stat-row,.round-stat-player,.round-stat-line,.history-round-row{min-width:0}
.round-stat-row .player-name,.round-stat-player .player-name,.history-round-row .player-name,.round-stat-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.round-stat-row .exact-marker,.round-stat-row .exact-badge,.round-stat-row .exact-icon,.history-round-row .exact-marker,.history-round-row .exact-badge,.round-stat-exact{flex:0 0 24px!important;min-width:24px;width:24px;overflow:visible!important;text-overflow:clip!important;white-space:nowrap}
@media(max-width:600px){.round-stat-row .player-name,.round-stat-player .player-name,.history-round-row .player-name,.round-stat-name{max-width:112px}}

/* stärkerer Magenta-Zielimpuls */
@keyframes targetPulseV091{
 0%{transform:scale(1);filter:brightness(1);text-shadow:0 0 8px rgba(226,0,170,.55),0 0 18px rgba(226,0,170,.28)}
 32%{transform:scale(1.13);filter:brightness(1.48);text-shadow:0 0 5px rgba(255,255,255,.96),0 0 14px rgba(255,120,225,1),0 0 30px rgba(240,0,190,1),0 0 54px rgba(226,0,170,.92),0 0 84px rgba(226,0,170,.62)}
 62%{transform:scale(1.055);filter:brightness(1.22);text-shadow:0 0 8px rgba(255,170,235,.88),0 0 26px rgba(226,0,170,.82),0 0 48px rgba(226,0,170,.48)}
 100%{transform:scale(1);filter:brightness(1)}
}

.display.target-glow{animation:targetPulseV091 1.08s cubic-bezier(.16,.72,.25,1)!important}

.display.target-highlight{animation:targetPulseV091 1.08s cubic-bezier(.16,.72,.25,1)!important}


/* =========================================================
   v0.9.2 – QUICK START & MOBILE FIXES
   ========================================================= */

/* Hilfe-Buttons auf iPhone: exakt gleiche Geometrie */
@media (max-width:600px){
    .setup-help-actions .setup-help-button,
    .setup-help-actions .preparation-launch,
    .setup-help-actions .quickstart-launch{
        width:100% !important;
        max-width:100% !important;
        min-height:48px !important;
        height:48px !important;
        align-self:stretch !important;
        box-sizing:border-box !important;
        margin:0 !important;
        white-space:nowrap !important;
        line-height:1 !important;
        font-size:clamp(.78rem,3.65vw,.92rem) !important;
        padding:0 10px !important;
    }

    .setup-help-actions{
        gap:12px !important;
    }
}

/* QUICK START Overlay: nur noch Schließen – kein zweiter Titelkopf */
.quickstart-overlay-bar.quickstart-close-only{
    min-height:44px;
    justify-content:flex-end;
    padding:6px 8px;
}
.sr-only{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0,0,0,0) !important;
    white-space:nowrap !important;
    border:0 !important;
}

/* Zwischenstand: eigener, reservierter EXAKT-Bereich */
.standing-row{
    grid-template-columns:34px minmax(0,1fr) 34px auto !important;
    gap:7px !important;
}
.standing-name{
    min-width:0 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
}
.standing-exact{
    width:34px;
    min-width:34px;
    max-width:34px;
    text-align:center;
    white-space:nowrap;
    overflow:visible;
    font-size:1.05rem;
    line-height:1;
}
@media (max-width:420px){
    .standing-row{
        grid-template-columns:27px minmax(0,1fr) 30px auto !important;
        gap:4px !important;
        padding-left:6px !important;
        padding-right:6px !important;
    }
    .standing-place{font-size:.83rem}
    .standing-name{font-size:.87rem !important}
    .standing-exact{
        width:30px;
        min-width:30px;
        max-width:30px;
        font-size:1rem;
    }
    .standing-total{font-size:.9rem}
    .standing-total small{
        font-size:.64rem;
        margin-left:1px;
    }
}

/*
 * Zielzahl-Impuls: diesmal direkt am tatsächlich verwendeten
 * .display-frame.target-glow::after und #display.target-highlight.
 */
.display-frame.target-glow::after{
    width:92% !important;
    height:92% !important;
    background:
        radial-gradient(circle,
            rgba(255,255,255,.96) 0%,
            rgba(255,165,238,.98) 8%,
            rgba(255,35,204,.92) 22%,
            rgba(226,0,170,.76) 42%,
            rgba(226,0,170,.34) 61%,
            rgba(226,0,170,0) 78%) !important;
    animation:targetHaloV092 1.45s cubic-bezier(.18,.75,.2,1) 1 !important;
    filter:drop-shadow(0 0 12px rgba(255,60,210,.95))
           drop-shadow(0 0 30px rgba(226,0,170,.78));
}
#display.target-highlight{
    animation:targetNumberAccentV092 1.45s cubic-bezier(.18,.75,.2,1) 1 !important;
}
@keyframes targetHaloV092{
    0%{
        opacity:0;
        transform:translate(-50%,-50%) scale(.45);
    }
    20%{
        opacity:1;
        transform:translate(-50%,-50%) scale(1.34);
    }
    42%{
        opacity:.72;
        transform:translate(-50%,-50%) scale(1.06);
    }
    65%{
        opacity:.96;
        transform:translate(-50%,-50%) scale(1.22);
    }
    100%{
        opacity:0;
        transform:translate(-50%,-50%) scale(1.50);
    }
}
@keyframes targetNumberAccentV092{
    0%{
        transform:scale(1);
        filter:brightness(1);
    }
    20%{
        transform:scale(1.11);
        filter:brightness(1.5);
        text-shadow:
            0 0 4px rgba(255,255,255,.98),
            0 0 13px rgba(255,125,226,1),
            0 0 30px rgba(226,0,170,.95),
            0 0 52px rgba(226,0,170,.62);
    }
    48%{
        transform:scale(1.045);
        filter:brightness(1.18);
    }
    68%{
        transform:scale(1.075);
        filter:brightness(1.34);
        text-shadow:
            0 0 7px rgba(255,180,237,.95),
            0 0 25px rgba(226,0,170,.9),
            0 0 48px rgba(226,0,170,.52);
    }
    100%{
        transform:scale(1);
        filter:brightness(1);
    }
}

/* =========================================================
   v0.9.3 – Visual Alignment & Tiebreak Polish
   ========================================================= */

/* Mehrfarbige Waage / Glas */
.mini-scale-icon,.arena-scale-icon{
  color:#f3f7ff!important;border-color:#f3f7ff!important;
  background:linear-gradient(180deg,rgba(112,202,255,.18),rgba(255,255,255,.035))!important;
}
.mini-scale-icon::before,.arena-scale-icon::before{border-color:#69c8ff!important}
.mini-scale-icon span,.scale-display{
  border-color:#85ffad!important;background:rgba(72,255,128,.20)!important;
  box-shadow:0 0 5px rgba(72,255,128,.3)
}
.arena-cup-icon{border-color:#f3f7ff!important;background:rgba(102,195,255,.07)!important}
.cup-rim{border-color:#69c8ff!important;background:#17171d!important}
.arena-cup-icon::after{
  background:linear-gradient(180deg,rgba(255,220,83,.78),rgba(255,137,62,.7))!important
}

/* Zwischenstand: 🎯 bleibt direkt beim Namen, Ergebnis klar getrennt */
.standing-row{
  grid-template-columns:34px minmax(0,1fr) auto!important;
  gap:9px!important;
}
.standing-player-line{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:8px;
  overflow:hidden;
}
.standing-player-line .standing-name{
  min-width:0;
  flex:0 1 auto;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.standing-player-line .standing-exact{
  flex:0 0 auto!important;
  width:auto!important;min-width:0!important;max-width:none!important;
  padding:0 8px 0 0!important;
  text-align:left!important;
  white-space:nowrap!important;
}
@media(max-width:420px){
  .standing-row{grid-template-columns:27px minmax(0,1fr) auto!important;gap:5px!important}
  .standing-player-line{gap:5px}
  .standing-player-line .standing-exact{padding-right:6px!important}
}

/* 52-g-Stechen: Sieger gold, alle anderen neutral */
.tiebreak-result-row{grid-template-columns:34px minmax(0,1fr) auto!important}
.standing-row.tiebreak-row-winner{
  border-color:#ffda67!important;
  background:linear-gradient(90deg,rgba(255,213,83,.10),rgba(255,213,83,.025))!important;
  box-shadow:0 0 9px rgba(255,218,103,.65),0 0 24px rgba(255,180,30,.32)!important;
}
.standing-row.tiebreak-row-winner .standing-name,
.standing-row.tiebreak-row-winner .standing-total{
  color:#ffe486!important;
  text-shadow:0 0 8px rgba(255,228,134,.52)!important;
}
.standing-row.tiebreak-row-neutral{
  border-color:rgba(255,255,255,.12)!important;
  background:#111!important;
  box-shadow:none!important;
}
.standing-row.tiebreak-row-neutral .standing-name,
.standing-row.tiebreak-row-neutral .standing-total{
  color:#f2f2f2!important;
  text-shadow:none!important;
}

/* =========================================================
   v0.9.4 – Zielzahl-Schein feiner abgestimmt
   leicht dezenter, stärker von innen nach außen auslaufend
   ========================================================= */
.display-frame.target-glow::after{
    width:88%!important;
    height:88%!important;
    background:
        radial-gradient(circle,
            rgba(255,255,255,.80) 0%,
            rgba(255,186,238,.78) 8%,
            rgba(255,66,205,.66) 21%,
            rgba(226,0,170,.44) 39%,
            rgba(226,0,170,.20) 57%,
            rgba(226,0,170,.07) 70%,
            rgba(226,0,170,0) 84%)!important;
    filter:
        drop-shadow(0 0 8px rgba(255,80,210,.62))
        drop-shadow(0 0 20px rgba(226,0,170,.38))!important;
    animation:targetHaloV094 1.45s cubic-bezier(.18,.75,.2,1) 1!important;
}
#display.target-highlight{
    animation:targetNumberAccentV094 1.45s cubic-bezier(.18,.75,.2,1) 1!important;
}
@keyframes targetHaloV094{
    0%{opacity:0;transform:translate(-50%,-50%) scale(.52)}
    22%{opacity:.88;transform:translate(-50%,-50%) scale(1.22)}
    48%{opacity:.58;transform:translate(-50%,-50%) scale(1.08)}
    70%{opacity:.74;transform:translate(-50%,-50%) scale(1.16)}
    100%{opacity:0;transform:translate(-50%,-50%) scale(1.42)}
}
@keyframes targetNumberAccentV094{
    0%{transform:scale(1);filter:brightness(1)}
    22%{
        transform:scale(1.07);
        filter:brightness(1.28);
        text-shadow:
            0 0 3px rgba(255,255,255,.82),
            0 0 10px rgba(255,130,225,.72),
            0 0 22px rgba(226,0,170,.58),
            0 0 38px rgba(226,0,170,.26);
    }
    50%{transform:scale(1.025);filter:brightness(1.10)}
    72%{
        transform:scale(1.045);
        filter:brightness(1.18);
        text-shadow:
            0 0 5px rgba(255,176,236,.68),
            0 0 16px rgba(226,0,170,.48),
            0 0 30px rgba(226,0,170,.20);
    }
    100%{transform:scale(1);filter:brightness(1)}
}

/* 52-g-Stechen: obere Namensfelder – Gewinner Gold, andere neutral */
.tiebreak-top-winner{
    color:#ffe486!important;
    border-color:#ffda67!important;
    box-shadow:
        0 0 7px rgba(255,218,103,.70),
        0 0 19px rgba(255,180,30,.34)!important;
    text-shadow:0 0 8px rgba(255,228,134,.54)!important;
    background:
        linear-gradient(180deg,rgba(255,214,83,.08),rgba(255,214,83,.02))!important;
}
.tiebreak-top-neutral{
    color:inherit!important;
    border-color:rgba(255,255,255,.14)!important;
    box-shadow:none!important;
    text-shadow:none!important;
    background:inherit!important;
}


/* =========================================================
   v0.9.5 – INSTAGRAM & SHARE
   ========================================================= */

/* Instagram – eigenes CSS-Logo, keine externe Bilddatei nötig */
.arena-social-row{
    display:flex;
    justify-content:center;
    margin-top:14px;
}
.instagram-link{
    display:inline-flex;
    align-items:center;
    gap:10px;
    min-width:178px;
    padding:8px 13px 8px 10px;
    border:1px solid rgba(255,255,255,.13);
    border-radius:14px;
    background:rgba(255,255,255,.025);
    color:#f8f8fb;
    text-decoration:none;
    box-shadow:inset 0 0 12px rgba(255,255,255,.015);
    transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease;
}
.instagram-link:hover,
.instagram-link:focus-visible{
    transform:translateY(-1px);
    border-color:rgba(255,80,190,.55);
    box-shadow:0 0 16px rgba(225,0,150,.16);
    outline:none;
}
.instagram-mark{
    position:relative;
    width:30px;
    height:30px;
    flex:0 0 30px;
    border-radius:9px;
    background:
        radial-gradient(circle at 69% 72%, #ffd05b 0 16%, transparent 17%),
        radial-gradient(circle at 31% 88%, #ff7a36 0 23%, transparent 24%),
        radial-gradient(circle at 12% 28%, #7b41ff 0 32%, transparent 33%),
        linear-gradient(135deg,#7b41ff 8%,#d52b8a 48%,#ff5c49 72%,#ffc84b 100%);
    box-shadow:0 0 10px rgba(225,0,150,.27);
}
.instagram-mark::before{
    content:"";
    position:absolute;
    inset:6px;
    border:2px solid #fff;
    border-radius:6px;
}
.instagram-mark::after{
    content:"";
    position:absolute;
    width:7px;
    height:7px;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    border:2px solid #fff;
    border-radius:50%;
}
.instagram-mark span{
    position:absolute;
    width:3px;
    height:3px;
    right:7px;
    top:7px;
    border-radius:50%;
    background:#fff;
}
.instagram-copy{
    display:flex;
    flex-direction:column;
    align-items:flex-start;
    line-height:1.05;
}
.instagram-copy strong{
    font-size:.84rem;
    letter-spacing:.01em;
}
.instagram-copy small{
    margin-top:3px;
    color:var(--muted);
    font-size:.66rem;
    letter-spacing:.08em;
    text-transform:uppercase;
}

/* ENDSTAND – Ergebnis teilen */
.share-result-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    border-color:rgba(255,78,188,.60)!important;
    background:
        linear-gradient(180deg,rgba(232,19,151,.22),rgba(130,0,84,.12))!important;
    color:#fff!important;
    box-shadow:
        inset 0 0 14px rgba(255,72,190,.08),
        0 0 12px rgba(226,0,170,.10);
}
.share-result-button:hover,
.share-result-button:focus-visible{
    border-color:rgba(255,112,205,.90)!important;
    box-shadow:
        inset 0 0 16px rgba(255,72,190,.10),
        0 0 18px rgba(226,0,170,.24)!important;
}
.share-symbol{
    font-size:1.12em;
    line-height:1;
    transform:translateY(-1px);
}

@media(max-width:600px){
    .instagram-link{
        width:100%;
        box-sizing:border-box;
        justify-content:center;
    }
    .final-actions .share-result-button{
        width:100%;
    }
}

/* =========================================================
   v0.9.6 – ERGEBNIS ALS BILD TEILEN
   ========================================================= */
.share-image-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:7px;
    border-color:rgba(255,215,92,.62)!important;
    background:linear-gradient(180deg,rgba(255,215,92,.13),rgba(118,81,0,.10))!important;
    color:#fff!important;
    box-shadow:inset 0 0 14px rgba(255,215,92,.05),0 0 12px rgba(255,194,58,.08);
}
.share-image-button:hover,
.share-image-button:focus-visible{
    border-color:rgba(255,224,125,.92)!important;
    box-shadow:inset 0 0 16px rgba(255,215,92,.08),0 0 18px rgba(255,194,58,.18)!important;
}
.share-image-button:disabled{
    opacity:.72;
    cursor:wait;
}
.share-image-symbol{
    color:#ffd95c;
    font-size:1.08em;
    line-height:1;
}
@media(max-width:600px){
    .final-actions .share-image-button{width:100%}
}