body { font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif; margin: 24px; color: #111; background:#fafafa; }
h1 { font-size: 20px; margin: 0 0 12px; }
.row { display: grid; grid-template-columns: 1fr; gap: 16px; }
@media (min-width: 1100px) { .row { grid-template-columns: 1fr 2fr; } }
textarea { width: 100%; min-height: 260px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: 13px; white-space: pre; overflow: auto; resize: vertical; }
.card { border: 1px solid #e5e7eb; border-radius: 10px; padding: 16px; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,0.04); }
.btn { display:inline-block; background:#111827; color:#fff; border-radius:8px; padding:10px 14px; border:none; cursor:pointer; font-weight:600; }
.btn:disabled { opacity: .5; cursor: not-allowed; }
.btn.stop { background:#991b1b; }
input[type=file] { width: 100%; }
table { width: 100%; border-collapse: collapse; font-size: 13px; }
th, td { padding: 8px 10px; border-bottom: 1px solid #eee; white-space: nowrap; }
th:nth-child(1), td:nth-child(1) { text-align: left; }
.muted { color:#6b7280; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
.small { font-size: 12px; }
.grid2 { display:grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.fullwidth { width: 100%; }
#log { background:#0b1020; color:#c7d2fe; padding:10px; border-radius:8px; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:12px; max-height:220px; overflow:auto; }
.legend { font-size:12px; margin-top:6px; display:flex; flex-wrap:wrap; gap:12px; }
.legend .dot { display:inline-block; width:10px; height:10px; border-radius:50%; margin-right:6px; vertical-align:middle; }

/* Progress UI */
.progressCard { border: 1px solid #e5e7eb; border-radius: 10px; padding: 12px; background:#fff; box-shadow: 0 1px 2px rgba(0,0,0,.04); }
.progRow { display:flex; align-items:center; gap:12px; flex-wrap: wrap; }
.iconWrap { width:18px; height:18px; display:flex; align-items:center; justify-content:center; }
.spin { width:16px; height:16px; border:2px solid #e5e7eb; border-top-color:#111827; border-radius:50%; animation: spin .7s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.check { width:16px; height:16px; color:#10b981; }
.xmark { width:16px; height:16px; color:#ef4444; }
.progBarWrap { position: relative; width:100%; height:14px; background:#f3f4f6; border-radius:999px; overflow:hidden; }
.progBar { position:absolute; left:0; top:0; height:100%; width:0%; background: linear-gradient(90deg, #111827, #2563eb); transition: width .2s ease; }
.progBarStripe { position:absolute; inset:0; background-image: linear-gradient(45deg, rgba(255,255,255,.2) 25%, transparent 25%, transparent 50%, rgba(255,255,255,.2) 50%, rgba(255,255,255,.2) 75%, transparent 75%, transparent);
  background-size: 20px 20px; animation: move 1.2s linear infinite; opacity:.4; }
@keyframes move { from { background-position: 0 0; } to { background-position: 20px 0; } }
.badge { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; background:#eef2ff; border:1px solid #c7d2fe; color:#3730a3; padding:2px 6px; border-radius:6px; }
.kv { font-size:12px; color:#6b7280; }
.kv b { color:#111827; }

/* Top area layout tweaks */
#headRow { align-items: start; }
#topRunsCard table td .eq-buy { font-weight: 600; font-size:12px; }
#topRunsCard table td .eq-sell { font-weight: 600; font-size:12px; margin-top:2px; }
#topRunsCard table .right { text-align:right; white-space:nowrap; }