body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.loader-container{align-items:center;display:flex;flex-direction:column;gap:12px;justify-content:center}.loader-spinner{animation:spin 1s linear infinite;border:3px solid #f3f3f3;border-radius:50%;border-top-color:#667eea}.loader-text{color:#666;font-size:14px;margin:0;text-align:center}.loader-small .loader-spinner{border-width:2px;height:20px;width:20px}.loader-small .loader-text{font-size:12px}.loader-medium .loader-spinner{border-width:3px;height:30px;width:30px}.loader-medium .loader-text{font-size:14px}.loader-large .loader-spinner{border-width:4px;height:50px;width:50px}.loader-large .loader-text{font-size:16px}.loader-xl .loader-spinner{border-width:6px;height:80px;width:80px}.loader-xl .loader-text{font-size:18px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.loader-overlay{align-items:center;background:#00000080;display:flex;height:100%;justify-content:center;left:0;position:fixed;top:0;width:100%;z-index:9999}.loader-overlay .loader-container{background:#fff;border-radius:10px;box-shadow:0 4px 20px #0003;padding:30px}.navbar{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#0003;border-bottom:1px solid #ffffff1a;height:80px;left:0;position:fixed;right:0;top:0;z-index:1000}.navbar-content{height:100%;justify-content:space-between;margin:0 auto;padding:0 1.5rem;position:relative}.nav-logo,.navbar-content{align-items:center;display:flex}.nav-logo{font-family:Montserrat,Quicksand,Arial,sans-serif;gap:5px;text-decoration:none;transition:transform .3s ease;z-index:1001}.logo-image{border-radius:4px;flex-shrink:0;height:32px;object-fit:contain;width:auto}.logo-text-vertical{display:flex;flex-direction:column;justify-content:center;line-height:1.05}.logo-thin{background:linear-gradient(90deg,#6ee7f7,#3ee8c7,#6ee7f7);-webkit-background-clip:text;background-clip:text;background-position:0 50%;background-size:200% 100%;font-weight:500;letter-spacing:.09em;margin-bottom:.05em}.logo-bold,.logo-thin{-webkit-text-fill-color:#0000;font-family:Montserrat,Quicksand,Arial,sans-serif;font-size:.9rem;text-transform:uppercase}.logo-bold{background:linear-gradient(45deg,#ff6b6b,#4ecdc4,#ff6b6b);-webkit-background-clip:text;background-clip:text;background-position:0 50%;background-size:200% 100%;font-weight:800;letter-spacing:.8em}.logo-divider{align-self:flex-start;background:linear-gradient(90deg,#6ee7f7,#ff6b6b);border-radius:1px;display:block;height:1px;margin:2px 0;width:78px}.nav-logo:hover{transform:scale(1.05)}.nav-links{align-items:center;display:flex;gap:1.5rem;height:100%}.nav-link{color:#fff;font-size:1rem;text-decoration:none;transition:color .3s ease}.nav-link:hover{color:#ff5252;cursor:pointer}.nav-icons{gap:1rem}.nav-icon,.nav-icons{align-items:center;display:flex;height:100%}.nav-icon{color:#fff;cursor:pointer;font-size:1.5rem;justify-content:center;line-height:1;text-decoration:none;transition:color .3s ease}.nav-icon:hover{color:#ff5252}.nav-icon-wrapper{position:relative}.nav-icon-wrapper,.profile-icon{align-items:center;display:flex;gap:.25rem;height:100%}.profile-icon{cursor:pointer}.dropdown-caret{transition:transform .3s ease}.dropdown-caret.open{transform:rotate(180deg)}.dropdown-menu{background-color:#282828;border:1px solid #ffffff1a;border-radius:.5rem;box-shadow:0 4px 15px #0000004d;display:flex;flex-direction:column;min-width:180px;overflow:hidden;position:absolute;right:0;top:calc(100% + .5rem);z-index:1001}.dropdown-item{color:#fff;cursor:pointer;font-size:.95rem;padding:.8rem 1rem;text-decoration:none;transition:background-color .2s ease,color .2s ease;white-space:nowrap}.dropdown-item:hover{background-color:#ffffff1a;color:#4ecdc4}.hamburger-menu{background:none;border:none;color:#fff;cursor:pointer;display:none;font-size:1.5rem;padding:.5rem;transition:color .3s ease;z-index:1001}.hamburger-menu:hover{color:#4ecdc4}.mobile-menu{background:#000000f2;display:block;left:0;max-height:calc(100vh - 80px);overflow-y:auto;padding:1rem;position:fixed;right:0;top:80px;transform:translateY(-100%);transition:transform .3s ease-in-out;z-index:1100}.mobile-menu.show{transform:translateY(0)}.mobile-menu-backdrop{background:#0006;bottom:0;left:0;position:fixed;right:0;top:0;z-index:1099}.mobile-menu .nav-links{display:flex;flex-direction:column;gap:1rem;padding:1rem 0}.mobile-menu .nav-link{border-bottom:1px solid #ffffff1a;font-size:1.1rem;padding:.8rem 0;text-align:center;width:100%}.mobile-user-menu{align-items:center;display:flex;flex-direction:column;gap:.5rem}.logout-link{color:#ff5252}.desktop-nav{align-items:center;display:flex}.mobile-notif-bell{display:none}@media (max-width:1024px){.navbar-content{padding:0 1rem}.logo-bold,.logo-thin{font-size:.85rem}.logo-divider{width:76px}}@media (max-width:768px){.hamburger-menu{display:block}.desktop-nav{display:none}.mobile-menu{display:block}.nav-logo{transform:scale(.9)}.logo-image{height:28px}.logo-bold,.logo-thin{font-size:.8rem}.logo-divider{width:70px}.cart-link{position:fixed;right:4.5rem;top:1.5rem}.mobile-user-menu .mobile-notifications{width:100%}.mobile-user-menu .mobile-notifications .notif-bell{background:#0000;border:none;border-bottom:1px solid #ffffff1a;color:#fff;font-size:1.1rem;font-weight:400;padding:.8rem 0;text-align:center;width:100%}.mobile-user-menu .mobile-notifications .notif-badge{margin-left:8px;position:static}.mobile-notif-bell{display:block;position:fixed;right:7.5rem;top:1.5rem;z-index:1100}.cart-count{right:-8px;top:-8px}}@media (max-width:480px){.navbar{height:70px}.navbar-content{padding:0 1rem}.nav-logo{transform:scale(.85)}.logo-image{height:24px}.logo-bold,.logo-thin{font-size:.75rem}.logo-divider{width:66px}.mobile-menu{max-height:calc(100vh - 70px);top:70px}.mobile-menu .nav-link{font-size:1rem;padding:.7rem 0}.cart-link{right:3.5rem;top:1.2rem}.mobile-notif-bell{right:6.3rem;top:1.2rem}}@media (hover:none){.dropdown-item,.nav-link{padding:.8rem}.dropdown-menu{padding:.5rem 0}.nav-icon{padding:.5rem}}.mobile-menu{animation:slideIn .3s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.navbar .hidden{display:none}.cart-link{height:100%;position:relative}.cart-count,.cart-link{align-items:center;display:flex}.cart-count{animation:popIn .3s ease-out;background-color:#f44;border-radius:50%;color:#fff;font-size:.75rem;font-weight:700;height:20px;justify-content:center;position:absolute;right:-10px;top:15px;width:20px}@keyframes popIn{0%{transform:scale(0)}50%{transform:scale(1.2)}to{transform:scale(1)}}@media (min-width:769px){.mobile-menu,.mobile-menu-backdrop{display:none!important}}.mobile-cart-count{align-items:center;background-color:#f44;border-radius:50%;color:#fff;display:flex;font-size:.8rem;font-weight:700;height:18px;justify-content:center;left:2.2rem;margin-left:4px;position:absolute;top:0;width:18px}.notif-bell-wrapper{position:relative;top:3px}.notif-bell{background:#0000;border:none;color:inherit;cursor:pointer;font-family:inherit;font-size:18px;font-weight:inherit;position:relative}.notif-icon{align-items:center;display:inline-flex}.notif-label{display:none;font-weight:inherit;margin-left:8px}.notif-badge{background:#ff4d4f;border-radius:10px;color:#fff;font-size:11px;line-height:16px;min-width:16px;padding:0 5px;position:absolute;right:-6px;text-align:center;top:-6px}.notif-panel-header{align-items:center;border-bottom:1px solid #ffffff1a;display:flex;font-weight:600;justify-content:space-between;padding:10px 12px}.notif-actions{display:flex;gap:8px}.np-btn{background:#0000;border:none;color:#666;cursor:pointer;font-size:14px}.notif-empty{color:#666;padding:16px;text-align:center}.notif-item{background-color:#282828;border-bottom:1px solid #ffffff1a;cursor:pointer;overflow:hidden;padding:12px 16px;position:relative;transition:background-color .2s ease}.notif-item:before{background:linear-gradient(90deg,#0000,#ffffff0d,#0000);content:"";height:100%;left:-100%;position:absolute;top:0;transition:.5s;width:100%}.notif-item:hover:before{left:100%}.notif-item:hover{background-color:#ffffff08}.notif-panel{background-color:#282828;border:1px solid #ffffff1a;border-radius:.5rem;box-shadow:0 4px 15px #0000004d;overflow:hidden;position:absolute;right:0;top:28px;width:320px;z-index:1200}.notif-list{border-radius:0 0 .5rem .5rem;max-height:360px;overflow:auto}.notif-item.read{opacity:.5}.ni-title{font-size:13px;font-weight:600}.ni-message{color:#b0b0b0;font-size:13px;margin-top:2px}.ni-meta{color:#888;font-size:11px;margin-top:4px}.notif-info{border-left:3px solid #1890ff}.notif-success{border-left:3px solid #52c41a}.notif-warning{border-left:3px solid #faad14}.notif-error{border-left:3px solid #ff4d4f}@media (max-width:1024px){.notif-panel{width:360px}}@media (max-width:768px){.notif-bell{align-items:center;display:flex;font-size:1.1rem}.notif-bell-wrapper{top:0;width:100%}.notif-bell:hover{color:#ff5252}.notif-icon{display:none}.notif-label{display:inline;font-family:inherit;font-weight:400;margin-left:0}.notif-backdrop{background:#00000080;inset:0;opacity:0;pointer-events:none;position:fixed;transition:opacity .2s ease;z-index:1190}.notif-backdrop.open{opacity:1;pointer-events:auto}.notif-panel{animation:notifSlideDown .22s ease-out forwards;box-shadow:0 12px 12px #0000004d;left:0;max-height:80vh;position:fixed;right:0;top:0;width:100%}.notif-list,.notif-panel{border-radius:0 0 12px 12px}.notif-list{max-height:calc(80vh - 56px)}}@media (max-width:480px){.notif-panel{max-height:85vh}}@keyframes notifSlideDown{0%{transform:translateY(-100%)}to{transform:translateY(0)}}.modal-overlay{align-items:center;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:2000}.modal-content{background-color:#1a1a1a;border-radius:8px;box-shadow:0 8px 25px #0006;color:#fff;max-width:400px;padding:2rem;position:relative;width:90%}.modal-content h2{color:#ff6b6b;font-size:1.8rem;margin-bottom:2rem;margin-top:0;text-align:center}.form-group{margin-bottom:1.5rem}.form-group label{color:#a0a0a0;display:block;font-size:1rem;font-weight:600;margin-bottom:.75rem}.form-group input{background-color:#333;border:1px solid #333;border-radius:4px;box-sizing:border-box;color:#fff;font-size:1rem;padding:1rem;width:100%}.form-group input:focus{border-color:#4ecdc4;box-shadow:0 0 0 3px #4ecdc466;outline:none}.error-message{color:#ff6b6b;font-size:.9rem;margin-top:.5rem;text-align:center}.modal-content button[type=submit]{background:linear-gradient(45deg,#ff6b6b,#4ecdc4);border:none;border-radius:4px;color:#fff;cursor:pointer;display:block;font-size:1.1rem;font-weight:600;margin-top:2rem;padding:1rem;transition:opacity .3s ease,transform .2s ease;width:100%}.modal-content button[type=submit]:hover{opacity:.9;transform:translateY(-2px)}.modal-content button[type=submit]:active{transform:translateY(0)}.close-button{background:none;border:none;color:#a0a0a0;cursor:pointer;font-size:1.5rem;position:absolute;right:15px;top:15px;transition:color .3s ease}.close-button:hover{color:#fff}.modal-content.initial{transform:translateY(-100vh)}.modal-content.animate{transform:translateY(0)}.modal-content.exit{transform:translateY(-100vh)}@media (max-width:600px){.modal-content{border-radius:6px;max-width:98vw;min-height:0;min-height:auto;padding:1rem;width:98%}.modal-content h2{font-size:1.2rem;margin-bottom:1.2rem}.form-group label{font-size:.95rem;margin-bottom:.5rem}.form-group input{font-size:.95rem;padding:.75rem}.modal-content button[type=submit]{font-size:1rem;margin-top:1.2rem;padding:.85rem}.close-button{font-size:1.2rem;right:10px;top:10px}}@media (min-width:601px) and (max-width:900px){.modal-content{max-width:350px;padding:1.5rem;width:80%}.modal-content h2{font-size:1.5rem}.form-group input{font-size:1rem;padding:.9rem}.modal-content button[type=submit]{font-size:1.05rem;padding:.95rem}}.user-modal-overlay{align-items:center;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:2000}.user-modal-content{background-color:#1a1a1a;border-radius:8px;box-shadow:0 8px 25px #0006;color:#fff;max-width:400px;padding:2rem;position:relative;width:90%}.user-modal-content h2{color:#ff6b6b;font-size:1.8rem;margin-bottom:2rem;margin-top:0;text-align:center}.user-form-group{margin-bottom:1.5rem}.user-form-group label{color:#a0a0a0;display:block;font-size:1rem;font-weight:600;margin-bottom:.75rem}.user-form-group input{background-color:#333;border:1px solid #333;border-radius:4px;box-sizing:border-box;color:#fff;font-size:1rem;padding:1rem;width:100%}.user-form-group input:focus{border-color:#4ecdc4;box-shadow:0 0 0 3px #4ecdc466;outline:none}.user-login-error-message{color:#ff6b6b;font-size:.9rem;margin-top:.5rem;text-align:center}.user-modal-content button[type=submit]{background:linear-gradient(45deg,#ff6b6b,#4ecdc4);border:none;border-radius:4px;color:#fff;cursor:pointer;display:block;font-size:1.1rem;font-weight:600;margin-top:2rem;padding:1rem;transition:opacity .3s ease,transform .2s ease;width:100%}.user-modal-content button[type=submit]:hover{opacity:.9;transform:translateY(-2px)}.user-modal-content button[type=submit]:active{transform:translateY(0)}.user-close-button{background:none;border:none;color:#a0a0a0;cursor:pointer;font-size:1.5rem;position:absolute;right:15px;top:15px;transition:color .3s ease}.user-close-button:hover{color:#fff}.user-modal-content.initial{transform:translateY(-100vh)}.user-modal-content.animate{transform:translateY(0)}.user-modal-content.exit{transform:translateY(-100vh)}.user-login-password-input-wrapper{position:relative}.user-login-password-input-wrapper input{padding-right:3rem}.password-toggle-icon{color:#a0a0a0;cursor:pointer;font-size:1.2rem;position:absolute;right:1rem;top:50%;transform:translateY(-50%);transition:color .3s ease}.password-toggle-icon:hover{color:#fff}.user-forgot-password-link{margin-top:1.5rem;text-align:center}.user-forgot-password-link a{color:#4ecdc4;font-size:.95rem;text-decoration:none;transition:color .3s ease}.user-forgot-password-link a:hover{color:#6ee7f7;text-decoration:underline}@media (max-width:600px){.user-modal-content{border-radius:6px;max-width:98vw;min-height:0;min-height:auto;padding:1rem;width:98%}.user-modal-content h2{font-size:1.2rem;margin-bottom:1.2rem}.user-form-group label{font-size:.95rem;margin-bottom:.5rem}.user-form-group input{font-size:.95rem;padding:.75rem}.user-modal-content button[type=submit]{font-size:1rem;margin-top:1.2rem;padding:.85rem}.user-forgot-password-link{margin-top:1rem}.password-toggle-icon{font-size:1.1rem;right:.7rem}.user-close-button{font-size:1.2rem;right:10px;top:10px}}@media (min-width:601px) and (max-width:900px){.user-modal-content{max-width:350px;padding:1.5rem;width:80%}.user-modal-content h2{font-size:1.5rem}.user-form-group input{font-size:1rem;padding:.9rem}.user-modal-content button[type=submit]{font-size:1.05rem;padding:.95rem}}.forgot-password-modal-overlay{align-items:center;background:#0009;bottom:0;display:flex;justify-content:center;left:0;padding:1rem;position:fixed;right:0;top:0;z-index:1000}.forgot-password-modal{background:#181818;border-radius:10px;box-shadow:0 8px 32px #0006;color:#fff;max-width:90vw;max-width:400px;min-width:320px;padding:2rem 2.5rem 1.5rem;position:relative;text-align:center;width:100%}.forgot-password-modal h2{color:#ff5c5c;font-size:1.8rem;margin-bottom:1rem}.forgot-password-modal label{display:block;font-size:1.05em;margin-bottom:.5rem;text-align:left}.forgot-password-modal input[type=email]{background:#232323;border:1px solid #333;border-radius:6px;box-sizing:border-box;color:#fff;font-size:1em;margin-bottom:1rem;padding:.6rem;width:100%}.forgot-password-modal button[type=submit]{background:linear-gradient(90deg,#ff5c5c,#1ed760);border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:1.1em;font-weight:700;margin-top:.5rem;padding:.7rem;transition:background .2s;width:100%}.forgot-password-modal button[type=submit]:disabled{cursor:not-allowed;opacity:.7}.forgot-password-success{color:#1ed760;font-size:.95em;line-height:1.4;margin-top:1rem}.forgot-password-error{color:#ff5c5c;font-size:.95em;line-height:1.4;margin-top:1rem}.close-btn{background:none;border:none;border-radius:50%;color:#fff;cursor:pointer;font-size:1.5em;padding:.5rem;position:absolute;right:16px;top:10px;transition:background-color .2s}.close-btn:hover{background-color:#ffffff1a}@media (max-width:768px){.forgot-password-modal-overlay{padding:.5rem}.forgot-password-modal{min-width:280px;padding:1.5rem 2rem 1rem}.forgot-password-modal h2{font-size:1.6rem;margin-bottom:.8rem}.forgot-password-modal label{font-size:1em}.forgot-password-modal input[type=email]{font-size:1em;padding:.7rem}.forgot-password-modal button[type=submit]{font-size:1em;padding:.8rem}}@media (max-width:480px){.forgot-password-modal-overlay{padding:.25rem}.forgot-password-modal{border-radius:8px;min-width:260px;padding:1.25rem 1.5rem 1rem}.forgot-password-modal h2{font-size:1.4rem;margin-bottom:.75rem}.forgot-password-modal label{font-size:.95em;margin-bottom:.4rem}.forgot-password-modal input[type=email]{font-size:.95em;margin-bottom:.8rem;padding:.6rem}.forgot-password-modal button[type=submit]{font-size:.95em;margin-top:.4rem;padding:.7rem}.forgot-password-error,.forgot-password-success{font-size:.9em;margin-top:.8rem}.close-btn{font-size:1.3em;padding:.4rem;right:12px;top:8px}}@media (max-width:360px){.forgot-password-modal{min-width:240px;padding:1rem 1.25rem .75rem}.forgot-password-modal h2{font-size:1.3rem;margin-bottom:.6rem}.forgot-password-modal label{font-size:.9em}.forgot-password-modal input[type=email]{font-size:.9em;padding:.5rem}.forgot-password-modal button[type=submit]{font-size:.9em;padding:.6rem}}.user-reg-modal-overlay{align-items:center;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:2000}.user-reg-modal-content{background-color:#1a1a1a;border-radius:8px;box-shadow:0 8px 25px #0006;color:#fff;max-width:400px;padding:2rem;position:relative;width:90%}.user-reg-modal-content h2{color:#ff6b6b;font-size:1.8rem;margin-bottom:2rem;margin-top:0;text-align:center}.user-reg-form-group{margin-bottom:1.5rem}.user-reg-form-group label{color:#a0a0a0;display:block;font-size:1rem;font-weight:600;margin-bottom:.75rem}.user-reg-form-group input{background-color:#333;border:1px solid #333;border-radius:4px;box-sizing:border-box;color:#fff;font-size:1rem;padding:1rem;width:100%}.user-reg-form-group input:focus{border-color:#4ecdc4;box-shadow:0 0 0 3px #4ecdc466;outline:none}.user-reg-error-message{color:#ff6b6b;font-size:.9rem;margin-top:.5rem;text-align:center}.user-reg-modal-content button[type=submit]{background:linear-gradient(45deg,#ff6b6b,#4ecdc4);border:none;border-radius:4px;color:#fff;cursor:pointer;display:block;font-size:1.1rem;font-weight:600;margin-top:2rem;padding:1rem;transition:opacity .3s ease,transform .2s ease;width:100%}.user-reg-modal-content button[type=submit]:hover{opacity:.9;transform:translateY(-2px)}.user-reg-modal-content button[type=submit]:active{transform:translateY(0)}.user-reg-close-button{background:none;border:none;color:#a0a0a0;cursor:pointer;font-size:1.5rem;position:absolute;right:15px;top:15px;transition:color .3s ease}.user-reg-close-button:hover{color:#fff}.user-reg-modal-content.initial{transform:translateY(-100vh)}.user-reg-modal-content.animate{transform:translateY(0)}.user-reg-modal-content.exit{transform:translateY(-100vh)}.user-reg-password-input-wrapper{position:relative}.user-reg-password-input-wrapper input{padding-right:3rem}.user-reg-password-toggle-icon{color:#a0a0a0;cursor:pointer;font-size:1.2rem;position:absolute;right:1rem;top:50%;transform:translateY(-50%);transition:color .3s ease}.user-reg-password-toggle-icon:hover{color:#fff}.forgot-password-link{margin-top:1.5rem;text-align:center}.forgot-password-link a{color:#4ecdc4;font-size:.95rem;text-decoration:none;transition:color .3s ease}.forgot-password-link a:hover{color:#6ee7f7;text-decoration:underline}.toggle-modal-link{margin-top:1.5rem;text-align:center}.toggle-modal-link a{color:#4ecdc4;font-size:.95rem;text-decoration:none;transition:color .3s ease}.toggle-modal-link a:hover{color:#6ee7f7;text-decoration:underline}@media (max-width:600px){.user-reg-modal-content{border-radius:6px;max-width:98vw;min-height:0;min-height:auto;padding:1rem;width:98%}.user-reg-modal-content h2{font-size:1.2rem;margin-bottom:1.2rem}.user-reg-form-group label{font-size:.95rem;margin-bottom:.5rem}.user-reg-form-group input{font-size:.95rem;padding:.75rem}.user-reg-modal-content button[type=submit]{font-size:1rem;margin-top:1.2rem;padding:.85rem}.forgot-password-link,.toggle-modal-link{margin-top:1rem}.user-reg-password-toggle-icon{font-size:1.1rem;right:.7rem}.user-reg-close-button{font-size:1.2rem;right:10px;top:10px}}@media (min-width:601px) and (max-width:900px){.user-reg-modal-content{max-width:350px;padding:1.5rem;width:80%}.user-reg-modal-content h2{font-size:1.5rem}.user-reg-form-group input{font-size:1rem;padding:.9rem}.user-reg-modal-content button[type=submit]{font-size:1.05rem;padding:.95rem}}.notification{align-items:center;border-radius:6px;box-shadow:0 2px 12px #0000002e;color:#fff;display:flex;font-size:1.05em;justify-content:space-between;left:50%;max-width:90vw;min-width:260px;padding:16px 40px 16px 20px;position:fixed;top:100px;transform:translateX(-50%);z-index:100001}.notification-success{background:#4caf50}.notification-error{background:#f44336}.notification-close-btn{background:#0000;border:none;color:#fff;cursor:pointer;font-size:1.3em;margin-left:18px;opacity:.7;transition:opacity .2s}.notification-close-btn:focus,.notification-close-btn:hover{opacity:1;outline:none}@keyframes fadeInDown{0%{opacity:0;transform:translateX(-50%) translateY(-30px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}@media (max-width:480px){.notification{border-radius:4px;box-sizing:border-box;font-size:.98em;left:50%;max-width:95vw;min-width:0;min-width:auto;padding:12px 16px 12px 14px;top:70px;width:95vw}.notification-close-btn{font-size:1.5em;margin-left:10px;padding:0 4px}}.notifications-banner{align-items:center;display:flex;font-size:14px;justify-content:space-between;padding:10px 14px;position:-webkit-sticky;position:sticky;top:80px;z-index:999}.nb-info{background:#e6f4ff;border-bottom:1px solid #b6daff;color:#084298}.nb-success{background:#e9f9ee;border-bottom:1px solid #a6e9c1;color:#0f5132}.nb-warning{background:#fff4e5;border-bottom:1px solid #ffd699;color:#663c00}.nb-error{background:#fdecea;border-bottom:1px solid #f5c2c7;color:#842029}.nb-message{flex:1 1}.nb-close{background:#0000;border:none;color:inherit;cursor:pointer;font-size:18px}@media (max-width:480px){.notifications-banner{top:70px}}.audio-player-bar-outer{bottom:0;left:0;position:fixed;right:0;z-index:1000}.audio-player-bar{align-items:center;background:#111;box-shadow:0 -2px 8px #2525254d;color:#fff;display:flex;gap:16px;height:64px;padding:0 24px}.audio-player-bar-cover{border-radius:8px;height:48px;margin-right:12px;object-fit:cover;transition:opacity .3s ease;width:48px}.audio-player-bar-cover.loading{animation:pulse 1.5s ease-in-out infinite;opacity:.6}@keyframes pulse{0%{opacity:.6}50%{opacity:.8}to{opacity:.6}}.audio-player-bar-info{display:flex;flex:1 1;flex-direction:column;gap:5px;justify-content:center;min-width:0;overflow:hidden}.audio-player-bar-title{font-size:1.1em;font-weight:700}.audio-player-bar-artist,.audio-player-bar-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.audio-player-bar-artist{color:#aaa;font-size:.95em}.audio-player-bar-controls{align-items:center;display:flex;gap:8px;height:48px}.audio-player-bar-controls button{align-items:center;background:none;border:none;color:#fff;cursor:pointer;display:flex;font-size:1.5em;height:40px;justify-content:center;margin:0 4px;padding:0;transition:color .2s;vertical-align:middle;width:40px}.audio-player-bar-controls button:disabled{cursor:not-allowed;opacity:.5}.audio-player-bar-controls button:hover{color:#1db954}.audio-player-bar-progress-container{align-items:center;background:#111;box-sizing:border-box;display:flex;gap:8px;padding:0 24px 8px;width:100%}.audio-player-bar-time{color:#bbb;font-size:.95em;min-width:38px;text-align:center}.audio-player-bar-progress-bar{background:#333;border-radius:4px;cursor:pointer;flex:1 1;height:6px;overflow:hidden;position:relative}.audio-player-bar-progress{background:#1db954;border-radius:4px;height:100%;transition:width .2s linear}@media (max-width:900px){.audio-player-bar{padding:0 24px}.audio-player-bar-progress-container{padding:0 24px 6px}}@media (max-width:600px){.audio-player-bar{gap:8px;height:56px;padding:0 8px}.audio-player-bar-cover{height:40px;margin-right:8px;width:40px}.audio-player-bar-title{font-size:.8em}.audio-player-bar-artist{font-size:.7em}.audio-player-bar-controls button{font-size:1.2em;margin:0 2px}.audio-player-bar-progress-container{gap:4px;padding:0 12px 4px}.audio-player-bar-time{font-size:.85em;min-width:28px}}@media (max-width:400px){.audio-player-bar-artist,.audio-player-bar-title{font-size:.85em;line-height:1.1;max-width:100%;overflow:visible;text-overflow:clip;white-space:normal;word-break:break-word}.audio-player-bar-controls button{font-size:1.1em;height:32px;width:32px}.audio-player-bar-cover{height:32px;margin-right:6px;width:32px}}@tailwind base;@tailwind components;@tailwind utilities;body,html{background-color:#1a1a1a;color:#fff;margin:0;padding:0}.App{text-align:center}.App-logo{height:40vmin;pointer-events:none}@media (prefers-reduced-motion:no-preference){.App-logo{animation:App-logo-spin 20s linear infinite}}.App-header{align-items:center;background-color:#282c34;color:#fff;display:flex;flex-direction:column;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh}.App-link{color:#61dafb}@keyframes App-logo-spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.app{background:#1a1a1a;min-height:100vh}.homepage,.track-upload-container{padding-top:80px}