.mobile-page{width:100%;height:100%;background:linear-gradient(135deg,#1a2a6c,#b21f1f,#1a2a6c);color:var(--light-color);min-height:100vh;overflow-x:hidden}.mobile-container{display:flex;flex-direction:column;height:100vh;max-height:100vh;padding:10px;gap:5px}.mobile-header{display:flex;flex-direction:column;align-items:center;padding:5px 0 0;position:relative;z-index:10;background:#1e1e2ee6;border-radius:12px;box-shadow:0 4px 15px #0000004d}.mobile-header h1{font-size:1.5rem;margin-bottom:5px;background:linear-gradient(45deg,#4cc9f0,#4361ee);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.mobile-header p{font-size:.85rem;opacity:.8;margin-bottom:8px}.mobile-player{width:100%;border-radius:12px;padding:0 12px 8px;box-shadow:0 5px 15px #0000004d}.mobile-player-title{text-align:center;margin-bottom:10px;font-size:1.1rem;color:var(--success-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-progress-container{width:100%;background:#ffffff1a;height:6px;border-radius:3px;margin:12px 0;cursor:pointer;position:relative}.mobile-progress-bar{height:100%;background:linear-gradient(to right,var(--primary-color),var(--success-color));border-radius:3px;width:0%;transition:width .1s linear}.mobile-time-info{display:flex;justify-content:space-between;font-size:.8rem;color:#ffffffb3;margin-bottom:12px}.mobile-controls{display:flex;flex-direction:column;gap:10px;margin-top:10px}.control-row{display:flex;justify-content:space-between;gap:8px}.mobile-control-btn{flex:1;padding:8px;border:none;border-radius:8px;color:#fff;font-size:.85rem;font-weight:600;cursor:pointer;transition:var(--transition);display:flex;align-items:center;justify-content:center;gap:6px;text-align:center}.mobile-control-btn.disabled{opacity:.6;pointer-events:none}.mobile-control-btn i{font-size:1.1rem}.mobile-control-btn.play-pause{background:linear-gradient(45deg,var(--success-color),#2a9d8f)}.mobile-control-btn.prev{background:linear-gradient(45deg,var(--warning-color),#e76f51)}.mobile-control-btn.current{background:linear-gradient(45deg,#7209b7,#3a0ca3)}.mobile-control-btn.next{padding:5px;background:linear-gradient(45deg,var(--accent-color),#d00000)}.mobile-control-row-msg{writing-mode:vertical-lr;font-size:.8rem;line-height:1}.mobile-subtitle{flex:1;background:#191928e6;border-radius:12px;padding:6px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 5px 15px #0000004d}.subtitle-header{display:flex;justify-content:space-between;margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid rgba(255,255,255,.1)}.subtitle-header h3{font-size:1.1rem;color:var(--success-color)}.mobile-dialogue-container{flex:1;overflow-y:auto;scroll-behavior:smooth;padding:5px}.mobile-dialogue-item{display:flex;flex-direction:column;padding:5px 6px;border-radius:8px;transition:var(--transition);opacity:.7;min-height:60px}.mobile-dialogue-item.active{background:#4361ee33;opacity:1;transform:scale(1.02);box-shadow:0 3px 10px #0003}.mobile-dialogue-item.active .mobile-english-line{color:var(--success-color);font-weight:700;font-size:1.1rem}.mobile-english-line{flex:1;font-size:1rem;padding-bottom:5px;border-bottom:1px solid rgba(255,255,255,.1);display:flex;align-items:center}.mobile-chinese-line{flex:1;font-size:1rem;padding-top:5px;padding-bottom:5px;border-bottom:1px solid rgba(255,255,255,.1);color:#a9a9c2;display:flex;align-items:center}.mobile-resources{background:#191928e6;border-radius:12px;padding:10px 6px 10px 15px;box-shadow:0 5px 15px #0000004d;max-height:25vh;display:flex;flex-direction:column}.mobile-resources-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.mobile-resources-header h3{font-size:1.1rem;color:var(--accent-color);display:flex;align-items:center;gap:8px}.mobile-resources-header a{text-decoration:none;transition:var(--transition);padding:1px 5px;border-radius:5px;background:var(--primary-color);color:#fff;margin-left:10px}.mobile-resources-header-btn{padding:3px 10px;background:linear-gradient(45deg,#7209b7,var(--accent-color));color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:5px;transition:var(--transition)}.mobile-resources-header-btn:hover{transform:translateY(-3px);box-shadow:0 5px 15px #0000004d}.mobile-resource-list{flex:1;overflow-y:auto}.mobile-resource-item{display:flex;justify-content:space-between;align-items:center;padding:10px;background:#ffffff0d;border-radius:8px;margin-bottom:8px;transition:var(--transition)}.mobile-resource-item:hover{background:#ffffff1a}.mobile-resource-item.active{background:#4361ee4d;border-left:4px solid var(--primary-color)}.mobile-resource-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:.9rem}.mobile-upload-btn{width:98%;padding:6px;background:linear-gradient(45deg,#7209b7,var(--accent-color));color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:var(--transition)}.mobile-loading-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#191928e6;display:flex;align-items:center;justify-content:center;z-index:100;border-radius:12px;display:none}.mobile-loading-content{text-align:center;padding:20px;background:#1e1e2ef2;border-radius:12px;box-shadow:0 10px 30px #0006}.mobile-loading-content i{font-size:2.5rem;color:var(--success-color);margin-bottom:15px;animation:spin 1.5s linear infinite}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:#0000001a}::-webkit-scrollbar-thumb{background:var(--primary-color);border-radius:3px}.mobile-modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;z-index:1000;align-items:center;justify-content:center}.mobile-modal-content{background:#1e1e2e;width:90%;max-width:400px;border-radius:15px;padding:20px;box-shadow:0 10px 30px #00000080}.mobile-modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.mobile-modal-header h2{color:var(--success-color);font-size:1.3rem}.mobile-resource-actions button{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:5px 10px;border-radius:5px;cursor:pointer;transition:var(--transition);margin-left:5px}.mobile-resource-actions button:hover{background:var(--primary-color)}.mobile-status-message{position:fixed;top:20px;left:50%;transform:translate(-50%);background:#4cc9f0e6;color:#fff;padding:12px 25px;border-radius:30px;font-weight:600;box-shadow:0 5px 15px #0000004d;z-index:1000;display:none}.mobile-status-message.success{background:#2ecc71e6}.mobile-status-message.error{background:#e74c3ce6}.resource-library-modal{max-width:95%;max-height:90vh;display:flex;flex-direction:column;overflow:hidden}.resource-library-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid rgba(255,255,255,.1)}.mobile-user-info-section{background:#ffffff0d;border-radius:8px;padding:10px 15px;display:flex;flex-wrap:wrap;gap:15px;align-items:center}.user-details{flex:1;display:flex;flex-direction:column;min-width:200px}.user-details.mobile-user-details{gap:0}.user-detail{display:flex;margin-bottom:5px;font-size:.9rem}.user-detail-label{width:120px;color:#a9a9c2}.user-detail-value{flex:1;font-weight:500;color:var(--success-color)}.mobile-redeem-section{display:flex;gap:15px;align-items:center}.redeem-input{padding:8px 12px;border-radius:6px;border:1px solid rgba(255,255,255,.2);background:#1e1e2eb3;color:#fff;min-width:150px}.mobile-redeem-btn{padding:5px 9px;background:var(--primary-color);color:#fff;border:none;border-radius:6px;cursor:pointer;transition:var(--transition)}.mobile-load-resource-btn{padding:5px 8px;background:linear-gradient(45deg,var(--success-color),#2a9d8f);color:#fff;border:none;border-radius:6px;font-size:.9rem;cursor:pointer;transition:var(--transition);margin-top:auto}.purchase-btn{padding:5px 8px;background:linear-gradient(45deg,var(--accent-color),#d00000);color:#fff;border:none;border-radius:6px;font-size:.9rem;cursor:pointer;transition:var(--transition);text-decoration:none}.mobile-resource-grid{display:grid;grid-template-columns:1fr;gap:12px;max-height:60vh;overflow-y:auto;padding:5px}.mobile-resource-card{background:#ffffff0d;border-radius:8px;padding:12px;display:flex;justify-content:space-between;align-items:center;transition:var(--transition);position:relative}.mobile-resource-title_h3{color:var(--warning-color);padding:5px}.mobile-resource-card:hover{background:#ffffff1a;transform:translateY(-3px)}.mobile-resource-title{font-size:.9rem;margin-bottom:10px;min-height:40px;display:flex;align-items:center;line-height:1.4}.load-btn{padding:5px 10px;background:var(--primary-color);color:#fff;border:none;border-radius:5px;font-size:.8rem;cursor:pointer;transition:var(--transition)}.load-btn:hover{background:#3650d1}.auth-modal{max-width:350px}.auth-tabs{display:flex;margin-bottom:20px;border-bottom:1px solid rgba(255,255,255,.1)}.auth-tab{flex:1;padding:10px;text-align:center;cursor:pointer;transition:var(--transition);border-bottom:2px solid transparent}.auth-tab.active{border-bottom:2px solid var(--success-color);color:var(--success-color);font-weight:600}.form-group{display:flex;flex-direction:column;gap:5px}.form-label{font-size:.9rem;color:#a9a9c2}.form-input{padding:10px;border-radius:6px;border:1px solid rgba(255,255,255,.2);background:#1e1e2eb3;color:#fff}.captcha-row{display:flex;gap:10px}.captcha-row.mobile-captcha-row{flex-direction:column}.captcha-row .form-group{flex:1}.captcha-img{height:40px;border-radius:4px;background:#555;display:flex;align-items:center;justify-content:center;font-size:.8rem;color:#ddd}.submit-auth{padding:12px;background:var(--primary-color);color:#fff;border:none;border-radius:8px;font-weight:600;cursor:pointer;margin-top:10px;transition:var(--transition)}.submit-auth:hover{background:#3650d1}.purchase-modal{max-width:300px;text-align:center}.qr-code{width:200px;height:200px;margin:0 auto 15px;background:#fff;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#333;font-size:.9rem;padding:10px}.redeem-info{background:#ffffff0d;border-radius:8px;padding:15px;margin-top:15px;font-size:.9rem;line-height:1.6}.close-btn{background:none;border:none;color:#fff;font-size:1.5rem;cursor:pointer;opacity:.7;transition:var(--transition)}.close-btn:hover{opacity:1}.mobile-qr-code-container{width:125px;height:125px;background:#fff;display:flex;align-items:center;justify-content:center;border-radius:8px;padding:5px;overflow:hidden}.mobile-qr-code-container img{width:100%;height:100%;object-fit:cover;transform:scale(1.3) translateY(-7%);transform-origin:center center;display:block}.mobile-download-section{display:flex;justify-content:space-between;margin-bottom:6px}.mobile-download-section-box{display:flex;gap:10px}.mobile-download-section h3{color:var(--primary-color)}.mobile-download-section-btn{background:linear-gradient(45deg,#7209b7,var(--primary-color))}.mobile-mode-selector{position:relative;display:inline-block}.mobile-mode-selector-btn{writing-mode:vertical-lr;text-orientation:mixed;padding:3px 0;background:#ffffff26;border:2px solid rgba(255,255,255,.2);border-radius:8px;color:#fff;font-size:.8rem;font-weight:500;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:2px;transition:var(--transition);min-height:65.5px}.mobile-mode-selector-btn:hover{background:#ffffff40}.mobile-mode-selector-btn i{font-size:.9rem;transform:rotate(0);margin-left:1px;transition:transform .3s ease}.mobile-mode-selector-btn.active i{transform:rotate(180deg)}.mobile-mode-selector-options{position:absolute;bottom:100%;left:0;right:0;background:#000000d9;border-radius:8px;overflow:hidden;z-index:100;box-shadow:0 5px 15px #0000004d;margin-bottom:5px;width:100px}.mobile-mode-selector-options-text{background:#ffffff40}.mobile-mode-option{padding:5px;text-align:center;font-size:.85rem;cursor:pointer;transition:var(--transition)}.mobile-mode-option:hover{background:#ffffff1a}.mobile-mode-option.active{background:linear-gradient(45deg,#7209b7,#3a0ca3);font-weight:600}*{margin:0;padding:0;box-sizing:border-box;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}:root{--primary-color: #4361ee;--secondary-color: #3a0ca3;--accent-color: #f72585;--light-color: #f8f9fa;--dark-color: #212529;--success-color: #4cc9f0;--warning-color: #f8961e;--danger-color: #e63946;--transition: all .3s ease}.page{width:100%;height:100%;background:linear-gradient(135deg,#1a2a6c,#b21f1f,#1a2a6c);color:var(--light-color);min-height:100vh;overflow-x:hidden;padding:20px}.container{max-width:1400px;margin:0 auto;display:flex;flex-direction:column;height:calc(100vh - 40px);gap:20px}header{text-align:center;padding:15px 0;border-bottom:2px solid rgba(255,255,255,.1)}header h1{font-size:2.2rem;margin-bottom:5px;text-shadow:0 2px 5px rgba(0,0,0,.3);background:linear-gradient(45deg,#4cc9f0,#4361ee);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}header p{font-size:1rem;opacity:.8}.main-content{display:flex;flex:1;gap:20px}.play-section{flex:1;display:flex;flex-direction:column;background:#1e1e2ecc;border-radius:15px;overflow:hidden;box-shadow:0 10px 30px #0006;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.player-area{position:relative;height:40%;background:#1e1e2e;display:flex;justify-content:center;align-items:center;padding:15px;border-bottom:1px solid rgba(255,255,255,.1)}.audio-player{width:100%;max-width:600px;padding:20px;background:#191928e6;border-radius:15px;box-shadow:0 5px 20px #0000004d}.player-title{text-align:center;margin-bottom:15px;font-size:1.4rem;color:var(--success-color)}.player-controls{display:flex;justify-content:center;align-items:center;gap:15px;margin-bottom:15px}.player-btn{width:50px;height:50px;border-radius:50%;background:var(--primary-color);color:#fff;display:flex;align-items:center;justify-content:center;border:none;cursor:pointer;transition:var(--transition);font-size:1.2rem}.player-btn:hover{transform:scale(1.1);background:var(--secondary-color)}.play-btn{width:60px;height:60px;background:var(--success-color)}.progress-container{width:100%;background:#ffffff1a;height:8px;border-radius:4px;margin:15px 0;cursor:pointer;position:relative}.progress-bar{height:100%;background:linear-gradient(to right,var(--primary-color),var(--success-color));border-radius:4px;width:0%;transition:width .1s linear}.time-info{display:flex;justify-content:space-between;font-size:.9rem;color:#ffffffb3}.dialogue-area{height:60%;overflow:hidden;position:relative;background:#191928e6}.dialogue-container{height:100%;overflow-y:hidden;scroll-behavior:smooth;padding:10px 20px;display:flex;flex-direction:column;justify-content:center}.dialogue-scroll{max-height:420px;overflow-y:auto;scroll-behavior:smooth}.dialogue-item{display:flex;padding:12px 15px;margin:8px 0;border-radius:8px;transition:var(--transition);opacity:.6;min-height:50px}.dialogue-item.active{background:#4361ee33;opacity:1;transform:scale(1.03);box-shadow:0 5px 15px #0003}.dialogue-item.active .english-line{color:var(--success-color);font-weight:700;font-size:1.2rem}.english-line{flex:1;font-size:1.1rem;padding-right:20px;border-right:1px solid rgba(255,255,255,.1);display:flex;align-items:center}.chinese-line{flex:1;font-size:1.1rem;padding-left:20px;color:#a9a9c2;display:flex;align-items:center}.control-area{width:300px;background:#1e1e2ecc;border-radius:15px;padding:20px;display:flex;flex-direction:column;box-shadow:0 10px 30px #0006;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.control-area h2{text-align:center;margin-bottom:20px;font-size:1.5rem;color:var(--success-color);padding-bottom:10px;border-bottom:1px solid rgba(255,255,255,.1)}.control-group{margin-bottom:30px}.control-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:15px;gap:10px}.control-group h3{font-size:1.2rem;margin-bottom:15px;color:var(--warning-color);text-shadow:0 2px 4px rgba(0,0,0,.2)}.control-header h3{margin-bottom:0;line-height:45px}.mode-selector{display:flex;background:#ffffff1a;border-radius:50px;padding:4px;box-shadow:0 4px 10px #0003}.mode-btn{padding:8px;border:none;border-radius:50px;background:transparent;color:#fffc;font-size:.9rem;font-weight:500;cursor:pointer;transition:var(--transition);white-space:nowrap}.mode-btn:hover{background:#ffffff1a;color:#fff}.mode-btn.active{background:var(--warning-color);color:#fff;box-shadow:0 4px 10px #f8961e66}.btn-group{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}.control-btn{flex:1;min-width:120px;padding:12px 15px;border:none;border-radius:8px;background:linear-gradient(45deg,var(--primary-color),var(--secondary-color));color:#fff;font-size:1rem;font-weight:600;cursor:pointer;transition:var(--transition);display:flex;align-items:center;justify-content:center;gap:8px}.control-btn:hover{transform:translateY(-3px);box-shadow:0 5px 15px #0000004d}.control-btn:active{transform:translateY(1px)}.control-btn.play-pause{background:linear-gradient(45deg,var(--success-color),#2a9d8f)}.control-btn.prev{background:linear-gradient(45deg,var(--warning-color),#e76f51)}.control-btn.current{background:linear-gradient(45deg,#7209b7,#3a0ca3)}.control-btn.next{background:linear-gradient(45deg,var(--accent-color),#d00000)}.resources-area{margin-top:auto;background:#191928e6;padding:20px;border-radius:10px}.resources-header{display:flex;justify-content:space-between;margin-bottom:15px}.resources-header h3{font-size:1.2rem;color:var(--accent-color)}.resources-header-btn{padding:3px 10px;background:linear-gradient(45deg,#7209b7,var(--accent-color));color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:5px;transition:var(--transition)}.resources-header-btn:hover{transform:translateY(-3px);box-shadow:0 5px 15px #0000004d}.resource-list{max-height:200px;overflow-y:auto;margin-bottom:15px}.resource-item{display:flex;justify-content:space-between;align-items:center;padding:10px;background:#ffffff0d;border-radius:8px;margin-bottom:10px;transition:var(--transition)}.resource-item:hover{background:#ffffff1a}.resource-item.active{background:#4361ee4d;border-left:4px solid var(--primary-color)}.resource-name-current{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.resource-actions button{background:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fff;padding:5px 10px;border-radius:5px;cursor:pointer;transition:var(--transition);margin-left:5px}.resource-actions button:hover{background:var(--primary-color)}.upload-btn{width:100%;padding:12px;background:linear-gradient(45deg,#7209b7,var(--accent-color));color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:var(--transition)}.upload-btn:hover{transform:translateY(-3px);box-shadow:0 5px 15px #0000004d}.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;z-index:1000;align-items:center;justify-content:center}.modal-content{background:#1e1e2e;width:90%;max-width:500px;border-radius:15px;padding:25px;box-shadow:0 10px 30px #00000080}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.modal-header h2{color:var(--success-color)}.close-btn{background:transparent;border:none;color:var(--light-color);font-size:1.5rem;cursor:pointer}.upload-form{display:flex;flex-direction:column;gap:15px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-weight:600}.form-group input{padding:12px;border-radius:8px;border:1px solid rgba(255,255,255,.1);background:#191928e6;color:#fff}.submit-btn{padding:12px;background:linear-gradient(45deg,var(--primary-color),var(--secondary-color));color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:var(--transition);margin-top:10px}.submit-btn:hover{transform:translateY(-3px);box-shadow:0 5px 15px #0000004d}@media (max-width: 768px){.main-content{flex-direction:column}.control-area{width:100%;margin-top:20px}.player-area{height:35%}.dialogue-area{height:45%}.btn-group{flex-direction:row}.control-btn{min-width:45%}}@media (min-width: 769px) and (max-width: 1024px){.main-content,.play-section{flex-direction:row}.player-area{height:100%;width:40%;border-right:1px solid rgba(255,255,255,.1);border-bottom:none}.dialogue-area{height:100%;width:60%}}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.pulse{animation:pulse 2s infinite}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#0003}::-webkit-scrollbar-thumb{background:var(--primary-color);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--secondary-color)}.loading-indicator{display:none;text-align:center;padding:15px}.loading-indicator i{font-size:2rem;margin-bottom:10px;color:var(--success-color);animation:spin 1.5s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.completion-indicator{text-align:center;padding:15px}.completion-indicator i{font-size:2rem;margin-bottom:10px;color:var(--success-color);animation:scaleIn .5s ease-out}.completion-indicator p{margin:0;color:var(--text-color)}@keyframes scaleIn{0%{transform:scale(.8);opacity:0}to{transform:scale(1);opacity:1}}.loading-overlay{position:absolute;top:0;left:0;width:100%;height:100%;background:#191928e6;display:flex;align-items:center;justify-content:center;z-index:100;border-radius:12px}.loading-content{text-align:center;padding:30px;background:#1e1e2ef2;border-radius:12px;box-shadow:0 10px 30px #0006}.loading-content i{font-size:3rem;color:var(--success-color);margin-bottom:20px}.loading-content p{font-size:1.2rem}.status-message{position:fixed;top:20px;left:50%;transform:translate(-50%);background:#4cc9f0e6;color:#fff;padding:12px 25px;border-radius:30px;font-weight:600;box-shadow:0 5px 15px #0000004d;z-index:1000;display:none}.status-message.success{background:#2ecc71e6}.status-message.error{background:#e74c3ce6}.control-btn.disabled{opacity:.6;pointer-events:none}.time-controls{margin-top:4px;font-size:12px;color:#666}.time-input{width:60px;margin:0 5px}#resourceLibraryModal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;z-index:1000;align-items:center;justify-content:center}.resource-library-modal-content{background:#1e1e2e;width:90%;max-width:800px;border-radius:15px;padding:25px;box-shadow:0 10px 30px #00000080;display:flex;flex-direction:column;max-height:90vh}.resource-library-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.resource-library-header h2{color:var(--success-color)}.user-info-section{display:flex;justify-content:space-between;margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid rgba(255,255,255,.1)}.user-details{display:flex;gap:15px}.user-detail{font-size:.9rem}.redeem-section{display:flex;align-items:center;gap:10px}.redeem-input{padding:8px 12px;border-radius:6px;border:1px solid rgba(255,255,255,.1);background:#191928e6;color:#fff;width:150px}.redeem-btn,.buy-btn,.buy-btn-login{padding:8px 15px;background:linear-gradient(45deg,var(--primary-color),var(--secondary-color));color:#fff;border:none;border-radius:6px;font-size:.9rem;cursor:pointer;transition:var(--transition);text-decoration:none}.buy-btn{background:linear-gradient(45deg,var(--accent-color),#d00000)}.buy-btn-login{padding:7.5px 15px;background:linear-gradient(45deg,var(--success-color),#2a9d8f);margin-right:10px}.redeem-btn:hover,.buy-btn:hover,.buy-btn-login:hover{transform:translateY(-2px);box-shadow:0 3px 10px #0003}.resource-library-body{display:flex;flex-direction:column;flex:1;overflow:hidden}.resource-library-title{font-size:1.2rem;margin-bottom:15px;color:var(--warning-color)}.resource-grid{display:flex;flex-wrap:wrap;gap:15px;overflow-y:auto;max-height:300px;padding:5px}.resource-card{background:#ffffff0d;border-radius:8px;padding:15px;min-width:180px;flex:1;min-width:calc(25% - 15px);max-width:calc(25% - 15px);display:flex;flex-direction:column;transition:var(--transition)}.resource-card:hover{background:#ffffff1a;transform:translateY(-3px);box-shadow:0 5px 15px #0003}.resource-name{font-weight:600;margin-bottom:15px;min-height:40px;display:flex;align-items:center}.load-resource-btn{padding:8px 15px;background:linear-gradient(45deg,var(--success-color),#2a9d8f);color:#fff;border:none;border-radius:6px;font-size:.9rem;cursor:pointer;transition:var(--transition);margin-top:auto}.load-resource-btn:hover{transform:translateY(-2px);box-shadow:0 3px 10px #0003}#authModal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;z-index:1001;align-items:center;justify-content:center}.auth-modal-content{background:#1e1e2e;width:90%;max-width:450px;border-radius:15px;padding:25px;box-shadow:0 10px 30px #00000080}.auth-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.auth-header h2{color:var(--success-color)}.auth-options{display:flex;gap:20px;margin-bottom:20px}.auth-option{display:flex;align-items:center;gap:8px;cursor:pointer}.auth-option input{cursor:pointer}.auth-form{display:flex;flex-direction:column;gap:15px}.form-row{display:flex;flex-direction:column;gap:8px}.form-row label{font-size:.9rem}.form-row input{padding:10px 12px;border-radius:6px;border:1px solid rgba(255,255,255,.1);background:#191928e6;color:#fff}.confirm-btn{padding:12px;background:linear-gradient(45deg,var(--primary-color),var(--secondary-color));color:#fff;border:none;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:var(--transition);margin-top:10px}.confirm-btn-send{padding:6px;margin-top:0}.confirm-btn:hover{transform:translateY(-3px);box-shadow:0 5px 15px #0000004d}#purchaseModal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background:#000000b3;z-index:1002;align-items:center;justify-content:center}.purchase-modal-content{background:#1e1e2e;width:90%;max-width:400px;border-radius:15px;padding:25px;box-shadow:0 10px 30px #00000080;text-align:center}.purchase-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.purchase-header h2{color:var(--success-color)}.qr-code{width:200px;height:200px;background:#fff;margin:0 auto 20px;display:flex;align-items:center;justify-content:center;border-radius:8px}.qr-code i{font-size:5rem;color:#333}.redeem-info{font-size:.9rem;color:#ffffffb3;margin-bottom:20px}.captcha-img{cursor:pointer;margin-left:10px}.captcha-container{display:flex;gap:10px;align-items:center}#captcha{width:150px;padding:8px 12px}#captcha-img-container{position:relative;cursor:pointer;border:1px solid #ddd;border-radius:4px;height:40px;width:120px;overflow:hidden}#captcha-image{width:100%;height:100%;object-fit:cover}#captcha-refresh-icon{position:absolute;top:0;right:0;background:#0000004d;color:#fff;font-size:18px;width:24px;height:100%;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .3s}#captcha-img-container:hover #captcha-refresh-icon{opacity:1}.error-message{color:#dc3545;background-color:#f8d7da;padding:0 5px;border-radius:4px}.success-message{color:#28a745;background-color:#d4edda;padding:0 5px;border-radius:4px}.beta-notice{background:linear-gradient(135deg,#f5f7fa,#e4e8f0);border-left:4px solid #3a86ff;padding:1.2rem;border-radius:8px;box-shadow:0 2px 8px #00000014}.beta-notice h4{margin:0 0 12px;color:#2d3748;font-size:1.1rem;display:flex;align-items:center;gap:8px}.beta-notice h4 span{font-size:1.3rem}.beta-notice p{margin:0;color:#4a5568;line-height:1.5;font-size:.95rem}.beta-notice-box{margin-top:12px;display:inline-flex;align-items:center;gap:6px;background:#3a86ff1a;padding:8px 12px;border-radius:6px}.beta-notice-box-span1{color:#3a86ff}.beta-notice-box-span2{color:#2d3748;font-weight:500}.qr-code-container{width:200px;height:200px;background:#fff;display:flex;align-items:center;justify-content:center;border-radius:8px;padding:10px;overflow:hidden}.qr-code-container img{width:100%;height:100%;object-fit:cover;transform:scale(1.3) translateY(-7%);transform-origin:center center;display:block}.welcome-modal-overlay{position:fixed;inset:0;background-color:#0009;display:flex;justify-content:center;align-items:center;z-index:1100;transition:all .3s ease}.welcome-modal{background:#fff;border-radius:20px;width:90%;max-width:450px;padding:30px;box-shadow:0 10px 30px #00000026;position:relative;transform:translateY(30px);transition:transform .4s ease;text-align:center;z-index:1111}.welcome-modal-overlay.active .welcome-modal{transform:translateY(0)}.welcome-modal-header{margin-bottom:20px}.welcome-modal-icon{color:var(--accent-color);font-size:2.5rem;margin-bottom:15px}.welcome-modal-title{font-size:1.5rem;color:var(--accent-color);font-weight:600;margin-bottom:10px}.welcome-modal-content{margin-bottom:25px;font-size:1.1rem;color:#333;line-height:1.6}.highlight{color:var(--accent-color);font-weight:600}.welcome-modal-button{background:linear-gradient(45deg,#7209b7,var(--accent-color));color:#fff;border:none;padding:14px 28px;font-size:1.1rem;border-radius:30px;cursor:pointer;width:100%;transition:all .3s ease;box-shadow:0 4px 12px #ff27414d}.welcome-modal-button:hover{transform:translateY(-2px);box-shadow:0 6px 16px #ff274166}@media (max-width: 768px){.welcome-modal{padding:25px 20px;width:85%}.welcome-modal-title{font-size:1.3rem}.welcome-modal-content{font-size:1rem}.btn,.welcome-modal-button{padding:12px 24px;font-size:1rem}}@media (max-width: 480px){.welcome-modal{border-radius:15px;width:90%}.welcome-modal-icon{font-size:2rem}.welcome-modal-title{font-size:1.2rem}}.resource-hint{display:flex;align-items:center;justify-content:center;background:#f0f7ff;padding:12px;border-radius:10px;margin:15px 0;font-weight:500}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}.shake{animation:shake .5s}.download-section{display:flex;justify-content:space-between;margin-bottom:15px}.download-section h3{color:var(--primary-color)}.download-section-btn{background:linear-gradient(45deg,#7209b7,var(--primary-color))}.table-container{width:1200px;border:1px solid #e0e0e0;border-radius:8px;overflow:hidden;margin-bottom:20px}table{width:100%;border-collapse:collapse}th{background-color:#f0f4ff;padding:15px;text-align:left;font-weight:600;color:#4a6bdf}td{padding:15px;border-top:1px solid #eaeaea;vertical-align:top}tr:nth-child(2n){background-color:#f9fafc}tr:hover{background-color:#f0f4ff}.en-column{width:50%;border-right:1px solid #eaeaea}.zh-column{width:50%}