/* Compressed on 2026-04-07 22:51:09 */
.toast-container{ position:fixed; top:20px; left:50%; transform:translateX(-50%); z-index:10000; display:flex; flex-direction:column; align-items:center; gap:10px; pointer-events:none} .toast{ display:flex; align-items:center; gap:10px; padding:12px 20px; background:rgba(0,0,0,0.85); color:#fff; border-radius:8px; font-size:14px; box-shadow:0 4px 12px rgba(0,0,0,0.15); opacity:0; transform:translateY(-20px); transition:all 0.3s ease; pointer-events:auto; max-width:400px} .toast-show{ opacity:1; transform:translateY(0)} .toast-hide{ opacity:0; transform:translateY(-20px)} .toast-icon{ font-size:18px; font-weight:bold} .toast-message{ flex:1; line-height:1.5} .toast-close{ cursor:pointer; font-size:18px; opacity:0.7; transition:opacity 0.2s} .toast-close:hover{ opacity:1} .toast-success{ background:rgba(82,196,26,0.95)} .toast-error{ background:rgba(255,77,79,0.95)} .toast-warning{ background:rgba(250,173,20,0.95)} .toast-info{ background:rgba(0,0,0,0.85)} .toast-loading{ background:rgba(0,0,0,0.85)} .toast-loading .toast-icon{ animation:toast-spin 1s linear infinite} @keyframes toast-spin{ from{ transform:rotate(0deg)} to{ transform:rotate(360deg)} } .modal-container{ position:fixed; top:0; left:0; right:0; bottom:0; z-index:9999; display:flex; align-items:center; justify-content:center} .modal{ position:fixed; top:0; left:0; right:0; bottom:0; opacity:0; transition:opacity 0.3s ease} .modal-show{ opacity:1} .modal-hide{ opacity:0} .modal-mask{ position:absolute; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,0.5)} .modal-content{ position:relative; background:#fff; border-radius:8px; box-shadow:0 4px 24px rgba(0,0,0,0.2); margin:0 auto; top:50%; transform:translateY(-50%) scale(0.9); transition:transform 0.3s ease; max-width:90vw; max-height:90vh; overflow:hidden; display:flex; flex-direction:column} .modal-show .modal-content{ transform:translateY(-50%) scale(1)} .modal-hide .modal-content{ transform:translateY(-50%) scale(0.9)} .modal-close{ position:absolute; top:16px; right:16px; font-size:24px; color:#999; cursor:pointer; transition:color 0.2s; z-index:1} .modal-close:hover{ color:#333} .modal-header{ padding:20px 24px 16px; border-bottom:1px solid #f0f0f0; font-size:18px; font-weight:600; color:#333} .modal-body{ padding:24px; flex:1; overflow-y:auto; font-size:14px; line-height:1.6; color:#666} .modal-footer{ padding:16px 24px 20px; border-top:1px solid #f0f0f0; display:flex; justify-content:flex-end; gap:12px} .modal-btn{ padding:8px 24px; border-radius:4px; font-size:14px; cursor:pointer; transition:all 0.2s; border:1px solid #d9d9d9; background:#fff; color:#333} .modal-btn:hover{ border-color:#40a9ff; color:#40a9ff} .modal-btn-primary{ background:#1890ff; border-color:#1890ff; color:#fff} .modal-btn-primary:hover{ background:#40a9ff; border-color:#40a9ff; color:#fff} .modal-btn:disabled{ opacity:0.5; cursor:not-allowed} .modal-confirm .modal-body{ text-align:center; padding:32px 24px} .modal-confirm .modal-icon{ font-size:48px; margin-bottom:16px} .modal-confirm-success .modal-icon{ color:#52c41a} .modal-confirm-error .modal-icon{ color:#ff4d4f} .modal-confirm-warning .modal-icon{ color:#faad14} .loading{ position:absolute; top:0; left:0; right:0; bottom:0; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,0.9); opacity:0; transition:opacity 0.3s ease; z-index:9998} .loading-fullscreen{ position:fixed} .loading-show{ opacity:1} .loading-hide{ opacity:0} .loading-indicator{ text-align:center} .loading-spinner{ width:40px; height:40px; margin:0 auto 16px; border:3px solid #f0f0f0; border-top-color:#1890ff; border-radius:50%; animation:loading-spin 0.8s linear infinite} @keyframes loading-spin{ from{ transform:rotate(0deg)} to{ transform:rotate(360deg)} } .loading-text{ font-size:14px; color:#666; margin:0} .btn-loading{ position:relative; pointer-events:none} .btn-loading::after{ content:''; position:absolute; top:50%; left:50%; width:14px; height:14px; margin:-7px 0 0 -7px; border:2px solid transparent; border-top-color:currentColor; border-radius:50%; animation:btn-loading-spin 0.6s linear infinite} @keyframes btn-loading-spin{ from{ transform:rotate(0deg)} to{ transform:rotate(360deg)} } @keyframes fadeIn{ from{ opacity:0} to{ opacity:1} } @keyframes fadeOut{ from{ opacity:1} to{ opacity:0} } @keyframes zoomIn{ from{ opacity:0; transform:scale(0.9)} to{ opacity:1; transform:scale(1)} } @keyframes zoomOut{ from{ opacity:1; transform:scale(1)} to{ opacity:0; transform:scale(0.9)} } @keyframes slideUp{ from{ opacity:0; transform:translateY(20px)} to{ opacity:1; transform:translateY(0)} } @keyframes slideDown{ from{ opacity:1; transform:translateY(0)} to{ opacity:0; transform:translateY(20px)} } @keyframes shake{ 0%,100%{ transform:translateX(0)} 10%,30%,50%,70%,90%{ transform:translateX(-5px)} 20%,40%,60%,80%{ transform:translateX(5px)} } @keyframes pulse{ 0%{ transform:scale(1); opacity:1} 50%{ transform:scale(1.05); opacity:0.7} 100%{ transform:scale(1); opacity:1} } @keyframes rotate{ from{ transform:rotate(0deg)} to{ transform:rotate(360deg)} } @media screen and (max-width:768px){ .toast-container{ top:auto; bottom:100px; left:16px; right:16px; transform:none} .toast{ max-width:100%; font-size:14px; padding:10px 16px} .modal-content{ width:calc(100% - 32px) !important; max-width:none} .modal-header{ padding:16px 20px 12px; font-size:16px} .modal-body{ padding:20px} .modal-footer{ padding:12px 20px 16px} .loading-spinner{ width:32px; height:32px} } [data-theme="dark"] .modal-content{ background:#1f1f1f; color:#fff} [data-theme="dark"] .modal-header{ border-bottom-color:#333; color:#fff} [data-theme="dark"] .modal-body{ color:#ccc} [data-theme="dark"] .modal-footer{ border-top-color:#333} [data-theme="dark"] .modal-btn{ background:#2f2f2f; border-color:#444; color:#fff} [data-theme="dark"] .loading{ background:rgba(31,31,31,0.9)} [data-theme="dark"] .loading-text{ color:#ccc} .animate-fade-in{ animation:fadeIn 0.3s ease} .animate-zoom-in{ animation:zoomIn 0.3s ease} .animate-slide-up{ animation:slideUp 0.3s ease} .animate-shake{ animation:shake 0.5s ease} .animate-pulse{ animation:pulse 2s ease infinite} .animate-rotate{ animation:rotate 1s linear infinite}