:root{--hue: 200;--text-color: hsl(var(--hue), 100%, 90%, .8);--text-shadow: 0 0 7px hsl(var(--hue), 100%, 50%);--font-family: sans-serif;--font-size: 15px;--bg-color: hsl(var(--hue), 25%, 25%);--button-color: hsl(var(--hue), 25%, 70%, .5);--bg-color-alt: #222;--bg-radius: .25em}*{scrollbar-color:var(--text-color);scrollbar-width:thin;accent-color:var(--text-color);color-scheme:only dark;color:var(--text-color);font-family:sans-serif}body{background-color:var(--bg-color-alt)}code{font-family:monospace;background-color:#222;border:1px solid #111;border-radius:var(--bg-radius)}select{background-color:var(--bg-color-alt)}table,tr,td{border:1px solid white;border-collapse:collapse}table{background:var(--bg-color-alt);display:inline-block;border-radius:var(--bg-radius);position:relative;width:fit-content;margin:24px}td{padding:3px}button,input[type=button]{background-color:#444;border-radius:var(--bg-radius);cursor:pointer;border:1px solid #999;padding:5px 1em}button:hover,input[type=button]:hover{background-color:#666}input,select{box-shadow:none;border:1px solid #555;border-radius:var(--bg-radius)}input[type=text]{display:inline-block}input:hover{cursor:text}input[type=checkbox]:hover,[clickable]{cursor:pointer}dialog{background-color:var(--bg-color);border-radius:var(--bg-radius);box-shadow:var(--bg-shadow);text-align:center;border:none}input[type=range]{appearance:none;overflow:hidden;height:10px;background:var(--bg-color)}::-webkit-slider-runnable-track{-webkit-appearance:none;appearance:none;width:100%;height:25px;border-radius:var(--bg-radius);background:var(--bg-color);outline:none}::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:25px;height:25px;border-radius:25%;cursor:pointer;background:var(--text-color)}::-webkit-scrollbar{background-color:#0000;width:5px}::-webkit-scrollbar-track{background-color:#0000}::-webkit-scrollbar-thumb{background-color:var(--text-color);border-radius:2.5px}progress{background-color:var(--button-color);border-radius:var(--bg-radius)}progress::-webkit-progress-bar{background-color:#0000;border-radius:var(--bg-radius)}progress::-moz-progress-bar{background-color:var(--text-color);border-radius:var(--bg-radius)}progress::-webkit-progress-value{background-color:var(--text-color);border-radius:var(--bg-radius)}#app{display:grid;grid-template-columns:max-content 1fr;inset:0;position:fixed}#menu{width:max-content;display:flex;flex-direction:column;gap:1em;align-items:center;grid-column:1;border-right:1px solid #ccc;overflow:hidden;resize:horizontal;text-wrap:nowrap;padding:1em;button{width:150px}ul{list-style:none;padding:0}li{border:1px solid #ccc;background-color:#333;border-radius:.5em;padding:.5em;margin-bottom:1em;p{margin:0}}li:hover{cursor:pointer}div{margin-bottom:1em}.bottom{display:inline-flex;margin:auto 0 0}}#editor-container{grid-column:2;overflow:scroll;.closed{text-align:center;position:absolute;width:max-content;padding:1em;p{width:100%}}.open{z-index:3;display:none}}#toolbar{position:absolute;width:100%;height:2em;padding:1em;top:0;overflow-x:scroll;display:flex;gap:1em;.name{min-width:1em;min-height:1em;outline:none;padding-left:.5em}}#editor{position:absolute;width:100%;height:calc(100% - 4em);top:4em;overflow:scroll}