:root{font-family:system-ui,sans-serif;background:#0b101a;color:#e9effb;line-height:1.5}*{box-sizing:border-box}body{margin:0}main{max-width:1100px;margin:auto;padding:24px}header{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #293448;padding-bottom:16px}header a{color:inherit;text-decoration:none;font-weight:800;font-size:24px;letter-spacing:.04em}header span{color:#a7b6d0}h1{font-size:clamp(26px,5vw,40px);line-height:1.15;margin-bottom:16px}#setup{max-width:680px;padding:20px 0}p{max-width:800px}label{display:inline-flex;align-items:center;gap:10px;margin:8px 12px 8px 0}button,.file,select{font:inherit;border:1px solid #566d91;border-radius:8px;padding:10px 16px;background:#202e46;color:#fff;cursor:pointer}button:disabled{opacity:.45;cursor:default}button:focus-visible,.file:focus-within,select:focus-visible{outline:3px solid #a4cbff;outline-offset:3px}.file{position:relative;overflow:hidden;background:#345bb4}.file input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%}.secondary{background:#202e46}.hint{font-size:14px;color:#a7b6d0}#status{min-height:24px;color:#c1d8ff}canvas{display:block;width:100%;aspect-ratio:16/9;background:#000;outline:none;touch-action:none;image-rendering:pixelated}canvas:fullscreen{width:100vw;height:100vh;object-fit:contain;background:#000}.toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}pre{white-space:pre-wrap;font-size:12px;max-height:240px;overflow:auto}details{margin-top:24px;color:#a7b6d0}[hidden]{display:none!important}@media(max-width:600px){main{padding:14px}.toolbar button{padding:8px 10px;font-size:14px}#setup{padding:10px 0}}