*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;user-select:none;-webkit-user-select:none}
html,body{margin:0;height:100%;font-family:"Baloo 2","Nunito","Trebuchet MS",system-ui,sans-serif;color:#3a1d6e;overflow-x:hidden}
body{background:linear-gradient(160deg,#ffe4f3 0%,#fff3c4 45%,#d6f5ff 100%);background-attachment:fixed}
#top{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:rgba(255,255,255,.75);backdrop-filter:blur(6px);box-shadow:0 2px 12px #7b3fe422}
.tb{font-size:30px;width:62px;height:62px;border-radius:50%;border:none;background:#fff;box-shadow:0 4px 0 #d9c6ff,0 6px 14px #7b3fe433}
#stars{font-size:30px;font-weight:800;background:linear-gradient(90deg,#ffb800,#ff7a00);-webkit-background-clip:text;color:transparent;filter:drop-shadow(0 2px 0 #fff)}
#stars.pop{animation:pop .6s}
main{padding:14px 16px 40px;max-width:560px;margin:0 auto;text-align:center}
h1{font-size:44px;margin:8px 0 2px;background:linear-gradient(90deg,#ff3d8b,#7b3fe4,#2f7bff);-webkit-background-clip:text;color:transparent}
h2{font-size:28px;margin:2px 0 4px}
.big{display:block;width:100%;font:inherit;font-size:34px;font-weight:800;border:none;border-radius:32px;padding:26px 10px;margin:14px 0;color:#fff;background:linear-gradient(135deg,#ff4fa0,#8a4bff);box-shadow:0 8px 0 #5a2bb0,0 12px 24px #7b3fe455;animation:breathe 2.4s infinite}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.gm{font:inherit;border:none;border-radius:28px;padding:16px 6px;min-height:150px;font-size:26px;font-weight:800;color:#3a1d6e;background:#fff;box-shadow:0 7px 0 var(--c,#ffc2e0),0 10px 20px #0001;position:relative}
.gm i{display:block;font-style:normal;font-size:62px;line-height:1.2}
.gm .t{position:absolute;top:6px;right:10px;font-size:24px}
.opts{display:flex;flex-direction:column;gap:14px;margin-top:8px}
.opts.row{flex-direction:row;justify-content:center}
.op{font:inherit;border:6px solid #fff;border-radius:34px;min-height:138px;width:100%;font-size:88px;font-weight:900;line-height:1;background:#fff;color:#3a1d6e;box-shadow:0 8px 0 #e3d4ff,0 12px 24px #0002;display:flex;align-items:center;justify-content:center}
.op svg{width:110px;height:110px}
.op.ok{animation:yay .7s;border-color:#22c55e;box-shadow:0 0 0 8px #22c55e66,0 8px 0 #16a34a}
.op.no{animation:wig .5s}
.op.hint{animation:hint 1s 3}
.prompt{font-size:30px;font-weight:800;margin:4px 0 6px;background:#fff;border:none;border-radius:24px;padding:12px 16px;width:100%;color:#3a1d6e;box-shadow:0 5px 0 #ffd6ea;font-family:inherit}
.dots{font-size:22px;margin:2px 0;letter-spacing:4px}
.cnt{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;font-size:66px;background:#fff8;border-radius:28px;padding:12px;min-height:120px}
.cnt span{cursor:pointer;transition:transform .2s}.cnt span.on{transform:scale(1.25);filter:drop-shadow(0 0 10px #ffd21f)}
.bal{display:flex;justify-content:space-around;margin-top:20px;min-height:380px;align-items:flex-end}
.bl{font:inherit;border:none;width:31%;height:180px;border-radius:50% 50% 46% 46%;font-size:80px;font-weight:900;color:#fff;text-shadow:0 3px 0 #0003;box-shadow:inset -14px -14px 0 #0002,0 10px 20px #0002;position:relative;animation:bob 3s ease-in-out infinite}
.bl:after{content:"";position:absolute;left:50%;top:100%;width:2px;height:90px;background:#9993}
.bl:nth-child(2){animation-delay:-1s;margin-bottom:80px}.bl:nth-child(3){animation-delay:-2s;margin-bottom:30px}
.bl.boom{animation:boom .5s forwards}
.mem{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:10px}
.cd{font:inherit;height:170px;border:none;border-radius:28px;font-size:0;background:linear-gradient(135deg,#8a4bff,#ff4fa0);box-shadow:0 7px 0 #5a2bb0;color:transparent}
.cd.up,.cd.done{font-size:90px;background:#fff;color:initial;box-shadow:0 7px 0 #ffd6ea}.cd.done{animation:yay .7s;opacity:.85}
.trs{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.tr{background:#fff;border-radius:26px;padding:14px;font-size:22px;font-weight:800;box-shadow:0 6px 0 #ffe08a}
.tr i{display:block;font-style:normal;font-size:70px}.tr.off{opacity:.45;filter:grayscale(1)}
#inst{background:linear-gradient(135deg,#22c55e,#0ea5e9);box-shadow:0 8px 0 #0f766e;font-size:26px;padding:18px;animation:none}
#tip{font-size:20px;background:#fff;border-radius:18px;padding:12px;display:none}
#fx{position:fixed;inset:0;pointer-events:none;z-index:20;overflow:hidden}
.cf{position:absolute;top:-30px;width:14px;height:20px;border-radius:3px;animation:fall linear forwards}
.flystar{position:fixed;font-size:80px;z-index:21;animation:fly 1.1s ease-in forwards;pointer-events:none}
.ov{position:fixed;inset:0;z-index:15;display:flex;flex-direction:column;align-items:center;justify-content:center;background:radial-gradient(circle,#fff8 0,#7b3fe4cc 70%);color:#fff;text-align:center;padding:20px}
.ov .tro{font-size:170px;animation:tro 1.2s ease-out;filter:drop-shadow(0 0 30px #ffd21f)}
.ov h2{font-size:40px;text-shadow:0 3px 0 #5a2bb0}
.ov .big{max-width:420px}
@keyframes pop{50%{transform:scale(1.5)}}
@keyframes breathe{50%{transform:scale(1.03)}}
@keyframes yay{30%{transform:scale(1.15) rotate(-4deg)}60%{transform:scale(1.08) rotate(4deg)}}
@keyframes wig{25%{transform:translateX(-10px)}75%{transform:translateX(10px)}}
@keyframes hint{50%{transform:scale(1.08);box-shadow:0 0 0 12px #ffd21faa,0 8px 0 #e3d4ff}}
@keyframes bob{50%{transform:translateY(-18px)}}
@keyframes boom{to{transform:scale(1.8);opacity:0}}
@keyframes fall{to{transform:translateY(110vh) rotate(720deg)}}
@keyframes fly{0%{transform:scale(.5)}40%{transform:scale(1.6)}100%{transform:translate(var(--dx),var(--dy)) scale(.3);opacity:.3}}
@keyframes tro{0%{transform:scale(0) rotate(-30deg)}70%{transform:scale(1.2) rotate(8deg)}100%{transform:scale(1)}}
.cnt.sm{font-size:48px;gap:4px}
.mem.m3{grid-template-columns:1fr 1fr 1fr}.mem.m3 .cd{height:130px}.mem.m3 .cd.up,.mem.m3 .cd.done{font-size:66px}
.trail{position:relative;padding:10px 0 30px}
.lvw{text-align:left;margin:-6px 0;transform:translateX(-46px)}
.lv{font:inherit;width:92px;height:92px;border-radius:50%;border:5px solid #fff;font-size:36px;font-weight:900;color:#fff;background:linear-gradient(135deg,#ff4fa0,#8a4bff);box-shadow:0 6px 0 #5a2bb0,0 8px 16px #0002;position:relative}
.lv.dn{background:linear-gradient(135deg,#22c55e,#0ea5e9);box-shadow:0 6px 0 #0f766e}
.lv.cur{animation:breathe 1.6s infinite;box-shadow:0 0 0 8px #ffd21f88,0 6px 0 #5a2bb0}
.lv.lk{background:#d9d2e9;box-shadow:0 6px 0 #b7aecb;font-size:30px}
.lv.tt{width:104px;height:104px}
.lv em{position:absolute;right:-26px;top:-18px;font-size:40px;font-style:normal}
.ls{font-size:16px;height:20px;padding-left:8px}
.trs.t5{grid-template-columns:repeat(5,1fr);gap:8px}.trs.t5 .tr{padding:6px;font-size:12px}.trs.t5 .tr i{font-size:34px}
.st3{font-size:70px;animation:tro 1s}.st3 span{filter:grayscale(1);opacity:.35}
