*{box-sizing:border-box}body{margin:0;background:#e9efdf;color:#263d2e;font:16px/1.5 system-ui}main{max-width:920px;padding:26px 22px;margin:auto}header small{font-size:10px;letter-spacing:2px;color:#516d4a}h1{font:54px Georgia;letter-spacing:-1.5px;margin:9px 0}header p{color:#556a4e}.intro{padding:14px 18px;border-left:3px solid #7a9555;background:#f8fbef}.intro p{margin:6px 0}nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:18px 0}button,select{min-height:44px;border:1px solid #7e976a;border-radius:8px;padding:9px 14px;font:600 14px system-ui;background:#f8fbef;color:#314e2a;cursor:pointer}button:hover{background:#d3e0bc}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #94652d;outline-offset:3px}#board{aspect-ratio:600/400;background:#152f27;border-radius:14px;overflow:hidden}svg{display:block;width:100%;height:100%}.controls{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;background:#f8fbef;padding:18px;margin:16px 0;border-radius:10px}.controls label{font-size:13px;font-weight:600}.controls output{float:right;font-variant-numeric:tabular-nums}.controls input{display:block;width:100%;height:34px;accent-color:#45693c}.controls label:has(input:disabled){opacity:.55}#plant{background:#315b3d;color:white;min-width:180px}#feedback{font-weight:600;min-height:48px}#clue{color:#6c5328}details{border-top:1px solid #b4c49e;padding:14px 0}summary{cursor:pointer}footer{font-size:12px;color:#53694c;border-top:1px solid #b4c49e;padding-top:14px}a{color:#315b3d}@media(max-width:520px){main{padding:18px 12px}h1{font-size:37px}.intro{font-size:14px}.controls{grid-template-columns:1fr;gap:6px;padding:12px}.controls input{height:28px}nav label{width:100%}#board{aspect-ratio:600/480}}
