*{box-sizing:border-box}body{margin:0;background:#f4f6f0;color:#203b36;font:16px/1.7 system-ui,sans-serif}main{max-width:460px;margin:8vh auto;padding:24px}.eyebrow{letter-spacing:.18em;font-size:12px;color:#64746e}h1{font-size:28px;line-height:1.35}p,small{color:#64746e}#grid{position:relative;width:300px;height:300px;margin:auto;touch-action:none}#grid svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}polyline{fill:none;stroke:#89b7a5;stroke-width:7;stroke-linecap:round;stroke-linejoin:round}#grid button{position:absolute;width:58px;height:58px;border:2px solid #b9cfc3;background:#fff;border-radius:50%;font-size:18px;color:#206756;transform:translate(-50%,-50%);touch-action:none}#grid button.selected{background:#206756;color:white;border-color:#206756}.actions{display:flex;gap:12px;margin:16px 0}.actions button{flex:1;padding:12px;background:white;border:1px solid #206756;border-radius:10px;color:#206756;font-size:16px}#submit{background:#206756;color:white}button:disabled{opacity:.5}small{display:block;font-size:13px}@media(max-width:350px){main{padding:16px}#grid{width:270px;height:270px}}