.rewards-commission-page{min-height:100vh;background:#000000;color:#ffffff;padding:40px 32px;font-family:Inter,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,sans-serif}.rewards-commission-page .commission-error,.rewards-commission-page .commission-loading{display:flex;align-items:center;justify-content:center;min-height:100vh;background:#000000}.rewards-commission-page .error-container,.rewards-commission-page .loading-container{display:flex;flex-direction:column;align-items:center;gap:16px;text-align:center}.rewards-commission-page .loading-spinner{border:4px solid rgba(255,255,255,.1);border-left-color:#00bcd4;border-radius:50%;width:36px;height:36px;animation:spin 1s linear infinite}.rewards-commission-page .error-icon{font-size:48px;color:#f44336;margin-bottom:16px}.rewards-commission-page .error-message{color:rgba(255,255,255,.8);font-size:16px}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}.rewards-commission-page .animate-spin{animation:spin 1s linear infinite}.rewards-commission-page .commission-container{max-width:1400px;margin:0 auto}.rewards-commission-page .commission-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.rewards-commission-page .page-title{color:#ffffff;font-size:28px;font-weight:700;margin:0;background:linear-gradient(135deg,#ffffff,#00bcd4);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.rewards-commission-page .user-info{display:flex;align-items:center;gap:16px}.rewards-commission-page .user-code{border:1px solid rgba(0,188,212,.3);border-radius:20px}.rewards-commission-page .refresh-data-button,.rewards-commission-page .user-code{background:rgba(0,188,212,.1);color:#00bcd4;padding:8px 16px;font-size:14px;font-weight:500}.rewards-commission-page .refresh-data-button{display:flex;align-items:center;gap:8px;border:1px solid rgba(0,188,212,.3);border-radius:8px;cursor:pointer;transition:all .3s ease}.rewards-commission-page .refresh-data-button:hover:not(:disabled){background:rgba(0,188,212,.2);border-color:rgba(0,188,212,.5);transform:translateY(-1px)}.rewards-commission-page .refresh-data-button:disabled{opacity:.5;cursor:not-allowed}.rewards-commission-page .refresh-data-button svg{font-size:16px}.rewards-commission-page .user-ranks-card{background:linear-gradient(135deg,rgba(0,188,212,.1),rgba(0,188,212,.05));border:1px solid rgba(0,188,212,.2);border-radius:16px;padding:24px;margin-bottom:32px;backdrop-filter:blur(10px)}.rewards-commission-page .ranks-content{display:flex;justify-content:space-between;align-items:center}.rewards-commission-page .ranks-title{color:#00bcd4;font-size:20px;font-weight:600;margin:0 0 16px}.rewards-commission-page .ranks-details{display:flex;gap:32px}.rewards-commission-page .rank-item{display:flex;align-items:center;gap:12px}.rewards-commission-page .rank-icon{color:#00bcd4;font-size:20px}.rewards-commission-page .rank-text{display:flex;flex-direction:column;gap:2px}.rewards-commission-page .rank-label{color:rgba(255,255,255,.7);font-size:14px}.rewards-commission-page .rank-value{color:#ffffff;font-size:16px;font-weight:600}.rewards-commission-page .refresh-ranks-button{display:flex;align-items:center;gap:8px;background:#00bcd4;color:#ffffff;border:none;border-radius:8px;padding:12px 20px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease}.rewards-commission-page .refresh-ranks-button:hover:not(:disabled){background:#00acc1;transform:translateY(-1px)}.rewards-commission-page .refresh-ranks-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.rewards-commission-page .summary-stats{display:grid;grid-template-columns:1fr 1fr 1fr;gap:24px;margin-bottom:32px}.rewards-commission-page .stat-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:24px;backdrop-filter:blur(10px);transition:all .3s ease;position:relative;overflow:hidden}.rewards-commission-page .stat-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#00bcd4,#00acc1)}.rewards-commission-page .stat-card:hover{transform:translateY(-2px);box-shadow:0 8px 32px rgba(0,188,212,.2)}.rewards-commission-page .stat-card.total-earned:before{background:linear-gradient(90deg,#4caf50,#66bb6a)}.rewards-commission-page .stat-card.pending-rewards:before{background:linear-gradient(90deg,#ff9800,#ffb74d)}.rewards-commission-page .stat-card.claim-all{display:flex;flex-direction:column;justify-content:center}.rewards-commission-page .stat-icon{color:#00bcd4;font-size:24px;margin-bottom:12px}.rewards-commission-page .stat-content{flex:1}.rewards-commission-page .stat-label{color:rgba(255,255,255,.7);font-size:14px;font-weight:500;margin:0 0 8px}.rewards-commission-page .stat-value{color:#ffffff;font-size:24px;font-weight:700;margin:0}.rewards-commission-page .claim-all-button{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:16px 20px;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s ease}.rewards-commission-page .claim-all-button.active{background:linear-gradient(135deg,#00bcd4,#00acc1);color:#ffffff}.rewards-commission-page .claim-all-button.active:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(0,188,212,.4)}.rewards-commission-page .claim-all-button.disabled{background:rgba(255,255,255,.1);color:rgba(255,255,255,.5);cursor:not-allowed}.rewards-commission-page .claim-status{display:flex;align-items:center;gap:6px;margin-top:12px;font-size:12px;font-weight:500}.rewards-commission-page .claim-status.success{color:#4caf50}.rewards-commission-page .claim-status.error{color:#f44336}.rewards-commission-page .tab-navigation{display:flex;gap:4px;margin-bottom:32px;background:rgba(255,255,255,.05);border-radius:12px;padding:4px}.rewards-commission-page .tab-button{display:flex;align-items:center;gap:8px;flex:1;padding:16px 20px;background:transparent;border:none;border-radius:8px;color:rgba(255,255,255,.7);font-size:14px;font-weight:500;cursor:pointer;transition:all .3s ease}.rewards-commission-page .tab-button:hover{color:#ffffff;background:rgba(255,255,255,.05)}.rewards-commission-page .tab-button.active{background:#00bcd4;color:#ffffff;box-shadow:0 4px 12px rgba(0,188,212,.3)}.rewards-commission-page .pending-rewards-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:24px}.rewards-commission-page .reward-card{border:1px solid rgba(255,255,255,.1);border-radius:16px;padding:24px;backdrop-filter:blur(10px);transition:all .3s ease;position:relative;overflow:hidden}.rewards-commission-page .reward-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:currentColor;opacity:.6}.rewards-commission-page .reward-card:hover{transform:translateY(-4px);box-shadow:0 12px 40px rgba(0,0,0,.3)}.rewards-commission-page .reward-header{display:flex;align-items:flex-start;gap:16px;margin-bottom:20px}.rewards-commission-page .reward-icon{font-size:28px;padding:12px;background:rgba(255,255,255,.1);border-radius:12px;flex-shrink:0}.rewards-commission-page .reward-info{flex:1}.rewards-commission-page .reward-name{color:#ffffff;font-size:18px;font-weight:600;margin:0 0 8px}.rewards-commission-page .reward-description{color:rgba(255,255,255,.7);font-size:14px;line-height:1.4;margin:0}.rewards-commission-page .reward-amounts{display:flex;justify-content:space-between;margin-bottom:20px;padding:16px;background:rgba(255,255,255,.03);border-radius:8px}.rewards-commission-page .claimed-amount,.rewards-commission-page .pending-amount{text-align:center}.rewards-commission-page .amount-label{display:block;color:rgba(255,255,255,.6);font-size:12px;font-weight:500;margin-bottom:4px}.rewards-commission-page .amount-value{color:#ffffff;font-size:16px;font-weight:700}.rewards-commission-page .claim-button{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:12px 16px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s ease}.rewards-commission-page .claim-button.active{color:#ffffff}.rewards-commission-page .claim-button.active:hover{transform:translateY(-1px);box-shadow:0 6px 20px rgba(0,0,0,.3)}.rewards-commission-page .claim-button.disabled{background:rgba(255,255,255,.1);color:rgba(255,255,255,.5);cursor:not-allowed}.rewards-commission-page .reward-history{margin-top:8px}.rewards-commission-page .no-history{text-align:center;padding:60px 20px;background:rgba(255,255,255,.05);border-radius:16px;border:1px solid rgba(255,255,255,.1)}.rewards-commission-page .no-history-icon{font-size:48px;color:rgba(255,255,255,.3);margin-bottom:16px}.rewards-commission-page .no-history h3{color:#ffffff;font-size:20px;font-weight:600;margin:0 0 8px}.rewards-commission-page .no-history p{color:rgba(255,255,255,.6);font-size:14px;margin:0}.rewards-commission-page .history-table-container{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:16px;overflow:hidden;backdrop-filter:blur(10px)}.rewards-commission-page .history-table{width:100%;border-collapse:collapse}.rewards-commission-page .history-table thead{background:rgba(255,255,255,.05)}.rewards-commission-page .history-table th{padding:16px 20px;text-align:left;color:rgba(255,255,255,.8);font-size:14px;font-weight:600;border-bottom:1px solid rgba(255,255,255,.1)}.rewards-commission-page .history-table td{padding:16px 20px;border-bottom:1px solid rgba(255,255,255,.05);font-size:14px}.rewards-commission-page .history-table tr:hover{background:rgba(255,255,255,.02)}.rewards-commission-page .date-cell{color:rgba(255,255,255,.8)}.rewards-commission-page .type-cell .reward-type-indicator{display:flex;align-items:center;gap:8px}.rewards-commission-page .type-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.rewards-commission-page .type-name{color:#ffffff;font-weight:500}.rewards-commission-page .amount-cell .amount-value{color:#00bcd4;font-weight:600}.rewards-commission-page .status-badge{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;border-radius:12px;font-size:12px;font-weight:500}.rewards-commission-page .status-badge.completed{background:rgba(76,175,80,.2);color:#4caf50}.rewards-commission-page .description-cell{color:rgba(255,255,255,.6)}@media (max-width:1024px){.commission-page{padding:24px 16px}.summary-stats{grid-template-columns:1fr;gap:16px}.pending-rewards-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}.ranks-content{flex-direction:column;gap:20px;align-items:stretch}.ranks-details{justify-content:space-around}}@media (max-width:768px){.commission-page{padding:20px 16px}.commission-header{flex-direction:column;gap:16px;align-items:stretch;text-align:center}.page-title{font-size:24px}.ranks-details{flex-direction:column;gap:16px}.pending-rewards-grid{grid-template-columns:1fr}.reward-amounts{flex-direction:column;gap:12px}.history-table-container{overflow-x:auto}.history-table{min-width:600px}.tab-button{flex-direction:column;gap:4px;padding:12px 16px}.tab-button span{font-size:12px}}@media (max-width:480px){.commission-page{padding:16px 12px}.page-title{font-size:20px}.reward-card,.stat-card,.user-ranks-card{padding:20px}.reward-header{flex-direction:column;text-align:center;gap:12px}.reward-icon{align-self:center}}.rewards-commission-page .claim-guide-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s ease-out}.rewards-commission-page .claim-guide-message{background:white;padding:2rem;border-radius:16px;box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);text-align:center;max-width:400px;margin:0 1rem;animation:slideUp .3s ease-out}.rewards-commission-page .claim-guide-message .guide-icon{width:64px;height:64px;background:linear-gradient(135deg,#4C51BF,#667EEA);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 1rem;color:white;font-size:1.5rem}.rewards-commission-page .claim-guide-message h3{color:#1F2937;font-size:1.25rem;font-weight:600;margin-bottom:1rem}.rewards-commission-page .claim-guide-message p{color:#6B7280;font-size:1rem;line-height:1.6;margin:0}.rewards-commission-page .claim-guide-message strong{color:#4C51BF;font-weight:600}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (prefers-color-scheme:dark){.claim-guide-message{background:#1F2937;color:white}.claim-guide-message h3{color:white}.claim-guide-message p{color:#D1D5DB}}.rewards-commission-page .reward-left,.rewards-commission-page .reward-right{display:none}@media (max-width:768px){.rewards-commission-page .user-ranks-card{padding:16px;margin-bottom:20px}.rewards-commission-page .ranks-content{flex-direction:row;align-items:center;gap:12px}.rewards-commission-page .ranks-info{flex:1}.rewards-commission-page .ranks-title{font-size:16px;margin:0 0 8px;text-align:left}.rewards-commission-page .ranks-details{display:flex;flex-direction:row;gap:16px;flex-wrap:wrap}.rewards-commission-page .rank-item{display:flex;align-items:center;gap:6px;min-width:0;flex:1}.rewards-commission-page .rank-icon{font-size:16px;flex-shrink:0}.rewards-commission-page .rank-text{display:flex;flex-direction:column;gap:2px;min-width:0}.rewards-commission-page .rank-label{font-size:12px;white-space:nowrap}.rewards-commission-page .rank-value{font-size:14px;font-weight:600;white-space:nowrap}.rewards-commission-page .refresh-ranks-button{padding:8px 12px;font-size:12px;flex-shrink:0}.rewards-commission-page .refresh-ranks-button span{display:none}.rewards-commission-page .pending-rewards-grid{grid-template-columns:1fr;gap:12px}.rewards-commission-page .reward-card{padding:16px;border-radius:12px;display:flex;align-items:center;gap:16px}.rewards-commission-page .reward-left{flex:1;display:flex!important;flex-direction:column;gap:8px;align-items:center}.rewards-commission-page .reward-icon{font-size:24px;padding:8px;background:rgba(255,255,255,.1);border-radius:8px;flex-shrink:0}.rewards-commission-page .mobile-reward-title{color:#ffffff;font-size:14px;font-weight:600;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width:100%;text-align:center}.rewards-commission-page .reward-right{flex:1;display:flex!important;flex-direction:column;gap:8px;align-items:flex-end;text-align:right}.rewards-commission-page .mobile-pending-amount{display:block!important;color:#ffffff;font-size:16px;font-weight:600;white-space:nowrap}.rewards-commission-page .mobile-claimed-amount{color:rgba(255,255,255,.7);font-size:14px;font-weight:500;white-space:nowrap}.rewards-commission-page .claim-button,.rewards-commission-page .mobile-reward-summary,.rewards-commission-page .reward-amounts,.rewards-commission-page .reward-header,.rewards-commission-page .reward-info{display:none}.rewards-commission-page .summary-stats{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:12px;margin-bottom:24px}.rewards-commission-page .stat-card.total-earned{grid-column:1;grid-row:1}.rewards-commission-page .stat-card.pending-rewards{grid-column:2;grid-row:1}.rewards-commission-page .stat-card.claim-all{grid-column:1/-1;grid-row:2}.rewards-commission-page .stat-card{padding:16px;display:flex;flex-direction:row;align-items:center;gap:12px;min-width:0}.rewards-commission-page .stat-card.pending-rewards,.rewards-commission-page .stat-card.total-earned{padding:12px;gap:8px}.rewards-commission-page .stat-card:before{display:none}.rewards-commission-page .stat-icon{font-size:20px;margin-bottom:0;flex-shrink:0;width:40px;height:40px;background:rgba(0,188,212,.1);border-radius:8px;display:flex;align-items:center;justify-content:center}.rewards-commission-page .stat-content{flex:1;min-width:0}.rewards-commission-page .stat-label{font-size:13px;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.rewards-commission-page .stat-value{font-size:18px;font-weight:700;margin:0}.rewards-commission-page .stat-card.claim-all{flex-direction:column;justify-content:center;padding:12px;gap:8px}.rewards-commission-page .claim-all-button{padding:12px 16px;font-size:14px;font-weight:600;border-radius:8px}.rewards-commission-page .claim-all-button span{font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rewards-commission-page .claim-status{margin-top:6px;font-size:11px;justify-content:center}}@media (max-width:420px){.rewards-commission-page .user-ranks-card{padding:12px;margin-bottom:16px}.rewards-commission-page .ranks-title{font-size:14px;margin:0 0 6px}.rewards-commission-page .ranks-details{gap:12px}.rewards-commission-page .rank-item{gap:4px}.rewards-commission-page .rank-icon{font-size:14px}.rewards-commission-page .rank-label{font-size:11px}.rewards-commission-page .rank-value{font-size:13px}.rewards-commission-page .refresh-ranks-button{padding:6px 8px}.rewards-commission-page .refresh-ranks-button svg{font-size:14px}.rewards-commission-page .reward-card{padding:12px;gap:12px}.rewards-commission-page .reward-left,.rewards-commission-page .reward-right{gap:6px}.rewards-commission-page .reward-icon{font-size:20px;padding:6px}.rewards-commission-page .mobile-reward-title{font-size:13px}.rewards-commission-page .mobile-pending-amount{font-size:14px}.rewards-commission-page .mobile-claimed-amount{font-size:13px}.rewards-commission-page .summary-stats{display:grid;grid-template-columns:1fr 1fr;grid-template-rows:auto auto;gap:10px;margin-bottom:20px}.rewards-commission-page .stat-card.total-earned{grid-column:1;grid-row:1}.rewards-commission-page .stat-card.pending-rewards{grid-column:2;grid-row:1}.rewards-commission-page .stat-card.claim-all{grid-column:1/-1;grid-row:2}.rewards-commission-page .stat-card{padding:12px;gap:10px;min-width:0}.rewards-commission-page .stat-card.pending-rewards,.rewards-commission-page .stat-card.total-earned{padding:10px;gap:6px}.rewards-commission-page .stat-icon{width:36px;height:36px;font-size:18px}.rewards-commission-page .stat-label{font-size:12px;margin:0 0 3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.2}.rewards-commission-page .stat-value{font-size:16px}.rewards-commission-page .stat-card.claim-all{padding:10px;gap:6px}.rewards-commission-page .claim-all-button{padding:10px 14px;font-size:13px}.rewards-commission-page .claim-all-button span{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rewards-commission-page .claim-status{font-size:10px;margin-top:4px}.rewards-commission-page{padding:12px 8px 100px}.rewards-commission-page .commission-container{gap:20px;max-width:100%}.rewards-commission-page .commission-section,.rewards-commission-page .stats-section{padding:20px 16px;border-radius:12px;margin-bottom:16px}.rewards-commission-page .section-title{font-size:18px;margin-bottom:16px;text-align:center}.rewards-commission-page .stats-grid{grid-template-columns:1fr;gap:12px;margin-bottom:20px}.rewards-commission-page .stat-card{padding:16px;border-radius:12px;text-align:center}.rewards-commission-page .stat-label{font-size:12px;margin-bottom:8px}.rewards-commission-page .stat-value{font-size:20px;font-weight:600}.rewards-commission-page .stat-unit{font-size:14px;margin-left:4px}.rewards-commission-page .commission-table{display:none}.rewards-commission-page .commission-card{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:16px;margin-bottom:12px}.rewards-commission-page .commission-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.1)}.rewards-commission-page .commission-amount{font-size:16px;font-weight:600;color:#4caf50}.rewards-commission-page .commission-date{font-size:12px;color:rgba(255,255,255,.7)}.rewards-commission-page .filter-controls{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}.rewards-commission-page .filter-group{display:flex;flex-direction:column;gap:8px}.rewards-commission-page .filter-select{width:100%;padding:12px 16px;font-size:16px;border-radius:10px;min-height:44px}.rewards-commission-page .loading-container{padding:40px 20px;text-align:center}.rewards-commission-page .loading-spinner{width:32px;height:32px;margin-bottom:16px}.rewards-commission-page .pagination{display:flex;justify-content:center;gap:8px;margin-top:20px}.rewards-commission-page .pagination-btn{padding:8px 12px;min-height:44px;min-width:44px;border-radius:8px;font-size:14px}}