body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace}*{box-sizing:border-box}.canvasWrapper{position:relative}.canvasWrapper:hover .overlay{opacity:1}.overlay{opacity:0;position:absolute;width:100%;height:100%;background:rgba(0,0,0,.7);color:#fff;text-align:left;transition:all .15s;font-size:11px;padding:20px;pointer-events:none}.trait{margin-bottom:2px}canvas{margin-right:4px}.random-generator .canvasWrapper{display:inline-block}.renderer-page{position:relative;overflow:hidden}.topbar{color:#fff;padding:20px;justify-content:space-between;background:#383838}.inputs,.topbar{display:flex}.input{margin-right:10px}.input label{display:block;font-size:12px;margin-bottom:3px}.input input{width:100px;padding:5px;border-radius:4px;border:1px solid #ccc}.inputs button{margin-top:16px;height:26px;border:0;color:#fff;background:#4e44ce}.multi-wrapper{display:flex}.button-wrapper,.pickerPreview{margin-right:5px}.pickerPreview{opacity:.6;width:120px;margin-bottom:3px;transition:all .15s}.pickerPreview.isActive{opacity:1}.bottom-layout{display:flex;justify-content:space-between}.bottom-layout-left{display:flex;justify-content:center;align-items:center;height:calc(100vh - 90px);flex:1 1;overflow:scroll;background:#484646}.bottom-layout-right{height:calc(100vh - 90px);padding-top:20px;padding-left:20px;width:160px;background:#424242;overflow-y:scroll}.bottom-layout-left::-webkit-scrollbar,.bottom-layout-right::-webkit-scrollbar{width:5px;height:5px}.bottom-layout-left::-webkit-scrollbar-track,.bottom-layout-right::-webkit-scrollbar-track{background:transparent}.bottom-layout-left::-webkit-scrollbar-thumb,.bottom-layout-right::-webkit-scrollbar-thumb{background-color:#000;border-radius:20px}