.note-modal{z-index:9999}.modal-overlay:has(.modal-content.note-modal){padding:10px!important}.modal-content.note-modal{background:#fff!important;border-radius:12px!important;flex-direction:column!important;width:100%!important;max-width:650px!important;height:calc(100vh - 60px)!important;min-height:calc(100vh - 60px)!important;max-height:calc(100vh - 60px)!important;padding:0!important;display:flex!important;overflow:hidden!important}.note-modal-container{flex-direction:column;height:100%;display:flex;position:relative}.note-modal-header-wrapper{z-index:10;-webkit-backdrop-filter:blur(10px);background:#fcfcfce6;border-bottom:1px solid #0000000f;grid-template-columns:72px 1fr 72px;align-items:center;gap:16px;padding:12px 16px;display:grid;position:sticky;top:0}.note-modal-nav-arrows{align-items:center;gap:4px;width:72px;display:flex}.note-nav-arrow{cursor:pointer;width:32px;height:32px;color:var(--text-secondary);background:0 0;border:1px solid #0000001a;border-radius:6px;justify-content:center;align-items:center;transition:all .2s;display:flex}.note-nav-arrow:hover{color:var(--text);background-color:#0000000d;border-color:#0003}.note-nav-arrow:disabled{opacity:.3;cursor:not-allowed}.note-nav-arrow:disabled:hover{background-color:#0000;border-color:#0000001a}.note-modal-date{text-align:center;color:var(--text);flex:1;font-size:14px;font-weight:500}.note-modal-close-wrapper{justify-content:flex-end;width:72px;display:flex}.note-modal-close{cursor:pointer;width:32px;height:32px;color:var(--text-secondary);background:0 0;border:none;justify-content:center;align-items:center;transition:all .2s;display:flex}.note-modal-close:hover{color:var(--text);background-color:#0000000d;border-radius:50%}.note-modal-body{scrollbar-width:thin;scrollbar-color:#0003 transparent;flex:1;min-height:0;overflow-y:auto}.note-modal-body::-webkit-scrollbar{width:6px}.note-modal-body::-webkit-scrollbar-track{background:0 0}.note-modal-body::-webkit-scrollbar-thumb{background-color:#0003;border-radius:3px}.note-modal-body::-webkit-scrollbar-thumb:hover{background-color:#0000004d}.note-modal-loading{text-align:center;color:var(--text-secondary);padding:60px;font-size:14px}.note-modal-parent-context{cursor:pointer;color:#9ca3af;white-space:nowrap;text-overflow:ellipsis;margin:16px 12px 0;padding:0;font-size:16px;transition:color .2s;overflow:hidden}.note-modal-parent-context:hover{color:#6b7280}.note-modal-child-context{cursor:pointer;color:#9ca3af;white-space:nowrap;text-overflow:ellipsis;margin:12px 12px 0;padding:0;font-size:16px;transition:color .2s;overflow:hidden}.note-modal-child-context:hover{color:#6b7280}.note-modal-main{padding:24px 20px}.note-modal-content::-webkit-scrollbar{width:6px}.note-modal-content::-webkit-scrollbar-track{background:0 0}.note-modal-content::-webkit-scrollbar-thumb{background-color:#0003;border-radius:3px}.note-modal-content::-webkit-scrollbar-thumb:hover{background-color:#0000004d}.note-content-display{color:var(--text);word-wrap:break-word;font-size:16px;line-height:1.6}.note-content-display p{margin:0 0 12px}.note-content-display p:last-child{margin-bottom:0}.note-edit-area{flex-direction:column;gap:16px;display:flex}.note-edit-textarea{width:100%;color:var(--text);resize:none;field-sizing:content;background:0 0;border:none;border-radius:0;outline:none;min-height:100px;padding:0 0 20px;font-family:inherit;font-size:16px;line-height:1.6;overflow:hidden}.note-edit-textarea:focus{border-color:var(--primary);outline:none}.note-edit-textarea:disabled{background:var(--surface);cursor:default;opacity:1;color:var(--text)}.note-modal-media-section{border-top:1px solid #e5e7eb;margin-top:20px;padding-top:12px}.media-grid{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;padding:4px;display:grid}.media-grid-item{aspect-ratio:1;background:#f3f4f6;border-radius:8px;overflow:hidden}.media-grid-image{object-fit:cover;cursor:pointer;width:100%;height:100%;transition:transform .2s}.media-grid-image:hover{transform:scale(1.05)}.save-status{color:#22c55e;border-radius:50%;justify-content:center;align-items:center;gap:4px;min-width:36px;min-height:36px;padding:8px;font-size:.85rem;display:flex}.save-status.status-saved{color:#22c55e}.save-status.status-saving,.save-status.status-unsaved{color:#4f46e5}.save-status-spinner{border:2px solid #0000;border-top-color:currentColor;border-radius:50%;width:16px;height:16px;animation:.6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.note-modal-actions{background:#fff;border-top:1px solid #f0f0f0;flex-shrink:0;align-items:center;gap:8px;padding:16px 20px;display:flex}.action-btn{color:#7c8494;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;gap:2px;min-width:36px;min-height:36px;padding:8px;font-size:.9rem;transition:all .15s;display:flex;position:relative}.action-btn:hover{color:#4f46e5;background-color:#4f46e514}.action-btn.active{color:#dc2626;background-color:#dc262614}.action-btn svg{width:16px;height:16px}.action-btn span{display:none}.action-btn.type-pill-add{color:#9da0a6;background-color:#fff;border:1px dashed #ededed;border-radius:20px;min-width:auto;min-height:auto;padding:.4rem .75rem}.action-btn.type-pill-add:hover{color:#70747c;background-color:#fff;border:1px dashed #a7a7a7}.action-btn.type-pill-add span{font-size:.8rem;font-weight:500;display:inline}.note-modal-replies{background:var(--surface);padding:24px 20px}.replies-heading{color:var(--text);margin:0 0 24px;font-size:18px;font-weight:700}.reply-form-container{margin-bottom:32px}.replies-list{flex-direction:column;gap:24px;display:flex}.reply-item{background:var(--background);border:1px solid var(--border);border-radius:12px;padding:16px}.reply-author-info{align-items:center;gap:10px;margin-bottom:12px;display:flex}.note-modal .reply-avatar{object-fit:cover;border-radius:50%;flex-shrink:0;min-width:32px;max-width:32px;min-height:32px;max-height:32px;width:32px!important;height:32px!important}.note-modal .reply-avatar-placeholder{background:var(--primary);color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;min-width:32px;max-width:32px;min-height:32px;max-height:32px;font-size:12px;font-weight:600;display:flex;width:32px!important;height:32px!important}.reply-author-name{color:var(--text);font-size:14px;font-weight:600}.reply-timestamp{color:var(--text-secondary);margin-top:2px;font-size:12px}.reply-content{color:var(--text);word-wrap:break-word;font-size:14px;line-height:1.5}.no-replies{text-align:center;color:var(--text-secondary);padding:32px;font-size:14px}@media (max-width:768px){.modal-overlay:has(.modal-content.note-modal){align-items:stretch!important;padding:0!important}.modal-content.note-modal{border-radius:0!important;flex-direction:column!important;width:100%!important;max-width:100%!important;height:100dvh!important;max-height:100dvh!important;margin:0!important;display:flex!important}.note-modal-container{flex-direction:column;height:100%;display:flex}.note-modal-header-wrapper{flex-shrink:0;padding:12px 16px}.note-modal-close{top:12px;right:16px}.note-modal-body{-webkit-overflow-scrolling:touch;min-height:0;padding-bottom:calc(70px + env(safe-area-inset-bottom,0px));flex:1;overflow-y:auto}.note-modal-main{padding:20px 16px}.note-modal-replies{padding:20px 16px;padding-bottom:calc(20px + env(safe-area-inset-bottom,0px))}.note-modal-parent-context{padding:16px}.note-modal-actions{z-index:20;padding:12px 16px calc(12px + env(safe-area-inset-bottom,0px));background:#fff;position:fixed;bottom:0;left:0;right:0;box-shadow:0 -2px 10px #0000001a}.media-grid{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));max-height:300px}}@media (max-width:1024px) and (min-width:769px){.modal-content.note-modal{max-width:90%!important}}
.note-container{transition:box-shadow .2s,transform .2s;position:relative;overflow:hidden}.note-container:hover{box-shadow:none}.note-content{flex-direction:row;gap:12px;padding:4px 16px;display:flex}.timeline-entries .note-header,.document-entries .note-header{flex-wrap:nowrap;justify-content:space-between;align-items:center;gap:.5rem;width:100%;display:flex;translate:0 -8px}.author-section{flex-wrap:nowrap;flex-grow:1;flex-shrink:1;align-items:center;min-width:0;display:flex;overflow:hidden}.timeline-entries .menu-dropdown-container.header-kebab,.document-entries .menu-dropdown-container.header-kebab{flex-shrink:0;margin-left:.5rem}.avatar-image,.avatar-placeholder{object-fit:cover;border-radius:50%;width:36px;height:36px}.avatar-placeholder{background-color:var(--primary-color-light,#e0e7ff);color:var(--primary-color,#4f46e5);justify-content:center;align-items:center;font-weight:700;display:flex}.small-avatar{object-fit:cover;border-radius:50%;width:24px;height:24px}.author-details{flex-flow:row;align-items:center;display:flex}.author-name-container{align-items:center;gap:8px;margin-bottom:2px;display:flex}.author-name{color:var(--text-color-primary,#333);font-weight:600}.timestamp{color:var(--text-color-tertiary,#888);font-size:.85rem}.note-media{flex-direction:column;gap:8px;display:flex}.media-item.image img{border-radius:8px;max-width:100%}.media-item.link{box-shadow:none!important;background:0 0!important;border:none!important;margin:12px 0!important;padding:0!important}.link-description{color:var(--text-color-secondary,#666);margin:0;font-size:.9rem}.note-actions{gap:16px;display:flex}.like-button,.bookmark-button,.delete-button,.move-button{color:var(--text-color-secondary,#666);cursor:pointer;opacity:1;background:0 0;border:none;align-items:center;gap:4px;padding:4px;font-size:.9rem;display:flex}.like-button:hover,.bookmark-button:hover{color:var(--primary-color,#4f46e5)}.like-button.liked{color:var(--heart-color,#ef4444)}.bookmark-button.bookmarked{color:var(--bookmark-color,#f59e0b)}.note-container .delete-button,.icon-action-buttons .delete-button,.note-actions .delete-button{color:var(--text-color-secondary,#666);background-color:#0000}.note-container .delete-button:hover,.icon-action-buttons .delete-button:hover,.note-actions .delete-button:hover{color:var(--danger-color,#dc2626);background-color:#0000000d}.edit-area{width:100%;line-height:1.6rem}.content-textarea{border:1px solid var(--border-color,#e0e0e0);resize:vertical;border-radius:8px;width:100%;min-height:100px;margin-bottom:12px;padding:12px;font-family:inherit;font-size:.95rem}.edit-actions{justify-content:flex-end;gap:8px;display:flex}.edit-actions button{cursor:pointer;border-radius:4px;padding:6px 12px;font-size:.9rem}.edit-actions button:first-child{background-color:var(--primary-color,#4f46e5);color:#fff;border:none}.edit-actions button:last-child{background-color:var(--background-color,white);color:var(--text-color-primary,#333);border:1px solid var(--border-color,#e0e0e0)}.delete-confirm{z-index:2;background-color:#fffffff2;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;padding:16px;display:flex;position:absolute;top:0;left:0}.delete-confirm p{margin:0 0 16px;font-weight:600}.confirmation-buttons{gap:16px;display:flex}.confirmation-buttons button{cursor:pointer;border-radius:4px;padding:8px 16px;font-size:.9rem}.confirmation-buttons button:first-child{background-color:var(--danger-color,#dc2626);color:#fff;border:none}.confirmation-buttons button:last-child{background-color:var(--background-color,white);color:var(--text-color-primary,#333);border:1px solid var(--border-color,#e0e0e0)}.timeline-style{flex-direction:row;display:flex}.profile-note{border:1px solid var(--border-color,#e0e0e0);background-color:var(--background-color,white);cursor:pointer;border-radius:8px;margin-bottom:16px;transition:transform .2s;overflow:hidden}.profile-note:hover{transform:translateY(-2px);box-shadow:0 4px 8px #00000014}.notes-list{margin-top:20px}.notes-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;display:grid}.empty-notes-message{text-align:center;background-color:var(--background-light,#f7f9fc);color:var(--text-color-secondary,#666);border-radius:8px;padding:30px}@media (max-width:768px){.notes-grid{grid-template-columns:1fr}.note-actions{flex-wrap:wrap}}.copy-button{position:relative}.copy-button.copied{color:var(--primary-color,#4f46e5)}.copy-button .copy-tooltip{color:#fff;white-space:nowrap;background:#000000b3;border-radius:4px;padding:4px 8px;font-size:12px;animation:2s fadeInOut;position:absolute;top:-30px;left:50%;transform:translate(-50%)}@keyframes fadeInOut{0%{opacity:0}10%{opacity:1}80%{opacity:1}to{opacity:0}}.topic-doc-icon{color:currentColor;opacity:.7;justify-content:center;align-items:center;margin-right:2px;display:inline-flex}.topic-badge .topic-doc-icon{width:12px;height:12px;margin-right:4px;position:relative;top:1px}
.page-container{flex-direction:column;width:100%;height:100%;display:flex}.page-header{background-color:#fff;border-bottom:1px solid #e5e7eb;justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.page-header .header-left{flex-direction:column;justify-content:center;align-items:flex-start;display:flex}.page-header .page-title{color:#111827;font-size:20px;font-weight:600;font-family:var(--font-primary);margin:0 0 4px}.page-header .stats{flex-direction:row;gap:16px;display:flex}.page-header .stat-item{color:#6b7280;font-size:.95rem}.page-header .header-actions{align-items:center;gap:12px;display:flex}.page-header .manage-topics-button{color:#355fcb;cursor:pointer;background-color:#fff;border:1px solid #e0e7ff;border-radius:8px;padding:8px 16px;font-size:.95rem;font-weight:500;transition:all .2s;box-shadow:0 1px 2px #0000000d}.page-header .manage-topics-button:hover{background-color:#f5f8fc;border-color:#6f96b7;transform:translateY(-1px)}.page-header .add-topic-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#68b2ea 0%,#66a9e4 100%);border:none;border-radius:8px;padding:8px 16px;font-size:.95rem;font-weight:500;transition:all .2s;box-shadow:0 1px 2px #355fcb40}.page-header .add-topic-button:hover{background:linear-gradient(135deg,#2b51b9,#5f89ad);transform:translateY(-1px);box-shadow:0 2px 4px #355fcb4d}.topic-actions-container{background-color:#fff;justify-content:flex-end;padding:16px 24px 0;display:flex}.notes-feed{flex:1;overflow:auto}
.offline-page{text-align:center;background-color:#f9fafb;flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:2rem;display:flex}.offline-content{background-color:#fff;border-radius:8px;flex-direction:column;align-items:center;gap:1rem;max-width:400px;padding:2rem;display:flex;box-shadow:0 2px 10px #0000001a}.offline-icon{color:#6b7280;margin-bottom:1rem}.offline-page h1{color:#111827;margin:0;font-size:1.5rem;font-weight:600}.offline-page p{color:#6b7280;margin:.5rem 0 0;line-height:1.5}.retry-button{color:#fff;cursor:pointer;background-color:#4f46e5;border:none;border-radius:6px;margin-top:1.5rem;padding:.5rem 1.5rem;font-weight:500;transition:background-color .2s}.retry-button:hover{background-color:#4338ca}