.header{z-index:100;background:var(--header-bg);width:100%;color:var(--header-text);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--header-border,var(--border-subtle));box-shadow:var(--shadow-md);transition:border-color .3s,box-shadow .3s;position:sticky;top:0}.header-container{justify-content:space-between;align-items:center;width:100%;max-width:1400px;margin:0 auto;padding:14px 2rem;display:flex}.logo{align-items:center;gap:10px;text-decoration:none;transition:opacity .2s;display:flex}.logo:hover{opacity:.9}.logo-image{border:2px solid var(--border-hover);object-fit:cover;border-radius:10px;width:36px;height:36px;transition:border-color .2s,transform .2s}.logo:hover .logo-image{border-color:var(--accent-primary);transform:scale(1.02)}.logo-text{letter-spacing:1.2px;color:var(--header-text);-webkit-text-fill-color:var(--header-text);background:0 0;background-clip:unset;font-size:20px;font-weight:800}.nav{align-items:center;gap:8px;display:flex;position:relative}.nav-btn{width:40px;height:40px;color:var(--header-text);cursor:pointer;background:0 0;border:none;border-radius:10px;justify-content:center;align-items:center;transition:all .2s;display:flex;position:relative}.nav-icon{width:20px;height:20px}.notification-btn{position:relative}.notification-badge{background:var(--success);width:16px;height:16px;color:var(--primary-foreground);border-radius:9999px;justify-content:center;align-items:center;font-size:10px;font-weight:700;display:flex;position:absolute;top:4px;right:4px}.nav-btn:hover{background:var(--overlay-hover);border-color:var(--border-subtle);color:var(--header-text);transform:translateY(-1px)}.nav-btn.active{background:var(--accent-primary-dim);border-color:var(--border-hover);color:var(--text-primary)}.avatar-small{object-fit:cover;border-radius:50%;width:32px;height:32px}.avatar-placeholder-small{border-radius:50%;justify-content:center;align-items:center;display:flex}.avatar-placeholder-small svg{width:20px;height:20px;color:var(--foreground)}.light .avatar-placeholder-small svg{color:var(--primary-foreground)}.header-dropdown-right{margin-right:0}.dropdown{background:var(--card);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--border-subtle);min-width:190px;box-shadow:var(--shadow-xl);border-radius:16px;animation:.2s ease-out dropdown-in;position:absolute;top:calc(100% + 12px);right:0;overflow:hidden}@keyframes dropdown-in{0%{opacity:0;transform:translate(20px)translateY(8px)scale(.95)}to{opacity:1;transform:translate(0)translateY(0)scale(1)}}.search-form{flex:1;align-items:center;gap:8px;max-width:36rem;padding:12px;display:none}@media (min-width:1024px){.search-form{display:flex}}.search-input{padding:var(--spacing-md) var(--spacing-lg);background:var(--card-bg);border:1px solid var(--border-subtle);border-radius:var(--radius-md);color:var(--text-primary);font-size:var(--text-sm);transition:all var(--transition-normal);outline:none;flex:1}.search-input:focus{border-color:var(--accent-primary);background:var(--card-bg-hover);box-shadow:0 0 0 3px var(--accent-primary-dim)}.search-btn{background:linear-gradient(135deg, var(--accent-primary), var(--accent-primary-hover));width:36px;height:36px;color:var(--primary-foreground);cursor:pointer;border:none;border-radius:10px;flex-shrink:0;justify-content:center;align-items:center;transition:all .2s;display:flex}.search-btn:hover:not(:disabled){box-shadow:0 4px 12px var(--accent-primary-dim);transform:scale(1.05)}.search-btn:disabled{opacity:.5;cursor:not-allowed}.search-icon{width:16px;height:16px}.header-search-panel{background:var(--card);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border:1px solid var(--border-subtle);min-width:280px;max-width:90vw;box-shadow:var(--shadow-xl);z-index:100;border-radius:12px;align-items:center;gap:8px;padding:10px 12px;animation:.2s ease-out mobile-search-in;display:flex;position:absolute;top:calc(100% + 8px);right:0}.mobile-search{background:var(--card);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--border-subtle);z-index:50;padding:12px 16px;animation:.2s ease-out mobile-search-in;display:flex;position:absolute;top:100%;left:0;right:0}@keyframes mobile-search-in{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.menu-content{flex-direction:column;display:flex}.menu-header{border-bottom:1px solid var(--border-subtle);padding:10px}.menu-header span{text-transform:uppercase;letter-spacing:2px;color:var(--foreground);margin-left:10px;font-size:16px;font-weight:600}.user-header{background:var(--card-bg);border-bottom:1px solid var(--border-subtle);align-items:center;gap:12px;padding:16px;display:flex}.avatar-wrapper{flex-shrink:0;position:relative}.avatar{object-fit:cover;border:2px solid var(--border-hover);width:48px;height:48px;box-shadow:0 0 10px var(--accent-primary-dim), 0 0 20px var(--accent-primary-dim);border-radius:50%;transition:all .3s}.avatar-vip{animation:2s ease-in-out infinite alternate vip-glow;box-shadow:0 0 15px #fbbf2466,0 0 30px #fbbf2433,inset 0 0 20px #fbbf241a;border:3px solid #fbbf2499!important}@keyframes vip-glow{0%{border-color:#fbbf2499;box-shadow:0 0 15px #fbbf2466,0 0 30px #fbbf2433,inset 0 0 20px #fbbf241a}to{border-color:#fbbf24e6;box-shadow:0 0 25px #fbbf2499,0 0 50px #fbbf244d,inset 0 0 30px #fbbf2426}}.avatar-placeholder{color:#fff;border:2px solid #3b82f666;border-radius:50%;justify-content:center;align-items:center;width:48px;height:48px;font-size:20px;font-weight:700;transition:all .3s;display:flex;box-shadow:0 0 10px #3b82f64d,0 0 20px #3b82f626}.avatar-placeholder-vip{animation:2s ease-in-out infinite alternate vip-glow;box-shadow:0 0 15px #fbbf2466,0 0 30px #fbbf2433,inset 0 0 20px #fbbf241a;background:linear-gradient(135deg,#fbbf24,#f59e0b)!important;border:3px solid #fbbf2499!important}.avatar-icon{width:20px;height:20px;color:var(--foreground)}.light .avatar-icon{color:var(--primary-foreground)}.user-info{flex-direction:column;gap:4px;min-width:0;display:flex}.user-name{color:var(--foreground);text-overflow:ellipsis;white-space:nowrap;font-size:15px;font-weight:600;overflow:hidden}.light .user-name{color:var(--primary-foreground)}.user-role{color:var(--text-muted);align-items:center;gap:4px;font-size:12px;display:flex}.user-role svg{color:var(--text-secondary)}.user-role-icon{width:12px;height:12px;color:var(--text-secondary);flex-shrink:0}.menu-links{flex-direction:column;gap:4px;padding:8px;display:flex}.menu-link{color:var(--text-secondary);text-align:left;border-radius:10px;align-items:center;gap:12px;width:100%;padding:12px 14px;font-size:14px;font-weight:500;text-decoration:none;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative}.menu-link:hover{background:var(--card-bg-hover);color:var(--foreground);padding-left:18px;transform:translate(4px)}.light .menu-link:hover{color:var(--primary-foreground)}.light .menu-link{color:var(--text-secondary)}.menu-link svg{opacity:.7;flex-shrink:0;width:16px;height:16px}.menu-link:hover svg{opacity:1}.menu-link.active{background:var(--accent-primary-dim)!important;color:var(--text-primary)!important;font-weight:600!important}.menu-link.active svg{color:var(--text-primary)!important;opacity:1!important}.menu-icon{flex-shrink:0;width:16px;height:16px}.menu-link span{text-align:left;white-space:nowrap;text-overflow:ellipsis;flex:1;line-height:1.5;overflow:hidden}.vip-link{color:var(--text-primary)!important;background:linear-gradient(135deg,#fbbf2426 0%,#f59e0b26 100%)!important;border:2px solid #fbbf2480!important;position:relative!important;overflow:hidden!important;box-shadow:0 0 10px #fbbf2433,inset 0 0 10px #fbbf241a!important}.vip-link:before{content:"";background:linear-gradient(90deg,#0000,#fbbf244d,#0000);width:100%;height:100%;transition:left .5s;position:absolute;top:0;left:-100%}.vip-link:hover:before{left:100%}.vip-link:hover{color:var(--text-primary)!important;background:linear-gradient(135deg,#fbbf2440 0%,#f59e0b40 100%)!important;border-color:#fbbf24cc!important;transform:translate(4px)scale(1.02)!important;box-shadow:0 0 20px #fbbf2466,inset 0 0 15px #fbbf2433!important}.vip-link svg{color:var(--text-primary)!important;opacity:1!important;filter:drop-shadow(0 0 4px #fbbf2499)!important}.signup-link{background:linear-gradient(135deg,#3b82f61a 0%,#6366f11a 100%);border:1px solid #3b82f633}.signup-link:hover{background:linear-gradient(135deg,#3b82f633 0%,#6366f133 100%);border-color:#3b82f666}.logout-btn{color:var(--text-primary);cursor:pointer;background:#ef44441a;border:1px solid #ef444433;border-radius:10px;justify-content:center;align-items:center;gap:8px;width:calc(100% - 16px);margin:8px;padding:12px;font-size:14px;font-weight:500;transition:all .2s;display:flex}.logout-btn:hover:not(:disabled){background:#ef444433;border-color:#ef444466}.logout-btn:disabled{opacity:.6;cursor:not-allowed}.spinner{animation:1s linear infinite spin}.notification-dropdown{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#1a1f2ef2;border:1px solid #ffffff1a;border-radius:16px;width:320px;padding:0}.notification-header{border-bottom:1px solid #ffffff1a;justify-content:space-between;align-items:center;padding:12px 16px;display:flex}.notification-title{color:var(--primary-foreground);margin:0;font-size:14px;font-weight:600}.notification-view-all{color:var(--text-secondary);font-size:12px;text-decoration:none;transition:-webkit-text-decoration .2s,text-decoration .2s}.notification-view-all:hover{text-decoration:underline}.notification-empty{text-align:center;color:#fff9;padding:16px;font-size:14px}@media (max-width:768px){.header-container{padding:10px 1rem}.logo-image{width:38px;height:38px}.logo-text{font-size:18px}.nav{gap:6px}.nav-btn{width:36px;height:36px}.search-form{padding:16px}.menu-links{padding:0 8px}.menu-link{padding:10px 12px}}@media (max-width:480px){.header-container{padding:8px .75rem}.logo-image{width:34px;height:34px}.logo-text{letter-spacing:1px;font-size:16px}.nav-btn{width:34px;height:34px}}.nav-btn:focus-visible{outline-offset:2px;outline:2px solid #3b82f6}.menu-link:focus-visible{outline-offset:-2px;outline:2px solid #3b82f6}.search-input:focus-visible{outline:none}.logout-btn:focus-visible{outline-offset:2px;outline:2px solid #ef4444}[data-slot=dropdown-menu-content]{-webkit-backdrop-filter:blur(20px)!important;transform-origin:100% 0!important;background:linear-gradient(#1e293bfa 0%,#0f172afa 100%)!important;border:1px solid #ffffff1a!important;border-radius:16px!important;max-width:calc(100vw - 24px)!important;margin-top:8px!important;padding:0!important;animation:.3s cubic-bezier(.4,0,.2,1) dropdown-in!important;left:auto!important;right:0!important;box-shadow:0 20px 40px #0006!important}[data-slot=dropdown-menu-content] button[data-slot=button]{color:#fffc!important;cursor:pointer!important;background:0 0!important;border:none!important;border-radius:10px!important;justify-content:flex-start!important;gap:12px!important;width:100%!important;margin:0!important;padding:12px 14px!important;font-size:14px!important;font-weight:500!important;transition:all .2s!important}[data-slot=dropdown-menu-content] button[data-slot=button]:hover{color:var(--primary-foreground)!important;background:#ffffff14!important;transform:translate(4px)!important}[data-slot=dropdown-menu-content] button[data-slot=button] svg{opacity:.7!important;flex-shrink:0!important;width:1rem!important;height:1rem!important}[data-slot=dropdown-menu-content] button[data-slot=button]:hover svg{opacity:1!important}[data-slot=dropdown-menu-content] button[data-slot=button][class*=bg-amber]{color:var(--text-primary)!important;background:linear-gradient(135deg,#fbbf241a 0%,#f59e0b1a 100%)!important;border:1px solid #fbbf2433!important}[data-slot=dropdown-menu-content] button[data-slot=button][class*=bg-amber]:hover{background:linear-gradient(135deg,#fbbf2433 0%,#f59e0b33 100%)!important;border-color:#fbbf2466!important}[data-slot=dropdown-menu-content] button[data-slot=button][class*=bg-amber] svg{color:var(--text-primary)!important}[data-slot=dropdown-menu-content] button[data-slot=button][class*=bg-primary],[data-slot=dropdown-menu-content] .menu-link.active{color:var(--text-primary)!important;background:#3b82f633!important}[data-slot=dropdown-menu-content] button[data-slot=button][class*=bg-primary]:hover,[data-slot=dropdown-menu-content] .menu-link.active:hover{color:var(--text-primary)!important;background:#3b82f64d!important}[data-slot=dropdown-menu-content] .menu-link{color:#fffc!important;text-align:left!important;box-sizing:border-box!important;border-radius:10px!important;align-items:center!important;gap:12px!important;width:100%!important;padding:12px 14px!important;font-size:14px!important;font-weight:500!important;text-decoration:none!important;transition:all .3s cubic-bezier(.4,0,.2,1)!important;display:flex!important;position:relative!important}[data-slot=dropdown-menu-content] .menu-link:hover{color:var(--primary-foreground)!important;background:#ffffff14!important;padding-left:18px!important;transform:translate(4px)!important}[data-slot=dropdown-menu-content] .menu-link svg{opacity:.7!important;flex-shrink:0!important;width:16px!important;height:16px!important}[data-slot=dropdown-menu-content] .menu-link:hover svg{opacity:1!important}[data-slot=dropdown-menu-content] .menu-link span{text-align:left!important;white-space:nowrap!important;text-overflow:ellipsis!important;flex:1!important;line-height:1.5!important;overflow:hidden!important}[data-slot=dropdown-menu-content] .menu-link.vip-link{color:var(--text-primary)!important;background:linear-gradient(135deg,#fbbf2426 0%,#f59e0b26 100%)!important;border:2px solid #fbbf2480!important;position:relative!important;overflow:hidden!important;box-shadow:0 0 10px #fbbf2433,inset 0 0 10px #fbbf241a!important}[data-slot=dropdown-menu-content] .menu-link.vip-link:before{content:""!important;z-index:0!important;background:linear-gradient(90deg,#0000,#fbbf244d,#0000)!important;width:100%!important;height:100%!important;transition:left .5s!important;position:absolute!important;top:0!important;left:-100%!important}[data-slot=dropdown-menu-content] .menu-link.vip-link:hover:before{left:100%!important}[data-slot=dropdown-menu-content] .menu-link.vip-link:hover{color:var(--text-primary)!important;background:linear-gradient(135deg,#fbbf2440 0%,#f59e0b40 100%)!important;border-color:#fbbf24cc!important;padding-left:18px!important;transform:translate(4px)scale(1.02)!important;box-shadow:0 0 20px #fbbf2466,inset 0 0 15px #fbbf2433!important}[data-slot=dropdown-menu-content] .menu-link.vip-link svg,[data-slot=dropdown-menu-content] .menu-link.vip-link span{z-index:1!important;position:relative!important}[data-slot=dropdown-menu-content] .menu-link.vip-link svg{color:var(--text-primary)!important;opacity:1!important;filter:drop-shadow(0 0 4px #fbbf2499)!important}[data-slot=dropdown-menu-content] button[data-slot=button][class*=bg-red]{color:var(--text-primary)!important;background:#ef44441a!important;border:1px solid #ef444433!important}[data-slot=dropdown-menu-content] button[data-slot=button][class*=bg-red]:hover{background:#ef444433!important;border-color:#ef444466!important}[data-slot=dropdown-menu-content]>div:first-child{background:#ffffff08!important;border-bottom:1px solid #ffffff14!important;align-items:center!important;gap:12px!important;padding:16px!important;display:flex!important}[data-slot=dropdown-menu-content]>div:first-child img,[data-slot=dropdown-menu-content]>div:first-child>div:first-child{object-fit:cover!important;border:2px solid #3b82f666!important;border-radius:50%!important;flex-shrink:0!important;width:48px!important;height:48px!important;transition:all .3s!important;box-shadow:0 0 10px #3b82f64d,0 0 20px #3b82f626!important}[data-slot=dropdown-menu-content]>div:first-child img.avatar-vip,[data-slot=dropdown-menu-content]>div:first-child>div:first-child.avatar-placeholder-vip{border:3px solid #fbbf2499!important;animation:2s ease-in-out infinite alternate vip-glow!important;box-shadow:0 0 15px #fbbf2466,0 0 30px #fbbf2433,inset 0 0 20px #fbbf241a!important}[data-slot=dropdown-menu-content]>div:first-child>div:first-child[class*=gradient]{background:linear-gradient(135deg,#3b82f6,#8b5cf6)!important;justify-content:center!important;align-items:center!important;display:flex!important}[data-slot=dropdown-menu-content]>div:first-child>div:last-child{flex-direction:column!important;flex:1!important;gap:4px!important;min-width:0!important;display:flex!important}[data-slot=dropdown-menu-content]>div:first-child p:first-child{color:var(--primary-foreground)!important;text-overflow:ellipsis!important;white-space:nowrap!important;margin:0!important;font-size:15px!important;font-weight:600!important;overflow:hidden!important}[data-slot=dropdown-menu-content]>div:first-child p:last-child{color:#ffffff80!important;align-items:center!important;gap:4px!important;margin:0!important;font-size:12px!important;display:flex!important}[data-slot=dropdown-menu-content]>div:first-child p:last-child svg{color:var(--text-primary)!important}[data-slot=dropdown-menu-content]>div:not(:first-child):not(:last-child){padding:8px!important}[data-slot=dropdown-menu-content] .menu-links{flex-direction:column!important;gap:4px!important;padding:8px!important;display:flex!important}[data-slot=dropdown-menu-content]>div[class*=border-t]{border-top:1px solid #ffffff14!important;margin-top:0!important;padding:8px!important}