:root{color-scheme:dark;font-family:system-ui,sans-serif;background:#14151a;color:#eee}body{margin:0}main{max-width:1320px;margin:24px auto;padding:0 18px}header{display:flex;align-items:baseline;gap:16px}h1{font-size:22px;letter-spacing:.13em;margin:0 0 14px}header span{color:#a8a9b3;font-size:13px}.toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:14px}button,select{font:inherit;font-size:13px;border:1px solid #454854;border-radius:5px;background:#252730;color:#eee;padding:7px 11px;cursor:pointer}button:disabled{opacity:.4;cursor:wait}label{font-size:13px;color:#bbb}#screen{overflow:auto;max-width:100%;display:flex;justify-content:center;background:#0a0a0e;padding:12px;border-radius:7px}canvas{width:640px;height:480px;image-rendering:pixelated;flex-shrink:0;outline:none}#status{min-height:20px;font-size:13px;color:#b7b9c5}.controls,details{font-size:13px;line-height:1.6;color:#9a9ca8}body.zoom2 canvas{width:1280px;height:960px}canvas:fullscreen{width:auto;height:100vh;max-width:100vw;background:#000;object-fit:contain}@media(max-width:700px){main{padding:0 8px;margin:12px auto}header{display:block}header span{display:block;margin-bottom:12px}#screen{justify-content:flex-start;padding:0}}

#loading-panel{margin:0 0 14px;padding:14px 16px;border:1px solid #454854;border-radius:7px;background:#202229}#loading-panel[hidden]{display:none}.loading-caption{display:flex;align-items:baseline;justify-content:space-between;gap:14px;margin-bottom:8px;font-size:13px;color:#d6d8e1}#loading-percent{font-variant-numeric:tabular-nums;color:#77e0ff;white-space:nowrap}#loading-progress{display:block;width:100%;height:14px;accent-color:#77e0ff}#loading-panel[data-state=failed]{border-color:#c57777}#loading-panel[data-state=failed] #loading-label{color:#ffc4c4}
