:root{color-scheme:light;--ink:#294736;--leaf:#417752;--paper:#f3eddc}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 0 0,#dbe6cb,transparent 52%),radial-gradient(circle at 100% 100%,#ead8b6,transparent 45%),var(--paper);font-family:system-ui,-apple-system,sans-serif;color:var(--ink);min-height:100svh}main{width:min(100% - 24px,520px);margin:auto;padding:max(10px,env(safe-area-inset-top)) 0 max(10px,env(safe-area-inset-bottom))}header{height:48px;display:flex;align-items:center;justify-content:space-between;gap:7px}header div{text-align:center}header b{font-size:19px;letter-spacing:3px}small{display:block;font-size:9px;color:#7b8a68;letter-spacing:1px}header small{font:7px monospace;margin-top:4px;letter-spacing:1px}a{color:var(--leaf);text-decoration:none;font-size:12px}button{font:600 12px system-ui;color:var(--ink);min-height:44px;padding:0 12px;border:1px solid #aaba96;border-radius:8px;background:#fff8e8;cursor:pointer;box-shadow:0 3px 0 #81956d22;touch-action:manipulation}button:hover{background:#e3edcd;border-color:var(--leaf)}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid #e0a747;outline-offset:3px}.hud{display:flex;justify-content:space-between;margin:14px 4px 13px;gap:10px}.hud>div:last-child{text-align:right}.hud>div:nth-child(2){text-align:center}.hud b{display:block;font:700 21px ui-monospace,monospace;margin-top:4px}.board{position:relative;margin:auto;width:min(100%,calc(100svh - 239px));min-width:220px;aspect-ratio:1;border:7px solid #486044;border-radius:12px;box-shadow:0 0 0 2px #d4dac3,0 15px 40px #42553720;overflow:hidden;background:#d3dfb8}canvas{display:block;width:100%;height:100%;image-rendering:pixelated;touch-action:none}#overlay{position:absolute;inset:0;padding:7%;background:#f6f1dfef;display:flex;flex-direction:column;justify-content:center}#eyebrow{color:#75845c;font:9px monospace;letter-spacing:1px}h1{font-size:clamp(24px,4.6vh,40px);line-height:1.25;letter-spacing:-1px;margin:12px 0}h1 em{color:#65844c;font-style:normal}#copy{font-size:12px;line-height:1.8;color:#667555;margin:0 0 13px}#guide{font-size:10px;line-height:1.8;color:#768264;margin-bottom:15px}#primary{background:var(--leaf);color:#fffbea;border:0;font-size:14px;min-height:44px;text-align:left;box-shadow:0 4px 0 #284831}#primary:hover{background:#315e3f}#restart{margin-top:9px}.back{text-align:center;font-size:10px;color:#879271;margin-top:13px}#notice{position:absolute;left:0;right:0;top:43%;text-align:center;color:#fff9dc;background:#365439d9;pointer-events:none;font-weight:700;font-size:12px;line-height:2.5}#notice:empty{display:none}.tools{display:flex;align-items:center;justify-content:space-between;margin:9px 0;font-size:11px;color:#6c7b59}.tools button{min-height:38px}.directions{display:flex;justify-content:center;gap:10px}.directions button{font-size:24px;min-width:52px;min-height:46px;flex:1;max-width:96px;line-height:1}.hint{text-align:center;color:#82906e;font-size:10px;margin:10px 0 0}[hidden]{display:none!important}@media(max-height:640px){main{padding-top:6px}.hud{margin:9px 3px}.board{width:min(100%,calc(100svh - 224px))}#overlay{padding:6%}h1{font-size:24px;margin:9px 0}#copy{font-size:10px;margin-bottom:8px}#guide{font-size:9px;margin-bottom:11px}.back{margin-top:10px}#eyebrow{font-size:7px}.tools{margin:7px 0}.hint{margin-top:7px}}@media(orientation:landscape) and (max-height:520px){main{width:min(100% - 24px,820px);display:grid;grid-template-columns:190px 1fr;gap:4px 22px;align-items:start}header{grid-column:1;flex-wrap:wrap;height:auto}header div{order:-1;width:100%;margin:4px 0}.hud{grid-column:1;flex-wrap:wrap;gap:14px}.hud>div:first-child{width:100%}.hud>div:nth-child(2){text-align:left}.board{grid-column:2;grid-row:1/6;width:calc(100svh - 24px);min-width:200px;max-width:100%}.tools{grid-column:1}.directions{grid-column:1;gap:5px}.directions button{min-width:40px;min-height:44px;padding:0}.hint{grid-column:1;text-align:left;line-height:1.6}.tools button{min-height:36px}#overlay{padding:7%}h1{font-size:27px}}