*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,sans-serif;color:#eaf8e9;background:#b8d8d0;overflow:hidden}canvas{display:block}.hud{position:fixed;z-index:10;top:16px;left:16px;right:16px;display:flex;gap:20px;align-items:center;justify-content:space-between;pointer-events:none}.hud>div{background:#123f34e8;border:1px solid #c6e8c944;border-radius:12px;padding:12px 18px;box-shadow:0 8px 22px #13382b22}.hud strong{letter-spacing:2px}.hud small{display:block;color:#b9d9bf;margin-top:3px}.hud .mode{font-weight:700;color:#c6ffac}.hud .help{font-size:12px}.bottom{position:fixed;bottom:18px;left:50%;transform:translate(-50%);background:#123f34e8;border-radius:16px;padding:13px 24px;white-space:nowrap;font-weight:600}.bottom span{margin:0 10px;color:#a3dba2}@media(max-width:700px){.hud{flex-wrap:wrap;justify-content:flex-start}.hud .help{width:100%}.bottom{font-size:12px}}.actions{position:fixed;z-index:12;right:18px;bottom:18px;display:flex;gap:8px}.actions button{background:#173f34;color:#f3ffe8;border:1px solid #9ec9a5;border-radius:10px;padding:10px 15px;cursor:pointer;font-weight:600}.actions button:hover{background:#286c56}.save-status{position:fixed;z-index:12;right:18px;bottom:68px;color:#123f34;font-weight:700;text-shadow:0 1px 2px #fff}@media(max-width:700px){.actions{bottom:75px}.save-status{bottom:122px}.hud .help{font-size:10px}}.resources{position:fixed;top:105px;left:16px;z-index:10;background:#123f34e8;color:#efffe6;border:1px solid #c6e8c944;border-radius:12px;padding:10px 14px;font-size:13px;font-weight:700;pointer-events:none}@media(max-width:700px){.resources{top:150px;max-width:90%;font-size:11px}.actions{flex-wrap:wrap;justify-content:flex-end;left:10px}.actions button{font-size:12px;padding:8px 10px}}