@keyframes skeleton-pulse-9ae74ca9{0%,to{opacity:1}50%{opacity:.4}}.skeleton-product-card[data-v-9ae74ca9]{background-color:#fff;border-radius:12px;overflow:hidden;box-shadow:0 2px 8px #00000014;transition:transform .3s ease,box-shadow .3s ease}.skeleton-product-image[data-v-9ae74ca9]{width:100%;height:180px;background-color:#e8e8e8;animation:skeleton-pulse-9ae74ca9 1.5s ease-in-out infinite}.skeleton-product-info[data-v-9ae74ca9]{padding:15px;display:flex;flex-direction:column;gap:10px}.skeleton-text[data-v-9ae74ca9]{background-color:#e8e8e8;border-radius:4px;animation:skeleton-pulse-9ae74ca9 1.5s ease-in-out infinite}.skeleton-product-title[data-v-9ae74ca9]{height:18px;width:70%}.skeleton-product-desc[data-v-9ae74ca9]{height:14px;width:90%}.skeleton-product-price[data-v-9ae74ca9]{height:20px;width:50%;margin-top:5px}*{margin:0;padding:0;box-sizing:border-box;font-family:"Exo 2",sans-serif}input:focus,textarea:focus,select:focus,button:focus{outline:none!important;box-shadow:none!important}body{background-color:#f5f9ff;color:#333;line-height:1.6;max-width:100vw;overflow-x:hidden;padding-bottom:80px}h1,h2,h3,h4{font-family:Orbitron,sans-serif;font-weight:700}.main-content{padding:20px;max-width:1200px;margin:0 auto}.tab-content{display:none}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.tab-content.with-animation{animation:fadeIn .2s ease}.tab-content.active{display:block}.home-header{display:flex;justify-content:space-between;align-items:center;padding:15px 0;margin-bottom:15px}.header-right{display:flex;align-items:center;gap:15px}.greeting-section{display:flex;align-items:center;gap:14px}.greeting-icon-wrap{width:44px;height:44px;border-radius:14px;display:flex;align-items:center;justify-content:center;flex-shrink:0}.greeting-icon{font-size:1.2rem}.greeting-icon.fa-sun{color:#f59e0b}.greeting-icon.fa-moon{color:#6e8efb}.greeting-icon-wrap:has(.fa-sun){background:#fef9ee}.greeting-icon-wrap:has(.fa-moon){background:#eef2ff}.greeting-text{display:flex;flex-direction:column;gap:2px}.greeting-top{display:flex;align-items:baseline}.greeting-hello{font-size:.95rem;color:#1a1a2e;font-weight:700}.greeting-time-row{display:flex;align-items:center;gap:4px}.greeting-time-icon{font-size:.6rem;color:#94a3b8}.greeting-time{font-size:.68rem;color:#94a3b8;font-weight:500;font-variant-numeric:tabular-nums;letter-spacing:.5px}.notification-btn{position:relative;width:42px;height:42px;background-color:#e3f2fd;border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:all .3s ease}.notification-btn:hover{background-color:#bbdefb;transform:scale(1.05)}.notification-btn i{font-size:1.2rem;color:#1e88e5}.notification-badge{position:absolute;top:-2px;right:-2px;background-color:#e53935;color:#fff!important;font-size:.7rem;font-weight:600;min-width:18px;height:18px;border-radius:9px;display:flex;justify-content:center;align-items:center;padding:0 5px}.header-avatar{width:42px;height:42px;background:linear-gradient(135deg,#4dabf7,#1e88e5);border-radius:50%;display:flex;justify-content:center;align-items:center;cursor:pointer;transition:all .3s ease}.header-avatar:hover{transform:scale(1.05);box-shadow:0 4px 15px #4dabf766}.header-avatar i{font-size:1.2rem;color:#fff}.header-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}.notification-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:1500;opacity:0;visibility:hidden;transition:all .3s ease}.notification-overlay.active{opacity:1;visibility:visible}.notification-panel{position:absolute;top:0;right:-100%;width:100%;max-width:400px;height:100%;background-color:#fff;box-shadow:-5px 0 30px #0003;transition:all .3s ease;display:flex;flex-direction:column}.notification-overlay.active .notification-panel{right:0}.notification-header{background:#fff;color:#333;padding:15px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e8e8e8}.notification-header h3{font-size:18px;display:flex;align-items:center;gap:10px;margin:0}.notification-header h3 i{color:#1677ff}.notification-close{background:none;border:none;color:#1677ff;font-size:18px;cursor:pointer;padding:8px;transition:all .3s ease}.notification-close:hover{opacity:.8}.notification-content{flex:1;overflow-y:auto;padding:0 15px 15px}.notification-item{display:flex;gap:15px;padding:15px;border-radius:12px;margin-bottom:10px;background-color:#f5f9ff;transition:all .3s ease;cursor:pointer}.notification-item:hover{background-color:#e3f2fd;transform:translate(5px)}.notification-item.unread{background-color:#fff;border-left:3px solid #1e88e5;box-shadow:0 2px 10px #1e3c721a}.notification-icon{width:45px;height:45px;border-radius:50%;display:flex;justify-content:center;align-items:center;font-size:1.1rem;flex-shrink:0}.notification-icon.system{background-color:#e3f2fd;color:#1e88e5}.notification-icon.order{background-color:#fff3e0;color:#ff9800}.notification-info{flex:1}.notification-info h4{font-size:.95rem;color:#1e3c72;margin-bottom:5px}.notification-info p{font-size:.85rem;color:#666;line-height:1.5;margin-bottom:5px}.notification-time{font-size:.75rem;color:#999}.notification-footer{padding:15px 20px;border-top:1px solid #e0e0e0}.mark-all-read{width:100%;padding:12px;background-color:#e3f2fd;border:none;border-radius:10px;color:#1e88e5;font-weight:600;cursor:pointer;transition:all .3s ease}.mark-all-read:hover{background-color:#1e88e5;color:#fff}.settings-overlay,.wallet-overlay,.join-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#00000080;z-index:1500;opacity:0;visibility:hidden;transition:all .3s ease}.settings-overlay.active,.wallet-overlay.active,.join-overlay.active{opacity:1;visibility:visible}.settings-panel,.wallet-panel,.join-panel{position:absolute;top:0;right:-100%;width:100%;max-width:400px;height:100%;background-color:#f5f9ff;box-shadow:-5px 0 30px #0003;transition:all .3s ease;display:flex;flex-direction:column}.settings-overlay.active .settings-panel,.wallet-overlay.active .wallet-panel,.join-overlay.active .join-panel{right:0}.settings-header,.wallet-page-header,.join-header,.settings-page .page-header,.join-page .page-header,.member-page .page-header{background:#fff;color:#333;padding:15px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e8e8e8}.settings-header h3,.wallet-page-header h3,.join-header h3,.settings-page .page-header h3,.join-page .page-header h3,.member-page .page-header h3{font-size:18px;display:flex;align-items:center;gap:10px;margin:0}.settings-header h3 i,.wallet-page-header h3 i,.join-header h3 i,.settings-page .page-header h3 i,.join-page .page-header h3 i,.member-page .page-header h3 i{color:#1677ff}.settings-close,.wallet-close,.join-close{background:none;border:none;color:#1677ff;font-size:18px;cursor:pointer;padding:8px;transition:all .3s ease}.settings-close:hover,.wallet-close:hover,.join-close:hover{opacity:.8}.settings-content{flex:1;overflow-y:auto;padding:20px}.settings-section{background:#fff;border-radius:12px;padding:20px;margin-bottom:20px;box-shadow:0 2px 10px #1e3c7214}.settings-section h4{color:#1e3c72;font-size:1rem;margin-bottom:15px;padding-bottom:10px;border-bottom:1px solid #e0e0e0}.avatar-change-box{display:flex;flex-direction:column;align-items:center;padding:20px 0;margin-bottom:15px}.avatar-preview{width:80px;height:80px;border-radius:50%;overflow:hidden;border:3px solid #1e88e5;margin-bottom:12px}.avatar-preview img{width:100%;height:100%;object-fit:cover}.change-avatar-btn{padding:8px 20px;background-color:#e3f2fd;color:#1e88e5;border:none;border-radius:20px;font-size:.9rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:6px;transition:all .3s ease}.change-avatar-btn:hover{background-color:#1e88e5;color:#fff}.settings-item{margin-bottom:15px}.settings-item:last-child{margin-bottom:0}.settings-item label{display:block;color:#666;font-size:.9rem;margin-bottom:8px}.settings-input-group input{width:100%;padding:12px 15px;border:1px solid #e0e0e0;border-radius:8px;font-size:1rem;transition:all .3s ease}.settings-input-group input:focus{outline:none;border-color:#1e88e5;box-shadow:0 0 0 3px #1e88e51a}.settings-hint{font-size:.8rem;color:#ff9800;margin-top:8px;margin-bottom:0}.uid-item .uid-display{display:flex;align-items:center;gap:10px;background-color:#f5f9ff;padding:12px 15px;border-radius:8px;border:1px solid #e0e0e0}.uid-display span{font-size:1.1rem;font-weight:600;color:#1e3c72;font-family:Orbitron,monospace}.copy-uid-btn{background:none;border:none;color:#1e88e5;cursor:pointer;padding:5px;font-size:1rem;transition:all .3s ease}.copy-uid-btn:hover{color:#1565c0;transform:scale(1.1)}.settings-footer{margin-top:20px;padding:20px;background:#fff;border-radius:12px;box-shadow:0 2px 10px #1e3c7214}.save-settings-btn{width:100%;padding:14px;background:linear-gradient(135deg,#1e3c72,#2a5298);color:#fff;border:none;border-radius:10px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.save-settings-btn:hover{transform:translateY(-2px);box-shadow:0 5px 20px #1e3c724d}.wallet-page-content,.settings-page-content,.settings-content,.join-page-content,.member-page-content,.member-content{flex:1;overflow-y:auto;padding:0 20px 20px}.wallet-page,.settings-page,.join-page{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#f5f7fa;z-index:100;display:flex;flex-direction:column}.member-page{background-color:#f5f7fa;min-height:100vh;display:flex;flex-direction:column}.wallet-balance-card{background:#fff;border-radius:16px;padding:25px;color:#1e3c72;margin-bottom:20px;box-shadow:0 4px 15px #1e3c721a;border:1px solid #e0e0e0}.balance-info{text-align:center;margin-bottom:20px}.balance-title{font-size:.9rem;color:#666}.balance-value{display:flex;align-items:baseline;justify-content:center;gap:5px;margin-top:10px}.balance-value .currency{font-size:1.5rem;color:#1e88e5}.balance-value .amount{font-size:2.5rem;font-weight:700;font-family:Orbitron,sans-serif;color:#1e88e5}.wallet-quick-actions{display:flex;gap:15px}.quick-action-btn{flex:1;padding:12px;border:none;border-radius:25px;font-size:1rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .3s ease}.quick-action-btn.recharge{background-color:#1e88e5;color:#fff}.quick-action-btn.recharge:hover{background-color:#1976d2;transform:translateY(-2px)}.quick-action-btn.withdraw{background-color:#f5f5f5;color:#1e3c72;border:1px solid #e0e0e0}.quick-action-btn.withdraw:hover{background-color:#e0e0e0;transform:translateY(-2px)}.wallet-records{background:#fff;border-radius:12px;padding:20px;box-shadow:0 2px 10px #1e3c7214}.wallet-records h4{color:#1e3c72;font-size:1rem;margin-bottom:15px;padding-bottom:10px;border-bottom:1px solid #e0e0e0}.record-item{display:flex;align-items:center;gap:15px;padding:12px 0;border-bottom:1px solid #f0f0f0}.record-item:last-child{border-bottom:none}.record-icon{width:40px;height:40px;border-radius:50%;display:flex;justify-content:center;align-items:center;font-size:1rem}.record-icon.expense{background-color:#ffebee;color:#e53935}.record-icon.income{background-color:#e8f5e9;color:#43a047}.record-method{display:block;color:#666;font-size:.85rem;margin-top:4px}.record-info{flex:1}.record-title{display:block;color:#333;font-size:.95rem;margin-bottom:4px}.record-time{font-size:.8rem;color:#999}.record-amount{font-weight:600;font-size:1rem}.record-amount.expense{color:#e53935}.record-amount.income{color:#43a047}.recharge-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000073;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:2200;display:flex;justify-content:center;align-items:flex-end;opacity:0;visibility:hidden;transition:all .3s ease;padding-bottom:80px}.recharge-overlay.active{opacity:1;visibility:visible}.recharge-panel{width:100%;max-width:480px;max-height:75vh;background:#f7fbff;border-radius:20px 20px 0 0;overflow:hidden;display:flex;flex-direction:column;transform:translateY(30px);transition:transform .3s ease}.recharge-overlay.active .recharge-panel{transform:translateY(0)}.recharge-header{background:linear-gradient(135deg,#1e3c72,#2a5298);color:#fff;padding:18px 20px;display:flex;align-items:center;justify-content:space-between;flex-shrink:0}.recharge-header h3{margin:0;font-size:1.1rem;font-weight:700;display:flex;align-items:center;gap:10px}.recharge-close{background:transparent;border:none;color:#fff;font-size:1.2rem;cursor:pointer}.recharge-content{flex:1;overflow-y:auto;padding:12px 16px}.recharge-section{background:#fff;border-radius:12px;padding:14px;box-shadow:0 2px 10px #1e3c7214;margin-bottom:12px}.recharge-section h4{margin:0 0 10px;color:#1e3c72;font-size:1rem;font-weight:700}.recharge-amount-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.amount-chip{border:1px solid #d7e3ff;background:#f6f9ff;color:#1e3c72;border-radius:10px;padding:10px 8px;font-weight:700;font-size:.95rem;cursor:pointer}.amount-chip.active{background:linear-gradient(135deg,#1e88e5,#1565c0);border-color:transparent;color:#fff}.recharge-custom{margin-top:10px}.recharge-custom label{display:block;margin-bottom:8px;font-size:.9rem;font-weight:600;color:#1e3c72}.recharge-input-group{display:flex;align-items:center;border:1px solid #e0e0e0;border-radius:10px;padding:10px 12px;gap:8px}.recharge-input-group .prefix{color:#1e3c72;font-weight:700}.recharge-input-group input{border:none;outline:none;flex:1;font-size:1rem;background:transparent}.pay-method-list{display:grid;grid-template-columns:1fr;gap:10px}.pay-method{width:100%;border:1px solid #e0e0e0;background:#fff;border-radius:10px;padding:12px;display:flex;align-items:center;justify-content:space-between;cursor:pointer}.pay-method-left{display:inline-flex;align-items:center;gap:10px;font-weight:700;color:#1e3c72}.pay-method .fa-check{opacity:0;color:#1e88e5}.pay-method.active{border-color:#1e88e5;box-shadow:0 6px 18px #1e88e52e}.pay-method.active .fa-check{opacity:1}.recharge-summary{background:#fff;border-radius:0;padding:12px 16px;box-shadow:none;border-top:1px solid rgba(30,60,114,.08);border-bottom:1px solid rgba(30,60,114,.08);flex-shrink:0}.recharge-summary .summary-row{display:flex;align-items:center;justify-content:space-between;color:#1e3c72;font-weight:700}.recharge-summary .summary-amount{color:#1565c0;font-size:1.1rem}.recharge-footer{padding:16px;background:#f7fbff;flex-shrink:0}.recharge-confirm-btn{width:100%;border:none;border-radius:14px;padding:16px;min-height:56px;background:linear-gradient(135deg,#43a047,#2e7d32);color:#fff;font-size:1.05rem;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center}.recharge-confirm-btn:disabled{opacity:.6;cursor:not-allowed}@media (min-width: 768px){.recharge-panel{border-radius:20px;align-self:center}.recharge-overlay{align-items:center;padding:20px}}.member-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#00000073;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);z-index:2300;display:flex;justify-content:center;align-items:flex-end;opacity:0;visibility:hidden;transition:all .3s ease}.member-overlay.active{opacity:1;visibility:visible}.member-panel{width:100%;max-width:480px;height:88vh;background:#f7fbff;border-radius:20px 20px 0 0;overflow:hidden;display:flex;flex-direction:column;transform:translateY(30px);transition:transform .3s ease}.member-overlay.active .member-panel{transform:translateY(0)}.member-header{background:linear-gradient(135deg,#1e3c72,#2a5298);color:#fff;padding:18px 20px;display:flex;align-items:center;justify-content:space-between}.member-header h3{margin:0;font-size:1.1rem;font-weight:800;display:flex;align-items:center;gap:10px}.member-close{background:transparent;border:none;color:#fff;font-size:1.2rem;cursor:pointer}.member-content{flex:1;overflow-y:auto;padding:0 18px 18px}.member-card{background:linear-gradient(135deg,#1e88e5,#1565c0);color:#fff;border-radius:16px;padding:16px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 8px 22px #1565c038;margin-bottom:14px}.member-card-left{display:flex;gap:12px;align-items:center}.member-badge{width:44px;height:44px;border-radius:14px;background:#ffffff2e;display:flex;align-items:center;justify-content:center;font-size:1.2rem}.member-title{font-size:.85rem;opacity:.9}.member-level{font-size:1.15rem;font-weight:900;margin-top:4px}.member-expire{font-size:.82rem;opacity:.9;margin-top:4px}.member-card-right{text-align:right}.member-price{font-size:1.2rem;font-weight:900}.member-price-tip{font-size:.8rem;opacity:.9}.member-section{background:#fff;border-radius:14px;padding:16px;box-shadow:0 2px 10px #1e3c7214;margin-bottom:14px}.member-section h4{margin:0 0 12px;color:#1e3c72;font-size:1rem;font-weight:800}.member-benefits{list-style:none;padding:0;margin:0;display:grid;gap:10px}.member-benefits li{display:flex;align-items:center;gap:10px;color:#1e3c72;font-weight:600}.member-benefits i{color:#43a047}.member-progress-bar{width:100%;height:10px;border-radius:999px;background:#eef4ff;overflow:hidden}.member-progress-inner{height:100%;background:linear-gradient(135deg,#ffb300,#ff6f00);width:0%;transition:width .25s ease}.member-progress-meta{margin-top:10px;display:flex;justify-content:space-between;color:#1e3c72;font-weight:700;font-size:.9rem}.member-desc{margin:0 0 12px;color:#666;font-size:.92rem}.member-level-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.member-level-item{border:1px solid #e6eefc;background:#f6f9ff;border-radius:12px;padding:12px 10px;text-align:center;color:#1e3c72}.member-level-item span{display:block;font-weight:900}.member-level-item small{display:block;margin-top:4px;opacity:.75;font-weight:700}.member-level-item.active{background:linear-gradient(135deg,#ffb300,#ff6f00);border-color:transparent;color:#fff}.member-level-item.active small{opacity:.9}.member-footer{padding:14px 18px 22px;background:#f7fbff;border-top:1px solid rgba(30,60,114,.08)}.member-action-btn{width:100%;border:none;border-radius:14px;padding:14px 16px;background:linear-gradient(135deg,#ffb300,#ff6f00);color:#fff;font-size:1.05rem;font-weight:900;cursor:pointer}@media (min-width: 768px){.member-panel{height:78vh;border-radius:20px;align-self:center}.member-overlay{align-items:center;padding:20px}}.join-content{flex:1;overflow-y:auto;padding:20px}.join-banner{background:#fff;border-radius:16px;padding:0;text-align:center;color:#1e3c72;margin-bottom:20px;box-shadow:0 2px 10px #1e3c7214;overflow:hidden}.join-banner i{display:none}.join-banner{aspect-ratio:16 / 9}.join-banner-logo{width:100%;height:100%;display:block;object-fit:cover}.join-banner h4{font-size:1.2rem;margin-bottom:8px}.join-banner p{font-size:.9rem;opacity:.8}.join-form{background:#fff;border-radius:12px;padding:20px;margin-bottom:20px;box-shadow:0 2px 10px #1e3c7214}.join-form-item{margin-bottom:15px}.join-form-item:last-child{margin-bottom:0}.join-form-item label{display:block;color:#1e3c72;font-size:.9rem;font-weight:600;margin-bottom:8px}.join-form-item label i{margin-right:8px;color:#1e88e5}.join-form-item input,.join-form-item textarea{width:100%;padding:12px 15px;border:1px solid #e0e0e0;border-radius:8px;font-size:1rem;transition:all .3s ease}.join-form-item input:focus,.join-form-item textarea:focus{outline:none;border-color:#1e88e5;box-shadow:0 0 0 3px #1e88e51a}.join-form-item textarea{min-height:80px;resize:vertical}.join-benefits{background:#fff;border-radius:12px;padding:20px;box-shadow:0 2px 10px #1e3c7214}.join-benefits h4{color:#1e3c72;font-size:1rem;margin-bottom:15px}.benefit-list{display:flex;flex-direction:column;gap:12px}.benefit-item{display:flex;align-items:center;gap:12px;padding:10px 15px;background-color:#f5f9ff;border-radius:8px}.benefit-item i{font-size:1.2rem;color:#1e88e5}.benefit-item span{color:#333;font-size:.95rem}.join-footer{margin-top:20px;padding:20px;background:#fff;border-radius:12px;box-shadow:0 2px 10px #1e3c7214}.submit-join-btn{width:100%;padding:14px;background:linear-gradient(135deg,#43a047,#66bb6a);color:#fff;border:none;border-radius:10px;font-size:1.1rem;font-weight:600;cursor:pointer;transition:all .3s ease}.submit-join-btn:hover{transform:translateY(-2px);box-shadow:0 5px 20px #43a04766}.hero-section{display:flex;flex-wrap:wrap;gap:0;margin-bottom:40px;background:linear-gradient(135deg,#1a1a2e,#16213e,#0f3460);border-radius:15px;padding:0;box-shadow:0 8px 20px #1e3c721a;overflow:hidden;width:100%;max-height:280px}.hero-text{flex:1;min-width:300px}.hero-title{font-size:2.5rem;color:#1e3c72;margin-bottom:10px}.hero-subtitle{font-size:1.3rem;color:#4dabf7;margin-bottom:20px}.hero-description{margin-bottom:25px;color:#555;font-size:1.1rem;line-height:1.8}.cta-button{background:linear-gradient(to right,#4dabf7,#1e88e5);color:#fff;border:none;padding:14px 28px;font-size:1.1rem;border-radius:30px;cursor:pointer;display:flex;align-items:center;gap:10px;transition:all .3s ease;font-weight:600;box-shadow:0 4px 15px #4dabf766}.cta-button:hover{transform:translateY(-3px);box-shadow:0 6px 20px #4dabf799}.hero-logo{width:100%;display:flex;justify-content:center;align-items:center}.club-logo{width:100%;height:280px;display:block;border-radius:15px;transition:all .4s ease;object-fit:cover;object-position:center}.club-logo:hover{transform:scale(1.02);filter:brightness(1.05)}@keyframes float{0%{transform:translateY(0)}50%{transform:translateY(-15px)}to{transform:translateY(0)}}.features{margin-bottom:40px}.quick-nav{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:28px;padding:0 4px}.quick-nav-item{display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;-webkit-tap-highlight-color:transparent}.quick-nav-item:active .quick-nav-icon{transform:scale(.92)}.quick-nav-icon{width:50px;height:50px;border-radius:16px;display:flex;align-items:center;justify-content:center;overflow:hidden;background:#e8edf3;transition:transform .15s ease}.quick-nav-img{width:100%;height:100%;object-fit:cover;object-position:center}.quick-nav-text{font-size:1rem;font-weight:700;color:#3b82f6}.quick-nav-label{font-size:.78rem;color:#374151;font-weight:600;white-space:nowrap}.section-title{font-size:1.8rem;color:#4dabf7;margin-bottom:0;padding-bottom:10px;border-bottom:none;display:inline-block}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;border-bottom:none;padding-bottom:10px}.section-header .section-title{border-bottom:none;padding-bottom:0;margin-bottom:0}.view-all{color:#999;font-size:1.1rem;font-weight:700;text-decoration:none;display:flex;align-items:center;gap:5px;transition:all .3s ease;white-space:nowrap}.view-all:hover,.view-all:active{color:#4dabf7}.view-all i{font-size:.75rem}.products-grid{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:8px!important;transform:translateZ(0);will-change:contents}.product-card{background-color:#fff;border-radius:8px;overflow:hidden;box-shadow:0 2px 8px #1e3c720f;transition:all .3s ease;cursor:pointer;display:flex;flex-direction:column}.product-card:hover{transform:translateY(-2px);box-shadow:0 6px 12px #1e3c721a}.product-image{width:100%;aspect-ratio:1;overflow:hidden;display:flex;justify-content:center;align-items:center;background:linear-gradient(135deg,#1a1a2e,#16213e);border-radius:8px 8px 0 0}.product-image img{width:100%;height:100%;object-fit:cover}.product-info{padding:6px 8px;text-align:left;display:flex;flex-direction:column;gap:2px}.product-info h4{color:#1e3c72;font-size:.9rem;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.product-info p{color:#666;font-size:.8rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.product-price{color:#e53935;font-size:1rem;font-weight:700;margin-top:2px}@media (max-width: 480px){.products-grid{display:grid!important;grid-template-columns:repeat(2,1fr)!important;gap:6px!important}.product-card{border-radius:6px}.product-image{aspect-ratio:1;border-radius:6px 6px 0 0}.product-info{padding:5px 6px}.product-info h4{font-size:.85rem}.product-info p{font-size:.75rem}.product-price{font-size:.95rem}.section-header{flex-wrap:nowrap}.section-header .section-title{font-size:1.4rem}.view-all{font-size:.95rem}}.products-section{margin-bottom:28px;padding-top:6px;padding-bottom:6px}@media (min-width: 900px){.main-content{padding:32px;max-width:1280px}.products-grid{grid-template-columns:repeat(3,1fr);gap:18px}.club-logo{height:360px}}@media (min-width: 1400px){.products-grid{grid-template-columns:repeat(4,1fr)}.club-logo{height:420px}}.page-header{margin-bottom:30px;padding-bottom:15px;border-bottom:none}.page-header h2{font-size:2rem;color:#1e3c72;margin-bottom:10px;display:flex;align-items:center;gap:10px}.page-header p{color:#666;font-size:1.1rem}.orders-container{background-color:#fff;border-radius:15px;padding:16px;box-shadow:0 5px 20px #1e3c721a}.order-filters{display:flex;gap:15px;margin-bottom:16px;flex-wrap:wrap}.filter-btn{padding:10px 20px;background-color:#e3f2fd;border:none;border-radius:20px;color:#1e88e5;cursor:pointer;transition:all .3s ease;font-weight:600}.filter-btn:hover{background-color:#bbdefb}.filter-btn.active{background-color:#1e88e5;color:#fff}.orders-list{display:flex;flex-direction:column;gap:25px;will-change:scroll-position;transform:translateZ(0)}.order-card{border:1px solid #e0e0e0;border-radius:12px;overflow:hidden;transition:all .3s ease}.order-card:hover{box-shadow:0 8px 20px #1e3c721a;transform:translateY(-3px)}.order-header{background-color:#f5f9ff;padding:12px 16px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #e0e0e0}.order-id{color:#555;font-weight:600}.order-status{padding:6px 12px;border-radius:20px;font-size:.85rem;font-weight:600;white-space:nowrap}.order-status.pending{background-color:#fff3e0;color:#f57c00}.order-status.processing{background-color:#e3f2fd;color:#1e88e5}.order-status.completed{background-color:#e8f5e9;color:#43a047}.order-status.cancelled{background-color:#ffeaea;color:#ff4d4f}.order-status.refunded{background-color:#fff2e8;color:#fa8c16}.order-content{padding:20px}.order-item{display:flex;align-items:center;gap:20px;padding:15px 0;border-bottom:1px solid #f0f0f0}.order-item:last-child{border-bottom:none}.item-image{width:60px;height:60px;background-color:#e3f2fd;border-radius:10px;display:flex;justify-content:center;align-items:center;font-size:1.5rem;color:#1e88e5}.item-info{flex:1}.item-info h4{color:#1e3c72;margin-bottom:5px}.item-info p{color:#777;font-size:.9rem}.item-price{font-weight:600;color:#333}.item-quantity{color:#777}.order-footer{background-color:#f9f9f9;padding:15px 20px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:15px}.order-total{font-size:1.2rem;font-weight:700;color:#1e3c72}.order-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}.action-btn{padding:10px 20px;border-radius:20px;border:none;cursor:pointer;font-weight:600;transition:all .3s ease}.action-btn.pay{background-color:#1e88e5;color:#fff}.action-btn.cancel,.action-btn.details,.action-btn.track,.action-btn.contact{background-color:transparent;border:1px solid #1e88e5;color:#1e88e5}.action-btn.review{background-color:#43a047;color:#fff}.action-btn:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.support-container{background-color:#fff;border-radius:15px;padding:25px;box-shadow:0 5px 20px #1e3c721a}.support-options{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:25px;margin-bottom:40px}.option-card{background-color:#f5f9ff;border-radius:12px;padding:25px;text-align:center;transition:all .3s ease;border:2px solid transparent}.option-card:hover{transform:translateY(-8px);border-color:#4dabf7;box-shadow:0 10px 20px #1e3c721a}.option-icon{width:70px;height:70px;background:linear-gradient(135deg,#a5d8ff,#4dabf7);border-radius:50%;display:flex;justify-content:center;align-items:center;margin:0 auto 20px;font-size:1.8rem;color:#fff}.option-card h4{color:#1e3c72;margin-bottom:12px}.option-card p{color:#666;font-size:.95rem;margin-bottom:8px}.hours{font-size:.85rem;color:#888}a.option-btn{text-decoration:none}.option-btn{margin-top:15px;padding:10px 25px;background-color:#1e88e5;color:#fff;border:none;border-radius:20px;cursor:pointer;font-size:.95rem;font-weight:600;font-family:inherit;transition:all .3s ease;display:inline-block}.option-btn:hover{background-color:#1565c0;transform:translateY(-2px)}.faq-list{margin-top:20px}.faq-item{margin-bottom:15px;border:1px solid #e0e0e0;border-radius:10px;overflow:hidden}.faq-question{padding:18px 20px;background-color:#f5f9ff;display:flex;justify-content:space-between;align-items:center;cursor:pointer;transition:all .3s ease}.faq-question:hover{background-color:#e3f2fd}.faq-question span{font-weight:600;color:#1e3c72}.faq-answer{padding:0 20px;max-height:0;overflow:hidden;transition:max-height .3s ease}.faq-answer.active{padding:20px;max-height:200px}.faq-answer p{color:#555;line-height:1.7}.profile-container{background-color:#fff;border-radius:15px;padding:25px;box-shadow:0 5px 20px #1e3c721a}.profile-header{display:flex;flex-wrap:wrap;gap:30px;margin-bottom:30px;padding-bottom:25px;border-bottom:1px solid #e0e0e0}.avatar-container{display:flex;flex-direction:column;align-items:center;gap:15px}.avatar{width:120px;height:120px;background:linear-gradient(135deg,#a5d8ff,#4dabf7);border-radius:50%;display:flex;justify-content:center;align-items:center;font-size:3.5rem;color:#fff;overflow:hidden;cursor:pointer;transition:all .3s ease}.avatar:hover{transform:scale(1.05);box-shadow:0 5px 20px #4dabf766}.avatar img{width:100%;height:100%;object-fit:cover}.avatar-btn{padding:8px 15px;background-color:#e3f2fd;border:none;border-radius:20px;color:#1e88e5;cursor:pointer;font-weight:600;transition:all .3s ease}.avatar-btn:hover{background-color:#bbdefb}.profile-info{flex:1;min-width:300px}.profile-name{font-size:1.8rem;color:#1e3c72;margin-bottom:10px}.profile-level,.profile-join{color:#666;margin-bottom:8px;font-size:1.05rem}.level.gold{color:#ff9800;font-weight:600}.order-stats-box{background-color:#fff;border-radius:12px;padding:20px;box-shadow:0 5px 20px #1e3c721a;margin-bottom:25px}.order-stats-header{display:flex;align-items:center;gap:10px;margin-bottom:15px;padding-bottom:12px;border-bottom:1px solid #e0e0e0}.order-stats-header i{font-size:1.2rem;color:#1e88e5}.order-stats-header span{font-size:1.1rem;font-weight:600;color:#1e3c72}.order-stats-items{display:flex;justify-content:space-between;gap:15px}.order-stat-item{text-align:center;flex:1;padding:12px 10px;background-color:#f5f9ff;border-radius:10px;transition:all .3s ease;cursor:pointer}.order-stat-item:hover{transform:translateY(-3px);box-shadow:0 6px 15px #1e3c7226}.order-stat-item.active{background-color:#e3f2fd;border:2px solid #1e88e5}.order-stat-value{display:block;font-size:1.6rem;font-weight:700;font-family:Orbitron,sans-serif;margin-bottom:6px}.order-stat-value.all{color:#1e88e5}.order-stat-value.pending{color:#e53935}.order-stat-value.processing{color:#ff9800}.order-stat-value.completed{color:#43a047}.order-stat-label{display:block;color:#666;font-size:.85rem;font-weight:600}.profile-menu{margin-bottom:30px}.menu-item{display:flex;align-items:center;gap:20px;padding:20px;border-bottom:1px solid #f0f0f0;cursor:pointer;transition:all .3s ease}.menu-item:hover{background-color:#f5f9ff;transform:translate(5px)}.menu-item:last-child{border-bottom:none}.menu-icon{width:50px;height:50px;background-color:#e3f2fd;border-radius:10px;display:flex;justify-content:center;align-items:center;font-size:1.3rem;color:#1e88e5}.menu-text{flex:1}.menu-text h4{color:#1e3c72;margin-bottom:5px}.menu-text p{color:#777;font-size:.9rem}.menu-item i.fa-chevron-right{color:#999}.logout-btn{width:100%;padding:15px;background-color:#ffebee;color:#e53935;border:none;border-radius:10px;font-size:1.1rem;font-weight:600;cursor:pointer;display:flex;justify-content:center;align-items:center;gap:10px;transition:all .3s ease}.logout-btn:hover{background-color:#ffcdd2;transform:translateY(-2px)}.tab-bar{position:fixed;bottom:0;left:0;right:0;background-color:#fff;display:flex;justify-content:space-around;padding:12px 0;box-shadow:0 -4px 15px #1e3c721a;z-index:1000;border-top-left-radius:20px;border-top-right-radius:20px}.tab-item{display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;padding:10px 15px;border-radius:12px;transition:all .3s ease;color:#888}.tab-item.active{color:#1e88e5;background-color:#e3f2fd;transform:translateY(-5px)}.tab-item i{font-size:1.4rem}.tab-item span{font-size:.85rem;font-weight:600}.footer{text-align:center;padding:20px;color:#666;font-size:.9rem;background-color:#f0f7ff;margin-top:40px}.footer p{margin-bottom:8px}.announcement-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#0009;display:flex;justify-content:center;align-items:center;z-index:2000;opacity:0;visibility:hidden;transition:all .3s ease}.announcement-overlay.active{opacity:1;visibility:visible}.announcement-modal{background-color:#fff;border-radius:15px;width:90%;max-width:420px;box-shadow:0 20px 60px #1e3c724d;overflow:hidden;transform:scale(.8) translateY(-20px);transition:all .3s ease}.announcement-overlay.active .announcement-modal{transform:scale(1) translateY(0)}.announcement-header{background:linear-gradient(135deg,#1e3c72,#2a5298);color:#fff;padding:18px 20px;display:flex;align-items:center;gap:12px}.announcement-header i.fa-bullhorn{font-size:1.4rem}.announcement-header h3{flex:1;font-size:1.2rem;margin:0}.announcement-close{background:none;border:none;color:#fff;font-size:1.2rem;cursor:pointer;padding:5px;opacity:.8;transition:all .3s ease}.announcement-close:hover{opacity:1;transform:rotate(90deg)}.announcement-content{padding:25px;color:#333;line-height:1.8}.announcement-content p{margin-bottom:12px}.announcement-content ul{margin:15px 0;padding-left:25px}.announcement-content ul li{margin-bottom:8px;color:#555}.announcement-highlight{color:#e53935;font-weight:600;font-size:1.1rem;margin-top:15px}.text-red{color:#e53935;font-weight:600}.text-gradient{font-weight:700;background:linear-gradient(135deg,#1e3c72,#4dabf7,#1e88e5);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.announcement-footer{padding:15px 25px 25px;text-align:center}.announcement-btn{background:linear-gradient(135deg,#4dabf7,#1e88e5);color:#fff;border:none;padding:12px 40px;font-size:1rem;font-weight:600;border-radius:25px;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 15px #4dabf766}.announcement-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #4dabf799}@media (max-width: 768px){.announcement-modal{width:92%;max-width:380px}.announcement-header{padding:15px 18px}.announcement-content{padding:20px}.home-header{padding:10px 0}.notification-btn,.header-avatar{width:38px;height:38px}.notification-panel{max-width:100%}.header{flex-direction:column;gap:15px;text-align:center}.header-info{flex-wrap:wrap;justify-content:center}.hero-section{flex-direction:column;text-align:center;max-height:200px}.hero-title{font-size:2rem}.club-logo{height:200px;border-radius:12px}.products-grid,.support-options{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.profile-header{justify-content:center;text-align:center}.order-stats-box{gap:10px;padding:15px}.order-stat-value{font-size:1.4rem}.order-stat-label{font-size:.75rem}}@media (max-width: 480px){.main-content{padding:15px}.hero-section{padding:0;max-height:150px}.orders-container,.support-container,.profile-container{padding:20px}.club-logo{height:150px;border-radius:10px}.order-footer{flex-direction:column;align-items:flex-start}.order-actions{width:100%;justify-content:flex-end}.tab-item{padding:8px 10px}.tab-item i{font-size:1.2rem}.tab-item span{font-size:.75rem}.order-stats-box{gap:8px;padding:12px}.order-stat-item{padding:10px 5px}.order-stat-value{font-size:1.2rem}.order-stat-label{font-size:.7rem}}.product-detail-page,.order-confirm-page{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#f5f9ff;z-index:2000;display:flex;flex-direction:column;transform:translate(100%);transition:transform .3s ease}.product-detail-page.active,.order-confirm-page.active{transform:translate(0)}.detail-page-header{background:#fff;color:#333;padding:15px 20px;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:10;border-bottom:1px solid #e8e8e8}.detail-page-header h3{font-size:18px;flex:1;text-align:center;margin:0}.detail-page-header h3 i{color:#1677ff;margin-right:8px}.back-btn{background:none;border:none;color:#1677ff;font-size:18px;cursor:pointer;padding:8px;transition:all .3s ease}.back-btn:hover{transform:translate(-3px)}.header-placeholder{width:40px}.detail-page-content{flex:1;overflow-y:auto;padding-bottom:100px}.detail-page-image{width:100%;height:auto;background:linear-gradient(135deg,#1a1a2e,#16213e);display:flex;justify-content:center;align-items:center;padding:30px}.detail-page-image img{width:100%;max-width:300px;height:auto;object-fit:contain}.detail-page-info{background:#fff;padding:20px;margin:-20px 15px 15px;border-radius:16px;box-shadow:0 5px 20px #0000001a;position:relative}.detail-title{font-size:1.5rem;color:#1e3c72;margin-bottom:8px;font-family:"Exo 2",sans-serif}.detail-desc{color:#666;font-size:1rem;margin-bottom:15px;line-height:1.6}.detail-price{font-size:2rem;font-weight:700;color:#e53935}.detail-introduction{margin-top:16px;padding-top:16px;border-top:1px solid #eee}.introduction-title{font-size:1rem;font-weight:600;color:#333;margin-bottom:10px}.introduction-content{font-size:.9rem;color:#666;line-height:1.8}.introduction-content img{max-width:100%;height:auto;border-radius:8px;margin:8px 0}.detail-features{display:flex;gap:15px;padding:0 15px;margin-bottom:15px}.feature-item{flex:1;background:#fff;border-radius:12px;padding:15px;display:flex;flex-direction:column;align-items:center;text-align:center;box-shadow:0 3px 10px #00000014}.feature-item i{font-size:1.5rem;color:#1e88e5;margin-bottom:10px}.feature-text h4{font-size:.85rem;color:#1e3c72;margin-bottom:4px;font-family:"Exo 2",sans-serif}.feature-text p{font-size:.75rem;color:#888}.detail-notice-box{background:#fff;margin:0 15px;border-radius:12px;padding:20px;box-shadow:0 3px 10px #00000014}.detail-notice-box h4{font-size:1rem;color:#f57c00;margin-bottom:12px;display:flex;align-items:center;gap:8px;font-family:"Exo 2",sans-serif}.detail-notice-box ul{list-style:none;padding:0;margin:0}.detail-notice-box li{font-size:.9rem;color:#666;padding:8px 0 8px 20px;position:relative;border-bottom:1px solid #f0f0f0}.detail-notice-box li:last-child{border-bottom:none}.detail-notice-box li:before{content:"•";position:absolute;left:0;color:#ff9800;font-size:1.2rem}.detail-page-footer{position:fixed;bottom:0;left:0;width:100%;padding:15px 20px;background:#fff;display:flex;gap:12px;box-shadow:0 -5px 20px #0000001a;z-index:100}.footer-btn{flex:1;padding:14px 20px;border:none;border-radius:25px;font-size:1rem;font-weight:600;cursor:pointer;display:flex;justify-content:center;align-items:center;gap:8px;transition:all .3s ease}.footer-btn.contact-btn{background-color:#e3f2fd;color:#1e88e5}.footer-btn.contact-btn:hover{background-color:#bbdefb}.footer-btn.buy-btn{background:linear-gradient(135deg,#4dabf7,#1e88e5);color:#fff;box-shadow:0 4px 15px #4dabf766}.footer-btn.buy-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #4dabf799}.order-confirm-content{flex:1;overflow-y:auto;padding:15px 15px 120px}.order-product-card{background:#fff;border-radius:12px;padding:15px;display:flex;gap:15px;box-shadow:0 3px 10px #00000014;margin-bottom:15px}.order-product-image{width:80px;height:80px;background:linear-gradient(135deg,#1a1a2e,#16213e);border-radius:10px;display:flex;justify-content:center;align-items:center;overflow:hidden}.order-product-image img{width:70%;height:auto;object-fit:contain}.order-product-info{flex:1;display:flex;flex-direction:column;justify-content:center}.order-product-info h4{font-size:1rem;color:#1e3c72;margin-bottom:5px;font-family:"Exo 2",sans-serif}.order-product-info p{font-size:.85rem;color:#888;margin-bottom:8px}.order-product-price{font-size:1.2rem;font-weight:700;color:#e53935}.order-form{background:#fff;border-radius:12px;padding:20px;box-shadow:0 3px 10px #00000014;margin-bottom:15px}.order-form h4{font-size:1rem;color:#1e3c72;margin-bottom:15px;display:flex;align-items:center;gap:8px;font-family:"Exo 2",sans-serif}.form-group{margin-bottom:15px}.form-group label{display:block;font-size:.9rem;color:#666;margin-bottom:8px}.form-group input,.form-group textarea{width:100%;padding:12px 15px;border:1px solid #e0e0e0;border-radius:10px;font-size:1rem;transition:all .3s ease;font-family:"Exo 2",sans-serif}.form-group input:focus,.form-group textarea:focus{outline:none;border-color:#1e88e5;box-shadow:0 0 0 3px #1e88e51a}.form-group textarea{height:80px;resize:none}.order-summary,.payment-methods{background:#fff;border-radius:12px;padding:15px 20px;box-shadow:0 3px 10px #00000014;margin-bottom:15px}.payment-methods h4{font-size:1rem;color:#1e3c72;margin:0 0 10px;font-weight:700;font-family:"Exo 2",sans-serif}.payment-options{display:flex;flex-direction:column;gap:6px}.payment-option{display:flex;align-items:center;gap:10px;padding:10px 0;border-top:1px solid #f0f0f0;color:#666;font-weight:600}.payment-option:first-child{border-top:none}.payment-option input[type=radio]{width:18px;height:18px;accent-color:#1e88e5;flex-shrink:0}.payment-option i{color:#1e3c72;font-size:1rem}.summary-row{display:flex;justify-content:space-between;padding:10px 0;font-size:.95rem;color:#666}.summary-row.total{border-top:1px solid #e0e0e0;margin-top:5px;padding-top:15px}.summary-row .total-price{font-size:1.3rem;font-weight:700;color:#e53935}.order-agreement{padding:10px 0}.order-agreement label{display:flex;align-items:center;gap:10px;font-size:.9rem;color:#666;cursor:pointer}.order-agreement input[type=checkbox]{width:18px;height:18px;accent-color:#1e88e5}.order-agreement a{color:#1e88e5;text-decoration:none}.order-confirm-footer{position:fixed;bottom:0;left:0;width:100%;padding:15px 20px;background:#fff;display:flex;justify-content:space-between;align-items:center;box-shadow:0 -5px 20px #0000001a;z-index:100}.footer-price{display:flex;align-items:center;gap:5px}.footer-price span{font-size:.95rem;color:#666}.footer-price .price{font-size:1.5rem;font-weight:700;color:#e53935}.submit-order-btn{padding:14px 40px;background:linear-gradient(135deg,#43a047,#2e7d32);color:#fff;border:none;border-radius:25px;font-size:1rem;font-weight:600;cursor:pointer;display:flex;align-items:center;gap:8px;transition:all .3s ease;box-shadow:0 4px 15px #43a04766}.submit-order-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #43a04799}@media (max-width: 480px){.detail-page-image{padding:20px}.detail-page-image img{max-width:200px}.detail-title{font-size:1.3rem}.detail-price{font-size:1.6rem}.feature-item{padding:12px 8px}.feature-item i{font-size:1.2rem}.footer-btn{padding:12px 15px;font-size:.9rem}.submit-order-btn{padding:12px 25px;font-size:.9rem}}.category-layout{display:flex;height:calc(100vh - 140px);margin:-20px;background:#f5f9ff}.category-sidebar{width:80px;background:#fff;display:flex;flex-direction:column;flex-shrink:0;border-right:1px solid #e0e0e0;overflow-y:auto}.sidebar-item{padding:18px 10px;text-align:center;cursor:pointer;transition:all .3s ease;border-left:3px solid transparent;position:relative}.sidebar-item span{font-size:.85rem;color:#666;font-weight:500}.sidebar-item:hover{background:#f5f9ff}.sidebar-item.active{background:#f5f9ff;border-left-color:#1e88e5}.sidebar-item.active span{color:#1e88e5;font-weight:600}.category-main{flex:1;padding:15px;overflow-y:auto;background:#f5f9ff;position:relative}.loading-container{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;color:#1e88e5}.loading-spinner{width:40px;height:40px;border:3px solid #e3f2fd;border-top-color:#1e88e5;border-radius:50%;animation:spin .8s linear infinite;margin:0 auto 10px}@keyframes spin{to{transform:rotate(360deg)}}.sidebar-item.skeleton{background:#fff}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.category-panel{display:none}.category-panel.active{display:block}.panel-title{font-size:1.1rem;color:#1e3c72;margin-bottom:15px;padding-left:5px;font-family:"Exo 2",sans-serif}.panel-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.panel-card{background:#fff;border-radius:12px;overflow:hidden;cursor:pointer;transition:all .3s ease;box-shadow:0 2px 8px #0000000f}.panel-card:hover{transform:translateY(-3px);box-shadow:0 8px 20px #1e3c7226}.panel-card-image{aspect-ratio:1;background:linear-gradient(135deg,#1a1a2e,#16213e);display:flex;flex-direction:column;justify-content:center;align-items:center;padding:0;text-align:center;position:relative;overflow:hidden}.panel-card-image img{width:100%;height:100%;object-fit:cover;position:absolute;top:0;left:0}.card-tag{position:absolute;top:6px;left:6px;background:#4dabf7e6;color:#fff;font-size:.6rem;padding:2px 6px;border-radius:4px;z-index:2}.panel-card-image h4{color:#fff;font-size:.75rem;margin-bottom:4px;font-family:"Exo 2",sans-serif;line-height:1.3}.panel-card-image p{color:#ffffffb3;font-size:.65rem}.panel-card-title{padding:10px 8px;text-align:center;font-size:.8rem;color:#1e3c72;font-weight:500;background:#fff}@media (max-width: 480px){.category-layout{height:calc(100vh - 120px)}.category-sidebar{width:70px}.sidebar-item{padding:15px 8px}.sidebar-item span{font-size:.8rem}.category-main{padding:10px}.panel-grid{grid-template-columns:repeat(3,1fr);gap:8px}.panel-card-image h4{font-size:.65rem}.panel-card-image p{font-size:.55rem}.card-tag{font-size:.5rem;padding:1px 4px}.panel-card-title{padding:8px 5px;font-size:.7rem}}@media (max-width: 360px){.panel-grid{grid-template-columns:repeat(2,1fr)}}.auth-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;justify-content:center;align-items:center;z-index:10000;opacity:0;visibility:hidden;transition:all .3s ease}.auth-overlay.active{opacity:1;visibility:visible}.auth-modal{background:#fff;border-radius:20px;width:90%;max-width:400px;max-height:90vh;overflow-y:auto;position:relative;transform:scale(.9) translateY(20px);transition:all .3s ease;box-shadow:0 20px 60px #0000004d;border:1px solid rgba(0,0,0,.1)}.auth-overlay.active .auth-modal{transform:scale(1) translateY(0)}.auth-close{position:absolute;top:15px;right:15px;background:#00000014;border:none;width:36px;height:36px;border-radius:50%;color:#666;font-size:1rem;cursor:pointer;transition:all .3s ease;z-index:10}.auth-close:hover{background:#0000001f;transform:rotate(90deg);color:#333}.auth-form{padding:30px 25px}.auth-header{text-align:center;margin-bottom:25px}.auth-logo{width:70px;height:70px;background:linear-gradient(135deg,#4dabf7,#1e88e5);border-radius:50%;display:flex;justify-content:center;align-items:center;margin:0 auto 15px;font-size:1.8rem;color:#fff;box-shadow:0 10px 30px #4dabf74d;overflow:hidden}.auth-logo img{width:100%;height:100%;object-fit:cover}.auth-header h2{color:#333;font-size:1.6rem;margin-bottom:8px;font-family:Orbitron,sans-serif}.auth-header p{color:#0009;font-size:.9rem}.auth-body{display:flex;flex-direction:column;gap:15px}.avatar-upload{display:flex;justify-content:center;margin-bottom:10px}.avatar-preview{width:90px;height:90px;border-radius:50%;background:#0000000d;border:3px dashed rgba(77,171,247,.5);display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;transition:all .3s ease;overflow:hidden;position:relative}.avatar-preview:hover{border-color:#4dabf7;background:#4dabf71a}.avatar-preview i{font-size:1.5rem;color:#0006;margin-bottom:5px}.avatar-preview span{font-size:.7rem;color:#0006}.avatar-preview img{width:100%;height:100%;object-fit:cover;position:absolute;top:0;left:0}.avatar-preview.has-image i,.avatar-preview.has-image span{display:none}.input-group{position:relative;display:flex;align-items:center;background:#0000000d;border-radius:12px;border:1px solid rgba(0,0,0,.1);transition:all .3s ease}.input-group:focus-within{border-color:#4dabf7;background:#4dabf714}.input-group>i{position:absolute;left:15px;color:#0006;font-size:1rem}.input-group input{width:100%;padding:14px 15px 14px 45px;background:transparent;border:none;color:#333;font-size:1rem;outline:none}.input-group input::placeholder{color:#0006}.toggle-password{position:absolute;right:12px;background:none;border:none;color:#0006;cursor:pointer;padding:5px}.toggle-password:hover{color:#4dabf7}.captcha-group{display:flex;gap:10px;align-items:stretch}.captcha-input{flex:1}.captcha-box{display:flex;align-items:center;gap:5px;background:#ffffffe6;border-radius:12px;padding:5px;min-width:130px}#captchaCanvas{border-radius:8px}.refresh-captcha{background:linear-gradient(135deg,#4dabf7,#1e88e5);border:none;width:32px;height:32px;border-radius:8px;color:#fff;cursor:pointer;transition:all .3s ease}.refresh-captcha:hover{transform:rotate(180deg)}.sms-code-group{display:flex;gap:10px;align-items:stretch}.sms-input{flex:1}.send-sms-btn{padding:0 20px;background:linear-gradient(135deg,#4dabf7,#1e88e5);border:none;border-radius:12px;color:#fff;font-size:.9rem;font-weight:600;cursor:pointer;transition:all .3s ease;white-space:nowrap;min-width:110px}.send-sms-btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px #4dabf74d}.send-sms-btn:disabled{opacity:.6;cursor:not-allowed;transform:none;background:#999}.auth-options{display:flex;justify-content:space-between;align-items:center}.remember-me{display:flex;align-items:center;gap:8px;color:#000000b3;font-size:.85rem;cursor:pointer}.remember-me input{width:16px;height:16px;accent-color:#4dabf7}.forgot-password{color:#4dabf7;font-size:.85rem;text-decoration:none}.forgot-password:hover{text-decoration:underline}.auth-agreement{margin-top:5px}.auth-agreement label{display:flex;align-items:flex-start;gap:8px;color:#0009;font-size:.8rem;cursor:pointer}.auth-agreement input{width:16px;height:16px;accent-color:#4dabf7;margin-top:2px;flex-shrink:0}.auth-agreement a{color:#4dabf7;text-decoration:none}.auth-agreement a:hover{text-decoration:underline}.auth-submit-btn{width:100%;padding:14px;background:linear-gradient(135deg,#4dabf7,#1e88e5);border:none;border-radius:12px;color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;justify-content:center;align-items:center;gap:8px;margin-top:10px}.auth-submit-btn:hover{transform:translateY(-2px);box-shadow:0 10px 25px #4dabf74d}.auth-submit-btn:active{transform:translateY(0)}.auth-submit-btn:disabled{opacity:.6;cursor:not-allowed;transform:none}.auth-footer{text-align:center;margin-top:20px;padding-top:20px;border-top:1px solid rgba(0,0,0,.1)}.auth-footer p{color:#0009;font-size:.9rem}.auth-footer a{color:#4dabf7;text-decoration:none;font-weight:600}.auth-footer a:hover{text-decoration:underline}.input-error{border-color:#e53935!important;background:#e539351a!important}.error-message{color:#ff6b6b;font-size:.75rem;margin-top:-10px;padding-left:5px}.auth-success{text-align:center;padding:40px 20px}.auth-success i{font-size:4rem;color:#4caf50;margin-bottom:20px}.auth-success h3{color:#fff;font-size:1.4rem;margin-bottom:10px}.auth-success p{color:#fff9}@media (max-width: 480px){.auth-modal{width:95%;max-height:85vh}.auth-form{padding:25px 20px}.auth-logo{width:60px;height:60px;font-size:1.5rem}.auth-header h2{font-size:1.4rem}.avatar-preview{width:80px;height:80px}.input-group input{padding:12px 12px 12px 40px;font-size:.95rem}.captcha-group{flex-direction:column}.captcha-box{justify-content:center}}.logout-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;justify-content:center;align-items:center;z-index:10001;opacity:0;visibility:hidden;transition:all .3s ease}.logout-overlay.active{opacity:1;visibility:visible}.logout-modal{background:#fff;border-radius:20px;width:90%;max-width:360px;padding:35px 30px;text-align:center;transform:scale(.8) translateY(30px);transition:all .3s ease;box-shadow:0 25px 80px #0000004d;border:1px solid rgba(0,0,0,.1)}.logout-overlay.active .logout-modal{transform:scale(1) translateY(0)}.logout-icon{width:80px;height:80px;background:linear-gradient(135deg,#ff6b6b,#e53935);border-radius:50%;display:flex;justify-content:center;align-items:center;margin:0 auto 20px;font-size:2rem;color:#fff;box-shadow:0 10px 40px #e5393566;animation:pulse 2s infinite}@keyframes pulse{0%,to{box-shadow:0 10px 40px #e5393566}50%{box-shadow:0 10px 50px #e5393599}}.logout-modal h3{color:#333;font-size:1.5rem;margin-bottom:10px;font-family:Orbitron,sans-serif}.logout-modal>p{color:#0009;font-size:.95rem;margin-bottom:20px}.logout-user-info{display:flex;align-items:center;justify-content:center;gap:12px;background:#0000000d;border-radius:12px;padding:15px 20px;margin-bottom:25px}.logout-avatar{width:45px;height:45px;background:linear-gradient(135deg,#4dabf7,#1e88e5);border-radius:50%;display:flex;justify-content:center;align-items:center;overflow:hidden}.logout-avatar i{font-size:1.2rem;color:#fff}.logout-avatar img{width:100%;height:100%;object-fit:cover}.logout-username{color:#333;font-size:1.1rem;font-weight:600}.logout-actions{display:flex;gap:12px}.logout-cancel-btn,.logout-confirm-btn{flex:1;padding:14px 20px;border:none;border-radius:12px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;justify-content:center;align-items:center;gap:8px}.logout-cancel-btn{background:#00000014;color:#666;border:1px solid rgba(0,0,0,.1)}.logout-cancel-btn:hover{background:#0000001f;color:#333}.logout-confirm-btn{background:linear-gradient(135deg,#4dabf7,#1e88e5);color:#fff}.logout-confirm-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #4dabf766}.logout-confirm-btn:active{transform:translateY(0)}@media (max-width: 480px){.logout-modal{width:92%;padding:30px 25px}.logout-icon{width:70px;height:70px;font-size:1.7rem}.logout-modal h3{font-size:1.3rem}.logout-actions{flex-direction:column}.logout-cancel-btn,.logout-confirm-btn{padding:12px 20px}}.toast-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);display:flex;justify-content:center;align-items:center;z-index:10002;opacity:0;visibility:hidden;transition:all .3s ease}.toast-overlay.active{opacity:1;visibility:visible}.toast-modal{background:#fff;border-radius:20px;width:90%;max-width:320px;padding:35px 30px;text-align:center;opacity:0;transform:translateY(6px);transition:opacity .25s ease,transform .25s ease;box-shadow:0 25px 80px #0000004d;border:1px solid rgba(0,0,0,.1)}.toast-overlay.active .toast-modal{opacity:1;transform:translateY(0)}.toast-icon{width:70px;height:70px;border-radius:50%;display:flex;justify-content:center;align-items:center;margin:0 auto 20px;font-size:2rem;color:#fff}.toast-icon.warning{background:linear-gradient(135deg,#ffa726,#ff9800);box-shadow:0 10px 40px #ff980066}.toast-icon.success{background:linear-gradient(135deg,#66bb6a,#4caf50);box-shadow:0 10px 40px #4caf5066}.toast-icon.error{background:linear-gradient(135deg,#ff6b6b,#e53935);box-shadow:0 10px 40px #e5393566}.toast-modal h3{color:#333;font-size:1.4rem;margin-bottom:10px;font-family:Orbitron,sans-serif}.toast-modal p{color:#0009;font-size:1rem;margin-bottom:25px}.toast-btn{width:100%;padding:14px 20px;background:linear-gradient(135deg,#4dabf7,#1e88e5);border:none;border-radius:12px;color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;justify-content:center;align-items:center;gap:8px}.toast-btn:hover{transform:translateY(-2px);box-shadow:0 8px 25px #4dabf766}.toast-btn:active{transform:translateY(0)}@media (max-width: 480px){.toast-modal{width:92%;padding:30px 25px}.toast-icon{width:60px;height:60px;font-size:1.7rem}.toast-modal h3{font-size:1.2rem}.toast-btn{padding:12px 20px}}
