*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0;padding:0;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;overflow:hidden}#root{overflow:hidden}body{position:fixed;overflow:hidden;overscroll-behavior-y:none;font-family:-apple-system,BlinkMacSystemFont,avenir next,avenir,helvetica neue,helvetica,ubuntu,roboto,noto,segoe ui,arial,sans-serif;color:#000;-webkit-font-smoothing:antialiased;background:#f0f0f0}.app-container{display:flex;position:absolute;z-index:2;flex-direction:row;height:100vh}.ui-container{width:300px;padding:10px;position:absolute;z-index:2;background-color:#f0f0f0;border-right:1px solid #ccc;overflow-y:auto}.canvas-container{flex-grow:1;background-color:#3b3b3b;display:flex;justify-content:center;align-items:center;margin:20px}.button-container{display:flex;position:absolute;z-index:2;flex-direction:column;align-items:flex-start;padding:10px}.button{margin:5px 0}.model-selector{margin:50px}:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;display:flex;place-items:center;min-width:320px;min-height:100vh}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}.color-picker-button{position:absolute;top:100px;left:10px;z-index:1}.color-picker-button button{background-color:#3b3b3b;color:#fff;border:none;padding:10px;cursor:pointer;margin-bottom:10px}.color-picker-icon{width:40px;height:40px}.color-picker-button .tooltip{visibility:hidden;width:120px;background-color:#555;color:#fff;text-align:center;border-radius:6px;padding:5px 0;position:absolute;z-index:1;bottom:100%;left:50%;margin-left:-50px;opacity:0;transition:opacity .3s}.color-picker-button .tooltip:after{content:"";position:absolute;top:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:#555 transparent transparent transparent}.color-picker-button button:hover .tooltip{visibility:visible;opacity:1}.picker{position:absolute;z-index:1;background:#fff;padding:10px;border:1px solid #ccc;box-shadow:0 8px 16px #0003}.sketch-picker{position:absolute;z-index:2;background:#000000bf!important;border-radius:8px!important;box-shadow:0 8px 16px #0003!important;padding:10px!important;border:1px solid #ccc!important}.sketch-picker .flexbox-fix{background:transparent!important}.sketch-picker .saturation,.sketch-picker .hue,.sketch-picker .alpha{border-radius:8px!important;background:transparent!important}.sketch-picker .controls{background:transparent!important}.sketch-picker .color{border-radius:8px!important;background:transparent!important}.sketch-picker input,.sketch-picker label{color:#fff!important;font-family:Helvetica;border-radius:4px}.sidebar{width:200px;padding:10px;background-color:#f0f0f0;border-left:1px solid #ccc}:root{--icon-color-light: #000000;--icon-color-dark: #ffffff}@media (prefers-color-scheme: dark){:root{--icon-color: var(--icon-color-dark)}}@media (prefers-color-scheme: light){:root{--icon-color: var(--icon-color-light)}}.icon{width:24px;height:24px;fill:var(--icon-color)}
