*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}:root{--font-display: "Noto Serif SC", serif;--font-body: "Outfit", sans-serif;--font-mono: "JetBrains Mono", monospace}[data-theme=light]{--bg-primary: #faf9f7;--bg-secondary: #f0eeea;--bg-card: #ffffff;--bg-sidebar: #1a1a1e;--bg-input: #f5f4f1;--text-primary: #1a1a1e;--text-secondary: #6b6966;--text-muted: #a09d98;--text-sidebar: #e8e6e1;--text-sidebar-muted: #8a8884;--border: #e5e3de;--accent: #c45d3e;--accent-hover: #a84d32;--accent-light: #fdf0ec;--shadow-sm: 0 1px 3px rgba(0,0,0,.06);--shadow-md: 0 4px 16px rgba(0,0,0,.08);--shadow-lg: 0 12px 40px rgba(0,0,0,.12);--success: #3a8a5c;--danger: #c44d3e}[data-theme=dark]{--bg-primary: #111113;--bg-secondary: #1a1a1e;--bg-card: #1e1e22;--bg-sidebar: #0d0d0f;--bg-input: #252528;--text-primary: #e8e6e1;--text-secondary: #9a9894;--text-muted: #5a5855;--text-sidebar: #e8e6e1;--text-sidebar-muted: #5a5855;--border: #2a2a2e;--accent: #e07052;--accent-hover: #c45d3e;--accent-light: #2a1f1c;--shadow-sm: 0 1px 3px rgba(0,0,0,.2);--shadow-md: 0 4px 16px rgba(0,0,0,.3);--shadow-lg: 0 12px 40px rgba(0,0,0,.4);--success: #4aaa6c;--danger: #e05a4a}html{font-size:16px}body{font-family:var(--font-body);background:var(--bg-primary);color:var(--text-primary);line-height:1.6;overflow:hidden;height:100vh}.hidden{display:none!important}.auth-screen{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;z-index:1000}.auth-bg{position:absolute;top:0;right:0;bottom:0;left:0;background:#0e0e10;overflow:hidden}.auth-grain{position:absolute;top:0;right:0;bottom:0;left:0;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='0.4'/%3E%3C/svg%3E");opacity:.15}.auth-orb{position:absolute;border-radius:50%;filter:blur(80px);animation:orbFloat 12s ease-in-out infinite}.auth-orb-1{width:400px;height:400px;background:#c45d3e33;top:-10%;left:-5%;animation-delay:0s}.auth-orb-2{width:300px;height:300px;background:#3e6dc433;bottom:-10%;right:-5%;animation-delay:-4s}.auth-orb-3{width:200px;height:200px;background:#c4a13e22;top:50%;left:50%;animation-delay:-8s}@keyframes orbFloat{0%,to{transform:translate(0) scale(1)}33%{transform:translate(30px,-20px) scale(1.05)}66%{transform:translate(-20px,15px) scale(.95)}}.auth-card{position:relative;background:#1a1a1e;border:1px solid #2a2a2e;border-radius:20px;padding:48px 40px;width:400px;max-width:92vw;box-shadow:0 24px 80px #00000080;animation:cardIn .6s cubic-bezier(.16,1,.3,1) both}@keyframes cardIn{0%{opacity:0;transform:translateY(20px) scale(.96)}}.auth-brand{text-align:center;margin-bottom:36px}.auth-logo{display:inline-block;color:#e07052;margin-bottom:12px}.auth-logo svg{width:48px;height:48px}.auth-brand h1{font-family:var(--font-display);font-size:2rem;color:#e8e6e1;font-weight:700;letter-spacing:.08em}.auth-subtitle{color:#6b6966;font-size:.9rem;margin-top:4px}.auth-tabs{display:flex;position:relative;background:#111113;border-radius:10px;padding:4px;margin-bottom:24px}.auth-tab{flex:1;background:none;border:none;color:#6b6966;font-family:var(--font-body);font-size:.9rem;font-weight:500;padding:10px;cursor:pointer;position:relative;z-index:1;transition:color .3s}.auth-tab.active{color:#e8e6e1}.auth-tab-indicator{position:absolute;top:4px;left:4px;width:calc(50% - 4px);height:calc(100% - 8px);background:#2a2a2e;border-radius:8px;transition:transform .3s cubic-bezier(.16,1,.3,1)}.auth-tabs[data-active=register] .auth-tab-indicator{transform:translate(100%)}.field-group{margin-bottom:16px}.field-group label{display:block;font-size:.8rem;color:#6b6966;margin-bottom:6px;font-weight:500;letter-spacing:.02em}.field-group input{width:100%;background:#111113;border:1px solid #2a2a2e;border-radius:10px;padding:12px 16px;color:#e8e6e1;font-family:var(--font-body);font-size:.95rem;transition:border-color .2s,box-shadow .2s;outline:none}.field-group input:focus{border-color:#e07052;box-shadow:0 0 0 3px #e0705218}.field-group input::placeholder{color:#3a3a3e}.auth-submit{width:100%;background:#c45d3e;color:#fff;border:none;border-radius:10px;padding:13px;font-family:var(--font-body);font-size:.95rem;font-weight:600;cursor:pointer;margin-top:8px;transition:background .2s,transform .1s}.auth-submit:hover{background:#a84d32}.auth-submit:active{transform:scale(.98)}.auth-error{color:#e05a4a;font-size:.85rem;text-align:center;margin-top:12px;min-height:20px}.app{display:flex;height:100vh;animation:fadeIn .4s ease both}@keyframes fadeIn{0%{opacity:0}}.sidebar{width:240px;min-width:240px;background:var(--bg-sidebar);display:flex;flex-direction:column;border-right:1px solid #2a2a2e;transition:transform .3s cubic-bezier(.16,1,.3,1);z-index:100}.sidebar-header{padding:20px;display:flex;align-items:center;justify-content:space-between}.sidebar-brand{display:flex;align-items:center;gap:10px;color:var(--text-sidebar);font-family:var(--font-display);font-weight:700;font-size:1.15rem;letter-spacing:.05em}.theme-toggle{background:none;border:1px solid #2a2a2e;border-radius:8px;padding:6px;cursor:pointer;color:var(--text-sidebar-muted);transition:color .2s,border-color .2s;display:flex;align-items:center}.theme-toggle:hover{color:var(--text-sidebar);border-color:#4a4a4e}.theme-toggle svg{width:18px;height:18px}[data-theme=light] .icon-moon,[data-theme=dark] .icon-sun{display:none}.sidebar-nav{flex:1;padding:8px 12px}.nav-item{display:flex;align-items:center;gap:10px;width:100%;background:none;border:none;color:var(--text-sidebar-muted);padding:11px 14px;border-radius:10px;font-family:var(--font-body);font-size:.9rem;font-weight:500;cursor:pointer;transition:all .2s;margin-bottom:4px}.nav-item svg{width:19px;height:19px;flex-shrink:0}.nav-item:hover{color:var(--text-sidebar);background:#ffffff0a}.nav-item.active{color:var(--text-sidebar);background:#ffffff12}.sidebar-user{padding:16px 20px;display:flex;align-items:center;gap:10px;border-top:1px solid #2a2a2e}.user-avatar{width:32px;height:32px;border-radius:8px;background:linear-gradient(135deg,#c45d3e,#e0a050);display:flex;align-items:center;justify-content:center;font-size:.8rem;font-weight:700;color:#fff}.user-name{flex:1;color:var(--text-sidebar);font-size:.85rem;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.logout-btn{background:none;border:none;color:var(--text-sidebar-muted);cursor:pointer;padding:4px;transition:color .2s}.logout-btn:hover{color:var(--danger)}.logout-btn svg{width:18px;height:18px}.mobile-header{display:none;align-items:center;gap:12px;padding:12px 16px;background:var(--bg-sidebar);color:var(--text-sidebar);position:sticky;top:0;z-index:50}.menu-toggle{background:none;border:none;color:inherit;cursor:pointer;padding:4px}.menu-toggle svg{width:22px;height:22px}.mobile-title{font-family:var(--font-display);font-weight:700;font-size:1.1rem}.overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:90}@media (max-width: 768px){.mobile-header{display:flex}.sidebar{position:fixed;top:0;left:0;bottom:0;transform:translate(-100%);z-index:100;pointer-events:none}.sidebar.open{transform:translate(0);pointer-events:auto}.app{flex-direction:column}#sidebar-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;z-index:90}}.main-content{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}.notes-toolbar{padding:16px 24px;display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--border);flex-wrap:wrap}.search-bar{display:flex;align-items:center;gap:8px;background:var(--bg-input);border:1px solid var(--border);border-radius:10px;padding:8px 14px;flex:1;min-width:180px}.search-bar svg{width:18px;height:18px;color:var(--text-muted);flex-shrink:0}.search-bar input{background:none;border:none;outline:none;color:var(--text-primary);font-family:var(--font-body);font-size:.9rem;width:100%}.search-bar input::placeholder{color:var(--text-muted)}.date-filters{display:flex;align-items:center;gap:8px}.date-filters input[type=date]{background:var(--bg-input);border:1px solid var(--border);border-radius:8px;padding:7px 10px;color:var(--text-primary);font-family:var(--font-body);font-size:.82rem;outline:none}.date-filters input[type=date]:focus{border-color:var(--accent)}.date-sep{color:var(--text-muted);font-size:.8rem}.btn-new-note{display:flex;align-items:center;gap:6px;background:var(--accent);color:#fff;border:none;border-radius:10px;padding:9px 18px;font-family:var(--font-body);font-size:.88rem;font-weight:600;cursor:pointer;transition:background .2s,transform .1s;white-space:nowrap}.btn-new-note svg{width:18px;height:18px}.btn-new-note:hover{background:var(--accent-hover)}.btn-new-note:active{transform:scale(.97)}.notes-layout{flex:1;display:flex;overflow:hidden}.notes-list{width:340px;min-width:260px;border-right:1px solid var(--border);overflow-y:auto;padding:8px}.note-card{padding:14px 16px;border-radius:10px;cursor:pointer;transition:all .15s;margin-bottom:4px;border:1px solid transparent}.note-card:hover{background:var(--bg-secondary)}.note-card.active{background:var(--accent-light);border-color:var(--accent)}.note-card-title{font-weight:600;font-size:.92rem;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.note-card-excerpt{color:var(--text-secondary);font-size:.82rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;line-height:1.5}.note-card-date{color:var(--text-muted);font-size:.75rem;margin-top:8px}.note-card-meta{display:flex;justify-content:space-between;align-items:center;margin-top:8px;font-size:.75rem}.note-card-author{color:var(--accent);font-weight:500}.shared-card .note-card-title{color:var(--text-primary)}.shared-header{padding:24px;border-bottom:1px solid var(--border)}.shared-header h2{font-family:var(--font-display);font-size:1.5rem;font-weight:700;margin-bottom:4px}.shared-subtitle{color:var(--text-muted);font-size:.9rem}.shared-container{flex:1;display:flex;overflow:hidden}.shared-viewer{flex:1;display:flex;flex-direction:column;overflow:hidden;padding:24px}.shared-viewer-header{display:flex;align-items:center;gap:12px;margin-bottom:16px}.shared-viewer-header .btn-back{background:none;border:none;color:var(--text-muted);cursor:pointer;padding:4px}.shared-viewer-header .btn-back:hover{color:var(--text-primary)}.shared-author{color:var(--accent);font-size:.85rem;font-weight:500}.shared-title{font-family:var(--font-display);font-size:1.8rem;font-weight:700;margin-bottom:20px;color:var(--text-primary)}.shared-content{flex:1;overflow-y:auto;color:var(--text-secondary);line-height:1.8;padding:0 24px 24px}.shared-content h1,.shared-content h2,.shared-content h3{font-family:var(--font-display);font-weight:700;color:var(--text-primary);margin:1.2em 0 .6em;line-height:1.3}.shared-content h1{font-size:1.6rem}.shared-content h2{font-size:1.3rem}.shared-content h3{font-size:1.1rem}.shared-content p{margin-bottom:.8em}.shared-content code{background:var(--bg-secondary);padding:2px 6px;border-radius:4px;font-family:var(--font-mono);font-size:.88em}.shared-content pre{background:#1e1e1e;border-radius:8px;padding:16px;overflow-x:auto;margin:1em 0}.shared-content pre code{background:none;padding:0;color:#e8e6e1}.shared-content img{max-width:100%;border-radius:8px;margin:.5em 0}.shared-content blockquote{border-left:4px solid var(--accent);padding-left:16px;margin:1em 0;color:var(--text-muted);font-style:italic}.shared-content ul,.shared-content ol{padding-left:1.5em;margin-bottom:.8em}.shared-content a{color:var(--accent);text-decoration:underline}.shared-content table{border-collapse:collapse;width:100%;margin:1em 0}.shared-content th,.shared-content td{border:1px solid var(--border);padding:8px 12px;text-align:left}.shared-content th{background:var(--bg-secondary);font-weight:600}.btn-toggle-public{font-size:.75rem;padding:6px 10px;border-radius:6px;transition:all .2s}.btn-toggle-public:hover{background:var(--bg-secondary)}.btn-toggle-public.public-active{background:var(--accent);color:#fff}.note-detail{flex:1;display:flex;flex-direction:column;overflow:hidden;min-width:0}.note-detail-header{display:flex;align-items:center;justify-content:space-between;padding:12px 20px;border-bottom:1px solid var(--border)}.note-detail-actions{display:flex;gap:4px}.btn-back{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:6px;border-radius:6px;display:none}.btn-back:hover{background:var(--bg-secondary)}.btn-back svg{width:20px;height:20px}.btn-icon{background:none;border:1px solid var(--border);color:var(--text-secondary);cursor:pointer;padding:7px 10px;border-radius:8px;transition:all .15s;display:flex;align-items:center}.btn-icon:hover{background:var(--bg-secondary);color:var(--text-primary)}.btn-icon svg{width:17px;height:17px}.btn-save:hover{border-color:var(--success);color:var(--success)}.btn-delete:hover{border-color:var(--danger);color:var(--danger)}.note-title-input{display:block;width:100%;background:none;border:none;outline:none;font-family:var(--font-display);font-size:1.5rem;font-weight:700;color:var(--text-primary);padding:20px 24px 8px}.note-title-input::placeholder{color:var(--text-muted)}.editor-toolbar{display:flex;gap:2px;padding:0 24px 8px;border-bottom:1px solid var(--border)}.editor-toolbar button,.editor-toolbar .upload-btn{background:none;border:none;color:var(--text-secondary);cursor:pointer;padding:6px 10px;border-radius:6px;font-size:.85rem;transition:all .15s;display:flex;align-items:center}.editor-toolbar button:hover,.editor-toolbar .upload-btn:hover{background:var(--bg-secondary);color:var(--text-primary)}.note-content-input{flex:1;display:block;width:100%;background:none;border:none;outline:none;resize:none;padding:16px 24px;font-family:var(--font-mono);font-size:.9rem;line-height:1.7;color:var(--text-primary);overflow-y:auto}.note-content-input::placeholder{color:var(--text-muted)}.note-preview{flex:1;padding:16px 24px;overflow-y:auto;line-height:1.8}.note-preview h1,.note-preview h2,.note-preview h3{font-family:var(--font-display);margin:1em 0 .5em;line-height:1.3}.note-preview h1{font-size:1.6rem}.note-preview h2{font-size:1.3rem}.note-preview h3{font-size:1.1rem}.note-preview p{margin-bottom:.8em}.note-preview code{font-family:var(--font-mono);background:var(--bg-input);padding:2px 6px;border-radius:4px;font-size:.88em}.note-preview pre{background:#1a1a1e;padding:16px;border-radius:10px;overflow-x:auto;margin:1em 0}.note-preview pre code{background:none;padding:0;color:#e8e6e1}.note-preview img{max-width:100%;border-radius:8px;margin:.5em 0}.note-preview blockquote{border-left:3px solid var(--accent);padding-left:16px;color:var(--text-secondary);margin:1em 0}.note-preview ul,.note-preview ol{padding-left:1.5em;margin-bottom:.8em}.note-preview a{color:var(--accent);text-decoration:underline}.note-preview table{border-collapse:collapse;width:100%;margin:1em 0}.note-preview th,.note-preview td{border:1px solid var(--border);padding:8px 12px;text-align:left}.note-preview th{background:var(--bg-secondary);font-weight:600}.chat-header{padding:24px 28px 16px;border-bottom:1px solid var(--border)}.chat-header h2{font-family:var(--font-display);font-size:1.4rem;font-weight:700}.chat-subtitle{color:var(--text-secondary);font-size:.85rem;margin-top:4px}.chat-compose{padding:16px 24px;border-bottom:1px solid var(--border);display:flex;gap:12px;align-items:flex-end}.chat-compose textarea{flex:1;background:var(--bg-input);border:1px solid var(--border);border-radius:10px;padding:10px 14px;color:var(--text-primary);font-family:var(--font-body);font-size:.9rem;resize:none;outline:none;line-height:1.5;transition:border-color .2s}.chat-compose textarea:focus{border-color:var(--accent)}.chat-compose textarea::placeholder{color:var(--text-muted)}.btn-send{display:flex;align-items:center;gap:6px;background:var(--accent);color:#fff;border:none;border-radius:10px;padding:10px 18px;font-family:var(--font-body);font-size:.88rem;font-weight:600;cursor:pointer;transition:background .2s,transform .1s;white-space:nowrap}.btn-send svg{width:16px;height:16px}.btn-send:hover{background:var(--accent-hover)}.btn-send:active{transform:scale(.97)}.messages-list{flex:1;overflow-y:auto;padding:16px 24px}.message-item{background:var(--bg-card);border:1px solid var(--border);border-radius:12px;padding:16px;margin-bottom:12px;animation:msgIn .3s ease both}@keyframes msgIn{0%{opacity:0;transform:translateY(8px)}}.message-header{display:flex;align-items:center;gap:10px;margin-bottom:8px}.message-avatar{width:28px;height:28px;border-radius:7px;background:linear-gradient(135deg,#c45d3e,#e0a050);display:flex;align-items:center;justify-content:center;font-size:.7rem;font-weight:700;color:#fff;flex-shrink:0}.message-username{font-weight:600;font-size:.88rem}.message-time{color:var(--text-muted);font-size:.75rem;margin-left:auto}.message-content{font-size:.9rem;line-height:1.6;color:var(--text-primary);white-space:pre-wrap;word-break:break-word}.message-actions{display:flex;gap:8px;margin-top:10px}.message-actions button{background:none;border:none;color:var(--text-muted);font-family:var(--font-body);font-size:.78rem;cursor:pointer;padding:4px 8px;border-radius:6px;transition:all .15s}.message-actions button:hover{background:var(--bg-secondary);color:var(--text-primary)}.message-actions .delete-btn:hover{color:#ef4444}.message-replies{margin-top:12px;padding-left:20px;border-left:2px solid var(--border)}.message-replies .message-item{background:var(--bg-secondary);border-color:transparent;margin-bottom:8px;padding:12px}.reply-compose{display:flex;gap:8px;margin-top:10px;padding-top:10px;border-top:1px solid var(--border)}.reply-compose input{flex:1;background:var(--bg-input);border:1px solid var(--border);border-radius:8px;padding:8px 12px;color:var(--text-primary);font-family:var(--font-body);font-size:.85rem;outline:none}.reply-compose input:focus{border-color:var(--accent)}.reply-compose input::placeholder{color:var(--text-muted)}.reply-compose button{background:var(--accent);color:#fff;border:none;border-radius:8px;padding:8px 14px;font-family:var(--font-body);font-size:.82rem;font-weight:600;cursor:pointer;transition:background .2s}.reply-compose button:hover{background:var(--accent-hover)}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;text-align:center}.empty-state svg{width:80px;height:80px;margin-bottom:16px}.empty-state p{color:var(--text-secondary);font-size:.95rem}.empty-state .sub{color:var(--text-muted);font-size:.82rem;margin-top:4px}.toast-container{position:fixed;top:20px;right:20px;z-index:2000;display:flex;flex-direction:column;gap:8px}.toast{background:var(--bg-card);border:1px solid var(--border);border-radius:10px;padding:12px 20px;box-shadow:var(--shadow-lg);font-size:.88rem;animation:toastIn .3s ease both;max-width:320px}.toast.success{border-left:3px solid var(--success)}.toast.error{border-left:3px solid var(--danger)}@keyframes toastIn{0%{opacity:0;transform:translate(20px)}}@keyframes toastOut{to{opacity:0;transform:translate(20px)}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}@media (max-width: 900px){.notes-list{width:100%;min-width:0;border-right:none}.note-detail{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--bg-primary);z-index:60}.shared-list{width:100%;min-width:0;border-right:none}.shared-viewer{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--bg-primary);z-index:60;overflow-y:auto}.btn-back{display:block}.date-filters{display:none}}@media (max-width: 768px){.notes-toolbar{padding:12px 16px}.note-title-input{padding:16px 16px 8px;font-size:1.3rem}.note-content-input,.note-preview{padding:12px 16px}.editor-toolbar{padding:0 16px 8px}.chat-header{padding:16px 16px 12px}.chat-compose,.messages-list{padding:12px 16px}}
