/* ==========================================================================
   assets/spielabschluss.css  -  DER EINE SPIELABSCHLUSS (SPIEL-31 Etappe B, 09.10.2026)

   Das Overlay-CSS der Huelle, herausgeloest aus board.html (Overlays, #ovRang,
   #boardStats) - byteidentische Regeln, dazu die Klassen fuer den Vorschlag
   "Naechstes Spiel", die bisher als Inline-Stile im Markup standen.
   Farben ueber die Variablen von assets/theme-game.css (--green, --active).
   ========================================================================== */

/* Overlays */
.overlay{position:fixed; inset:0; background:rgba(0,0,0,.8); display:none;
     align-items:center; justify-content:center; flex-direction:column; gap:21px; text-align:center; padding:27px;}
.overlay.show{display:flex;}
.overlay h1{font-size:30px; margin:0;}
.overlay h2{font-size:18px; margin:7px 0 2px; color:#cfcfcf; font-weight:600;}
.overlay button{background:var(--green); color:#fff; border:none; border-radius:7px; padding:16px 30px; font-size:21px; font-weight:700;}
.overlay button.ov-back{background:#555;}

/* Das Endbild: Rangliste zu mehreren (SPIEL-28), Hinweis (SPIEL-24), Statistik-Knopf */
#ovRang{display:none; margin:0 auto 18px; max-width:560px; text-align:left; font-size:20px; line-height:1.5;}
#ovRang .rg{display:flex; gap:12px; align-items:baseline; padding:3px 0; border-bottom:1px solid #3a3a3a;}
#ovRang .rg:last-child{border-bottom:none;}
#ovRang .rg .rn{flex:0 0 2.2em; font-weight:800; color:var(--active);}
#ovRang .rg .rm{flex:1; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
#ovRang .rg .rl{flex:0 0 auto; color:#cfcfcf;}
#ovHinweis{max-width:560px; margin:0 auto 18px; padding:12px 16px; border-radius:9px; border:1px solid #b5503f; background:#4a1f18; color:#fff; font-size:18px; text-align:center;}
#ovStats{margin-top:12px; padding:10px 20px; font-size:17px; border-radius:9px; border:1px solid #3a7d4a; background:#1c5a2e; color:#fff; cursor:pointer;}

/* Der Vorschlag "Naechstes Spiel" (DESIGN-A3-2) */
#ovNext2{margin:0 0 18px; text-align:center;}
#ovNext2 .ngs-titel{font-size:19px; margin-bottom:4px;}
#ovNext2 .ngs-namen{opacity:.8; margin:0 auto 14px; max-width:640px; line-height:1.35; overflow-wrap:anywhere;}
#ovNext2 .ngs-btn{padding:12px 22px; margin:0 6px 8px; font-size:17px; border-radius:10px; border:0; cursor:pointer;}
#ovNext2 .ngs-again{background:#1c5a2e; color:#fff; font-weight:700;}
#ovNext2 .ngs-swap{background:#243449; color:#fff;}

/* Die Statistik im Rahmen (nach beendetem Spiel) */
#boardStats{align-items:stretch; justify-content:flex-start; padding:0;}
#boardStats .bs-frame{position:relative; width:100%; height:100%;}
#boardStats iframe{position:absolute; inset:0; width:100%; height:100%; border:0; background:#fff;}
#boardStats .bs-x{position:absolute; top:10px; right:10px; z-index:5; padding:9px 14px; border:0; border-radius:9px; background:rgba(20,22,28,.88); color:#fff; font-size:15px; font-weight:700; cursor:pointer;}

/* Etappe C (10.10.2026): die Trainingsspiele im iframe und auf dem Geraet. Die Overlays
   liegen ueber der Spielseite (Standby des Moduls 50, Tastatur-Overlays 40, der
   Schreibschutz 70 bleibt darueber); die Statistik ueber dem Endbild. #bsInhalt traegt
   das fertige Bild der Spielseite (.bm-* aus theme-game.css) statt eines iframes. */
#overlay{z-index:55;}
#boardStats{z-index:56;}
#bsInhalt{position:absolute; inset:0; overflow:auto; padding:58px 16px 24px; background:#111; color:#e8e8e8;
     display:flex; flex-direction:column; align-items:center; text-align:center;}