:root { --bg:#0b1630; --card:#12214a; --border:#24366b; --fg:#f4f6fb; --muted:#aab6d3; --accent:#e0b13a; --accent-ink:#0b1630; --err:#ff8a80; --ok:#7ee2b8; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--fg); font:16px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif; }
main { max-width:560px; margin:0 auto; padding:20px 16px 48px; }
.brand { font-weight:800; font-size:15px; letter-spacing:.2px; } .brand span { color:var(--muted); font-weight:500; }
h1 { font-size:24px; line-height:1.25; margin:14px 0 6px; }
.sub { color:var(--muted); font-size:14px; margin:0 0 18px; }
.card { background:var(--card); border:1px solid var(--border); border-radius:14px; padding:16px; margin-bottom:14px; }
label { display:block; font-size:13px; font-weight:600; color:var(--muted); margin:10px 0 4px; }
label:first-child { margin-top:0; }
input, select { width:100%; padding:11px 12px; border:1px solid var(--border); border-radius:10px; background:#0d1a3b; color:var(--fg); font-size:16px; }
.mono { font-family:ui-monospace,Menlo,Consolas,monospace; font-size:14px; word-break:break-all; }
.row { display:flex; gap:10px; } .row > div { flex:1; min-width:0; }
button { width:100%; margin-top:14px; padding:13px 16px; border:0; border-radius:11px; background:var(--accent); color:var(--accent-ink); font-weight:800; font-size:16px; cursor:pointer; }
button:disabled { opacity:.45; cursor:not-allowed; }
button.ghost { background:transparent; color:var(--fg); border:1px solid var(--border); font-weight:600; }
.big { font-size:20px; font-weight:800; margin:0 0 4px; }
.small { font-size:13px; color:var(--muted); }
.err { color:var(--err); font-size:14px; margin:10px 0 0; }
table { width:100%; border-collapse:collapse; font-size:14px; margin-top:8px; }
td { padding:7px 0; border-bottom:1px solid var(--border); vertical-align:top; } td:last-child { text-align:right; padding-left:10px; }
tr.total td { font-weight:800; border-bottom:0; }
.qr { display:block; width:220px; height:220px; margin:10px auto; background:#fff; border-radius:8px; }
a { color:var(--accent); }
ul { padding-left:18px; margin:6px 0 0; } li { margin:4px 0; font-size:14px; color:var(--muted); }
[hidden] { display:none !important; }
nav.pairs { font-size:14px; margin:4px 0 14px; }
h2 { font-size:18px; margin:22px 0 8px; }
ol.steps { padding-left:22px; margin:6px 0 0; } ol.steps li { color:var(--fg); font-size:15px; margin:6px 0; }
.fee { font-size:15px; margin:10px 0 0; }
details { border-bottom:1px solid var(--border); padding:10px 0; } details:last-child { border-bottom:0; }
summary { font-weight:700; cursor:pointer; font-size:15px; }
details p { color:var(--muted); font-size:14px; margin:8px 0 0; }