/* Lastleg: order-book register. Maroon near-black sampled from the supplied art.
   Contrast verified against #0f0e11: ink 16.07, muted 7.10, accent 5.25, win 7.42 */

:root{
  --surface:#0f0e11;
  --raised:#1b1619;
  --ink:#eceaeb;
  --muted:#a39b9f;
  --accent:#e05956;
  --win:#43b483;
  --rule:#2b2529;
  --rule-soft:#211c20;
  --sans:'Inter',system-ui,-apple-system,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  --wrap:70rem;
}

*{box-sizing:border-box}
img{display:block;max-width:100%;height:auto}
html{-webkit-text-size-adjust:100%}
body{
  margin:0;background:var(--surface);color:var(--ink);
  font-family:var(--sans);font-size:1rem;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 1.5rem}

a{color:var(--accent)}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* ---------- masthead: left lockup, no nav, rule carries live depth ---------- */
.mast{padding:1.5rem 0 0}
.mast__row{display:flex;align-items:center;gap:.6rem}
.mast__mark{width:52px;height:26px}
.mast__name{font-weight:650;letter-spacing:-.01em;font-size:1.05rem}
.mast__rule{
  margin-top:1rem;border-top:1px solid var(--rule);
  display:flex;justify-content:flex-end;
}
.depth{
  display:flex;gap:1.75rem;margin:0;padding:.6rem 0 0;
  font-family:var(--mono);font-size:.72rem;letter-spacing:.06em;
}
.depth div{display:flex;gap:.5rem;align-items:baseline}
.depth dt{color:var(--muted);text-transform:uppercase;margin:0}
.depth dd{margin:0;color:var(--ink)}
.depth .live{color:var(--win)}

/* ---------- hero: opposed price pair dominates, h1 is subordinate ---------- */
.hero{padding:3rem 0 3rem}
.versus{
  display:flex;align-items:stretch;gap:0;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
}
.versus__side{flex:1;padding:1.9rem 0}
.versus__side + .versus__side{border-left:1px solid var(--rule);padding-left:2.25rem}
.versus__label{
  font-family:var(--mono);font-size:.7rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);margin:0 0 .55rem;
}
.versus__fig{
  font-family:var(--mono);font-weight:500;line-height:1;margin:0;
  font-size:clamp(2.6rem, 1.4rem + 4.4vw, 4.6rem);letter-spacing:-.03em;
}
.versus__fig--book{color:var(--muted)}
.versus__fig--mkt{color:var(--win)}
.versus__note{margin:.6rem 0 0;font-size:.85rem;color:var(--muted)}
.versus__note b{color:var(--accent);font-weight:600}

.hero h1{
  font-size:clamp(1.3rem, 1rem + .9vw, 1.7rem);
  line-height:1.3;font-weight:650;letter-spacing:-.015em;
  margin:1.9rem 0 .7rem;max-width:34rem;
}
.hero p{margin:0;color:var(--muted);max-width:40rem}

/* leg pips */
.pips{
  display:flex;gap:.4rem;align-items:center;
  margin:0 0 2.1rem;padding:0;list-style:none;
}
.pips li{
  width:.8rem;height:.8rem;border-radius:50%;
  background:var(--win);flex:none;
}
.pips li.pending{background:transparent;border:2px solid var(--accent)}
.pips__txt{
  font-family:var(--mono);font-size:.7rem;color:var(--muted);
  letter-spacing:.1em;margin-left:.7rem;line-height:1;
}

/* ---------- generic section ---------- */
.sec{padding:3rem 0;border-top:1px solid var(--rule-soft)}
.sec__head{
  display:flex;justify-content:space-between;align-items:baseline;
  gap:1rem;margin:0 0 1.5rem;
}
.sec h2{font-size:1.18rem;font-weight:650;letter-spacing:-.01em;margin:0}
.sec__tag{
  font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;
  text-transform:uppercase;color:var(--muted);
}
.sec p{color:var(--muted);max-width:44rem}
.sec p b{color:var(--ink);font-weight:600}

/* ---------- bid ladder table ---------- */
table{width:100%;border-collapse:collapse;margin:0}
caption{
  text-align:left;font-family:var(--mono);font-size:.68rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--muted);
  padding-bottom:.7rem;
}
th{
  text-align:left;font-family:var(--mono);font-weight:400;
  font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--muted);padding:.55rem 0;border-bottom:1px solid var(--rule);
}
td{padding:.72rem 0;border-bottom:1px solid var(--rule-soft);font-size:.92rem}
.num{font-family:var(--mono);text-align:right;white-space:nowrap}
.bidder{font-family:var(--mono);font-size:.85rem}
.top{color:var(--win)}
.tag{
  font-family:var(--mono);font-size:.62rem;letter-spacing:.1em;
  color:var(--win);border:1px solid var(--win);border-radius:2px;
  padding:.1rem .35rem;margin-left:.5rem;
}
.tmore{
  font-family:var(--mono);font-size:.72rem;color:var(--muted);
  margin:.85rem 0 0;
}

/* ---------- object ---------- */
.object{margin:0;padding:3rem 0;border-top:1px solid var(--rule-soft)}
.object img{border:1px solid var(--rule);border-radius:10px}
.object figcaption{
  font-family:var(--mono);font-size:.72rem;color:var(--muted);
  margin-top:.9rem;letter-spacing:.03em;
}

/* ---------- roman settlement list ---------- */
.seq{list-style:none;counter-reset:s;margin:0;padding:0}
.seq li{
  counter-increment:s;display:grid;grid-template-columns:3.2rem 1fr;
  gap:1.25rem;padding:1.15rem 0;border-bottom:1px solid var(--rule-soft);
}
.seq li::before{
  content:counter(s,upper-roman);
  font-family:var(--mono);font-size:.78rem;color:var(--accent);
  letter-spacing:.06em;padding-top:.15rem;
}
.seq strong{display:block;font-weight:600;margin-bottom:.3rem;grid-column:2}
.seq span{color:var(--muted);font-size:.92rem;grid-column:2}

/* ---------- quote ---------- */
.quote{
  margin:2rem 0 0;padding:0 0 0 1.4rem;
  border-left:2px solid var(--accent);
  font-size:1.02rem;color:var(--ink);max-width:42rem;
}
.quote cite{
  display:block;margin-top:.8rem;font-style:normal;
  font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);
}

/* ---------- token ---------- */
.tok{display:grid;grid-template-columns:1.6fr 1fr;gap:3rem;align-items:start}
.tok p{margin:0 0 1rem}
.tok__split{list-style:none;margin:0;padding:0}
.tok__split li{
  display:flex;justify-content:space-between;align-items:baseline;
  padding:.6rem 0;border-bottom:1px solid var(--rule-soft);
  font-size:.88rem;
}
.tok__split span{color:var(--muted)}
.tok__split b{font-family:var(--mono);font-weight:500}

/* ---------- footer ---------- */
footer{border-top:1px solid var(--rule);padding:1.5rem 0 2.5rem;margin-top:1rem}
.footer__row{
  display:flex;justify-content:space-between;
  font-family:var(--mono);font-size:.72rem;color:var(--muted);
  letter-spacing:.06em;
}

code{font-family:var(--mono);font-size:.85em;color:var(--muted)}

@media (max-width:760px){
  .versus{display:block}
  .versus__side + .versus__side{
    border-left:0;border-top:1px solid var(--rule);padding-left:0;
  }
  .tok{grid-template-columns:1fr;gap:2rem}
  .depth{gap:1.1rem;flex-wrap:wrap}
  .sec__head{flex-direction:column;align-items:flex-start;gap:.3rem}
}
