*{box-sizing:border-box}body{margin:0;background:#fff;color:#382c29;font:14px system-ui}#stage{width:100%;aspect-ratio:1;position:relative;background:linear-gradient(180deg,#fff 42%,#faf8f8 56%,#d77f7c 80%,#b72e2a 100%)}canvas{display:block;width:100%;height:100%;touch-action:none}#fallback{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}#status{position:absolute;bottom:9px;left:12px;right:12px;font-size:11px;color:#fff;text-shadow:0 1px 3px #633;margin:0}nav{display:flex;gap:6px;padding:12px 8px 4px;flex-wrap:wrap}button{flex:1;min-width:95px;cursor:pointer;border:1px solid #d5c9c3;background:#fff;padding:11px 8px;border-radius:6px;color:#49332f;font:inherit}button:hover,button:focus-visible{border-color:#ad3029;background:#fff7f5}footer{font-size:11px;color:#756763;text-align:center;padding:8px 12px 12px;line-height:1.5}body{max-width:1000px;margin:auto}#stage canvas{position:absolute;inset:0}.zoom{display:flex;align-items:center;gap:12px;padding:10px 14px;font-size:12px}.zoom input{flex:1;accent-color:#8c2d20}button[aria-pressed=true]{background:#8c2d20;color:white;border-color:#8c2d20}button:focus-visible,input:focus-visible{outline:2px solid #8c2d20;outline-offset:3px}[hidden]{display:none!important}