@import"https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500&display=swap";*{margin:0;padding:0;box-sizing:border-box}html,body{font-family:Roboto,sans-serif;background:#1f1f1f}.main-container{display:flex;flex-flow:column;height:100vh;overflow:hidden;justify-items:center}.main-container .title-section{display:flex;align-items:center;background:#2c2c2c;color:#fff;padding:.5em}.main-container .title-section h1{font-weight:400;font-size:1.25rem;display:inline;margin-left:1em;margin-right:1em}.main-container .examples{display:inline-block;position:relative}.main-container .examples button svg{margin-left:.3em}.main-container .examples .examples-list{margin-top:.3em;position:absolute;z-index:1;list-style:none;background:#2f2f2f;width:12em;border-radius:.25em;box-shadow:0 0 15px #0000001a;overflow:hidden;font-size:.9em}.main-container .examples .examples-list li{padding:.75em;cursor:pointer;transition:.15s}.main-container .examples .examples-list li:hover{background:#353535}.main-container .examples .examples-list li:not(.main-container .examples .examples-list li:first-child){border-top:1px solid #464646}.main-container .github-link{margin-left:auto;align-self:center}.main-container .github-link svg{fill:#fff;width:2em;height:2em;fill:#ffffffbf;transition:fill .25s;margin-top:.25em}.main-container .github-link svg:hover{fill:#fff}.main-container .info{position:relative;display:inline-flex;align-items:center;margin-left:auto;width:2.5em;height:2.5em}.main-container .info svg{color:#a2a2a2;margin:auto;width:50%;height:50%}.main-container .info:hover .info-content{opacity:1;display:block}.main-container .info .info-content{position:absolute;display:none;opacity:0;background:rgba(0,0,0,.5);margin-top:9.5em;margin-left:-9.5em;padding:1em;border-radius:.25em}.main-container .info .info-content ul{margin-top:.25em;margin-left:1.25em}.main-container .drag-area{flex-shrink:0;background:#1c1c1c;height:5px;width:100%;cursor:row-resize}.main-container .console-area{flex-grow:1;background:#1c1c1c;color:#fff;font-family:monospace;font-size:1rem;padding:1em;resize:none;border:none;outline:none;width:100%;overflow-y:auto;overflow-x:hidden;white-space:pre-wrap;overflow-wrap:break-word}.main-container .console-input{outline:none;background:#212121;border:none;border-top:1px solid #414141;padding:1em;color:#fff;font-size:1.25em;font-family:monospace}button{font-family:Roboto,sans-serif;outline:none;padding:.75em;border-radius:.25em;border:1px solid #464646;color:#fff;background:transparent;cursor:pointer;display:flex;align-items:center;font-size:.9em;transition:.1s}button:disabled{cursor:default;background:rgba(255,255,255,.05);color:#a7a7a7!important}button:hover:not(button:disabled){background:#3f3f3f}button:focus{box-shadow:0 0 0 .25em #ffffff26}::-webkit-scrollbar{width:10px;background:#101010}::-webkit-scrollbar-thumb{background:#2c2c2c;border-radius:5px}