/* The happy medium (owner 10-24: "a happy medium of stream pay and terminal 7"): Stream Pay's comfort for reading and clicking (Inter,
   rounded cards and buttons, pill tabs, room to breathe), T7's terminal voice for numbers, data and labels (VT323 titles and big numbers,
   IBM Plex Mono for prices / addresses / tables / small spaced capitals, the faint grid, T7 blue + amber). Pages opt in with
   <body class="ui"> (everything here is scoped under .ui, so the header / menus / panels from nav.js and account.js keep their own
   look). /account first (stage 1); the other pages move over one at a time. Stream Pay keeps the same shapes in its purple. */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&family=VT323&family=IBM+Plex+Mono:wght@400;500;600&display=swap');
.ui{--u-bg:#090c16;--u-pn:#111727;--u-p2:#161d31;--u-ln:#232c45;--u-tx:#e6eaf5;--u-dm:#8d97b3;--u-a:#3b6cf0;--u-a2:#5b86ff;--u-ok:#2ee68a;--u-bad:#ff5c7a;--u-am:#ffc53d;--u-sp:#7c5cff;--u-sp2:#a28bff;--u-r:12px}
body.ui{background-color:var(--u-bg);background-image:linear-gradient(rgba(42,90,218,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(42,90,218,.035) 1px,transparent 1px),radial-gradient(1200px 500px at 70% -10%,rgba(59,108,240,.10),transparent 60%);background-size:28px 28px,28px 28px,auto}
.ui main{font:14.5px/1.5 Inter,system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;color:var(--u-tx)}
.ui main a{color:var(--u-a2)}
.ui .u-h1{font-family:'VT323',monospace;font-weight:400;font-size:46px;line-height:.95;color:#fff;letter-spacing:0}
.ui .u-lead{color:var(--u-dm);font-size:14px;margin:6px 0 18px}
.ui .u-mono{font-family:'IBM Plex Mono',monospace}
.ui .u-tabs{display:flex;gap:4px;background:var(--u-pn);padding:5px;border-radius:12px;width:max-content;max-width:100%;overflow-x:auto;scrollbar-width:none;margin-bottom:6px}
.ui .u-tabs button{display:flex;gap:7px;align-items:center;border:0;background:none;color:var(--u-dm);font:600 13px Inter,sans-serif;padding:8px 14px;border-radius:9px;cursor:pointer;white-space:nowrap}
.ui .u-tabs button.on{background:var(--u-p2);color:#fff;box-shadow:inset 0 0 0 1px var(--u-ln)}.ui .u-tabs .ic{width:15px;height:15px}
.ui .u-sec{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font:600 11px 'IBM Plex Mono',monospace;letter-spacing:2px;text-transform:uppercase;color:#fff;margin:24px 0 10px}
.ui .u-sec small{font:400 12.5px Inter,sans-serif;letter-spacing:0;text-transform:none;color:var(--u-dm)}.ui .u-sec img,.ui .u-sec svg{height:18px;width:auto}
.ui .u-card{background:var(--u-pn);border:1px solid var(--u-ln);border-radius:var(--u-r);padding:18px;display:grid;gap:12px;align-content:start;min-width:0}
.ui .u-card.on{border-color:rgba(91,134,255,.55);box-shadow:0 0 0 4px rgba(91,134,255,.07),0 20px 40px -24px rgba(59,108,240,.4)}
.ui .u-card.sp{border-color:#2d2a55}.ui .u-card.sp.on{border-color:rgba(162,139,255,.55);box-shadow:0 0 0 4px rgba(124,92,255,.08)}
.ui .u-card.dash{border-style:dashed}
.ui .u-big{font-family:'VT323',monospace;font-weight:400;font-size:40px;line-height:.9;color:#fff}
.ui .u-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.ui .u-sp{justify-content:space-between}.ui .u-ml{margin-left:auto}
.ui .u-sm{font-size:13px;color:var(--u-dm);line-height:1.55}.ui .u-sm b{color:#fff;font-weight:600}
.ui .u-chip{display:inline-flex;align-items:center;gap:5px;font:600 10px 'IBM Plex Mono',monospace;letter-spacing:1px;text-transform:uppercase;padding:3px 8px;border-radius:6px;border:1px solid var(--u-ln);color:var(--u-dm);background:var(--u-p2);white-space:nowrap}
.ui .u-chip.g{border-color:#1f6b45;color:var(--u-ok)}.ui .u-chip.a{border-color:#6b5414;color:var(--u-am)}.ui .u-chip.b{border-color:#2b4592;color:var(--u-a2)}.ui .u-chip.p{border-color:#3d3270;color:var(--u-sp2)}
.ui .u-btn{display:inline-flex;gap:7px;align-items:center;justify-content:center;border:1px solid var(--u-ln);background:var(--u-p2);color:#fff;font:600 13px Inter,sans-serif;padding:9px 15px;border-radius:10px;cursor:pointer;white-space:nowrap;text-decoration:none}
.ui .u-btn:hover{border-color:var(--u-a2);text-decoration:none}.ui .u-btn .ic{width:15px;height:15px}
.ui .u-btn.p{background:var(--u-a);border-color:var(--u-a);box-shadow:0 8px 20px -10px var(--u-a)}.ui .u-btn.o{background:none;border-color:var(--u-a2);color:var(--u-a2)}
.ui .u-btn.sp{background:var(--u-sp);border-color:var(--u-sp);box-shadow:0 8px 20px -10px var(--u-sp)}.ui .u-btn.spo{background:none;border-color:var(--u-sp2);color:var(--u-sp2)}
.ui .u-btn.g{background:none;border-color:#1f6b45;color:var(--u-ok)}.ui .u-btn:disabled{opacity:.5;cursor:default}
.ui .u-bar{height:6px;border-radius:99px;background:#1a2236;overflow:hidden}.ui .u-bar i{display:block;height:100%;border-radius:99px;background:linear-gradient(90deg,var(--u-a2),var(--u-ok))}
.ui .u-card.sp .u-bar i{background:linear-gradient(90deg,var(--u-sp),var(--u-a2))}
.ui .u-list{list-style:none;display:grid;gap:4px;font-size:13.5px;margin:0;padding:0}.ui .u-list li::before{content:'+ ';color:var(--u-a2)}
.ui .u-tw{background:var(--u-pn);border:1px solid var(--u-ln);border-radius:var(--u-r);overflow-x:auto}
.ui table.u-t{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.ui .u-t th,.ui .u-t td{text-align:left;padding:10px 12px;border-bottom:1px solid #1a2238;font:12.5px 'IBM Plex Mono',monospace;white-space:nowrap}
.ui .u-t th{color:var(--u-dm);font-size:10px;letter-spacing:1.4px;font-weight:600;text-transform:uppercase}.ui .u-t tr:last-child td{border-bottom:0}.ui .u-t .r{text-align:right}
.ui .u-sk{height:120px;border-radius:var(--u-r);background:linear-gradient(90deg,var(--u-pn),var(--u-p2),var(--u-pn));background-size:200% 100%;animation:uSk 1.2s infinite}@keyframes uSk{to{background-position:-200% 0}}
.ui .u-empty{font-size:13px;color:var(--u-dm);padding:14px;text-align:center}
.ui .ok{color:var(--u-ok)}.ui .bad{color:var(--u-bad)}.ui .warn{color:var(--u-am)}
.ui main :focus-visible{outline:2px solid var(--u-am);outline-offset:2px}
@media (max-width:520px){.ui .u-h1{font-size:38px}.ui .u-card{padding:15px}}
