.feature-comparison-section{margin-top:30px;background:#fff;border-radius:12px}.comparison-title{font-size:16px;font-weight:500;color:#333;margin-bottom:15px}.comparison-table{width:100%;border-radius:8px;overflow:hidden;border:1px solid #eee}.table-header{display:flex;background:#f8f9fa}.header-cell{flex:1;padding:12px;text-align:center;font-weight:500;color:#333;font-size:14px}.table-row{display:flex;border-top:1px solid #eee}.table-cell{flex:1;padding:12px;text-align:center;font-size:14px;color:#666;display:flex;align-items:center;justify-content:center}.feature-cell{color:#333;font-weight:500}.check-icon{color:#52c41a;margin-right:4px}.cross-icon{color:#ff4d4f;margin-right:4px}.feature-text{font-size:12px}.member-text{color:#52c41a}.normal-text{color:#ff4d4f}.member-renewal-note{margin-top:20px;padding:0 20px}.member-renewal-note p{margin:8px 0;font-size:12px;color:#999;text-align:center}body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;-webkit-font-smoothing:antialiased;background:#fff url(https://cos.dengtadaka.cn/p/app/member-top.jpg) no-repeat top center;background-size:100% auto;min-height:100vh}.page-view-box{position:relative;width:100%;min-height:100vh;padding:20px;box-sizing:border-box}.header{padding:20px 0;text-align:center}.title{font-size:18px;color:#333;font-weight:500}.member-benefits-container{margin:0;padding:15px 10px;background:#fffffff2;border-radius:12px;box-shadow:0 0 12px #ff993359}.member-benefits-title{font-size:16px;font-weight:500;color:#333;margin-bottom:15px;padding-left:5px}.member-benefits-content{display:flex;justify-content:space-between;align-items:flex-start;gap:5px}.benefit-item{flex:1;text-align:center;min-width:0}.benefit-icon{width:36px;height:36px;margin:0 auto 5px}.icon-img{width:100%;height:100%;object-fit:contain}.benefit-text{color:#333}.benefit-line1{font-size:10px;margin-top:2px;color:#666}.benefit-line2{font-size:13px;color:#000}.member-purchase-section{margin-top:20px;background:#fffffff2;border-radius:12px}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.section-title{font-size:16px;font-weight:500;color:#333}.member-plans{display:flex;flex-direction:column;gap:15px}.member-plan-item{position:relative;display:flex;padding:20px;background:#f8f9fa;border-radius:12px;border:1px solid #e9ecef;cursor:pointer;transition:all .3s ease}.member-plan-item:hover,.plan-selected{border-color:#f93;background:#fff8f0}.plan-tag{position:absolute;top:-1px;right:20px;padding:4px 8px;font-size:12px;color:#fff;border-radius:0 0 8px 8px}.tag-popular{background:#ff6b6b}.tag-best-value{background:#f93}.plan-price-section{width:100px;text-align:center}.plan-current-price{font-size:24px;color:#f93;font-weight:700}.currency{font-size:14px}.plan-original-price{font-size:12px;color:#999;text-decoration:line-through;margin-top:4px}.plan-info-section{flex:1;margin-left:15px}.plan-title{font-size:16px;font-weight:500;color:#333;margin-bottom:8px}.plan-desc{font-size:12px;color:#666}.payment-button-container{margin-top:15px;text-align:center}.payment-button{width:100%;height:44px;background:#f93;color:#fff;border:none;border-radius:22px;font-size:16px;font-weight:500;cursor:pointer;transition:all .3s ease}.payment-button:disabled{background:#ccc;cursor:not-allowed}.payment-button:hover:not(:disabled){background:#f80}.auth-loading{text-align:center;padding:20px}.auth-text{font-size:16px;color:#333;margin-bottom:10px}.auth-hint{font-size:14px;color:#666}.member-renewal-note{margin-top:20px;padding:0 20px;color:#999;font-size:12px}.member-renewal-note p{margin:5px 0}.payment-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.payment-modal{background:#fff;border-radius:12px;width:100%;max-width:400px;max-height:80vh;overflow-y:auto;box-shadow:0 10px 30px #0000004d;animation:modalSlideIn .3s ease-out}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-20px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 20px 0;border-bottom:1px solid #f0f0f0;margin-bottom:20px}.modal-title{font-size:18px;font-weight:600;color:#333}.modal-close{background:none;border:none;font-size:24px;color:#999;cursor:pointer;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s}.modal-close:hover{background-color:#f5f5f5;color:#666}.modal-body{padding:0 20px 20px;text-align:center}.status-icon{width:60px;height:60px;border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 16px;font-size:30px;font-weight:700}.icon-success{background-color:#e8f5e8;color:#4caf50}.icon-error{background-color:#fdecea;color:#f44336}.icon-warning{background-color:#fff7e6;color:#ff9800}.icon-loading{background-color:#e3f2fd;color:#2196f3;animation:pulse 1.5s infinite}.icon-info{background-color:#f0f7ff;color:#1976d2}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.status-message{font-size:20px;font-weight:600;color:#333;margin-bottom:12px}.success-details,.error-details,.cancel-details,.paying-details{margin-top:16px}.success-details p{color:#4caf50;margin:8px 0;font-size:14px}.error-details p{color:#f44336;margin:8px 0;font-size:14px}.cancel-details p{color:#666;margin:8px 0;font-size:14px}.paying-details p{color:#2196f3;margin:8px 0;font-size:14px}.modal-footer{padding:0 20px 20px;display:flex;gap:12px}.modal-button{flex:1;padding:12px 20px;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s}.success-button{background:linear-gradient(135deg,#4caf50,#45a049);color:#fff}.success-button:hover{background:linear-gradient(135deg,#45a049,#3d8b40);transform:translateY(-1px)}.retry-button{background:linear-gradient(135deg,#ff9800,#f57c00);color:#fff}.retry-button:hover{background:linear-gradient(135deg,#f57c00,#ef6c00);transform:translateY(-1px)}.primary-button{background:linear-gradient(135deg,#2196f3,#1976d2);color:#fff}.primary-button:hover{background:linear-gradient(135deg,#1976d2,#1565c0);transform:translateY(-1px)}.secondary-button{background:#f5f5f5;color:#666;border:1px solid #ddd}.secondary-button:hover{background:#eee;color:#555}@media (max-width: 480px){.payment-modal{margin:10px;max-width:calc(100vw - 20px)}.modal-footer{flex-direction:column}.modal-button{width:100%}}
