/* ============================================================================
   IL COUPON, SOLO STRUTTURA — per le skin vestite da un tema importato.

   🔴 IL CASO (carta `A/todo/TIMERBET-il-coupon-della-home-esce-NUDO…`, 15/08).
   Su timerbet il coupon della home usciva **nudo**: «Non hai ancora scelto nulla» e «Tocca una
   quota e appare qui» stampate una sull'altra, il numero degli eventi come testo qualunque, la
   testata senza allineamento. Il markup c'era ed era giusto — mancava il vestito.

   Misurato da due corsie, per classe, sulle tre home servite:

       timerbet   16 fogli · 9 classi guardate · 🔴 **4 SENZA REGOLA**: `slip` `slip-n`
                  `card-h` `empty`
       betslot     8 fogli · 5 classi          · 🔴 **0**   ⬅ controllo positivo: la lente
                                                              vede la differenza, non accusa tutti

   ⇒ Le regole ci sono, ma vivono in `player/tb.css` — che **una pagina vestita non carica**
   (regola di casa in `player_ui/mobile.py`: sulle pagine col tema importato restano solo i
   fogli STRUTTURALI). Il tema, dal canto suo, non veste il coupon: non sa che esiste, perché è
   markup nostro.

   ## Perché un foglio nuovo e non due righe in `tb.css`

   È la **quarta volta** che questa famiglia morde — casinò (Angelo 31/07), cronologia scommesse
   (Stefano 03/08), scelta competizioni (Dav 04/08) — e le tre volte prima la cura è stata la
   stessa: portare **la sola struttura** in un foglio che il middleware inietta anche sulle
   pagine vestite, lasciando **il colore al tema**. Qui si fa la stessa cosa, non una nuova.

   ## ⛔ Le due regole che questo file rispetta

   ① **ZERO COLORI.** Niente `color`, `background`, `border`, `box-shadow`: dove il tema
      dipinge, dipinge lui. Se domani questo file portasse un colore, la skin del cliente
      tornerebbe a somigliare alla nostra — che è esattamente ciò che Angelo ha deciso di non
      volere («così la mancanza si vede e si corregge nel tema»).
   ② **TUTTO SOTTO `.slip`.** `.card-h`, `.empty` e `.slip-n` sono classi **globali**: senza
      scope si vestirebbe mezzo sito da un foglio che parla del coupon. È la stessa cautela
      scritta in `tb.css` sopra il blocco del coupon compatto.
   ========================================================================== */

/* La testata «COUPON · N. Eventi»: senza `flex` il conteggio va a capo e sembra un titolo. */
.slip .card-h {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 10px;
  padding: 8px 12px;
}

/* Il numero degli eventi è una pastiglia, non una parola in mezzo alla frase. */
.slip .slip-n {
  display: inline-block;
  min-width: 20px;
  padding: 1px 6px;
  text-align: center;
  border-radius: 999px;
}

/* 🔴 LA RIGA CHE RIPARA LO SCATTO: `<b>` è in linea, quindi «Non hai ancora scelto nulla» e
   «Tocca una quota e appare qui» finivano sulla stessa riga, una addosso all'altra. */
.slip .empty {
  padding: 18px 14px;
  text-align: center;
}

.slip .empty b {
  display: block;
  margin-block-end: 4px;
}