/* <style> */
#passwordManagerUsername{display:none}
*{box-sizing:border-box;}
body{margin:0;user-select:none;margin-top:45px;font-family:微软雅黑;background:#f5f5f5;min-height:100%;}
::-webkit-scrollbar{display:none;}
.title{position:fixed;top:0;left:0;right:0;height:fit-content;box-shadow:0 0 5px 0 rgba(0,0,0,.4);height:40px;background:white;z-index:5;vertical-align:top;}
.appName{font-size:1.5em;position:absolute;top:0;height:fit-content;bottom:0;left:10px;margin:auto}
.appName b{color:#1e9fff;}
#versionNote{border-radius:10px 10px 10px 0;background:#f5f5f5;display:inline-block;margin-left:5px;color:#ababab;padding:0 5px;font-size:.4em;vertical-align:top}
#versionNote.active{background:#1e9fff;color:white}
.title #logoutBtn{position:absolute;top:0;bottom:0;right:35px;margin:auto;transform:rotate(180deg)}
.title #skinBtn{position:absolute;top:0;bottom:0;right:10px;margin:auto;}
.module{display:none;background:white;}
.module.shown{display:block;animation:showModule .3s ease;}
.loading, .texteditor.shown{animation:none!important;}
@keyframes showModule{from{transform:translateY(15px);opacity:0;}to{transform:none;opacity:1;}}
.login{text-align:center;position:fixed;inset:0;margin:auto;padding:10px;height:fit-content;width:fit-content;background:white;border-radius:5px;}
.loginTitle{font-size:1.7em;margin-bottom:10px;}
#loginPassword{vertical-align:middle;height:35px;border-radius:5px 0 0 5px;border:0;outline:none;padding:5px;border:1px solid rgba(0,0,0,.1);border-right:0;transition:border .2s;}
#loginPassword:focus{border:1px solid #1e9fff;border-right:0;}
.loginBtn{transition:all .2s;height:35px;width:35px;vertical-align:middle;outline:none;border:0;border-radius:0 5px 5px 0;background:#1e9fff;color:white;font-size:1.2em;}
.loginBtn:hover{background:#0092ff;}
.loginBtn:active{color:#bae2ff;}
.addressBar{margin-top:5px;border-radius:5px;background:white;overflow:hidden;display:inline-block;text-align:left;max-width:500px;width:100%}
.addressBar button{font-weight:bold;width:30px;height:32px;border:0;outline:0;background:transparent;border-right:1px solid #f5f5f5;vertical-align:middle;}
.addressBar button:hover{background:rgba(0,0,0,.09);}
.addressBar button:active{background:rgba(0,0,0,.12);}
.addressBar div{vertical-align:middle;display:inline-block;width:calc(100% - 60px);padding:0 10px;overflow-x:scroll;white-space:nowrap}
.files,.search{margin:10px;background:transparent;text-align:center;}
#fileList,#searchOptnArea,#searchResult{margin-top:5px;border-radius:5px;background:white;overflow:hidden;margin-bottom:10px;display:inline-block;text-align:left;max-width:500px;width:100%}
#searchOptnArea{margin-bottom:0;}
#fileList center{padding:30px 0;opacity:.6}
#fileList .file,#searchResult .file{padding:10px;text-align:center;}
#fileList .file:hover,#searchResult .file:hover{background:rgba(0,0,0,.09);}
#fileList .file:active,#searchResult .file:active{background:rgba(0,0,0,.12)}
.file .fileIco{display:inline-block;margin-right:5px;width:23px;height:23px;vertical-align:middle}
.file.selected[data-isdir^=true] .fileIco{fill:black;}
.file.selected .fileIco{filter:invert(1)}
#fileList .file .fileName,#searchResult .fileName{display:inline-block;width:calc(100% - 135px);text-align:left;vertical-align:middle;font-size:1.1em;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
#searchResult .fileName{width:calc(100% - 40px);}
#fileList .file .size{display:inline-block;width:90px;text-align:right;vertical-align:middle;opacity:.5;}
#fileList .file[data-isdir^=true] .size{opacity:0;}
#fileList .file.selected{background:#1e9fff;color:white;}
.texteditor{margin:10px;}
#textEditor{position:absolute;top:40px;left:0;right:0;height:calc(100% - 40px);}
#textEditor *::-webkit-scrollbar{display:block;width:3px;height:0px;background:#ebebeb;}
#textEditor *::-webkit-scrollbar:hover{width:15px}
#textEditor *::-webkit-scrollbar-thumb{border-radius:2px;background:#bababa;}
contextmenukey{display:none;}
contextmenu{z-index:30;position:fixed;border:1px solid #c1c1c1;width:150px;height:fit-content;background:white;overflow:hidden;box-shadow:1px 1px 2px 0 rgba(0,0,0,.2);}
contextmenu button{outline:none;display:block;border:0;padding:5px 10px;background:white;width:100%;text-align:left;position:relative;}
contextmenu button:hover{background:rgba(0,0,0,.05);}
contextmenu button:active{background:rgba(0,0,0,.1);}
contextmenu button contextmenukey{position:absolute;right:10px;top:0;bottom:0;height:fit-content;margin:auto;display:inline-block;opacity:.5;}
.imgviewer,.vidviewer{background:transparent;}
#vidviewer,#imgviewer{width:calc(100% - 10px);height:calc(100vh - 100px);background:white;margin:5px;border:1px solid rgba(0,0,0,.1);border-radius:5px;object-fit:contain;outline:none;}
.updinfo{margin:10px;padding:10px;}
#updinfo{padding:10px;}
.upload{inset:0;margin:auto;height:fit-content;width:340px;padding:10px;border-radius:5px;position:fixed;overflow:hidden;}
.uploadProgress{height:8px;border-radius:4px;background:#f0f0f0;overflow:hidden;margin:10px 0;}
.uploadText{width:100%;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#uploadProgressBar{height:8px;transition:width .2s;background:#1e9fff;width:0;}
.loadingAnimation{position:fixed;inset:0;margin:auto;width:fit-content;height:fit-content;z-index:20}
.loadingAnimationDot{animation:loadingDot .8s linear 0s infinite;font-weight:bold;font-size:2em;display:inline-block;opacity:.1;}
#dot2{animation-delay:.1s!important}
#dot3{animation-delay:.2s!important}
#searchAddrBar{padding:5px;overflow-x:scroll;white-space:nowrap}
#searchOptnArea div span{width:100px;display:inline-block;vertical-align:middle;padding:5px;}
#searchOptnArea div input,#searchOptnArea div select{background:white;padding:3px;padding-left:0;display:inline-block;vertical-align:middle;width:calc(100% - 105px);border:0;border-bottom:1px solid #f5f5f5;outline:none;}
#searchOptnArea div input{padding-left:5px;}
#filesUploadInputContainer{display:none;position:fixed;inset:0;background:rgba(100,100,100,.5);z-index:30;}
#filesUploadInputContainer div{width:250px;height:fit-content;inset:0;margin:auto;position:fixed;padding:20px;border-radius:10px;text-align:center;border:2px dotted white;color:white}
#filesUploadInputContainer span{display:block;font-size:2em;}
#filesUploadInputContainer input{position:fixed;inset:0;width:100%;height:100%;opacity:0;}
@media screen and (max-width:700px) {
	.mobileInputAdded #mobileFastInput{bottom:0;}
	.mobileInputAdded .menu.shown{bottom:40px}
	.mobileInputAdded .title{display:none}
	.mobileInputAdded #textEditor{top:0px}
}
#mobileFastInput{position:fixed;bottom:-90px;height:40px;background:white;text-align:center;z-index:15;transition:top .2s;width:100vw;margin:auto;padding:5px 0;}
.mobileInputBtn.mode{background:#fafafa}
.mobileInputBtn{display:inline-block;border-radius:5px;padding:5px 2px;}
#fastInputHtm .mobileInputBtn{width:calc(100% / 8 - 5px);}
#fastInputJs .mobileInputBtn{width:calc(100% / 11 - 5px);}
#fastInputCss .mobileInputBtn{width:calc(100% / 9 - 5px);}
.mobileInputBtn:active{background:#eeeeee;}
contextmenu #saveMenuText{display:none}
.menu #saveContextMenuText{display:none}
@keyframes loadingDot{
	0%{transform:translateY(0px)}
	15%{transform:translateY(10px)}
	30%{transform:translateY(-10px)}
	45%{transform:translateY(5px)}
	60%{transform:translateY(5px)}
	75%{transform:translateY(0)}
}
@media screen and (min-width:701px) {
	.menu{top:-30px;transition:top .2s,opacity .2s;opacity:0;position:fixed;z-index:20;right:65px;left:150px;height:24px;text-align:right;}
	.menu button{outline:none;border:0;background:#f5f5f5;height:100%;width:45px;border-radius:5px;margin-left:5px;}
	.menu button.big{width:70px}
	.menu button:hover{background:#f9f9f9}
	.menu button:active{background:#f0f0f0}
	.menu.shown{top:8px;opacity:1;}
}
@media screen and (max-width:700px) {
	body{margin-bottom:50px;}
	.menu{bottom:-35px;transition:bottom .2s;box-shadow:0 0 5px 0 rgba(0,0,0,.4);background:white;position:fixed;z-index:10;right:0;left:0;height:30px;text-align:center;overflow-y:scroll;white-space:nowrap}
	.menu button{outline:none;border:0;height:100%;width:fit-content;background:transparent;width:30px;padding:0;}
	.menu button.big{width:60px}
	.menu.shown{bottom:0;}
	#textEditor{height:calc(100% - 70px)}
}
.skin{margin:5px;padding:10px;border-radius:5px;}
#themeMain{text-align:center;}
.themeBox{width:300px;background:#f5f5f5;padding:5px;display:inline-block;border-radius:5px;margin:5px;}
.themeBox img{width:100%;height:200px;object-fit:cover;border-radius:5px;}
.themeBox div,.themeBox span{display:block;width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:left;}
.themeBox div{font-size:1.2em;}
.themeBox span{opacity:.6;}
.themeBox.selected{background:#1e9fff;color:white;}
.themeBox.selected div::before{content:"✓ "}

/* </style> */
