:root{--bg-top:#e8f4ff;--bg-bottom:#6cb8e8;--bg-deep:#2b7ec0;--accent:#7fdde0;--accent-deep:#4eafb6;--accent-warm:#ff6b9d;--ink:#143047;--ink-soft:#4f6b80;--paper:#fff;--font-display:"Bangers", "Impact", system-ui, sans-serif;--font-cartoon:"Fredoka", system-ui, sans-serif;--font-body:"Nunito", system-ui, sans-serif}*{box-sizing:border-box}html,body{overscroll-behavior:none;font-family:var(--font-body);color:var(--ink);margin:0;padding:0}.fight{background:linear-gradient(180deg, var(--bg-top) 0%, var(--bg-bottom) 100%);font-family:var(--font-body);-webkit-user-select:none;user-select:none;position:fixed;inset:0;overflow:hidden}.hp{z-index:20;width:38vw;max-width:320px;position:absolute;top:24px}.hp-me{left:24px}.hp-go{text-align:right;right:24px}.hp-label{font-family:var(--font-cartoon);letter-spacing:.1em;color:var(--ink);margin-bottom:4px;font-size:13px;font-weight:700}.hp-bar{border:2px solid var(--ink);background:#fff9;border-radius:8px;height:14px;position:relative;overflow:hidden}.hp-fill{height:100%;transition:width .25s ease-out}.hp-fill-me{background:linear-gradient(90deg, var(--accent) 0%, var(--accent-deep) 100%)}.hp-fill-go{background:linear-gradient(90deg, var(--accent-warm) 0%, #d94a7c 100%);margin-left:auto}.arena{justify-content:center;align-items:center;display:flex;position:absolute;inset:0;overflow:hidden}.lottie-wrap{aspect-ratio:1;width:min(96vmin,96vh,96vw);position:relative}.lottie-wrap>div{width:100%;height:100%}.hit-text{font-family:var(--font-display);color:#fff;-webkit-text-stroke:3px var(--ink);text-shadow:6px 6px 0 var(--accent-warm);letter-spacing:.04em;pointer-events:none;z-index:15;font-size:clamp(48px,10vw,110px);animation:.8s ease-out forwards hit-pop;position:absolute;top:30%}.hit-left{left:12%}.hit-right{right:12%}@keyframes hit-pop{0%{opacity:0;transform:scale(0)rotate(-15deg)}25%{opacity:1;transform:scale(1.4)rotate(-8deg)}60%{opacity:1;transform:scale(1)rotate(-4deg)}to{opacity:0;transform:scale(1.1)rotate(0)}}.finale{z-index:30;background:#1430478c;justify-content:center;align-items:center;animation:.6s ease-out fade-in;display:flex;position:absolute;inset:0}.finale-card{background:var(--paper);text-align:center;border:3px solid var(--ink);border-radius:22px;max-width:86vw;padding:32px 48px;animation:.5s cubic-bezier(.34,1.56,.64,1) pop-in;box-shadow:0 30px 80px #14304773}.finale-title{font-family:var(--font-cartoon);color:var(--ink);margin-bottom:8px;font-size:clamp(24px,5vw,42px);font-weight:700}.finale-sub{font-family:var(--font-body);color:var(--ink-soft);letter-spacing:.1em;font-size:16px}.finale-btn{font-family:var(--font-cartoon);letter-spacing:.04em;color:var(--ink);background:linear-gradient(180deg, var(--accent) 0%, var(--accent-deep) 100%);border:2px solid var(--ink);cursor:pointer;box-shadow:0 4px 0 var(--ink);border-radius:14px;margin-top:24px;padding:14px 28px;font-size:17px;font-weight:700;transition:transform .1s,box-shadow .1s}.finale-btn:hover{box-shadow:0 5px 0 var(--ink);transform:translateY(-1px)}.finale-btn:active{box-shadow:0 2px 0 var(--ink);transform:translateY(2px)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes pop-in{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}@media (width<=600px){.hp{width:42vw;top:12px}.hp-me{left:12px}.hp-go{right:12px}}.choose{background:linear-gradient(180deg, var(--bg-top) 0%, var(--bg-bottom) 100%);font-family:var(--font-body);-webkit-user-select:none;user-select:none;flex-direction:column;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.choose-title{font-family:var(--font-display);letter-spacing:.08em;color:#fff;-webkit-text-stroke:3px var(--ink);text-shadow:6px 6px 0 var(--accent-warm);margin:0;font-size:clamp(48px,12vw,110px);animation:.6s ease-out choose-pop}.choose-sub{font-family:var(--font-cartoon);color:var(--ink);letter-spacing:.05em;background:#ffffff80;border-radius:999px;margin-top:12px;margin-bottom:36px;padding:6px 14px;font-size:16px;font-weight:600}.choose-grid{grid-template-columns:repeat(3,1fr);gap:clamp(12px,3vw,28px);width:100%;max-width:600px;display:grid}.choose-grid[data-count="2"]{grid-template-columns:repeat(2,1fr);max-width:420px}.choose-grid[data-count="1"]{grid-template-columns:1fr;max-width:240px}.choose-card{aspect-ratio:1;border:4px solid var(--ink);background:linear-gradient(135deg, #fff 0%, var(--accent) 100%);cursor:pointer;box-shadow:0 6px 0 var(--ink);border-radius:22px;justify-content:center;align-items:center;padding:0;font-family:inherit;transition:transform .15s,box-shadow .15s;display:flex;overflow:hidden}.choose-card:hover{box-shadow:0 9px 0 var(--ink);transform:translateY(-3px)rotate(-1deg)}.choose-card:active{box-shadow:0 3px 0 var(--ink);transform:translateY(3px)}.choose-q{font-family:var(--font-display);color:var(--accent-warm);-webkit-text-stroke:3px var(--ink);font-size:clamp(60px,14vw,110px)}@keyframes choose-pop{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}@media (width<=480px){.choose-grid{max-width:360px}}.puzzle{background:linear-gradient(180deg, var(--bg-top) 0%, var(--bg-bottom) 100%);font-family:var(--font-body);-webkit-user-select:none;user-select:none;touch-action:none;flex-direction:column;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0;overflow:hidden}.puzzle-title{font-family:var(--font-cartoon);letter-spacing:.02em;color:var(--ink);background:#ffffff80;border-radius:999px;margin-bottom:20px;padding:6px 18px;font-size:clamp(22px,4.5vw,34px);font-weight:700}.puzzle-board{border:4px dashed var(--ink);background:#fff6;border-radius:14px;width:min(45vmin,360px);position:relative}.puzzle-slot{box-sizing:border-box;pointer-events:none;border:1px dashed #1430472e;position:absolute}.puzzle-piece{box-sizing:border-box;cursor:grab;z-index:2;background-repeat:no-repeat;border:2px solid #fff;border-radius:6px;transition:box-shadow .15s;position:absolute;top:0;left:0;box-shadow:0 4px 12px #14304759}.puzzle-piece:active{cursor:grabbing;box-shadow:0 8px 22px #14304780}.puzzle-piece.placed{box-shadow:none;cursor:default;z-index:1;border-color:#0000}.puzzle-win{z-index:100;background:#1430478c;justify-content:center;align-items:center;animation:.35s ease-out puzzle-win-fade;display:flex;position:fixed;inset:0}.puzzle-win-card{background:var(--paper);text-align:center;border:3px solid var(--ink);border-radius:22px;max-width:86vw;padding:28px 36px;animation:.5s cubic-bezier(.34,1.56,.64,1) puzzle-win-pop;box-shadow:0 30px 80px #14304773}.puzzle-win-text{font-family:var(--font-display);color:#fff;-webkit-text-stroke:3px var(--ink);text-shadow:4px 4px 0 var(--accent-warm);letter-spacing:.04em;margin-bottom:6px;font-size:clamp(40px,9vw,80px)}.puzzle-win-sub{font-family:var(--font-body);color:var(--ink-soft);letter-spacing:.04em;margin-bottom:18px;font-size:15px}.puzzle-win-btn{font-family:var(--font-cartoon);letter-spacing:.04em;color:var(--ink);background:linear-gradient(180deg, var(--accent) 0%, var(--accent-deep) 100%);border:2px solid var(--ink);cursor:pointer;box-shadow:0 4px 0 var(--ink);border-radius:14px;padding:12px 28px;font-size:16px;font-weight:700;transition:transform .1s,box-shadow .1s}.puzzle-win-btn:hover{box-shadow:0 5px 0 var(--ink);transform:translateY(-1px)}.puzzle-win-btn:active{box-shadow:0 2px 0 var(--ink);transform:translateY(2px)}@keyframes puzzle-win-fade{0%{opacity:0}to{opacity:1}}@keyframes puzzle-win-pop{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}@media (width<=700px){.puzzle-board{width:min(55vmin,280px)}.puzzle-title{margin-bottom:12px}.puzzle{padding:12px}}.play{background:linear-gradient(180deg, var(--bg-top) 0%, var(--bg-bottom) 100%);font-family:var(--font-body);-webkit-user-select:none;user-select:none;touch-action:none;position:fixed;inset:0}.play canvas{width:100%;height:100%;display:block}.play-joystick{border:3px solid var(--ink);width:130px;height:130px;box-shadow:0 4px 0 var(--ink);touch-action:none;z-index:10;background:#ffffff59;border-radius:50%;justify-content:center;align-items:center;display:flex;position:fixed;bottom:24px;left:24px}.play-joystick-knob{background:linear-gradient(180deg, var(--accent) 0%, var(--accent-deep) 100%);border:3px solid var(--ink);pointer-events:none;border-radius:50%;width:56px;height:56px;transition:transform 50ms}.play-jump{border:3px solid var(--ink);background:linear-gradient(180deg, var(--accent-warm) 0%, #d94a7c 100%);width:100px;height:100px;color:var(--ink);font-family:var(--font-display);cursor:pointer;box-shadow:0 4px 0 var(--ink);z-index:10;border-radius:50%;justify-content:center;align-items:center;padding:0;font-size:56px;display:flex;position:fixed;bottom:24px;right:24px}.play-jump:active{box-shadow:0 2px 0 var(--ink);transform:translateY(2px)}.play-done{font-family:var(--font-cartoon);color:var(--ink);border:2px solid var(--ink);cursor:pointer;box-shadow:0 3px 0 var(--ink);z-index:10;background:#ffffffd9;border-radius:12px;padding:10px 18px;font-size:14px;font-weight:700;position:fixed;top:18px;right:18px}.play-done:active{box-shadow:0 1px 0 var(--ink);transform:translateY(2px)}.play-hint{font-family:var(--font-cartoon);pointer-events:none;z-index:10;background:#ffffffb3;border-radius:999px;padding:6px 14px;font-size:13px;position:fixed;top:18px;left:50%;transform:translate(-50%)}.play-hint-mobile{display:none}@media (hover:none) and (pointer:coarse){.play-hint-desktop{display:none}.play-hint-mobile{display:inline}}@media (hover:hover) and (pointer:fine){.play-joystick,.play-jump{display:none}}.rotate-gate{background:linear-gradient(180deg, var(--bg-top) 0%, var(--bg-bottom) 100%);font-family:var(--font-body);-webkit-user-select:none;user-select:none;text-align:center;flex-direction:column;justify-content:center;align-items:center;padding:24px;display:flex;position:fixed;inset:0}.rotate-icon{margin-bottom:16px;font-size:clamp(72px,18vw,120px);animation:1.6s ease-in-out infinite rotate-bounce}@keyframes rotate-bounce{0%,to{transform:rotate(0)}40%{transform:rotate(-90deg)}60%{transform:rotate(-90deg)}}.rotate-title{font-family:var(--font-cartoon);color:var(--ink);margin-bottom:6px;font-size:clamp(26px,6vw,38px);font-weight:700}.rotate-sub{font-family:var(--font-body);color:var(--ink-soft);letter-spacing:.03em;margin-bottom:28px;font-size:15px}.rotate-btn{font-family:var(--font-cartoon);letter-spacing:.04em;color:var(--ink);background:linear-gradient(180deg, var(--accent) 0%, var(--accent-deep) 100%);border:2px solid var(--ink);cursor:pointer;box-shadow:0 4px 0 var(--ink);border-radius:14px;padding:14px 28px;font-size:16px;font-weight:700;transition:transform .1s,box-shadow .1s}.rotate-btn:hover{box-shadow:0 5px 0 var(--ink);transform:translateY(-1px)}.rotate-btn:active{box-shadow:0 2px 0 var(--ink);transform:translateY(2px)}.rotate-error{max-width:280px;font-family:var(--font-body);color:var(--accent-warm);border:1px solid var(--accent-warm);background:#ffffffb3;border-radius:10px;margin-top:20px;padding:10px 14px;font-size:13px}html,body,#root{touch-action:none;overscroll-behavior:none;-webkit-user-select:none;user-select:none;width:100%;height:100%;margin:0;padding:0;overflow:hidden}.app{background:linear-gradient(#f8f8f8 0%,#ececec 100%);width:100vw;height:100dvh}.app canvas{display:block}.end-screen{background:linear-gradient(180deg, var(--bg-top) 0%, var(--bg-bottom) 100%);font-family:var(--font-body);-webkit-user-select:none;user-select:none;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.end-card{background:var(--paper);text-align:center;border:3px solid var(--ink);border-radius:22px;max-width:86vw;padding:40px 56px;animation:.6s cubic-bezier(.34,1.56,.64,1) end-pop;box-shadow:0 30px 80px #14304766}.end-title{font-family:var(--font-cartoon);color:var(--ink);margin-bottom:8px;font-size:clamp(26px,5vw,46px);font-weight:700}.end-sub{font-family:var(--font-body);color:var(--ink-soft);letter-spacing:.08em;font-size:16px}@keyframes end-pop{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}.loading-hint{font-family:var(--font-body);color:#14304766;pointer-events:none;z-index:-1;font-size:14px;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}