*{margin:0;padding:0;box-sizing:border-box}body{font-family:Arial,sans-serif;background:linear-gradient(135deg,#667eea,#764ba2);min-height:100vh;color:#333}.app{max-width:600px;margin:0 auto;padding:20px}h1{text-align:center;color:#fff;margin-bottom:10px;font-size:2.5em}.subtitle{text-align:center;color:#fff;margin-bottom:30px;font-size:1.2em;opacity:.9;font-weight:500}.card{background:#fff;border-radius:12px;padding:25px;margin-bottom:20px;box-shadow:0 4px 20px #0000001a}.card h2{margin-bottom:20px;color:#333;border-bottom:2px solid #eee;padding-bottom:10px}.button{background:#667eea;color:#fff;border:none;padding:12px 24px;border-radius:8px;cursor:pointer;font-size:16px;margin:5px;transition:background .2s}.button:hover:not(:disabled){background:#5a6fd8}.button:disabled{background:#ccc;cursor:not-allowed}.button.primary{background:#28a745;font-weight:700}.button.primary:hover:not(:disabled){background:#218838}.form{display:flex;flex-direction:column;gap:15px}.form label{font-weight:700;color:#555}.form input{padding:12px;border:2px solid #ddd;border-radius:8px;font-size:16px}.form input:focus{outline:none;border-color:#667eea}.form input:disabled{background:#f5f5f5;cursor:not-allowed}.buttons{display:flex;gap:10px;justify-content:center;margin-top:20px}.buttons .button.primary{flex:1}.buttons .button:not(.primary){flex:0 0 auto;min-width:80px}.success{background:#d4edda;color:#155724;padding:15px;border-radius:8px;border:1px solid #c3e6cb;font-weight:700}.result{background:#e3f2fd;color:#1565c0;padding:15px;border-radius:8px;border:1px solid #bbdefb;margin-top:20px;font-weight:700;text-align:left;max-height:300px;overflow-y:auto}.swap-info{background:#fff3e0;color:#e65100;padding:15px;border-radius:8px;border:1px solid #ffcc02;margin:15px 0}.swap-info p{margin:5px 0;font-weight:500}.steps{display:flex;flex-direction:column;gap:15px}.step{display:flex;align-items:center;padding:15px;border:2px solid #e9ecef;border-radius:8px;transition:all .3s ease;overflow:hidden;justify-content:space-between}.step.pending{background:#f8f9fa;border-color:#dee2e6}.step.in_progress{background:#fff3cd;border-color:#ffc107;animation:pulse 1.5s ease-in-out infinite alternate}.step.completed{background:#d4edda;border-color:#28a745}.step.current{border-color:#007bff;box-shadow:0 0 0 3px #007bff40}@keyframes pulse{0%{opacity:.8}to{opacity:1}}.step-number{width:30px;height:30px;border-radius:50%;background:#6c757d;color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;margin-right:15px;flex-shrink:0}.step.in_progress .step-number{background:#ffc107;color:#000}.step.completed .step-number{background:#28a745}.step-content{flex:1;min-width:0;margin-right:10px}.step-title{font-weight:600;font-size:16px;margin-bottom:5px}.step-tx{font-size:12px;color:#6c757d}.step-tx a{color:#007bff;text-decoration:none}.step-tx a:hover{text-decoration:underline}.step-status{font-size:20px;margin-left:10px;margin-right:10px;flex-shrink:0}h3{margin:0 0 10px;font-size:14px;color:#666;text-align:center}ol{padding-left:20px}ol li{margin-bottom:8px;line-height:1.5}p{margin-top:15px;color:#666;font-style:italic}@media (max-width: 768px){.app{padding:15px}h1{font-size:2em}.card{padding:20px}.buttons{flex-direction:column}}
