/* trading-hq site, step 1 (B-20261114-13): one column, phone first (390 px), system fonts only. */
:root { --bg:#fff; --fg:#14181f; --muted:#667085; --line:#e4e7ec; --card:#f8f9fb; --up:#0a7a3e; --down:#c0262d;
  --blue:#1f5fbf; --warn:#9a5b00; }
@media (prefers-color-scheme: dark) {
  :root { --bg:#0f1218; --fg:#e8eaed; --muted:#98a2b3; --line:#2a303a; --card:#161b23; --up:#3ccf7a; --down:#ff6b6b;
    --blue:#6ea8ff; --warn:#f5b04a; }
}
* { box-sizing: border-box; }
html, body { margin:0; padding:0; background:var(--bg); color:var(--fg); max-width:100%; overflow-x:hidden; }
body { font: 15px/1.45 -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }
nav { display:flex; flex-wrap:wrap; gap:4px; padding:8px; border-bottom:1px solid var(--line); background:var(--card);
  position:sticky; top:0; z-index:5; }
nav a { padding:6px 9px; border-radius:6px; text-decoration:none; color:var(--fg); font-size:14px; }
nav a.on { background:var(--blue); color:#fff; }
main { padding:10px 12px 40px; max-width:980px; margin:0 auto; }
main.login { max-width:380px; }
h1 { font-size:22px; margin:6px 0 4px; overflow-wrap:anywhere; }
h2 { font-size:17px; margin:18px 0 6px; }
h3 { font-size:15px; margin:12px 0 4px; overflow-wrap:anywhere; }
p, li { overflow-wrap:anywhere; }
a { color:var(--blue); }
section { margin:10px 0; }
section.card, section.hero { background:var(--card); border:1px solid var(--line); border-radius:10px; padding:8px 10px; }
section.hero { border-left:4px solid var(--blue); }
.next { font-weight:600; }
.small { font-size:12.5px; }
.muted { color:var(--muted); }
.up { color:var(--up); font-weight:600; }
.down { color:var(--down); font-weight:600; }
.flat { color:var(--muted); }
.warn { color:var(--warn); }
.stamp { font-size:12px; color:var(--muted); margin:0 0 6px; }
.src { font-size:11.5px; color:var(--muted); margin:4px 0 0; overflow-wrap:anywhere; }
.src a { color:var(--muted); }
.tag { display:inline-block; font-size:11px; font-weight:600; padding:1px 6px; border-radius:8px; background:var(--line);
  vertical-align:middle; }
.tag.live { background:#c0262d; color:#fff; } .tag.test { background:#9a5b00; color:#fff; } .tag.paper { background:#475467; color:#fff; }
.dot { display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:2px; vertical-align:middle; }
.dot.ok { background:var(--up); } .dot.bad { background:var(--down); }
.nums { margin:4px 0; }
.tw { max-width:100%; overflow-x:auto; -webkit-overflow-scrolling:touch; }
table { border-collapse:collapse; width:100%; font-size:13.5px; }
th, td { text-align:left; padding:5px 6px; border-bottom:1px solid var(--line); vertical-align:top; overflow-wrap:break-word; }
th { font-size:12px; color:var(--muted); font-weight:600; }
table.num td + td, table.num th + th { text-align:right; white-space:nowrap; }
.chart { width:100%; height:220px; margin:6px 0; position:relative; }
.chart.big { height:340px; } .chart.tall { height:380px; }
.chart .msg { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:var(--muted); font-size:13px; }
ul.news, ol.tasks { padding-left:18px; } ul.news li, ol.tasks li { margin:0 0 9px; }
.filter a { padding:2px 6px; border-radius:6px; } .filter a.on { background:var(--blue); color:#fff; text-decoration:none; }
pre.source { font-size:12px; white-space:pre-wrap; overflow-wrap:anywhere; background:var(--card); padding:6px; border-radius:6px; }
pre.source i { display:inline-block; min-width:44px; color:var(--muted); font-style:normal; }
pre.source span.hit { background:rgba(31,95,191,.18); display:inline-block; width:100%; }
form label { display:block; margin:10px 0; } form input { display:block; width:100%; font-size:17px; padding:8px; margin-top:4px; }
form button { font-size:17px; padding:9px 18px; margin-top:6px; }
footer { margin-top:24px; }
/* step 2 (B-20261114-29): folds, the builder's controls, the history search */
details.fold { margin:10px 0; border:1px solid var(--line); border-radius:10px; padding:6px 10px; background:var(--card); }
details.fold > summary, section details > summary { cursor:pointer; font-weight:600; padding:4px 0; overflow-wrap:anywhere; }
details.fold[open] > summary { margin-bottom:6px; }
.ctl { display:flex; flex-wrap:wrap; gap:6px 10px; align-items:center; margin:6px 0; }
.ctl select { max-width:100%; min-width:0; flex:1 1 200px; font-size:15px; padding:5px; }
.ctl input[type=date] { font-size:15px; padding:3px; max-width:150px; }
.ctl label { display:inline; margin:0; } .ctl label input { display:inline; width:auto; margin:0 3px 0 0; }
.ctl button, form.search button { font-size:15px; padding:5px 12px; margin:0; }
.chips { display:flex; flex-wrap:wrap; gap:6px; margin:4px 0; }
.chip { font-size:12.5px; padding:3px 8px; border:2px solid var(--blue); border-radius:12px; background:var(--bg); color:var(--fg);
  max-width:100%; overflow-wrap:anywhere; text-align:left; }
form.search { display:flex; gap:6px; margin:6px 0; }
form.search input { flex:1 1 auto; min-width:0; width:auto; font-size:16px; padding:6px; margin:0; display:inline-block; }
/* the Master's review of step 2: a compact path table; folded path blocks */
section.pt table { font-size:12.5px; } section.pt td, section.pt th { padding:3px 4px; }
section.pt td:first-child { color:var(--muted); width:1.6em; } section.pt .st { font-weight:600; }
details.fold.path { padding:4px 10px; margin:6px 0; } details.fold.path > summary { font-size:14px; }
.chart.xtall { height:500px; }
/* step 3 (B-20261114-32): the controls */
form textarea, form select { display:block; width:100%; font-size:16px; padding:8px; margin-top:4px; font-family:inherit; }
details.ctlf { margin:6px 0; } details.ctlf > summary { cursor:pointer; color:var(--blue); font-weight:600; }
.ctlf .btns { display:flex; flex-wrap:wrap; gap:6px; } .ctlf .btns button { margin:0; font-size:15px; padding:7px 12px; }
.ctlf button.alt { background:var(--card); }
.ctlf.mark { border-top:1px solid var(--line); margin-top:8px; padding-top:4px; }
form.inline { margin:0; } form.inline button { font-size:14px; padding:5px 10px; margin:0; }
.mk { display:inline-block; font-size:11px; font-weight:700; padding:1px 6px; border-radius:8px; }
.mk.more { background:var(--blue); color:#fff; } .mk.park { background:var(--muted); color:#fff; }
.typed { white-space:pre-wrap; overflow-wrap:anywhere; }
section.confirm { border-left:4px solid var(--warn); }
table.log td { font-size:12px; }
/* the account block (D-0366): when | what and its detail | amount; no side scroll at phone width */
table.acct td:first-child { white-space:nowrap; } table.acct td:last-child, table.acct th:last-child { text-align:right; white-space:nowrap; }