:root{--fond: #f4f6fb;--surface: #ffffff;--texte: #1d2433;--accent: #3b5bdb;--accent-texte: #ffffff;--juste: #2b8a3e;--faux: #c92a2a;--bordure: #d0d6e2;--rayon: 16px;font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:var(--texte);background:var(--fond);-webkit-tap-highlight-color:transparent}*{box-sizing:border-box}body{margin:0;background:var(--fond);-webkit-user-select:none;user-select:none}button{font:inherit;cursor:pointer;touch-action:manipulation}.ecran{min-height:100dvh;max-width:1100px;margin:0 auto;padding:24px 16px;display:flex;flex-direction:column;align-items:center;gap:24px}.progression{font-size:1.25rem;font-weight:600}.exercice{width:100%;max-width:560px;display:flex;flex-direction:column;gap:16px;text-align:center}.enonce{margin:0;font-size:clamp(1.5rem,4vw,2.25rem);font-weight:600;line-height:1.3}.saisie{display:block;min-height:72px;padding:12px 16px;font-size:clamp(2rem,6vw,2.75rem);font-variant-numeric:tabular-nums;background:var(--surface);border:3px solid var(--bordure);border-radius:var(--rayon)}.saisie.juste{border-color:var(--juste)}.saisie.faux{border-color:var(--faux)}.verdict{display:flex;flex-direction:column;align-items:center;gap:8px;font-size:1.25rem}.verdict p{margin:0}.verdict-titre{font-size:1.75rem;font-weight:700}.verdict.juste .verdict-titre{color:var(--juste)}.verdict.faux .verdict-titre{color:var(--faux)}.pave{width:100%;max-width:400px;display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.touche{min-height:72px;font-size:2rem;font-weight:600;color:var(--texte);background:var(--surface);border:2px solid var(--bordure);border-radius:var(--rayon)}.touche:active:not(:disabled){transform:scale(.96)}.touche:disabled{opacity:.4;cursor:default}.touche-valider{grid-column:1 / -1;color:var(--accent-texte);background:var(--accent);border-color:var(--accent)}.bouton-principal{min-height:64px;padding:0 32px;font-size:1.375rem;font-weight:600;color:var(--accent-texte);background:var(--accent);border:none;border-radius:var(--rayon)}.fin{justify-content:center;text-align:center}.fin h1{margin:0;font-size:2.5rem}.resultat{margin:0;font-size:1.75rem}@media (orientation: landscape) and (min-width: 800px){.serie{display:grid;grid-template-columns:1fr minmax(320px,400px);grid-template-rows:auto 1fr;align-items:center;column-gap:48px}.progression{grid-column:1 / -1;justify-self:center}}
