/* Course aux nombres : même vert que le reste du site */
#features.cn-section { padding-top: 1em; }
.cn-outil { max-width: 64em; margin: 0 auto; text-align: left; }
.cn-outil [hidden] { display: none !important; }
.cn-outil *:focus-visible { outline: 3px solid #f2b01e; outline-offset: 2px; }
.cn-boite { background: #fff; border: 2px solid #e5e5e5; border-radius: 1.2em; padding: 1.1em 1.3em 1.3em; margin-bottom: 1em; }
.cn-boite h3 { margin: 0 0 .8em; font-size: 1em; color: #16855a; text-align: center; letter-spacing: .05em; }
.cn-boite h4 { margin: 1em 0 .5em; font-size: .85em; color: #888; text-transform: uppercase; letter-spacing: .06em; }
.cn-tuiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(16em, 1fr)); gap: 1em; }
.cn-tuile { display: grid; grid-template-columns: auto 1fr; gap: .2em .8em; padding: 1em 1.1em; border: 2px solid #e5e5e5; border-radius: 1em; cursor: pointer; color: #666; line-height: 1.5; }
.cn-tuile:hover { border-color: #5cc79a; }
.cn-tuile.actif { border-color: #16855a; box-shadow: 0 0 0 3px #d4efe3; }
.cn-tuile .icon { grid-row: 1 / 3; width: 2.4em; height: 2.4em; border-radius: 50%; background: #eaf7f1; color: #16855a; display: flex; align-items: center; justify-content: center; }
.cn-tuile .icon:before { margin: 0; }
.cn-tuile.actif .icon { background: #16855a; color: #fff; }
.cn-tuile b { font-family: 'Fredoka', 'Nunito', sans-serif; font-size: 1.15em; color: #16855a; font-weight: 600; }
.cn-tuile > span:last-child { font-size: .9em; }
.cn-champs { display: grid; grid-template-columns: repeat(auto-fit, minmax(13em, 1fr)); gap: .9em 1.2em; }
.cn-champ { display: block; margin: 0; }
.cn-champ > span:first-child { display: block; margin: 0 0 .3em; font-size: .82em; color: #878787; }
.cn-champ select, .cn-champ input { font: inherit; width: 100%; padding: .45em .7em; border: 2px solid #e5e5e5; border-radius: .6em; background: #fff; color: #333; box-sizing: border-box; height: auto; }
.cn-code { display: flex; gap: .6em; align-items: center; }
.cn-code input { letter-spacing: .25em; text-transform: uppercase; font-weight: 700; }
.cn-lien { color: #16855a; cursor: pointer; font-size: .85em; white-space: nowrap; text-decoration: underline; }
.cn-themes { display: flex; flex-wrap: wrap; gap: .4em .6em; }
.cn-theme { display: inline-flex; align-items: center; gap: .35em; margin: 0; padding: .3em .8em; border: 2px solid #e5e5e5; border-radius: 2em; cursor: pointer; font-size: .9em; color: #555; }
.cn-theme input { position: static !important; opacity: 1 !important; width: 1em; height: 1em; margin: 0; accent-color: #16855a; -webkit-appearance: checkbox; appearance: auto; }
.cn-centre { text-align: center; margin-top: 1.2em; }
.cn-bts { display: flex; flex-wrap: wrap; gap: .6em; justify-content: center; }
.cn-go { display: inline-flex; align-items: center; gap: .5em; padding: .75em 1.6em; border-radius: .8em; background: #16855a; color: #fff; font-weight: 700; letter-spacing: .04em; cursor: pointer; -webkit-user-select: none; user-select: none; }
.cn-go:hover { background: #127048; }
.cn-go2 { background: #fff; color: #16855a; border: 2px solid #16855a; }
.cn-go2:hover { background: #eaf7f1; }
.cn-info { text-align: center; color: #888; font-size: .9em; margin: .5em 0; }

/* Diaporama */
.cn-ecran { position: relative; min-height: 26em; display: flex; flex-direction: column; justify-content: center; align-items: center; background: #fff; border: 2px solid #16855a; border-radius: 1.2em; padding: 1.2em; }
.cn-outil:fullscreen { background: #fff; max-width: none; padding: 1.5em; display: flex; flex-direction: column; justify-content: center; }
.cn-outil:fullscreen .cn-ecran { flex: 1; border: 0; }
.cn-outil:fullscreen .cn-rgpd { display: none; }
.cn-pret { font: 700 6em/1 'Fredoka', 'Nunito', sans-serif; color: #16855a; animation: cn-pop .8s ease; }
@keyframes cn-pop { from { transform: scale(.4); opacity: 0; } to { transform: none; opacity: 1; } }
.cn-haut { position: absolute; top: .8em; left: 1em; right: 1em; display: flex; align-items: center; gap: .8em; color: #888; }
.cn-boite .cn-haut { position: static; margin-bottom: .8em; }
.cn-num { font-weight: 700; color: #16855a; }
.cn-theme-lab { padding: .1em .7em; border-radius: 1em; background: #eaf7f1; color: #16855a; font-size: .85em; }
.cn-outils { margin-left: auto; display: flex; gap: .4em; }
.cn-mini { width: 2.4em; height: 2.4em; border-radius: 50%; background: #f3f5f4; color: #555; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.cn-mini:hover { background: #eaf7f1; color: #16855a; }
.cn-mini .icon:before { margin: 0; }
.cn-question { font: 600 clamp(1.6em, 4.2vw, 3em)/1.35 'Fredoka', 'Nunito', sans-serif; color: #222; text-align: center; max-width: 22em; animation: cn-pop .5s ease; }
.cn-outil:fullscreen .cn-question { font-size: clamp(2em, 5.5vw, 4.5em); }
.cn-temps { width: min(36em, 90%); height: .9em; border-radius: 1em; background: #eef1ef; overflow: hidden; margin-top: 2em; }
.cn-temps div { height: 100%; width: 100%; background: #16855a; border-radius: 1em; transition: width .1s linear, background .3s; }
.cn-temps div.urgent { background: #e0524d; }
.cn-sec { margin-top: .4em; font: 700 1.4em/1 'Fredoka', 'Nunito', sans-serif; color: #888; }
.cn-ecran.pause .cn-question { filter: blur(6px); }
.cn-f { display: inline-flex; flex-direction: column; align-items: center; vertical-align: middle; margin: 0 .12em; line-height: 1.1; }
.cn-f > span { padding: 0 .2em; }
.cn-f > span:first-child { border-bottom: .08em solid currentColor; }

/* Autonomie */
.cn-chrono { margin-left: auto; font: 700 1.5em/1 'Fredoka', 'Nunito', sans-serif; color: #16855a; }
.cn-chrono.urgent { color: #e0524d; }
.cn-liste { margin: 0; padding-left: 2em; }
.cn-liste li { display: flex; flex-wrap: wrap; align-items: center; gap: .5em 1em; padding: .5em 0; border-bottom: 1px solid #f0f0f0; list-style: decimal; }
.cn-liste li::marker { color: #16855a; font-weight: 700; }
.cn-q { flex: 1 1 18em; font-size: 1.08em; color: #333; line-height: 1.5; }
.cn-rep { font: 600 1.1em/1.2 'Nunito', sans-serif; width: 8em; padding: .4em .6em; border: 2px solid #e5e5e5; border-radius: .6em; height: auto; }
.cn-rep:focus { outline: none; border-color: #16855a; }

/* Correction */
.cn-score { color: #16855a; font-size: 1.4em; }
.cn-correction { margin: 0; padding-left: 2em; }
.cn-correction li { padding: .6em .2em; border-bottom: 1px solid #f0f0f0; list-style: decimal; cursor: default; }
.cn-correction li::marker { color: #16855a; font-weight: 700; }
.cn-l1 { display: flex; flex-wrap: wrap; align-items: center; gap: .4em 1em; }
.cn-ta { color: #777; }
.ok .cn-ta { color: #16855a; } .ko .cn-ta { color: #c0392b; }
.cn-bonne { margin-left: auto; padding: .1em .7em; border-radius: .6em; background: #eaf7f1; color: #16855a; font-weight: 700; }
.cn-corr { margin-top: .3em; font-size: .9em; color: #777; }
.cn-correction li.cache { cursor: pointer; }
.cn-correction li.cache .cn-bonne, .cn-correction li.cache .cn-corr { filter: blur(7px); opacity: .6; }
.cn-rgpd { margin: 1.2em 0 0; text-align: center; font-size: .8em; color: #999; }
@media (prefers-reduced-motion: reduce) { .cn-pret, .cn-question { animation: none; } }