@import url(https://fonts.googleapis.com/css2?family=Single+Day&display=swap);@import url(https://fonts.googleapis.com/css2?family=Schoolbell&display=swap);body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.app{height:100dvh;position:relative;width:100dvw}.nav-bar{align-items:center;-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);background:#777;box-shadow:0 0 10px #6665,0 0 2px #999;content:none;display:flex;flex-direction:column;height:50px;justify-content:space-between;left:5px;padding:5px;position:absolute;top:50%;translate:-100% -50%;width:10px;z-index:4}.nav-bar,.nav-bar button{border:none;border-radius:20vh}.nav-bar button{mixblend-mode:difference;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);background-color:initial;color:#999;display:none;height:0;margin:0;width:0}.dynamic-navbar{background:#0000;border-radius:20vh;height:50px;padding:20px;position:fixed;top:50%;translate:0 -50%;width:5px;z-index:10}.dynamic-navbar:hover .nav-bar{animation:open .6s ease-out forwards}.dynamic-navbar:not(:hover) .nav-bar{animation:close .6s ease-in forwards}.dynamic-navbar:focus .nav-bar{animation:open .2s ease-out forwards}.nav-bar:focus,.nav-bar:hover{animation:open .3s ease-out forwards}@keyframes open{0%{height:40px;width:10px}25%{height:60px;translate:5px -50%;width:20px}50%{height:80px;width:30px}75%{height:100px;width:35px}to{background:linear-gradient(226deg,#5553,#eee3);content:none;height:134px;translate:5px -50%;width:40px}}@keyframes close{0%{background:linear-gradient(226deg,#aaa3,#fff3);content:none;height:134px;translate:5px -50%;width:40px}to{background:#444;height:40px;width:10px}}.dynamic-navbar:focus,.dynamic-navbar:hover button{animation:focus-color .9s ease-in-out forwards;display:flex}@keyframes focus-color{0%{height:0;width:0}to{height:-webkit-fit-content;height:fit-content;width:-webkit-fit-content;width:fit-content}}.dynamic-navbar .nav-bar button:hover,button:focus{background:#4e32;color:#4a3;height:-webkit-fit-content;height:fit-content;width:-webkit-fit-content;width:fit-content}@media (max-width:786px) and (max-height:1080px){.nav-bar{align-items:center;height:50px;justify-content:space-between;padding:5px;width:15px}}.nav-bar button{padding:1vh}*{font-family:monospace;text-align:left}body{background-color:initial;font-family:School Bell,Single Day,"Monospace";margin:0;text-align:left}.main,body{height:100vh;width:100vw}.main{background:#fff;position:relative}.main .menu-bar{align-items:center;background:#5553;border-radius:30px;display:flex;gap:1vh;height:50px;justify-content:center;top:-40px;width:10vw;z-index:3}.dynamicbar,.main .menu-bar{left:50%;position:fixed;translate:-50%}.dynamicbar{background:#0000;height:40px;padding:.5vh;top:0;width:50px;z-index:4}.main .dynamicbar:hover .menu-bar{animation:open-navbar .5s ease-out forwards}.main .dynamicbar:not(:hover) .menu-bar{animation:close-navbar .5s ease-out forwards}.main .dynamicbar:focus .menu-bar{animation:open-navbar .5s ease-out forwards}@keyframes open-navbar{0%{width:10vw}to{background:#5550;height:-webkit-fit-content;height:fit-content;padding:.4vh;top:1vh;width:50vw}}@keyframes close-navbar{0%{background:#0000;height:-webkit-fit-content;height:fit-content;padding:.4vh;top:1vh;width:5vw}to{width:10vw}}.main .menu-bar .file{align-content:center;align-items:center;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);background:#0000;border-radius:30px;box-shadow:0 0 0 #7770;color:#0000;display:flex;height:-webkit-fit-content;height:fit-content;padding-block:.5vh;padding-inline:1vw;width:-webkit-fit-content;width:fit-content}.dynamicbar:focus .file,.dynamicbar:hover .file{animation:open-file-name .5s ease-out forwards}@keyframes open-file-name{0%{-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);box-shadow:0 0 4px #7770;color:#0000;display:none}to{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#7f04;box-shadow:0 0 4px #7f04;color:#000;display:flex}}.main .menu-bar .file .file-name{font-family:Scholl Bell,Single Day;font-size:0;font-weight:500}.dynamicbar:hover .file-name{animation:openfilename .5s ease-out forwards}@keyframes openfilename{0%{font-size:0}to{font-size:15px}}.main .menu-bar .menu-buttons{-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0);background:#fff4;border-radius:40px;box-shadow:0 0 8px #7770;display:none;gap:1vh;justify-content:center;padding-block:3px;padding-inline:4px;width:-webkit-fit-content;width:fit-content}.dynamicbar:hover .menu-buttons{animation:open-menubuttons .5s ease-out forwards;box-shadow:0 0 4px #ccc;display:flex;flex-direction:row}.dynamicbar:focus .menu-buttons{box-shadow:0 0 8px #ccc;display:flex}@keyframes open-menubuttons{0%{box-shadow:0 0 0 #7770}to{box-shadow:0 0 4px #ccc}}.main .menu-bar .menu-buttons button{align-content:center;background:#0000;border:none;border-radius:20px;color:#000;display:flex;height:-webkit-fit-content;height:fit-content;margin:0;padding:1vh}.dynamicbar:focus button,.dynamicbar:hover button{animation:open-buttons .7s ease-out forwards}@keyframes open-buttons{0%{color:#0000}}.main .dynamicbar:focus button:focus,.main .dynamicbar:hover button:hover{background:#000;color:#fff}.main .workspace{background:#0000;display:flex;flex-direction:row;height:100vh;padding:0;position:relative;width:100vw}.main .workspace .editor{background:#0000;border:none;font-family:Single Day;height:99.4vh;overflow:scroll;padding-inline:10px;resize:horizontal;scrollbar-width:none;width:99vw}.main .workspace .editor:focus{border-color:inherit;box-shadow:none;outline:none}.main .preview{font-family:Single Day;height:100vh;overflow:scroll;padding:1vh;scrollbar-width:none;width:50vw;z-index:1}.main .workspace .preview h1{font-size:46px}.main .workspace .preview h2{font-size:36px}.main .workspace .preview h3{font-size:26px}.main .workspace .preview h4{font-size:20px}.main .workspace .preview p{font-size:19px}.main .workspace .preview li{font-size:18px}.main .workspace .preview a{color:#333}.main .workspace .preview hr{color:#888;margin-bottom:8px;margin-top:5px;position:relative;width:30%}.main .fontsize{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#0000;border-radius:10px;bottom:10px;box-shadow:0 0 4px #8883;left:50%;padding:13px;padding-inline:10px;position:fixed;translate:-50%}.main .fontsize input[type=range]{align-items:center;-webkit-appearance:none;background:linear-gradient(270deg,#3339,#4444);border-radius:40px;display:flex;height:4px;justify-content:center;outline:none}.main .fontsize input[type=range]::-webkit-slider-thumb{-weblkit-appearance:none;-webkit-appearance:none;appearance:none;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(45deg,#3339,#3333);border:none;border-radius:40px;box-shadow:0 0 10px #3337;color:#0000;height:10px;width:24px}.main .fontsize input[type=range]::-moz-range-thumb{-weblkit-appearance:none;appearance:none;backdrop-filter:blur(13px);background:linear-gradient(45deg,#3339,#9997);border:none;border-radius:40px;box-shadow:inset 0 0 10px #fff7;color:#0000;height:13px;width:24px}.main .theme{background:#0000;border-radius:10vh;bottom:10px;display:flex;flex-direction:column;gap:8px;height:-webkit-fit-content;height:fit-content;position:fixed;right:10px;z-index:6}.main .theme button{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0000;border:none;border-radius:10vh;box-shadow:0 0 10px #8885;height:35px;padding:8px;width:35px;z-index:6}.main .theme .mode{background:#0000;right:10px;z-index:6}.main .theme .mode button{align-items:center;background:#fff;border:none;border-radius:40px;box-shadow:0 0 6px #8885;color:#000;display:flex;justify-content:center;padding:8px;z-index:5}.mode button:focus,.mode button:hover{background:#000;color:#fff}.modal{align-items:left;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);height:-webkit-max-content;height:max-content;justify-content:left;left:50%;position:fixed;top:50%;translate:-50% -50%;z-index:5}.modal,.modal .modal-container{display:flex;width:-webkit-max-content;width:max-content}.modal .modal-container{background-color:#000;border:1px solid gray;border-radius:25px;color:#fff;flex-direction:column;gap:2vh;padding:5vh}.modal .modal-container ul{display:flex;flex-direction:column;gap:.5vh;list-style:none;max-height:25vh;overflow-y:scroll;padding:0}.modal .modal-container ul li{align-items:center;background-color:#fff;border-radius:200px;color:#000;display:flex;flex-direction:row;height:-webkit-min-content;height:min-content;justify-content:space-around;margin:0;padding:1vh;width:20vw}.modal .modal-container ul li:hover{animation:hover .5s ease forwards;border-bottom:1px solid #eee}@keyframes hover{0%{background:#fff}to{background:#666}}.modal .modal-container .buttons{display:flex;gap:1vw;justify-content:left}.modal .modal-container button{background:#eee;border:none;border-radius:5px;color:#000;display:flex;justify-content:left;padding:1vh;width:-webkit-max-content;width:max-content}.modal .modal-container .delete-button{background-color:#111;border:none;border-radius:400px;color:#fff;display:flex;margin:0;padding:10px;width:-webkit-fit-content;width:fit-content}.modal .modal-container input{border:none;border-radius:10px;font-size:16px;padding:10px;position:relative;width:-webkit-max-content;width:max-content}@media (max-width:786px) and (max-height:1080px){.main{height:100vh;width:100vw}.main .workspace{align-content:center;align-items:center;display:flex;flex-direction:column;overflow-y:scroll;scrollbar-width:none}.main .workspace .editor{border:none;height:100vh;overflow:scroll;padding:1.5vh;padding-inline:2vw;resize:auto;scrollbar-width:none;width:96vw}.main .workspace .preview{height:100vh;overflow-x:scroll;scrollbar-width:none;white-space:wrap;width:100vw}.main .menu-bar{top:-40px}.main .menu-bar .file{padding:1vh;width:-webkit-fit-content;width:fit-content}.modal .modal-container,.modal .modal-container ul li{width:-webkit-max-content;width:max-content}.modal .modal-container ul li{gap:3vh;justify-content:space-around}.modal .modal-container button{padding:1vh}}*,html{margin:0}*{font-family:Schoolbell,cursive}canvas{background-color:#fff;border:none;overflow:hidden;touch-action:manipulation}textarea{background:#0000;font-family:Schoolbell,Single Day,cursive;overflow-anchor:none;scrollbar-width:none;white-space:nowrap}textarea:focus{outline:none}.collab{border:none;border-radius:40px;box-shadow:0 0 10px #8885;position:fixed;right:110px;top:10px}.collab button{background:#0000;border:none;border-radius:30vh;height:35px;justify-content:center;width:35px}.collab button,.ids{align-items:center;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);display:flex}.ids{background:linear-gradient(54deg,#4444,#aaa3);background-size:100%;border-radius:22px;flex-direction:column;gap:3px;justify-content:space-between;margin:0;padding:4px;position:fixed;right:20px;top:50%;translate:0 -50%}.ids input{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0000;box-shadow:0 0 10px #3333;height:20px;max-width:90vw;padding:8px;width:-webkit-fit-content;width:fit-content}.ids button,.ids input{border:none;border-radius:30px}.ids button{background:#9994;box-shadow:0 0 3px #9993;color:#fff;font-size:14px;height:25px;margin:0;padding-inline:8px}.ids button:hover{filter:invert(-1)}.ids button:focus,.ids button:hover{animation:colorChange 5s ease infinite alternate;background:#af44;color:#360}.toolid{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0f03;border-radius:30px;font-size:14px;left:50%;padding-block:.4vh;padding-inline:1vw;position:fixed;text-align:center;text-transform:uppercase;top:.8vh;translate:-50%}.toolbar input{align-items:center;-webkit-appearance:none;appearance:none;background:#0000;border:none;border-radius:50%;display:flex;height:25px;justify-content:center;margin-left:0;width:25px}.toolbar input::-webkit-color-swatch-wrapper{padding:0}.toolbar input::-webkit-color-swatch{border:1px solid #000;border-radius:150px;height:20px;padding:0;width:25px}.toolbar input::-moz-color-swatch{border:1px solid #000;border-radius:50%}.text-dialog button{background-color:#000;border:none;border-radius:210px;color:#fff;display:flex;justify-content:center;padding:10px}.toolbar{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);bottom:1vh;justify-content:space-around;left:50%;padding:5px;position:fixed;translate:-50%;width:-webkit-fit-content;width:fit-content;z-index:3}.toolbar,.toolbar button{align-items:center;border:none;border-radius:30px;display:flex}.toolbar button{background:#0000;height:35px;justify-content:center;margin:0;padding:0;width:35px}.toolbar button:hover{animation:focused .1s ease-in forwards;z-index:10}.toolbar button:focus{transform:scale(1.3) translateY(-4px);z-index:10}@keyframes focused{to{transform:scale(1.3) translateY(-5px)}}.hist-tools{border-radius:30px;box-shadow:0 0 5px #8885;flex-direction:column-reverse;padding:2px;position:fixed;right:1vw;top:1vh;width:fit-10px;z-index:3}.hist-tools,.hist-tools button{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex}.hist-tools button{align-items:center;border:none;border-radius:30px;height:35px;justify-content:center;margin:0;padding:0;width:35px}.hist-tools button:focus,.hist-tools button:hover{filter:invert(1)}.menu{box-shadow:0 0 5px #8885;left:1vw;padding:2px;position:fixed;top:1vh;width:fit-10px;z-index:3}.menu,.menu button{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:30px}.menu button{align-items:center;background:#0000;border:none;color:#000;display:flex;height:35px;justify-content:center;margin:0;padding:8px;width:35px}.menu button:focus,.menu button:hover{filter:invert(1)}.theme-mode{border-radius:10vh;display:flex;flex-direction:column-reverse;gap:10px;padding:3px;position:fixed;right:60px;top:1vh}.theme-mode button{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0000;border:none;border-radius:10vh;box-shadow:0 0 10px #8885;height:35px;padding:8px;width:35px}.theme-mode .gridButton:focus,.theme-mode .gridButton:hover{filter:invert(1)}@media (max-width:786px) and (max-height:1080px){.toolbar{overflow-x:scroll;scrollbar-width:none;width:94vw}.toolbar input{height:25px;width:25px}.toolbar button{height:32px}.theme-mode{right:50px;top:1vh}.collab{right:98px}}:root{--angle:0deg}*{font-family:Single Day,School Bell,Cursive}.home-container{-webkit-backdrop-filter:invert(100%);backdrop-filter:invert(100%);background:url(../../static/media/homebackground.b1041fda4d47b04ae891.jpg);background-position:50%;background-size:cover;flex-direction:column;gap:10px;height:100vh;justify-content:center;width:100vw}.home-container,.indicator{align-items:center;display:flex}.indicator{left:5px;position:fixed;top:50%;translate:-15px -50%}.indicator .indicator1{animation:LR 1s ease-in infinite alternate;color:#3335;display:flex;position:fixed}.indicator .indicator2{animation:LR 1.3s ease-in infinite alternate;animation-delay:.1s;color:#2225;display:flex;margin:10px;position:fixed}@keyframes LR{0%{left:10px}to{color:#0000;left:20px}}.grad{-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:linear-gradient(20deg,#0003 5%,#fff9 30%,#3332 96%);background-size:100%;height:100vh;position:absolute;width:100vw;z-index:-1}.home-container .home-text{align-items:center;background:#0000;border-radius:20px;color:#433;display:flex;flex-direction:column;height:-webkit-fit-content;height:fit-content;justify-content:center;padding:20px;width:-webkit-fit-content;width:fit-content}.home-container .home-text .heading{font-size:40px;margin-bottom:20px}.home-container .home-text .welcome{font-size:25px;margin-bottom:10px}@media (max-width:786px) and (max-height:1080px){.home-container .home-text{height:-webkit-fit-content;height:fit-content;width:80%}.home-container .home-text .heading{font-size:60px}.home-container .home-text .intro{font-size:18px;width:-webkit-fit-content;width:fit-content}}
/*# sourceMappingURL=main.65c5e85a.css.map*/