html,body{height:100%;margin:0;background:#000;color:#fff;font:13px Arial,sans-serif}body{display:flex;flex-direction:column}#bar{display:flex;align-items:center;gap:8px;padding:6px;background:#c0c0c0;color:#000;min-height:30px}button{background:#c0c0c0;color:#000;border:2px outset #eee;font:13px Arial;padding:5px 9px;cursor:pointer}button:focus-visible{outline:2px solid navy}#status{font-size:12px}#dos{flex:1;min-height:0;width:100%;height:calc(100% - 44px)}canvas{image-rendering:pixelated}
#bar{flex-wrap:wrap}#dos{display:flex;align-items:center;justify-content:center;overflow:hidden}canvas{display:block;max-width:100%;max-height:100%;width:100%;height:100%;object-fit:contain;outline:none}canvas:focus-visible{outline:2px solid #ffdf69;outline-offset:-2px}