:root{color-scheme:light;font-family:Arial,Helvetica,sans-serif;color:#222;background:#e5e4df}
*{box-sizing:border-box}body{margin:0;min-height:100svh;display:grid;place-items:center;padding:28px 16px}main{width:min(100%,720px)}header{display:flex;align-items:baseline;justify-content:space-between;margin:0 0 14px;gap:10px}h1{font-size:26px;font-weight:500;letter-spacing:-.7px;margin:0}header span{font:12px monospace;color:#5b5b57;white-space:nowrap}
#game{position:relative;width:100%;aspect-ratio:4/3;background:#929292;border:1px solid #333;box-shadow:3px 3px 0 #bcbcb6}canvas{display:block;width:100%;height:100%;image-rendering:pixelated}button{font:13px Arial,sans-serif;border:1px solid #444;background:#e5e5e5;color:#111;box-shadow:inset 1px 1px white,inset -1px -1px #aaa;border-radius:0;padding:8px 11px;cursor:pointer;min-height:36px}button:hover{background:#f3f3ee}button:active{box-shadow:inset 1px 1px #999}button:disabled{color:#888;cursor:default}button:focus-visible{outline:3px solid #064ac2;outline-offset:3px}
.hotspot,.slot{position:absolute;background:transparent;border:0;box-shadow:none;padding:0;min-height:0}.hotspot:hover,.slot:hover{background:transparent;box-shadow:inset 0 0 0 1px #fff}.hotspot:disabled{opacity:.45;background:#222}.slot{top:36.458333%;width:8.75%;height:10.416667%;touch-action:manipulation}.slot.hint{outline:3px dashed #152c9a;outline-offset:2px}.slot:focus-visible{outline:2px dashed #1717a3;outline-offset:1px}
#restart-icon{left:59.375%;top:95%;width:2.8125%;height:5%}#quit{left:67.34375%;top:95%;width:8.90625%;height:5%}#undo{left:76.25%;top:95%;width:7.03125%;height:5%}#redo{left:83.28125%;top:95%;width:7.03125%;height:5%}
#loading{position:absolute;inset:35% 8% auto;text-align:center;background:#fff;padding:20px;font:14px monospace}.toolbar{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}#status{font-size:13px;line-height:1.5;min-height:2.9em;margin:12px 0 8px;color:#444}footer{font:11px/1.6 monospace;color:#666;border-top:1px solid #c6c5bf;padding-top:10px}
dialog{width:min(480px,calc(100vw - 32px));max-height:calc(100svh - 32px);overflow:auto;background:#e5e5e5;color:#111;border:2px solid #222;box-shadow:4px 4px 0 #0006;padding:24px}dialog::backdrop{background:#0006}dialog h2{font-size:18px;margin:0 0 16px}dialog p{font-size:14px;line-height:1.55}.dialog-actions{display:flex;gap:12px;justify-content:space-between;margin-top:20px}
main:fullscreen{width:100%;height:100%;background:#e5e4df;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:12px}main:fullscreen header,main:fullscreen .toolbar,main:fullscreen #status{width:min(100%,calc((100svh - 190px)*4/3))}main:fullscreen #game{width:min(100%,calc((100svh - 190px)*4/3));flex-shrink:0}main:fullscreen footer{display:none}
@media(max-width:480px){body{padding:18px 8px}h1{font-size:23px}header span{font-size:10px}.toolbar{gap:6px;display:grid;grid-template-columns:1fr 1fr}.toolbar button{min-height:42px}#status{font-size:12px}footer{font-size:10px}header{margin-bottom:10px}}
