/* ─────────────── « AU HASARD » (Js', 03/10 : « quand tu prends une balle au hasard faut que ça affiche au hasard et ça
   choisit une balle uniquement quand la partie se lance ») ───────────────
   « Au hasard » est un choix à part entière (js/br/app.js, HASARD) : quand il est pris, aucune case de balle n'est choisie —
   c'est son bouton 🎲 qui reste allumé, en or avec un liseré blanc, comme la balle choisie. Sur ordinateur dans la barre
   des balles, au téléphone dans la barre du haut (hasardInit). La balle elle-même (le « ? » dans la police des titres, sur violet) : img/hasard.webp.
   (Ces deux premières règles sont un peu plus fortes que les règles de mise en page du choix des balles, « html:not(.tel)
   #chars #charRandom » comprise : refaites à part, elles ne doivent pas éteindre ce bouton ni rallumer le cadre vide.) */
html #chars #charRandom.sel[aria-pressed="true"] { background: var(--gold); color: var(--ink); box-shadow: 0 0 0 3px #fff, 4px 4px 0 3px var(--ink); }
/* (sa fiche n'a pas de barres — vie, vitesse, portée : la balle n'est pas encore tirée — ; au téléphone, leur fond sombre
   restait seul sous l'étiquette) */
html #chars #hero .hero-stats:empty { display: none; }
/* (au doigt, écran étroit : css/balles.css réduit le bouton à son dé, mais sa règle des écrans bas — 340 px, plus loin
   dans le fichier — lui rendait son texte, qui débordait à côté du dé : le dé seul, sur toutes les hauteurs ; sans
   l'espace entre les lettres du texte caché, qui le décalait encore) */
@media (max-width: 760px) { html.tel #chars > .topbar .dice-btn { width: var(--tb); padding: 0; font-size: 0; letter-spacing: 0; } }
/* (la revanche, au téléphone : la barre du haut porte déjà les deux camps et le minuteur — le bouton n'y garde que son dé) */
html.tel #chars.rev > .topbar .dice-btn { width: var(--tb); padding: 0; font-size: 0; letter-spacing: 0; }
html.tel #chars.rev > .topbar .dice-btn::before { content: '🎲'; font-size: 20px; line-height: 1; }