@import"https://fonts.googleapis.com/css2?family=Nunito:wght@700;800;900&display=swap";:root{--bg: #ffffff;--surface: #f7f7f7;--ink: #3c3c3c;--muted: #afafaf;--green: #58cc02;--green-shadow: #58a700;--blue: #1cb0f6;--blue-shadow: #1899d6;--yellow: #ffc800;--red: #ff4b4b;--purple: #ce82ff}*{box-sizing:border-box}html,body{margin:0;padding:0;min-height:100%;font-family:Nunito,system-ui,-apple-system,sans-serif;font-weight:800;color:var(--ink);background:var(--bg);-webkit-user-select:none;user-select:none}#app{min-height:100vh;display:flex;flex-direction:column;align-items:center;padding:16px;gap:14px;max-width:720px;margin:0 auto}header{display:flex;flex-direction:column;gap:12px;width:100%;padding:12px 16px;border-bottom:2px solid #e5e5e5}.header-top{display:flex;align-items:center;gap:16px;flex-wrap:wrap;justify-content:space-between}h1{font-size:clamp(20px,3.6vw,28px);margin:0;font-weight:900;color:var(--ink);letter-spacing:-.5px}#stars{font-size:24px;min-height:28px;background:var(--surface);padding:6px 14px;border-radius:999px;border:2px solid #e5e5e5}#levelbar{display:flex;gap:8px;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;padding:6px 4px 10px;scrollbar-width:thin}#levelbar::-webkit-scrollbar{height:6px}#levelbar::-webkit-scrollbar-thumb{background:#e5e5e5;border-radius:3px}.level-dot{flex:0 0 auto}.level-dot{width:36px;height:36px;border-radius:12px;background:var(--surface);color:var(--muted);display:inline-flex;align-items:center;justify-content:center;font-size:14px;font-weight:900;cursor:pointer;border:2px solid #e5e5e5;font-family:inherit;transition:transform .12s,background .15s}.level-dot.done{background:var(--green);color:#fff;border-color:var(--green-shadow);box-shadow:0 2px 0 var(--green-shadow)}.level-dot.active{background:var(--blue);color:#fff;border-color:var(--blue-shadow);box-shadow:0 3px 0 var(--blue-shadow);transform:translateY(-1px)}.level-dot:hover{transform:translateY(-2px)}.level-dot.active:hover{transform:translateY(-3px)}canvas{background:var(--surface);border:2px solid #e5e5e5;border-radius:20px;touch-action:none;max-width:95vw;max-height:65vh;aspect-ratio:1 / 1}footer{display:flex;gap:12px;margin-top:4px;flex-wrap:wrap;justify-content:center;width:100%;padding:12px;border-top:2px solid #e5e5e5}button{font-family:inherit;font-weight:800;font-size:15px;letter-spacing:.8px;text-transform:uppercase;padding:12px 22px;min-width:100px;border:none;border-radius:14px;background:var(--green);color:#fff;box-shadow:0 4px 0 var(--green-shadow);cursor:pointer;transition:transform .08s,box-shadow .08s}button:hover{filter:brightness(1.05)}button:active{transform:translateY(2px);box-shadow:0 2px 0 var(--green-shadow)}button.secondary{background:#fff;color:var(--blue);border:2px solid #e5e5e5;box-shadow:0 4px #e5e5e5}button.secondary:active{box-shadow:0 2px #e5e5e5}.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;animation:fadein .25s ease}.overlay.hidden{display:none}.overlay-card{background:#fff;border-radius:24px;padding:32px 28px;max-width:420px;width:100%;text-align:center;box-shadow:0 12px 40px #00000040;animation:pop-in .4s ease}@keyframes pop-in{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}@keyframes fadein{0%{opacity:0}to{opacity:1}}.big-emoji{font-size:72px;margin-bottom:8px;line-height:1}.overlay-card h2{margin:0 0 24px;font-size:22px;font-weight:900;line-height:1.3}.overlay-buttons{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}.more-games{margin:16px 0 8px;text-align:center;color:#777;font-size:14px;font-weight:700}.more-games a{color:var(--blue);text-decoration:none;border-bottom:2px solid var(--blue);padding-bottom:1px}.more-games a:hover{color:var(--blue-shadow);border-color:var(--blue-shadow)}.celebrate{animation:pop .55s ease;display:inline-block}@keyframes pop{0%{transform:scale(1)}40%{transform:scale(1.15) rotate(-2deg)}70%{transform:scale(1.08) rotate(2deg)}to{transform:scale(1)}}