.coffee-bean-wallet{background:#fff;border-radius:12px;padding:30px;box-shadow:0 2px 8px #0000001a}.wallet-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;flex-wrap:wrap;gap:20px}.wallet-header h2{margin:0;color:#333;font-size:24px}.wallet-nav{display:flex;gap:10px}.nav-button{padding:8px 20px;background:#f5f5f5;border:none;border-radius:20px;font-size:14px;cursor:pointer;transition:all .3s;color:#666}.nav-button:hover{background:#e0e0e0}.nav-button.active{background:#8b4513;color:#fff}.wallet-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;gap:15px}.loading-spinner.small{width:30px;height:30px;border-width:3px}.wallet-overview{animation:fadeIn .3s ease-in}.balance-card{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:16px;padding:25px;text-align:center}.balance-card.main-balance{margin-bottom:20px}.balance-label{font-size:14px;opacity:.9;margin-bottom:10px}.balance-value{font-size:48px;font-weight:700;margin-bottom:5px}.balance-value.small{font-size:32px}.balance-value.warning{color:#ffe4b5}.balance-unit{font-size:18px;opacity:.9}.balance-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px}.expire-warning{background:#fff3e0;border-left:4px solid #FF9800;padding:15px;border-radius:8px;display:flex;align-items:center;gap:10px;margin-bottom:20px}.expire-icon{font-size:20px}.wallet-tips{background:#f5f5f5;border-radius:8px;padding:20px}.wallet-tips h3{margin:0 0 15px;color:#333;font-size:16px}.wallet-tips ul{margin:0;padding-left:20px;color:#666}.wallet-tips li{margin-bottom:8px}.wallet-history{animation:fadeIn .3s ease-in}.history-list{display:flex;flex-direction:column;gap:15px}.history-item{display:flex;justify-content:space-between;align-items:center;padding:15px;background:#f9f9f9;border-radius:8px;transition:all .3s}.history-item:hover{background:#f0f0f0;transform:translate(5px)}.history-left{display:flex;gap:15px;align-items:center}.history-icon{font-size:24px}.history-info{display:flex;flex-direction:column;gap:5px}.history-source{font-weight:600;color:#333}.history-desc{font-size:14px;color:#666}.history-date{font-size:12px;color:#999}.history-right{text-align:right;display:flex;flex-direction:column;gap:5px}.history-amount{font-size:20px;font-weight:700}.history-amount.positive{color:#4caf50}.history-amount.negative{color:#f44336}.history-balance{font-size:12px;color:#999}.transaction-earn{border-left:3px solid #4CAF50}.transaction-spend{border-left:3px solid #F44336}.transaction-expired{border-left:3px solid #FF9800}.loading-more{display:flex;align-items:center;justify-content:center;gap:10px;padding:20px;color:#666}.load-more-button{width:100%;padding:12px;background:#8b4513;color:#fff;border:none;border-radius:8px;font-size:16px;cursor:pointer;transition:background .3s;margin-top:20px}.load-more-button:hover{background:#6b3410}.no-more-data,.no-data{text-align:center;padding:40px;color:#999}.wallet-stats{animation:fadeIn .3s ease-in}.stats-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-bottom:30px}.stat-card{background:#f9f9f9;border-radius:12px;padding:20px;text-align:center}.stat-label{font-size:14px;color:#666;margin-bottom:10px}.stat-value{font-size:32px;font-weight:700}.stat-value.earn{color:#4caf50}.stat-value.spend{color:#f44336}.stat-value.expired{color:#ff9800}.monthly-stats{background:#f5f5f5;border-radius:12px;padding:20px;margin-bottom:30px}.monthly-stats h3{margin:0 0 20px;color:#333}.monthly-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.monthly-item{display:flex;justify-content:space-between;align-items:center;padding:10px;background:#fff;border-radius:8px}.monthly-label{color:#666}.monthly-value{font-size:20px;font-weight:700}.monthly-value.earn{color:#4caf50}.monthly-value.spend{color:#f44336}.source-stats{background:#f5f5f5;border-radius:12px;padding:20px}.source-stats h3{margin:0 0 20px;color:#333}.source-list{display:flex;flex-direction:column;gap:15px}.source-item{display:flex;flex-direction:column;gap:10px}.source-info{display:flex;justify-content:space-between;align-items:center}.source-name{font-weight:500;color:#333}.source-amount{color:#666;font-size:14px}.source-bar{width:100%;height:8px;background:#e0e0e0;border-radius:4px;overflow:hidden}.source-bar-fill{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);border-radius:4px;transition:width .5s ease-in-out}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media(max-width:768px){.wallet-header{flex-direction:column;align-items:stretch}.wallet-nav{justify-content:center}.balance-grid,.stats-grid,.monthly-grid{grid-template-columns:1fr}.history-item{flex-direction:column;align-items:stretch;gap:15px}.history-right{text-align:left;border-top:1px solid #E0E0E0;padding-top:15px}}.referral-system{background:#fff;border-radius:12px;padding:30px;box-shadow:0 2px 8px #0000001a}.referral-header{text-align:center;margin-bottom:30px}.referral-header h2{margin:0 0 10px;color:#333;font-size:24px}.referral-subtitle{color:#666;font-size:14px;margin:0}.referral-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;gap:15px}.section-title{margin-bottom:20px}.section-title h3{margin:0 0 8px;color:#333;font-size:18px}.section-title p{margin:0;color:#666;font-size:14px}.bind-referral-section{background:#f9f9f9;border-radius:12px;padding:25px;margin-bottom:30px}.bind-form{margin-top:20px}.input-group{display:flex;gap:10px}.input-group input{flex:1;padding:12px 16px;border:2px solid #E0E0E0;border-radius:8px;font-size:16px;text-transform:uppercase;transition:border-color .3s}.input-group input:focus{outline:none;border-color:#8b4513}.input-group button{padding:12px 32px;background:#8b4513;color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:500;cursor:pointer;transition:background .3s}.input-group button:hover:not(:disabled){background:#6b3410}.input-group button:disabled{opacity:.5;cursor:not-allowed}.alert{margin-top:15px;padding:12px 16px;border-radius:8px;font-size:14px}.alert-error{background:#ffebee;color:#c62828}.alert-success{background:#e8f5e9;color:#2e7d32}.referred-by-info{margin-bottom:30px}.info-card{display:flex;align-items:center;gap:15px;padding:20px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:12px}.info-icon{font-size:32px}.info-content{display:flex;flex-direction:column;gap:5px}.info-label{font-size:14px;opacity:.9}.info-value{font-size:20px;font-weight:600}.my-referral-section{background:#f5f5f5;border-radius:12px;padding:25px;margin-bottom:30px}.referral-code-display{margin:20px 0}.code-box{background:#fff;border-radius:12px;padding:20px;text-align:center;position:relative}.code-label{display:block;font-size:14px;color:#666;margin-bottom:10px}.code-value{font-size:36px;font-weight:700;color:#8b4513;letter-spacing:4px;margin-bottom:15px}.copy-button{padding:8px 20px;background:#8b4513;color:#fff;border:none;border-radius:20px;font-size:14px;cursor:pointer;transition:all .3s}.copy-button:hover{background:#6b3410}.share-buttons{display:flex;gap:10px;justify-content:center}.share-button{flex:1;padding:12px 20px;border:none;border-radius:8px;font-size:16px;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:8px;transition:all .3s}.share-button.line{background:#00b900;color:#fff}.share-button.line:hover{background:#090}.share-button.more{background:#e0e0e0;color:#333}.share-button.more:hover{background:#d0d0d0}.share-icon{font-size:20px}.referral-stats{background:#f9f9f9;border-radius:12px;padding:25px;margin-bottom:30px}.stats-overview{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin:20px 0}.stat-box{background:#fff;border-radius:8px;padding:20px;text-align:center}.stat-number{font-size:32px;font-weight:700;color:#8b4513;margin-bottom:8px}.stat-label{font-size:14px;color:#666}.referral-list{margin-top:30px}.referral-list h4{margin:0 0 15px;color:#333}.referral-items{display:flex;flex-direction:column;gap:10px}.referral-item{display:flex;align-items:center;gap:15px;padding:15px;background:#fff;border-radius:8px;transition:all .3s}.referral-item:hover{transform:translate(5px);box-shadow:0 2px 8px #0000001a}.referral-avatar{width:48px;height:48px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700}.referral-info{flex:1}.referral-name{font-weight:600;color:#333;margin-bottom:4px}.referral-date{font-size:12px;color:#999}.referral-reward{text-align:center}.reward-amount{font-size:20px;font-weight:700;color:#4caf50}.reward-label{font-size:12px;color:#666}.referral-rules{background:#fff9e6;border-left:4px solid #FFC107;border-radius:8px;padding:20px}.referral-rules h4{margin:0 0 15px;color:#333}.referral-rules ul{margin:0;padding-left:20px;color:#666}.referral-rules li{margin-bottom:8px;font-size:14px}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease-in}.modal-content{background:#fff;border-radius:12px;width:90%;max-width:500px;max-height:90vh;overflow-y:auto;animation:slideUp .3s ease-out}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #E0E0E0}.modal-header h3{margin:0;color:#333}.modal-close{background:none;border:none;font-size:24px;cursor:pointer;color:#666;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .3s}.modal-close:hover{background:#f0f0f0}.modal-body{padding:20px}.modal-body p{margin:0 0 15px;color:#666}.link-display{display:flex;gap:10px;margin-bottom:30px}.link-input{flex:1;padding:10px;border:1px solid #E0E0E0;border-radius:6px;font-size:14px;color:#666}.copy-link-button{padding:10px 20px;background:#8b4513;color:#fff;border:none;border-radius:6px;font-size:14px;cursor:pointer;transition:background .3s}.copy-link-button:hover{background:#6b3410}.qr-code-section{text-align:center}.qr-code-placeholder{width:200px;height:200px;background:#f0f0f0;margin:15px auto;display:flex;align-items:center;justify-content:center;border-radius:8px;color:#999}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}@media(max-width:768px){.stats-overview{grid-template-columns:1fr}.share-buttons{flex-direction:column}.referral-item{flex-direction:column;text-align:center}}.coupon-center{background:#fff;border-radius:12px;padding:30px;box-shadow:0 2px 8px #0000001a}.coupon-header{text-align:center;margin-bottom:30px}.coupon-header h2{margin:0 0 10px;color:#333;font-size:24px}.coupon-subtitle{color:#666;font-size:14px;margin:0}.coupon-loading{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:300px;gap:15px}.claim-coupon-section{background:#f9f9f9;border-radius:12px;padding:25px;margin-bottom:30px}.claim-form{margin-top:20px}.coupon-filters{display:flex;gap:10px;margin-bottom:25px;overflow-x:auto;-webkit-overflow-scrolling:touch}.filter-button{padding:8px 20px;background:#f5f5f5;border:none;border-radius:20px;font-size:14px;cursor:pointer;transition:all .3s;color:#666;white-space:nowrap}.filter-button:hover{background:#e0e0e0}.filter-button.active{background:#8b4513;color:#fff}.coupon-list{min-height:200px}.no-coupons{text-align:center;padding:60px 20px;color:#999}.no-coupons-icon{font-size:64px;margin-bottom:20px;opacity:.5}.no-coupons p{margin:10px 0}.no-coupons-hint{font-size:14px;color:#bbb}.coupon-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:20px}.coupon-card{background:#fff;border:2px solid #E0E0E0;border-radius:12px;overflow:hidden;cursor:pointer;transition:all .3s;position:relative}.coupon-card:hover{transform:translateY(-5px);box-shadow:0 8px 20px #00000026}.coupon-card.status-available{border-color:#4caf50}.coupon-card.status-used{border-color:#999;opacity:.7}.coupon-card.status-expired{border-color:#ff9800;opacity:.7}.coupon-main{padding:20px;display:flex;gap:20px;align-items:center}.coupon-discount{flex-shrink:0;width:80px;height:80px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:700}.discount-value{text-align:center;word-break:break-word}.coupon-info{flex:1}.coupon-name{margin:0 0 8px;color:#333;font-size:16px;font-weight:600}.coupon-code{margin:0 0 4px;color:#666;font-size:14px}.coupon-condition{margin:0;color:#999;font-size:12px}.coupon-footer{padding:12px 20px;background:#f9f9f9;display:flex;justify-content:space-between;align-items:center;font-size:12px}.coupon-status{font-weight:600;text-transform:uppercase}.coupon-status.status-available{color:#4caf50}.coupon-status.status-used{color:#999}.coupon-status.status-expired{color:#ff9800}.coupon-expiry{color:#666}.coupon-tips{background:#fff9e6;border-left:4px solid #FFC107;border-radius:8px;padding:20px;margin-top:30px}.coupon-tips h4{margin:0 0 15px;color:#333}.coupon-tips ul{margin:0;padding-left:20px;color:#666}.coupon-tips li{margin-bottom:8px;font-size:14px}.coupon-detail-card{text-align:center;padding:20px}.detail-discount{font-size:48px;font-weight:700;color:#8b4513;margin-bottom:20px}.coupon-detail-card h2{margin:0 0 30px;color:#333}.detail-info{text-align:left;background:#f9f9f9;border-radius:8px;padding:20px;margin-bottom:25px}.detail-item{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid #E0E0E0}.detail-item:last-child{border-bottom:none}.detail-label{color:#666;font-size:14px}.detail-value{color:#333;font-weight:600;font-size:14px}.detail-value.status-available{color:#4caf50}.detail-value.status-used{color:#999}.detail-value.status-expired{color:#ff9800}.use-coupon-button{width:100%;padding:14px;background:#8b4513;color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:background .3s}.use-coupon-button:hover{background:#6b3410}@media(max-width:768px){.coupon-grid{grid-template-columns:1fr}.coupon-main{flex-direction:column;text-align:center}.coupon-discount{width:100px;height:100px}}.member-center{max-width:1200px;margin:0 auto;padding:20px}.member-center-loading,.member-center-error{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;gap:20px}.loading-spinner{width:50px;height:50px;border:4px solid #f3f3f3;border-top:4px solid #8B4513;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.member-header{display:flex;gap:30px;padding:30px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:16px;color:#fff;margin-bottom:30px}.member-avatar{width:120px;height:120px;border-radius:50%;overflow:hidden;border:4px solid white;flex-shrink:0}.member-avatar img{width:100%;height:100%;object-fit:cover}.avatar-placeholder{width:100%;height:100%;background:#8b4513;display:flex;align-items:center;justify-content:center;font-size:48px;font-weight:700}.member-info{flex:1}.member-info h1{margin:0 0 10px;font-size:32px}.member-tier{display:flex;align-items:center;gap:10px;margin-bottom:20px}.tier-icon{font-size:24px}.tier-name{font-size:18px;font-weight:500}.member-stats{display:flex;gap:30px}.stat-item{display:flex;flex-direction:column;gap:5px}.stat-label{font-size:14px;opacity:.9}.stat-value{font-size:20px;font-weight:700}.member-tabs{display:flex;gap:10px;border-bottom:2px solid #e0e0e0;margin-bottom:30px}.tab-button{padding:12px 24px;background:none;border:none;font-size:16px;cursor:pointer;position:relative;transition:all .3s;color:#666}.tab-button:hover{color:#333}.tab-button.active{color:#8b4513;font-weight:600}.tab-button.active:after{content:"";position:absolute;bottom:-2px;left:0;right:0;height:3px;background:#8b4513}.member-content{min-height:400px}.profile-section{background:#fff;border-radius:12px;padding:30px;box-shadow:0 2px 8px #0000001a}.profile-section h2{margin-top:0;margin-bottom:25px;color:#333}.profile-form{max-width:500px}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;font-weight:500;color:#555}.form-group input{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:8px;font-size:16px;transition:border-color .3s}.form-group input:focus{outline:none;border-color:#8b4513}.form-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:30px}.form-actions button{padding:10px 24px;border:none;border-radius:8px;font-size:16px;cursor:pointer;transition:all .3s}.form-actions button[type=submit]{background:#8b4513;color:#fff}.form-actions button[type=submit]:hover:not(:disabled){background:#6b3410}.form-actions button[type=button]{background:#e0e0e0;color:#333}.form-actions button[type=button]:hover:not(:disabled){background:#d0d0d0}.form-actions button:disabled{opacity:.5;cursor:not-allowed}.profile-info{display:flex;flex-direction:column;gap:20px}.info-item{display:flex;justify-content:space-between;padding:12px 0;border-bottom:1px solid #f0f0f0}.info-label{font-weight:500;color:#555}.info-value{color:#333}.edit-button{align-self:flex-start;padding:10px 24px;background:#8b4513;color:#fff;border:none;border-radius:8px;font-size:16px;cursor:pointer;transition:background .3s;margin-top:20px}.edit-button:hover{background:#6b3410}@media(max-width:768px){.member-header{flex-direction:column;align-items:center;text-align:center}.member-stats{justify-content:center}.member-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch}.tab-button{white-space:nowrap}}
