.nav-transition{transition:all .25s ease}.navbar-height{height:var(--navbar-height,4rem)}.logo-container{align-items:center;color:#fff;display:flex;gap:.75rem;text-decoration:none}.logo-image{height:3rem;-o-object-fit:contain;object-fit:contain;transition:transform .3s ease;width:3rem}.logo-container:hover .logo-image{transform:scale(1.05)}.logo-text{font-size:1.125rem;font-weight:700;text-transform:capitalize}@media (max-width:768px){.logo-text{display:none}}.nav-link{align-items:center;color:#d1d5db;display:inline-flex;font-weight:500;position:relative;text-decoration:none;transition:color .2s ease}.nav-link:hover{color:#fff}.nav-link.active{color:#fff;font-weight:600}.nav-link:after{background-color:#fff;border-radius:9999px;bottom:-.25rem;content:"";height:.125rem;left:0;position:absolute;transition:width .3s ease;width:0}.nav-link:hover:after{width:100%}.nav-link.active:after{background-color:var(--primary-color,#3b82f6);width:100%}.header-button{align-items:center;background-color:transparent;border:none;border-radius:.375rem;color:#9ca3af;cursor:pointer;display:inline-flex;height:2.5rem;justify-content:center;transition:all .3s ease;width:2.5rem}.header-button:hover{background-color:rgba(31,41,55,.5);color:#fff;transform:scale(1.1)}.user-menu-trigger{align-items:center;background-color:transparent;border:none;border-radius:50%;color:var(--accent-foreground,#fff);cursor:pointer;display:inline-flex;height:2.5rem;justify-content:center;transition:all .2s ease;width:2.5rem}.user-menu-trigger:hover{background-color:var(--accent,#f1f5f9);color:var(--accent-foreground,#0f172a)}.user-avatar{align-items:center;background-color:var(--muted,#f1f5f9);border-radius:50%;display:flex;height:2.5rem;justify-content:center;transition:transform .2s ease;width:2.5rem}.user-menu-trigger:hover .user-avatar{transform:scale(1.05)}.user-dropdown-menu{backdrop-filter:blur(16px);background-color:hsla(0,0%,100%,.95);border:1px solid hsla(0,0%,100%,.4);border-radius:.5rem;box-shadow:0 25px 50px -12px rgba(0,0,0,.25);margin-top:.5rem;opacity:0;position:absolute;right:0;top:100%;transform:scale(.95);transform-origin:top right;transition:all .2s ease;visibility:hidden;width:20rem;z-index:50}.user-dropdown-menu.visible{opacity:1;transform:scale(1);visibility:visible}.user-info-header{border-radius:.5rem .5rem 0 0;cursor:pointer;padding:1rem;transition:background-color .2s ease}.user-info-header:hover{background-color:rgba(0,0,0,.05)}.user-info-avatar{align-items:center;background-color:var(--muted,#f1f5f9);border-radius:50%;display:flex;height:3rem;justify-content:center;transition:transform .2s ease;width:3rem}.user-info-header:hover .user-info-avatar{transform:scale(1.05)}.user-info-content{display:flex;flex:1;flex-direction:column;gap:.25rem}.user-name{color:var(--foreground,#0f172a);font-size:1rem;font-weight:600;letter-spacing:-.025em}.user-email{color:var(--muted-foreground,#64748b);font-size:.75rem;font-weight:500}.user-role-badge{align-items:center;background-color:rgba(243,244,246,.3);border-radius:.375rem;display:flex;gap:.25rem;padding:.125rem .375rem}.user-role-icon{color:#6b7280;height:.75rem;width:.75rem}.user-role-text{color:#374151;font-size:10px;font-weight:500;letter-spacing:.05em;text-transform:uppercase}.dropdown-separator{background-color:var(--muted,#f1f5f9);height:1px;margin:.375rem -.5rem}.dropdown-menu-item{align-items:center;border-radius:.375rem;color:var(--foreground,#0f172a);cursor:default;display:flex;gap:.5rem;padding:.75rem;text-decoration:none;transition:background-color .2s ease}.dropdown-menu-item:hover{background-color:rgba(0,0,0,.05)}.dropdown-menu-item.logout{color:#ef4444}.dropdown-menu-item.logout:hover{background-color:rgba(239,68,68,.1)}.dropdown-menu-icon{height:1rem;margin-right:.5rem;width:1rem}.dropdown-menu-text{font-weight:500;letter-spacing:-.025em}.search-modal{background-color:rgba(0,0,0,.8);display:none;inset:0;pointer-events:auto;position:fixed;z-index:50}.search-modal.visible{display:block}.search-modal-content{background-color:#131416;border:none;border-radius:.375rem;box-shadow:0 10px 15px -3px rgba(0,0,0,.1);display:grid;gap:.5rem;left:50%;max-width:calc(100% - 2rem);padding:.5rem;position:fixed;top:1rem;transform:translateX(-50%);width:100%;z-index:50}@media (min-width:640px){.search-modal-content{max-width:32rem}}@media (min-width:768px){.search-modal-content{top:2rem}}.search-modal-header{clip:rect(0,0,0,0);border:0;font-size:1.125rem;font-weight:600;height:1px;letter-spacing:-.025em;line-height:1;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}.search-input-container{align-items:center;display:flex;flex-direction:row;gap:.5rem}.search-input-wrapper{align-items:center;background-color:var(--input-background,#1f2937);border:1px solid var(--input-border,#374151);border-radius:9999px;box-sizing:border-box;display:flex;font-size:.875rem;height:3rem;padding:.5rem .75rem;width:100%}.search-input-icon{display:inline-block;height:1.25rem;margin-left:.5rem;width:1.25rem}.search-input-field{background-color:transparent;border:none;color:var(--foreground,#fff);font-size:1rem;outline:none;padding:.5rem;width:100%}.search-input-field::-moz-placeholder{color:var(--muted-foreground,#9ca3af)}.search-input-field::placeholder{color:var(--muted-foreground,#9ca3af)}.search-input-field:focus{outline:none}.search-close-btn{align-items:center;aspect-ratio:1;background-color:var(--secondary,#374151);border:none;border-radius:50%;color:var(--secondary-foreground,#fff);cursor:pointer;display:inline-flex;font-size:1rem;font-weight:600;height:3rem;justify-content:center;min-width:3rem;padding:0;transition:background-color .2s ease}.search-close-btn:hover{background-color:rgba(55,65,81,.9)}.search-content{border-radius:.375rem;display:flex;flex-direction:column;gap:.75rem;padding:.5rem}.trending-title{color:#f59e0b;font-size:.875rem;font-weight:700;line-height:1.25rem;margin-left:.25rem}.trending-comics{display:grid;gap:.75rem;grid-template-columns:repeat(1,1fr);margin-top:.5rem}.trending-comic-item{align-items:center;background-color:var(--background-content,#1f2937);border:1px solid var(--border,#374151);border-radius:.375rem;display:flex;flex-direction:column;gap:.5rem;justify-content:space-between;overflow:hidden;padding:.375rem;text-decoration:none;transition:all .2s ease;width:100%}@media (min-width:640px){.trending-comic-item{flex-direction:row}}.trending-comic-item:hover{background-color:rgba(59,130,246,.2);border-color:var(--primary,#3b82f6)}.trending-comic-content{align-items:center;display:flex;gap:.5rem;width:100%}.trending-comic-image{aspect-ratio:2/3;border-radius:.125rem;display:inline-flex;flex-shrink:0;overflow:hidden;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none;width:2rem}@media (min-width:768px){.trending-comic-image{width:2.5rem}}@media (min-width:1024px){.trending-comic-image{width:2.5rem}}.trending-comic-image img{color:transparent;height:100%;inset:0;-o-object-fit:cover;object-fit:cover;position:absolute;transition:all .2s ease;width:100%}.trending-comic-info{margin-bottom:.5rem;width:100%}.trending-comic-type{color:var(--muted-foreground,#9ca3af);font-weight:400;margin-bottom:.125rem;text-transform:capitalize}.trending-comic-title,.trending-comic-type{-webkit-line-clamp:1;-webkit-box-orient:vertical;display:-webkit-box;font-size:.75rem;line-height:1rem;overflow:hidden;text-overflow:ellipsis}.trending-comic-title{text-wrap:balance;color:var(--foreground,#fff);font-weight:500;line-height:1.2}.trending-comic-alt-title{-webkit-line-clamp:1;-webkit-box-orient:vertical;color:var(--muted-foreground,#9ca3af);display:-webkit-box;font-size:10px;font-weight:400;line-height:1rem;overflow:hidden;text-overflow:ellipsis}.show-more-btn{display:flex;justify-content:center;margin-bottom:1rem}.show-more-link{background:linear-gradient(90deg,#f59e0b,#f97316);border-radius:9999px;box-shadow:0 1px 2px 0 rgba(0,0,0,.05);color:#fff;font-weight:500;padding:.5rem 1rem;text-align:center;text-decoration:none;transition:opacity .2s ease}.show-more-link:hover{box-shadow:0 4px 6px -1px rgba(0,0,0,.1);opacity:.9}.notification-dropdown{tabindex:-1;backdrop-filter:blur(4px);background-color:rgba(17,24,39,.95);border:1px solid rgba(55,65,81,.5);border-radius:.75rem;box-shadow:0 1px 2px 0 rgba(0,0,0,.05);box-shadow:0 25px 50px -12px rgba(0,0,0,.25);color:var(--popover-foreground,#fff);display:none;min-width:8rem;overflow:hidden;padding:0;position:fixed;width:22rem;z-index:50}.notification-dropdown.visible{display:block}.notification-dropdown-header{align-items:center;background-color:rgba(17,24,39,.95);border-bottom:1px solid rgba(55,65,81,.5);display:flex;justify-content:space-between;padding:.75rem}.notification-header-content{align-items:center;display:flex;gap:.75rem}.notification-header-icon{position:relative}.notification-header-icon svg{color:#a78bfa;height:1.25rem;width:1.25rem}.notification-header-info h3{color:#fff;font-size:1rem;font-weight:600}.notification-header-info p{color:#9ca3af;font-size:.75rem}.notification-header-actions{align-items:center;display:flex;gap:.375rem}.notification-action-btn{align-items:center;background-color:transparent;border:none;border-radius:.375rem;color:#9ca3af;cursor:pointer;display:inline-flex;height:1.75rem;justify-content:center;padding:0;transition:all .2s ease;width:1.75rem}.notification-action-btn:hover{background-color:rgba(55,65,81,.8);color:#fff}.notification-action-btn svg{height:.875rem;width:.875rem}.notification-content{background-color:rgba(17,24,39,.95);max-height:25rem;overflow-y:auto}.notification-empty-state{padding:1.5rem;text-align:center}.notification-empty-state svg{color:#6b7280;height:2.5rem;margin:0 auto .5rem;width:2.5rem}.notification-empty-state h4{color:#9ca3af;font-size:.875rem;font-weight:500;margin-bottom:.25rem}.notification-empty-state p{color:#6b7280;font-size:.75rem}.notification-footer{background-color:rgba(31,41,55,.2);border-top:1px solid rgba(55,65,81,.5);padding:.75rem}.view-all-notifications-btn{align-items:center;background-color:var(--background,#0a0a0a);border:1px solid rgba(55,65,81,.5);border-radius:.5rem;color:#d1d5db;cursor:pointer;display:inline-flex;font-size:.875rem;font-weight:500;height:2.5rem;justify-content:center;padding:.5rem;text-decoration:none;transition:all .2s ease;white-space:nowrap;width:100%}.view-all-notifications-btn:hover{background-color:rgba(55,65,81,.5);color:#fff}.scroll-to-top-btn{align-items:center;background-color:var(--primary,#3b82f6);border:none;border-radius:50%;bottom:1rem;box-shadow:0 10px 15px -3px rgba(0,0,0,.1);color:var(--primary-foreground,#fff);cursor:pointer;display:inline-flex;font-size:.875rem;font-weight:500;height:2.5rem;justify-content:center;opacity:0;pointer-events:none;position:fixed;right:1rem;transform:translateY(.5rem);transition:all .3s ease;white-space:nowrap;width:2.5rem;z-index:50}.scroll-to-top-btn.visible{opacity:1;pointer-events:auto;transform:translateY(0)}.scroll-to-top-btn:hover{background-color:rgba(59,130,246,.9)}.scroll-to-top-btn svg{height:1.5rem;width:1.5rem}.mobile-menu-btn{align-items:center;background-color:transparent;border:none;border-radius:.125rem;cursor:pointer;display:flex;height:100%;justify-content:center;width:1.5rem}@media (min-width:768px){.mobile-menu-btn{display:none}}.mobile-menu-icon{align-items:center;color:inherit;display:flex;flex-direction:column;height:100%;justify-content:center;pointer-events:none;transition:opacity .15s ease;width:100%}.mobile-menu-icon:after,.mobile-menu-icon:before{background-color:currentColor;content:"";display:block;height:1px;transition:transform .15s ease;width:1.5rem}.mobile-menu-icon:before{transform:translateY(-.25rem) rotate(0deg)}.mobile-menu-icon:after{transform:translateY(.25rem) rotate(0deg)}.mobile-menu-btn[data-open=true] .mobile-menu-icon:before{transform:translateY(0) rotate(45deg)}.mobile-menu-btn[data-open=true] .mobile-menu-icon:after{transform:translateY(0) rotate(-45deg)}@media (max-width:768px){.nav-links{display:none}.user-dropdown-menu{width:16rem}.search-modal-content{margin:0 1rem}.notification-dropdown{left:auto;right:1rem;width:18rem}}.transition-all{transition:all .2s ease}.hover\:scale-105:hover{transform:scale(1.05)}.hover\:scale-110:hover{transform:scale(1.1)}.focus-visible\:outline-none:focus-visible{outline:none}.focus-visible\:ring-2:focus-visible{outline:2px solid var(--ring-color,#3b82f6);outline-offset:2px}.sr-only{clip:rect(0,0,0,0);border:0;height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}@media (prefers-color-scheme:dark){.user-dropdown-menu{background-color:rgba(0,0,0,.95);border-color:hsla(0,0%,100%,.1)}.search-modal-content{background-color:#0a0a0a}.notification-dropdown{background-color:rgba(0,0,0,.95);border-color:hsla(0,0%,100%,.1)}}
