.app{display:flex;height:100vh;background:var(--color-bg)}.sidebar{width:280px;background:var(--color-surface);border-right:1px solid var(--color-border);display:flex;flex-direction:column;padding:3rem 2rem;flex-shrink:0}.brand{display:flex;align-items:center;gap:1rem;margin-bottom:4rem}.logo{width:32px;height:32px;border:1px solid var(--color-primary);color:var(--color-primary);display:flex;align-items:center;justify-content:center;font-family:var(--font-serif);font-size:1.2rem}.brand-name{font-size:1.5rem;letter-spacing:-.02em}.nav{display:flex;flex-direction:column;gap:.5rem;flex-grow:1}.nav-item{text-decoration:none;color:var(--color-text-muted);padding:.75rem 0;font-size:.95rem;font-weight:400;transition:all .3s;display:flex;align-items:center;gap:1rem;position:relative}.nav-item:hover{color:var(--color-text)}.nav-item.active{color:var(--color-text);font-weight:500}.nav-item.active:before{content:"";position:absolute;left:-2rem;width:4px;height:20px;background:var(--color-primary);border-radius:0 4px 4px 0;transition:left .3s}.nav-icon{color:var(--color-primary);opacity:.7;transition:opacity .3s;flex-shrink:0}.nav-item:hover .nav-icon,.nav-item.active .nav-icon{opacity:1}.mobile-tabs{display:none}.more-tab-btn{background:none;border:none;cursor:pointer;color:var(--color-text-muted)}.more-tab-btn:hover{color:var(--color-text)}.more-tab-btn.active{color:var(--color-text);font-weight:500}.sidebar-bottom{margin-top:auto}.profile-wrapper{position:relative}.user-pill-btn{background:none;border:none;padding:0;width:100%;text-align:left;cursor:pointer;transition:transform .2s;outline:none;color:inherit}.user-pill-btn:hover{transform:translateY(-2px)}.user-pill{background:var(--color-card);border:1px solid var(--color-border);padding:1rem;border-radius:12px;display:flex;align-items:center;gap:.75rem;transition:all .3s}.user-pill:hover{border-color:var(--color-primary)}.chevron-icon{margin-left:auto;color:var(--color-text-muted);opacity:.5}.profile-dropdown{position:absolute;bottom:calc(100% + 1rem);left:0;width:100%;z-index:1000;display:flex;flex-direction:column;animation:slideUp .3s ease;overflow:hidden;background:var(--color-surface);border:1px solid var(--color-border);border-radius:12px;padding:.5rem}.profile-dropdown.hidden{display:none}.dropdown-item{display:flex;align-items:center;gap:.75rem;padding:.75rem 1rem;text-decoration:none;color:var(--color-text);font-size:.9rem;border-radius:8px;transition:background .2s}.dropdown-item:hover{background:var(--color-primary-dim);color:var(--color-primary)}.dropdown-divider{height:1px;background:var(--color-border);margin:.5rem}.dropdown-item.logout:hover{color:#f87171;background:#f871711a}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.user-avatar{width:32px;height:32px;object-fit:cover;border-radius:6px;border:1px solid var(--color-primary)}.user-name{display:block;font-size:.85rem;font-weight:500}.user-role{font-size:.7rem;color:var(--color-text-muted)}.main{flex-grow:1;display:flex;flex-direction:column;min-width:0}.header{padding:2rem 3rem;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--color-border)}.search{display:flex;align-items:center;gap:.75rem;background:var(--color-surface);padding:.6rem 1.2rem;border-radius:100px;border:1px solid var(--color-border)}.search input{background:transparent;border:none;color:var(--color-text);font-size:.9rem;outline:none;width:200px}.search-icon{font-size:.9rem;opacity:.5}.btn-primary{background:var(--color-primary);color:var(--color-bg);border:none;padding:.6rem 1.5rem;border-radius:100px;font-weight:600;font-size:.85rem;cursor:pointer;display:inline-block;text-decoration:none;text-align:center}.btn-secondary{background:transparent;color:var(--color-text);border:1px solid var(--color-border);padding:.6rem 1.5rem;border-radius:100px;font-size:.85rem;cursor:pointer;margin-right:1rem;display:inline-block;text-decoration:none;text-align:center;position:relative}.notification-wrapper{position:relative;display:inline-block}.badge{position:absolute;top:-5px;right:5px;background:#ef4444;color:#fff;font-size:.6rem;font-weight:700;min-width:16px;height:16px;border-radius:100px;display:flex;align-items:center;justify-content:center;padding:0 4px;border:2px solid var(--color-bg)}.badge.hidden{display:none}.notification-dropdown{position:absolute;top:calc(100% + 1rem);right:0;width:350px;max-height:500px;z-index:1000;display:flex;flex-direction:column;animation:slideIn .3s ease;overflow:hidden}.notification-dropdown.hidden{display:none}.notification-header{padding:1.25rem 1.5rem;border-bottom:1px solid var(--color-border);display:flex;justify-content:space-between;align-items:center;background:var(--color-surface)}.notification-header h3{font-size:1.2rem}.text-link{background:none;border:none;color:var(--color-primary);font-size:.75rem;cursor:pointer;padding:0}.text-link:hover{text-decoration:underline}.notification-list{overflow-y:auto;flex-grow:1;background:var(--color-card)}.notification-item{padding:1.25rem 1.5rem;border-bottom:1px solid var(--color-border);display:flex;gap:1rem;transition:background .2s;cursor:pointer;position:relative}.notification-item:hover{background:#c5a0590d}.notification-item.unread{background:#c5a05905}.notification-item.unread:after{content:"";position:absolute;left:.5rem;top:50%;transform:translateY(-50%);width:6px;height:6px;background:var(--color-primary);border-radius:100px}.notification-content{flex-grow:1}.notification-title{font-size:.9rem;font-weight:600;margin-bottom:.25rem;color:var(--color-text)}.notification-text{font-size:.8rem;color:var(--color-text-muted);line-height:1.4;margin-bottom:.5rem}.notification-date{font-size:.7rem;color:var(--color-text-muted);opacity:.6}.notification-link{font-size:.75rem;color:var(--color-primary);text-decoration:none;align-self:center;padding:.4rem .8rem;border:1px solid var(--color-border);border-radius:4px;transition:all .2s}.notification-link:hover{background:var(--color-primary);color:var(--color-bg);border-color:var(--color-primary)}.loading-state,.empty-state{padding:2rem;text-align:center;color:var(--color-text-muted);font-size:.85rem;font-style:italic}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.scroll-container{flex-grow:1;overflow-y:auto;padding:3rem}.view{width:100%}@media (min-width: 901px){.sidebar.collapsible{width:100px;padding:3rem 1.5rem;transition:width .4s cubic-bezier(.4,0,.2,1),padding .4s cubic-bezier(.4,0,.2,1);overflow:hidden}.sidebar.collapsible:hover{width:280px;padding:3rem 2rem}.sidebar.collapsible .brand-name,.sidebar.collapsible .nav-text,.sidebar.collapsible .chevron-icon{opacity:0;max-width:0;overflow:hidden;white-space:nowrap;transition:opacity .15s ease,max-width .35s cubic-bezier(.4,0,.2,1)}.sidebar.collapsible:hover .brand-name,.sidebar.collapsible:hover .nav-text,.sidebar.collapsible:hover .chevron-icon{opacity:1;max-width:200px;transition:opacity .25s ease .1s,max-width .4s cubic-bezier(.4,0,.2,1)}.sidebar.collapsible .user-meta{display:flex;flex-direction:column;opacity:0;max-width:0;overflow:hidden;transition:opacity .15s ease,max-width .35s cubic-bezier(.4,0,.2,1)}.sidebar.collapsible:hover .user-meta{opacity:1;max-width:200px;transition:opacity .25s ease .1s,max-width .4s cubic-bezier(.4,0,.2,1)}.sidebar.collapsible .nav-item{gap:0;justify-content:flex-start;padding-left:1rem;transition:gap .4s cubic-bezier(.4,0,.2,1)}.sidebar.collapsible:hover .nav-item{gap:1rem;padding-left:1rem}.sidebar.collapsible .nav-item.active:before{left:-1.5rem}.sidebar.collapsible:hover .nav-item.active:before{left:-1rem}.sidebar.collapsible .logo{flex-shrink:0}.sidebar.collapsible .brand{gap:0;justify-content:flex-start;transition:gap .4s cubic-bezier(.4,0,.2,1)}.sidebar.collapsible:hover .brand{gap:1rem}.sidebar.collapsible .user-pill{padding:.75rem;justify-content:flex-start;gap:0;transition:padding .4s cubic-bezier(.4,0,.2,1),gap .4s cubic-bezier(.4,0,.2,1)}.sidebar.collapsible:hover .user-pill{padding:1rem;gap:.75rem}.sidebar.collapsible .user-avatar{flex-shrink:0}}@media (max-width: 900px){body{overflow-y:auto}.app{flex-direction:column;height:auto;overflow:visible}.sidebar{width:100%;height:auto;position:fixed;bottom:0;z-index:100;flex-direction:row;padding:.5rem 1rem;border-right:none;border-top:1px solid var(--color-border);background:#0a0908f2;backdrop-filter:blur(10px)}.sidebar .nav{display:none}.sidebar:not(.mobile-nav-ready) .nav{display:flex;flex-direction:row;justify-content:space-around;width:100%;gap:0}.brand,.sidebar-bottom{display:none}.mobile-tabs{display:none;width:100%}.sidebar.mobile-nav-ready .mobile-tabs{display:flex;justify-content:space-around;align-items:center}.nav-item{flex-direction:column;font-size:.65rem;padding:.5rem;gap:.2rem}.nav-icon{width:20px;height:20px}.nav-item.active:before{left:50%;top:-.5rem;transform:translate(-50%);width:24px;height:3px;border-radius:0 0 4px 4px}.main{height:auto;padding-bottom:72px}.header{padding:1rem 1.5rem}.scroll-container{padding:1.5rem;overflow:visible}.search input{width:100px}}.more-panel{position:fixed;inset:0;z-index:200}.more-panel.hidden{display:none}.more-backdrop{position:absolute;inset:0;background:#0009}.more-sheet{position:absolute;bottom:64px;left:0;right:0;background:var(--color-surface);border:1px solid var(--color-border);border-radius:16px 16px 0 0;padding:1.25rem 1rem 1.5rem;animation:slideUp .25s cubic-bezier(.4,0,.2,1)}.more-sheet-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.75rem}.more-sheet-header .serif{font-size:1.1rem}.more-nav-list{display:flex;flex-direction:column;gap:.25rem}.more-nav-item{display:flex;align-items:center;gap:1rem;padding:.875rem 1rem;text-decoration:none;color:var(--color-text-muted);border-radius:10px;transition:background .2s,color .2s;font-size:.95rem}.more-nav-item:hover{background:var(--color-primary-dim);color:var(--color-text)}.more-nav-item.active{color:var(--color-primary);background:var(--color-primary-dim)}.more-nav-item .nav-icon{opacity:.7}.more-nav-item:hover .nav-icon,.more-nav-item.active .nav-icon{opacity:1}.tab-editor{position:fixed;inset:0;z-index:300}.tab-editor.hidden{display:none}.tab-editor-sheet{position:absolute;bottom:0;left:0;right:0;background:var(--color-surface);border:1px solid var(--color-border);border-radius:16px 16px 0 0;padding:1.25rem 1rem 2rem;max-height:82vh;overflow-y:auto;animation:slideUp .25s cubic-bezier(.4,0,.2,1)}.editor-hint{font-size:.8rem;color:var(--color-text-muted);margin-bottom:1rem;line-height:1.5}.sortable-list{list-style:none;margin:0;padding:0}.sort-item{display:flex;align-items:center;gap:.875rem;padding:.875rem .5rem;border-bottom:1px solid var(--color-border);user-select:none;touch-action:none;transition:background .15s,opacity .15s;border-radius:8px}.sort-item:last-child{border-bottom:none}.sort-item.is-dragging{opacity:.4;background:var(--color-card)}.sort-position{font-size:.6rem;padding:.2rem .5rem;border-radius:100px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;min-width:38px;text-align:center;flex-shrink:0}.sort-position.in-bar{background:var(--color-primary-dim);color:var(--color-primary)}.sort-position.in-more{background:#ffffff0f;color:var(--color-text-muted)}.sort-item .nav-icon{opacity:.6;flex-shrink:0}.sort-label{flex-grow:1;font-size:.9rem;color:var(--color-text)}.drag-handle{color:var(--color-text-muted);cursor:grab;padding:.375rem;display:flex;align-items:center;opacity:.5;flex-shrink:0}.drag-handle:active{cursor:grabbing;opacity:1}.save-order-btn{width:100%;margin-top:1.25rem;padding:.875rem;border-radius:10px;font-size:.9rem}