:root{color-scheme:light;font:16px/1.5 Arial,Helvetica,sans-serif;background:#fff;color:#000}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;background:#fff;color:#000}
header{display:flex;align-items:center;justify-content:space-between;max-width:960px;margin:auto;padding:24px 32px;gap:20px}
header strong{font-size:22px;letter-spacing:-1px}
.badge{font-size:12px;border:1px solid #000;padding:5px 10px;border-radius:20px}
main{width:min(464px,calc(100% - 32px));margin:72px auto 60px;padding:0}
h1{font-size:36px;letter-spacing:-.04em;line-height:1.15;margin:0}
h2{font-size:18px;letter-spacing:-.3px;margin:0}
section{border:1px solid #000;border-radius:28px;background:#fff;padding:24px;margin-top:28px}
label{display:block;margin-top:16px;font-size:14px}
input,select,button{width:100%;font:inherit;border:1px solid #000;border-radius:14px;padding:12px 16px;margin-top:10px;background:#fff;color:#000}
input::placeholder{color:#000;opacity:.6}
button{cursor:pointer;background:#000;color:#fff;border-radius:20px;font-weight:600;min-height:48px}
button.secondary{background:#fff;color:#000}
button:disabled{opacity:.4;cursor:not-allowed}
input:disabled,select:disabled{opacity:.5;cursor:not-allowed}
:is(input,select,button,summary,a):focus-visible{outline:2px solid #000;outline-offset:4px}
button:not(:disabled):hover{background:#fff;color:#000}
button.secondary:not(:disabled):hover{background:#000;color:#fff}
code{word-break:break-all;font-size:13px}
details{margin-top:18px}
summary{cursor:pointer}
details[open]>summary{margin-bottom:12px}
a{color:#000;text-decoration:underline;text-underline-offset:3px}
p{overflow-wrap:anywhere}
.muted{color:#000;font-size:13px}
#swap-error:empty,#wallet-status:empty{display:none}
#offers button{text-align:left}
#swap{margin-top:24px}
#trade-status{color:#000}
#trade-amounts{font-size:20px}
#take-form{margin-top:18px}
@media(max-width:520px){header{padding:20px 16px;flex-wrap:wrap;gap:10px}main{margin-top:40px}section{padding:20px}h1{font-size:32px}}