:root{--bg-sidebar: #1c1c1e;--bg-main: #2c2c2e;--text-primary: #ffffff;--text-secondary: #8e8e93;--accent-color: #dca900;--selected-bg: #3a3a3c;--selected-text: #ffffff;--divider-color: #38383a;--font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--toolbar-bg: #2c2c2e;--toolbar-border: #38383a;--button-hover: #3a3a3c;--button-active: #dca900;--input-bg: #1c1c1e;--input-border: #38383a}*{box-sizing:border-box}body{margin:0;padding:0;font-family:var(--font-family);background-color:var(--bg-main);color:var(--text-primary);height:100vh;overflow:hidden}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#48484a;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#636366}::-webkit-scrollbar-corner{background:transparent}#root{height:100%}.app-container{display:flex;height:100%}.sidebar-container{display:flex;flex-direction:column;width:300px;background-color:var(--bg-sidebar);border-right:1px solid var(--divider-color)}.title-bar{background-color:var(--bg-sidebar);border-bottom:1px solid var(--divider-color);padding:10px 20px;font-weight:600;font-size:14px;color:var(--text-primary);display:flex;align-items:center;justify-content:center;-webkit-app-region:drag}.sidebar{flex:1;background-color:var(--bg-sidebar);display:flex;flex-direction:column}.sidebar-header button{background:none;border:none;color:var(--accent-color);cursor:pointer}.note-list{flex:1;overflow-y:auto}.note-item{padding:12px 20px;border-bottom:1px solid var(--divider-color);cursor:pointer}.note-item:hover{background-color:var(--button-hover)}.note-item.active{background-color:var(--selected-bg)}.note-item.active .note-title,.note-item.active .note-content{color:var(--text-primary)}.note-item.active .note-time,.note-item.active .delete-note-btn{color:var(--text-secondary)}.note-item.active .delete-note-btn:hover{color:#ff453a;background-color:#ff453a1a}.note-title{font-weight:600;font-size:15px;margin-bottom:6px;display:flex;justify-content:space-between;align-items:center;width:100%}.note-title span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-right:10px;flex:1}.note-preview{display:flex;gap:8px;font-size:14px;color:var(--text-secondary)}.note-time{white-space:nowrap}.main-content{flex:1;display:flex;flex-direction:column;background-color:var(--bg-main);height:100%}.editor-container{flex:1;display:flex;flex-direction:column;padding:20px 40px;overflow-y:auto}.editor-header{text-align:center;color:var(--text-secondary);font-size:12px;margin-bottom:20px}.note-title-input{font-size:24px;font-weight:700;border:none;outline:none;margin-bottom:20px;width:100%;background:transparent;color:var(--text-primary)}.no-selection{flex:1;display:flex;align-items:center;justify-content:center;color:var(--text-secondary);padding:20px}.editor-toolbar{display:flex;gap:5px;padding:10px;margin-bottom:10px;border-bottom:1px solid var(--divider-color);position:sticky;top:0;background-color:var(--bg-main);z-index:10}.toolbar-btn{background:transparent;border:none;color:var(--text-secondary);padding:6px;border-radius:4px;cursor:pointer;display:flex;align-items:center;justify-content:center}.toolbar-btn:hover{background-color:var(--button-hover);color:var(--text-primary)}.toolbar-btn.is-active{background-color:var(--button-active);color:#fff}.tiptap-editor{flex:1;outline:none}.tiptap{outline:none!important}.tiptap p.is-editor-empty:first-child:before{color:var(--text-secondary);content:attr(data-placeholder);float:left;height:0;pointer-events:none}.tiptap ul[data-type=taskList]{list-style:none;padding:0}.tiptap a{color:var(--accent-color);text-decoration:underline;cursor:pointer}.tiptap a:visited{color:var(--accent-color)}.tiptap a:hover{opacity:.8}.tiptap ul[data-type=taskList] li{display:flex;align-items:baseline!important;margin-bottom:.2rem}.tiptap ul[data-type=taskList] li>label{flex:0 0 auto;margin-right:.5rem;-webkit-user-select:none;user-select:none;margin-top:0;line-height:inherit;position:relative;top:3px}.tiptap ul[data-type=taskList] li>div{flex:1 1 auto;margin-top:0;padding-top:0;line-height:1.5}.tiptap ul[data-type=taskList] li p{margin:0}.sidebar-bottom{padding:15px;border-top:1px solid var(--divider-color);background-color:var(--bg-sidebar)}.add-folder-btn{width:100%;background-color:var(--button-hover);color:var(--accent-color);padding:10px;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;font-size:14px;font-weight:600;transition:background-color .2s}.add-folder-btn:hover{background-color:var(--button-active);color:#fff}.new-folder-form input{width:100%;padding:8px 10px;border-radius:6px;border:1px solid var(--accent-color);background-color:var(--input-bg);color:var(--text-primary);outline:none}.sidebar-header{padding:15px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--divider-color)}.folders-link{color:var(--accent-color);font-weight:600;display:flex;align-items:center;gap:8px;cursor:pointer;font-size:14px}.folder-list{background-color:var(--bg-sidebar);border-bottom:1px solid var(--divider-color);padding:10px 0}.folder-item{padding:10px 20px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;color:var(--text-primary);font-size:14px}.folder-item:hover{background-color:var(--button-hover)}.folder-item.active{background-color:var(--selected-bg);color:var(--selected-text)}.folder-item.active .folder-name svg{stroke:var(--selected-text)}.folder-name{display:flex;align-items:center;gap:10px}.delete-folder-btn,.delete-note-btn{background:none;border:none;color:var(--text-secondary);cursor:pointer;opacity:0;transition:opacity .2s,color .2s;padding:4px;border-radius:4px;display:flex;align-items:center;justify-content:center}.folder-item:hover .delete-folder-btn,.note-item:hover .delete-note-btn{opacity:1}.delete-folder-btn:hover,.delete-note-btn:hover{color:#ff453a;background-color:#ff453a1a}.note-item{padding:12px 20px;border-bottom:1px solid var(--divider-color);cursor:pointer;position:relative}.note-title{font-weight:600;font-size:15px;margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:20px}.note-preview{display:flex;gap:10px;font-size:13px;color:var(--text-secondary);line-height:1.4}.note-time{white-space:nowrap;min-width:fit-content}.note-content{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.auth-container{display:flex;align-items:center;justify-content:center;height:100vh;background-color:var(--bg-sidebar)}.auth-box{background:var(--bg-main);padding:40px;border-radius:12px;box-shadow:0 4px 12px #0000004d;width:300px;text-align:center;color:var(--text-primary)}.auth-box h2{color:var(--text-primary)}.auth-box form{display:flex;flex-direction:column;gap:15px}.auth-box input{padding:10px;border:1px solid var(--input-border);border-radius:8px;font-size:16px;background-color:var(--input-bg);color:var(--text-primary)}.auth-box button{padding:10px;background-color:var(--accent-color);color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer}.toggle-auth{margin-top:20px;color:var(--accent-color);cursor:pointer;font-size:14px}.error{color:#ff453a;margin-bottom:10px;font-size:14px}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background-color:var(--bg-main);padding:24px;border-radius:12px;width:90%;max-width:400px;box-shadow:0 4px 20px #00000080;border:1px solid var(--divider-color);text-align:center}.modal-content h3{margin-top:0;margin-bottom:12px;color:var(--text-primary)}.modal-content p{color:var(--text-secondary);margin-bottom:24px;line-height:1.5}.modal-actions{display:flex;gap:12px;justify-content:center}.modal-btn{padding:10px 20px;border-radius:6px;border:none;font-size:14px;font-weight:600;cursor:pointer;flex:1;transition:opacity .2s}.modal-btn:hover{opacity:.9}.modal-btn.cancel{background-color:var(--button-hover);color:var(--text-primary)}.modal-btn.confirm{background-color:#ff453a;color:#fff}.admin-panel{flex:1;display:flex;flex-direction:column;background-color:var(--bg-main);color:var(--text-primary);padding:20px}.admin-header{display:flex;align-items:center;gap:20px;margin-bottom:30px;border-bottom:1px solid var(--divider-color);padding-bottom:20px}.back-btn{background:none;border:none;color:var(--accent-color);cursor:pointer;display:flex;align-items:center;gap:8px;font-size:16px;font-weight:600}.admin-content{display:flex;gap:40px;max-width:1000px;margin:0 auto;width:100%}.admin-section{flex:1;background-color:var(--bg-sidebar);padding:24px;border-radius:12px;border:1px solid var(--divider-color)}.create-user-section h3,.user-list-section h3{margin-top:0;border-bottom:1px solid var(--divider-color);padding-bottom:12px;margin-bottom:20px}.admin-form{display:flex;flex-direction:column;gap:15px}.admin-form input{padding:10px;background-color:var(--input-bg);border:1px solid var(--input-border);color:var(--text-primary);border-radius:6px}.create-btn{background-color:var(--accent-color);color:#fff;padding:10px;border:none;border-radius:6px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;font-weight:600}.user-list{display:flex;flex-direction:column}.user-list-header{display:grid;grid-template-columns:1fr 100px 100px;padding:10px;font-weight:600;color:var(--text-secondary);border-bottom:1px solid var(--divider-color)}.user-row{display:grid;grid-template-columns:1fr 100px 100px;padding:12px 10px;border-bottom:1px solid var(--divider-color);align-items:center}.user-row:last-child{border-bottom:none}.role-badge{padding:2px 8px;border-radius:10px;font-size:12px;text-transform:capitalize;text-align:center;width:fit-content}.role-badge.superadmin{background-color:#dca90033;color:var(--accent-color)}.role-badge.user{background-color:#8e8e9333;color:var(--text-secondary)}.error-msg{color:#ff453a;background-color:#ff453a1a;padding:10px;border-radius:6px;margin-bottom:15px}.success-msg{color:#30d158;background-color:#30d1581a;padding:10px;border-radius:6px;margin-bottom:15px}@media (max-width: 768px){.app-container{flex-direction:column;position:relative}.sidebar-container{position:fixed;top:0;left:0;width:85%;max-width:320px;height:100%;z-index:1000;transform:translate(-100%);transition:transform .3s ease}.sidebar-container.open{transform:translate(0)}.sidebar-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);z-index:999;opacity:0;visibility:hidden;transition:opacity .3s ease}.sidebar-overlay.open{opacity:1;visibility:visible}.main-content{width:100%;height:100vh}.mobile-header{display:flex;align-items:center;padding:12px 16px;background-color:var(--bg-sidebar);border-bottom:1px solid var(--divider-color);gap:12px}.menu-toggle{background:none;border:none;color:var(--text-primary);cursor:pointer;padding:8px;display:flex;align-items:center;justify-content:center}.mobile-header h1{margin:0;font-size:18px;font-weight:600;color:var(--text-primary)}.editor-container{padding:16px}.editor-toolbar{flex-wrap:wrap;gap:4px}.no-selection{padding:20px;text-align:center}.admin-content{flex-direction:column;gap:20px}.admin-header{flex-direction:column;align-items:flex-start;gap:10px}.user-list-header,.user-row{grid-template-columns:1fr 80px 80px;font-size:12px}.auth-box{width:90%;max-width:300px;padding:30px 20px}.mobile-header{display:flex!important}}.mobile-header{display:none}@media (min-width: 769px){.sidebar-overlay{display:none}}