:root{--ink: #0f3350;--paper: #fffaf0;--accent: #ff8a5c;--accent-dark: #e0663a;--water: #1b6fa8;--safe-t: env(safe-area-inset-top, 0px);--safe-r: env(safe-area-inset-right, 0px);--safe-b: env(safe-area-inset-bottom, 0px);--safe-l: env(safe-area-inset-left, 0px)}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:var(--water);color:var(--ink);font-family:Trebuchet MS,Avenir Next,system-ui,sans-serif;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}#stage,#stage canvas{position:fixed;inset:0;display:block;touch-action:none}.hidden{display:none!important}#hud{position:fixed;inset:0;pointer-events:none}.hud-row{position:absolute;top:calc(10px + var(--safe-t));left:calc(12px + var(--safe-l));display:flex;gap:12px;align-items:center}.energy{position:relative;width:min(220px,34vw);height:22px;background:#0a28468c;border:3px solid var(--paper);border-radius:14px;overflow:hidden}.energy-fill{position:absolute;inset:0;transform-origin:left center;background:linear-gradient(#9cf07a,#4cc15a);transition:background-color .2s}.energy-fill.low{background:linear-gradient(#ffb070,#ff5a4a);animation:pulse .6s infinite alternate}.energy-fill.linked{background:linear-gradient(#ffd1ec,#ff7fbf)}.energy-label{position:absolute;inset:0;display:grid;place-items:center;font-size:12px;font-weight:800;color:#fff;letter-spacing:1px;text-shadow:0 1px 2px rgba(0,0,0,.5)}.energy{transition:width .6s ease-out}.growth{display:flex;align-items:center;gap:8px;padding:3px 10px 3px 4px;border-radius:16px;background:var(--paper);box-shadow:0 3px #0003}.stage-chip{padding:2px 10px;border-radius:12px;background:#ffd84a;font-weight:900;font-size:14px;letter-spacing:.5px}.stage-chip.bump{animation:bump .4s}.growth-bar{position:relative;width:min(130px,20vw);height:12px;border-radius:8px;background:#d8e7ef;overflow:hidden}.growth-bar.bump{animation:bump .35s}.growth-fill{position:absolute;inset:0;transform-origin:left center;transform:scaleX(0);background:linear-gradient(#ffb3dc,#ff6fb5);transition:transform .25s ease-out}.banner{position:absolute;top:calc(52px + var(--safe-t));left:50%;transform:translate(-50%);padding:6px 18px;border-radius:18px;background:#ffd84a;font-weight:900;font-size:22px;box-shadow:0 4px #0003;animation:wobble 1s infinite ease-in-out}.hint{position:absolute;bottom:calc(18px + var(--safe-b));left:50%;transform:translate(-50%);padding:6px 14px;border-radius:14px;background:#fffaf0e6;font-weight:700;font-size:16px;white-space:nowrap}.conn{position:absolute;top:calc(12px + var(--safe-t));right:calc(12px + var(--safe-r));width:10px;height:10px;border-radius:50%;background:#6fe06f;opacity:.8}.conn.bad{background:#ff5a4a}#touch-ring{position:fixed;left:0;top:0;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;border:3px solid rgba(255,255,255,.7);background:#ffffff1f;pointer-events:none}#action-btn{position:fixed;right:calc(24px + var(--safe-r));bottom:calc(24px + var(--safe-b));width:92px;height:92px;border-radius:50%;border:4px solid var(--paper);background:#ff8a5cd9;font-size:40px;touch-action:none}#action-btn.down{transform:scale(.92);background:#ff7fbff2}.screen{position:fixed;inset:0;display:grid;place-items:center;padding:calc(12px + var(--safe-t)) calc(12px + var(--safe-r)) calc(12px + var(--safe-b)) calc(12px + var(--safe-l));background:#08284659}.screen.overlay-top{place-items:start center;background:none;pointer-events:none}.screen.overlay-top .card{pointer-events:auto}.card{background:var(--paper);border-radius:26px;padding:22px 30px;text-align:center;box-shadow:0 8px #0000002e;max-width:92vw;animation:pop .3s ease-out}.card.small{padding:12px 20px}.card.small h2{font-size:20px;margin:0 0 4px}h1{margin:0 0 8px;font-size:clamp(30px,7vw,54px);letter-spacing:2px;color:var(--accent-dark)}h2{margin:0}.tagline,.muted{margin:0 0 14px;opacity:.75}.btn{display:block;width:100%;min-width:220px;margin:10px auto 0;padding:12px 22px;border:none;border-radius:16px;font:inherit;font-size:20px;font-weight:800;cursor:pointer;background:#d8eef9;color:var(--ink);box-shadow:0 4px #0000002e}.btn.primary{background:var(--accent);color:#fff}.btn:active{transform:translateY(3px);box-shadow:0 1px #0000002e}.btn-row{display:flex;gap:10px}.btn-row .btn{min-width:0;font-size:16px;padding:10px 14px}#invite-link{width:100%;padding:8px 10px;border-radius:10px;border:2px solid #cfe3ee;font:inherit;font-size:15px;text-align:center;color:var(--ink);background:#fff;user-select:all}.error{color:#c43b2b;font-weight:700;margin:12px 0 0}.run-time{margin:-8px 0 4px;font-size:clamp(34px,8vw,52px);font-weight:900;font-variant-numeric:tabular-nums}.best{margin:0 0 6px;font-weight:700;opacity:.8;min-height:1.2em}.best.new-best{color:#e0663a;opacity:1;animation:pop .4s ease-out}.screen.pause{background:#08284680}.toast{position:fixed;top:calc(52px + var(--safe-t));right:calc(14px + var(--safe-r));padding:8px 14px;border-radius:14px;background:#0f3350e0;color:#fff;font-weight:700}.rotate-hint{display:none;position:fixed;left:50%;bottom:calc(80px + var(--safe-b));transform:translate(-50%);padding:8px 14px;border-radius:14px;background:#fffaf0eb;font-weight:700;pointer-events:none}@media(orientation:portrait)and (pointer:coarse){.rotate-hint{display:block}}@keyframes pop{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}@keyframes bump{50%{transform:scale(1.18)}}@keyframes pulse{to{opacity:.55}}@keyframes wobble{50%{transform:translate(-50%) scale(1.07) rotate(-2deg)}}