:root{color:#eef2ff;background:#111827;font-family:system-ui,sans-serif}body{margin:0}main{gap:.8rem;max-width:36rem;margin:2rem auto;padding:0 1rem;display:grid}button{width:max-content;padding:.55rem .8rem}.checkpoints{flex-wrap:wrap;gap:.65rem;display:flex}output{border:1px solid #596987;border-radius:.3rem;padding:.25rem .45rem}output[data-state=complete]{color:#a9f5c8;border-color:#57d38c}canvas{background:#dbeafe;border:1px solid #596987;width:480px;max-width:100%}pre{white-space:pre-wrap;min-height:4rem}