*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top,#263b78,#050816);font-family:Arial;color:#fff}.page{min-height:100vh;display:flex;justify-content:center;align-items:center;padding:20px}.card{width:430px;max-width:100%;padding:35px;border-radius:30px;background:#ffffff14;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);box-shadow:0 0 80px #000;text-align:center}.appLogo{width:350px;height:100px;max-width:100%;object-fit:contain}h1{margin-bottom:5px}.panel{margin-top:20px;padding:20px;background:#ffffff14;border-radius:20px;text-align:left}.cnyEstimate{color:#b8c3e9;font-size:14px;font-weight:400}.inputLabel{display:flex;justify-content:space-between;align-items:center;gap:12px}.inputRow{margin-top:10px;position:relative}.quote{display:flex;align-items:center;gap:8px}.tokenLabel{position:absolute;top:50%;right:15px;transform:translateY(-50%);display:flex;align-items:center;gap:8px;white-space:nowrap}.inputRow .tokenLabel{color:#000}.tokenSelectRow{position:relative;margin-top:10px}.inputRow input,.tokenSelectRow select{width:100%}.inputRow input{padding-right:82px}.tokenSelectRow select{padding-right:52px}.tokenSelectRow .tokenLogo{position:absolute;top:50%;right:15px;transform:translateY(-50%);pointer-events:none}.tokenLogo{width:24px;height:24px;border-radius:50%;object-fit:cover;flex:none}.quote{justify-content:center;margin:0}input,select{width:100%;padding:15px;border-radius:15px;border:0;font-size:18px}.swap{font-size:35px;margin:15px}button{width:100%;margin-top:25px;padding:16px;border:0;border-radius:20px;background:#55e6ff;font-size:18px;cursor:pointer;transition:opacity .2s,transform .2s}button:hover:not(:disabled){transform:translateY(-1px)}button:disabled{cursor:not-allowed;opacity:.6}.result{margin-top:25px;padding:20px;border-radius:20px;background:#0000004d}strong{color:#55e6ff}.error{margin:0;color:#ff9d9d;line-height:1.5}.inputError{margin:10px 0 0;color:#ffb4b4;font-size:14px;line-height:1.4}@media(max-width:600px){.card{padding:22px}}