*{box-sizing:border-box}body{color:#2b2b3a;background:linear-gradient(160deg,#fdf6e3 0%,#d6ecff 60%,#e8ffe8 100%);min-height:100vh;margin:0;font-family:Comic Sans MS,Chalkboard SE,Segoe UI,system-ui,sans-serif}#root{justify-content:center;align-items:flex-start;min-height:100vh;padding:24px 12px;display:flex}button{cursor:pointer;font-family:inherit}code{background:#f0eee6;border-radius:6px;padding:2px 6px;font-size:.95em}.app{width:100%;max-width:560px}.card{text-align:center;background:#fff;border-radius:24px;padding:28px;box-shadow:0 8px 30px #283c7826}h1{margin:0 0 8px;font-size:1.9rem}.subtitle{color:#5a5a72;font-size:1.15rem}.error{color:#c0392b;background:#fdecea;border-radius:10px;padding:10px}.hint{color:#777;font-size:.9rem}.user-list{flex-direction:column;gap:12px;margin-top:16px;display:flex}.user-btn{background:#f2f8ff;border:3px solid #7eb6ff;border-radius:16px;justify-content:space-between;align-items:center;padding:16px 20px;font-size:1.3rem;transition:transform .1s,background .15s;display:flex}.user-btn:hover{background:#dceeff;transform:scale(1.02)}.user-name{font-weight:700}.user-solved{color:#6a7a8c;font-size:.95rem}.game header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;margin-bottom:12px;font-size:.95rem;display:flex}.progress{font-weight:700}.link{color:#4a7bd0;background:0 0;border:none;padding:0;font-size:.85rem;text-decoration:underline}.to-move{border-radius:999px;margin-bottom:12px;padding:8px 22px;font-size:1.25rem;font-weight:700;display:inline-block}.to-move.white{background:#f5f5f0;border:2px solid #bbb}.to-move.black{color:#fff;background:#2b2b3a}.puzzle-meta{justify-content:center;align-items:center;gap:10px;display:flex}.puzzle-meta .to-move{margin-bottom:0}.moves-chip{color:#4a3000;background:#fff3d6;border:2px solid #ffb703;border-radius:999px;padding:6px 14px;font-weight:700;display:inline-block}.puzzle-meta+.board-wrap,.puzzle-meta+img.board{margin-top:12px}.difficulty-btns{justify-content:center;gap:14px;margin:16px 0 8px;display:flex}.big-btn.hard{color:#fff;background:#ff5d5d}.board{border:4px solid #8a5a2b;border-radius:12px;width:100%;max-width:420px}.board-wrap{border:4px solid #8a5a2b;border-radius:12px;width:100%;max-width:420px;margin:0 auto;position:relative;overflow:hidden}.promo-picker{z-index:10;background:#ffffffeb;justify-content:center;align-items:center;gap:10px;font-size:1.1rem;font-weight:700;display:flex;position:absolute;inset:0}.promo-picker button{background:#fff;border:3px solid #7eb6ff;border-radius:12px;padding:8px 12px;font-size:2rem;line-height:1}.promo-picker button:hover{background:#eaf3ff;transform:scale(1.08)}.board-controls{justify-content:center;align-items:center;gap:12px;min-height:52px;margin-top:14px;display:flex}.board-controls .big-btn.reset{color:#495057;background:#e9ecef}.board-hint{margin:0}.puzzle-nav{justify-content:center;align-items:center;gap:10px;margin-top:14px;display:flex}.nav-btn{color:#2b5d99;background:#fff;border:2px solid #7eb6ff;border-radius:12px;padding:8px 18px;font-size:1rem;font-weight:700;transition:transform .1s}.nav-btn:hover:not(:disabled){background:#eaf3ff;transform:scale(1.05)}.nav-btn:disabled{opacity:.5}.nav-hint{color:#888;font-size:.85rem}.answer-form{justify-content:center;gap:10px;margin-top:14px;display:flex}.answer-form input{border:3px solid #7eb6ff;border-radius:12px;flex:1;max-width:320px;padding:12px 14px;font-family:inherit;font-size:1.2rem}.answer-form input:focus{border-color:#3d8bff;outline:none}.answer-form button,.big-btn{color:#4a3000;background:#ffb703;border:none;border-radius:12px;padding:12px 24px;font-size:1.2rem;font-weight:700;transition:transform .1s}.answer-form button:hover:not(:disabled),.big-btn:hover{transform:scale(1.05)}.answer-form button:disabled{opacity:.5;cursor:default}.feedback{padding:20px 0;font-size:1.1rem}.feedback-big{margin-bottom:10px;font-size:2rem;font-weight:700}.feedback-big.good{color:#1d8a3c}.feedback-big.bad{color:#c0392b}.big-btn{margin-top:14px;display:inline-block}.final-score{font-size:1.3rem}.summary h2{margin-top:20px;font-size:1.05rem}.missed{text-align:left;margin:0 0 10px;padding:0;font-size:.92rem;list-style:none}.missed li{border-bottom:1px dashed #ddd;flex-direction:column;padding:8px 12px;display:flex}.summary .link{margin:10px auto 0;display:block}.level-emoji{font-size:1.3rem}.streak{color:#e25822;font-weight:700}.points-earned{color:#b8860b;margin:4px 0;font-size:1.25rem;font-weight:700}.banner{border-radius:14px;max-width:420px;margin:10px auto;padding:12px 16px;font-size:1.05rem;animation:.4s pop}.banner.level-up{background:linear-gradient(90deg,#fff3b0,#ffd166);border:2px solid #e0a800}.banner.badge-new{background:linear-gradient(90deg,#d9f2ff,#b5e2ff);border:2px solid #5aa9e6}@keyframes pop{0%{opacity:0;transform:scale(.6)}70%{transform:scale(1.06)}to{opacity:1;transform:scale(1)}}.level-line{margin:8px 0 4px;font-size:1.05rem}.level-bar-wrap{max-width:360px;margin:0 auto 12px}.level-bar{background:#eee;border:2px solid #ddd;border-radius:999px;height:16px;overflow:hidden}.level-bar-fill{background:linear-gradient(90deg,#7ed957,#38b000);border-radius:999px;height:100%;transition:width .6s}.level-bar-label{color:#777;font-size:.8rem}.modal-backdrop{z-index:10;background:#14142873;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.modal{width:100%;max-width:520px;max-height:86vh;overflow-y:auto}.badge-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin:14px 0;display:grid}.badge{border-radius:14px;flex-direction:column;align-items:center;gap:2px;padding:10px 8px;display:flex}.badge.earned{background:#fff8e1;border:2px solid #ffd166}.badge.locked{opacity:.65;background:#f4f4f6;border:2px dashed #ccc}.badge-emoji{font-size:1.7rem}.badge-name{font-size:.85rem;font-weight:700}.badge-desc{color:#777;font-size:.72rem}.confetti{pointer-events:none;z-index:20;position:fixed;inset:0;overflow:hidden}.confetti span{animation:2.6s linear forwards fall;position:absolute;top:-30px}@keyframes fall{0%{opacity:1;transform:translateY(0)rotate(0)}85%{opacity:1}to{opacity:0;transform:translateY(105vh)rotate(360deg)}}.review-board{flex-direction:column;align-items:center;gap:6px;margin:6px 0;display:flex}.review-board .to-move{margin-bottom:8px;padding:4px 14px;font-size:.95rem}.board.small{max-width:300px}
