@import"https://fonts.googleapis.com/css2?family=Nunito:wght@700;800;900&display=swap";.screen{display:none;width:100%;height:100%;overflow-y:auto;overflow-x:hidden}.screen.active{display:flex;flex-direction:column}#screen-settings{padding:32px 28px 40px;align-items:flex-start}.sett-layout{display:grid;grid-template-columns:1fr 1fr;gap:24px;width:100%;max-width:1000px;margin:0 auto}.sett-col{display:flex;flex-direction:column;gap:20px}.sett-block{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:24px;display:flex;flex-direction:column;gap:16px}.sett-block--formes{flex:1}.sett-heading{font-family:var(--font-ui);font-size:.72rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.1em;margin:0;display:flex;align-items:center;gap:7px}.sett-heading span{font-size:1.1rem}.range-row{display:flex;align-items:center;gap:14px;flex-wrap:wrap}.range-field{display:flex;align-items:center;gap:10px}.range-field label{font-size:1rem;font-weight:600;color:var(--muted);font-family:var(--font-ui)}.range-sep{font-size:1.2rem;color:var(--border-strong);font-weight:300}.num-input{width:80px;padding:10px 12px;border:1.5px solid var(--border);border-radius:var(--r-md);font-size:1.3rem;font-weight:800;color:var(--text);font-family:"Nunito",var(--font-ui);text-align:center;background:var(--surface);transition:border-color .15s,box-shadow .15s;-moz-appearance:textfield}.num-input::-webkit-outer-spin-button,.num-input::-webkit-inner-spin-button{-webkit-appearance:none}.num-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-tint)}.pill-row{display:flex;gap:8px;flex-wrap:wrap}.pill{padding:10px 20px;border-radius:var(--r-md);border:1.5px solid var(--border);background:var(--surface);font-size:1rem;font-weight:700;cursor:pointer;transition:all .15s;color:var(--text);font-family:var(--font-ui);user-select:none;min-height:48px;display:flex;align-items:center}.pill:hover{border-color:var(--accent);color:var(--accent)}.pill.selected{border-color:var(--accent);background:var(--accent);color:#fff}.mode-cards{display:flex;gap:10px}.mode-card{flex:1;padding:16px;border-radius:var(--r-md);border:1.5px solid var(--border);background:var(--surface);cursor:pointer;font-family:var(--font-ui);transition:all .15s;text-align:left;display:flex;flex-direction:column;gap:4px;min-height:80px}.mode-card:hover{border-color:var(--accent)}.mode-card.active{border-color:var(--accent);background:var(--accent-tint)}.mc-icon{font-size:1.5rem}.mc-name{font-size:1rem;font-weight:700;color:var(--text)}.mc-desc{font-size:.78rem;color:var(--muted);line-height:1.4}.mode-card.active .mc-name{color:var(--accent)}.flash-options{background:var(--accent-tint);border:1px solid var(--accent-light);border-radius:var(--r-md);padding:14px 16px;display:flex;flex-direction:column;gap:10px;margin-top:4px}.flash-dur-label{font-size:.78rem;font-weight:700;color:var(--accent);text-transform:uppercase;letter-spacing:.08em;font-family:var(--font-ui)}.flash-time-row{display:flex;align-items:center;gap:14px}.flash-slider{flex:1;accent-color:var(--accent);cursor:pointer}.flash-time-val{font-size:1.15rem;font-weight:800;color:var(--accent);min-width:52px;text-align:right;font-family:var(--font-ui)}.formes-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.forme-chip{display:flex;align-items:center;gap:9px;padding:11px 14px;border-radius:var(--r-md);border:1.5px solid var(--border);background:var(--surface);cursor:pointer;font-family:var(--font-ui);transition:all .15s;user-select:none;min-height:48px}.forme-chip:hover{border-color:var(--accent)}.forme-chip.active{border-color:var(--accent);background:var(--accent);color:#fff}.chip-icon{font-size:1.2rem;flex-shrink:0}.chip-label{font-size:.88rem;font-weight:700;flex:1}.chip-note{font-size:.68rem;font-weight:600;opacity:.7;flex-shrink:0}.btn-start{width:100%;padding:20px;background:var(--accent);color:#fff;border:none;border-radius:var(--r-lg);font-size:1.15rem;font-weight:700;cursor:pointer;transition:all .15s;font-family:var(--font-ui);letter-spacing:.01em;box-shadow:0 4px 16px oklch(from var(--accent) l c h / .3)}.btn-start:hover{background:var(--accent-hover);transform:translateY(-1px);box-shadow:0 6px 20px oklch(from var(--accent) l c h / .35)}.btn-start:disabled{opacity:.4;cursor:not-allowed;transform:none;box-shadow:none}@media(max-width:720px){#screen-settings{padding:20px 16px 32px}.sett-layout{grid-template-columns:1fr}.formes-grid{grid-template-columns:repeat(3,1fr)}}#screen-game{padding:14px 18px 20px;gap:12px}.game-cluster{display:flex;flex-direction:column;gap:12px;flex:1 1 0;min-width:0;min-height:0}.game-header{display:flex;align-items:center;gap:10px;width:100%;flex-shrink:0}.game-score-wrap{display:flex;gap:8px;flex:1}.score-badge{background:var(--success-bg);border-radius:var(--r-md);padding:8px 20px;font-size:clamp(1rem,2vw,1.3rem);font-weight:800;color:var(--success);border:1px solid oklch(from var(--success) l c h / .25);font-family:"Nunito",var(--font-ui)}.error-badge{background:var(--unread-bg);border-radius:var(--r-md);padding:8px 20px;font-size:clamp(1rem,2vw,1.3rem);font-weight:800;color:var(--unread);border:1px solid oklch(from var(--unread) l c h / .2);font-family:"Nunito",var(--font-ui)}.progress-info{font-size:clamp(.9rem,2vw,1.1rem);font-weight:700;color:var(--muted);white-space:nowrap;font-family:var(--font-ui)}.btn-stop-game{background:transparent;border:1px solid var(--border);border-radius:var(--r-md);padding:8px 16px;font-size:.85rem;font-weight:600;color:var(--muted);cursor:pointer;font-family:var(--font-ui);transition:all .15s;white-space:nowrap}.btn-stop-game:hover{border-color:var(--unread);color:var(--unread);background:var(--unread-bg)}.prog-wrap{width:100%;height:8px;background:var(--surface-alt, #E5E6E1);border-radius:99px;overflow:hidden;flex-shrink:0}.prog-bar{height:100%;background:var(--accent);border-radius:99px;transition:width .5s ease}.display-zone{flex:1 1 0;min-height:0;width:100%;background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--shadow-md);border:1px solid var(--border);display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:24px;container-type:size;container-name:display}#repr-container{flex:1 1 0;min-height:0;width:100%;display:flex;align-items:center;justify-content:center;container-type:size;container-name:repr}.flash-overlay{position:absolute;inset:0;background:#081319;border-radius:var(--r-lg);z-index:10;display:flex;align-items:center;justify-content:center}.flash-msg{font-family:"Nunito",var(--font-ui);font-size:clamp(6rem,min(60cqh,42cqw),30rem);font-weight:900;color:#303d43;line-height:1;user-select:none}.state-badge{position:absolute;top:14px;right:16px;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:4px 12px;border-radius:var(--r-pill);font-family:var(--font-ui)}.state-badge.flash{background:var(--warn-bg);color:var(--warn-text)}.state-badge.verif{background:var(--success-bg);color:var(--success)}.state-badge.normal{background:var(--accent-light);color:var(--accent)}.flash-timer-bar{position:absolute;bottom:0;left:0;height:5px;background:var(--warn-text, #6F4E10);border-radius:0 0 var(--r-lg) var(--r-lg);transition:width linear}.game-instruction{font-size:clamp(.95rem,2vw,1.2rem);font-weight:600;color:var(--muted);text-align:center;font-family:var(--font-ui);margin:0;flex-shrink:0}.action-zone{width:100%;display:flex;flex-direction:column;gap:10px;flex-shrink:0}.action-btn-row{display:flex;gap:12px}.btn-correct{flex:1;padding:22px 16px;background:var(--success);color:#fff;border:none;border-radius:var(--r-md);font-size:clamp(1.1rem,2.5vw,1.4rem);font-weight:800;cursor:pointer;transition:opacity .15s,transform .1s;font-family:var(--font-ui);letter-spacing:.01em}.btn-correct:hover:not(:disabled){opacity:.9;transform:translateY(-1px)}.btn-error{flex:1;padding:22px 16px;background:var(--unread);color:#fff;border:none;border-radius:var(--r-md);font-size:clamp(1.1rem,2.5vw,1.4rem);font-weight:800;cursor:pointer;transition:opacity .15s,transform .1s;font-family:var(--font-ui);letter-spacing:.01em}.btn-error:hover:not(:disabled){opacity:.9;transform:translateY(-1px)}.btn-next{width:100%;padding:20px;background:var(--text);color:#fff;border:none;border-radius:var(--r-md);font-size:clamp(.95rem,2vw,1.2rem);font-weight:700;cursor:pointer;transition:opacity .15s,transform .1s;font-family:var(--font-ui)}.btn-next:hover:not(:disabled){opacity:.85}.btn-reveal{width:100%;padding:22px;background:var(--warn-bg);color:var(--warn-text);border:2px solid var(--warn-border);border-radius:var(--r-md);font-size:clamp(1.1rem,2.5vw,1.35rem);font-weight:800;cursor:pointer;transition:all .15s;font-family:var(--font-ui)}.btn-reveal:hover{background:var(--warn-text);color:#fff;border-color:var(--warn-text)}button:disabled{opacity:.35;cursor:not-allowed!important;transform:none!important}.rep-chiffre{font-size:clamp(8rem,min(78cqh,52cqw),56rem);font-weight:900;color:var(--text);font-family:"Nunito",var(--font-ui);line-height:1}.rep-des{display:flex;gap:clamp(10px,3cqw,40px);flex-wrap:wrap;justify-content:center;align-items:center}.rep-des svg{width:clamp(70px,min(62cqh,44cqw),420px);height:clamp(70px,min(62cqh,44cqw),420px)}.rep-des:has(svg:only-child) svg{width:clamp(90px,min(78cqh,64cqw),560px);height:clamp(90px,min(78cqh,64cqw),560px)}.rep-barres{display:flex;flex-direction:column;align-items:center;gap:clamp(6px,2cqh,20px)}.rep-barres-row{display:flex;gap:clamp(6px,1.5cqw,20px)}.rep-numicon{display:flex;align-items:center;justify-content:center}.rep-oursons{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:clamp(8px,2.5cqh,36px);max-width:92%}.ourson{display:inline-block;animation:pop-in .3s ease-out both}@keyframes pop-in{0%{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}.rep-doigts{display:flex;justify-content:center;align-items:center;width:100%;height:100%}.main-img{object-fit:contain;max-width:100%;max-height:100%;border-radius:8px}.rep-boulier{display:flex;flex-direction:column;gap:clamp(5px,1.2cqh,12px);align-items:center}.boulier-frame{background:#5d4037;border-radius:clamp(8px,1.5cqw,16px);padding:clamp(10px,1.5cqw,20px) clamp(14px,2cqw,28px);display:flex;flex-direction:column;gap:clamp(6px,1cqh,12px);box-shadow:5px 6px #00000040}.boulier-tige{display:flex;align-items:center;gap:0;position:relative}.boulier-barre{position:absolute;width:100%;height:clamp(5px,.6cqh,8px);background:#8d6e63;border-radius:2px;top:50%;transform:translateY(-50%);z-index:0}.boulier-beads{display:flex;gap:clamp(3px,.4cqw,6px);z-index:1;position:relative}.bead{border-radius:50%;transition:all .25s}.bead.on{background:radial-gradient(circle at 35% 35%,#ef5350,#b71c1c);box-shadow:2px 2px 5px #0006}.bead.off{background:radial-gradient(circle at 35% 35%,#cfd8dc,#90a4ae);box-shadow:1px 1px 3px #0003}.bead.diz.on{background:radial-gradient(circle at 35% 35%,#42a5f5,#1565c0)}#screen-end{padding:32px 28px;align-items:center;justify-content:center;gap:20px}.end-hero{background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);padding:40px 48px;width:100%;max-width:560px;text-align:center;display:flex;flex-direction:column;gap:28px;box-shadow:var(--shadow-md)}.end-title{font-size:clamp(1.6rem,5vw,2.4rem);font-weight:900;color:var(--text);font-family:"Nunito",var(--font-ui);margin:0;animation:flash-reveal .5s ease-out}.end-scores{display:flex;align-items:center;justify-content:center;gap:0}.end-sc-divider{width:1px;height:60px;background:var(--border);margin:0 32px}.end-sc-item{display:flex;flex-direction:column;align-items:center;gap:6px}.end-sc-num{font-size:clamp(3.5rem,10vw,5rem);font-weight:900;line-height:1;font-family:"Nunito",var(--font-ui)}.end-sc-num.good{color:var(--success)}.end-sc-num.bad{color:var(--unread)}.end-sc-label{font-size:.8rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-family:var(--font-ui)}.end-percent{font-size:1.5rem;font-weight:800;color:var(--accent);font-family:var(--font-ui);margin:0}.btn-restart{width:100%;max-width:560px;padding:18px;background:var(--text);color:#fff;border:none;border-radius:var(--r-lg);font-size:1rem;font-weight:700;cursor:pointer;transition:opacity .15s,transform .1s;font-family:var(--font-ui)}.btn-restart:hover{opacity:.85;transform:translateY(-1px)}.modal-overlay{display:none;position:fixed;inset:0;background:#0813198c;z-index:300;align-items:center;justify-content:center;backdrop-filter:blur(3px)}.modal-overlay.open{display:flex}.modal-box{background:var(--surface);border-radius:var(--r-lg);border:1px solid var(--border);padding:32px 28px;max-width:360px;width:90%;text-align:center;box-shadow:var(--shadow-lg);animation:modal-in .2s ease-out}@keyframes modal-in{0%{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}.modal-box h3{font-size:1.15rem;font-family:var(--font-ui);font-weight:700;margin:0 0 8px;color:var(--text)}.modal-box p{color:var(--muted);margin:0 0 24px;font-size:.9rem;font-family:var(--font-ui)}.modal-actions{display:flex;gap:10px}.modal-actions button{flex:1;padding:13px;border-radius:var(--r-md);font-size:.95rem;font-weight:700;cursor:pointer;font-family:var(--font-ui);transition:opacity .15s}.btn-m-cancel{background:var(--surface);color:var(--text);border:1.5px solid var(--border)}.btn-m-cancel:hover{background:var(--surface-alt)}.btn-m-confirm{background:var(--accent);color:#fff;border:none}.btn-m-confirm:hover{background:var(--accent-hover)}.confetti-container{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:200;overflow:hidden}.confetti-piece{position:absolute;top:-20px;animation:fall linear forwards;border-radius:2px}@keyframes fall{to{transform:translateY(110vh) rotate(720deg);opacity:0}}@keyframes flash-reveal{0%{transform:scale(.7);opacity:0}65%{transform:scale(1.04)}to{transform:scale(1);opacity:1}}.reveal-anim{animation:flash-reveal .35s ease-out}@keyframes correct-bounce{0%,to{transform:scale(1)}40%{transform:scale(1.05)}}.correct-anim{animation:correct-bounce .35s ease-out}.pill,.forme-chip,.mode-card,.btn-start,.btn-stop-game,.btn-correct,.btn-error,.btn-next,.btn-reveal,.btn-restart{touch-action:manipulation;-webkit-tap-highlight-color:transparent}@media(max-height:850px)and (min-width:700px){#screen-game{flex-direction:row;align-items:stretch;padding:12px 20px;gap:16px}.game-cluster{min-width:300px}.display-zone{min-height:0}.action-zone{width:280px;flex-shrink:0;align-self:stretch;justify-content:center}.score-badge,.error-badge{padding:6px 14px;font-size:clamp(.8rem,1.4vw,1rem)}.btn-correct,.btn-error,.btn-reveal{padding:clamp(14px,2vh,18px) 16px;font-size:clamp(.95rem,1.8vw,1.1rem)}.game-instruction{font-size:clamp(.85rem,1.6vw,1rem)}}