:root { color-scheme: dark; --bg:#050f19; --panel:#0e1f2f; --panel2:#192e43; --edge:#24384f; --gold:#c9a31d; --gold2:#e3bd44; --muted:#7e96b8; --text:#e6eaf3; --rose:#fb7185; --emerald:#34d399; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin:0; font: 16px/1.5 Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; color:var(--text); background: radial-gradient(1100px 550px at 75% -10%, #16314a 0%, transparent 60%), var(--bg); min-height:100vh; display:flex; flex-direction:column; }
a { color: var(--gold); text-decoration: none; } a:hover { color: var(--gold2); }
.top { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:12px 16px; border-bottom:1px solid rgba(201,163,29,.2); background:rgba(14,31,47,.9); backdrop-filter: blur(8px); position:sticky; top:0; }
.brand { font-weight:700; letter-spacing:.02em; color:#fff; display:flex; align-items:center; gap:8px; }
.brand .logo { display:grid; place-items:center; width:28px; height:28px; border-radius:8px; background:linear-gradient(135deg,var(--gold),var(--gold2)); color:#04101b; font-size:16px; }
.brand .sub { color: var(--muted); font-weight:500; }
.top nav { display:flex; gap:14px; font-size:14px; } .top nav a { color: var(--muted); } .top nav a:hover { color:#fff; }
.wrap { width:100%; max-width:760px; margin:0 auto; padding:24px 16px 48px; flex:1; }
.foot { max-width:760px; margin:0 auto; padding:0 16px 32px; font-size:12px; color:var(--muted); }
.card { background:var(--panel); border:1px solid var(--edge); border-radius:14px; padding:20px; }
.card + .card { margin-top:16px; }
h1 { font-size:1.5rem; margin:0 0 8px; } h2 { font-size:1.05rem; margin:24px 0 10px; color:#fff; } h3 { font-size:.95rem; margin:12px 0 8px; color:#fff; }
.muted { color: var(--muted); } .small { font-size: 13px; }
code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size:.9em; color:#9cc9ff; overflow-wrap:anywhere; }
.grid2 { display:grid; gap:16px; grid-template-columns: 1fr; } @media (min-width: 640px) { .grid2 { grid-template-columns: 1fr 1fr; } }
.wallets { display:flex; flex-direction:column; gap:8px; }
.wallet { display:flex; align-items:center; gap:10px; width:100%; text-align:left; padding:12px 14px; min-height:48px; border-radius:10px; border:1px solid var(--edge); background:var(--panel2); color:#fff; font:inherit; cursor:pointer; }
.wallet:hover { border-color: rgba(201,163,29,.6); } .wallet:disabled { opacity:.5; cursor:wait; }
.wallet img { width:24px; height:24px; border-radius:6px; }
.status { min-height:1.5em; font-size:14px; color:var(--muted); margin:12px 0 0; } .status.err { color: var(--rose); } .status.ok { color: var(--emerald); }
.help { margin-top:16px; font-size:14px; color:var(--muted); } .help summary { cursor:pointer; color:#fff; }
.form label { display:block; font-size:13px; color:var(--muted); margin:10px 0; }
.form input { display:block; width:100%; margin-top:4px; padding:10px 12px; font:inherit; font-size:16px; color:#fff; background:var(--panel2); border:1px solid var(--edge); border-radius:10px; outline:none; }
.form input:focus { border-color: var(--gold); }
.row { display:flex; flex-wrap:wrap; align-items:center; gap:10px; margin-top:12px; } .row.between { justify-content:space-between; margin-top:0; }
.btn { display:inline-flex; align-items:center; justify-content:center; min-height:40px; padding:8px 16px; border-radius:10px; border:1px solid transparent; background:var(--gold); color:#04101b; font:inherit; font-weight:600; font-size:14px; cursor:pointer; }
.btn:hover { background: var(--gold2); } .btn:disabled { opacity:.5; cursor:default; }
.btn.ghost { background:transparent; color:#fff; border-color:var(--edge); } .btn.ghost:hover { background:var(--panel2); }
.btn.danger { background:transparent; color:var(--rose); border-color: rgba(251,113,133,.4); } .btn.danger:hover { background: rgba(251,113,133,.1); }
.pill { display:inline-flex; align-items:center; padding:4px 10px; border-radius:999px; font-size:12px; border:1px solid rgba(201,163,29,.3); background:rgba(201,163,29,.1); color:var(--gold); }
.list { list-style:none; margin:0; padding:0; border:1px solid var(--edge); border-radius:10px; overflow:hidden; }
.list li { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:8px; padding:10px 12px; border-top:1px solid var(--edge); font-size:14px; }
.list li:first-child { border-top:0; }
.list .meta { color: var(--muted); font-size:12px; width:100%; }
.list button.link { background:none; border:0; color:var(--muted); font:inherit; font-size:13px; cursor:pointer; padding:4px 0; } .list button.link:hover { color:#fff; }
.list button.link.danger:hover { color: var(--rose); }
.tag { font-size:11px; padding:2px 6px; border-radius:6px; border:1px solid var(--edge); color:var(--muted); }
.wc { margin-top:16px; padding:14px; border:1px solid var(--edge); border-radius:12px; background:var(--panel2); }
.wc-body { display:flex; flex-wrap:wrap; align-items:center; gap:16px; margin-top:10px; }
.wc-body img { border-radius:10px; border:1px solid var(--edge); max-width:100%; height:auto; }
.wc-actions { display:flex; flex-direction:column; gap:8px; min-width:180px; }
.btn.small { min-height:32px; padding:4px 10px; font-size:13px; }
.wallet.wc-btn { border-style:dashed; }
[hidden] { display:none !important; }