* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { height: 100%; background: #111; color: #ddd; font-family: monospace; }
#app { display: flex; height: 100%; }
#screen-wrap { position: relative; flex: 1; background: #000; overflow: hidden; }
#screen { image-rendering: pixelated; image-rendering: crisp-edges; width: 100%; height: 100%; display: block; background: #000; object-fit: contain; }
#overlay { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; image-rendering: pixelated; image-rendering: crisp-edges; object-fit: contain; }
#sidebar { width: 280px; padding: 12px; background: #1a1a1a; border-left: 1px solid #333; overflow-y: auto; }
#sidebar h1 { font-size: 16px; color: #0f0; margin-bottom: 8px; }
#sidebar h3 { font-size: 13px; color: #6cf; margin: 8px 0 4px; }
#sidebar hr { border: none; border-top: 1px solid #333; margin: 10px 0; }
#sidebar div { font-size: 11px; line-height: 1.5; color: #aaa; }
#status { color: #ff0; font-size: 12px; }
#player-panel label { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin: 4px 0; font-size: 11px; color: #aaa; }
#player-panel input { width: 80px; background: #2a2a2a; color: #0f0; border: 1px solid #444; padding: 2px 4px; font-family: monospace; font-size: 11px; text-align: right; }
#player-panel input:focus { outline: none; border-color: #6cf; }
#player-panel h3 { font-size: 13px; color: #6cf; margin: 8px 0 4px; }
#entities-panel pre { font-size: 10px; color: #aaa; white-space: pre-wrap; max-height: 240px; overflow: auto; }
#controls-info div { font-size: 11px; }
#test-panel button { background: #2a2a2a; color: #0f0; border: 1px solid #444; padding: 4px 8px; cursor: pointer; font-family: monospace; font-size: 11px; }
#test-panel button:hover { background: #3a3a3a; }
#test-results { font-size: 10px; color: #aaa; white-space: pre-wrap; margin-top: 6px; max-height: 240px; overflow: auto; }
.pass { color: #0f0; }
.fail { color: #f44; }
#load-panel input[type="file"] { width: 100%; font-size: 10px; color: #aaa; margin: 2px 0; }
#load-panel h3 { margin-top: 10px; }
#load-panel button { background: #2a2a2a; color: #0f0; border: 1px solid #444; padding: 4px 8px; cursor: pointer; font-family: monospace; font-size: 11px; margin-top: 4px; }
#load-panel button:hover { background: #3a3a3a; }
#load-info { font-size: 10px; color: #aaa; margin-top: 4px; word-break: break-all; }
#pak-panel input[type="file"] { width: 100%; font-size: 10px; color: #aaa; margin: 2px 0; }
#pak-panel button { background: #2a2a2a; color: #0f0; border: 1px solid #444; padding: 4px 8px; cursor: pointer; font-family: monospace; font-size: 11px; margin-top: 4px; }
#pak-panel button:hover { background: #3a3a3a; }
#pak-info { font-size: 10px; color: #aaa; margin-top: 4px; word-break: break-all; }

/* ---------- Console (cl_console) ---------- */
#con-root { position: absolute; left: 0; right: 0; bottom: 0; height: 55%; background: rgba(8,8,12,0.85); display: none; flex-direction: column; border-top: 2px solid #0a0; z-index: 60; }
#con-root.open { display: flex; }
#con-log { flex: 1; overflow-y: auto; padding: 6px 10px; font-family: monospace; font-size: 12px; color: #cfc; white-space: pre-wrap; line-height: 1.35; }
#con-line { display: flex; align-items: center; padding: 4px 10px; border-top: 1px solid #333; background: #000; }
.con-arrow { color: #0f0; margin-right: 6px; }
#con-input { flex: 1; background: transparent; border: none; color: #0f0; font-family: monospace; font-size: 13px; outline: none; }

/* ---------- Menu (cl_menu) ---------- */
#menu-root { position: absolute; inset: 0; background: rgba(0,0,0,0.55); display: none; flex-direction: column; align-items: center; justify-content: center; z-index: 80; }
#menu-root.open { display: flex; }
#menu-title { font-family: monospace; font-size: 46px; color: #e33; letter-spacing: 6px; margin-bottom: 18px; text-shadow: 2px 2px 0 #000; }
#menu-body { display: flex; flex-direction: column; gap: 2px; min-width: 360px; max-height: 90vh; overflow-y: auto; }
.menu-item { display: flex; gap: 8px; font-family: monospace; font-size: 14px; color: #ccc; padding: 1px 6px; cursor: pointer; white-space: pre; }
.menu-item.sel { color: #ff4; }
.menu-mark { width: 14px; color: #ff4; }
.menu-label { letter-spacing: 1px; }