html,body{padding:0;margin:0;overflow:hidden}#root{margin:0 auto;display:flex;flex-direction:row;background:#333;color:#fff;width:100%}#sidebar{width:40%;border-right:1px solid #999;height:100vh;overflow-y:scroll}#sidebar h2{padding:20px;margin:0}#sidebar ul{padding:0;margin:0;list-style:none}#sidebar li{margin:0}#sidebar li a{display:block;padding:10px 30px;cursor:pointer}#sidebar li:hover{background:#555}#sidebar li.active{background:#666}#preview{flex-grow:1;display:flex;flex-direction:column;justify-content:center;align-items:center}#preview #character{width:512px;height:512px;background:#444;border-radius:16px;box-shadow:0 0 16px #000;position:relative;overflow:hidden}#preview #character img{position:absolute;top:0;left:0;image-rendering:pixelated}