*{box-sizing:border-box}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}html,body{margin:0;padding:0;background-color:#f0f0f0}canvas{display:block}.container{display:grid;grid-template-columns:1fr 1fr;width:100vw;height:100vh;margin:0;padding:0}#controls{position:fixed;top:20px;left:20px;z-index:10;display:flex;gap:10px}#controls button{padding:10px;color:#000;background-color:#efefef;border:1.2px solid #767676;border-radius:50px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .1s ease;-webkit-user-select:none;user-select:none}#controls button img{width:64px;height:64px;display:block}@media (hover: hover){#controls button:hover{background-color:#e5e5e5;border-color:#4f4f4f}}#controls button:active{background-color:#d5d5d5!important;transform:scale(.96);box-shadow:inset 0 1px 3px #0000001a}.sketch-container{position:relative;overflow:hidden}.sketch-container:first-child{border-right:2px solid #333}@media screen and (max-width: 750px){.container{grid-template-columns:1fr;grid-template-rows:1fr 1fr}.sketch-container:first-child{border-right:none;border-bottom:2px solid #333}}*{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;touch-action:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}