*{box-sizing:border-box}body{color:#eee;background:#111;margin:0;font-family:system-ui,sans-serif}#app{justify-content:center;align-items:flex-start;display:flex}#app canvas{margin-top:.5rem;display:block}#ui{background:#1a1a1a;border-bottom:1px solid #333;max-width:52rem;margin:0 auto;padding:.75rem 1rem}#ui h1{margin:0 0 .25rem;font-size:1.25rem;font-weight:600}.hint{color:#aaa;margin:.35rem 0 .75rem;font-size:.9rem}.hint.small{margin-top:.25rem;font-size:.8rem}.hint code{color:#8cf;font-size:.75rem}.row{flex-wrap:wrap;align-items:center;gap:.5rem;margin-bottom:.5rem;display:flex}.row span{min-width:8rem}input[type=text]{color:#eee;background:#222;border:1px solid #444;border-radius:4px;flex:1;min-width:12rem;padding:.35rem .5rem}button,select{color:#eee;cursor:pointer;background:#333;border:1px solid #555;border-radius:4px;padding:.35rem .65rem}button:disabled{opacity:.45;cursor:not-allowed}button:not(:disabled):hover{background:#444}