body{margin:0;padding:0;font-family:"Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB",Arial,sans-serif!important}.header{background:linear-gradient(135deg,#0369a1 0,#0284c7 100%);color:#fff;height:48px;box-shadow:0 2px 8px rgba(0,0,0,.08)}.header-inner{max-width:1400px;margin:0 auto;height:100%;padding:0 16px;display:flex;justify-content:space-between;align-items:center}.nav-logo-container{display:flex;align-items:center;gap:12px;margin:0;font-size:20px;font-weight:700}.nav-logo{color:#fff;text-decoration:none;transition:all .3s ease;line-height:1}.nav-logo:hover{color:#e6f7ff;text-decoration:none}.nav-text-btn{color:#fff;font-size:14px;font-weight:600;cursor:pointer;transition:color .2s;white-space:nowrap}.nav-text-btn:hover{color:#fff}.user-role{display:inline-flex;align-items:center;font-size:14px;background-color:rgba(255,255,255,.2);border-radius:20px;padding:4px 8px;box-shadow:0 2px 8px rgba(0,0,0,.08)}.user-role:hover{box-shadow:0 2px 8px rgba(0,0,0,.08)}.cta-signin{display:inline-flex;align-items:center;font-size:14px;font-weight:700;background-color:rgba(255,255,255,.2);border-radius:6px!important;box-shadow:0 2px 8px rgba(0,0,0,.08)}.cta-signin:hover{box-shadow:0 2px 8px rgba(0,0,0,.08)}.status-badge{display:inline-block;width:8px;height:8px;background-color:#5bff7a;border-radius:50%;margin-right:4px;box-shadow:none}.drawer-btn{color:#fff;background:0 0;border:none;font-size:14px;padding:0;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center}.drawer-btn:hover{color:#e6f7ff}@media (max-width:768px){.header-inner{padding:0 12px}.nav-info{gap:8px!important}.nav-logo-container{flex-direction:row-reverse;justify-content:flex-end;gap:4px;font-size:20px;font-weight:700}.cta-signin{font-size:14px;padding:8px 12px!important}}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.5);display:flex;justify-content:center;align-items:center;z-index:3}.modal-container{background:linear-gradient(135deg,#fff 0,#f8f9ff 100%);border-radius:8px;width:420px;box-shadow:0 8px 24px rgba(0,0,0,.1);position:relative;overflow:hidden;animation:fadeIn .5s ease-out}@keyframes fadeIn{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.modal-header{background:linear-gradient(135deg,#6366f1 0,#8b5cf6 100%);padding:16px 16px;color:#fff;text-align:center;position:relative}.modal-title{font-size:15px;font-weight:700;margin:0}.modal-subtitle{font-size:12px;opacity:.9;margin-top:4px}.confetti{position:absolute;width:8px;height:16px;opacity:.8}.confetti-1{top:16px;left:32px;background-color:#fcd34d;transform:rotate(-30deg)}.confetti-2{top:35px;right:45px;background-color:#4ade80;transform:rotate(45deg)}.confetti-3{bottom:15px;left:60px;background-color:#f87171;transform:rotate(15deg)}.confetti-4{bottom:25px;right:40px;background-color:#60a5fa;transform:rotate(-15deg)}.modal-body{padding:16px}.invite-code-container{background-color:#f3f4f6;border-radius:8px;padding:16px;text-align:center;margin:16px 0 16px;position:relative;border:2px dashed #d1d5db}.invite-code{font-size:15px;font-weight:600;color:#4f46e5;letter-spacing:6px;margin:12px 0;cursor:pointer}.copy-btn{position:absolute;right:12px;top:12px;background-color:#6366f1;color:#fff;border:none;border-radius:4px;padding:6px 12px;font-size:12px;cursor:pointer;transition:background-color .2s}.copy-btn:hover{background-color:#4f46e5}.instruction-title{font-size:13px;font-weight:700;color:#1f2937;margin-bottom:12px}.instruction-steps{background-color:#f9fafb;border-radius:8px;padding:16px}.step{display:flex;margin-bottom:12px}.step:last-child{margin-bottom:0}.step-number{background-color:#6366f1;color:#fff;width:24px;height:24px;border-radius:20px;display:flex;justify-content:center;align-items:center;font-size:12px;font-weight:700;margin-right:12px;flex-shrink:0}.step-text{font-size:14px;color:#4b5563;line-height:1.5}.benefits{margin-top:16px;display:flex;justify-content:space-between}.benefit{text-align:center;width:48%;padding:12px;background-color:#eef2ff;border-radius:8px}.benefit-icon{color:#6366f1;font-size:14px;margin-bottom:8px}.benefit-text{font-size:14px;color:#4b5563}.benefit-value{font-weight:700;color:#6366f1}.modal-footer{text-align:center;padding:0 16px 16px}.confirm-btn{background:linear-gradient(135deg,#6366f1 0,#8b5cf6 100%);color:#fff;border:none;border-radius:8px;padding:12px 16px;font-size:13px;font-weight:700;cursor:pointer;transition:transform .2s,box-shadow .2s;width:100%}.confirm-btn:hover{transform:translateY(-2px);box-shadow:0 2px 8px rgba(0,0,0,.08)}.total-reward-amount{font-size:18px;font-weight:700}@media (max-width:767px){.modal-container{width:90%;max-width:450px;margin:0 8px}.modal-header{padding:16px 16px}.modal-body{padding:16px}.reward-badge{padding:8px 16px;bottom:-25px}.reward-text{font-size:13px}.reward-amount{font-size:18px}.invite-code{font-size:15px}.benefit-cards{flex-direction:column}.benefit{width:100%;margin-bottom:12px}.benefit:last-child{margin-bottom:0}.el-button--mini,.el-button--mini.is-round{padding:7px 8px}@media (max-width:767px){.main-content>.el-tabs{height:100%;display:flex;flex-direction:column}.main-content>.el-tabs .el-tabs__content{flex:1;overflow-y:auto}.el-message-box{display:inline-block;width:70%;padding-bottom:12px;vertical-align:middle;background-color:#fff;border-radius:4px;border:1px solid #ebeef5;font-size:18px;box-shadow:0 8px 24px 0 rgba(0,0,0,.1);text-align:left;overflow:hidden;-webkit-backface-visibility:hidden;backface-visibility:hidden}.el-message{min-width:70%;left:50%;top:50px!important}}}.el-tabs__header{z-index:0}.welcome-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:rgba(0,0,0,.5);display:flex;justify-content:center;align-items:center;z-index:10;padding:16px}.welcome-modal-container{background:linear-gradient(135deg,#fff,#f9f9f9);width:100%;max-width:450px;border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.1);overflow:hidden;position:relative;animation:welcomeModalAppear .5s ease-out}@keyframes welcomeModalAppear{0%{transform:scale(.8);opacity:0}100%{transform:scale(1);opacity:1}}.welcome-modal-header{padding:16px;text-align:center;background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;position:relative;overflow:hidden}.welcome-icon-wrapper{width:clamp(60px,18vw,80px);height:clamp(60px,18vw,80px);background-color:#fff;border-radius:8px;margin:0 auto 16px;display:flex;justify-content:center;align-items:center;box-shadow:0 8px 24px rgba(0,0,0,.1)}.welcome-icon-wrapper svg{width:60%;height:60%;fill:#6366F1}.welcome-modal-title{font-size:18px;font-weight:700;margin-bottom:8px}.welcome-modal-subtitle{font-size:13px;opacity:.9;margin-bottom:8px}.welcome-confetti{position:absolute;width:12px;height:12px;border-radius:6px;animation:welcomeConfettiFloat 5s infinite ease-in-out}.welcome-confetti-1{background-color:#fcd34d;top:20px;left:30px;animation-delay:0s}.welcome-confetti-2{background-color:#f472b6;top:50px;right:40px;animation-delay:1s}.welcome-confetti-3{background-color:#34d399;bottom:20px;left:40%;animation-delay:2s}.welcome-confetti-4{background-color:#60a5fa;bottom:40px;right:30px;animation-delay:3s}.welcome-confetti-5{background-color:#f472b6;top:40px;left:50%;animation-delay:1.5s}.welcome-confetti-6{background-color:#34d399;bottom:30px;left:80px;animation-delay:2.5s}@keyframes welcomeConfettiFloat{0%{transform:translateY(0) rotate(0);opacity:1}50%{transform:translateY(-30px) rotate(180deg);opacity:.7}100%{transform:translateY(0) rotate(360deg);opacity:1}}.welcome-modal-body{padding:16px}.welcome-message-text{text-align:center;margin-bottom:16px;color:#1f2937;font-size:13px;line-height:1.6}.welcome-features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:clamp(8px,3vw,16px);margin-bottom:clamp(12px,4vw,16px)}.welcome-feature-item{background-color:#f3f4f6;border-radius:8px;padding:clamp(12px,3vw,16px);text-align:center;transition:all .3s ease}.welcome-feature-item:hover{transform:translateY(-3px);box-shadow:0 8px 24px rgba(0,0,0,.1);background-color:#eef2ff}.welcome-feature-icon{width:clamp(32px,10vw,40px);height:clamp(32px,10vw,40px);margin:0 auto 8px;display:flex;justify-content:center;align-items:center;border-radius:8px;background-color:rgba(99,102,241,.1)}.welcome-feature-title{font-size:clamp(12px, 3.5vw, 14px);font-weight:600;color:#4b5563}.welcome-modal-footer{padding:0 clamp(12px,4vw,16px) clamp(12px,4vw,16px);display:flex;gap:clamp(8px,3vw,16px)}.welcome-tutorial-btn{flex:1;padding:clamp(12px,3vw,12px) clamp(12px,3vw,16px);background:linear-gradient(135deg,#6366f1,#8b5cf6);color:#fff;border:none;border-radius:8px;font-size:clamp(12px, 3vw, 13px);font-weight:600;cursor:pointer;transition:all .2s ease;box-shadow:0 1px 4px rgba(0,0,0,.05);white-space:nowrap}.welcome-tutorial-btn:hover{transform:translateY(-2px);box-shadow:0 2px 8px rgba(0,0,0,.08)}.welcome-tutorial-btn:active{transform:translateY(0)}.welcome-cancel-btn{flex:1;padding:clamp(12px,3vw,12px) clamp(12px,3vw,16px);background-color:transparent;color:#6b7280;border:1px solid #e5e7eb;border-radius:8px;font-size:clamp(12px, 3vw, 13px);font-weight:600;cursor:pointer;transition:all .2s ease;white-space:nowrap}.welcome-cancel-btn:hover{background-color:#f9fafb;color:#4b5563}.welcome-progress-bar{height:6px;background-color:#e5e7eb;border-radius:4px;overflow:hidden;margin-bottom:clamp(12px,4vw,16px)}.welcome-progress-fill{height:100%;width:15%;background:linear-gradient(90deg,#6366f1,#8b5cf6);border-radius:4px;transition:width .5s ease}@keyframes welcomePulse{0%{transform:scale(1)}50%{transform:scale(1.05)}100%{transform:scale(1)}}.welcome-pulse-animation{animation:welcomePulse 2s infinite}@media (max-width:480px){.welcome-modal-footer{flex-direction:column}.welcome-cancel-btn,.welcome-tutorial-btn{width:100%}}@media (max-width:360px){.welcome-features-grid{grid-template-columns:1fr}.welcome-modal-header{padding:16px 16px 8px}.welcome-modal-body{padding:16px}.welcome-icon-wrapper{width:50px;height:50px;margin-bottom:8px}.welcome-modal-title{font-size:18px}.welcome-modal-subtitle{font-size:13px}}@media (hover:none){.welcome-feature-item:hover{transform:none;box-shadow:none;background-color:#f3f4f6}.welcome-tutorial-btn:hover{transform:none;box-shadow:0 2px 8px rgba(0,0,0,.08)}}@media (max-width:280px){.welcome-modal-title{font-size:15px}.welcome-modal-subtitle{font-size:12px}.welcome-feature-title{font-size:12px}.welcome-cancel-btn,.welcome-tutorial-btn{font-size:12px;padding:12px}}.el-message{z-index:9999999!important}.nav-info{background-color:transparent!important}.avatar-menu{width:30px;height:30px;border-radius:50%;margin-right:4px;background:linear-gradient(135deg,#5fa8d3,#bcdff5);border:2px solid rgba(255,255,255,.8);box-shadow:0 1px 4px rgba(0,0,0,.05);object-fit:cover;transition:transform .3s ease}[v-cloak]{display:none!important}