.header{position:sticky;top:0;z-index:100;background:#fffffff2;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--color-border-subtle)}.header-container{max-width:1280px;margin:0 auto;padding:0 24px;height:64px;display:flex;align-items:center;justify-content:space-between;gap:32px}.logo{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0}.logo-mark{width:36px;height:36px;display:flex;align-items:center;justify-content:center}.logo-mark svg{width:100%;height:100%}.logo-text{font-size:1.375rem;font-weight:700;background:linear-gradient(135deg,#7c3aed,#a855f7);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.02em}.search-wrapper{flex:1;max-width:480px}.search-form{position:relative;display:flex;align-items:center}.search-icon{position:absolute;left:14px;width:18px;height:18px;color:var(--color-text-tertiary);pointer-events:none}.search-input{width:100%;height:42px;padding:0 44px;background:var(--color-bg-tertiary);border:1px solid transparent;border-radius:12px;font-size:.9375rem;color:var(--color-text-primary);outline:none;transition:all .2s ease}.search-input::placeholder{color:var(--color-text-tertiary)}.search-input:hover{background:var(--color-bg-hover)}.search-input:focus{background:#fff;border-color:var(--color-brand-primary);box-shadow:0 0 0 3px #7c3aed1f}.search-shortcut{position:absolute;right:12px;padding:2px 8px;background:#fff;border:1px solid var(--color-border-default);border-radius:6px;font-size:.75rem;font-family:var(--font-mono);color:var(--color-text-tertiary);pointer-events:none}.header-actions{display:flex;align-items:center;gap:8px;flex-shrink:0}.create-btn{display:flex;align-items:center;gap:6px;height:38px;padding:0 16px;background:var(--color-bg-tertiary);border:1px solid var(--color-border-default);border-radius:10px;font-size:.875rem;font-weight:500;color:var(--color-text-primary);text-decoration:none;transition:all .15s ease}.create-btn svg{width:16px;height:16px}.create-btn:hover{background:var(--color-bg-hover);border-color:var(--color-border-strong)}.icon-btn{position:relative;width:40px;height:40px;display:flex;align-items:center;justify-content:center;background:transparent;border:none;border-radius:10px;color:var(--color-text-secondary);cursor:pointer;transition:all .15s ease}.icon-btn svg{width:20px;height:20px}.icon-btn:hover{background:var(--color-bg-hover);color:var(--color-text-primary)}.notification-badge{position:absolute;top:4px;right:4px;min-width:18px;height:18px;padding:0 5px;background:#ef4444;border-radius:9px;font-size:.6875rem;font-weight:600;color:#fff;display:flex;align-items:center;justify-content:center}.user-menu{position:relative;display:flex;align-items:center;gap:4px;padding:4px 8px 4px 4px;border-radius:24px;cursor:pointer;transition:background .15s ease}.user-menu:hover{background:var(--color-bg-hover)}.user-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#7c3aed,#a855f7);display:flex;align-items:center;justify-content:center;overflow:hidden}.user-avatar img{width:100%;height:100%;object-fit:cover}.user-avatar span{font-size:.8125rem;font-weight:600;color:#fff}.chevron{width:16px;height:16px;color:var(--color-text-tertiary);transition:transform .2s ease}.chevron.rotate{transform:rotate(180deg)}.dropdown{position:absolute;top:calc(100% + 8px);right:0;width:260px;background:#fff;border:1px solid var(--color-border-default);border-radius:16px;box-shadow:0 12px 48px #0000001f;overflow:hidden;z-index:1000}.dropdown-user{display:flex;align-items:center;gap:12px;padding:16px;background:linear-gradient(135deg,#7c3aed0f,#a855f708);border-bottom:1px solid var(--color-border-subtle)}.dropdown-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,#7c3aed,#a855f7);display:flex;align-items:center;justify-content:center;overflow:hidden;flex-shrink:0}.dropdown-avatar img{width:100%;height:100%;object-fit:cover}.dropdown-avatar span{font-size:1rem;font-weight:600;color:#fff}.dropdown-info{display:flex;flex-direction:column;min-width:0}.dropdown-name{font-size:.9375rem;font-weight:600;color:var(--color-text-primary);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dropdown-handle{font-size:.8125rem;color:var(--color-text-tertiary)}.dropdown-section{padding:8px;border-bottom:1px solid var(--color-border-subtle)}.dropdown-section:last-child{border-bottom:none}.dropdown-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;background:none;border:none;border-radius:10px;font-size:.875rem;color:var(--color-text-secondary);text-decoration:none;cursor:pointer;transition:all .15s ease}.dropdown-item svg{width:18px;height:18px;flex-shrink:0}.dropdown-item:hover{background:var(--color-bg-hover);color:var(--color-text-primary)}.dropdown-item.admin-item{color:var(--color-brand-primary)}.dropdown-item.admin-item:hover{background:#7c3aed14;color:var(--color-brand-primary)}.dropdown-item.logout-item{color:#dc2626}.dropdown-item.logout-item:hover{background:#dc262614;color:#dc2626}.login-btn{height:38px;padding:0 18px;display:flex;align-items:center;font-size:.875rem;font-weight:500;color:var(--color-text-primary);text-decoration:none;border-radius:10px;transition:all .15s ease}.login-btn:hover{background:var(--color-bg-hover)}.signup-btn{height:38px;padding:0 20px;display:flex;align-items:center;background:linear-gradient(135deg,#7c3aed,#9333ea);border-radius:10px;font-size:.875rem;font-weight:600;color:#fff;text-decoration:none;transition:all .2s ease;box-shadow:0 2px 8px #7c3aed40}.signup-btn:hover{transform:translateY(-1px);box-shadow:0 4px 16px #7c3aed59}.dropdown-enter-active,.dropdown-leave-active{transition:all .2s ease}.dropdown-enter-from,.dropdown-leave-to{opacity:0;transform:translateY(-8px) scale(.96)}.footer{margin-top:auto;background:var(--color-bg-primary);border-top:1px solid var(--color-border-default)}.footer-container{max-width:1280px;margin:0 auto;padding:48px 24px 32px}.footer-grid{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:48px;padding-bottom:40px;border-bottom:1px solid var(--color-border-subtle)}.footer-brand-col{display:flex;flex-direction:column;gap:16px}.footer-logo{display:flex;align-items:center;gap:10px;text-decoration:none}.footer-logo-icon{width:28px;height:28px}.footer-logo span{font-size:1.25rem;font-weight:700;color:var(--color-text-primary)}.footer-description{font-size:.875rem;color:var(--color-text-secondary);line-height:1.6;max-width:280px}.footer-social{display:flex;align-items:center;gap:12px;margin-top:8px}.social-link{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:var(--color-bg-tertiary);color:var(--color-text-secondary);transition:all .2s ease}.social-link:hover{background:var(--color-text-primary);color:#fff}.social-link svg{width:18px;height:18px}.footer-links-col{display:flex;flex-direction:column;gap:16px}.footer-col-title{font-size:.8125rem;font-weight:600;color:var(--color-text-primary);text-transform:uppercase;letter-spacing:.5px;margin:0}.footer-links{display:flex;flex-direction:column;gap:12px}.footer-links a{font-size:.875rem;color:var(--color-text-secondary);text-decoration:none;transition:color .15s ease}.footer-links a:hover{color:var(--color-text-primary)}.footer-bottom{display:flex;align-items:center;justify-content:space-between;padding-top:24px}.footer-copyright{font-size:.8125rem;color:var(--color-text-tertiary)}.footer-bottom-links{display:flex;align-items:center;gap:24px}.footer-bottom-links a{font-size:.8125rem;color:var(--color-text-tertiary);text-decoration:none;transition:color .15s ease}.footer-bottom-links a:hover{color:var(--color-text-secondary)}@media(max-width:768px){.header-container{padding:0 16px;gap:16px}.search-wrapper,.create-btn span{display:none}.create-btn{width:40px;padding:0;justify-content:center}.footer-grid{grid-template-columns:1fr 1fr;gap:32px}.footer-brand-col{grid-column:1 / -1;align-items:center;text-align:center}.footer-description{max-width:100%}.footer-social{justify-content:center}.footer-links-col{align-items:center;text-align:center}.footer-bottom{flex-direction:column;gap:16px;text-align:center}}
