*,:before,:after{box-sizing:border-box;margin:0;padding:0}html,body{overscroll-behavior:none;touch-action:none;background:#1a1a2e;height:100%;overflow:hidden}#app{width:100%;height:100%}#app canvas{width:100%;height:100%;display:block}.menu-overlay{color:#e8eefc;z-index:10;background:#080812d1;flex-direction:column;justify-content:center;align-items:center;gap:18px;padding:24px;font-family:monospace;display:flex;position:fixed;inset:0}.menu-overlay.hidden{display:none}.menu-panels{gap:24px;width:min(960px,96vw);max-height:80vh;display:flex}.menu-col{background:#141426eb;border:1px solid #2f2f4e;border-radius:10px;flex:1;padding:16px;overflow:auto}.menu-col h2{color:#ffe9a8;margin-bottom:12px;font-size:18px;font-weight:400}.menu-list{flex-direction:column;gap:6px;list-style:none;display:flex}.menu-row{border:2px solid #0000;border-radius:6px;padding:10px 12px;font-size:14px}.menu-row.craftable{color:#d6ffd0}.menu-row.locked{color:#8a8aa5}.menu-row.focused{background:#ffe9a81f;border-color:#ffe9a8}.menu-grid{gap:6px;display:grid}.menu-cell{aspect-ratio:1;color:#fff;text-shadow:0 1px 2px #000;background:#0a0a16b3;border:2px solid #2f2f4e;border-radius:6px;justify-content:flex-end;align-items:flex-end;padding:3px;font-size:11px;display:flex}.menu-cell.hotbar{border-color:#4a4a6a}.menu-cell.focused{border-color:#ffe9a8;box-shadow:0 0 0 2px #ffe9a866}.menu-hint{color:#9aa6c4;font-size:13px}