:root{--bg-sky:#f3e9d2;--bg-sky-low:#e7d4a8;--terrain:#6b4f3a;--grass:#7f9a55;--flop-body:#e86a5c;--flop-shadow:#c24a3e;--flop-rim:#fbd4c4;--core:#49c6e5;--core-glow:#b7f0fb;--accent:#f2b134;--accent-dark:#d99a1f;--ink:#3a2e28;--card:#fffaf0;--sai-t:env(safe-area-inset-top,0px);--sai-b:env(safe-area-inset-bottom,0px);--sai-l:env(safe-area-inset-left,0px);--sai-r:env(safe-area-inset-right,0px);--font-display:"Baloo 2", "Arial Rounded MT Bold", ui-rounded, "Nunito", "Quicksand", "Comic Sans MS", system-ui, sans-serif;--font-body:system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;margin:0;padding:0}html,body{background:var(--bg-sky);height:100%;font-family:var(--font-body);color:var(--ink);overscroll-behavior:none;touch-action:none;-webkit-user-select:none;user-select:none;overflow:hidden}#app{position:fixed;inset:0}#stage{position:absolute;inset:0}#stage canvas{width:100%;height:100%;display:block}#ui{pointer-events:none;position:absolute;inset:0}.screen{pointer-events:auto;padding:calc(16px + var(--sai-t)) calc(16px + var(--sai-r)) calc(16px + var(--sai-b)) calc(16px + var(--sai-l));flex-direction:column;justify-content:center;align-items:center;display:none;position:absolute;inset:0}.screen.visible{display:flex}.screen.dim{-webkit-backdrop-filter:blur(3px);background:#3a2e2873}.screen.opaque{background:linear-gradient(var(--bg-sky), var(--bg-sky-low))}.wordmark{font-family:var(--font-display);letter-spacing:-.02em;color:var(--flop-body);text-shadow:0 3px 0 var(--flop-shadow), 0 8px 18px #3a2e2840;margin-bottom:6px;font-size:clamp(44px,11vw,84px);font-weight:800;transform:rotate(-2.5deg)}.wordmark .buddy{color:var(--accent);text-shadow:0 3px 0 var(--accent-dark), 0 8px 18px #3a2e2840}.tagline{opacity:.75;margin-bottom:36px;font-size:15px;font-weight:600}.btn{appearance:none;font-family:var(--font-display);color:var(--ink);background:var(--card);cursor:pointer;border:none;border-radius:18px;min-width:220px;min-height:52px;margin:7px;padding:14px 30px;font-size:19px;font-weight:700;transition:transform 80ms,box-shadow 80ms;box-shadow:0 4px #3a2e2838,0 8px 16px #3a2e2824}.btn:active{transform:translateY(3px);box-shadow:0 1px #3a2e2838,0 3px 8px #3a2e281f}.btn.primary{background:var(--accent);color:#fff;text-shadow:0 1px 0 var(--accent-dark);box-shadow:0 4px 0 var(--accent-dark), 0 8px 16px #3a2e2833}.btn.primary:active{box-shadow:0 1px 0 var(--accent-dark), 0 3px 8px #3a2e2826}.btn.danger{color:#8c4438;background:#e3d5c2}.btn.small{min-width:0;min-height:44px;padding:10px 18px;font-size:16px}.icon-btn{appearance:none;width:46px;height:46px;color:var(--ink);cursor:pointer;pointer-events:auto;background:#fffaf0eb;border:none;border-radius:14px;place-items:center;font-size:20px;display:grid;box-shadow:0 3px #3a2e282e}.icon-btn:active{transform:translateY(2px);box-shadow:0 1px #3a2e282e}#screen-loading .flop-face{background:radial-gradient(circle at 32% 28%, var(--flop-rim), var(--flop-body) 55%, var(--flop-shadow));border-radius:50%;width:92px;height:92px;margin-bottom:22px;animation:2.2s ease-in-out infinite bob;position:relative}#screen-loading .flop-face:before,#screen-loading .flop-face:after{content:"";background:var(--ink);border-radius:50%;width:9px;height:9px;position:absolute;top:38px}#screen-loading .flop-face:before{left:28px}#screen-loading .flop-face:after{right:28px}@keyframes bob{0%,to{transform:translateY(0)rotate(-3deg)}50%{transform:translateY(-10px)rotate(3deg)}}.progress-track{background:#3a2e2826;border-radius:6px;width:min(280px,70vw);height:10px;margin-top:10px;overflow:hidden}.progress-fill{background:var(--accent);border-radius:6px;width:0%;height:100%;transition:width .25s}.tap-hint{font-family:var(--font-display);margin-top:30px;font-size:20px;font-weight:700;animation:1.6s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:.55}50%{opacity:1}}@media (prefers-reduced-motion:reduce){#screen-loading .flop-face,.tap-hint{animation:none}}.select-card{background:var(--card);pointer-events:auto;border-radius:24px;width:min(560px,94vw);max-height:86vh;padding:18px;overflow-y:auto;box-shadow:0 12px 30px #3a2e2838}.select-head{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.select-head h2{font-family:var(--font-display);font-size:24px}.total-stars{color:var(--accent-dark);font-weight:700}.world-tabs{flex-wrap:wrap;gap:6px;margin-bottom:14px;display:flex}.world-tab{font-family:var(--font-display);color:var(--ink);cursor:pointer;background:#3a2e2814;border:none;border-radius:12px;flex:100px;min-height:44px;padding:10px 6px;font-size:14px;font-weight:700}.world-tab.active{background:var(--accent);color:#fff}.world-tab.locked{opacity:.45}.level-grid{grid-template-columns:repeat(4,1fr);gap:10px;display:grid}.level-cell{aspect-ratio:1;font-family:var(--font-display);color:var(--ink);cursor:pointer;background:linear-gradient(#fff,#f3e7cf);border:none;border-radius:16px;flex-direction:column;justify-content:center;align-items:center;gap:4px;min-height:64px;font-size:22px;font-weight:800;display:flex;box-shadow:0 3px #3a2e2826}.level-cell:active{transform:translateY(2px)}.level-cell .stars{letter-spacing:1px;color:var(--accent-dark);font-size:13px}.level-cell.locked{opacity:.4;background:#e6dcc8}.level-cell.locked:after{content:"🔒";font-size:15px}#hud{pointer-events:none;display:none;position:absolute;inset:0}#hud.visible{display:block}.hud-top{top:calc(8px + var(--sai-t));left:calc(10px + var(--sai-l));right:calc(10px + var(--sai-r));align-items:center;gap:8px;display:flex;position:absolute}.hud-level-name{font-family:var(--font-display);white-space:nowrap;text-overflow:ellipsis;background:#fffaf0e6;border-radius:12px;max-width:40vw;padding:8px 14px;font-size:16px;font-weight:700;overflow:hidden;box-shadow:0 3px #3a2e2824}.hud-shots{background:#fffaf0e6;border-radius:12px;align-items:center;gap:5px;margin-right:auto;padding:8px 12px;display:flex;box-shadow:0 3px #3a2e2824}.shot-pip{background:radial-gradient(circle at 34% 30%, var(--flop-rim), var(--flop-body) 60%, var(--flop-shadow));border-radius:50%;width:18px;height:18px;position:relative}.shot-pip.spent{background:#3a2e2826}.hud-hint{left:50%;bottom:calc(24px + var(--sai-b));color:#fff7e8;text-align:center;opacity:0;background:#3a2e28e0;border-radius:14px;max-width:min(520px,86vw);padding:10px 18px;font-size:15px;transition:opacity .4s;position:absolute;transform:translate(-50%)}.hud-hint.visible{opacity:1}.panel{background:var(--card);text-align:center;pointer-events:auto;border-radius:26px;width:min(400px,92vw);padding:28px 30px;box-shadow:0 16px 40px #3a2e284d}.panel h2{font-family:var(--font-display);margin-bottom:4px;font-size:30px}.panel .sub{opacity:.75;margin-bottom:14px;font-size:15px}.stars-row{letter-spacing:6px;min-height:56px;margin:8px 0 14px;font-size:44px}.stars-row .star{color:#3a2e2826;display:inline-block}.stars-row .star.earned{color:var(--accent);text-shadow:0 2px 0 var(--accent-dark);animation:.45s cubic-bezier(.2,2.2,.5,1) backwards starpop}.stars-row .star.earned:nth-child(2){animation-delay:.18s}.stars-row .star.earned:nth-child(3){animation-delay:.36s}@keyframes starpop{0%{transform:scale(0)rotate(-40deg)}to{transform:scale(1)rotate(0)}}@media (prefers-reduced-motion:reduce){.stars-row .star.earned{animation:none}}.panel .btn-row{flex-wrap:wrap;justify-content:center;display:flex}.panel .btn-row .btn{flex:40%;min-width:0}.settings-card{background:var(--card);pointer-events:auto;border-radius:24px;width:min(440px,94vw);max-height:86vh;padding:24px;overflow-y:auto;box-shadow:0 12px 30px #3a2e2838}.settings-card h2{font-family:var(--font-display);margin-bottom:16px}.setting-row{border-bottom:1px solid #3a2e2814;justify-content:space-between;align-items:center;gap:14px;padding:12px 0;font-weight:600;display:flex}.setting-row input[type=range]{max-width:180px;accent-color:var(--accent);flex:1;height:32px}.setting-row select{background:#fff;border:1px solid #3a2e2833;border-radius:10px;min-height:40px;padding:8px;font-size:15px}.switch{width:56px;height:32px;position:relative}.switch input{opacity:0;cursor:pointer;z-index:1;width:100%;height:100%;position:absolute}.switch .track{background:#3a2e2833;border-radius:16px;transition:background .15s;position:absolute;inset:0}.switch input:checked+.track{background:var(--accent)}.switch .thumb{background:#fff;border-radius:50%;width:26px;height:26px;transition:left .15s;position:absolute;top:3px;left:3px;box-shadow:0 2px 4px #0003}.switch input:checked~.thumb{left:27px}.toast{left:50%;bottom:calc(18px + var(--sai-b));background:var(--card);pointer-events:auto;border-radius:16px;align-items:center;gap:12px;max-width:min(440px,92vw);padding:14px 16px;font-size:14px;transition:transform .35s;display:flex;position:absolute;transform:translate(-50%)translateY(120%);box-shadow:0 8px 24px #3a2e284d}.toast.visible{transform:translate(-50%)translateY(0)}.toast .btn.small{flex-shrink:0;margin:0}#debug-overlay{top:calc(60px + var(--sai-t));color:#9fef9f;pointer-events:none;white-space:pre;background:#000000b3;border-radius:6px;padding:8px;font:11px/1.5 monospace;position:absolute;right:8px}