@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&family=Outfit:wght@300;400;500;600;700&display=swap";:root{--glass-blur:16px;--transition-speed:.3s}body,body.theme-light{--bg-gradient:linear-gradient(135deg, #f5f7fa 0%, #e4e8f0 100%);--bg-color:#f5f7fa;--card-bg:#ffffff8c;--card-bg-solid:#fff;--card-border:#ffffff73;--text-primary:#2d3748;--text-secondary:#718096;--accent-color:#5a67d8;--accent-hover:#4c51bf;--accent-light:#5a67d814;--input-bg:#ffffffb3;--input-border:#e2e8f0cc;--shadow-color:#1f26870f;--scroll-thumb:#5a67d866;--scroll-track:#ffffff1a;--sidebar-bg:#fff6;--sidebar-active:#5a67d81f;--tag-bg:#5a67d81a;--tag-text:#4c51bf;--code-bg:#f7fafc}body.theme-fresh-blue{--bg-gradient:linear-gradient(135deg, #e0f2fe 0%, #bae6fd 100%);--bg-color:#e0f2fe;--card-bg:#ffffff80;--card-bg-solid:#f0f9ff;--card-border:#ffffff80;--text-primary:#0f172a;--text-secondary:#475569;--accent-color:#0284c7;--accent-hover:#0369a1;--accent-light:#0284c714;--input-bg:#ffffffbf;--input-border:#bae6fd99;--shadow-color:#0f172a0d;--scroll-thumb:#0284c766;--scroll-track:#ffffff1a;--sidebar-bg:#ffffff59;--sidebar-active:#0284c71a;--tag-bg:#0284c71a;--tag-text:#0369a1;--code-bg:#f8fafc}body.theme-matcha-light{--bg-gradient:linear-gradient(135deg, #f0fdf4 0%, #dcfce7 100%);--bg-color:#f0fdf4;--card-bg:#fff9;--card-bg-solid:#f0fdf4;--card-border:#fff9;--text-primary:#14532d;--text-secondary:#3f6212;--accent-color:#16a34a;--accent-hover:#15803d;--accent-light:#16a34a14;--input-bg:#fffc;--input-border:#bbf7d099;--shadow-color:#14532d0a;--scroll-thumb:#16a34a66;--scroll-track:#ffffff1a;--sidebar-bg:#fff6;--sidebar-active:#16a34a1a;--tag-bg:#16a34a1a;--tag-text:#15803d;--code-bg:#f4fbf7}body.theme-sakura-pink{--bg-gradient:linear-gradient(135deg, #fff1f2 0%, #ffe4e6 100%);--bg-color:#fff1f2;--card-bg:#ffffff8c;--card-bg-solid:#fff5f5;--card-border:#ffffff8c;--text-primary:#4c1130;--text-secondary:#8c2d58;--accent-color:#db2777;--accent-hover:#be185d;--accent-light:#db277714;--input-bg:#fffc;--input-border:#fedae0cc;--shadow-color:#4c11300a;--scroll-thumb:#db277766;--scroll-track:#ffffff1a;--sidebar-bg:#fff6;--sidebar-active:#db27771a;--tag-bg:#db27771a;--tag-text:#be185d;--code-bg:#fffbfb}body.theme-nordic-slate{--bg-gradient:linear-gradient(135deg, #1e293b 0%, #0f172a 100%);--bg-color:#0f172a;--card-bg:#1e293b99;--card-bg-solid:#1e293b;--card-border:#ffffff14;--text-primary:#f1f5f9;--text-secondary:#94a3b8;--accent-color:#38bdf8;--accent-hover:#0ea5e9;--accent-light:#38bdf81f;--input-bg:#0f172a80;--input-border:#ffffff14;--shadow-color:#00000040;--scroll-thumb:#38bdf866;--scroll-track:#0f172a4d;--sidebar-bg:#0f172a40;--sidebar-active:#38bdf826;--tag-bg:#38bdf826;--tag-text:#38bdf8;--code-bg:#0f172a}*{box-sizing:border-box;margin:0;padding:0}body{color:var(--text-primary);background:var(--bg-gradient);background-color:var(--bg-color);min-height:100svh;transition:background var(--transition-speed) ease, color var(--transition-speed) ease;background-attachment:fixed;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;line-height:1.5;overflow-x:hidden}#root{flex-direction:column;min-height:100svh;display:flex}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--scroll-track);border-radius:999px}::-webkit-scrollbar-thumb{background:var(--scroll-thumb);transition:background var(--transition-speed) ease;background-clip:padding-box;border:2px solid #0000;border-radius:999px}::-webkit-scrollbar-thumb:hover{background-color:var(--accent-hover);background-clip:padding-box;border:2px solid #0000}button,input,textarea,select{font-family:inherit;font-size:inherit;color:inherit}a{color:var(--accent-color);transition:color var(--transition-speed) ease;text-decoration:none}a:hover{color:var(--accent-hover)}.app-container{width:100vw;height:100vh;display:flex;position:relative;overflow:hidden}.glass-panel{background:var(--card-bg);-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--card-border);box-shadow:0 8px 32px 0 var(--shadow-color);transition:all var(--transition-speed) ease}.glass-card{background:var(--card-bg);-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--card-border);box-shadow:0 4px 16px 0 var(--shadow-color);transition:all var(--transition-speed) cubic-bezier(.4, 0, .2, 1);border-radius:16px}.glass-btn{border:1px solid var(--card-border);cursor:pointer;color:var(--text-primary);background:#ffffff26;border-radius:8px;justify-content:center;align-items:center;padding:8px 16px;font-weight:500;transition:all .2s;display:inline-flex}.glass-btn:hover{background:var(--accent-light);border-color:var(--accent-color);transform:translateY(-1px)}.glass-btn:active{transform:translateY(0)}.glass-btn.primary{background:var(--accent-color);color:#fff;border-color:var(--accent-color)}.glass-btn.primary:hover{background:var(--accent-hover);box-shadow:0 0 12px var(--accent-color)}.glass-input{background:var(--input-bg);border:1px solid var(--input-border);width:100%;color:var(--text-primary);border-radius:8px;outline:none;padding:10px 14px;transition:all .2s}.glass-input::placeholder{color:var(--text-secondary);opacity:.7}.glass-input:focus{border-color:var(--accent-color);box-shadow:0 0 0 3px var(--accent-light)}.folder-sidebar{background:var(--sidebar-bg);border-right:1px solid var(--card-border);z-index:10;width:280px;height:100%;transition:transform var(--transition-speed) cubic-bezier(.4, 0, .2, 1), width var(--transition-speed) cubic-bezier(.4, 0, .2, 1), opacity var(--transition-speed) cubic-bezier(.4, 0, .2, 1);flex-direction:column;flex-shrink:0;display:flex}.sidebar-collapsed .folder-sidebar{opacity:0;pointer-events:none;width:0;transform:translate(-100%)}.sidebar-header{border-bottom:1px solid var(--card-border);justify-content:space-between;align-items:center;padding:20px;display:flex}.sidebar-brand{letter-spacing:-.5px;background:linear-gradient(45deg, var(--text-primary), var(--accent-color));-webkit-text-fill-color:transparent;-webkit-background-clip:text;align-items:center;gap:8px;font-family:Outfit,sans-serif;font-size:20px;font-weight:700;display:flex}.sidebar-content{flex-direction:column;flex:1;gap:20px;padding:16px 12px;display:flex;overflow-y:auto}.sidebar-section-title{text-transform:uppercase;letter-spacing:1.5px;color:var(--text-secondary);margin-bottom:8px;padding-left:8px;font-size:11px;font-weight:700}.sidebar-menu{flex-direction:column;gap:4px;display:flex}.sidebar-menu-item{cursor:pointer;border-radius:8px;justify-content:space-between;align-items:center;padding:10px 12px;font-size:14px;font-weight:500;transition:all .2s;display:flex}.sidebar-menu-item:hover{color:var(--accent-color);background:#ffffff26}.sidebar-menu-item.active{background:var(--sidebar-active);color:var(--accent-color)}.sidebar-item-left{align-items:center;gap:10px;display:flex}.sidebar-item-count{color:var(--text-secondary);background:#0000000d;border-radius:10px;padding:2px 6px;font-family:Outfit,sans-serif;font-size:11px}.sidebar-menu-item.active .sidebar-item-count{background:var(--tag-bg);color:var(--tag-text)}.new-folder-form{gap:6px;margin-top:8px;padding:0 4px;display:flex}.sidebar-footer{border-top:1px solid var(--card-border);gap:8px;padding:16px;display:flex}.main-content{flex-direction:column;flex:1;height:100%;display:flex;position:relative;overflow:hidden}.main-header{border-bottom:1px solid var(--card-border);background:#ffffff0d;justify-content:space-between;align-items:center;height:64px;padding:0 24px;display:flex}.header-left{align-items:center;gap:16px;display:flex}.toggle-sidebar-btn{color:var(--text-secondary);border-radius:8px;padding:8px}.toggle-sidebar-btn:hover{color:var(--accent-color);background:var(--accent-light)}.search-box{width:280px;position:relative}.search-box svg{color:var(--text-secondary);pointer-events:none;position:absolute;top:50%;left:12px;transform:translateY(-50%)}.search-box .glass-input{padding-top:8px;padding-bottom:8px;padding-left:36px}.header-right{align-items:center;gap:12px;display:flex}.notes-container{flex:1;padding:24px;overflow-y:auto}.notes-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;display:grid}.note-card{cursor:pointer;border:1px solid var(--card-border);flex-direction:column;height:200px;padding:20px;display:flex;position:relative}.note-card:hover{box-shadow:0 12px 24px var(--shadow-color);border-color:var(--accent-color);transform:translateY(-4px)}.note-card-pin{color:var(--accent-color);opacity:.3;transition:opacity .2s;position:absolute;top:16px;right:16px}.note-card.pinned .note-card-pin{opacity:1}.note-card:hover .note-card-pin{opacity:.8}.note-card-title{white-space:nowrap;text-overflow:ellipsis;color:var(--text-primary);margin-bottom:10px;padding-right:20px;font-size:18px;font-weight:600;overflow:hidden}.note-card-excerpt{color:var(--text-secondary);-webkit-line-clamp:4;text-overflow:ellipsis;-webkit-box-orient:vertical;flex:1;margin-bottom:12px;font-size:14px;line-height:1.6;display:-webkit-box;overflow:hidden}.note-card-footer{color:var(--text-secondary);justify-content:space-between;align-items:center;margin-top:auto;font-size:12px;display:flex}.note-card-date{font-family:Outfit,sans-serif}.note-card-actions{opacity:0;gap:8px;transition:opacity .2s;display:flex}.note-card:hover .note-card-actions{opacity:1}.note-action-btn{cursor:pointer;color:var(--text-secondary);background:0 0;border:none;border-radius:4px;align-items:center;padding:4px;display:inline-flex}.note-action-btn:hover{color:var(--accent-color);background:var(--accent-light)}.note-action-btn.delete:hover{color:#ef4444;background:#ef44441a}.note-card-tags{flex-wrap:wrap;gap:4px;display:flex}.note-card-tag{background:var(--tag-bg);color:var(--tag-text);border-radius:4px;padding:2px 6px;font-size:10px}.editor-container{background:#ffffff05;flex-direction:column;flex:1;display:flex;overflow:hidden}.editor-toolbar{border-bottom:1px solid var(--card-border);background:#ffffff0d;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding:10px 20px;display:flex}.toolbar-group{align-items:center;gap:6px;display:flex}.toolbar-btn{cursor:pointer;color:var(--text-primary);background:0 0;border:none;border-radius:6px;justify-content:center;align-items:center;padding:6px;transition:all .2s;display:flex}.toolbar-btn:hover{background:var(--accent-light);color:var(--accent-color)}.toolbar-divider{background:var(--card-border);width:1px;height:20px;margin:0 4px}.save-indicator{color:var(--text-secondary);align-items:center;gap:6px;font-size:12px;display:flex}.save-indicator svg{color:#10b981}.editor-workspace{flex:1;display:flex;overflow:hidden}.editor-pane{border-right:1px solid var(--card-border);flex-direction:column;flex:1;height:100%;display:flex;position:relative}.editor-title-input{width:100%;color:var(--text-primary);background:0 0;border:none;border-bottom:1px solid #0000;outline:none;padding:20px 24px 10px;font-size:24px;font-weight:700}.editor-tags-bar{flex-wrap:wrap;align-items:center;gap:8px;padding:0 24px 10px;display:flex}.editor-tag-input{color:var(--text-primary);background:0 0;border:none;outline:none;width:120px;padding:2px 4px;font-size:13px}.editor-textarea{resize:none;width:100%;font-family:var(--code-bg) ? Consolas, Monaco, monospace : inherit;color:var(--text-primary);background:0 0;border:none;outline:none;flex:1;padding:10px 24px 24px;font-size:16px;line-height:1.7;overflow-y:auto}.preview-pane{background:#ffffff03;flex:1;height:100%;padding:24px;overflow-y:auto}.preview-content{color:var(--text-primary);font-size:16px;line-height:1.8}.preview-content h1,.preview-content h2,.preview-content h3,.preview-content h4{color:var(--text-primary);margin-top:24px;margin-bottom:12px;font-weight:600}.preview-content h1{border-bottom:1px solid var(--card-border);padding-bottom:8px;font-size:1.8em}.preview-content h2{border-bottom:1px solid #ffffff0d;padding-bottom:6px;font-size:1.5em}.preview-content h3{font-size:1.25em}.preview-content p{margin-bottom:16px}.preview-content ul,.preview-content ol{margin-bottom:16px;margin-left:20px}.preview-content li{margin-bottom:6px}.preview-content pre{background:var(--code-bg);border:1px solid var(--card-border);border-radius:8px;margin-bottom:16px;padding:16px;overflow-x:auto}.preview-content code{background:var(--code-bg);color:var(--accent-color);border-radius:4px;padding:2px 6px;font-family:Consolas,Monaco,monospace;font-size:.9em}.preview-content pre code{color:inherit;font-size:inherit;background:0 0;padding:0}.preview-content blockquote{border-left:4px solid var(--accent-color);color:var(--text-secondary);background:#ffffff05;border-radius:0 4px 4px 0;margin-bottom:16px;padding:8px 16px}.preview-content img{border-radius:8px;max-width:100%;margin:12px 0;box-shadow:0 4px 12px #0000001a}.preview-content table{border-collapse:collapse;width:100%;margin-bottom:16px}.preview-content th,.preview-content td{border:1px solid var(--card-border);padding:8px 12px}.preview-content th{background:#0000000d}.modal-overlay{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:100;background:#0006;justify-content:center;align-items:center;width:100vw;height:100vh;animation:.2s fadeIn;display:flex;position:fixed;top:0;left:0}.modal-content{border-radius:20px;width:480px;max-width:90%;padding:28px;animation:.3s cubic-bezier(.34,1.56,.64,1) slideUp;position:relative}.modal-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.modal-title{font-size:20px;font-weight:700}.modal-close-btn{cursor:pointer;color:var(--text-secondary);background:0 0;border:none;border-radius:50%;align-items:center;padding:4px;transition:background .2s;display:flex}.modal-close-btn:hover{color:var(--text-primary);background:#0000000d}.modal-body{flex-direction:column;gap:20px;display:flex}.setting-row{flex-direction:column;gap:8px;display:flex}.setting-label{color:var(--text-primary);font-size:14px;font-weight:600}.setting-desc{color:var(--text-secondary);font-size:12px}.theme-circles{gap:12px;margin-top:4px;display:flex}.theme-circle-wrapper{cursor:pointer;flex-direction:column;align-items:center;gap:6px;display:flex}.theme-circle{border:2px solid #0000;border-radius:50%;width:32px;height:32px;transition:all .2s;position:relative;box-shadow:0 4px 8px #0000001a}.theme-circle.active{border-color:var(--accent-color);transform:scale(1.1)}.theme-circle-wrapper span{color:var(--text-secondary);font-size:11px}.theme-light-circle{background:linear-gradient(135deg,#fff 50%,#5a67d8 50%)}.theme-blue-circle{background:linear-gradient(135deg,#e0f2fe 50%,#0284c7 50%)}.theme-green-circle{background:linear-gradient(135deg,#f0fdf4 50%,#16a34a 50%)}.theme-pink-circle{background:linear-gradient(135deg,#fff1f2 50%,#db2777 50%)}.theme-slate-circle{background:linear-gradient(135deg,#1e293b 50%,#38bdf8 50%)}.backup-actions{gap:12px;margin-top:6px;display:flex}.backup-actions .glass-btn{flex:1}.lock-screen{background:var(--bg-gradient);z-index:1000;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.lock-card{text-align:center;border-radius:24px;flex-direction:column;align-items:center;gap:20px;width:360px;padding:36px;display:flex;box-shadow:0 16px 40px #0000001a}.lock-icon-container{background:var(--accent-light);width:64px;height:64px;color:var(--accent-color);border-radius:50%;justify-content:center;align-items:center;display:flex}.lock-title{color:var(--text-primary);font-size:20px;font-weight:700}.lock-form{flex-direction:column;gap:12px;width:100%;display:flex}.toast-container{z-index:9999;flex-direction:column;gap:10px;display:flex;position:fixed;bottom:24px;right:24px}.toast-item{color:var(--text-primary);border-radius:12px;align-items:center;gap:10px;padding:12px 20px;font-size:14px;font-weight:500;animation:.3s cubic-bezier(.175,.885,.32,1.275) slideInRight;display:flex;box-shadow:0 8px 24px #0000001a}.toast-item.success svg{color:#10b981}.toast-item.error svg{color:#ef4444}.toast-item.info svg{color:var(--accent-color)}.empty-state{height:100%;color:var(--text-secondary);flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex}.empty-state svg{opacity:.5}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRight{0%{opacity:0;transform:translate(100%)}to{opacity:1;transform:translate(0)}}@media (width<=768px){.folder-sidebar{width:260px;position:absolute;top:0;bottom:0;left:0;transform:translate(-100%)}.app-container.sidebar-open .folder-sidebar{transform:translate(0);box-shadow:0 0 40px #0000004d}.editor-workspace{flex-direction:column}.editor-pane{border-right:none;border-bottom:1px solid var(--card-border);flex:none;height:50%}.preview-pane{flex:none;height:50%}.search-box{width:160px}}.ckeditor-workspace-wrapper .ck.ck-editor{flex-direction:column;flex:1;height:100%;display:flex;overflow:hidden}.ckeditor-workspace-wrapper .ck.ck-editor__main{flex-direction:column;flex:1;display:flex;overflow:hidden}.ckeditor-workspace-wrapper .ck-content.ck-editor__editable{min-height:250px;transition:background var(--transition-speed), border-color var(--transition-speed), color var(--transition-speed);flex:1;font-family:inherit;font-size:16px;line-height:1.8;overflow-y:auto;background:var(--card-bg)!important;-webkit-backdrop-filter:blur(var(--glass-blur))!important;color:var(--text-primary)!important;border:1px solid var(--card-border)!important;border-top:none!important;border-bottom-right-radius:12px!important;border-bottom-left-radius:12px!important;padding:20px 24px!important}.ckeditor-workspace-wrapper .ck.ck-editor__top .ck-toolbar{transition:background var(--transition-speed), border-color var(--transition-speed);background:var(--sidebar-bg)!important;-webkit-backdrop-filter:blur(var(--glass-blur))!important;border:1px solid var(--card-border)!important;border-top-left-radius:12px!important;border-top-right-radius:12px!important;padding:6px 12px!important}.ckeditor-workspace-wrapper .ck.ck-toolbar .ck-button{color:var(--text-primary)!important;cursor:pointer!important;border-radius:6px!important;transition:all .2s!important}.ckeditor-workspace-wrapper .ck.ck-toolbar .ck-button:hover{background:var(--accent-light)!important;color:var(--accent-color)!important}.ckeditor-workspace-wrapper .ck.ck-toolbar .ck-button.ck-on{background:var(--sidebar-active)!important;color:var(--accent-color)!important}.ckeditor-workspace-wrapper .ck.ck-toolbar__separator{background:var(--card-border)!important}.ckeditor-workspace-wrapper .ck.ck-toolbar .ck-button .ck-icon{color:inherit!important}.ckeditor-workspace-wrapper .ck-content.ck-editor__editable.ck-focused{border-color:var(--accent-color)!important;box-shadow:0 0 0 3px var(--accent-light)!important;outline:none!important}.ck.ck-dropdown__panel{background:var(--card-bg-solid)!important;border:1px solid var(--card-border)!important;box-shadow:0 8px 32px 0 var(--shadow-color)!important}.ck.ck-list__item .ck-button{color:var(--text-primary)!important;background:0 0!important}.ck.ck-list__item .ck-button:hover{background:var(--accent-light)!important;color:var(--accent-color)!important}.ck.ck-list__item .ck-button.ck-on{background:var(--sidebar-active)!important;color:var(--accent-color)!important}