:root {
  --bg: #0c0e13;
  --bg2: #14171f;
  --bg3: #1c2030;
  --border: #2a2f3f;
  --text: #e7eaf0;
  --muted: #8b94aa;
  --text-dim: #6f788f;
  --accent: #5fd2ff;
  --green: #41d99c;
  --yellow: #f5c451;
  --red: #ef4868;
  --orange: #ff8a4a;
}

* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; background: var(--bg); color: var(--text); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; font-size: 14px; }
a { color: var(--accent); }

.topbar { display: flex; align-items: center; justify-content: space-between; padding: 12px 18px; background: var(--bg2); border-bottom: 1px solid var(--border); }
.topbar .brand { display: flex; align-items: center; gap: 8px; font-size: 16px; }
.topbar .version { color: var(--muted); margin-left: 4px; font-size: 12px; }
.topbar-right { display: flex; align-items: center; gap: 14px; font-size: 13px; color: var(--muted); }
.badge { padding: 3px 8px; border-radius: 6px; font-weight: 600; font-size: 11px; }
.badge-paper { background: #3a4a6a; color: #d8e6ff; }
.badge-simulate { background: #66501f; color: #ffe6a8; }
.badge-live { background: #5a1f2c; color: #ffc3ce; }
.wallet-locked { cursor: pointer; }

.controlbar { display: flex; gap: 8px; padding: 10px 18px; background: var(--bg3); border-bottom: 1px solid var(--border); flex-wrap: wrap; }
.controlbar .spacer { flex: 1; }
.ctl { background: var(--bg2); color: var(--text); border: 1px solid var(--border); padding: 8px 14px; border-radius: 6px; font-weight: 600; cursor: pointer; }
.ctl:hover { background: #232838; }
.ctl-start { color: var(--green); border-color: #1f5a3e; }
.ctl-restart { color: var(--accent); }
.ctl-stop { color: var(--muted); }
.ctl-reset { color: var(--orange); }
.ctl-graceful { color: var(--yellow); border-color: #66501f; }
.ctl-emergency { color: var(--red); border-color: #6b1f2c; }

.shutdown-panel { margin: 12px 18px; padding: 12px; background: #1d1a14; border: 1px solid #66501f; border-radius: 8px; }
.shutdown-panel h3 { margin: 0 0 8px; }
.shutdown-panel ul { margin: 4px 0; padding-left: 20px; }
.shutdown-panel.hidden { display: none; }

.tabs { display: flex; gap: 4px; padding: 8px 18px 0; border-bottom: 1px solid var(--border); background: var(--bg2); flex-wrap: wrap; }
.tab { padding: 8px 14px; background: transparent; color: var(--muted); border: none; border-bottom: 2px solid transparent; cursor: pointer; font-weight: 600; }
.tab:hover { color: var(--text); }
.tab.tab-active { color: var(--accent); border-bottom-color: var(--accent); }

main { padding: 16px 18px 60px; }
.tab-panel { display: none; }
.tab-panel.tab-active { display: block; }

.grid-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 18px; }
.stat-card { background: var(--bg2); border: 1px solid var(--border); border-radius: 8px; padding: 12px; }
.stat-label { color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: 0.04em; margin-bottom: 4px; }
.stat-value { font-size: 22px; font-weight: 700; }

.trade-table { width: 100%; border-collapse: collapse; background: var(--bg2); border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
.trade-table th, .trade-table td { padding: 8px 10px; border-bottom: 1px solid var(--border); text-align: left; font-size: 13px; }
.trade-table th { background: var(--bg3); color: var(--muted); font-weight: 600; font-size: 11px; text-transform: uppercase; }
.trade-table tr.landed { color: var(--text); }
.trade-table tr.missed { color: var(--muted); }

.strat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; }
.strat-card { background: var(--bg2); border: 1px solid var(--border); border-radius: 8px; padding: 12px; }
.strat-card h3 { margin: 0 0 6px; font-size: 15px; }
.strat-status { color: var(--muted); font-size: 12px; margin-bottom: 8px; }
.strat-metrics { list-style: none; padding: 0; margin: 0; }
.strat-metrics li { display: flex; justify-content: space-between; padding: 4px 0; border-bottom: 1px dashed var(--border); font-size: 13px; }

.log-controls { display: flex; gap: 12px; align-items: center; margin-bottom: 8px; }
.log-pane { background: #050608; border: 1px solid var(--border); border-radius: 6px; padding: 10px; max-height: 60vh; overflow: auto; white-space: pre-wrap; font-family: ui-monospace, SFMono-Regular, Consolas, "Liberation Mono", monospace; font-size: 12px; }

.settings-intro { color: var(--muted); }
.settings-section { background: var(--bg2); border: 1px solid var(--border); border-radius: 8px; padding: 14px; margin-bottom: 12px; }
.settings-section summary { cursor: pointer; font-size: 15px; font-weight: 600; }
.settings-section label { display: block; margin: 8px 0; color: var(--text); }
.settings-section input[type="text"],
.settings-section input[type="password"],
.settings-section input[type="number"],
.settings-section select { width: 100%; max-width: 460px; background: var(--bg3); color: var(--text); border: 1px solid var(--border); border-radius: 6px; padding: 8px 10px; margin-top: 4px; }
.rpc-panel { border-left: 2px solid var(--border); padding-left: 12px; margin: 10px 0; }
.rpc-panel.hidden { display: none; }
.active-urls { margin-top: 8px; padding: 8px; background: var(--bg3); border-radius: 6px; font-size: 12px; }
.btn-save { display: block; width: 100%; padding: 14px; background: var(--green); color: #0c1a13; border: 0; border-radius: 8px; font-weight: 700; font-size: 14px; cursor: pointer; margin: 24px 0 40px; }

.rust-status { margin-top: 12px; background: var(--bg2); border: 1px solid var(--border); border-radius: 8px; padding: 14px; line-height: 1.7; }

.modal { position: fixed; inset: 0; background: rgba(0,0,0,0.55); display: flex; align-items: center; justify-content: center; z-index: 999; }
.modal.hidden { display: none; }
.modal-inner { background: var(--bg2); border: 1px solid var(--border); border-radius: 12px; padding: 20px; min-width: 360px; max-width: 90vw; }
.modal-inner input { width: 100%; padding: 10px; background: var(--bg3); color: var(--text); border: 1px solid var(--border); border-radius: 6px; margin: 10px 0; }
.modal-buttons { display: flex; gap: 8px; justify-content: flex-end; }
.modal-buttons button { padding: 10px 14px; border-radius: 6px; border: 1px solid var(--border); background: var(--bg3); color: var(--text); cursor: pointer; }

.section-actions { display: flex; align-items: center; gap: 10px; margin-top: 10px; }
.btn-test { padding: 8px 14px; background: var(--bg3); color: var(--text); border: 1px solid var(--border); border-radius: 6px; cursor: pointer; font-size: 13px; }
.btn-test:hover { background: var(--bg2); }
.test-msg { font-size: 12px; color: var(--text-dim); }
.test-msg.ok { color: var(--green); }
.test-msg.err { color: #e8696b; }
.section-hint { font-size: 12px; color: var(--text-dim); margin: 4px 0 8px 0; line-height: 1.5; }

/* Live Status tab */
.live-endpoints { background: var(--bg2); border: 1px solid var(--border); border-radius: 8px; padding: 12px; margin-bottom: 12px; font-size: 13px; line-height: 1.7; }
.live-endpoints code { background: var(--bg3); padding: 1px 6px; border-radius: 4px; }

.live-log-pane { max-height: 70vh; min-height: 360px; font-size: 12px; }
.live-log-pane .ll { display: block; padding: 1px 0; white-space: pre-wrap; word-break: break-all; }
.live-log-pane .ll-ts { color: #4a5168; margin-right: 8px; }
.live-log-pane .ll-comp { color: var(--accent); margin-right: 8px; }
.live-log-pane .ll-debug { color: #6c7488; }
.live-log-pane .ll-info  { color: var(--green); }
.live-log-pane .ll-warn  { color: var(--yellow); }
.live-log-pane .ll-error { color: var(--red); }
.live-log-pane .ll.hidden { display: none; }

.test-msg.ws-ok  { color: var(--green); }
.test-msg.ws-err { color: var(--red); }

.small-stat { font-size: 13px; line-height: 1.35; }
.preflight-list { margin: 8px 0 0 18px; padding: 0; line-height: 1.6; }
.preflight-ok { color: var(--green); }
.preflight-warn { color: var(--yellow); }
.preflight-blocking { color: var(--red); }
.muted { color: var(--muted); }
.trade-table { min-width: 860px; }
.tab-panel { overflow-x: auto; }