:root{--primary-color:#2b70f1;--primary-light-color:#e0f0ff;--primary-dark-color:#1a5ac8;--text-color:#333;--text-light-color:#666;--background-color:#f5f7fa;--card-background:#fff;--border-color:#e0e0e0;--hover-color:#f5f5f5;--shadow-light:rgba(0,0,0,.04);--shadow-medium:rgba(0,0,0,.08);--shadow-strong:rgba(0,0,0,.15);--card-radius:16px;--spacing-unit:24px}body{background-color:var(--background-color);color:var(--text-color);font-family:Inter,PingFang SC,Noto Sans SC,sans-serif;line-height:1.6;margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.container{margin:0 auto;max-width:1400px;padding:var(--spacing-unit)}header{background-color:var(--card-background);box-shadow:0 4px 15px var(--shadow-light);justify-content:space-between;margin-bottom:var(--spacing-unit) * 1.5;padding:15px var(--spacing-unit);position:sticky;top:0;z-index:1000}.logo,header{align-items:center;display:flex}.logo{font-size:26px;font-weight:700;gap:75px;letter-spacing:-.5px;text-decoration:none}.logo,.logo i{color:var(--primary-color)}.logo i{font-size:22px;margin-right:10px}.logo span{display:none;margin-left:5px}@media (min-width:768px){.logo span{display:inline-block}}.main-nav{display:flex;gap:30px}.main-nav a{color:var(--text-light-color);font-weight:500;padding:8px 0;position:relative;text-decoration:none;transition:color .2s ease}.main-nav a:after{background-color:var(--primary-color);bottom:-5px;content:"";height:3px;left:0;position:absolute;transition:width .3s ease;width:0}.main-nav a.active,.main-nav a:hover{color:var(--primary-color)}.main-nav a.active:after,.main-nav a:hover:after{width:100%}.main-nav .social-icons{align-items:center;display:flex;gap:12px;margin-left:20px}.main-nav .social-icon{align-items:center;background:transparent;border:1px solid transparent;border-radius:50%;color:var(--text-light-color);display:flex;font-size:14px;height:28px;justify-content:center;position:relative;text-decoration:none;transition:all .3s ease;width:28px}.main-nav .social-icon:hover{border-color:var(--primary-color);color:var(--primary-color);transform:translateY(-2px)}.main-nav .weixin-icon:hover{border-color:#07c160;color:#07c160}.main-nav .website-icon:hover{border-color:#1e9fff;color:#1e9fff}.main-nav .ranking-icon:hover{border-color:gold;color:gold}.qrcode-popup,.tooltip-popup{background:#fff;border-radius:8px;box-shadow:0 4px 16px rgba(0,0,0,.15);display:none;left:50%;min-width:120px;padding:12px;position:absolute;text-align:center;top:35px;transform:translateX(-50%);white-space:nowrap;z-index:1000}.tooltip-popup{padding:8px 12px}.qrcode-arrow{background:#fff;box-shadow:-2px -2px 4px rgba(0,0,0,.1);height:12px;left:50%;position:absolute;top:-6px;transform:translateX(-50%) rotate(-135deg);transform-origin:center;width:12px}.social-icon:hover .qrcode-popup,.social-icon:hover .tooltip-popup{display:block}.qr-image{border-radius:4px;height:100px;margin-bottom:6px;width:100px}.qrcode-popup p,.tooltip-popup p{color:#666;font-size:12px;margin:0;white-space:nowrap}.header-right{gap:25px}.header-right,.search-bar{align-items:center;display:flex}.search-bar{background:var(--card-background);border-radius:18px;box-shadow:0 2px 8px var(--shadow-light);height:36px;position:relative;transition:all .3s ease;width:260px}.search-bar:hover{box-shadow:0 4px 12px var(--shadow-medium)}.search-bar form{align-items:center;display:flex;height:100%;position:relative;width:100%}.search-bar input{background-color:transparent;border:1px solid transparent;border-radius:18px;box-sizing:border-box;color:var(--text-color);font-size:13px;height:36px;line-height:20px;outline:none;padding:8px 16px 8px 38px;transition:all .3s ease;width:100%}.search-bar input::placeholder{color:var(--text-light-color);font-weight:400}.search-bar input:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(43,112,241,.1)}.search-bar .fa-search{color:var(--text-light-color);font-size:13px;left:14px;line-height:1;pointer-events:none;position:absolute;top:50%;transform:translateY(-50%);transition:color .3s ease;z-index:1}.search-bar input:focus+.fa-search{color:var(--primary-color)}.search-bar.focused{border-color:var(--primary-color);box-shadow:0 4px 16px var(--shadow-medium)}.user-profile{align-items:center;background:var(--card-background);border:1px solid transparent;border-radius:25px;box-shadow:0 2px 8px var(--shadow-light);cursor:pointer;display:flex;gap:12px;padding:8px 16px;position:relative;transition:all .3s ease}.user-profile:hover{background-color:var(--card-background);border-color:var(--primary-color);box-shadow:0 4px 12px var(--shadow-medium);transform:translateY(-1px)}.user-avatar{align-items:center;background:linear-gradient(135deg,var(--primary-color),var(--primary-dark-color));border-radius:50%;box-shadow:0 3px 8px rgba(43,112,241,.3);color:#fff;display:flex;flex-shrink:0;font-size:16px;font-weight:600;height:40px;justify-content:center;transition:all .3s ease;width:40px}.user-profile:hover .user-avatar{box-shadow:0 4px 12px rgba(43,112,241,.4);transform:scale(1.05)}.user-name{color:var(--text-color);display:none;font-size:15px;font-weight:600}@media (min-width:768px){.user-name{display:inline-block}}.user-profile .fa-chevron-down{color:var(--text-light-color);font-size:12px;transition:all .3s ease}.user-profile:hover .fa-chevron-down{color:var(--primary-color);transform:rotate(180deg)}.user-dropdown{background:var(--card-background);border:1px solid var(--border-color);border-radius:16px;box-shadow:0 8px 32px var(--shadow-strong);display:none;margin-top:8px;opacity:0;overflow:hidden;position:absolute;right:0;top:100%;transform:translateY(-10px);transition:opacity .3s ease,transform .3s ease;width:280px;z-index:9999}.user-dropdown.show{display:block;opacity:1;transform:translateY(0)}.dropdown-header{align-items:center;background:linear-gradient(135deg,var(--primary-color),var(--primary-dark-color));color:#fff;display:flex;gap:12px;padding:20px;transition:all .3s ease}.dropdown-avatar{align-items:center;backdrop-filter:blur(10px);background:hsla(0,0%,100%,.2);border-radius:50%;display:flex;font-size:18px;font-weight:600;height:48px;justify-content:center;width:48px}.dropdown-info{color:#fff;flex:1}.dropdown-name{color:#fff;font-size:16px;font-weight:600;margin-bottom:4px;text-shadow:0 1px 2px rgba(0,0,0,.2)}.dropdown-role{backdrop-filter:blur(5px);background:hsla(0,0%,100%,.2);border:1px solid hsla(0,0%,100%,.3);border-radius:12px;color:#fff;display:inline-block;font-size:13px;font-weight:600;opacity:.9;padding:3px 10px;text-shadow:0 1px 3px rgba(0,0,0,.4)}.dropdown-divider{background:var(--border-color);height:1px;margin:0}.dropdown-menu{padding:8px 0}.dropdown-item{align-items:center;color:var(--text-color);display:flex;font-size:14px;gap:12px;padding:12px 20px;text-decoration:none;transition:all .2s ease}.dropdown-item:hover{background-color:var(--primary-light-color);color:var(--primary-color)}.dropdown-item i{font-size:14px;text-align:center;width:16px}.dropdown-item.text-danger{color:#dc3545}.dropdown-item.text-danger:hover{background-color:#f8d7da;color:#721c24}.user-vip .dropdown-avatar,.user-vip .user-avatar{background:linear-gradient(135deg,gold,#ffb347);box-shadow:0 2px 8px rgba(255,215,0,.3);color:#8b4513}.user-vip .dropdown-role{backdrop-filter:blur(5px);background:rgba(255,215,0,.25);border:1px solid rgba(255,215,0,.4);border-radius:12px;color:gold;display:inline-block;font-weight:700;padding:3px 10px;text-shadow:0 1px 3px rgba(0,0,0,.5)}.user-vip .dropdown-header{background:linear-gradient(135deg,gold,#ffb347)!important;border-bottom:2px solid gold}.user-vip .dropdown-item:hover{background-color:rgba(255,215,0,.1)}.user-normal .dropdown-avatar,.user-normal .user-avatar{background:linear-gradient(135deg,#2b70f1,#1a5ac8);color:#fff}.user-normal .dropdown-role{backdrop-filter:blur(5px);background:rgba(135,206,235,.25);border:1px solid rgba(135,206,235,.4);border-radius:12px;color:#87ceeb;display:inline-block;font-weight:600;padding:3px 10px;text-shadow:0 1px 3px rgba(0,0,0,.4)}.user-normal .dropdown-header{background:linear-gradient(135deg,#2b70f1,#1a5ac8)!important}.user-guest .dropdown-avatar,.user-guest .user-avatar{background:linear-gradient(135deg,#6c757d,#495057);color:#fff}.user-guest .dropdown-role{backdrop-filter:blur(5px);background:hsla(0,0%,88%,.25);border:1px solid hsla(0,0%,88%,.4);border-radius:12px;color:#e0e0e0;display:inline-block;font-weight:600;padding:3px 10px;text-shadow:0 1px 3px rgba(0,0,0,.4)}.user-guest .dropdown-header{background:linear-gradient(135deg,#6c757d,#495057)!important;border-bottom:2px solid #6c757d}.login-required-modal .layui-layer-content{background:transparent!important;border-radius:20px!important;overflow:hidden!important}.login-required-container{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:20px;box-shadow:0 20px 60px rgba(0,0,0,.3);padding:40px 30px;position:relative;text-align:center}.login-required-container:before{background:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cpattern id='a' width='100' height='100' patternUnits='userSpaceOnUse'%3E%3Ccircle cx='25' cy='25' r='1' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='75' cy='75' r='1' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='50' cy='10' r='.5' fill='rgba(255,255,255,0.1)'/%3E%3C/pattern%3E%3C/defs%3E%3Cpath fill='url(%23a)' d='M0 0h100v100H0z'/%3E%3C/svg%3E");bottom:0;content:"";left:0;opacity:.3;pointer-events:none;position:absolute;right:0;top:0}.login-required-icon{align-items:center;backdrop-filter:blur(10px);background:hsla(0,0%,100%,.2);border:2px solid hsla(0,0%,100%,.3);border-radius:50%;display:flex;height:80px;justify-content:center;margin:0 auto 20px;width:80px}.login-required-icon i{color:#fff;font-size:32px}.login-required-title{color:#fff;font-size:24px;font-weight:700;margin:0 0 12px;text-shadow:0 2px 4px rgba(0,0,0,.3)}.login-required-desc{color:hsla(0,0%,100%,.9);font-size:14px;line-height:1.6;margin:0 auto 30px;max-width:280px}.login-required-actions{display:flex;gap:12px;justify-content:center;margin-bottom:20px}.login-btn,.register-btn{align-items:center;border:none;border-radius:25px;cursor:pointer;display:flex;font-size:14px;font-weight:600;gap:8px;justify-content:center;min-width:120px;padding:12px 24px;text-decoration:none;transition:all .3s ease}.login-btn{background:linear-gradient(135deg,#4caf50,#45a049);box-shadow:0 4px 15px rgba(76,175,80,.4);color:#fff}.login-btn:hover{box-shadow:0 6px 20px rgba(76,175,80,.6);transform:translateY(-2px)}.register-btn{background:linear-gradient(135deg,#2196f3,#1976d2);box-shadow:0 4px 15px rgba(33,150,243,.4);color:#fff}.register-btn:hover{box-shadow:0 6px 20px rgba(33,150,243,.6);transform:translateY(-2px)}.login-required-close{align-items:center;backdrop-filter:blur(10px);background:hsla(0,0%,100%,.2);border-radius:50%;cursor:pointer;display:flex;height:30px;justify-content:center;position:absolute;right:15px;top:15px;transition:all .3s ease;width:30px}.login-required-close:hover{background:hsla(0,0%,100%,.3);transform:scale(1.1)}.login-required-close i{color:#fff;font-size:14px}.icon-btn{align-items:center;background:var(--card-background);border:none;border-radius:50%;box-shadow:0 2px 8px var(--shadow-light);color:var(--text-light-color);cursor:pointer;display:flex;font-size:18px;height:44px;justify-content:center;padding:10px;transition:all .3s ease;width:44px}.icon-btn:hover{background-color:var(--card-background);box-shadow:0 4px 12px var(--shadow-medium);color:var(--primary-color);transform:translateY(-1px)}.filter-sort-section{align-items:center;display:flex;flex-wrap:wrap;gap:15px;justify-content:space-between;margin-bottom:var(--spacing-unit) * 1.5}.filter-group{display:flex;flex-wrap:wrap;gap:10px}.filter-group .tag-button{background-color:var(--card-background);border:1px solid var(--border-color);border-radius:20px;color:var(--text-light-color);cursor:pointer;font-size:15px;padding:8px 18px;transition:all .2s ease;white-space:nowrap}.filter-group .tag-button:hover{border-color:var(--primary-color);color:var(--primary-color)}.filter-group .tag-button.active{background-color:var(--primary-color);border-color:var(--primary-color);box-shadow:0 3px 8px rgba(43,112,241,.2);color:#fff}.sort-dropdown{position:relative}.sort-dropdown select{appearance:none;-webkit-appearance:none;background-color:var(--card-background);background-image:url('data:image/svg+xml;utf8,<svg fill="%23666" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/><path d="M0 0h24v24H0z" fill="none"/></svg>');background-position:right 10px center;background-repeat:no-repeat;border:1px solid var(--border-color);border-radius:10px;cursor:pointer;font-size:15px;outline:none;padding:10px 40px 10px 18px;transition:all .2s ease}.sort-dropdown select:focus{border-color:var(--primary-color);box-shadow:0 0 0 4px rgba(43,112,241,.1)}.advanced-filters{align-items:center;display:flex;flex-wrap:wrap;gap:12px}.search-box{min-width:200px;position:relative}.search-input{background-color:var(--card-background);border:1px solid var(--border-color);border-radius:10px;font-size:15px;outline:none;padding:10px 40px 10px 16px;transition:all .2s ease;width:100%}.search-input:focus{border-color:var(--primary-color);box-shadow:0 0 0 4px rgba(43,112,241,.1)}.search-icon{color:var(--text-light-color);font-size:14px;position:absolute;right:12px;top:50%;transform:translateY(-50%)}.filter-dropdown{min-width:140px;position:relative}.filter-select{appearance:none;-webkit-appearance:none;background-color:var(--card-background);background-image:url('data:image/svg+xml;utf8,<svg fill="%23666" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/><path d="M0 0h24v24H0z" fill="none"/></svg>');background-position:right 10px center;background-repeat:no-repeat;border:1px solid var(--border-color);border-radius:10px;cursor:pointer;font-size:15px;outline:none;padding:10px 40px 10px 16px;transition:all .2s ease;width:100%}.filter-select:focus{border-color:var(--primary-color);box-shadow:0 0 0 4px rgba(43,112,241,.1)}.category-filter{min-width:160px}.category-selector{position:relative}.category-input{align-items:center;background-color:var(--card-background);border:1px solid var(--border-color);border-radius:10px;color:var(--text-color);cursor:pointer;display:flex;font-size:15px;justify-content:space-between;padding:10px 16px;transition:all .2s ease}.category-input:hover{border-color:var(--primary-color)}.category-arrow{color:var(--text-light-color);font-size:12px;transition:transform .2s ease}.category-dropdown{background-color:var(--card-background);border:1px solid var(--border-color);border-radius:10px;box-shadow:0 8px 24px var(--shadow-medium);display:none;left:0;margin-top:4px;max-height:300px;overflow-y:auto;position:absolute;right:0;top:100%;z-index:1000}.category-dropdown.show{display:block}.category-content{padding:8px 0}.category-item{cursor:pointer;font-size:14px;padding:8px 16px;transition:background-color .2s ease}.category-item:hover{background-color:var(--hover-color)}.category-item.selected{background-color:var(--primary-color);color:#fff}.modern-filter-container{background-color:var(--card-background);border:1px solid var(--border-color);border-radius:var(--card-radius);box-shadow:0 4px 12px var(--shadow-light);margin-bottom:var(--spacing-unit) * 1.5;padding:20px}.filter-row{gap:20px}.filter-form,.filter-row{align-items:center;display:flex;justify-content:space-between}.filter-form{width:100%}.filter-left,.filter-right{align-items:center;display:flex;gap:15px}.filter-item{position:relative}.modern-select{appearance:none;-webkit-appearance:none;background-color:var(--card-background);background-image:url('data:image/svg+xml;utf8,<svg fill="%23666" height="24" viewBox="0 0 24 24" width="24" xmlns="http://www.w3.org/2000/svg"><path d="M7 10l5 5 5-5z"/><path d="M0 0h24v24H0z" fill="none"/></svg>');background-position:right 12px center;background-repeat:no-repeat;border:1px solid var(--border-color);border-radius:10px;color:var(--text-color);cursor:pointer;font-size:15px;min-width:160px;outline:none;padding:12px 40px 12px 16px;transition:all .2s ease}.modern-select:focus{box-shadow:0 0 0 4px rgba(43,112,241,.1)}.modern-select:focus,.modern-select:hover{border-color:var(--primary-color)}.search-container{min-width:200px;position:relative}.modern-search{background-color:var(--card-background);border:1px solid var(--border-color);border-radius:10px;box-sizing:border-box;color:var(--text-color);font-size:15px;outline:none;padding:12px 40px 12px 16px;transition:all .2s ease;width:100%}.modern-search:focus{box-shadow:0 0 0 4px rgba(43,112,241,.1)}.modern-search:focus,.modern-search:hover{border-color:var(--primary-color)}.search-container .search-icon{color:var(--text-light-color);font-size:14px;pointer-events:none;position:absolute;right:12px;top:50%;transform:translateY(-50%);transition:color .2s ease;z-index:1}.modern-search:focus+.search-icon{color:var(--primary-color)}.filter-item .category-selector{position:relative}.filter-item .category-input{align-items:center;background-color:var(--card-background);border:1px solid var(--border-color);border-radius:10px;color:var(--text-color);cursor:pointer;display:flex;font-size:15px;justify-content:space-between;min-width:160px;padding:12px 16px;transition:all .2s ease}.filter-item .category-input:hover{border-color:var(--primary-color)}.filter-item .category-arrow{color:var(--text-light-color);font-size:12px;transition:transform .2s ease}.filter-item .category-dropdown{background-color:var(--card-background);border:1px solid var(--border-color);border-radius:10px;box-shadow:0 8px 24px var(--shadow-medium);display:none;left:0;margin-top:4px;max-height:300px;overflow-y:auto;position:absolute;right:0;top:100%;z-index:1000}.filter-item .category-dropdown.show{display:block}.filter-item .category-content{padding:8px 0}.filter-item .category-item{cursor:pointer;font-size:14px;padding:8px 16px;transition:background-color .2s ease}.filter-item .category-item:hover{background-color:var(--hover-color)}.filter-item .category-item.selected{background-color:var(--primary-color);color:#fff}.collection-grid{display:grid;gap:20px;grid-template-columns:repeat(4,1fr);margin-bottom:var(--spacing-unit) * 2}.collection-grid.loading-only{align-items:center;display:flex;justify-content:center;min-height:400px}.collection-card{background-color:var(--card-background);border-radius:var(--card-radius);box-shadow:0 8px 24px var(--shadow-light);cursor:pointer;display:flex;flex-direction:column;min-height:220px;overflow:hidden;transition:transform .3s ease,box-shadow .3s ease}.collection-card:hover{box-shadow:0 16px 36px var(--shadow-medium);transform:translateY(-8px)}.card-cover{align-items:center;background-color:#e0e0e0;background-position:50%;background-size:cover;border-top-left-radius:var(--card-radius);border-top-right-radius:var(--card-radius);color:#999;display:flex;flex-shrink:0;font-size:32px;height:140px;justify-content:center;overflow:hidden;position:relative;text-align:center;width:100%}.card-cover.no-image{background-color:#f0f4f7;border-bottom:1px solid var(--border-color)}.card-cover.no-image .placeholder-text{color:#bbb;font-size:24px;font-weight:600}.card-cover img{height:100%;object-fit:cover;transition:transform .3s ease;width:100%}.collection-card:hover .card-cover img{transform:scale(1.05)}.card-body{display:flex;flex-direction:column;flex-grow:1;padding:var(--spacing-unit)}.card-meta{align-items:center;color:var(--text-light-color);display:flex;font-size:14px;justify-content:space-between;margin-bottom:10px}.card-meta .category{align-items:center;border-radius:12px;color:var(--primary-color);display:flex;font-size:12px;font-weight:500;gap:5px;padding:4px 8px;transition:all .3s ease}.card-meta .category.category-paid{background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 2px 8px rgba(102,126,234,.3);color:#fff}.card-meta .category.category-paid:hover{box-shadow:0 4px 12px rgba(102,126,234,.4);transform:translateY(-1px)}.card-meta .category.category-vip{background:linear-gradient(135deg,#ffc107,#ff8f00);box-shadow:0 2px 8px rgba(255,193,7,.3);color:#fff}.card-meta .category.category-vip:hover{box-shadow:0 4px 12px rgba(255,193,7,.4);transform:translateY(-1px)}.card-meta .category.category-free{background:linear-gradient(135deg,#6c757d,#495057);box-shadow:0 2px 8px hsla(208,7%,46%,.3);color:#fff}.card-meta .category.category-free:hover{box-shadow:0 4px 12px hsla(208,7%,46%,.4);transform:translateY(-1px)}.card-meta .category.category-default{background:linear-gradient(135deg,#a8edea,#fed6e3);box-shadow:0 2px 8px rgba(168,237,234,.3);color:#333}.card-meta .category.category-default:hover{box-shadow:0 4px 12px rgba(168,237,234,.4);transform:translateY(-1px)}.card-meta .stats{align-items:center;display:flex;gap:15px}.card-meta .stats span{align-items:center;display:flex;gap:5px}.card-meta .stats i{color:#999;font-size:13px}.card-title{color:var(--text-color);font-size:18px;font-weight:700;-webkit-line-clamp:2;line-height:1.3;margin-bottom:10px;max-height:2.6em}.card-description,.card-title{display:-webkit-box;overflow:hidden;text-overflow:ellipsis;-webkit-box-orient:vertical}.card-description{color:var(--text-light-color);flex-grow:1;font-size:13px;-webkit-line-clamp:3;margin-bottom:15px;max-height:4.8em}.card-footer{align-items:center;border-top:1px solid #f0f0f0;display:flex;justify-content:space-between;padding-top:12px}.card-footer .author{align-items:center;color:var(--text-light-color);display:flex;font-size:12px}.card-footer .author img{border:1px solid var(--border-color);border-radius:50%;height:24px;margin-right:6px;object-fit:cover;width:24px}.card-footer .view-button{align-items:center;background-color:var(--primary-color);border-radius:16px;color:#fff;display:flex;font-size:12px;font-weight:600;gap:4px;padding:6px 14px;text-decoration:none;transition:background-color .2s ease,transform .2s ease}.card-footer .view-button:hover{background-color:var(--primary-dark-color);transform:translateY(-2px)}.card-footer .view-button.category-paid-btn{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.card-footer .view-button.category-paid-btn:hover{background:linear-gradient(135deg,#5a6fd8,#6a4190);transform:translateY(-2px)}.card-footer .view-button.category-vip-btn{background:linear-gradient(135deg,#ffc107,#ff8f00);color:#fff}.card-footer .view-button.category-vip-btn:hover{background:linear-gradient(135deg,#e6ac00,#e68000);transform:translateY(-2px)}.card-footer .view-button.category-free-btn{background:linear-gradient(135deg,#6c757d,#495057);color:#fff}.card-footer .view-button.category-free-btn:hover{background:linear-gradient(135deg,#5a6268,#343a40);transform:translateY(-2px)}@media (max-width:1200px){.collection-grid{grid-template-columns:repeat(3,1fr)}}@media (max-width:900px){.collection-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:600px){.collection-grid{gap:15px;grid-template-columns:1fr}.collection-card{min-height:200px}.card-cover{height:120px}.card-title{font-size:16px}.card-description{font-size:12px}}.pagination{background:var(--card-background);border-radius:var(--card-radius);box-shadow:0 4px 12px var(--shadow-light);gap:15px;justify-content:center;margin-top:var(--spacing-unit) * 2;padding:20px}.pagination,.pagination-btn{align-items:center;border:1px solid var(--border-color);display:flex}.pagination-btn{background-color:var(--card-background);border-radius:10px;color:var(--text-color);cursor:pointer;font-size:14px;font-weight:500;gap:8px;padding:12px 20px;transition:all .2s ease}.pagination-btn:hover:not(:disabled){background-color:var(--primary-light-color);border-color:var(--primary-color);color:var(--primary-color);transform:translateY(-1px)}.pagination-btn:disabled{background-color:#f0f0f0;color:#999;cursor:not-allowed;opacity:.5}.pagination-btn i{font-size:12px}.page-numbers{align-items:center;display:flex;gap:8px}.page-btn{background-color:var(--card-background);border:1px solid var(--border-color);border-radius:8px;color:var(--text-color);cursor:pointer;font-size:14px;font-weight:500;min-width:40px;padding:10px 15px;text-align:center;transition:all .2s ease}.page-btn:hover:not(:disabled){background-color:var(--primary-light-color);border-color:var(--primary-color);color:var(--primary-color)}.page-btn.active{background-color:var(--primary-color);border-color:var(--primary-color);box-shadow:0 2px 8px rgba(43,112,241,.3);color:#fff}.page-ellipsis{color:var(--text-light-color);font-weight:500;padding:0 5px}.page-jump{align-items:center;display:flex;gap:8px;margin-left:15px}.page-jump span{color:var(--text-light-color);font-size:14px}.jump-input{background-color:var(--card-background);border:1px solid var(--border-color);border-radius:6px;font-size:14px;outline:none;padding:8px 12px;text-align:center;transition:border-color .2s ease;width:60px}.jump-input:focus{border-color:var(--primary-color);box-shadow:0 0 0 3px rgba(43,112,241,.1)}.go-btn{background-color:var(--primary-color);border:1px solid var(--primary-color);border-radius:6px;color:#fff;cursor:pointer;font-size:14px;font-weight:500;padding:8px 16px;transition:all .2s ease}.go-btn:hover{background-color:var(--primary-dark-color);border-color:var(--primary-dark-color);transform:translateY(-1px)}.page-info{color:var(--text-light-color);font-size:14px;font-weight:500;margin-left:15px}@media (max-width:768px){.pagination{flex-direction:column;gap:15px;padding:15px}.page-numbers{order:2}.page-jump{margin-left:0;order:3}.page-info{margin-left:0;order:4}}body footer{background:linear-gradient(135deg,#2c3e50,#34495e)!important;border-top:1px solid var(--border-color)!important;box-shadow:0 -4px 20px rgba(0,0,0,.1)!important;color:#ecf0f1!important;height:auto!important;margin-top:var(--spacing-unit) * 3!important;overflow:visible!important;padding:0!important}body footer .footer-content{align-items:center!important;display:flex!important;justify-content:center!important;margin:0 auto!important;max-width:1400px!important;padding:40px var(--spacing-unit) 20px!important}body footer .footer-section{max-width:800px!important;text-align:center!important;width:100%!important}.footer-section h4{color:#fff;font-size:18px;font-weight:600;margin-bottom:20px;position:relative}.footer-section h4:after{background:var(--primary-color);border-radius:2px;bottom:-8px;content:"";height:3px;left:0;position:absolute;width:30px}.footer-logo{align-items:center;display:flex;justify-content:center;margin-bottom:15px}.footer-title{color:#fff;font-size:24px;font-weight:700;text-align:center}.footer-description{color:#bdc3c7;font-size:14px;line-height:1.6;margin:0 auto;max-width:800px;text-align:center}.footer-links{list-style:none;margin:0;padding:0}.footer-links li{margin-bottom:12px}.footer-links a{color:#bdc3c7;font-size:14px;text-decoration:none;transition:color .2s ease}.footer-links a:hover,.footer-links i{color:var(--primary-color)}.footer-links i{margin-right:8px;text-align:center;width:16px}.footer-bottom{background:rgba(0,0,0,.1);border-top:1px solid #34495e;padding:20px var(--spacing-unit);text-align:center}.footer-bottom p{color:#95a5a6;font-size:14px;margin:0}.footer-licenses{border-top:1px solid #34495e;margin-top:15px;padding-top:15px;text-align:center}.footer-licenses a{color:#ecf0f1;margin:0 5px;text-decoration:none;transition:color .2s ease}.footer-licenses a:hover{color:var(--primary-color)}.footer-licenses img{margin:0 5px;vertical-align:middle}@media (max-width:1024px){body footer .footer-content{padding:30px var(--spacing-unit) 15px!important}}@media (max-width:768px){body footer .footer-content{padding:30px 20px 15px!important}.footer-section h4{font-size:16px}.footer-title{font-size:20px}}.collection-card.blurred{filter:blur(2px);pointer-events:none}.collection-card.blue-glow{border:2px solid #2b70f1;box-shadow:0 0 15px rgba(43,112,241,.3)}.collection-card.yellow-glow{border:2px solid #ffc107;box-shadow:0 0 15px rgba(255,193,7,.3)}.collection-card.light-gray-glow{border:2px solid #6c757d;box-shadow:0 0 15px hsla(208,7%,46%,.3)}.collection-card.category-paid-border{border:2px solid #667eea;box-shadow:0 0 15px rgba(102,126,234,.3)}.collection-card.category-vip-border{border:2px solid #ffc107;box-shadow:0 0 15px rgba(255,193,7,.3)}.collection-card.category-free-border{border:2px solid #6c757d;box-shadow:0 0 15px hsla(208,7%,46%,.3)}.loading{align-items:center;color:var(--text-light-color);display:flex;flex-direction:column;justify-content:center;min-height:300px;padding:60px 40px;text-align:center;width:100%}.loading i{animation:spin 1s linear infinite;color:var(--primary-color);font-size:32px;margin-bottom:15px}.loading p{font-size:16px;font-weight:500;margin:0}.loading.empty-state{background:linear-gradient(135deg,#f8f9fa,#e9ecef);border-radius:12px;box-shadow:0 4px 20px rgba(0,0,0,.08);margin:20px 0;min-height:400px;padding:80px 40px}.loading.empty-state i{animation:none;color:#6c757d;font-size:48px;margin-bottom:20px;opacity:.7}.loading.empty-state p{color:#6c757d;font-size:18px;font-weight:400;line-height:1.5;margin:0}#contentDiv.loading-only{align-items:center;display:flex;justify-content:center;min-height:500px;padding:40px 20px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.loading.error{color:#dc3545}.loading.error i{animation:none;color:#dc3545}@media (max-width:1024px){.container{padding:15px}.header-right{gap:15px}.search-bar{width:220px}.main-nav{gap:20px}.main-nav .social-icons{gap:6px;margin-left:15px}.user-dropdown{width:260px}}@media (max-width:768px){header{padding:10px 15px}.main-nav,header{flex-wrap:wrap;gap:15px}.main-nav a{font-size:14px;padding:6px 0}.header-right{flex-grow:1;justify-content:space-between;width:100%}.search-bar{flex-grow:1;height:32px;min-width:160px;width:auto}.search-bar input{font-size:12px;height:32px;padding:6px 12px 6px 34px}.search-bar .fa-search{font-size:12px;left:12px}.user-profile{padding:6px 12px}.user-dropdown{right:-10px;width:240px}.dropdown-header{padding:16px}.dropdown-avatar{font-size:16px;height:40px;width:40px}.dropdown-name{font-size:15px}.dropdown-role{font-size:12px}.modern-filter-container{padding:15px}.filter-form,.filter-row{flex-direction:column;gap:15px}.filter-left,.filter-right{flex-wrap:wrap;justify-content:flex-start;width:100%}.filter-item{flex:1;min-width:140px}.modern-search,.modern-select,.search-container{min-width:auto;width:100%}.pagination{flex-wrap:wrap;justify-content:center}.pagination button,.pagination input,.pagination select{flex-grow:1;width:auto}.main-nav .social-icons{gap:6px;margin-left:15px}.main-nav .social-icon{font-size:12px;height:24px;width:24px}.qrcode-popup,.tooltip-popup{min-width:100px;padding:8px;top:30px}.qr-image{height:80px;width:80px}.qrcode-popup p,.tooltip-popup p{font-size:11px}}@media (max-width:480px){.modern-filter-container{padding:12px}.filter-left,.filter-right{flex-direction:column;gap:10px}.filter-item{min-width:auto;width:100%}.modern-search,.modern-select{font-size:14px;padding:10px 35px 10px 12px}.search-container .search-icon{font-size:12px;right:10px}.filter-item .category-input{font-size:14px;padding:10px 12px}.card-cover{height:150px}.card-title{font-size:18px}.card-description{font-size:14px}.card-body{padding:15px}.card-footer .view-button{font-size:13px;padding:6px 12px}.pagination button,.pagination input{font-size:14px;padding:8px 10px}.main-nav .social-icons{gap:4px;margin-left:10px}.main-nav .social-icon{font-size:10px;height:20px;width:20px}.qrcode-popup,.tooltip-popup{min-width:80px;padding:6px;top:25px}.qr-image{height:60px;width:60px}.qrcode-popup p,.tooltip-popup p{font-size:10px}}.vip-modal,.vip-modal .layui-layer-content{background:transparent!important;border:none!important;box-shadow:none!important}.vip-modal .layui-layer-content{border-radius:0!important;overflow:visible!important;padding:0!important}.vip-container{background:linear-gradient(135deg,#667eea,#764ba2 50%,#f093fb);border-radius:24px;box-shadow:0 25px 80px rgba(102,126,234,.4);color:#fff;display:flex;flex-direction:column;min-height:520px;min-width:480px;overflow:hidden;padding:0;position:relative}.vip-container:before{animation:float 20s linear infinite;background:radial-gradient(circle,hsla(0,0%,100%,.1) 1px,transparent 0);background-size:20px 20px;height:200%;left:-50%;top:-50%;width:200%}.vip-container:after,.vip-container:before{content:"";pointer-events:none;position:absolute}.vip-container:after{animation:shine 3s ease-in-out infinite;background:linear-gradient(45deg,transparent 30%,hsla(0,0%,100%,.1) 50%,transparent 70%);bottom:0;left:0;right:0;top:0}.vip-close{align-items:center;backdrop-filter:blur(10px);background:hsla(0,0%,100%,.2);border:1px solid hsla(0,0%,100%,.3);border-radius:50%;cursor:pointer;display:flex;height:40px;justify-content:center;position:absolute;right:20px;top:20px;transition:all .3s ease;width:40px;z-index:10}.vip-close .layui-icon{color:#fff;font-size:18px;transition:all .3s ease}.vip-close:before{color:#fff;content:"×";font-size:24px;font-weight:700;line-height:1}.vip-close:hover{background:hsla(0,0%,100%,.3);box-shadow:0 8px 20px rgba(0,0,0,.3);transform:rotate(90deg) scale(1.1)}.vip-header{padding:40px 30px 20px;position:relative;text-align:center;z-index:1}.vip-icon-wrapper{align-items:center;animation:pulse 2s ease-in-out infinite;background:linear-gradient(45deg,gold,orange,#ff6b6b);border-radius:50%;box-shadow:0 10px 30px rgba(255,215,0,.4);display:flex;height:80px;justify-content:center;margin:0 auto 20px;position:relative;width:80px}.vip-icon-wrapper:before{animation:rotate 3s linear infinite;background:linear-gradient(45deg,gold,orange,#ff6b6b,gold);border-radius:50%;bottom:-5px;content:"";left:-5px;position:absolute;right:-5px;top:-5px;z-index:-1}.vip-header .layui-icon-diamond{color:#fff;filter:drop-shadow(0 2px 8px rgba(0,0,0,.3));font-size:36px}.vip-header h3{animation:fadeUp .8s ease .2s forwards;background:linear-gradient(45deg,#fff,#f0f0f0);-webkit-background-clip:text;color:#fff;font-size:32px;font-weight:800;letter-spacing:2px;margin:0;opacity:0;text-shadow:0 4px 15px rgba(0,0,0,.3);-webkit-text-fill-color:transparent;background-clip:text}.vip-subtitle{animation:fadeUp .8s ease .4s forwards;font-size:16px;margin:10px 0 0;opacity:.9;opacity:0}.vip-benefits{flex:1;padding:0 30px 30px;position:relative;z-index:1}.benefits-grid{display:grid;gap:15px;grid-template-columns:1fr 1fr;margin-bottom:30px}.benefit-item{align-items:center;animation:fadeUp .6s ease forwards;animation-delay:calc(var(--i)*.1s + .6s);backdrop-filter:blur(10px);background:hsla(0,0%,100%,.15);border:1px solid hsla(0,0%,100%,.2);border-radius:12px;display:flex;opacity:0;padding:15px;transition:all .3s ease}.benefit-item:hover{background:hsla(0,0%,100%,.25);box-shadow:0 8px 20px rgba(0,0,0,.2);transform:translateY(-2px)}.benefit-icon{align-items:center;background:linear-gradient(45deg,#4caf50,#45a049);border-radius:50%;display:flex;flex-shrink:0;height:32px;justify-content:center;margin-right:12px;width:32px}.benefit-icon .check-icon{background:hsla(0,0%,100%,.2);border:2px solid #4caf50;border-radius:50%;color:#4caf50;display:inline-block;font-size:18px;font-weight:700;height:20px;line-height:20px;text-align:center;width:20px}.benefit-text{color:#fff;font-size:14px;font-weight:500;line-height:1.3}.vip-features{animation:fadeUp .8s ease 1.2s forwards;gap:20px;justify-content:center;margin-bottom:25px;opacity:0}.feature-item{backdrop-filter:blur(10px);background:hsla(0,0%,100%,.1);border:1px solid hsla(0,0%,100%,.2);border-radius:20px;padding:12px 16px;text-align:center;transition:all .3s ease}.feature-item:hover{background:hsla(0,0%,100%,.2);box-shadow:0 8px 20px rgba(0,0,0,.2);transform:translateY(-3px)}.feature-icon{display:block;font-size:20px;margin-bottom:5px}.vip-button{animation:fadeUp .8s ease 1.4s forwards;background:linear-gradient(45deg,gold,orange);border:none;border-radius:50px;box-shadow:0 10px 30px rgba(255,215,0,.4);color:#333;cursor:pointer;display:block;font-size:18px;font-weight:700;margin:10px auto;opacity:0;overflow:hidden;padding:18px 50px;position:relative;text-align:center;text-decoration:none;transition:all .3s ease;width:fit-content}.vip-button:before{background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.4),transparent);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .6s;width:100%}.vip-button:hover:before{left:100%}.vip-button:hover{box-shadow:0 15px 40px rgba(255,215,0,.5);transform:translateY(-3px) scale(1.05)}.vip-button:active{transform:translateY(-1px) scale(1.02)}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes float{0%{transform:translateY(0) rotate(0deg)}to{transform:translateY(-20px) rotate(1turn)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.modern-payment-modal{background:linear-gradient(135deg,#fff,#f8f9fa);border-radius:20px;box-shadow:0 25px 80px rgba(0,0,0,.2);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;min-width:400px;overflow:hidden;position:relative}.layui-layer-content{background:transparent!important;border:none!important;border-radius:0!important;box-shadow:none!important;margin:0!important;overflow:visible!important;padding:0!important;position:relative!important}.modern-payment-modal{backdrop-filter:blur(20px);border:none;min-height:300px}.payment-title-bar{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:20px 20px 0 0;color:#fff;cursor:move;display:flex;justify-content:space-between;overflow:hidden;padding:12px 20px;position:relative;user-select:none}.payment-title-bar:before{background:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cpattern id='a' width='100' height='100' patternUnits='userSpaceOnUse'%3E%3Ccircle cx='25' cy='25' r='1' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='75' cy='75' r='1' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='50' cy='10' r='.5' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='10' cy='60' r='.5' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='90' cy='40' r='.5' fill='rgba(255,255,255,0.1)'/%3E%3C/pattern%3E%3C/defs%3E%3Cpath fill='url(%23a)' d='M0 0h100v100H0z'/%3E%3C/svg%3E");border-radius:20px 20px 0 0;bottom:0;content:"";left:0;opacity:.3;position:absolute;right:0;top:0}.title-bar-left{align-items:center;display:flex;font-size:15px;font-weight:600;gap:10px;position:relative;z-index:1}.title-bar-left i{font-size:18px}.title-bar-right{gap:6px;position:relative;z-index:1}.title-bar-right,.title-btn{align-items:center;display:flex}.title-btn{backdrop-filter:blur(10px);background:hsla(0,0%,100%,.15);border:none;border:1px solid hsla(0,0%,100%,.2);border-radius:6px;color:#fff;cursor:pointer;font-size:12px;height:28px;justify-content:center;transition:all .3s ease;width:28px}.title-btn:hover{background:hsla(0,0%,100%,.25);box-shadow:0 4px 12px rgba(0,0,0,.2);transform:scale(1.1)}.title-btn:active{transform:scale(.95)}.close-btn:hover{background:#e74c3c!important}.payment-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:30px 25px 25px;position:relative;text-align:center}.payment-header:before{background:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cpattern id='a' width='100' height='100' patternUnits='userSpaceOnUse'%3E%3Ccircle cx='25' cy='25' r='1' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='75' cy='75' r='1' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='50' cy='10' r='.5' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='10' cy='60' r='.5' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='90' cy='40' r='.5' fill='rgba(255,255,255,0.1)'/%3E%3C/pattern%3E%3C/defs%3E%3Cpath fill='url(%23a)' d='M0 0h100v100H0z'/%3E%3C/svg%3E");bottom:0;content:"";left:0;opacity:.3;position:absolute;right:0;top:0}.payment-icon{align-items:center;backdrop-filter:blur(10px);background:hsla(0,0%,100%,.2);border:1px solid hsla(0,0%,100%,.3);border-radius:50%;display:flex;height:56px;justify-content:center;margin:0 auto 15px;position:relative;width:56px;z-index:1}.payment-icon i{color:#fff;font-size:24px}.payment-title{font-size:22px;font-weight:700;margin:0 0 8px;position:relative;text-shadow:0 2px 10px rgba(0,0,0,.3);z-index:1}.payment-subtitle{font-size:14px;margin:0;opacity:.9;position:relative;z-index:1}.document-price-section{align-items:stretch;background:linear-gradient(135deg,#f8f9fa,#fff);border-bottom:1px solid #e9ecef;display:flex;overflow:hidden;padding:0;position:relative}.document-price-section:before{background:linear-gradient(90deg,#667eea,#764ba2 50%,#667eea);content:"";height:3px;left:0;position:absolute;right:0;top:0}.document-info{align-items:center;backdrop-filter:blur(10px);background:hsla(0,0%,100%,.8);border-right:1px solid #e9ecef;display:flex;flex:1;padding:20px 22px;position:relative}.document-info:after{background:linear-gradient(180deg,transparent,#e9ecef 50%,transparent);content:"";height:50%;position:absolute;right:0;top:50%;transform:translateY(-50%);width:1px}.document-icon{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:10px;box-shadow:0 4px 12px rgba(102,126,234,.3);display:flex;flex-shrink:0;height:42px;justify-content:center;margin-right:15px;overflow:hidden;position:relative;width:42px}.document-icon:before{animation:shine 3s infinite;background:linear-gradient(45deg,transparent 30%,hsla(0,0%,100%,.2) 50%,transparent 70%);content:"";height:200%;left:-50%;position:absolute;top:-50%;width:200%}.document-icon i{color:#fff;font-size:18px;position:relative;z-index:1}.document-details{flex:1;min-width:0}.document-name{color:#333;font-size:16px;font-weight:600;line-height:1.3;margin:0 0 4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.document-type{background:rgba(102,126,234,.1);border-radius:12px;color:#666;color:#667eea;display:inline-block;font-size:12px;font-weight:500;margin:0;padding:2px 8px}.price-section{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;display:flex;flex-direction:column;justify-content:center;min-width:120px;padding:20px 22px;position:relative}.price-section:before{background:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100'%3E%3Cdefs%3E%3Cpattern id='a' width='100' height='100' patternUnits='userSpaceOnUse'%3E%3Ccircle cx='25' cy='25' r='1' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='75' cy='75' r='1' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='50' cy='10' r='.5' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='10' cy='60' r='.5' fill='rgba(255,255,255,0.1)'/%3E%3Ccircle cx='90' cy='40' r='.5' fill='rgba(255,255,255,0.1)'/%3E%3C/pattern%3E%3C/defs%3E%3Cpath fill='url(%23a)' d='M0 0h100v100H0z'/%3E%3C/svg%3E");bottom:0;content:"";left:0;opacity:.2;position:absolute;right:0;top:0}.price-label{font-size:12px;font-weight:500;margin-bottom:8px;opacity:.9}.price-amount,.price-label{position:relative;z-index:1}.price-amount{align-items:baseline;display:flex;margin-bottom:6px}.currency{font-size:16px;font-weight:600;margin-right:2px}.amount{font-size:28px;font-weight:700;line-height:1;text-shadow:0 2px 10px rgba(0,0,0,.3)}.price-description{font-size:10px;opacity:.8;position:relative;text-align:center;z-index:1}.payment-methods{background:#fff;padding:20px 25px}.method-title{align-items:center;color:#333;display:flex;font-size:14px;font-weight:600;gap:8px;margin-bottom:15px}.method-title:before{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:2px;content:"";height:16px;width:3px}.method-options{display:flex;flex-direction:column;gap:10px}.method-option{align-items:center;background:#fff;border:2px solid #e9ecef;border-radius:12px;cursor:pointer;display:flex;overflow:hidden;padding:15px;position:relative;transition:all .3s ease}.method-option:before{background:linear-gradient(135deg,rgba(102,126,234,.05),rgba(118,75,162,.05));bottom:0;content:"";left:0;opacity:0;position:absolute;right:0;top:0;transition:opacity .3s ease}.method-option:hover:before{opacity:1}.method-option.active{background:linear-gradient(135deg,rgba(102,126,234,.05),rgba(118,75,162,.05));border-color:#667eea;box-shadow:0 4px 15px rgba(102,126,234,.15)}.method-icon{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:8px;display:flex;flex-shrink:0;height:40px;justify-content:center;margin-right:15px;width:40px}.method-icon i{color:#fff;font-size:18px}.method-info{flex:1}.method-name{color:#333;font-size:15px;font-weight:600;margin-bottom:2px}.method-desc{color:#666;font-size:12px}.method-check{align-items:center;background:#e9ecef;border-radius:50%;display:flex;height:24px;justify-content:center;transition:all .3s ease;width:24px}.method-option.active .method-check{background:#667eea}.method-check i{color:transparent;font-size:12px;transition:color .3s ease}.method-option.active .method-check i{color:#fff}.method-option.disabled{cursor:not-allowed;opacity:.6;position:relative}.method-option.disabled:hover{background:rgba(0,0,0,.05);box-shadow:none;transform:none}.method-option.disabled .method-check i{color:#999}.method-disabled-overlay{align-items:center;background:rgba(0,0,0,.1);border-radius:12px;bottom:0;display:flex;justify-content:center;left:0;position:absolute;right:0;top:0}.method-disabled-overlay span{background:rgba(0,0,0,.8);border-radius:4px;color:#fff;font-size:12px;font-weight:500;padding:4px 8px}.payment-actions{background:#f8f9fa;border-top:1px solid #e9ecef;padding:20px 25px}.pay-button{align-items:center;background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:12px;box-shadow:0 6px 20px rgba(102,126,234,.3);color:#fff;cursor:pointer;display:flex;font-size:16px;font-weight:600;gap:10px;justify-content:center;overflow:hidden;padding:16px 24px;position:relative;transition:all .3s ease;width:100%}.pay-button:before{background:linear-gradient(90deg,transparent,hsla(0,0%,100%,.2),transparent);content:"";height:100%;left:-100%;position:absolute;top:0;transition:left .5s;width:100%}.pay-button:hover:before{left:100%}.pay-button:hover{box-shadow:0 8px 25px rgba(102,126,234,.4);transform:translateY(-2px)}.pay-button:active{transform:translateY(0)}.pay-button i{font-size:16px}.security-notice i{font-size:14px}@keyframes shine{0%{transform:translateX(-100%) translateY(-100%) rotate(45deg)}to{transform:translateX(100%) translateY(100%) rotate(45deg)}}.vip-features{display:flex;gap:15px;justify-content:space-around;margin:5px 0}.feature-item{animation:fadeUp .6s ease forwards;animation-delay:.5s;flex-direction:column;gap:8px;opacity:0}.feature-icon,.feature-item{align-items:center;display:flex}.feature-icon{backdrop-filter:blur(10px);background:hsla(0,0%,100%,.15);border:1px solid hsla(0,0%,100%,.2);border-radius:50%;font-size:24px;height:50px;justify-content:center;transition:all .3s ease;width:50px}.feature-item:hover .feature-icon{background:hsla(0,0%,100%,.25);transform:scale(1.1)}.feature-text{color:#fff;text-align:center}.feature-text,.payment-tips{font-size:12px;font-weight:500}.payment-tips{align-items:center;background:rgba(102,126,234,.1);border-radius:8px;color:#667eea;display:flex;gap:8px;justify-content:center;margin-top:12px;padding:10px}.payment-tips i{font-size:14px}.security-notice{align-items:center;background:rgba(76,175,80,.1);border-top:1px solid rgba(76,175,80,.2);color:#4caf50;display:flex;font-size:12px;font-weight:500;gap:8px;justify-content:center;line-height:1.4;padding:12px 25px;text-align:center}.notification-btn{position:relative}.notification-badge{align-items:center;animation:pulse 2s infinite;background:#ff4757;border-radius:50%;color:#fff;display:flex;font-size:10px;font-weight:700;height:18px;justify-content:center;position:absolute;right:-5px;top:-5px;width:18px}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1)}}.notification-panel{background:#fff;border:1px solid #e0e0e0;border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,.12);max-height:500px;overflow:hidden;position:absolute;right:0;top:100%;width:350px;z-index:1000}.notification-header{align-items:center;background:#f8f9fa;border-bottom:1px solid #e0e0e0;display:flex;justify-content:space-between;padding:16px 20px}.notification-header h4{color:#333;font-size:16px;font-weight:600;margin:0}.close-btn{align-items:center;background:none;border:none;border-radius:50%;color:#999;cursor:pointer;display:flex;font-size:20px;height:24px;justify-content:center;padding:0;transition:all .2s ease;width:24px}.close-btn:hover{background:#e0e0e0;color:#666}.notification-content{max-height:300px;overflow-y:auto;padding:0}.notification-item{border-bottom:1px solid #f0f0f0;cursor:pointer;padding:12px 20px;transition:all .2s ease}.notification-item:hover{background:#f8f9fa}.notification-item.unread{background:#f0f8ff;border-left:3px solid #1890ff}.notification-item:last-child{border-bottom:none}.notification-item-title{color:#333;font-size:14px;font-weight:600;margin-bottom:4px}.notification-item-content{color:#666;font-size:13px;line-height:1.4;margin-bottom:6px;max-height:60px;overflow:hidden;position:relative;word-wrap:break-word;transition:max-height .3s ease-in-out;word-break:break-all}.notification-item-content:after{background:linear-gradient(90deg,transparent,#fff);bottom:0;content:"";height:20px;pointer-events:none;position:absolute;right:0;width:20px}.notification-item-content.expanded{max-height:none}.notification-item-content.expanded:after{display:none}.notification-item-content.long-content{cursor:pointer}.notification-item-content .expand-btn{background-color:rgba(24,144,255,.1);border-radius:3px;color:#1890ff;cursor:pointer;display:inline-block;font-size:12px;margin-left:8px;padding:2px 6px;transition:all .2s ease;user-select:none}.notification-item-content .expand-btn:hover{background-color:rgba(24,144,255,.2);text-decoration:none}.notification-item-content .expand-btn.expanded{background-color:rgba(24,144,255,.15)}.notification-item-content .content-text{display:inline}.notification-item-time{color:#999;font-size:11px}.notification-footer{align-items:center;background:#f8f9fa;border-top:1px solid #e0e0e0;display:flex;justify-content:space-between;padding:12px 20px}.view-all-btn{color:#1890ff;font-size:13px;font-weight:500;text-decoration:none}.view-all-btn:hover{text-decoration:underline}.mark-all-btn{background:#1890ff;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:12px;padding:6px 12px;transition:all .2s ease}.mark-all-btn:hover{background:#40a9ff}.notification-empty{color:#999;padding:40px 20px;text-align:center}.notification-empty i{color:#ddd;font-size:32px;margin-bottom:12px}.notification-loading{color:#999;padding:20px;text-align:center}