:root{--cream:#fff4df;--ink:#31584a;--orange:#ef8745;--radius:20px;--shadow:0 6px 18px #0000002e;--safe-top:env(safe-area-inset-top,0px);--safe-bottom:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box}.stage{touch-action:none;position:fixed;inset:0;overflow:hidden}.game{display:block;position:absolute;inset:0}.hud{top:calc(8px + var(--safe-top));pointer-events:none;flex-wrap:wrap;gap:6px;display:flex;position:absolute}.hud.left{left:8px;right:64px}.hud.right{right:8px}.pill{background:var(--cream);color:var(--ink);box-shadow:var(--shadow);pointer-events:auto;border:3px solid #fff;border-radius:999px;padding:4px 10px;font:700 15px/1.2 Trebuchet MS,system-ui,sans-serif}button.pill.round{cursor:pointer;width:46px;height:46px;padding:0;font-size:20px}.snap{right:16px;bottom:calc(24px + var(--safe-bottom));background:var(--cream);width:76px;height:76px;box-shadow:var(--shadow);cursor:pointer;border:4px solid #fff;border-radius:50%;font-size:34px;transition:transform .12s;position:absolute}.snap.perfect{box-shadow:0 0 0 6px #ffdc5a99, var(--shadow);background:#fff2a8;transform:scale(1.1)}.bubble{left:50%;top:calc(64px + var(--safe-top));background:var(--cream);color:var(--ink);border-radius:var(--radius);box-shadow:var(--shadow);pointer-events:none;border:3px solid #fff;padding:8px 16px;font:700 22px/1.2 Trebuchet MS,system-ui,sans-serif;animation:1.8s both pop;position:absolute;transform:translate(-50%)}@keyframes pop{0%{opacity:0;transform:translate(-50%,-8px)scale(.8)}10%,80%{opacity:1;transform:translate(-50%)scale(1)}to{opacity:0}}.cover{background:#14281e73;place-items:center;padding:16px;display:grid;position:absolute;inset:0}.panel{background:var(--cream);color:var(--ink);border-radius:var(--radius);box-shadow:var(--shadow);text-align:center;border:4px solid #fff;justify-items:center;gap:12px;padding:20px 28px;font-family:Trebuchet MS,system-ui,sans-serif;display:grid}.panel .big{font-size:56px}.panel .stats{margin:0;font-size:20px;font-weight:700}.panel .build{opacity:.6;margin:0;font-size:11px}.center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.btn{min-width:120px;min-height:48px;color:var(--ink);box-shadow:var(--shadow);cursor:pointer;background:#fff;border:3px solid #fff;border-radius:999px;font-size:22px}.btn.primary{background:var(--orange)}.btn:focus-visible,.pill:focus-visible,.snap:focus-visible{outline-offset:2px;outline:4px solid #2b6cb0}.card{width:min(340px,100%);color:var(--ink);box-shadow:var(--shadow);background:#fffaf0;border:6px solid #5fa070;border-radius:22px;gap:8px;padding:14px 16px;font-family:Trebuchet MS,system-ui,sans-serif;animation:.5s both develop;display:grid}@keyframes develop{0%{opacity:0;filter:brightness(1.8);transform:translateY(-30px)rotate(-3deg)}}.card-head{justify-content:space-between;align-items:baseline;display:flex}.card-name{font-size:22px;font-weight:700}.card-pic{background:linear-gradient(#cdeaf2,#e8f3d0);border-radius:14px;place-items:center;height:120px;font-size:72px;display:grid}.perfect-tag{justify-self:center;font-weight:700}.fact{margin:0;font-size:15px;line-height:1.4}.facts{flex-wrap:wrap;gap:4px 14px;font-size:13px;display:flex}.battle{border-top:2px dashed #d8cdb0;gap:4px;padding-top:8px;display:grid}.battle-top{justify-content:space-between;font-size:18px;display:flex}.juice{background:#ffe7b0;border-radius:999px;padding:0 10px;font-size:15px;font-weight:700}.dots{align-items:center;gap:4px;display:flex}.dlabel{width:28px}.dot{background:#e2dccb;border-radius:50%;width:14px;height:14px}.dot.on{background:#4f9a5e}.special{font-size:14px}.card .btn{justify-self:center}