*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{width:100%;height:100%;margin:0;overflow:hidden;overscroll-behavior:none;background:#172329;color:#eee9db;font:14px system-ui,sans-serif;touch-action:none;user-select:none;-webkit-user-select:none}#game{display:block;width:100%;height:100%;outline:0;touch-action:none}#ui{position:fixed;inset:0;pointer-events:none;padding:max(18px,env(safe-area-inset-top)) max(22px,env(safe-area-inset-right)) max(18px,env(safe-area-inset-bottom)) max(22px,env(safe-area-inset-left))}header{display:flex;gap:24px;align-items:flex-start}.brand{font:26px Georgia,serif;letter-spacing:5px;text-shadow:0 2px 8px #000}.brand small{display:block;font:8px system-ui;letter-spacing:1.5px;margin-top:7px;color:#d2c6ac}.stats{width:180px;filter:drop-shadow(0 1px 4px #000)}.bar{display:flex;justify-content:space-between;padding:4px 8px;margin-bottom:4px;font-size:10px;border:1px solid #b6a07766;border-radius:3px}.hp{background:#793d3b}.mp{background:#345e7e}.bar b{font-weight:500}.exp{font-size:9px;letter-spacing:2px;color:#ded0a4;display:flex;justify-content:space-between;border-bottom:2px solid #a18b53;padding-bottom:4px}aside{position:absolute;right:max(22px,env(safe-area-inset-right));top:max(18px,env(safe-area-inset-top));display:flex;align-items:flex-end;flex-direction:column;gap:8px;font-size:10px}#fps{background:#172329c9;border:1px solid #d8c39b44;padding:6px 10px;border-radius:4px;font-variant-numeric:tabular-nums}label{color:#e6decb;text-shadow:0 1px 4px #000}select,button{pointer-events:auto;touch-action:none;color:#eee9db;background:#172329db;border:1px solid #b4a17c88;border-radius:6px;font:inherit}select{font-size:11px;padding:5px;margin-left:4px}.location{position:absolute;left:50%;top:22px;transform:translate(-50%);text-align:center;text-shadow:0 2px 6px #000}.location>span{font:16px Georgia;letter-spacing:5px}.location small{display:block;font-size:9px;margin-top:5px;color:#ded3bb}#status{position:absolute;left:50%;top:44%;transform:translate(-50%,-50%);max-width:85%;padding:18px;background:#142329e8;border:1px solid #b4a17c88;border-radius:8px;text-align:center;pointer-events:auto}#status:empty{display:none}#joystick{position:absolute;left:max(32px,env(safe-area-inset-left));bottom:max(32px,env(safe-area-inset-bottom));width:120px;height:120px;border-radius:50%;border:1px solid #e0d3b74d;background:#17232955;pointer-events:auto;touch-action:none}#knob{position:absolute;left:39px;top:39px;width:42px;height:42px;border-radius:50%;background:#d9ceaf55;border:1px solid #f2e5c999;box-shadow:0 2px 12px #0003}.actions{position:absolute;right:max(32px,env(safe-area-inset-right));bottom:max(32px,env(safe-area-inset-bottom));display:flex;align-items:flex-end;gap:12px}button{min-width:48px;min-height:48px;padding:10px 16px;font-size:12px;cursor:pointer}button[aria-pressed=true]{background:#77613c}.zoom{display:flex;gap:6px}.zoom button{font-size:20px;padding:5px}footer{position:absolute;bottom:max(12px,env(safe-area-inset-bottom));left:50%;transform:translate(-50%);font-size:9px;white-space:nowrap;color:#efead8b0;text-shadow:0 1px 3px #000}.portrait{display:none}@media(orientation:portrait){.portrait{display:block;position:absolute;top:30%;left:10%;right:10%;padding:15px;background:#172329e0;border:1px solid #b4a17c88;text-align:center}.location{top:120px}.stats{width:130px}.brand{font-size:20px}.brand small{max-width:130px;font-size:7px}header{gap:12px}aside{top:88px}footer{display:none}.actions{gap:6px;right:18px;bottom:48px;flex-direction:column}#joystick{left:18px;bottom:48px}}@media(max-height:440px){header{gap:15px}.brand{font-size:23px}.stats{width:150px}.location{top:18px}#joystick{width:108px;height:108px;bottom:max(24px,env(safe-area-inset-bottom))}#knob{left:33px;top:33px}.actions{bottom:max(24px,env(safe-area-inset-bottom))}footer{font-size:8px}}@media(orientation:landscape)and (max-width:1000px){header{gap:12px}.brand{font-size:22px}.brand small{max-width:180px;font-size:7px}.stats{width:140px}.location{top:90px}.location>span{font-size:13px}.location small{font-size:8px}}html,body,#ui{height:100dvh}aside{display:grid;grid-template-columns:auto auto;align-items:center}aside label{grid-column:1/-1}#fullscreen{min-width:40px;min-height:36px;font-size:22px;padding:2px 8px}dialog{pointer-events:auto;max-width:min(480px,85vw);max-height:80dvh;overflow:auto;color:#eee9db;background:#172329;border:1px solid #b4a17c;border-radius:12px;padding:20px;touch-action:pan-y}dialog::backdrop{background:#0008}#diagnostics-toggle{position:absolute;right:max(22px,env(safe-area-inset-right));top:130px;font-size:10px;min-height:30px}#diagnostics{position:absolute;right:22px;top:165px;background:#172329e0;padding:10px;font-size:10px;max-width:80vw;white-space:pre-wrap;max-height:35vh;overflow:auto;pointer-events:auto;touch-action:pan-y}#diagnostics input{pointer-events:auto}#diagnostics label{display:block;padding:5px}#terrain-stats{white-space:pre-wrap;margin:4px 0}#diagnostics a{pointer-events:auto;color:#e5d3a3}#diagnostics button{min-height:32px}#game{position:fixed;left:0;top:0;width:var(--game-width,100vw);height:var(--game-height,100dvh)}#ui{width:var(--game-width,100vw);height:var(--game-height,100dvh)}@media(hover:hover)and (pointer:fine){#joystick{display:none!important}}
