:root{font-family:"Trebuchet MS",system-ui,sans-serif;color:#233825;background:#faf5e8;color-scheme:light}*{box-sizing:border-box}body{margin:0}main{max-width:620px;margin:auto;padding:16px 16px 48px}header,.row{display:flex;align-items:center;justify-content:space-between;gap:10px}h1,h2{font-family:Georgia,serif;margin:12px 0 16px}h1{font-size:clamp(24px,6vw,36px)}h2{font-size:24px}button{font:inherit;border:0;background:#244f3b;color:#fff9e8;padding:10px 13px;border-radius:14px;cursor:pointer}button:disabled{opacity:.55}.map{position:relative;isolation:isolate;overflow:hidden;height:267px;border-radius:22px;background:radial-gradient(ellipse at 4% 0%,#52845b 0 18%,transparent 19%),radial-gradient(ellipse at 94% 2%,#7b9a5d 0 24%,transparent 25%),radial-gradient(ellipse at 3% 99%,#749259 0 18%,transparent 19%),#cfdfac;border:2px solid #acc394}.river{position:absolute;transform:rotate(23deg);width:75px;height:160%;top:-25%;left:43%;background:#9ac8c5;border:5px solid #badcc8;border-radius:48%}.trail{position:absolute;top:31%;left:16%;width:67%;height:48%;border:4px dashed #91754e;transform:rotate(-12deg);border-radius:50%}.place{position:absolute;background:#fff4cd;color:#304530;border:2px solid #a38f63;font-weight:bold;font-size:13px;box-shadow:0 3px 0 #728557;padding:7px 10px}.place span{font-size:24px;display:block}.meadow{left:5%;top:36%}.oak{top:8%;right:13%}.lodge{bottom:9%;right:7%}.bee{position:absolute;left:18%;top:10%;animation:drift 5s ease-in-out infinite alternate}@keyframes drift{to{transform:translate(28px,12px) rotate(10deg)}}@media(prefers-reduced-motion:reduce){.bee{animation:none}}#notice{font-size:14px;color:#495c49;min-height:1em}.row{padding:12px 0;border-bottom:1px solid #d7d5be}.row strong,.row small{display:block}.row small{margin-top:4px;color:#586349}.row button{flex-shrink:0}dialog{max-width:90%;color:#243725;background:#fff8e6;border:1px solid #adbc92;border-radius:18px;padding:22px}dialog::backdrop{background:#17382688}
.map{height:auto;aspect-ratio:1.15;background:#9fbc7e url('/forest.webp') center/cover;border:1px solid #879d65;border-radius:18px}
.place{background:#fff4dbea;border-color:#74582e;color:#362b1c;padding:6px 8px;font-size:12px;box-shadow:0 2px 4px #3b331e45}.place span{display:none}.meadow{left:3%;top:69%}.oak{right:13%;top:17%}.lodge{right:3%;bottom:8%}
.traveler{position:absolute;z-index:1;left:14%;top:36%;width:25%;height:32%;object-fit:contain;pointer-events:none;filter:drop-shadow(0 3px 2px #41332166);transition:left 1.4s ease-in-out,top 1.4s ease-in-out;animation:steps .7s ease-in-out infinite alternate}.map[data-stop="shop"] .traveler{left:70%;top:49%}.map[data-stop="wallet"] .traveler{left:49%;top:25%}@keyframes steps{from{transform:rotate(-3deg)}to{transform:translateY(-3px) rotate(3deg)}}@media(prefers-reduced-motion:reduce){.traveler{transition:none;animation:none}}