:root{
  --ui-bg:rgba(13,17,20,.84);
  --ui-border:rgba(214,178,92,.72);
  --ui-text:#f5ead2;
}
*{box-sizing:border-box}
html,body{width:100%;height:100%;overflow:hidden;background:#101519}
body{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
.iso-game{position:fixed;inset:0;overflow:hidden;background:linear-gradient(#8ba3a4 0 40%,#44554e 40% 100%);touch-action:none}
#ericIsoCanvas{display:block;width:100%;height:100%;touch-action:none}
.iso-hud,.iso-tools,.iso-legend,.iso-mobile-controls{position:absolute;z-index:50}
.iso-hud{left:max(12px,env(safe-area-inset-left));top:max(12px,env(safe-area-inset-top));max-width:min(520px,72vw);padding:10px 14px;background:var(--ui-bg);border:1px solid var(--ui-border);border-radius:14px;color:var(--ui-text);box-shadow:0 10px 30px rgba(0,0,0,.24);pointer-events:none}
.iso-title{font-family:Georgia,serif;font-size:clamp(18px,2.2vw,30px);font-weight:700;letter-spacing:.02em}
#isoStatus{font-size:12px;opacity:.9;margin-top:3px}
.iso-tools{right:max(12px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top));display:flex;gap:8px}
.iso-tools button,.iso-mobile-controls button{border:1px solid var(--ui-border);background:var(--ui-bg);color:var(--ui-text);border-radius:12px;font-weight:800;box-shadow:0 8px 24px rgba(0,0,0,.25);-webkit-tap-highlight-color:transparent;user-select:none;touch-action:none}
.iso-tools button{padding:10px 14px}
.iso-tools button:active,.iso-mobile-controls button.is-held{transform:translateY(1px);background:rgba(108,88,45,.94)}
.iso-mobile-controls{left:0;right:0;bottom:max(14px,env(safe-area-inset-bottom));display:flex;justify-content:space-between;align-items:flex-end;padding:0 max(14px,env(safe-area-inset-right)) 0 max(14px,env(safe-area-inset-left));pointer-events:none}
.iso-dpad,.iso-actions{pointer-events:auto}
.iso-dpad{display:grid;grid-template-columns:64px 64px 64px;grid-template-rows:58px 58px;gap:6px}
.iso-dpad button{font-size:28px;min-width:64px;min-height:58px}
.iso-dpad [data-hold="up"]{grid-column:2;grid-row:1}
.iso-dpad [data-hold="left"]{grid-column:1;grid-row:2}
.iso-dpad [data-hold="down"]{grid-column:2;grid-row:2}
.iso-dpad [data-hold="right"]{grid-column:3;grid-row:2}
.iso-actions{display:grid;grid-template-columns:76px 76px;gap:7px;align-items:end}
.iso-actions button{min-height:58px;padding:8px;font-size:12px}
.iso-actions [data-hold="run"]{grid-row:1 / span 2;min-height:123px}
.iso-legend{left:50%;transform:translateX(-50%);bottom:max(10px,env(safe-area-inset-bottom));display:flex;gap:10px;background:rgba(10,12,14,.68);border:1px solid rgba(255,255,255,.16);border-radius:999px;padding:7px 12px;color:#fff;font-size:11px;pointer-events:none}
@media (pointer:coarse),(max-width:820px){.iso-legend{display:none}.iso-tools{top:max(72px,env(safe-area-inset-top))}.iso-tools button{padding:8px 10px;font-size:11px}.iso-hud{max-width:68vw}.iso-title{font-size:18px}.iso-mobile-controls{display:flex}}
@media (pointer:fine) and (min-width:821px){.iso-mobile-controls{opacity:.42}}
@media (max-width:520px){.iso-dpad{grid-template-columns:56px 56px 56px;grid-template-rows:52px 52px}.iso-dpad button{min-width:56px;min-height:52px}.iso-actions{grid-template-columns:68px 68px}.iso-actions button{min-height:52px}.iso-actions [data-hold="run"]{min-height:111px}}