:root{--bg-toolbar:#f5f5f5;--color-toolbar:#000;--bg-console:#f5f5f5;--color-console-btn:inherit}[data-theme=dark]{--bg-toolbar:#333;--color-toolbar:ivory;--bg-console:#333;--color-console-btn:#fff}body{font-family:Lato,san-serif;transition:background-color .2s}html{scroll-behavior:smooth}#header{z-index:9;background:#2c2c2c;height:50px;transition:all .2s;display:none;position:fixed;top:0;left:50px;right:0;overflow:hidden;box-shadow:0 1px 2px #00000080}#show-file-name{float:left;text-align:center;height:50px;line-height:50px;position:absolute;top:0;left:0;right:0}.textarea-readonly{vertical-align:middle;color:#f2f2f2;text-align:center;background:#2c2c2c;border:1px solid #2c2c2c;outline:none;font-size:1.25rem;line-height:1.2;display:inline-block}.textarea-modify{vertical-align:middle;color:#f2f2f2;text-align:center;background:#333;border:1px solid #fff;outline:none;font-size:1.25rem;line-height:1.2;display:inline-block}.navbar-right{float:right;-webkit-user-select:none;user-select:none;padding-top:15px;padding-right:2%;font-size:1rem;font-weight:600;text-decoration:none}#save{color:#fff;z-index:999;background-color:#664c4c;border:none;border-radius:5px;outline:none;font-size:18px}#save:hover{color:#000;background-color:#ddd}#link{float:right;-webkit-user-select:none;user-select:none;padding-right:1%;font-size:1rem;font-weight:600;text-decoration:none}#link a{color:#ba55d3;font-size:35px;text-decoration:none}#link a:hover{color:#a333be;text-decoration:none}#toolbar{background:var(--bg-toolbar);height:28px;color:var(--color-toolbar);z-index:99;-webkit-user-select:none;user-select:none;transition:all .2s;position:fixed;top:0;left:50px;right:0;overflow:hidden}.container{z-index:99;height:calc(100vh - 48px);margin:0 auto;transition:all .2s;display:block;position:fixed;top:28px;left:50px;right:0;overflow:hidden}#overlay{z-index:99999;background-color:#00000080;width:100%;height:100%;display:none;position:fixed;top:0;left:0}#spot-light-canvas{z-index:999999;background:silver;border-radius:13px;width:40%;height:51%;display:none;position:fixed;top:25%;left:30%;overflow:hidden;box-shadow:0 4px 8px #0003,0 6px 20px #00000030}.spot-light-div{text-align:center;vertical-align:middle;color:#333;background:0 0;width:100%;height:33.33%;font-size:25px;line-height:17vh;display:inline-block;position:relative;left:0;right:0;overflow:hidden}#overlay-2{z-index:100000;background-color:#00000080;width:100%;height:100%;display:none;position:fixed;top:0;left:0}#linear-index-canvas{z-index:1000000;background:silver;border-radius:13px;width:40%;height:51%;display:none;position:fixed;top:25%;left:30%;overflow:hidden;box-shadow:0 4px 8px #0003,0 6px 20px #00000030}.linear-index-div{text-align:center;vertical-align:middle;color:#333;background:0 0;width:100%;height:33.33%;font-size:25px;line-height:17vh;display:inline-block;position:relative;left:0;right:0;overflow:hidden}.sidenav{z-index:9999;background:#333;width:0;height:100%;transition:all .2s;position:fixed;top:50px;right:0;overflow-x:hidden}#sidenav-content{color:#fff;padding:16px;transition:margin-left .2s}.option{padding:10px;overflow:hidden}.option label{float:left;width:10%;font-size:15px;line-height:1.5}.rate-value,.pitch-value{float:right;width:8%;font-size:15px;line-height:1.5}.voice-select{width:230px;margin:10px 10px 20px}#rate,#pitch{float:right;width:75%}.language-picker{outline:none;max-height:18px;margin:5px 0 0 12px;font-size:11px}.voice-controller{float:right}.voice-controller button{color:inherit;font:inherit;background:0 0;border:none;outline:none;padding:4px 7px 0;text-decoration:none;display:inline-block;margin:0!important}#line-number{float:right;text-align:center;width:170px;padding:2px 6px;font-size:18px;font-style:oblique}#line-number label{font-size:17px}#show-line-column{float:right;text-align:center;padding:4px 6px 2px;font-size:16px;font-style:oblique}#left-nav{z-index:999;background-color:#333;position:fixed;inset:0 calc(100vw - 50px) 0 0}#github-link{-webkit-user-select:none;user-select:none;-webkit-box-pack:center;width:50px;display:-webkit-box;position:absolute;bottom:10px}#github-link img,.left-nav-button svg{width:26px;height:26px}.left-nav-button{text-align:center;color:silver;width:auto;height:2rem;font:inherit;background:0 0;border:none;outline:none;padding:10px 0}.left-nav-button:hover,.left-nav-button.active{color:#fff}#left-sidebar{z-index:999;background-color:#252525;width:0;height:100%;transition:all .2s;position:fixed;top:0;left:50px;overflow-x:hidden}.tabcontent{margin:0;padding:0;overflow:hidden auto}#left-sidebar::-webkit-scrollbar{display:none}#left-sidebar{scrollbar-width:none}#upload-area{padding:12px 15px;overflow:hidden auto}.sidebar-top-title{color:#fff;height:50px;padding-left:27px;font-size:15px;font-weight:100;line-height:50px}.sidebar-top-title p{vertical-align:middle;line-height:1.5;display:inline-block}.navbar{color:#fff}.navbar button{color:#fff;text-align:left;background-color:#0000;border:none;outline:none;width:250px;padding:7px 0 7px 35px;font-size:13px;text-decoration:none;display:inline-block;overflow:hidden}.navbar button:hover{background-color:#343434;border:none}.nav-title{color:#fff;text-align:left;background-color:#4b4b4b;border:none;outline:none;width:250px;height:28px;margin:0;padding:5px 0 5px 10px;font-size:15px;font-weight:700;text-decoration:none;display:inline-block;position:relative;overflow:hidden}.dropzone{text-align:center;color:gray;cursor:default;border:2px dashed gray;width:auto;height:calc(100vh - 120px);font-size:20px;font-weight:700;line-height:calc(100vh - 210px)}.dropzone:hover{color:#fff;border-color:#fff}#upload{color:#fff;padding:0 0 15px}#file-manager-title{width:220px}#title-button-add{color:#fff;text-align:left;float:right;z-index:9999;background-color:#4b4b4b;border:none;outline:none;width:30px;height:28px;margin:0;padding:5px 8px;font-size:15px;font-weight:700;text-decoration:none;position:relative;overflow:hidden}.filename-readonly{border:inherit}.filename-modify{border:1px solid #fff}.title-icon{width:12px;height:12px;display:inline-block}.filename-div{color:#fff;text-align:left;background-color:#252525;border:none;outline:none;width:250px;font-size:13px;text-decoration:none;display:inline-block;overflow:hidden}.filename-div:hover{background-color:#343434;border:none}.filename-div input{vertical-align:middle;text-align:left;color:#fff;background-color:#0000;outline:none;font-size:13px;display:inline-block;overflow:hidden}.filename-div button{color:#fff;float:right;text-align:left;z-index:9999;background-color:#0000;border:none;outline:none;padding:9px 8px 5px;font-size:13px;text-decoration:none;overflow:hidden}.filename-span{width:215px;padding-left:35px;line-height:30px;overflow:hidden}#file-manager ul{margin:0;padding:0}#file-manager ul li{cursor:pointer;-webkit-user-select:none;user-select:none;background:0 0;margin:0;padding:4px 0 4px 35px;list-style-type:none;transition:all .2s;position:relative}#file-manager ul li:hover{background-color:#343434;border:none}#file-manager ul li.active{background:#343434}.trash,.editable,.save{float:right;margin:0;padding:3px 4px;overflow:hidden}.input-span{margin:0;padding:0}#file-manager input{text-align:left;color:#fff;background-color:#0000;outline:none;width:140px;font-size:13px;overflow:hidden}#load-demo{text-align:center;background:#8c30b1;width:190px;margin:13px 30px 30px;padding:8px 20px;font-size:14px;overflow:hidden}#load-demo:hover{background:#9347b1}#load-demo-text{text-align:left;width:190px;margin:13px 30px 0;padding:0;font-size:14px;font-weight:100;line-height:23px}#audio-tutorial{text-align:center;background:#8c30b1;width:190px;margin:13px 30px 30px;padding:8px 20px;font-size:14px;overflow:hidden}#audio-tutorial:hover{background:#9347b1}#audio-tutorial-text{text-align:left;width:190px;margin:13px 30px 0;padding:0;font-size:14px;font-weight:100;line-height:23px}.navbar-toggle{color:#fff;text-align:left;background-color:#0000;border:none;outline:none;width:230px;padding:10px 0 5px 10px;font-size:15px;text-decoration:none;display:inline-block;overflow:hidden}.switch{float:right;width:30px;height:17px;position:relative}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;background-color:#ccc;transition:all .4s;position:absolute;inset:0}.slider:before{content:"";background-color:#fff;width:13px;height:13px;transition:all .4s;position:absolute;bottom:2px;left:2px}input:checked+.slider{background-color:#2196f3}input:focus+.slider{box-shadow:0 0 1px #2196f3}input:checked+.slider:before{transform:translate(13px)}.slider.round{border-radius:17px}.slider.round:before{border-radius:50%}.console{background:var(--bg-console);z-index:9999;height:330px;transition:all .2s;position:fixed;top:calc(100% - 20px);left:50px;right:0;overflow:hidden}#console-button-bar{height:29px;position:absolute;top:0;left:0;right:0;overflow:hidden}.console button{color:var(--color-console-btn);text-align:center;background:0 0;border:none;outline:none;width:auto;height:20px;margin:0;padding-left:20px;padding-right:20px;font-size:12px;overflow:hidden}.console button:hover{color:#5856d6}.result{background:#fff;width:calc(60vw - 30px);position:absolute;top:30px;bottom:0;left:0;overflow:hidden}#result-iframe{border:0 #fff;width:100%;height:300px}#console-log{background:#fff;border-left:1px solid #ddd;position:absolute;inset:30px 0 0 calc(60vw - 30px);overflow:auto}#log-iframe{border:0 #fff;width:100%;height:300px}.log-boolean,.log-undefined{color:#f0f;font-size:12px}.log-object,.log-string{color:orange;font-size:12px}.log-number{color:#0ff;font-size:12px}