:root{--ink:#3b2414;--ink-soft:#8a6a4c;--cream:#fffaf0;--sky:#bfe6ff;--grass:#8ccf5a;--grass-deep:#4e8f2e;--box-light:#aad751;--box-dark:#a2d149;--dirt-light:#e8c9a6;--dirt-dark:#dbbb98;--gold:#ffcf3a;--orange:#ff7a45;--orange-deep:#d65a26;--outline:2px 0 0 var(--ink), -2px 0 0 var(--ink), 0 2px 0 var(--ink), 0 -2px 0 var(--ink), 1.5px 1.5px 0 var(--ink), -1.5px -1.5px 0 var(--ink), 1.5px -1.5px 0 var(--ink), -1.5px 1.5px 0 var(--ink);color:var(--ink);background:var(--grass);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent;font-family:Fredoka,Avenir Next,Trebuchet MS,system-ui,sans-serif}*{box-sizing:border-box}body{background:var(--grass);overscroll-behavior:none;min-height:100dvh;margin:0}button{font:inherit;color:inherit}.svg-defs{width:0;height:0;position:absolute;overflow:hidden}.big-button{color:#fff;text-shadow:0 2px 0 var(--orange-deep);background:linear-gradient(#ff9a5c, var(--orange));border:3px solid var(--ink);box-shadow:0 5px 0 var(--ink);cursor:pointer;border-radius:999px;padding:12px 34px;font-size:1.35rem;font-weight:700;transition:transform 80ms,box-shadow 80ms}.big-button:hover{filter:brightness(1.05)}.big-button:active{box-shadow:0 1px 0 var(--ink);transform:translateY(4px)}.plain-button{text-underline-offset:3px;cursor:pointer;background:0 0;border:0;padding:6px 10px;font-size:1.05rem;font-weight:600;text-decoration:underline}.icon-button{border:2.5px solid var(--ink);cursor:pointer;width:38px;height:38px;box-shadow:0 2px 0 var(--ink);background:#fff;border-radius:50%;place-items:center;display:grid}.icon-button:active{box-shadow:none;transform:translateY(2px)}button:focus-visible{outline-offset:2px;outline:3px solid #2f80ed}.title-screen{background:var(--grass);min-height:100dvh;padding-bottom:32px}.title-inner{text-align:center;max-width:600px;margin:0 auto;padding:8px 16px 0}.logo{text-wrap:balance;color:#fff;text-shadow:var(--outline), 0 6px 0 var(--ink);letter-spacing:.01em;margin:14px 0 4px;font-size:clamp(2.3rem,10vw,3.4rem);font-weight:700;line-height:1}.logo .poop-icon{vertical-align:-.1em}.tagline{max-width:24em;margin:12px auto 4px;font-size:1.15rem;font-weight:500}.title-andrew{margin:6px 0 10px;display:inline-block;position:relative}.title-andrew .speech{top:0;left:70%}.andrew-button{cursor:pointer;background:0 0;border:0;padding:0;line-height:0}.andrew-button:active .andrew-face{transform:scale(.94)}.andrew-face{transition:transform .1s;overflow:visible}.play-button{margin:0 auto;padding:14px 72px;font-size:1.9rem;display:block}.best{margin:14px 0 0;font-size:1.1rem}.how-to{text-align:left;background:var(--cream);border:3px solid var(--ink);border-radius:20px;margin-top:26px;padding:16px 18px 18px;box-shadow:0 5px #0000002e}.how-to h2{margin:4px 0 8px;font-size:1.3rem}.how-to ol{margin:0 0 14px;padding-left:1.4em;line-height:1.45}.how-to li+li{margin-top:4px}.poop-guide{grid-template-columns:1fr 1fr;gap:8px;margin:0;padding:0;list-style:none;display:grid}.poop-guide li{background:#fff;border:2px solid #e6d6bd;border-radius:14px;align-items:center;gap:8px;padding:6px 10px 6px 6px;font-weight:500;line-height:1.15;display:flex}.poop-guide b{margin-left:auto;font-size:1.15rem}.game{background:var(--grass);flex-direction:column;display:flex;position:fixed;inset:0;overflow:hidden}.hud{z-index:5;padding:6px 12px 8px;padding-top:max(6px, env(safe-area-inset-top));background:var(--cream);border-bottom:3px solid var(--ink);grid-template-columns:auto 1fr;grid-template-areas:"face top""face progress""bottom bottom";align-items:center;gap:2px 10px;display:grid;position:relative}.hud .andrew-button{grid-area:face}.hud-top{grid-area:top;justify-content:space-between;align-items:center;gap:8px;min-width:0;display:flex}.hud-day{white-space:nowrap;text-overflow:ellipsis;min-width:0;overflow:hidden}.hud-day strong{font-size:1.2rem}.hud-day span{color:var(--ink-soft);margin-left:6px;font-weight:500}.hud-buttons{flex:none;gap:6px;display:flex}.hud-progress{white-space:nowrap;grid-area:progress;align-items:center;gap:8px;display:flex}.bar{border:2.5px solid var(--ink);background:#eadcc4;border-radius:999px;flex:1;height:16px;overflow:hidden}.bar span{background:linear-gradient(#ffe27a,#ffb52b);height:100%;transition:width .35s ease-out;display:block}.hud-bottom{grid-area:bottom;justify-content:space-between;align-items:center;gap:8px;margin-top:4px;display:flex}.hud-rolls{display:flex}.tp.used{opacity:.22;filter:grayscale()}.hud-stat{align-items:center;gap:4px;font-size:1.15rem;display:flex}.hud-score{flex-direction:column;gap:0;line-height:1}.hud-score span{text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft);font-size:.7rem;font-weight:600}.mode-switch{border:2.5px solid var(--ink);background:#fff;border-radius:999px;flex:none;display:flex;overflow:hidden}.mode-switch button{cursor:pointer;background:0 0;border:0;align-items:center;gap:4px;padding:5px 12px 5px 8px;font-weight:600;display:flex}.mode-switch button+button{border-left:2.5px solid var(--ink)}.mode-switch button[aria-pressed=true]{background:var(--gold)}@media (width>=760px){.hud{grid-template-columns:auto minmax(240px,1fr) auto;grid-template-areas:"face top bottom""face progress bottom";gap:2px 18px;padding-left:18px;padding-right:18px}.hud-bottom{gap:18px;margin-top:0}}.speech{z-index:8;border:3px solid var(--ink);text-align:left;transform-origin:12px 0;pointer-events:none;background:#fff;border-radius:16px;max-width:min(260px,70vw);margin:0;padding:8px 12px;font-weight:600;line-height:1.25;animation:3.4s ease-out forwards bubble;position:absolute;box-shadow:0 3px #0003}.speech:before{content:"";border:10px solid #0000;border-bottom-color:var(--ink);border-top:0;position:absolute;top:-12px;left:14px}.hud .speech{top:calc(100% - 4px);left:14px}@keyframes bubble{0%{opacity:0;transform:scale(.5)}8%{opacity:1;transform:scale(1.06)}12%{transform:scale(1)}85%{opacity:1}to{opacity:0;visibility:hidden}}.dog-run{border-bottom:3px solid var(--grass-deep);flex:none;position:relative;overflow:hidden}.dog-run svg{display:block}.dog-alarm{fill:#ff4f3f;stroke:#fff;stroke-width:4px;paint-order:stroke;font-size:24px;font-weight:700}.board-area{min-height:0;padding:8px;padding-bottom:max(8px, env(safe-area-inset-bottom));flex:1;place-items:center;display:grid}.board{border:4px solid var(--grass-deep);background:var(--grass-deep);touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;border-radius:6px;display:grid;position:relative;box-shadow:0 6px #0000002e}.box{width:var(--box);height:var(--box);cursor:pointer;-webkit-touch-callout:none;border:0;border-radius:0;place-items:center;margin:0;padding:0;display:grid;position:relative}.box.light{background:var(--box-light)}.box.dark{background:var(--box-dark)}.box.covered,.box.flagged{box-shadow:inset 0 3px #ffffff47,inset 0 -3px #00000017}@media (hover:hover){.box.covered:hover{background:#bfe46b}}.box.cleared.light,.box.exploded.light{background:var(--dirt-light)}.box.cleared.dark,.box.exploded.dark{background:var(--dirt-dark)}.box.cleared,.box.exploded{cursor:default}.box:focus-visible{z-index:2;outline-offset:-3px;outline:3px solid #fff}.box>svg{pointer-events:none;width:74%;height:74%}.box>.box-art{width:96%;height:96%}.near{font-size:calc(var(--box) * .62);pointer-events:none;font-weight:700;line-height:1}.n1{color:#1976d2}.n2{color:#388e3c}.n3{color:#d32f2f}.n4{color:#7b1fa2}.n5{color:#ef6c00}.n6{color:#00838f}.n7{color:#424242}.n8{color:#8d6e63}.ripple{pointer-events:none;position:absolute;inset:0}.lid{animation:.38s ease-in both lid-off;position:absolute;inset:0}.box.light .lid{background:var(--box-light)}.box.dark .lid{background:var(--box-dark)}@keyframes lid-off{to{opacity:0;transform:translateY(-30%)scale(.2)rotate(30deg)}}.pop{width:80%;height:auto;animation:.75s ease-out both poop-pop;position:absolute;bottom:18%;left:10%}@keyframes poop-pop{0%{opacity:0;transform:scale(.3)}25%{opacity:1;transform:translateY(-30%)scale(1.1)}70%{opacity:1;transform:translateY(-80%)scale(.95)}to{opacity:0;transform:translateY(-140%)scale(.6)}}.effects{z-index:25;pointer-events:none;position:absolute;inset:0}.effect{--edge:26px;left:clamp(var(--edge), calc(var(--box) * var(--col)), calc(100% - var(--edge)));top:max(14px, calc(var(--box) * var(--row)));white-space:nowrap;align-items:center;gap:2px;font-weight:700;display:flex;position:absolute;transform:translate(-50%,-50%)}.effect-points{color:#fff;text-shadow:var(--outline);font-size:1.5rem;animation:.95s ease-out both float-up}.effect-special{--edge:80px;background:linear-gradient(#fff2a8, var(--gold));border:3px solid var(--ink);border-radius:999px;padding:2px 12px 2px 4px;font-size:1.05rem;animation:1.8s ease-out both float-up;box-shadow:0 3px #0003}.effect-boom{--edge:66px;animation:1.2s ease-out forwards boom}.effect-boom .burst{fill:#ffe14d;width:150px;stroke:var(--ink);stroke-width:4px;stroke-linejoin:round;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.effect-boom span{color:#8a4512;text-shadow:0 2px #fff;font-size:1.55rem;position:relative;transform:rotate(-8deg)}@keyframes float-up{0%{opacity:0;transform:translate(-50%,-30%)scale(.6)}15%{opacity:1;transform:translate(-50%,-85%)scale(1.12)}80%{opacity:1}to{opacity:0;transform:translate(-50%,-175%)scale(1)}}@keyframes boom{0%{opacity:0;transform:translate(-50%,-50%)scale(.2)}12%{opacity:1;transform:translate(-50%,-50%)scale(1.2)}24%{transform:translate(-50%,-50%)scale(1)}80%{opacity:1}to{opacity:0;transform:translate(-50%,-60%)scale(1)}}.splat-overlay{z-index:20;pointer-events:none;position:fixed;inset:0;overflow:hidden}.splat-drop{height:auto;animation:1.7s ease-out both splat-hit;position:absolute}@keyframes splat-hit{0%{opacity:0;transform:translate(-50%,-50%)scale(.1)}10%{opacity:.95;transform:translate(-50%,-50%)scale(1.18)}20%{transform:translate(-50%,-50%)scale(1)}70%{opacity:.9;transform:translate(-50%,-38%)scaleY(1.1)}to{opacity:0;transform:translate(-50%,-20%)scaleY(1.25)}}.overlay{z-index:30;background:#28190a73;place-items:center;padding:16px;display:grid;position:fixed;inset:0;overflow-y:auto}.card{text-align:center;background:var(--cream);border:4px solid var(--ink);border-radius:24px;width:min(100%,420px);padding:20px 20px 22px;animation:.35s cubic-bezier(.3,1.5,.5,1) card-in;box-shadow:0 8px #00000040}.card-win{background:linear-gradient(#fffbe3, var(--cream))}@keyframes card-in{0%{opacity:0;transform:translateY(20px)scale(.9)}}.card h2{margin:4px 0 2px;font-size:1.85rem;line-height:1.1}.card-kicker{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);margin:0;font-weight:600}.card-lead{margin:6px 0 12px;font-size:1.1rem}.goal-list{text-align:left;gap:6px;margin:0 0 12px;padding:0;list-style:none;display:grid}.goal-list li{background:#fff;border:2px solid #e6d6bd;border-radius:12px;align-items:center;gap:10px;padding:7px 12px;font-size:1.05rem;display:flex}.new-dogs{margin:0 0 10px}.new-dogs div{justify-content:center;gap:8px;display:flex}.new-dogs figcaption{font-weight:600}.tip{background:#fff6cf;border:2px dashed #e0b84a;border-radius:12px;margin:0 0 16px;padding:8px 12px}.tally{text-align:left;background:#fff;border:2px solid #e6d6bd;border-radius:12px;grid-template-columns:1fr auto;gap:6px 16px;margin:0 0 16px;padding:12px 16px;display:grid}.tally dd{text-align:right;margin:0;font-weight:700}.tally .tally-total{border-top:2px solid #e6d6bd;padding-top:6px;font-size:1.2rem;font-weight:700}.tally dt.tally-total:first-child,.tally dt.tally-total:first-child+dd{border-top:0;padding-top:0}.card-buttons{flex-direction:column;align-items:center;gap:8px;display:flex}.trophy{font-size:3rem;line-height:1}.new-best{color:var(--orange-deep);margin:0 0 12px;font-size:1.2rem;font-weight:700}.poop-glow{transform-box:fill-box;transform-origin:50%;animation:1.4s ease-in-out infinite glow}@keyframes glow{50%{opacity:.5;transform:scale(.85)}}.twinkle{transform-box:fill-box;transform-origin:50%;animation:1.2s ease-in-out infinite twinkle}.twinkle-2{animation-delay:.4s}.twinkle-3{animation-delay:.8s}@keyframes twinkle{0%,to{opacity:.2;transform:scale(.5)}50%{opacity:1;transform:scale(1.15)}}.andrew-face.mood-gross{animation:.45s ease-out shudder}@keyframes shudder{20%{transform:translate(-4px)rotate(-4deg)}45%{transform:translate(4px)rotate(4deg)}70%{transform:translate(-2px)rotate(-1deg)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
