:root{color-scheme:light;--ink:#243e35;--paper:#fff9e9;--muted:#526052;--line:#d7d6bd}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#9cae88;color:var(--ink);font:14px system-ui,sans-serif}button,.button{font:inherit;border:1px solid var(--line);background:var(--paper);color:var(--ink);border-radius:9px;padding:8px 12px;cursor:pointer;touch-action:manipulation}button:hover,.button:hover{background:#f2e8ce}button.active{background:#294d3d;color:#fff5da;border-color:#294d3d}button:focus-visible,canvas:focus-visible{outline:3px solid #a45727;outline-offset:3px}#world{width:100vw;height:100dvh;display:block;touch-action:none}.brand{position:absolute;top:25px;left:28px;display:flex;gap:12px;align-items:center;pointer-events:none}h1{font:600 30px Georgia,serif;margin:0;letter-spacing:-1px}.subtitle{font-size:12px;letter-spacing:1.6px}.sprig{font-size:48px;color:#2f5740}#resources{position:absolute;top:26px;left:50%;transform:translateX(-50%);display:flex;gap:22px;background:var(--paper);padding:13px 22px;border:1px solid var(--line);border-radius:14px;box-shadow:0 5px 15px #344d3615}#resources span{white-space:nowrap}#resources b{font-size:18px;margin:0 4px}#resources small{font-size:11px;color:var(--muted)}.clock{position:absolute;top:26px;right:25px;text-align:right}#date{font-weight:600;display:block;margin-bottom:9px}#speed{display:flex;gap:4px}#speed button{padding:6px 10px;font-size:12px}#notice{position:absolute;top:109px;left:50%;transform:translateX(-50%);border-radius:20px;background:#fff9e9ed;padding:9px 18px;max-width:85vw;text-align:center;font-size:12px;transition:opacity .5s;pointer-events:none}#inspect{position:absolute;right:24px;top:145px;width:255px;max-height:45vh;overflow:auto;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:19px;box-shadow:0 10px 30px #213b3620}#inspect h2{font:600 23px Georgia;margin:0 0 8px}#inspect p{line-height:1.5;margin:6px 0;color:#485548}#inspect .close{float:right;border:0;padding:0 4px;background:none}#inspect .tag{display:inline-block;font-size:11px;padding:4px 7px;background:#e1e8cd;border-radius:5px}.bottom{position:absolute;bottom:14px;left:50%;transform:translateX(-50%);max-width:calc(100vw - 24px);text-align:center}#hint{font-size:12px;color:#243e35;margin:0 auto 10px;background:#fff9e9ed;display:table;padding:6px 14px;border-radius:10px}#build{display:flex;gap:5px;padding:8px;background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:0 8px 25px #20372b30;max-width:100%;overflow:auto}#build button{min-width:75px;border-color:transparent;border-radius:11px;padding:7px 9px}#build .icon{display:block;font-size:26px;line-height:31px}#build .name{display:block;font-size:12px;font-weight:600}#build .cost{display:block;font-size:10px;margin-top:4px;opacity:.85}.savebar{display:flex;align-items:center;justify-content:center;gap:5px;margin-top:8px}.savebar button,.savebar .button{font-size:11px;padding:5px 9px;background:#fff9e9}.savebar span{font-size:10px;background:#fff9e9;padding:5px 8px;border-radius:7px}.maptools{position:absolute;left:22px;bottom:210px;display:flex;flex-direction:column;gap:5px}.maptools button{width:36px;font-size:20px;padding:4px}dialog{color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:18px;max-width:410px;padding:28px;line-height:1.6}dialog::backdrop{background:#17372966}dialog h2{font:25px Georgia;margin:0}dialog button{background:#294d3d;color:#fff9e9}@media(max-width:760px){.brand{top:16px;left:15px;gap:6px}.sprig{font-size:32px}h1{font-size:23px}.subtitle{font-size:9px;letter-spacing:.9px}#resources{top:76px;gap:15px;padding:9px 16px;width:max-content}#resources b{font-size:15px}#resources small{font-size:10px}.clock{top:17px;right:12px}#date{font-size:10px;margin-bottom:5px}#speed button{padding:5px 7px;font-size:10px}#notice{top:126px;font-size:11px;width:max-content;max-width:90vw;padding:7px 12px}#inspect{right:12px;top:168px;width:220px;padding:14px;max-height:34vh}.bottom{bottom:calc(10px + env(safe-area-inset-bottom));width:calc(100% - 18px);max-width:none}#build{gap:1px;padding:5px;border-radius:12px}#build button{min-width:59px;padding:5px 5px;flex:1}#build .icon{font-size:22px;line-height:27px}#build .name{font-size:10px}#build .cost{font-size:9px}.savebar{gap:3px}.savebar span{font-size:9px}.maptools{left:10px;bottom:205px}#hint{font-size:10px;max-width:94%;margin-bottom:6px}.savebar button,.savebar .button{padding:5px 7px}}
@media(max-width:760px){.bottom{bottom:calc(34px + env(safe-area-inset-bottom))}}