:root{
  --bg:#0e1419; --fg:#e9edef; --muted:#9db1ba;
  --panel:#111a21; --border:#1f2a30; --accent:#1faa59; --accent2:#17944d;
  --inbg:#0f1a20;
}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial}
.wrap{max-width:1100px;margin:0 auto;padding:0 16px}
.topbar{border-bottom:1px solid var(--border);background:#0d1318}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;padding:12px 0}
.brand{font-weight:700;letter-spacing:.2px}

.main{padding:20px 0}
.inline-form{
  display:flex; align-items:center; gap:12px; flex-wrap:nowrap;
  background:var(--panel); border:1px solid var(--border); padding:12px 14px;
  border-radius:14px; overflow:auto; -webkit-overflow-scrolling:touch; overscroll-behavior-x:contain;
}
.lbl{opacity:.85; font-size:.95rem; white-space:nowrap}
.lbl.muted{opacity:.5}
.inp{
  background:var(--inbg); color:var(--fg); border:1px solid var(--border);
  border-radius:12px; padding:12px 14px; min-width:160px;
}
.inp.nick{min-width:150px}
.inp.token{min-width:130px}
.inp.token.disabled{opacity:.5}
.seg{display:inline-flex; gap:8px; background:transparent; padding:0 2px}
.radio{display:inline-flex; align-items:center; gap:8px; padding:10px 12px; border:1px solid var(--border); border-radius:999px; background:transparent; white-space:nowrap}
.radio input{accent-color:var(--accent)}
.btn{
  display:inline-flex; align-items:center; gap:8px;
  border:1px solid var(--border); background:var(--accent); color:#fff;
  padding:12px 14px; border-radius:12px; cursor:pointer; white-space:nowrap;
}
.btn:hover{background:var(--accent2)}
.btn .icon{width:20px;height:20px;fill:none;stroke:#fff;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.btn .txt{display:inline}

/* --- MOBILE STACKED --- */
@media (max-width: 600px){
  .inline-form{
    flex-direction:column; align-items:stretch; gap:10px; padding:12px;
  }
  .lbl{display:block; white-space:normal}
  .inp{width:100%; min-width:0}
  .seg{width:100%; justify-content:space-between}
  .radio{flex:1; justify-content:center}
  .token-lbl{margin-top:4px}
  .btn{width:100%; justify-content:center}
}

/* Footer */
.foot{border-top:1px solid var(--border); padding:14px 0; color:var(--muted); text-align:center}