:root { --amber:#ffad16; --cyan:#5ad6d8; --dim:#6a6860; --bg:#050505; }
* { box-sizing:border-box; margin:0; padding:0; -webkit-tap-highlight-color:transparent; }
html,body { height:100%; background:var(--bg); color:var(--amber); font-family:"Courier New",monospace; overflow:hidden; user-select:none; }
.game-wrap { display:flex; flex-direction:column; align-items:center; height:100%; padding:0 8px; }
.game-header { display:flex; justify-content:space-between; align-items:center; width:100%; max-width:500px; padding:10px 0 6px; font-size:11px; color:var(--dim); letter-spacing:.04em; flex-shrink:0; }
.term-exit { color:var(--dim); text-decoration:none; font-size:11px; letter-spacing:.1em; transition:color .15s; }
.term-exit:hover { color:var(--amber); }
#canvas { display:block; image-rendering:pixelated; }
.mobile-controls { display:flex; align-items:center; justify-content:space-between; width:100%; max-width:300px; padding:8px 0 4px; flex-shrink:0; }
.dpad { display:flex; gap:6px; align-items:center; }
.ctrl-btn { width:56px; height:46px; border:1px solid rgba(255,173,22,.4); background:rgba(255,173,22,.05); color:var(--amber); font:16px/1 "Courier New"; cursor:pointer; touch-action:manipulation; border-radius:0; display:flex; align-items:center; justify-content:center; }
.ctrl-btn:active { background:rgba(255,173,22,.18); }
.ctrl-btn.fire { width:90px; height:58px; color:var(--cyan); border-color:rgba(90,214,216,.4); font-size:13px; font-weight:bold; letter-spacing:.08em; }
#name-input { position:fixed; top:-200px; left:0; width:1px; height:1px; opacity:0; pointer-events:none; background:transparent; border:none; outline:none; }