.count-player{--co-bg:#fff8ec;--co-primary:#7351bc;--co-ink:#33304f;position:fixed;inset:0;margin:0;padding:0;border:0;width:100%;height:100%;max-width:none;max-height:none;background:var(--co-bg);color:var(--co-ink);font-family:Fredoka,sans-serif}.count-player *{box-sizing:border-box}.count-player::backdrop{background:var(--co-bg)}body:has(.count-player[open]){overflow:hidden}.count-shell{max-width:440px;min-height:100svh;padding:16px 20px max(20px,env(safe-area-inset-bottom));margin:auto;display:flex;flex-direction:column}.count-player button{font:500 18px Fredoka,sans-serif;border:0;border-radius:24px;min-height:72px;cursor:pointer;touch-action:manipulation;color:var(--co-ink)}.count-player button:active{transform:scale(.96)}.count-player button:focus-visible{outline:3px solid var(--co-primary);outline-offset:4px}.count-player svg{width:28px;height:28px}.count-top{display:flex;align-items:center;justify-content:space-between;gap:12px}.count-top strong{font-size:24px}.count-top button{width:72px;background:#ede3fa;color:var(--co-primary);display:grid;place-items:center}.count-progress{display:flex;gap:8px;margin-top:16px}.count-progress span{height:8px;border-radius:20px;background:#e9dff2;flex:1}.count-progress .lit{background:var(--co-primary)}.count-shell main{flex:1;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:12px;padding:20px 0 14px}.count-kicker{font:11px Andika,sans-serif;letter-spacing:1px;color:#655d70;margin:0}.count-shell h1{font:500 28px/1.2 Fredoka,sans-serif;text-align:center;margin:0}.count-player h1:focus{outline:none}.count-instruction{font:13px/1.5 Andika,sans-serif;color:#655d70;text-align:center;margin:0}.count-scene{position:relative;width:100%;height:410px;background:#def1ed;border-radius:36px;overflow:hidden;border:2px solid #d2e6d9;isolation:isolate}.count-cloud{position:absolute;top:18px;width:72px;height:24px;background:#ffffffa8;border-radius:50px;z-index:-1}.count-cloud:after{content:'';position:absolute;left:22px;bottom:0;width:32px;height:40px;border-radius:50%;background:inherit}.cloud-one{left:24px}.cloud-two{right:24px;top:110px;width:50px;opacity:.6}.count-hill{position:absolute;border-radius:50%;z-index:-1;background:#b6dac2;width:150%;height:75%;bottom:-15%;left:-50%}.hill-front{background:#c8e4b3;bottom:-35%;left:-10%;height:100%}.count-path{position:absolute;inset:0;width:100%!important;height:100%!important;pointer-events:none;z-index:0}.count-trail{fill:none;stroke:#fffaf0;stroke-width:1.2;stroke-dasharray:2 2;stroke-linecap:round;stroke-linejoin:round}.count-stone{position:absolute;z-index:2;width:78px;min-width:72px;height:76px;min-height:72px!important;margin-left:-39px;margin-top:-25px;border-radius:24px!important;background:#658d78;border:3px solid #fff5cf!important;box-shadow:0 8px 0 #426955;display:grid;place-items:center;padding:6px}.count-stone:active{transform:translateY(4px)!important;box-shadow:0 4px 0 #426955}.count-stone.visited{background:#9c7bc9;box-shadow:0 8px 0 #6f509c}.count-stone.hint{outline:4px solid #7351bc;outline-offset:5px}.count-stone .count-digit{width:50px;height:58px;pointer-events:none}.count-digit path{fill:none;stroke:#fff5d4;stroke-width:12;stroke-linecap:round;stroke-linejoin:round}.count-wopi{position:absolute;z-index:3;width:58px;height:68px;object-fit:contain;transform:translate(-50%,-100%);pointer-events:none;transition:left 420ms ease-in-out,top 420ms ease-in-out;user-select:none}.count-wopi.hop{animation:count-hop 420ms ease-in-out}.count-goal{position:absolute;z-index:4;transform:translate(-50%,-100%);margin-top:-20px;color:#edaf31;pointer-events:none;filter:drop-shadow(0 2px 0 #fff5)}.count-goal svg{width:34px;height:34px}.count-goal.collected{color:#bd8830;transform:translate(-50%,-140%) scale(1.2)}.count-caption{font:500 20px Fredoka,sans-serif;color:#604491;margin:0}.count-status{font:13px/1.5 Andika,sans-serif;color:#554d65;margin:0;min-height:40px;text-align:center}.count-next,.count-help{width:100%;display:flex;align-items:center;justify-content:center;gap:12px}.count-next{background:var(--co-primary);color:white!important;box-shadow:0 5px 0 #52358e}.count-help{background:#ede3fa;color:#594285!important}.count-player [hidden]{display:none!important}.count-summary{justify-content:center;align-items:center;gap:24px;text-align:center}.count-summary>img{width:180px;height:200px;object-fit:contain}.count-summary p{font:15px/1.6 Andika,sans-serif;margin:0}.count-stars{display:flex;gap:16px;color:#d69a15}.count-stars svg{width:44px;height:44px}@keyframes count-hop{50%{transform:translate(-50%,calc(-100% - 22px)) rotate(-5deg)}}@media(max-height:780px){.count-shell main{padding:14px 0 8px;gap:10px}.count-scene{height:340px}.count-shell h1{font-size:25px}.count-status{min-height:36px}.count-summary{gap:18px}.count-summary>img{width:140px;height:155px}}@media(max-width:350px){.count-shell{padding-left:16px;padding-right:16px}.count-shell h1{font-size:23px}.count-stone{width:72px;margin-left:-36px}}@media(prefers-reduced-motion:reduce){.count-player *{animation:none!important;transition:none!important}}

/* Illustrated woodland stage: decorative scene is separate from readable numerals. */
.count-scene{background:#dcead4 url('assets/count/garden-v1.png') center/cover no-repeat;border-color:#d6e2c8;box-shadow:inset 0 0 0 2px #fff6}.count-cloud,.count-hill,.count-goal{display:none}.count-stone,.count-stone.visited{width:90px;height:82px;margin-left:-45px;margin-top:-25px;background:transparent url('assets/count/stump-v1.png') center/100% 100% no-repeat;border:0!important;box-shadow:none!important;border-radius:20px!important;padding:10px 16px 0}.count-stone:active{box-shadow:none!important;transform:translateY(3px) scale(.97)!important}.count-stone .count-digit{width:44px;height:52px;transform:translateY(4px);filter:drop-shadow(1px 2px 0 #653d52)}.count-digit path{stroke:#fff9df;stroke-width:12}.count-stone.hint{outline:4px solid #7351bc;outline-offset:0;background-color:#fff4ab55}.count-stone.visited{outline:none}.count-tick{position:absolute;right:-1px;bottom:-2px;width:22px;height:22px;border-radius:50%;display:grid;place-items:center;background:#447c5b;color:white;box-shadow:0 0 0 2px #fff8df}.count-tick svg{width:16px;height:16px}.count-trail{stroke:#fffae5;stroke-width:1.3}.count-wopi{filter:drop-shadow(0 3px 2px #3a59352b)}
@media(max-width:350px){.count-stone,.count-stone.visited{width:78px;height:76px;margin-left:-39px;padding:10px 10px 0}.count-stone .count-digit{width:40px;height:48px;transform:translateY(3px)}}
