:root{--plum:#3a2948;--cream:#fff3df;--mint:#9fe2d2;--pink:#f9a9c6;--hot-pink:#ff6fae;--gold:#ffcf4d;font-family:ui-rounded,SF Pro Rounded,Nunito,Varela Round,system-ui,sans-serif}html,body{overscroll-behavior:none;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;background:#ffe6f0;height:100%;margin:0;overflow:hidden}#app{position:fixed;inset:0}#app canvas{touch-action:none;display:block}#hud{z-index:1;pointer-events:none;padding:max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));color:var(--plum);flex-direction:column;justify-content:space-between;display:flex;position:fixed;inset:0}[hidden]{display:none!important}.hud-top{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.hud-group{flex-wrap:wrap;gap:8px;display:flex}.hud-pill{background:var(--cream);border:3px solid var(--plum);box-shadow:0 4px 0 var(--plum);border-radius:999px;align-items:baseline;gap:6px;padding:5px 12px 7px;display:flex}.hud-label{opacity:.75;font-size:13px;font-weight:700}.hud-value{font-variant-numeric:tabular-nums;font-size:24px;font-weight:800}.hud-status.is-warning{background:#ffd0dc;animation:1s step-end infinite hud-tick}@keyframes hud-tick{50%{background:var(--cream)}}.hud-coins{align-self:center;gap:5px;display:flex}.hud-coin{border:2.5px solid var(--plum);border-radius:50%;width:16px;height:16px}.hud-coin.is-full{background:var(--gold);box-shadow:inset -2px -2px #0000001f}.hud-pop{animation:.35s ease-out hud-pop}@keyframes hud-pop{40%{transform:scale(1.18)}}.hud-btn{pointer-events:auto;touch-action:manipulation;min-height:44px;font:inherit;color:var(--plum);background:var(--mint);border:3px solid var(--plum);box-shadow:0 4px 0 var(--plum);cursor:pointer;border-radius:16px;padding:8px 16px;font-size:15px;font-weight:800}.hud-btn:active{box-shadow:0 1px 0 var(--plum);transform:translateY(3px)}.hud-btn:focus-visible,.drop-btn:focus-visible,.mode-card:focus-visible{outline:3px solid var(--hot-pink);outline-offset:3px}.hud-controls{justify-content:space-between;align-items:flex-end;gap:16px;display:flex}.joystick{--size:clamp(120px, 34vw, 150px);width:var(--size);height:var(--size);pointer-events:auto;touch-action:none;background:color-mix(in srgb, var(--cream) 75%, transparent);border:3px solid var(--plum);box-shadow:inset 0 0 0 10px color-mix(in srgb, var(--mint) 45%, transparent);border-radius:50%;flex:none;position:relative}.joystick-knob{background:var(--pink);border:3px solid var(--plum);width:42%;height:42%;box-shadow:0 4px 0 var(--plum);border-radius:50%;transition:transform .12s ease-out;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.joystick.is-active .joystick-knob{transition:none}.drop-btn{--size:clamp(96px, 27vw, 120px);width:var(--size);height:var(--size);pointer-events:auto;touch-action:none;font:inherit;color:var(--plum);background:radial-gradient(circle at 35% 30%, #ffc2dc 0 30%, var(--hot-pink) 70%);border:4px solid var(--plum);box-shadow:0 7px 0 var(--plum);cursor:pointer;border-radius:50%;flex:none;margin-left:auto;font-size:22px;font-weight:800;transition:transform 50ms,box-shadow 50ms;position:relative}.drop-btn.is-down{box-shadow:0 2px 0 var(--plum);transform:translateY(5px)}.drop-btn:disabled{color:#3a294873;background:radial-gradient(circle at 35% 30%,#f4eef6 0 30%,#d9cfe0 70%);border-color:#3a29488c;box-shadow:0 7px #3a29488c}.drop-btn__badge{white-space:nowrap;background:var(--cream);border:3px solid var(--plum);border-radius:999px;padding:2px 9px 4px;font-size:13px;font-weight:800;position:absolute;top:-10px;right:-8px}.drop-btn__badge.is-active{background:#ff9ec4;animation:.6s ease-in-out infinite alternate badge-pulse}@keyframes badge-pulse{to{transform:scale(1.1)}}.hud-toasts{pointer-events:none;justify-items:center;gap:8px;display:grid;position:absolute;top:30%;left:0;right:0}.hud-toast{background:var(--cream);border:3px solid var(--plum);box-shadow:0 5px 0 var(--plum);border-radius:999px;padding:8px 18px 10px;font-size:22px;font-weight:900;animation:1.8s ease-out forwards toast}.hud-toast--time{background:#b9e4ff}.hud-toast--credits{background:var(--gold)}.hud-toast--magnet{background:#ff9ec4}@keyframes toast{0%{opacity:0;transform:translateY(12px)scale(.8)}12%{opacity:1;transform:translateY(0)scale(1.08)}20%{transform:scale(1)}75%{opacity:1}to{opacity:0;transform:translateY(-24px)}}#hud[data-joystick=never] .joystick{display:none}@media (hover:hover) and (pointer:fine){#hud[data-joystick=auto] .joystick{display:none}}.hud-overlay{pointer-events:auto;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#ffe6f099;place-items:center;padding:16px;display:grid;position:absolute;inset:0}.hud-card{box-sizing:border-box;text-align:center;background:var(--cream);border:4px solid var(--plum);width:min(360px,100%);max-height:100%;box-shadow:0 8px 0 var(--plum);border-radius:28px;padding:24px 20px 20px;overflow-y:auto}.hud-card__title{letter-spacing:-.01em;margin:0;font-size:clamp(30px,9vw,40px);font-weight:900;line-height:1.05}.hud-card__lede{opacity:.75;margin:8px 0 0;font-size:16px;font-weight:700}.hud-card__lede.is-best{opacity:1;color:#d63c7c}.mode-list{gap:12px;margin-top:20px;display:grid}.mode-card{text-align:left;font:inherit;color:var(--plum);border:3px solid var(--plum);box-shadow:0 5px 0 var(--plum);cursor:pointer;touch-action:manipulation;border-radius:20px;gap:2px;padding:14px 16px 16px;display:grid}.mode-card--timer{background:var(--pink)}.mode-card--credits{background:var(--mint)}.mode-card:active{box-shadow:0 1px 0 var(--plum);transform:translateY(4px)}.mode-card__title{font-size:22px;font-weight:900}.mode-card__text{opacity:.8;font-size:14px;font-weight:700}.hud-result{margin:14px 0 0;font-size:18px;font-weight:800}.hud-result__value{font-variant-numeric:tabular-nums;font-size:64px;font-weight:900;line-height:1;display:block}.hud-actions{gap:10px;margin-top:20px;display:grid}.hud-link{font:inherit;color:var(--plum);text-underline-offset:3px;cursor:pointer;background:0 0;border:0;margin-top:14px;padding:8px 12px;font-size:15px;font-weight:800;text-decoration:underline}.hud-link:focus-visible,.switch:focus-visible,.segmented button:focus-visible{outline:3px solid var(--hot-pink);outline-offset:3px}.hud-card--settings{text-align:left}.hud-card--settings .hud-card__title{text-align:center;margin-bottom:8px}.setting{border-bottom:2px dashed #3a294833;justify-content:space-between;align-items:center;gap:12px;padding:14px 0;display:flex}.setting--stack{flex-direction:column;align-items:stretch;gap:8px}.setting__text{gap:2px;display:grid}.setting__name{font-size:18px;font-weight:900}.setting__hint{opacity:.7;font-size:14px;font-weight:700}.switch{border:3px solid var(--plum);cursor:pointer;touch-action:manipulation;background:#e6dcef;border-radius:999px;flex:none;width:64px;height:36px;padding:0;position:relative}.switch[aria-checked=true]{background:var(--mint)}.switch__knob{background:var(--cream);border:3px solid var(--plum);border-radius:50%;width:24px;height:24px;transition:transform .15s ease-out;position:absolute;top:3px;left:3px}.switch[aria-checked=true] .switch__knob{background:var(--pink);transform:translate(28px)}.segmented{border:3px solid var(--plum);background:#e6dcef;border-radius:16px;grid-auto-columns:1fr;grid-auto-flow:column;gap:4px;padding:4px;display:grid}.segmented button{min-height:40px;font:inherit;color:var(--plum);cursor:pointer;touch-action:manipulation;background:0 0;border:0;border-radius:11px;font-size:15px;font-weight:800}.segmented button[aria-checked=true]{background:var(--cream);box-shadow:0 0 0 2px var(--plum)}.hud-btn--primary{background:var(--pink);min-height:52px;font-size:18px}@media (prefers-reduced-motion:reduce){.hud-pop,.hud-status.is-warning,.drop-btn__badge.is-active{animation:none}.hud-toast{animation-name:toast-fade}.switch__knob,.joystick-knob,.drop-btn{transition:none}}@keyframes toast-fade{0%,to{opacity:0}10%,75%{opacity:1}}.lil-gui.autoPlace{z-index:2;top:calc(max(12px, env(safe-area-inset-top)) + 112px);left:max(8px, env(safe-area-inset-left));max-height:calc(100% - 300px);right:auto}
