*{box-sizing:border-box}body{margin:0;font-family:Arial,Microsoft YaHei}.app{height:100vh;display:flex;flex-direction:column}.topbar{height:56px;display:flex;align-items:center;gap:12px;border-bottom:1px solid #ddd;padding:8px}.btn{padding:6px 12px}.tabs{display:flex;gap:4px;flex:1;overflow:auto}.tabs button{border:0;background:#eee;padding:6px 10px}.tabs .active{background:#ccc}.body{flex:1;display:flex}.sidebar{width:260px;border-right:1px solid #ddd;padding:10px;overflow:auto}.sidebar input{width:100%;padding:8px}.folder-title{padding:8px;cursor:pointer}.file{padding:7px;cursor:pointer}.editor-area{flex:1;display:flex}.editor-area.split .source{width:40%}.source textarea{width:100%;height:100%;border:0;border-right:1px solid #ddd;padding:20px;font-family:monospace}.paper{flex:1;overflow:auto;padding:40px}.editor{max-width:900px;margin:auto}.ProseMirror{outline:none;line-height:1.8;font-size:16px}.preview{white-space:pre-wrap;padding:20px}.hidden-source{display:none}.source{width:40%;border-left:1px solid #ddd}.source textarea{height:100%;width:100%}html,body,#app{height:100%;overflow:hidden}.paper{height:calc(100vh - 56px);padding:32px 48px;overflow:auto}.editor{min-height:100%;max-width:900px;margin:auto}.editor[contenteditable=true]{outline:none}.editor:focus{outline:none}.sidebar{-webkit-user-select:none;user-select:none}.file.drag-over,.folder.drag-over{background:#e8f0ff}.tabs button.active{background:#cfe2ff;font-weight:600}.file.active{background:#cfe2ff;border-radius:4px}.editor-area{height:calc(100vh - 56px);overflow:hidden}.paper{height:100%;overflow:auto;padding:32px 48px}.editor{min-height:calc(100% - 64px);padding-bottom:32px}.divider{width:6px;cursor:col-resize;background:#ddd;flex-shrink:0}.divider:hover{background:#aaa}.editor-area.split .paper,.source{flex:none}.divider{cursor:col-resize;width:6px;background:#ddd}.editor-area{height:calc(100vh - 56px)}.paper{overflow:hidden}.source textarea{padding:20px}.file input,.tabs input{width:90%;border:1px solid #aaa}.file.active{background:#cfe2ff}.divider{position:relative;z-index:10;touch-action:none}.divider:after{content:"";position:absolute;left:-8px;right:-8px;top:0;bottom:0}.folder,.file{transition:background .15s}.folder.drag-target{background:#e8f0ff}.rename-input,.file input,.tabs input{display:inline-block;height:22px;line-height:22px;vertical-align:middle;white-space:nowrap;width:auto!important}.file,.folder,.tabs button{white-space:nowrap}.editor-area{position:relative;display:flex;width:100%;height:calc(100vh - 56px);min-width:0;overflow:hidden}.editor-area .paper,.editor-area .source{flex:none;min-width:0}.editor-area .paper{overflow:auto}.editor-area .source{overflow:hidden}.divider{flex:0 0 6px;width:6px;cursor:col-resize;z-index:20;background:#ddd;position:relative}.divider:hover{background:#999}.source textarea{display:block;width:100%;height:100%;resize:none;box-sizing:border-box}.file,.folder{cursor:default}.folder>div:first-child,.file{-webkit-user-select:none;user-select:none}.folder.drag-target,.file.drag-target{background:#e8f0ff}.file input,.tabs input,.folder input{vertical-align:middle;white-space:nowrap;display:inline-block;line-height:22px;height:22px;box-sizing:border-box}.folder-title{padding:7px 6px;cursor:pointer;border-radius:4px;white-space:nowrap}.folder.selected>.folder-title{background:#cfe2ff;font-weight:600}.folder.selected>.folder-title span{font-weight:600}.file.active{background:#cfe2ff;border-radius:4px;font-weight:600}.file{border:1px solid transparent}.file.active{border-color:#b7d3ff}.folder.selected .file.active{background:#cfe2ff}.folder.drag-target>.folder-title,.file.drag-target{background:#e8f0ff}body[data-theme=dark]{background:#1e1e1e;color:#ddd}body[data-theme=dark] .topbar,body[data-theme=dark] .sidebar,body[data-theme=dark] .source textarea{background:#252526;color:#ddd}body[data-theme=dark] .tabs button{background:#333;color:#ddd}
