:root{color-scheme:dark;--bg:#07111d;--panel:#0d1825;--panel2:#111f2f;--text:#f4f7fb;--muted:#8fa2b7;--line:#1c3045;--good:#4ade80;--warn:#fbbf24;--bad:#fb7185;--accent:#60a5fa}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","Segoe UI",sans-serif}body{min-height:100vh}.app{max-width:720px;margin:0 auto;padding:calc(env(safe-area-inset-top) + 14px) 14px calc(env(safe-area-inset-bottom) + 28px)}
.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.brand{font-size:27px;font-weight:800;letter-spacing:-.7px}.subtitle{font-size:12px;color:var(--muted);margin-top:2px}.badge{font-size:12px;font-weight:800;padding:8px 10px;border-radius:999px;border:1px solid var(--line)}.badge.online{color:var(--good);background:#0c241a}.badge.offline{color:var(--muted);background:#111923}.badge.reconnecting{color:var(--warn);background:#2a210b}
.card{background:linear-gradient(180deg,var(--panel2),var(--panel));border:1px solid var(--line);border-radius:18px;padding:15px;margin-bottom:12px;box-shadow:0 10px 30px #0003}.section-title{font-size:13px;font-weight:800;color:#dbe7f3;margin-bottom:11px;text-transform:uppercase;letter-spacing:.6px}.row-title{display:flex;justify-content:space-between;align-items:center}
.token-row{display:flex;gap:8px}input{flex:1;min-width:0;border:1px solid #29435d;background:#08131f;color:white;padding:13px 12px;border-radius:12px;font-size:16px;outline:none}input:focus{border-color:var(--accent)}button{border:0;border-radius:12px;padding:13px 14px;font-weight:800;font-size:14px;color:white;cursor:pointer;touch-action:manipulation}button:disabled{opacity:.4}.primary{background:#1769e0}.danger{background:#9f2940}.secondary{background:#1a2b3d;border:1px solid #30485e}.small{padding:10px 13px}.tiny{padding:6px 9px;font-size:11px;border-radius:9px}.actions{display:flex;gap:9px;margin-top:12px}.actions button{flex:1}.actions.wrap{flex-wrap:wrap}.actions.wrap button{min-width:140px}.hint,.warning{font-size:12px;line-height:1.45;color:var(--muted);margin-top:9px}.warning{color:#d5b86b}
.status-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-bottom:12px}.metric{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:13px}.metric span{display:block;color:var(--muted);font-size:11px;margin-bottom:5px}.metric strong{font-size:18px;letter-spacing:-.3px}.rows>div{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid #17293b;font-size:13px}.rows>div:last-child{border-bottom:0}.rows span{color:var(--muted)}.rows b{text-align:right}.log{height:265px;overflow:auto;background:#06101a;border:1px solid #183047;border-radius:12px;padding:11px;margin:0;font:12px/1.55 ui-monospace,SFMono-Regular,Menlo,monospace;white-space:pre-wrap;color:#c7d7e7}.positive{color:var(--good)!important}.negative{color:var(--bad)!important}.warning-text{color:var(--warn)!important}
@media(min-width:560px){.status-grid{grid-template-columns:repeat(3,1fr)}}