html,body,#root{-webkit-font-smoothing:antialiased;-webkit-user-select:none;user-select:none;background:#d6eeff;height:100%;margin:0;font-family:Fredoka Variable,Comic Sans MS,system-ui,sans-serif;overflow:hidden}.stage{touch-action:none;position:fixed;inset:0}.hud{pointer-events:none;--corner-room:236px;color:#fff;paint-order:stroke fill;-webkit-text-stroke:5px #2b2b30;text-shadow:0 3px #2b2b304d;font-weight:600;position:fixed;inset:0}.hud button{pointer-events:auto;font:inherit;color:#2b2b30;-webkit-text-stroke:0;text-shadow:none;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;border:0;font-weight:600}.hud button:focus-visible{outline:4px solid #f2c14e}.hud .icon{display:block;overflow:visible}.wish{background:#ffffffdb;border-radius:22px;align-items:center;gap:8px;min-width:64px;min-height:64px;padding:6px 14px 6px 10px;display:flex;position:absolute;top:16px;left:16px;box-shadow:0 5px #2b2b304d}.wish:active{transform:translateY(3px);box-shadow:0 2px #2b2b304d}.wish .crown{font-size:24px;line-height:1}.wish .crown.big{padding:4px 6px;font-size:clamp(34px,4vw,48px)}.wish .pips{flex-wrap:wrap;gap:5px;max-width:60px;display:flex}.wish .pips i{box-sizing:border-box;background:#d9d0bc;border:2px solid #2b2b30;border-radius:50%;width:14px;height:14px}.wish .pips i.lit{background:#f2c14e}.wish.done{background:#fff1b8;animation:.5s ease-in-out 5 bounce}.wish .spark{font-size:40px;line-height:1;animation:.5s ease-in-out infinite alternate twinkle;position:absolute;top:-18px;right:-14px}.store{background:#ffffff8c;border-radius:18px;grid-template-columns:repeat(5,clamp(38px,4.4vw,50px));gap:2px 4px;padding:6px 8px;display:grid;position:absolute;top:14px;right:16px}.good{-webkit-text-stroke:4px #2b2b30;flex-direction:column;align-items:center;font-size:clamp(16px,2vw,24px);line-height:1;display:flex}.good .icon{filter:drop-shadow(0 2px #2b2b3040)}.good.bump{animation:.4s cubic-bezier(.2,1.6,.4,1) both bump}.corner{gap:12px;display:flex;position:absolute;bottom:12px;right:12px}.hud button.round{background:#ffffffd1;border-radius:50%;width:64px;height:64px;font-size:30px;line-height:1;box-shadow:0 4px #2b2b304d}.hud button.round:active{transform:translateY(3px);box-shadow:0 1px #2b2b304d}.bar{left:8px;right:var(--corner-room);justify-content:center;display:flex;position:absolute;bottom:2px}.pieces{pointer-events:auto;scrollbar-width:none;touch-action:pan-x;gap:8px;max-width:100%;padding:12px 6px 10px;display:flex;overflow-x:auto}.pieces::-webkit-scrollbar{display:none}.hud button.piece{box-sizing:border-box;background:#ffffffdb;border-radius:18px;flex-direction:column;flex:none;align-items:center;gap:3px;width:clamp(64px,5.6vw,76px);min-height:64px;padding:6px 4px 8px;transition:transform .15s,background .15s,opacity .15s;display:flex;box-shadow:0 5px #2b2b304d}.piece .pic{display:block}.piece .pic .icon{width:clamp(44px,4vw,52px);height:clamp(44px,4vw,52px)}.piece .cost{flex-wrap:wrap;justify-content:center;gap:2px;max-width:54px;min-height:16px;display:flex}.hud button.piece.selected{background:#f2c14e;transform:translateY(-6px)scale(1.08);box-shadow:0 5px #c99a2e}.hud button.piece.poor{opacity:.6}.hud button.piece:active{transform:translateY(3px);box-shadow:0 2px #2b2b304d}.hud button.piece.wiggle{animation:.3s ease-in-out infinite wiggle}.hud button.piece.ding .pic{animation:.6s cubic-bezier(.2,1.6,.4,1) both ding}.hud button.piece.ding{box-shadow:0 5px #2b2b304d,0 0 0 6px #f2c14eb3}.card{text-align:center;flex-direction:column;align-items:center;gap:14px;max-width:min(90vw,760px);display:flex;position:absolute;top:46%;left:50%;transform:translate(-50%,-50%)}.card h1{letter-spacing:.02em;color:#f2c14e;-webkit-text-stroke:7px #2b2b30;margin:0;font-size:clamp(44px,8vw,120px);line-height:1}.card p{margin:0;font-size:clamp(24px,3.6vw,52px)}.card p.tap{animation:.9s ease-in-out infinite bounce}.card p.small{-webkit-text-stroke:4px #2b2b30;font-size:clamp(16px,2vw,28px);line-height:1.3}.card.start{pointer-events:none}.hud:has(.menu){background:#1f2f6b73}.card.menu{pointer-events:auto}.card button{background:#fff;border-radius:999px;min-height:64px;padding:.35em 1.1em;font-size:clamp(18px,2.2vw,32px);box-shadow:0 6px #2b2b304d}.card button.big{background:#f2c14e;min-height:72px;padding:.3em 1.2em;font-size:clamp(28px,4.2vw,60px);box-shadow:0 8px #c99a2e}.card button.big.armed{color:#fff;background:#e8503f;box-shadow:0 8px #9b2f24}.card button:active{transform:translateY(4px);box-shadow:0 2px #2b2b304d}.card .row{flex-wrap:wrap;justify-content:center;gap:12px;display:flex}@media (width<=720px){.hud{--corner-room:224px}.wish{padding:4px 10px 4px 8px;top:8px;left:8px}.store{padding:4px 6px;top:8px;right:8px}.corner{gap:8px;right:8px}.bar{left:4px}.pieces{gap:6px}}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes bump{0%{transform:scale(1.5)}to{transform:scale(1)}}@keyframes ding{0%{transform:scale(1.35)rotate(-6deg)}to{transform:scale(1)rotate(0)}}@keyframes wiggle{0%,to{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}@keyframes twinkle{0%{transform:scale(.8)rotate(-10deg)}to{transform:scale(1.2)rotate(10deg)}}
