:root{--color-primary:#f0b90b;--color-primary-light:gold;--color-primary-dark:#d4a00a;--color-bg-dark:#0b0e11;--color-bg-medium:#1e2329;--color-bg-light:#2b3139;--color-bg-card:#1e2329cc;--color-text-primary:#fff;--color-text-secondary:#b7bdc6;--color-text-muted:#848e9c;--color-text-on-primary:#0b0e11;--color-success:#0ecb81;--color-error:#f6465d;--color-warning:gold;--color-info:#0083ff;--color-border:#f0b90b33;--color-border-hover:#f0b90b66;--color-primary-alpha-5:#f0b90b0d;--color-primary-alpha-10:#f0b90b1a;--color-primary-alpha-20:#f0b90b33;--color-primary-alpha-30:#f0b90b4d;--color-primary-alpha-40:#f0b90b66;--spacing-xs:4px;--spacing-sm:8px;--spacing-md:12px;--spacing-lg:16px;--spacing-xl:24px;--spacing-2xl:32px;--spacing-3xl:48px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-2xl:20px;--radius-round:50%;--font-xs:12px;--font-sm:14px;--font-base:16px;--font-lg:18px;--font-xl:24px;--font-2xl:32px;--font-3xl:48px;--font-normal:400;--font-medium:500;--font-semibold:600;--font-bold:700;--shadow-sm:0 2px 4px #0000001a;--shadow-md:0 4px 6px #0000001a;--shadow-lg:0 10px 15px #0000001a;--shadow-xl:0 20px 25px #0000001a;--shadow-glow:0 0 20px var(--color-primary-alpha-40);--shadow-glow-lg:0 0 30px var(--color-primary-alpha-30);--transition-fast:0.15s ease;--transition-base:0.3s ease;--transition-slow:0.5s ease;--z-base:1;--z-dropdown:100;--z-overlay:1000;--z-modal:10000;--z-toast:100000}[data-theme=light]{--color-bg-dark:#fff;--color-bg-medium:#fafafa;--color-bg-light:#f5f5f5;--color-bg-card:#ffffffe6;--color-text-primary:#1e2329;--color-text-secondary:#474d57;--color-text-muted:#707a8a;--color-border:#f0b90b4d;--color-border-hover:#f0b90b80}[data-theme=okx]{--color-primary:#000;--color-primary-light:#333;--color-primary-dark:#000;--color-success:#00d26b}[data-theme=blue]{--color-primary:#0083ff;--color-primary-light:#3fa3ff;--color-primary-dark:#06c}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.App{background:linear-gradient(135deg,var(--color-bg-dark) 0,var(--color-bg-medium) 100%);min-height:100vh;overflow:hidden;position:relative;text-align:center}.App:before{background-image:radial-gradient(circle at 20% 80%,var(--color-primary-alpha-5) 0,#0000 50%),radial-gradient(circle at 80% 20%,var(--color-primary-alpha-10) 0,#0000 50%),radial-gradient(circle at 40% 40%,var(--color-primary-alpha-5) 0,#0000 50%);bottom:0;content:"";left:0;pointer-events:none;position:absolute;right:0;top:0}.App-header{align-items:center;color:var(--color-text-primary);display:flex;flex-direction:column;font-size:calc(10px + 2vmin);justify-content:center;min-height:100vh;padding:20px;position:relative;z-index:1}.header-controls{position:absolute;right:20px;top:20px}h1{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-light) 100%);-webkit-background-clip:text;background-clip:text;font-size:2.5rem;margin-bottom:2rem;text-shadow:0 0 30px var(--color-primary-alpha-30)}.connect-btn{background-color:var(--color-primary);border:none;border-radius:var(--radius-md);color:var(--color-text-on-primary);cursor:pointer;font-size:var(--font-sm);font-weight:var(--font-bold);padding:var(--spacing-sm) var(--spacing-md);transition:background-color var(--transition-base)}.connect-btn:hover{background-color:var(--color-primary-light);box-shadow:var(--shadow-glow)}.connect-wallet{align-items:center;background:var(--color-primary-alpha-5);border:1px solid var(--color-border);border-radius:var(--radius-md);display:flex;gap:.5rem;padding:calc(var(--spacing-sm)*.75) calc(var(--spacing-md)*.8)}.address{background-color:var(--color-primary-alpha-10);border:1px solid var(--color-primary-alpha-30);border-radius:var(--radius-sm);font-family:monospace}.address,.disconnect-btn{color:var(--color-primary);font-size:var(--font-xs);padding:var(--spacing-xs) var(--spacing-sm)}.disconnect-btn{background-color:initial;border:1px solid var(--color-primary);border-radius:var(--radius-sm);cursor:pointer;transition:all var(--transition-base)}.disconnect-btn:hover{background-color:var(--color-primary);color:var(--color-text-on-primary)}.connected-content{background-color:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius-md);margin-top:2rem;padding:var(--spacing-xl)}.process-status{animation:fadeInScale .5s ease;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#1e2329cc;border:1px solid var(--color-border);border-radius:12px;box-shadow:0 8px 32px #0000004d;margin-top:30px;min-width:400px;padding:20px}.process-header{align-items:center;display:flex;justify-content:space-between;margin-bottom:20px}.process-title{color:#fff;font-size:18px;font-weight:600;margin:0}.process-address{color:#fff9;font-family:monospace;font-size:12px}.process-stages{display:flex;flex-direction:column;gap:16px}.stage-item{align-items:center;display:flex;gap:12px;opacity:.3;position:relative;transition:all .3s ease}.stage-item.active{opacity:1}.stage-item.completed{opacity:.8}.stage-item.error{opacity:1}.stage-icon{align-items:center;background:#ffffff1a;border:2px solid #fff3;border-radius:50%;display:flex;font-size:20px;height:40px;justify-content:center;position:relative;transition:all .3s ease;width:40px}.stage-item.active .stage-icon{animation:pulse 2s infinite;background:var(--color-primary-alpha-20);border-color:var(--color-primary)}.stage-item.completed .stage-icon{background:var(--color-primary-alpha-30);border-color:var(--color-primary)}.stage-item.error .stage-icon{background:#ff6b6b33;border-color:#ff6b6b}.stage-content{flex:1 1}.stage-title{color:#fff;font-size:16px;font-weight:500;margin:0 0 4px}.stage-description{color:#fff9;font-size:13px;margin:0}.stage-item.active .stage-description{color:var(--color-primary)}.stage-item.error .stage-description{color:#ff6b6b}.stage-item:not(:last-child) .stage-icon:after{background:#ffffff1a;content:"";height:32px;left:50%;position:absolute;top:100%;transform:translateX(-50%);width:2px}.stage-item.completed:not(:last-child) .stage-icon:after{background:var(--color-primary)}.spinner{animation:spin 1s ease-in-out infinite;border:2px solid #ffffff4d;border-radius:50%;border-top:2px solid var(--color-primary);display:inline-block;height:16px;width:16px}@keyframes spin{to{transform:rotate(1turn)}}.transaction-details{background:var(--color-primary-alpha-10);border:1px solid var(--color-border);border-radius:8px;font-family:monospace;font-size:12px;margin-top:16px;padding:12px}.transaction-hash{color:#fffc;word-break:break-all}.transaction-link{color:var(--color-primary);margin-left:8px;text-decoration:none}.transaction-link:hover{text-decoration:underline}.stage-item.cancelled .stage-icon{background:#ff980033;border-color:#ff9800}.stage-item.cancelled .stage-description{color:#ff9800}.success-animation{animation:successPulse .5s ease}@keyframes successPulse{0%{transform:scale(1)}50%{transform:scale(1.2)}to{transform:scale(1)}}@media (max-width:600px){.process-status{min-width:auto;padding:16px}.stage-icon{font-size:18px;height:36px;width:36px}.stage-title{font-size:14px}.stage-description{font-size:12px}}.success-overlay{align-items:center;animation:fadeIn .3s ease;background:#000c;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:1000}.success-modal{animation:slideUp .5s ease;background:linear-gradient(135deg,#1e2329,#0b0e11);border:1px solid var(--color-primary-alpha-30);border-radius:20px;box-shadow:0 20px 60px #000c;max-width:400px;overflow:visible;padding:40px;position:relative;text-align:center;width:90%}.success-modal:before{animation:rotate 20s linear infinite;background:radial-gradient(circle,var(--color-primary-alpha-10) 0,#0000 70%);content:"";height:200%;left:-50%;position:absolute;top:-50%;width:200%}.success-icon{animation:bounceIn .6s ease;display:inline-block;font-size:80px;margin-bottom:20px}.success-title{color:var(--color-primary);font-size:28px;font-weight:600;margin:0 0 10px;position:relative;text-shadow:0 0 20px var(--color-primary-alpha-40);z-index:1}.success-message{color:#fffc;font-size:16px;margin:0 0 30px;position:relative;z-index:1}.success-details{background:var(--color-primary-alpha-5);border:1px solid var(--color-border);border-radius:12px;margin-bottom:30px;padding:20px;position:relative;z-index:1}.success-stat{display:flex;font-size:14px;justify-content:space-between;margin-bottom:12px}.success-stat:last-child{margin-bottom:0}.stat-label{color:#fff9}.stat-value{color:#fff;font-weight:500}.success-close{background:var(--color-primary);border:none;border-radius:8px;color:var(--color-text-on-primary);cursor:pointer;font-size:16px;font-weight:600;padding:12px 30px;position:relative;transition:all .3s ease;z-index:1}.success-close:hover{background:var(--color-primary-light);box-shadow:0 5px 15px var(--color-primary-alpha-40);transform:translateY(-2px)}.success-decoration{align-items:center;animation:fadeIn .5s ease .3s forwards;display:flex;gap:20px;height:100px;justify-content:center;left:50%;opacity:0;pointer-events:none;position:absolute;top:20px;transform:translateX(-50%);width:100%}.decoration-item{animation:float 3s ease-in-out infinite;font-size:28px;margin:0 10px}.decoration-item:nth-child(2){animation-delay:.5s;font-size:32px}.decoration-item:nth-child(3){animation-delay:1s}@keyframes bounceIn{0%{transform:scale(0)}50%{transform:scale(1.2)}to{transform:scale(1)}}@keyframes rotate{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}@keyframes confetti-fall{0%{opacity:1;transform:translateY(0) rotate(0deg)}10%{transform:translateY(10vh) rotate(90deg)}20%{transform:translateY(20vh) rotate(180deg)}80%{opacity:1}to{opacity:0;transform:translateY(110vh) rotate(2turn)}}.sparkles-container{bottom:0;left:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0}.sparkle{animation:sparkle 3s ease-in-out infinite;font-size:24px;opacity:0;position:absolute}@keyframes sparkle{0%,to{opacity:0;transform:scale(0) rotate(0deg)}50%{opacity:1;transform:scale(1) rotate(180deg)}}.welcome-screen{align-items:center;animation:fadeInScale .5s ease;display:flex;flex-direction:column;justify-content:center;margin:0 auto;max-width:500px;padding:40px;text-align:center}@keyframes fadeInScale{0%{opacity:0;transform:scale(.9) translateY(20px)}to{opacity:1;transform:scale(1) translateY(0)}}.welcome-icon{animation:float 3s ease-in-out infinite;height:100px;margin-bottom:30px;object-fit:contain;width:250px}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.welcome-title{-webkit-text-fill-color:#0000;background:linear-gradient(135deg,var(--color-primary) 0,var(--color-primary-light) 100%);-webkit-background-clip:text;background-clip:text;font-size:2.5rem;font-weight:700;margin-bottom:20px}.welcome-subtitle{color:#fffc;font-size:1.2rem;line-height:1.6;margin-bottom:40px}.welcome-features{display:flex;gap:30px;margin-top:20px}.feature{align-items:center;background:#1e232999;border:1px solid var(--color-border);border-radius:12px;cursor:pointer;display:flex;flex-direction:column;gap:10px;min-width:250px;padding:20px;transition:all .3s ease}.feature:hover{background:#1e2329cc;border-color:var(--color-primary-alpha-40);box-shadow:0 8px 20px var(--color-primary-alpha-10);transform:translateY(-5px)}.feature-icon{display:block;font-size:36px}.feature span:last-child{color:#ffffffe6;font-size:14px;font-weight:500}.email-section{margin:30px 0;max-width:400px;width:100%}.email-input{background:#1e232999;border:2px solid var(--color-primary-alpha-30);border-radius:12px;color:#fff;font-family:inherit;font-size:16px;outline:none;padding:16px 20px;transition:all .3s ease;width:100%}.email-input::placeholder{color:#ffffff80}.email-input:focus{background:#1e2329cc;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-alpha-10)}.email-input:valid{border-color:var(--color-primary-alpha-40)}@media (max-width:600px){.welcome-screen{padding:20px}.welcome-icon{font-size:60px;margin-bottom:20px}.welcome-title{font-size:1.8rem}.welcome-subtitle{font-size:1rem;margin-bottom:30px}.welcome-features{flex-direction:column;gap:15px;width:100%}.feature{padding:15px}.feature-icon{font-size:28px}}.no-tokens-modal-overlay{align-items:center;animation:fadeIn .3s ease-out;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#000000d9;bottom:0;display:flex;justify-content:center;left:0;position:fixed;right:0;top:0;z-index:10000}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.no-tokens-modal{animation:slideUp .4s ease-out;background:linear-gradient(135deg,var(--color-bg-medium) 0,var(--color-bg-light) 100%);border:1px solid var(--color-border);border-radius:var(--radius-2xl);box-shadow:0 20px 60px #00000080,0 0 100px var(--color-primary-alpha-10),inset 0 1px 0 #ffffff1a;max-width:500px;padding:var(--spacing-3xl);width:90%}@keyframes slideUp{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}.no-tokens-modal-content{text-align:center}.no-tokens-icon{animation:pulse 2s infinite;margin-bottom:30px}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.05)}}.no-tokens-title{color:var(--color-warning);font-size:calc(var(--font-xl) + 4px);font-weight:700;letter-spacing:1px;margin-bottom:20px;text-transform:uppercase}.no-tokens-message{color:var(--color-text-secondary);font-size:var(--font-base);line-height:1.6;margin-bottom:30px;opacity:.9}.no-tokens-details{background:var(--color-primary-alpha-10);border:1px solid var(--color-border);border-radius:var(--radius-lg);margin-bottom:30px;padding:var(--spacing-xl)}.no-tokens-wallet{color:var(--color-text-muted);font-size:var(--font-sm);margin-bottom:10px}.wallet-address{color:var(--color-warning);font-family:Courier New,monospace;font-weight:600;margin-left:8px}.no-tokens-requirement{color:var(--color-text-muted);font-size:calc(var(--font-xs) + 1px);line-height:1.5;margin:0}.no-tokens-actions{display:flex;gap:15px;justify-content:center}.no-tokens-button{border:none;border-radius:calc(var(--radius-md) + 2px);cursor:pointer;display:inline-block;font-size:var(--font-base);font-weight:var(--font-semibold);letter-spacing:.5px;padding:var(--spacing-md) calc(var(--spacing-xl) + 6px);text-decoration:none;text-transform:uppercase;transition:all var(--transition-base)}.no-tokens-button.primary{background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 4px 15px #667eea66;color:#fff}.no-tokens-button.primary:hover{box-shadow:0 6px 20px #667eea80;transform:translateY(-2px)}.no-tokens-button.secondary{background:#ffffff1a;border:1px solid #fff3;color:var(--color-text-secondary)}.no-tokens-button.secondary:hover{background:#ffffff26;border-color:#ffffff4d}@media (max-width:600px){.no-tokens-modal{padding:30px 20px}.no-tokens-title{font-size:24px}.no-tokens-actions{flex-direction:column}.no-tokens-button{width:100%}}