:root{--font:'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;--font-size:15pt}@media(prefers-color-scheme:light){body{background-color:#f0f0f0;color:#222}main{background-color:#ddd}canvas{border-color:#bbb}input[type=number],input[type=text],select{border-color:#bbb;background-color:#eee;color:#222}fieldset{border-color:#bbb}button{background-color:#bbb;color:#222}button:hover{background-color:#aaa}button:active{background-color:#999}button:focus{outline:2px solid #777}button:focus-visible{outline:2px solid #555}input[type=checkbox]{accent-color:#bbb}input[type=checkbox]:hover{accent-color:#aaa}input[type=checkbox]:active{accent-color:#999}input[type=checkbox]:focus{outline:2px solid #777}input[type=checkbox]:focus-visible{outline:2px solid #555}input[type=range]{accent-color:#bbb}input[type=range]:hover{accent-color:#aaa}input[type=range]:active{accent-color:#999}input[type=range]:focus{outline:2px solid #777}input[type=range]:focus-visible{outline:2px solid #555}}@media(prefers-color-scheme:dark){body{background-color:#101010;color:#eee}main{background-color:#202020}canvas{border-color:#444}input[type=number],input[type=text],select{border-color:#444;background-color:#222;color:#eee}fieldset{border-color:#444}button{background-color:#444;color:#eee}button:hover{background-color:#555}button:active{background-color:#666}button:focus{outline:2px solid #888}button:focus-visible{outline:2px solid #aaa}input[type=checkbox]{accent-color:#444}input[type=checkbox]:hover{accent-color:#555}input[type=checkbox]:active{accent-color:#666}input[type=checkbox]:focus{outline:2px solid #888}input[type=checkbox]:focus-visible{outline:2px solid #aaa}input[type=range]{accent-color:#444}input[type=range]:hover{accent-color:#555}input[type=range]:active{accent-color:#666}input[type=range]:focus{outline:2px solid #888}input[type=range]:focus-visible{outline:2px solid #aaa}}*{box-sizing:border-box;margin:0;padding:0}body{display:flex;justify-content:center;align-items:center;height:100vh;font-family:var(--font);font-size:var(--font-size)}main{display:flex;flex-direction:column;gap:20px;align-items:flex-start;padding:20px;border-radius:8px}canvas{border-width:1px;border-style:solid;border-radius:8px}.console{display:flex;flex-direction:row;gap:20px;justify-content:space-between}@media(max-width:600px){.console{flex-direction:column}}button{padding:.5em 1em;margin:.5em 0;cursor:pointer;font-family:var(--font);font-size:var(--font-size)}input[type=number],input[type=text],select{font-size:var(--font-size);font-family:var(--font);margin:.5em 0;padding:.5em;border-width:1px;border-style:solid;border-radius:4px;width:200px}input[type=checkbox],select{cursor:pointer}label{margin:.5em 0 0;font-weight:600}fieldset{border-width:1px;border-style:solid;border-radius:8px;padding:1em;margin-bottom:1em;width:100%;display:flex;flex-direction:column}fieldset legend{font-weight:600;margin-bottom:.5em}