:root {
  color-scheme: dark;
  --bg: #05090b;
  --panel: #091318;
  --line: #1b4350;
  --text: #f1fbff;
  --muted: #9fb7bf;
  --cyan: #42ddf5;
  --green: #78f2a8;
  --gold: #f5d36b;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: Inter, ui-sans-serif, system-ui, Segoe UI, sans-serif; background: var(--bg); color: var(--text); }
.topbar { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 18px 28px; border-bottom: 1px solid var(--line); background: rgba(5, 9, 11, .94); }
.eyebrow { display: block; color: var(--cyan); font-size: 12px; font-weight: 900; letter-spacing: 0; }
h1, h2 { margin: 0; line-height: 1.04; }
h1 { font-size: clamp(26px, 4vw, 44px); }
h2 { font-size: 22px; }
main { width: min(1180px, calc(100vw - 28px)); margin: 24px auto 48px; display: grid; gap: 18px; }
.token-field { display: grid; gap: 6px; min-width: min(340px, 100%); color: var(--muted); font-size: 12px; font-weight: 800; }
.status-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.status-grid article, .panel { border: 1px solid var(--line); background: var(--panel); border-radius: 8px; padding: 18px; }
.status-grid b { display: block; font-size: 28px; margin-top: 8px; }
.workspace { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.wide { grid-column: 1 / -1; }
form { display: grid; gap: 12px; }
input, select { width: 100%; min-height: 44px; border: 1px solid var(--line); border-radius: 4px; background: #071116; color: var(--text); padding: 0 12px; font: inherit; }
button { min-height: 44px; border: 1px solid var(--cyan); background: #0d3540; color: var(--text); border-radius: 4px; padding: 0 14px; font-weight: 900; cursor: pointer; }
button:hover { border-color: var(--green); }
.panel-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 12px; }
pre { margin: 0; white-space: pre-wrap; overflow: auto; max-height: 380px; color: #cfe8ee; }
@media (max-width: 800px) {
  .topbar, .workspace, .status-grid { grid-template-columns: 1fr; display: grid; }
  .topbar { position: static; padding: 16px; }
  main { width: min(100% - 20px, 720px); }
}