html,body{width:100%;margin:0;padding:0}html{scrollbar-gutter:stable;overflow-y:scroll}:root{--scrollbar-width:calc(100vw - 100%);--mobile:480px;--tablet:768px;--desktop:1024px;--large:1280px}html::-webkit-scrollbar{background-color:#f1f1f1;width:12px}html::-webkit-scrollbar-track{background-color:#f1f1f1;border-left:1px solid #e5e7eb}html::-webkit-scrollbar-thumb{background-color:#c1c1c1;border:2px solid #f1f1f1;border-radius:6px}html::-webkit-scrollbar-thumb:hover{background-color:#a8a8a8}.three-column-layout{padding-right:0}.nav-panel{background-color:#0000!important}.container-wrapper{justify-content:center;width:100%;min-height:100vh;display:flex;position:relative}.three-column-layout{width:100%;max-width:1200px;min-height:100vh;position:relative;box-shadow:0 0 #e5e7eb}.main-content-area{box-sizing:border-box;background-color:#0000;width:100%;min-height:101vh;padding:0 280px 60px;position:relative}.main-content-area:before{content:"";z-index:-1;background-color:#fff;position:absolute;inset:0 280px;box-shadow:-8px 0 16px #0000001a,8px 0 16px #0000001a,0 0 20px #0000000d}.left-column{z-index:10;overscroll-behavior-y:contain;border-left:1px solid #e5e7eb;border-right:1px solid #e5e7eb;width:272px;height:100vh;padding:12px;position:fixed;top:0;left:max(0px,50% - 606px);overflow-y:auto;box-shadow:none!important;background-color:#0000!important}.right-column{z-index:10;overscroll-behavior-y:contain;background-color:#f7f9f9;width:272px;height:100vh;padding:8px;position:fixed;top:0;right:max(0px,50% - 606px);overflow-y:visible}@media (max-width:1024px){.main-content-area{padding:0 0 0 236px}.main-content-area:before{left:236px;right:0}.left-column{width:228px;left:0}.right-column{display:none}}@media (max-width:768px){.main-content-area{box-shadow:none;background-color:#fff;padding:0}.main-content-area:before{left:0;right:0}.left-column,.right-column{display:none}}@media (max-width:480px){.hide-mobile{display:none}}.left-column::-webkit-scrollbar{width:4px}.right-column::-webkit-scrollbar{width:4px}.main-content-area::-webkit-scrollbar{width:4px}.left-column::-webkit-scrollbar-thumb{background-color:#cfd9de;border-radius:4px}.right-column::-webkit-scrollbar-thumb{background-color:#cfd9de;border-radius:4px}.main-content-area::-webkit-scrollbar-thumb{background-color:#cfd9de;border-radius:4px}.left-column::-webkit-scrollbar-track{background-color:#0000}.right-column::-webkit-scrollbar-track{background-color:#0000}.main-content-area::-webkit-scrollbar-track{background-color:#0000}
.nav-section-header{align-items:center;gap:8px;margin:12px 0 4px;padding:0 16px;display:flex}.nav-section-title{color:#9ca3af;text-transform:uppercase;letter-spacing:.5px;white-space:nowrap;font-size:11px;font-weight:500}.nav-section-line{background-color:#e5e7eb;flex:1;height:1px}.back-button{color:#fff;cursor:pointer;background-color:#3b82f6;border:none;border-radius:.25rem;padding:.5rem 1rem;transition:background-color .2s}.back-button:hover{background-color:#2563eb}.primary-button{color:#fff;cursor:pointer;background-color:#3b82f6;border:none;border-radius:.25rem;padding:.25rem .75rem;font-size:.875rem}.primary-button:hover{background-color:#2563eb}.primary-button:disabled{cursor:not-allowed;background-color:#9ca3af}.secondary-button{cursor:pointer;background-color:#d1d5db;border:none;border-radius:.25rem;padding:.25rem .75rem;font-size:.875rem}.secondary-button:hover{background-color:#9ca3af}.add-link-button{color:#3b82f6;cursor:pointer;margin-top:1rem;font-weight:500;display:inline-block}.share-button{color:#fff;cursor:pointer;background-color:#4b5563;border:none;border-radius:.25rem;padding:.5rem 1rem;transition:background-color .2s}.share-button:hover{background-color:#374151}.edit-button{color:#4b5563;cursor:pointer;background-color:#e5e7eb;border:none;border-radius:.25rem;margin-left:.5rem;padding:.25rem .5rem;font-size:.875rem}.edit-button:hover{background-color:#d1d5db}.delete-topic-button{color:#6b7280;cursor:pointer;opacity:.6;background:0 0;border:none;padding:0 8px;font-size:1.2rem;line-height:1;transition:opacity .2s,color .2s}.delete-topic-button:hover{opacity:1;color:#ef4444}.delete-note-button{color:#6b7280;cursor:pointer;opacity:0;background:0 0;border:none;padding:4px;font-size:.85rem;line-height:1;transition:opacity .2s,color .2s}.note-item:hover .delete-note-button{opacity:.6}.delete-note-button:hover{opacity:1;color:#ef4444}.header-actions{gap:12px;display:flex}.form-label{margin-bottom:.5rem;font-weight:500;display:block}.text-input{border:1px solid #d1d5db;border-radius:.25rem;width:100%;margin-bottom:.5rem;padding:.5rem}.textarea{resize:vertical;border:1px solid #d1d5db;border-radius:.25rem;width:100%;min-height:6rem;margin-bottom:.5rem;padding:.5rem}.button-row{gap:.5rem;display:flex}.back-to-my-notes-button{text-align:left;color:#4b5563;cursor:pointer;background-color:#f3f4f6;border:none;border-radius:6px;width:100%;margin-bottom:12px;padding:10px 12px;font-size:.9rem;font-weight:500;transition:all .2s;display:block}.back-to-my-notes-button:hover{color:#111827;background-color:#e5e7eb}.viewed-user-info{margin-bottom:16px}.viewed-user-info h3{color:#4b5563;margin:0;padding:0 12px;font-size:.95rem;font-weight:500}
.back-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#68b2ea 0%,#66a9e4 100%);border:none;border-radius:.25rem;padding:.5rem 1rem;transition:all .3s;box-shadow:0 2px 4px #355fcb33}.back-button:hover{background:linear-gradient(135deg,#2b51b9,#5f89ad);box-shadow:0 3px 6px #355fcb4d}.primary-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#68b2ea 0%,#66a9e4 100%);border:none;border-radius:.25rem;padding:.25rem .75rem;font-size:.875rem;transition:all .3s;box-shadow:0 1px 3px #355fcb33}.primary-button:hover{background:linear-gradient(135deg,#2b51b9,#5f89ad);box-shadow:0 2px 4px #355fcb4d}.primary-button:disabled{box-shadow:none;cursor:not-allowed;background:linear-gradient(135deg,#aaa,#ccc);transform:none}.secondary-button{color:#555;cursor:pointer;background:linear-gradient(135deg,#f5f5f5,#fff);border:1px solid #d0d0d0;border-radius:.25rem;padding:.25rem .75rem;font-size:.875rem;transition:all .3s}.secondary-button:hover{color:#333;background:linear-gradient(135deg,#e0e0e0,#f5f5f5);border-color:#999}.add-link-button{color:#355fcb;cursor:pointer;margin-top:1rem;font-weight:500;transition:all .2s;display:inline-block}.add-link-button:hover{color:#2b51b9}.share-button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#4b5563,#6b7280);border:none;border-radius:.25rem;padding:.5rem 1rem;transition:all .3s}.share-button:hover{background:linear-gradient(135deg,#374151,#4b5563);box-shadow:0 3px 6px #4b55634d}.edit-button{color:#4b5563;cursor:pointer;background:linear-gradient(135deg,#e5e7eb,#f3f4f6);border:1px solid #d1d5db;border-radius:.25rem;margin-left:.5rem;padding:.25rem .5rem;font-size:.875rem;transition:all .3s}.edit-button:hover{color:#374151;background:linear-gradient(135deg,#d1d5db,#e5e7eb);border-color:#9ca3af}.button-row{gap:.5rem;display:flex}.form-label{margin-bottom:.5rem;font-weight:500;display:block}.text-input{border:1px solid #d1d5db;border-radius:.25rem;width:100%;margin-bottom:.5rem;padding:.5rem}.textarea{resize:vertical;border:1px solid #d1d5db;border-radius:.25rem;width:100%;min-height:6rem;margin-bottom:.5rem;padding:.5rem}
@media (max-width:1024px){.three-column-layout{grid-template-columns:180px minmax(300px,500px) 220px}}@media (max-width:768px){.three-column-layout{grid-template-columns:1fr;height:auto;padding-bottom:72px}.left-column,.right-column{display:none}.profile-edit-section,.notes-section{margin-bottom:1rem}.two-column-layout{grid-template-columns:1fr;gap:16px}.user-view-sidebar{border-bottom:1px solid #e5e7eb;border-right:none;padding-bottom:16px;padding-right:0}.viewed-profile-header{flex-direction:row;align-items:flex-start;gap:16px}.viewed-profile-pic{margin-bottom:0}.profile-pic-large,.profile-pic-placeholder-large{width:80px;height:80px}}@media (max-width:640px){.note-container{flex-direction:column;align-items:flex-start}.note-avatar{margin-bottom:12px}.note-content-wrapper{width:100%}.reply-item{flex-direction:column}.reply-avatar{margin-bottom:8px}.profile-card{text-align:center;flex-direction:column;align-items:center}.profile-pic-wrapper{margin-bottom:8px;margin-right:0}.notes-header{flex-direction:column;align-items:flex-start;gap:12px}.add-note-button{text-align:center;width:100%}.replies-header{flex-direction:column;align-items:flex-start;gap:12px}}
.right-column{border-left:1px solid #e5e7eb;background-color:#fff!important}.right-panel-content{overscroll-behavior-y:contain;flex-direction:column;gap:28px;padding:24px 16px;display:flex}.right-panel-section{flex-direction:column;gap:12px;display:flex}.right-panel-title{color:#111827;border-bottom:1px solid #f0f0f0;margin:0 0 4px;padding-bottom:8px;font-size:16px;font-weight:600}.trend-item{cursor:pointer;border-radius:8px;justify-content:space-between;align-items:center;padding:8px 12px;transition:background-color .2s;display:flex}.trend-item:hover{background-color:#f5f8fc}.trend-name{color:#355fcb;font-weight:500}.trend-count{color:#6b7280;font-size:13px}.activity-item{border-left:2px solid #e0e7f7;border-radius:8px;flex-direction:column;margin-bottom:6px;padding:8px 12px;display:flex}.activity-text{color:#374151;font-size:14px;line-height:1.4}.activity-time{color:#6b7280;margin-top:4px;font-size:12px}@media (max-width:1280px){.right-panel-content{padding:16px 12px}}@media (max-width:1024px){.right-column{display:none}}@media (max-width:768px){.right-column.show-mobile{z-index:100;width:280px;display:block;position:fixed;top:0;bottom:0;right:0;box-shadow:-2px 0 8px #0000001a}}
.feedback-modal .modal-content{width:90vw;max-width:500px}.feedback-modal-content{padding:0}.feedback-description{margin-bottom:20px}.feedback-description p{color:#6b7280;margin:0;font-size:14px;line-height:1.5}.feedback-form{flex-direction:column;gap:16px;display:flex}.feedback-input-container{width:100%}.feedback-textarea{resize:vertical;box-sizing:border-box;border:1px solid #e5e7eb;border-radius:8px;width:100%;min-height:120px;padding:12px;font-family:inherit;font-size:14px;line-height:1.5}.feedback-textarea:focus{border-color:#3b82f6;outline:none;box-shadow:0 0 0 3px #3b82f61a}.feedback-textarea:disabled{color:#9ca3af;cursor:not-allowed;background-color:#f9fafb}.feedback-actions{justify-content:flex-end;gap:12px;margin-top:4px;display:flex}.feedback-cancel-button,.feedback-submit-button{cursor:pointer;border:1px solid var(--border-color,#ddd);border-radius:6px;padding:.5rem 1.5rem;font-size:14px;font-weight:500;transition:background-color .2s}.feedback-cancel-button{background:var(--bg-subtle,#f5f5f5);color:var(--text-color,#333)}.feedback-cancel-button:hover:not(:disabled){background:var(--bg-hover,#eaeaea)}.feedback-submit-button{color:#fff;background:linear-gradient(135deg,#66a9e4 0%,#2c8bf7 100%);border:none;box-shadow:0 2px 4px #2c7df74d}.feedback-submit-button:hover:not(:disabled){background:linear-gradient(135deg,#5a9ade 0%,#1c7bf5 100%);transform:translateY(-1px);box-shadow:0 2px 8px #2c7df766}.feedback-submit-button:active{background:linear-gradient(135deg,#4e8dd8 0%,#0c6bf3 100%);transform:translateY(0)}.feedback-submit-button:disabled{color:#fff;cursor:not-allowed;box-shadow:none;background:#a0a0a0;border-color:#a0a0a0;transform:none}.feedback-error{color:#dc2626;background-color:#fef2f2;border:1px solid #fecaca;border-radius:6px;padding:8px 12px;font-size:14px}.feedback-success{text-align:center;padding:20px 0}.feedback-success .success-icon{margin-bottom:16px;font-size:48px}.feedback-success h3{color:#059669;margin:0 0 8px;font-size:18px;font-weight:600}.feedback-success p{color:#6b7280;margin:0;font-size:14px}
.bug-report-modal .modal-content{width:90vw;max-width:600px}.bug-report-modal-content{padding:0}.bug-report-description{margin-bottom:20px}.bug-report-description p{color:#6b7280;margin:0;font-size:14px;line-height:1.5}.bug-report-form{flex-direction:column;gap:16px;display:flex}.bug-report-form .form-group{flex-direction:column;gap:6px;display:flex}.bug-report-form label{color:#374151;font-size:14px;font-weight:500}.bug-title-input,.bug-description-textarea,.steps-textarea{box-sizing:border-box;border:1px solid #e5e7eb;border-radius:8px;width:100%;padding:12px;font-family:inherit;font-size:14px;line-height:1.5}.bug-title-input{height:44px}.bug-description-textarea,.steps-textarea{resize:vertical;min-height:80px}.bug-title-input:focus,.bug-description-textarea:focus,.steps-textarea:focus{border-color:#3b82f6;outline:none;box-shadow:0 0 0 3px #3b82f61a}.bug-title-input:disabled,.bug-description-textarea:disabled,.steps-textarea:disabled{color:#9ca3af;cursor:not-allowed;background-color:#f9fafb}.bug-report-actions{justify-content:flex-end;gap:12px;margin-top:4px;display:flex}.bug-report-cancel-button,.bug-report-submit-button{cursor:pointer;border:1px solid var(--border-color,#ddd);border-radius:6px;padding:.5rem 1.5rem;font-size:14px;font-weight:500;transition:background-color .2s}.bug-report-cancel-button{background:var(--bg-subtle,#f5f5f5);color:var(--text-color,#333)}.bug-report-cancel-button:hover:not(:disabled){background:var(--bg-hover,#eaeaea)}.bug-report-submit-button{background:var(--danger-color);color:#fff;border-color:var(--danger-color)}.bug-report-submit-button:hover:not(:disabled){background:var(--danger-color-dark);border-color:var(--danger-color-dark)}.bug-report-submit-button:disabled{background:var(--bg-subtle,#f5f5f5);color:var(--text-color-muted,#999);cursor:not-allowed;border-color:var(--border-color,#ddd)}.bug-report-error{color:#dc2626;background-color:#fef2f2;border:1px solid #fecaca;border-radius:6px;padding:8px 12px;font-size:14px}.bug-report-success{text-align:center;padding:20px 0}.bug-report-success .success-icon{margin-bottom:16px;font-size:48px}.bug-report-success h3{color:#059669;margin:0 0 8px;font-size:18px;font-weight:600}.bug-report-success p{color:#6b7280;margin:0;font-size:14px}
