*{margin:0;padding:0;box-sizing:border-box}body{font-family:Inter,-apple-system,BlinkMacSystemFont,sans-serif;background:#f0f2f5;color:#1a1a2e;min-height:100vh}.app{min-height:100vh;display:flex;flex-direction:column;align-items:center}.intro-container{max-width:720px;width:100%;padding:40px 20px;display:flex;flex-direction:column;align-items:center}.intro-top-bar{width:100%;display:flex;justify-content:flex-start;margin-bottom:12px}.back-selector-btn{background:none;border:2px solid #ccc;border-radius:10px;padding:8px 16px;font-size:.9rem;font-weight:600;color:#666;cursor:pointer;transition:all .2s;font-family:inherit}.back-selector-btn:hover{border-color:#e74c3c;color:#e74c3c}.intro-title{font-size:2.4rem;font-weight:800;color:#1a1a2e;text-align:center}.intro-subtitle{font-size:1.05rem;color:#666;margin-top:6px;margin-bottom:30px;text-align:center}.intro-card{background:#fff;border-radius:16px;box-shadow:0 4px 24px #00000014;width:100%;overflow:hidden}.intro-card-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:20px 28px;display:flex;align-items:center;gap:14px}.intro-card-num{background:#fff3;border-radius:20px;padding:3px 12px;font-size:.8rem;font-weight:600;white-space:nowrap}.intro-card-header h2{font-size:1.2rem;font-weight:600}.intro-card-body{padding:24px 28px;font-size:.95rem;line-height:1.7;color:#333}.intro-card-body p{margin-bottom:12px}.intro-list{margin:10px 0 10px 20px}.intro-list li{margin-bottom:6px}.intro-formula{background:#f8f9ff;border:1px solid #d0d5ff;border-radius:10px;padding:12px 16px;text-align:center;font-weight:600;color:#4a3f8a;margin:12px 0;font-size:1.05rem}.intro-example-box{background:#fff8e7;border-left:4px solid #f0c040;border-radius:8px;padding:12px 16px;margin:12px 0;font-size:.92rem;color:#55401a}.intro-table{width:100%;border-collapse:collapse;margin:14px 0;font-size:.92rem}.intro-table th{background:#f5f5f7;padding:8px 12px;text-align:left;font-weight:600;border-bottom:2px solid #ddd}.intro-table td{padding:7px 12px;border-bottom:1px solid #eee}.aux-avoir{color:#50b86c;font-weight:600}.aux-etre{color:#4a90d9;font-weight:600}.intro-note{font-size:.88rem;color:#666;font-style:italic;margin-top:8px}.intro-warning{background:#fff3e0;border-left:4px solid #e8913a;padding:12px 16px;border-radius:8px;margin:12px 0;font-size:.9rem}.intro-examples{margin:10px 0 10px 20px;color:#444}.intro-examples li{margin-bottom:4px}.intro-rules{margin:10px 0 10px 20px}.intro-rules li{margin-bottom:6px}.intro-vandertramp{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}.v-item{background:#e8f0fe;color:#357abd;padding:4px 10px;border-radius:12px;font-size:.82rem;font-weight:500}.intro-nav{display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:24px;gap:12px;flex-wrap:wrap;justify-content:center}.intro-btn{background:#fff;border:2px solid #667eea;color:#667eea;padding:10px 24px;border-radius:10px;font-weight:600;font-size:.95rem;cursor:pointer;transition:all .2s;font-family:inherit}.intro-btn:hover:not(:disabled){background:#667eea;color:#fff}.intro-btn:disabled{opacity:.4;cursor:not-allowed}.start-btn{background:#667eea;color:#fff}.start-btn:hover{background:#5a6fd6}.intro-dots{display:flex;gap:8px}.dot{width:10px;height:10px;border-radius:50%;background:#ccc;cursor:pointer;transition:background .2s}.dot.active{background:#667eea}.level-card{background:#fff;border:2px solid #e0e0e0;border-radius:16px;padding:28px 24px;cursor:pointer;transition:all .2s;display:flex;flex-direction:column;align-items:center;gap:8px;flex:1;min-width:240px;font-family:inherit;text-align:center}.level-card:hover{border-color:#667eea;box-shadow:0 6px 24px #667eea26;transform:translateY(-3px)}.level-card-advanced{border-color:#d45087}.level-card-advanced:hover{border-color:#b83a6e;box-shadow:0 6px 24px #d4508726}.level-badge{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:1.3rem;font-weight:800;display:flex;align-items:center;justify-content:center}.level-card-advanced .level-badge{background:linear-gradient(135deg,#d45087,#b83a6e)}.level-name{font-size:1.05rem;font-weight:700;color:#1a1a2e}.level-desc{font-size:.85rem;color:#666;line-height:1.4}.level-score{font-size:.8rem;font-weight:600;color:#667eea;margin-top:4px}.level-card-advanced .level-score{color:#d45087}.game-board{max-width:860px;width:100%;padding:30px 20px;display:flex;flex-direction:column;align-items:center}.loading{padding:60px;text-align:center;color:#888}.game-prompt{background:#fff;border-radius:16px;box-shadow:0 4px 24px #00000014;padding:24px 28px;width:100%;text-align:center;margin-bottom:28px}.game-prompt h2{font-size:1.2rem;font-weight:700;margin-bottom:18px;color:#1a1a2e}.prompt-languages{display:flex;align-items:center;justify-content:center;gap:16px;flex-wrap:wrap;margin-bottom:14px}.prompt-lang{display:flex;flex-direction:column;align-items:center;gap:4px}.lang-label{font-size:.75rem;font-weight:600;color:#888;text-transform:uppercase;letter-spacing:.5px}.lang-text{font-size:1.25rem;font-weight:700;color:#1a1a2e}.lang-past{color:#667eea}.prompt-arrow{font-size:1.5rem;color:#bbb}.prompt-french{display:flex;flex-direction:column;align-items:center;gap:4px;margin-top:4px}.french-pres{font-size:1.3rem;font-weight:700;color:#764ba2}.game-cards-area{width:100%;margin-bottom:24px}.game-cards-area h3{font-size:.9rem;font-weight:600;color:#555;margin-bottom:12px;text-align:center}.cards-grid{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.drag-card{background:var(--card-bg);border:2px solid var(--card-border);border-radius:12px;padding:10px 16px;display:flex;flex-direction:column;align-items:center;gap:2px;cursor:grab;-webkit-user-select:none;user-select:none;transition:transform .15s,box-shadow .15s;min-width:70px}.drag-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026}.drag-card:active{cursor:grabbing}.drag-card.in-slot{cursor:pointer;transform:none}.drag-card-small{padding:6px 12px;min-width:54px}.drag-card-type{font-size:.6rem;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:#fffc}.drag-card-text{font-size:1.1rem;font-weight:700;color:#fff}.game-slots,.game-slots-3{display:flex;gap:14px;justify-content:center;width:100%;margin-bottom:24px;flex-wrap:wrap}.game-slots-3 .drop-zone{flex:1;min-width:200px;max-width:300px}.drop-zone{flex:1;min-width:180px;max-width:260px;min-height:110px;border:2px dashed var(--zone-border);background:var(--zone-bg);border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;padding:12px;transition:background .2s}.drop-zone-label{font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:var(--zone-border)}.drop-zone-empty{font-size:.82rem;color:#999;text-align:center}.drop-zone-card-wrapper{position:relative}.drop-zone-remove{position:absolute;top:-8px;right:-8px;width:22px;height:22px;border-radius:50%;border:none;background:#e74c3c;color:#fff;font-weight:700;font-size:.85rem;cursor:pointer;display:flex;align-items:center;justify-content:center;line-height:1}.game-actions{width:100%;display:flex;justify-content:center}.agreement-info{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:10px;padding:6px 16px;background:#f0f0ff;border-radius:8px;font-size:.82rem}.agreement-tag{font-weight:700;color:#764ba2;text-transform:uppercase;letter-spacing:.5px}.agreement-sep{color:#ccc;font-size:.7rem}.validate-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:14px 48px;border-radius:12px;font-size:1.1rem;font-weight:700;cursor:pointer;transition:transform .15s,box-shadow .15s;font-family:inherit}.validate-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea66}.confirm-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;display:flex;align-items:center;justify-content:center;z-index:200;padding:20px}.confirm-box{background:#fff;border-radius:20px;padding:32px 36px;max-width:400px;width:100%;text-align:center;box-shadow:0 12px 40px #0003}.confirm-icon{font-size:2.5rem;margin-bottom:8px;color:#e74c3c}.confirm-title{font-size:1.2rem;font-weight:700;color:#1a1a2e;margin-bottom:10px}.confirm-msg{font-size:.92rem;color:#666;line-height:1.6;margin-bottom:20px}.confirm-actions{display:flex;gap:12px;justify-content:center}.confirm-btn{padding:10px 24px;border-radius:10px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s;border:none;font-family:inherit}.confirm-cancel{background:#f0f0f0;color:#555}.confirm-cancel:hover{background:#e0e0e0}.confirm-accept{background:#e74c3c;color:#fff}.confirm-accept:hover{background:#c0392b}.validation-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;display:flex;align-items:center;justify-content:center;z-index:100;padding:20px}.validation-box{background:#fff;border-radius:20px;padding:32px 36px;max-width:480px;width:100%;text-align:center;box-shadow:0 12px 40px #0003}.validation-icon{font-size:2.8rem;margin-bottom:8px}.val-correct .validation-icon{color:#4caf50}.val-error .validation-icon{color:#e74c3c}.validation-title{font-size:1.3rem;font-weight:700;margin-bottom:12px}.val-correct .validation-title{color:#4caf50}.val-error .validation-title{color:#e74c3c}.validation-msg{font-size:.92rem;color:#444;line-height:1.6;margin-bottom:8px}.validation-btn{margin-top:18px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:12px 36px;border-radius:10px;font-size:1rem;font-weight:600;cursor:pointer;transition:transform .15s;font-family:inherit}.validation-btn:hover{transform:translateY(-2px)}.score-bar{background:#fff;border-radius:14px;box-shadow:0 2px 12px #0000000f;padding:12px 20px;width:100%;display:flex;align-items:center;gap:18px;margin-bottom:20px;flex-wrap:wrap}.score-item{display:flex;flex-direction:column;align-items:center;gap:2px}.score-label{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#999}.score-value{font-size:1rem;font-weight:700;color:#1a1a2e}.score-track{flex:1;min-width:80px;height:8px;background:#e8e8ec;border-radius:4px;overflow:hidden}.score-track-fill{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:4px;transition:width .3s ease}.game-over-overlay{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:20px}.game-over-box{background:#fff;border-radius:24px;padding:40px 44px;max-width:420px;width:100%;text-align:center;box-shadow:0 12px 48px #0000001f}.game-over-icon{font-size:4rem;margin-bottom:8px}.game-over-title{font-size:1.5rem;font-weight:800;color:#1a1a2e;margin-bottom:16px}.game-over-score{margin-bottom:8px}.score-number{font-size:3rem;font-weight:800;color:#667eea}.score-max{font-size:1.5rem;font-weight:600;color:#bbb}.game-over-detail{font-size:.95rem;color:#666;margin-bottom:16px}.game-over-bar{height:10px;background:#e8e8ec;border-radius:5px;overflow:hidden;margin-bottom:24px}.game-over-fill{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:5px;transition:width .5s ease}.restart-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:14px 40px;border-radius:12px;font-size:1.05rem;font-weight:700;cursor:pointer;transition:transform .15s,box-shadow .15s;font-family:inherit}.restart-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #667eea66}@media (max-width: 768px){.game-board{padding:20px 12px}.intro-container{padding:24px 12px}.game-prompt h2{font-size:1.05rem}.prompt-languages{gap:10px}.french-pres{font-size:1.1rem}.drop-zone{min-width:140px;max-width:220px}.level-card{min-width:180px;padding:20px 16px}.race-header{flex-wrap:wrap;justify-content:center}.race-stats{font-size:1.1rem;gap:12px}}@media (max-width: 600px){.intro-title{font-size:1.8rem}.intro-card-header{padding:14px 18px}.intro-card-body{padding:16px 18px}.game-board{padding:16px 10px}.game-prompt{padding:14px 12px;margin-bottom:20px}.game-prompt h2{font-size:1rem}.prompt-languages{gap:6px}.prompt-arrow{font-size:1.2rem}.lang-text,.lang-past{font-size:.95rem}.french-pres{font-size:1.05rem}.drop-zone{min-width:90px;min-height:76px;padding:6px;max-width:180px}.drop-zone-label{font-size:.65rem}.drop-zone-empty{font-size:.7rem}.cards-grid{gap:6px}.drag-card{padding:6px 10px;min-width:50px}.drag-card-text{font-size:.95rem}.drag-card-small{padding:4px 8px;min-width:44px}.drag-card-type{font-size:.5rem}.validation-box{padding:20px 16px;margin:10px}.validation-title{font-size:1.1rem}.validation-btn{padding:10px 28px;font-size:.9rem}.score-bar{padding:10px 14px;gap:10px}.score-value{font-size:.85rem}.validate-btn{padding:12px 32px;font-size:1rem}.confirm-box{padding:24px 20px}.game-over-box{padding:28px 20px}.game-over-icon{font-size:3rem}.game-over-title{font-size:1.3rem}.score-number{font-size:2.2rem}.level-card{min-width:150px;padding:16px 12px}.level-name{font-size:.95rem}.race-board{padding:12px}.race-stats{font-size:1rem;gap:10px}.race-heart{font-size:1.3rem}.race-timer{font-size:1rem}}@media (max-width: 420px){.intro-title{font-size:1.5rem}.intro-subtitle{font-size:.9rem}.game-prompt{padding:12px 10px}.game-prompt h2{font-size:.9rem}.prompt-languages{flex-direction:column;gap:6px}.prompt-arrow{transform:rotate(90deg)}.lang-text{font-size:.85rem}.french-pres{font-size:.95rem}.drop-zone{min-width:70px;min-height:64px;max-width:140px}.drop-zone-label{font-size:.6rem}.drag-card{padding:5px 8px;min-width:44px}.drag-card-text{font-size:.85rem}.score-bar{padding:8px 10px;gap:6px}.score-value{font-size:.78rem}.score-label{font-size:.55rem}.validate-btn{padding:10px 24px;font-size:.9rem}.confirm-box{padding:20px 16px}.confirm-title{font-size:1rem}.game-over-box{padding:24px 16px}.level-card{min-width:130px;padding:12px 10px}.level-badge{width:36px;height:36px;font-size:1.1rem}.level-name{font-size:.85rem}.level-desc{font-size:.75rem}.race-board{padding:8px}.race-stats{font-size:.85rem;gap:8px}.race-heart{font-size:1.1rem}.race-score,.race-timer{font-size:.85rem}}.race-board{max-width:860px;margin:0 auto;padding:20px;text-align:center}.race-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px;gap:12px}.race-stats{display:flex;align-items:center;gap:18px;font-size:1.3rem}.race-lives{display:flex;gap:4px}.race-heart{font-size:1.6rem;transition:transform .2s}.heart-full{color:#e74c3c}.heart-empty{color:#555}.race-timer{font-variant-numeric:tabular-nums;font-weight:700;color:var(--text);min-width:50px;text-align:center}.race-timer[data-low=true]{color:#e74c3c;animation:pulse .5s ease-in-out infinite alternate}@keyframes pulse{0%{opacity:1}to{opacity:.5}}.race-score{font-weight:700;color:var(--accent)}.race-question-info{display:flex;align-items:center;justify-content:center;gap:12px;margin-bottom:10px}.race-level-badge{display:inline-block;background:var(--accent);color:#fff;padding:4px 14px;border-radius:20px;font-size:.85rem;font-weight:600}.race-points-anim{display:inline-block;color:#2ecc71;font-weight:800;font-size:1.2rem;animation:pointsPop .5s ease-out}@keyframes pointsPop{0%{transform:scale(.5);opacity:0}50%{transform:scale(1.3);opacity:1}to{transform:scale(1);opacity:1}}.race-start-section{margin-top:30px;width:100%;display:flex;justify-content:center}.race-start-button{display:flex;flex-direction:column;align-items:center;gap:8px;padding:20px 40px;border:3px solid var(--accent);border-radius:18px;background:linear-gradient(135deg,#3498db1a,#9b59b61a);cursor:pointer;transition:all .25s;width:100%;max-width:400px}.race-start-button:hover{background:linear-gradient(135deg,#3498db33,#9b59b633);transform:translateY(-2px);box-shadow:0 6px 20px #00000026}.race-start-icon{font-size:2.5rem}.race-start-text{font-size:1.4rem;font-weight:700;color:var(--text)}.race-start-desc{font-size:.85rem;color:var(--text-secondary, #888)}.race-final-score{font-size:2rem;font-weight:800;color:var(--accent);margin:16px 0}.race-encourage{font-size:1.1rem;margin:12px 0;color:var(--text-secondary, #888)}.race-exit-btn{margin-top:18px;padding:12px 36px;font-size:1rem;background:var(--accent);color:#fff;border:none;border-radius:12px;cursor:pointer;transition:background .2s}.race-exit-btn:hover{filter:brightness(1.1)}