:root{--ink:#6b2f5e;--pink:#ff8fbf;--pink-deep:#e9609c;--cream:#fff6fb;--lilac:#cdb5f5;--font:ui-rounded, "SF Pro Rounded", "Arial Rounded MT Bold", "Trebuchet MS", system-ui, sans-serif}html,body{height:100%;font-family:var(--font);color:var(--ink);-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:#f6d5ec;margin:0;overflow:hidden}#app,#app canvas{touch-action:none;width:100%;height:100%;display:block;position:fixed;inset:0}#rotate{z-index:50;color:var(--pink-deep);font:700 22px var(--font);text-align:center;background:#f3d9f0;justify-content:center;align-items:center;padding:24px;display:none;position:fixed;inset:0}@media (orientation:portrait) and (pointer:coarse){#rotate{display:flex}}.hud{pointer-events:none;z-index:10;padding:max(14px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) 14px max(16px, env(safe-area-inset-left));position:fixed;inset:0}.hud[hidden]{display:none}.hud-row{align-items:center;gap:4px;display:flex}.hud-hearts img{object-fit:contain;filter:drop-shadow(0 2px 2px #6b2f5e40);width:48px;height:48px;transition:transform .2s}.hud-hearts img.pop{transform:scale(1.3)}.hud-stars{background:#fff6fbd9;border:3px solid #ffd0e4;border-radius:999px;width:fit-content;margin-top:6px;padding:2px 16px 2px 4px;font-size:22px;font-weight:800}.hud-stars img{object-fit:contain;width:40px;height:40px}.hud-pause{top:max(14px, env(safe-area-inset-top));right:max(16px, env(safe-area-inset-right));pointer-events:auto;cursor:pointer;background:0 0;border:none;width:60px;height:60px;padding:0;position:absolute}.hud-pause img{object-fit:contain;width:100%;height:100%}.toast{opacity:0;text-align:center;background:#fff6fbeb;border:3px solid #ffc2dc;border-radius:20px;max-width:min(80vw,560px);padding:10px 22px;font-size:20px;font-weight:800;transition:opacity .3s,transform .3s;position:absolute;top:18%;left:50%;transform:translate(-50%,-10px);box-shadow:0 6px 18px #e9609c33}.toast.show{opacity:1;transform:translate(-50%)}.screen{z-index:20;-webkit-backdrop-filter:blur(3px);text-align:center;background:radial-gradient(#ffecf88c,#cdb5f58c);flex-direction:column;justify-content:center;align-items:center;gap:14px;padding:20px;display:flex;position:fixed;inset:0}.screen[hidden]{display:none}.screen.title{-webkit-backdrop-filter:none;backdrop-filter:none;background:radial-gradient(#ffecf840,#cdb5f559)}.logo-wrap{position:relative}.logo-wrap img{object-fit:contain;filter:drop-shadow(0 6px 12px #6b2f5e4d);width:min(520px,70vw);max-height:40vh;animation:3s ease-in-out infinite float}.badge-3d{color:#fff;text-shadow:0 2px #6b2f5e59;background:linear-gradient(135deg,#8fd8ff,#c9a6ff 60%,#ff9ec4);border:4px solid #fff;border-radius:16px;padding:2px 16px;font-size:clamp(24px,4vw,40px);font-weight:900;position:absolute;bottom:6%;right:2%;transform:rotate(-8deg);box-shadow:0 4px 12px #6b2f5e40}@keyframes float{50%{transform:translateY(-8px)}}.panel{background:#fff6fbf0;border:5px solid #ffc2dc;border-radius:28px;flex-direction:column;align-items:center;gap:12px;min-width:min(340px,80vw);padding:22px 34px;display:flex;box-shadow:0 10px 30px #6b2f5e33}.panel h1{color:var(--pink-deep);text-shadow:0 2px #fff;margin:0;font-size:clamp(26px,4vw,40px)}.panel p{margin:0;font-size:18px;font-weight:700}.btn{font:800 22px var(--font);color:#fff;cursor:pointer;text-shadow:0 2px #a0286473;background:repeating-linear-gradient(-45deg,#ff8fbf 0 16px,#ffa9cf 16px 32px);border:4px solid #fff;border-radius:999px;min-width:220px;padding:12px 28px;transition:transform .1s;box-shadow:0 5px #d9568f,0 8px 16px #6b2f5e40}.btn:hover{transform:translateY(-2px)scale(1.03)}.btn:active{transform:translateY(3px);box-shadow:0 2px #d9568f}.btn.alt{background:repeating-linear-gradient(-45deg,#b99af0 0 16px,#c9b0f5 16px 32px);box-shadow:0 5px #8a6ad0,0 8px 16px #6b2f5e40}.controls-help{background:#fff6fbcc;border-radius:16px;padding:8px 16px;font-size:15px;font-weight:700;line-height:1.6}.controls-help kbd{font:800 13px var(--font);background:#fff;border:2px solid #ffc2dc;border-radius:6px;padding:0 6px}.loading{font-size:18px;font-weight:800}.touch{z-index:15;pointer-events:none;position:fixed;inset:0}.touch[hidden]{display:none}.touch-look{pointer-events:auto;touch-action:none;position:absolute;inset:0}.stick-base{pointer-events:none;opacity:.5;background:#fff6fb59;border:4px solid #ffffffb3;border-radius:50%;width:130px;height:130px;margin:-65px 0 0 -65px;position:absolute}.stick-base.on{opacity:1}.stick-knob{background:radial-gradient(circle at 35% 35%,#fff,#ffb3d4);border-radius:50%;width:60px;height:60px;margin:-30px 0 0 -30px;position:absolute;top:50%;left:50%;box-shadow:0 3px 8px #6b2f5e4d}.tbtn{pointer-events:auto;touch-action:none;font:900 18px var(--font);color:#fff;text-shadow:0 2px #6b2f5e59;opacity:.88;border:4px solid #fff;border-radius:50%;justify-content:center;align-items:center;display:flex;position:absolute;box-shadow:0 4px 10px #6b2f5e40}.tbtn.down{opacity:1;transform:scale(.92)}.tbtn-jump{width:96px;height:96px;right:max(28px, env(safe-area-inset-right));background:radial-gradient(circle at 35% 30%,#ffc4dd,#ff7fb4);bottom:34px}.tbtn-star{width:74px;height:74px;right:calc(max(28px, env(safe-area-inset-right)) + 112px);background:radial-gradient(circle at 35% 30%,#fff2b0,#ffc94a);font-size:30px;bottom:28px}