:root {
  --ink:oklch(30% .045 164);--ink-muted:oklch(43% .035 164);--paper:oklch(96% .023 83);
  --paper-dark:oklch(87% .048 83);--orange:oklch(78% .16 68);--orange-dark:oklch(66% .15 61);
  --leaf:oklch(42% .06 163);--line:oklch(56% .04 153);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);font-size:16px;
}
*{box-sizing:border-box}
body{margin:0;background:var(--ink);display:grid;place-items:center;min-height:100svh}
button,input{font:inherit}
button{color:var(--ink);cursor:pointer;touch-action:manipulation}
button,a{-webkit-tap-highlight-color:transparent}
button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid var(--orange-dark);outline-offset:4px}
button:disabled{cursor:default;opacity:.6}
button{border:2px solid var(--ink);border-radius:12px;background:var(--paper);min-height:48px;padding:10px 16px;font-weight:700;box-shadow:0 3px 0 var(--ink);transition:transform 110ms cubic-bezier(.25,1,.5,1),background 110ms}
button:active:not(:disabled){transform:translateY(2px);box-shadow:0 1px 0 var(--ink)}
a{color:inherit;text-underline-offset:4px}
h1,h2,h3,p{margin:0}
h1{font-size:2.25rem;line-height:1.06;letter-spacing:-.045em;text-wrap:balance}
h2{font-size:1.65rem;letter-spacing:-.025em}
h3{font-size:1.15rem}
p{line-height:1.5}
[hidden]{display:none!important}
.game{position:relative;isolation:isolate;width:min(100%,1440px);height:100svh;overflow:hidden;background:#86bed2}
#world{position:absolute;inset:0;width:100%;height:100%;touch-action:none}
.icon{width:32px;height:32px;flex:none;vertical-align:middle}
.icon-button{display:grid;place-items:center;width:48px;padding:6px;border-radius:14px}
.hud{position:absolute;inset:0 0 auto;z-index:2;display:flex;align-items:center;gap:12px;padding:10px max(12px,env(safe-area-inset-right)) 10px max(12px,env(safe-area-inset-left));background:var(--paper);border-bottom:2px solid var(--ink);min-height:68px}
.hud .place{font-size:1.15rem;white-space:nowrap}
.hud .counters{display:flex;gap:12px;align-items:center;margin-left:auto;font-variant-numeric:tabular-nums}
.counters>span,.counter-button{display:flex;gap:6px;align-items:center;white-space:nowrap;font-weight:750;font-size:1rem}
.counter-button{border:0;box-shadow:none;padding:5px;min-height:48px;background:none}
.hud .icon-button{min-height:44px;width:44px;box-shadow:0 2px 0 var(--ink)}
.reticle{position:absolute;top:50%;left:50%;width:10px;height:10px;transform:translate(-50%,-50%);border:2px solid var(--ink);border-radius:50%;background:var(--paper);box-shadow:0 0 0 2px var(--paper)}
.reticle.ready{width:22px;height:22px;background:transparent;border-color:var(--orange);box-shadow:0 0 0 2px var(--ink)}
.field-feedback{position:absolute;left:50%;top:calc(50% + 32px);transform:translateX(-50%);width:min(75%,420px);pointer-events:none;text-align:center;display:grid;justify-items:center;gap:8px}
#target:empty,#notice:empty{display:none}
#target,.notice{font-size:.9rem;padding:7px 12px;background:var(--paper);border:1px solid var(--ink);border-radius:8px;max-width:100%;color:var(--ink);line-height:1.3}
.notice{font-weight:700;background:var(--orange);box-shadow:0 2px 0 var(--ink)}
.scoop-meter{width:140px;padding:5px;background:var(--paper);border-radius:10px;border:1px solid var(--ink)}
progress{width:100%;height:12px;accent-color:var(--leaf);border:0;border-radius:9px;overflow:hidden}
progress::-webkit-progress-bar{background:var(--paper-dark);border-radius:9px}
progress::-webkit-progress-value{background:var(--leaf);border-radius:9px}
.controls{position:absolute;left:0;right:0;bottom:0;display:flex;align-items:flex-end;justify-content:space-between;padding:16px max(16px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left));pointer-events:none;z-index:3}
.controls>*{pointer-events:auto}
.thumb-pad{width:112px;height:112px;border:3px solid var(--ink);background:var(--paper);border-radius:50%;position:relative;box-shadow:inset 0 0 0 4px var(--paper-dark),0 4px 0 var(--ink);touch-action:none;user-select:none}
.thumb-pad button{position:absolute;border:0;background:none;box-shadow:none;min-height:40px;width:40px;padding:7px;border-radius:50%}
.thumb-pad .icon{width:24px;height:24px}
.thumb-pad .up{top:-1px;left:50%;transform:translateX(-50%)}
.thumb-pad .down{bottom:-1px;left:50%;transform:translateX(-50%)}
.thumb-pad .left{left:-1px;top:50%;transform:translateY(-50%)}
.thumb-pad .right{right:-1px;top:50%;transform:translateY(-50%)}
.thumb-pad .down .icon{transform:rotate(180deg)}
.thumb-pad .left .icon{transform:rotate(-90deg)}
.thumb-pad .right .icon{transform:rotate(90deg)}
.nub{position:absolute;left:50%;top:50%;width:30%;height:30%;margin:-15%;border-radius:50%;background:var(--leaf);border:2px solid var(--ink);box-shadow:inset 0 2px 1px var(--line);pointer-events:none}
.pad-label{position:absolute;top:calc(100% + 5px);left:50%;transform:translateX(-50%);color:var(--paper);font-weight:750;font-size:.75rem;letter-spacing:.02em;text-shadow:0 1px 2px var(--ink)}
.right-controls{display:grid;gap:10px;justify-items:end}
.right-pad-row{display:flex;align-items:flex-end;gap:12px}
.look-pad{width:84px;height:84px}
.look-pad button{width:36px;min-height:36px;padding:8px}
.look-pad .icon{width:18px;height:18px}
.tool-tabs{display:flex;gap:8px}
.tool-tabs button{width:48px;height:48px;padding:7px;border-radius:12px}
.tool-tabs button[aria-pressed=true]{background:var(--orange);box-shadow:inset 0 0 0 2px var(--paper),0 3px 0 var(--ink)}
.action-button{border-radius:50%;width:84px;height:84px;padding:15px;min-height:84px;background:var(--orange);border:3px solid var(--ink);box-shadow:inset 0 0 0 4px var(--paper),0 5px 0 var(--ink);touch-action:none}
.action-button .icon{width:48px;height:48px}
.action-button.holding{background:var(--orange-dark);transform:translateY(3px)}
.goal-ready{position:absolute;left:50%;bottom:180px;transform:translateX(-50%);display:grid;gap:8px;text-align:center;background:var(--paper);padding:12px 18px;border:2px solid var(--ink);border-radius:14px;z-index:2;white-space:nowrap}
.goal-ready span{font-size:.85rem;font-weight:700}
.goal-ready button,.primary{background:var(--orange)}
.loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:24px;background:var(--paper);text-align:center;z-index:5}
.loading progress{max-width:280px}
.screen{position:absolute;inset:0;display:grid;place-items:center;padding:24px 16px max(24px,env(safe-area-inset-bottom));overflow:auto;z-index:4;background:oklch(27% .045 164 / .20)}
.sheet{width:min(520px,100%);background:var(--paper);padding:28px;border:2px solid var(--ink);border-radius:20px;box-shadow:0 7px 0 var(--ink);display:grid;gap:20px}
.sheet .studio{font-size:.875rem;font-weight:650}
.forward-icon{width:24px;height:24px;transform:rotate(90deg);margin-left:4px}
.release-screen{background:none;display:block;pointer-events:none}
.release-caption{position:absolute;top:12%;left:50%;transform:translateX(-50%);width:min(90%,440px);padding:16px 24px;background:var(--paper);border:2px solid var(--ink);border-radius:16px;text-align:center}
.release-caption p{margin-top:8px;font-size:.9rem}
.sheet>p{color:var(--ink-muted)}
fieldset{border:0;padding:0;margin:0;min-width:0}
legend{font-weight:750;margin-bottom:10px;font-size:1rem}
.choices{display:flex;gap:12px}
.choice{flex:1;display:flex;align-items:center;flex-direction:column;padding:8px;gap:6px;background:var(--paper);border-color:var(--line);box-shadow:0 3px 0 var(--line);min-width:0}
.choice[aria-pressed=true]{border-color:var(--ink);background:var(--paper-dark);box-shadow:0 3px 0 var(--ink)}
.sprite{display:block;flex:none;background-repeat:no-repeat;width:88px;height:88px;background-size:300% 200%;background-image:url("./assets/wildlife-v1.webp")}
.sprite.girl{background-position:50% 100%}.sprite.boy{background-position:100% 100%}
.sprite.treefrog{background-position:0 0}.sprite.mosquitofish{background-position:50% 0}
.sprite.pigfrog{background-position:100% 0}.sprite.bluegill{background-position:0 100%}
.bucket-sprite{background-image:url("./assets/hands-v1.webp");width:72px;height:72px;background-position:0 0}
.bucket-sprite.coral{background-position:50% 0}.bucket-sprite.mango{background-position:100% 0}
.choice span:last-child{font-size:.875rem}
.button-row{display:flex;flex-wrap:wrap;gap:12px}.button-row>*{flex:1}
.mission-goal{display:flex;align-items:center;justify-content:center;gap:20px;padding:12px 0;border-block:1px solid var(--paper-dark)}
.mission-goal span{display:flex;align-items:center;gap:8px;font-weight:750}
.kit{display:flex;gap:20px;justify-content:center;color:var(--ink-muted);font-size:.9rem}
.kit span{display:flex;align-items:center;gap:6px}
.credit{font-size:.75rem;text-align:center;color:var(--ink-muted)}
.receipt{display:grid;gap:10px;padding:12px 0;border-block:1px solid var(--paper-dark)}
.receipt>div{display:flex;justify-content:space-between}
.receipt .total{font-size:1.25rem;font-weight:800}
.discovered{display:flex;flex-wrap:wrap;gap:8px;font-size:.875rem;align-items:center}
dialog{color:var(--ink);background:var(--paper);border:2px solid var(--ink);border-radius:18px;padding:24px;width:min(500px,calc(100% - 24px));max-height:calc(100svh - 32px);box-shadow:0 7px 0 var(--ink)}
dialog::backdrop{background:oklch(22% .04 164 / .58)}
.panel-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px}
#panel-content{display:grid;gap:20px}
.setting{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center}
.setting input[type=range]{grid-column:1 / -1;min-height:36px;width:100%;accent-color:var(--leaf)}
.setting input[type=checkbox]{width:24px;height:24px;accent-color:var(--leaf)}
.help{display:grid;gap:16px;margin:0;padding-left:24px;line-height:1.5}
.journal-list,.bucket-list{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.journal-list li,.bucket-list li{display:flex;align-items:center;gap:12px;padding:8px 0;border-bottom:1px solid var(--paper-dark)}
.journal-list .sprite,.bucket-list .sprite{width:76px;height:76px}
.journal-list p{font-size:.875rem;color:var(--ink-muted)}
.journal-list .undiscovered .sprite{filter:brightness(.25);opacity:.4}
.bucket-list li>div{flex:1}
.bucket-list button{padding:8px;font-size:.875rem}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
@media(min-width:700px){
  .thumb-pad.move-pad{width:132px;height:132px}.look-pad{width:100px;height:100px}
  .controls{padding:24px 28px 28px}.action-button{width:100px;height:100px}
  .sheet{padding:32px}.sheet h1{font-size:2.65rem}
}
@media(min-width:1100px) and (min-height:650px){
  .game{height:min(900px,96svh);border-radius:18px;border:2px solid var(--paper-dark)}
}
@media(max-width:600px){
  .hud{flex-wrap:wrap;gap:6px 10px;padding:8px 12px}.hud .place{font-size:1rem;flex:1}
  .hud .counters{order:4;width:100%;justify-content:center;gap:20px}
  .hud .icon{width:25px;height:25px}.hud .counters .icon{width:24px;height:24px}
  .hud .counter-button{min-height:32px}.counters>span,.counter-button{font-size:.875rem}
  .sheet{gap:16px;padding:20px}.sprite{width:80px;height:80px}.bucket-sprite{width:65px;height:65px}
  .choices{gap:8px}.choice{padding:6px}
  .field-feedback{width:72%;top:calc(50% + 24px)}
  #target,.notice{font-size:.8rem;padding:6px 8px}
  .goal-ready{bottom:183px;padding:10px 12px}
}
@media(max-width:360px){
  .move-pad{width:96px;height:96px}.look-pad{width:72px;height:72px}
  .right-pad-row{gap:8px}.action-button{width:72px;height:72px;padding:11px;min-height:72px}
  .action-button .icon{width:44px;height:44px}.controls{padding-inline:10px}
}
@media(max-height:520px){
  .hud .counters{order:0;width:auto;gap:8px}.hud{flex-wrap:nowrap;min-height:54px;padding:5px 10px}
  .hud .place{font-size:.9rem}.hud .icon-button{width:40px;min-height:40px}
  .move-pad,.thumb-pad.move-pad{width:92px;height:92px}.look-pad{width:72px;height:72px}
  .action-button{width:72px;height:72px;min-height:72px;padding:10px}.action-button .icon{width:44px;height:44px}
  .controls{padding:12px 18px 22px}.tool-tabs button{width:42px;height:42px;min-height:42px}
  .tool-tabs .icon{width:27px;height:27px}.right-controls{gap:6px}.goal-ready{bottom:140px}
  .screen{display:block;padding-top:12px}.sheet{margin:auto}.field-feedback{top:calc(50% + 16px)}
}
@media(prefers-reduced-motion:reduce){button{transition:none}}