:root{--green: #7ed957;--green-deep: #5a8f3c;--sky-a: #8fd3ff;--sky-b: #c9f0ff;--violet: #a66cff;--yellow: #ffd93d;--orange: #ff8c42;--pink: #ff6fb5;--ink: #2c2350;--shadow: 0 8px 0 rgba(0, 0, 0, .12);font-family:Nunito,system-ui,sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%;overflow:hidden;background:linear-gradient(180deg,var(--sky-a),var(--sky-b));color:var(--ink);-webkit-tap-highlight-color:transparent}#app{position:fixed;top:0;right:0;bottom:0;left:0}.canvas-host{position:absolute;top:0;right:0;bottom:0;left:0}.canvas-host canvas{display:block}.overlay{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:10}.menu{background:radial-gradient(circle at 50% 20%,rgba(255,255,255,.4),transparent 60%)}.menu-cloud{position:absolute;width:160px;height:60px;background:#ffffffd9;border-radius:60px;filter:blur(1px);animation:float 9s ease-in-out infinite}.menu-cloud:before,.menu-cloud:after{content:"";position:absolute;background:inherit;border-radius:50%}.menu-cloud:before{width:70px;height:70px;top:-28px;left:26px}.menu-cloud:after{width:90px;height:90px;top:-40px;right:24px}.cloud-a{top:14%;left:12%}.cloud-b{top:24%;right:10%;transform:scale(.8);animation-delay:-4s}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-18px)}}.menu-card{position:relative;text-align:center;background:#ffffffc7;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:4px solid #fff;border-radius:32px;padding:40px 48px;box-shadow:0 20px 60px #5a3ca040;animation:pop-in .5s cubic-bezier(.18,1.4,.4,1)}@keyframes pop-in{0%{transform:scale(.7);opacity:0}to{transform:scale(1);opacity:1}}.title{font-family:Fredoka,sans-serif;font-size:52px;margin:0 0 8px;color:var(--violet);text-shadow:0 3px 0 #fff,0 5px 0 rgba(166,108,255,.4);letter-spacing:1px}.title-3d{color:var(--orange);-webkit-text-stroke:2px #fff}.subtitle{font-size:16px;font-weight:700;color:#6a5fa0;margin:0 0 24px}.btn{font-family:Fredoka,sans-serif;font-size:22px;font-weight:600;border:none;border-radius:999px;padding:14px 44px;cursor:pointer;color:#fff;transition:transform .12s ease,box-shadow .12s ease}.btn-primary{background:linear-gradient(180deg,var(--orange),#ff7220);box-shadow:0 6px #d9610f,0 12px 24px #ff8c4266}.btn-primary:hover{transform:translateY(-2px)}.btn-primary:active{transform:translateY(4px);box-shadow:0 2px #d9610f}.btn-rules{margin-top:12px;font-size:18px;padding:10px 32px;background:linear-gradient(180deg,var(--violet),#8a4fe6);box-shadow:0 5px #6c3bc0,0 10px 20px #a66cff59}.btn-rules:hover{transform:translateY(-2px)}.btn-rules:active{transform:translateY(3px);box-shadow:0 2px #6c3bc0}.howto{margin-top:24px;display:flex;flex-direction:column;gap:8px;font-size:14px;font-weight:700;color:#6a5fa0}kbd{display:inline-block;min-width:22px;padding:2px 6px;margin:0 1px;background:#fff;border:2px solid #d8d2f0;border-bottom-width:4px;border-radius:6px;font-family:Fredoka,sans-serif;font-size:13px;color:var(--violet)}.highscore{margin-top:18px;font-weight:800;color:var(--green-deep)}.highscore strong{color:var(--orange);font-size:20px}.hud{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;z-index:5}.hud-top{display:flex;justify-content:space-between;align-items:flex-start;padding:16px 20px}.hud-panel{background:#ffffffd1;border:3px solid #fff;border-radius:18px;padding:10px 16px;box-shadow:0 6px 16px #5a3ca02e}.hud-level{font-family:Fredoka,sans-serif;font-size:18px;color:var(--violet);font-weight:600}.hud-score,.hud-monsters{font-size:14px;font-weight:700;color:#6a5fa0}.hud-score strong{color:var(--orange);font-size:20px;font-family:Fredoka,sans-serif}.hud-monsters strong{color:var(--green-deep);font-size:16px}.hud-right{text-align:right}.hud-carry{margin-top:6px;display:inline-block;background:#ffffffd1;border:3px solid #fff;border-radius:14px;padding:4px 12px;font-size:13px;font-weight:800;color:#9a93b8}.hud-carry.has-item{color:var(--orange);border-color:var(--yellow)}.hud-home{display:block;margin-top:8px;margin-left:auto;pointer-events:auto;cursor:pointer;border:3px solid #fff;border-radius:14px;padding:6px 14px;font-family:Fredoka,sans-serif;font-size:13px;font-weight:700;color:#fff;background:linear-gradient(180deg,var(--violet),#8a4fe6);box-shadow:0 4px #6c3bc0}.hud-home:active{transform:translateY(3px);box-shadow:0 1px #6c3bc0}.touch-controls{position:absolute;bottom:24px;left:0;right:0;display:none;justify-content:space-between;align-items:flex-end;padding:0 28px;pointer-events:none}.dpad{position:relative;width:168px;height:168px;pointer-events:auto}.touch-btn{position:absolute;width:56px;height:56px;border:none;border-radius:16px;background:#ffffffd9;color:var(--violet);font-size:20px;font-weight:800;box-shadow:0 4px #0000001f;pointer-events:auto;-webkit-user-select:none;user-select:none}.touch-btn:active{transform:translateY(3px);box-shadow:0 1px #0000001f}.dpad .up{top:0;left:56px}.dpad .left{top:56px;left:0}.dpad .right{top:56px;right:0}.dpad .down{bottom:0;left:56px}.touch-btn.action{position:relative;width:96px;height:96px;border-radius:50%;font-family:Fredoka,sans-serif;font-size:22px;color:#fff;background:linear-gradient(180deg,var(--orange),#ff7220);box-shadow:0 6px #d9610f}.dialog{background:#2c235073;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:20}.dialog-card{text-align:center;background:#fff;border-radius:28px;padding:36px 48px;box-shadow:0 24px 60px #0000004d;animation:pop-in .45s cubic-bezier(.18,1.4,.4,1)}.dialog-card h2{font-family:Fredoka,sans-serif;font-size:40px;margin:0 0 8px}.dialog-card h2.win{color:var(--green-deep)}.dialog-card h2.lose{color:var(--pink)}.dialog-card p{font-weight:700;color:#6a5fa0;margin:0 0 18px}.dialog-score{font-weight:800;color:#6a5fa0}.dialog-score strong{font-family:Fredoka,sans-serif;font-size:30px;color:var(--orange)}.dialog-high{margin:4px 0 22px;font-weight:700;color:var(--green-deep)}.rules-card{max-width:420px;text-align:left}.rules-card h2{text-align:center}.rules-list{margin:0 0 24px;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}.rules-list li{font-weight:700;font-size:15px;color:#6a5fa0;line-height:1.4}.rules-card .btn-primary{display:block;margin:0 auto}@media (hover: none) and (pointer: coarse){.touch-controls{display:flex}}@media (max-width: 600px){.title{font-size:38px}.menu-card{padding:28px;max-width:88vw}.dialog-card{padding:28px 24px;max-width:88vw}.dialog-card h2{font-size:32px}.rules-card{max-width:88vw}.rules-list li{font-size:13px}.hud-top{padding:10px 12px}.hud-panel{padding:8px 12px}.hud-level{font-size:15px}.hud-score,.hud-monsters{font-size:12px}.touch-controls{bottom:16px;padding:0 18px}.dpad{width:150px;height:150px}.touch-btn{width:50px;height:50px}.dpad .up,.dpad .down{left:50px}.dpad .left,.dpad .right{top:50px}.touch-btn.action{width:84px;height:84px;font-size:18px}}