*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:#eaf2eb;color:#243c33;font-family:system-ui,'Malgun Gothic',sans-serif}main{max-width:760px;margin:auto;padding:clamp(16px,4vw,32px)}.menu,.trail{background:#fffdf7;border-radius:24px;padding:clamp(20px,4vw,32px);box-shadow:0 8px 30px #30443718}.eyebrow{font-size:14px;font-weight:800;color:#356b59}h1{font-size:clamp(27px,5vw,38px);margin:5px 0 12px}h2{font-size:21px;margin:0 0 10px}p{line-height:1.6;margin:8px 0}.lead{font-size:20px;font-weight:700}.note{color:#475e53;font-size:15px}.menu a{display:inline-flex;min-height:44px;align-items:center;color:#235b91;font-weight:700}.choices,.controls{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}button{font:inherit;cursor:pointer;color:#183e34;touch-action:manipulation}button:focus-visible,a:focus-visible,[tabindex="0"]:focus-visible{outline:4px solid #125ab3;outline-offset:3px}button:disabled{cursor:default;opacity:.65}.choices button,.controls button{min-width:44px;min-height:50px;border:1px solid #84a798;border-radius:12px;background:#fff;padding:10px 16px;font-weight:700}.choices button:first-child{background:#286650;color:white}#pause[aria-pressed="true"]{background:#d5ebd7;border:3px solid #286650}.garden{margin:18px auto 6px;max-width:330px;padding:8px;background:#edf5df;border:2px solid #bdd4b4;border-radius:24px}.garden svg{width:100%;display:block}.garden line{stroke:#5b7164;stroke-width:6;stroke-dasharray:7 7;stroke-linecap:round}.garden line[data-used="true"]{stroke:#24664f;stroke-width:8;stroke-dasharray:none}.garden circle{fill:#fffdf7;stroke:#34644c;stroke-width:3}.garden circle[data-current="true"]{fill:#f8d68b;stroke:#714e12;stroke-width:5}.garden text{text-anchor:middle;font-size:21px;font-weight:800;fill:#243c33}.position{font-weight:800;text-align:center}.points{display:grid;grid-template-columns:repeat(auto-fit,minmax(76px,1fr));gap:8px;margin:14px 0}.points button{min-width:44px;min-height:62px;padding:7px;border:1px solid #87a99a;border-radius:12px;background:white;font-weight:800;font-size:20px}.points small{display:block;font-size:12px;font-weight:700;overflow-wrap:anywhere}.points [data-current="true"]{background:#f8e6ba;border:3px solid #856014}.points [data-available="true"]{outline:2px dashed #39735a;outline-offset:-5px}.roads{background:#f1f6ec;border-radius:10px;padding:12px;font-weight:700}.status{min-height:3em;font-weight:700;background:#e7f1e7;border-left:5px solid #397a5e;padding:10px 14px;border-radius:6px;margin-top:16px}.result{background:#f3f6e9;border:1px solid #b7cdb3;border-radius:16px;padding:18px;margin-top:16px}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
dialog { max-width: min(90vw, 480px); border: 2px solid #426c60; border-radius: 16px; padding: 24px; color: #243b36; } dialog::backdrop { background: #182c27b3; }