@import"https://fonts.googleapis.com/css2?family=Roboto&display=swap";*{box-sizing:border-box}body{width:100vw;height:100vh;margin:0;background-color:#fff}.ctr-buttons{height:10%;display:flex;justify-content:center}.ctr-buttons>button{margin-right:10px}.ast{width:100%;height:30%;display:flex}.ast>div{width:50%;padding:20px}.ast .code-sample{display:flex;flex-direction:column}.ast .code-sample #select-program{max-width:200px}.ast #program{width:100%;border:1px solid #000;resize:none;height:100%;overflow-y:scroll}.ast .info #stats{height:100%}.ast .info #stats label{font-weight:bold;margin-right:10px}.ast .info #stats .stats-tokens{list-style-type:none;overflow-y:scroll;margin:0;padding:10px 0;height:80%}.ast .info #stats .stats-tokens li{float:left;margin-left:10px;padding:2px 5px;cursor:pointer}.ast .info #stats .stats-tokens li span{font-family:monospace;font-weight:bold;pointer-events:none}.ast .info #stats .stats-tokens li:hover{background-color:#77c63d;color:#fff;border-radius:5px}.highlight{background-color:#77c63d;border-radius:2px;color:#fff}.canvas{height:60%}.canvas .joint-paper{margin:0 auto}#stats{height:100%}#stats .stats-tokens{list-style-type:none;overflow-y:scroll;margin:0;padding:10px 0;height:80%}#stats .stats-tokens li{float:left;margin-left:10px;padding:2px 5px;cursor:pointer}#stats .stats-tokens li span{font-family:monospace;font-weight:bold}#stats .stats-tokens li:hover{background-color:#77c63d;color:#fff;border-radius:5px}button.joint-button{width:84px;height:40px;background:#fff;border:1px solid #0000001F;border-radius:16px;text-align:center;font-size:14px;line-height:16px;font-family:"Roboto",sans-serif;letter-spacing:.25px;color:#000000DE;cursor:pointer}button.joint-button:hover{background:#4666E51F;border:1px solid #4666e5;color:#4666e5}