.referral-page{min-height:100vh;padding:120px 20px 60px;background:linear-gradient(180deg,#f8fafc,#e2e8f0)}.referral-page .loading-spinner{font-size:18px;color:#64748b}.referral-page .auth-required,.referral-page .loading-spinner{display:flex;justify-content:center;align-items:center;min-height:60vh}.referral-page .auth-required{flex-direction:column;text-align:center;gap:20px}.referral-page .auth-required h2{font-size:32px;font-weight:700;color:#0f172a}.referral-page .auth-required p{font-size:18px;color:#64748b}.referral-page .referral-container{max-width:1000px;margin:0 auto}.referral-page .referral-container .referral-heading{font-size:42px;font-weight:800;text-align:center;color:#0f172a;margin-bottom:10px}@media screen and (max-width:640px){.referral-page .referral-container .referral-heading{font-size:32px}}.referral-page .referral-container .referral-subheading{text-align:center;font-size:18px;color:#64748b;margin-bottom:40px}.referral-page .referral-container .referral-code-card{background:#fff;border-radius:20px;padding:40px;box-shadow:0 4px 6px rgba(0,0,0,.05);margin-bottom:30px;text-align:center}.referral-page .referral-container .referral-code-card h3{font-size:20px;font-weight:600;color:#0f172a;margin-bottom:20px}.referral-page .referral-container .referral-code-card .code-display{display:flex;align-items:center;justify-content:center;gap:15px;margin-bottom:15px}.referral-page .referral-container .referral-code-card .code-display .code-text{font-size:16px;font-weight:600;color:#10b981;font-family:Courier New,monospace;word-break:break-all}@media screen and (max-width:640px){.referral-page .referral-container .referral-code-card .code-display .code-text{font-size:14px}}.referral-page .referral-container .referral-code-card .code-display .copy-button{background:#f1f5f9;border:none;border-radius:10px;padding:12px;cursor:pointer;transition:all .2s;display:flex;align-items:center;justify-content:center}.referral-page .referral-container .referral-code-card .code-display .copy-button:hover{background:#e2e8f0;transform:scale(1.05)}.referral-page .referral-container .referral-code-card .code-display .copy-button:active{transform:scale(.95)}.referral-page .referral-container .referral-code-card .code-hint{font-size:14px;color:#64748b}.referral-page .referral-container .stats-card{background:linear-gradient(135deg,#10b981,#059669);border-radius:20px;padding:30px;box-shadow:0 4px 6px rgba(0,0,0,.05);margin-bottom:30px}.referral-page .referral-container .stats-card .stat-item{display:flex;align-items:center;gap:20px;color:#fff}.referral-page .referral-container .stats-card .stat-item .stat-icon{flex-shrink:0}.referral-page .referral-container .stats-card .stat-item .stat-content{display:flex;flex-direction:column}.referral-page .referral-container .stats-card .stat-item .stat-content .stat-number{font-size:42px;font-weight:800;line-height:1;margin-bottom:5px}.referral-page .referral-container .stats-card .stat-item .stat-content .stat-label{font-size:16px;opacity:.95}.referral-page .referral-container .share-section{background:#fff;border-radius:20px;padding:40px;box-shadow:0 4px 6px rgba(0,0,0,.05);margin-bottom:30px}.referral-page .referral-container .share-section h3{font-size:24px;font-weight:700;color:#0f172a;margin-bottom:25px;text-align:center}.referral-page .referral-container .share-section .share-buttons{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:15px}.referral-page .referral-container .share-section .share-buttons .share-btn{display:flex;align-items:center;justify-content:center;gap:10px;padding:15px 20px;border:none;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s;color:#fff}.referral-page .referral-container .share-section .share-buttons .share-btn svg{flex-shrink:0}.referral-page .referral-container .share-section .share-buttons .share-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(0,0,0,.15)}.referral-page .referral-container .share-section .share-buttons .share-btn.whatsapp{background:#25d366}.referral-page .referral-container .share-section .share-buttons .share-btn.facebook{background:#1877f2}.referral-page .referral-container .share-section .share-buttons .share-btn.twitter{background:#1da1f2}.referral-page .referral-container .prizes-section{background:#fff;border-radius:20px;padding:40px;box-shadow:0 4px 6px rgba(0,0,0,.05);margin-bottom:30px}.referral-page .referral-container .prizes-section .prizes-header{display:flex;align-items:center;justify-content:center;gap:15px;margin-bottom:30px}.referral-page .referral-container .prizes-section .prizes-header .prize-icon{color:#10b981}.referral-page .referral-container .prizes-section .prizes-header h3{font-size:28px;font-weight:700;color:#0f172a}.referral-page .referral-container .prizes-section .prizes-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:20px}.referral-page .referral-container .prizes-section .prizes-grid .prize-card{background:#f8fafc;border-radius:15px;padding:25px;text-align:center;transition:all .3s;border:2px solid rgba(0,0,0,0)}.referral-page .referral-container .prizes-section .prizes-grid .prize-card:hover{transform:translateY(-5px);box-shadow:0 8px 20px rgba(0,0,0,.1)}.referral-page .referral-container .prizes-section .prizes-grid .prize-card.highlight .prize-badge{background:#f59e0b}.referral-page .referral-container .prizes-section .prizes-grid .prize-card .prize-badge{display:inline-block;background:#10b981;color:#fff;padding:6px 16px;border-radius:20px;font-size:12px;font-weight:700;margin-bottom:15px}.referral-page .referral-container .prizes-section .prizes-grid .prize-card h4{font-size:20px;font-weight:700;color:#0f172a;margin-bottom:8px}.referral-page .referral-container .prizes-section .prizes-grid .prize-card p{font-size:14px;color:#64748b;margin:0}.referral-page .referral-container .how-it-works{background:#fff;border-radius:20px;padding:40px;box-shadow:0 4px 6px rgba(0,0,0,.05)}.referral-page .referral-container .how-it-works h3{font-size:28px;font-weight:700;color:#0f172a;text-align:center;margin-bottom:30px}.referral-page .referral-container .how-it-works .steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:30px}.referral-page .referral-container .how-it-works .steps .step{text-align:center}.referral-page .referral-container .how-it-works .steps .step .step-number{width:60px;height:60px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:800;margin:0 auto 15px}.referral-page .referral-container .how-it-works .steps .step p{font-size:16px;color:#64748b;margin:0}