/* Bingo mathématique : même vert que le reste du site */
#features.bg-section { padding-top: 1em; }
.bg-section [hidden] { display: none !important; }
.bg-carte { padding: 1.3em 1.3em 1.1em 1.3em; background: #fff; border: 2px solid #e5e5e5; border-radius: 1.2em; text-align: left; }
.bg-carte h3 { margin: 0 0 .6em 0; color: #16855a; text-align: center; }
.bg-carte h3 .icon { margin-right: .3em; }
.bg-aide { margin: 0 0 .8em 0; font-size: .85em; color: #878787; text-align: center; }

.bg-grille { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 1.2em; align-items: start; max-width: 74em; margin: 0 auto; }
.bg-colonne { display: grid; gap: 1.2em; }
@media screen and (max-width: 980px) { .bg-grille { grid-template-columns: minmax(0, 1fr); } }

/* Onglets */
.bg-onglets { display: flex; justify-content: center; gap: .5em; flex-wrap: wrap; margin-bottom: .8em; }
.bg-onglet {
	font: inherit; padding: .45em 1.3em; border-radius: 2em; cursor: pointer; letter-spacing: 0; text-transform: none; text-shadow: none;
	-webkit-appearance: none; appearance: none; border: 2px solid #e5e5e5; color: #878787 !important; background: #fff !important; box-shadow: none;
	transition: background-color .25s, border-color .25s, color .25s;
}
.bg-onglet:hover { border-color: #5cc79a; color: #16855a !important; }
.bg-onglet.actif, .bg-onglet.actif:hover { background: #16855a !important; border-color: #16855a; color: #fff !important; }
.bg-onglet sup { font-size: .7em; }
.bg-onglet .bg-nb { display: inline-block; margin-left: .4em; min-width: 1.5em; padding: 0 .35em; border-radius: 1em; background: #fff; color: #16855a; font-size: .8em; font-weight: 700; }

.bg-barre-liste { display: flex; justify-content: flex-end; gap: 1em; margin-bottom: .2em; }
.bg-lien { font: inherit; font-size: .8em; background: none !important; border: 0; padding: 0 !important; color: #16855a !important; text-decoration: underline; cursor: pointer; letter-spacing: 0; text-transform: none; text-shadow: none; box-shadow: none; width: auto !important; height: auto; line-height: 1.4; }

/* Liste des calculs */
#liste h4 { margin: 1em 0 .3em 0; font-size: .85em; color: #16855a; letter-spacing: .08em; text-transform: uppercase; }
.bg-act { display: flex; align-items: center; gap: .7em; padding: .4em .6em; border-radius: .7em; border: 2px solid transparent; cursor: pointer; margin: 0; transition: background-color .2s, border-color .2s; }
.bg-act:hover { background: #f6fcf9; border-color: #e1f3ea; }
.bg-act.dans { background: #eaf7f1; border-color: #5cc79a; }
.bg-act input[type="checkbox"], .bg-case input[type="checkbox"] { -webkit-appearance: checkbox !important; appearance: auto !important; opacity: 1 !important; position: static !important; display: inline-block !important; flex: none; width: 1.3em !important; height: 1.3em !important; margin: 0 !important; accent-color: #16855a; }
.bg-act:before, .bg-act:after, .bg-case:before, .bg-case:after { content: none !important; display: none !important; }
.bg-act-titre { flex: 1; color: #444; line-height: 1.25; }
.bg-act-cap { flex: none; font-size: .75em; color: #878787; }

/* Réglages */
.bg-champs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8em; }
.bg-large { grid-column: 1 / -1; }
.bg-champ { display: block; margin: 0; }
.bg-champ > span { display: block; margin: 0 0 .3em 0; font-size: .82em; color: #878787; }
.bg-champ input, .bg-champ select { font: inherit; width: 100%; padding: .5em .7em; border: 2px solid #e5e5e5; border-radius: .6em; background: #fff; color: #555; box-sizing: border-box; height: auto; }
.bg-champ input:focus, .bg-champ select:focus { outline: none; border-color: #16855a; }
.bg-case { display: flex; align-items: center; gap: .6em; margin: 0; color: #555; font-size: .92em; cursor: pointer; }
.bg-info { margin: .9em 0 0 0; font-size: .85em; color: #666; }
.bg-commandes { display: flex; flex-wrap: wrap; gap: .6em; justify-content: center; }
.bg-serie { margin: .9em 0 0 0; text-align: center; color: #16855a; font-weight: 700; }
.bg-erreur { margin: .6em 0 0 0; text-align: center; color: #b3392b; font-size: .9em; min-height: 1.2em; }
.bg-rgpd { margin: .4em 0 0 0; text-align: center; font-size: .78em; color: #999; }

/* Le jeu */
.bg-jeu { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(0, 1fr); gap: 1.2em; align-items: start; max-width: 76em; margin: 0 auto; grid-template-areas: "scene suivi" "scene verif" "histo histo"; grid-template-rows: auto 1fr auto; }
.bg-verif { align-self: start; }
.bg-scene { grid-area: scene; text-align: center; }
.bg-suivi { grid-area: suivi; }
.bg-verif { grid-area: verif; }
.bg-histo { grid-area: histo; }
@media screen and (max-width: 980px) { .bg-jeu { grid-template-columns: minmax(0, 1fr); grid-template-areas: "scene" "suivi" "verif" "histo"; } }
.bg-haut { display: flex; justify-content: space-between; gap: .6em; flex-wrap: wrap; font-size: .9em; color: #878787; }
.bg-compteur { font-weight: 700; color: #16855a; }
.bg-question { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .18em; min-height: 8em; padding: .5em 0 .2em 0; font-family: 'Fredoka', 'Nunito', sans-serif; font-weight: 600; font-size: clamp(1.8em, 5vw, 3.2em); line-height: 1.25; color: #333; overflow-wrap: anywhere; }
.bg-question.tx-xl { font-size: clamp(2.2em, 6.4vw, 4em); }
.bg-question.tx-l { font-size: clamp(1.8em, 5vw, 3.1em); }
.bg-question.tx-m { font-size: clamp(1.5em, 3.9vw, 2.5em); }
.bg-question.tx-s { font-size: clamp(1.25em, 3.1vw, 2em); }
.bg-l { text-align: center; }
.bg-l-tete { font-size: .55em; color: #878787; font-weight: 600; letter-spacing: .02em; }
.bg-l-main { color: #333; }
.bg-l-consigne { color: #16855a; font-weight: 700; }
.bg-l-consigne-seule { color: #333; }
.bg-inconnue { display: inline-block; min-width: 1.25em; padding: 0 .2em; margin: 0 .08em; border: .07em dashed #16855a; border-radius: .25em; color: #16855a; line-height: 1.1; text-align: center; font-weight: 700; }
.bg-avec-fig { display: flex; align-items: center; justify-content: center; gap: 1.4em; flex-wrap: wrap; width: 100%; }
.bg-textes { display: flex; flex-direction: column; align-items: center; gap: .15em; }
.bg-fig { width: min(27rem, 95%); height: auto; flex: none; }
.bg-svg-tri { fill: #f3fbf7; stroke: #333; stroke-width: 3.2; stroke-linejoin: round; stroke-linecap: round; }
.bg-svg-ang { fill: none; stroke: #333; stroke-width: 2.6; }
.bg-svg-nom { font: italic 700 30px 'Fredoka', 'Nunito', sans-serif; fill: #555; }
.bg-svg-val { font: 700 29px 'Fredoka', 'Nunito', sans-serif; fill: #333; }
.bg-svg-inc { font: 800 40px 'Fredoka', 'Nunito', sans-serif; fill: #16855a; }
.bg-donnees { display: grid; gap: .08em; justify-items: start; margin: .1em 0 .25em 0; }
.bg-inc-ligne { color: #16855a; }
.bg-serie-nb { display: flex; flex-wrap: wrap; justify-content: center; gap: .3em .4em; }
.bg-serie-nb span { padding: .02em .4em; border-radius: .45em; background: #f3fbf7; border: .06em solid #bfe9d6; }
.bg-reponse { display: flex; align-items: center; justify-content: center; min-height: 3.2em; font-family: 'Fredoka', 'Nunito', sans-serif; font-weight: 700; font-size: clamp(1.8em, 5vw, 3em); color: #16855a; }
.bg-commandes { margin-top: .8em; }
.bg-raccourcis { margin: .9em 0 0 0; font-size: .8em; color: #999; }
.bg-raccourcis kbd { padding: .05em .5em; border: 1px solid #ccc; border-radius: .4em; background: #fafafa; font-family: inherit; }
.bg-code { font-family: monospace; letter-spacing: .1em; }
#scene:fullscreen, #scene:-webkit-full-screen { display: flex; flex-direction: column; justify-content: center; border-radius: 0; border: 0; overflow: auto; }
#scene:fullscreen .bg-question.tx-xl { font-size: clamp(2.6em, 9vw, 6.5em); }
#scene:fullscreen .bg-question.tx-l { font-size: clamp(2.2em, 7vw, 5em); }
#scene:fullscreen .bg-question.tx-m { font-size: clamp(1.8em, 5vw, 3.6em); }
#scene:fullscreen .bg-question.tx-s { font-size: clamp(1.5em, 4vw, 2.8em); }
#scene:fullscreen .bg-fig { width: min(36rem, 92%); }
#scene:fullscreen .bg-reponse { font-size: clamp(2.4em, 7vw, 5em); }

/* Fractions empilées */
.bg-frac { display: inline-flex; flex-direction: column; align-items: center; vertical-align: middle; line-height: 1.1; margin: 0 .1em; }
.bg-frac > span:first-child { border-bottom: .08em solid currentColor; padding: 0 .25em .05em .25em; }
.bg-frac > span:last-child { padding: .05em .25em 0 .25em; }

/* Réponses tombées */
.bg-sac { display: grid; grid-template-columns: repeat(auto-fill, minmax(3.6em, 1fr)); gap: .4em; }
.bg-bille { display: flex; align-items: center; justify-content: center; min-height: 2.4em; padding: .2em; border-radius: .6em; border: 2px solid #e5e5e5; background: #fff; color: #bbb; font-weight: 700; font-size: .95em; transition: background-color .25s, color .25s, border-color .25s; }
.bg-bille.tombee { background: #16855a; border-color: #16855a; color: #fff; }
.bg-bille.dernier { box-shadow: 0 0 0 3px #bfe9d6; }
#nb-tombees { color: #878787; font-size: .8em; font-weight: 400; }

/* Vérification */
.bg-ligne-verif { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: .8em; align-items: end; }
.bg-resultat { margin: .8em 0 .4em 0; font-weight: 700; text-align: center; min-height: 1.4em; }
.bg-resultat.ok { color: #16855a; font-size: 1.15em; }
.bg-resultat.ko { color: #b3392b; }
.bg-mini { display: grid; gap: .3em; max-width: 20em; margin: 0 auto; }
.bg-mini div { display: flex; align-items: center; justify-content: center; aspect-ratio: 1; border-radius: .5em; border: 2px solid #e5e5e5; font-weight: 700; font-size: .85em; background: #fff; color: #555; text-align: center; }
.bg-mini div.ok { background: #e8f7f0; border-color: #16855a; color: #16855a; }
.bg-mini div.ko { background: #fdf0ee; border-color: #e7a79e; color: #b3392b; }
.bg-mini div.libre { background: #fff7d6; border-color: #e3c75a; color: #8a6d00; font-size: .7em; }

/* Historique */
.bg-liste-histo { margin: 0; padding-left: 2.4em; columns: 2 20em; column-gap: 2em; font-size: .92em; color: #555; }
.bg-liste-histo li { margin-bottom: .3em; break-inside: avoid; }
.bg-liste-histo strong { color: #16855a; }

.bg-multi { display: flex; flex-wrap: wrap; justify-content: center; gap: .05em 1em; }
.bg-chaine { gap: .05em .45em; }
.bg-nw { white-space: nowrap; }

.bg-fig-thales { width: min(19rem, 46%); min-width: 13rem; }
#scene:fullscreen .bg-fig-thales { width: min(26rem, 46%); }

/* Minuteur */
.bg-auto { display: inline-flex; align-items: center; gap: .5rem; flex-wrap: wrap; }
.bg-auto label { margin: 0; font-weight: 700; color: #16855a; }
.bg-auto select { width: auto; min-width: 7rem; margin: 0; }
.bg-auto-barre { height: .7rem; border-radius: .4rem; background: #e8f7f0; margin: .2rem 0 .6rem; overflow: hidden; }
.bg-auto-barre span { display: block; height: 100%; width: 0; background: #16855a; transition: width .25s linear; }
.bg-auto-barre span.urgent { background: #e0662b; }