/* SUBJECT opening — editorial market ledger. Kept separate from the live terminal styles. */
.hero {
  min-height: 100dvh;
  align-items: start;
  padding: clamp(118px, 15vh, 170px) 0 48px;
  background:
    linear-gradient(90deg, rgba(9,10,10,.18) 0%, rgba(9,10,10,.10) 62%, transparent 100%);
}
.hero .wrap { width: 100%; }
.hero-heading {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
}
.hero-title { min-width: 0; }
.hero .eyebrow {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
  color: #aeb1ac;
  letter-spacing: .15em;
}
.hero-index {
  color: #f1f0eb;
  border: 1px solid #747873;
  padding: 2px 6px;
  font-size: 9px;
  letter-spacing: .08em;
}
.hero .word {
  margin: 12px 0 18px;
  max-width: 100%;
  font-size: clamp(68px, 11.5vw, 158px);
  letter-spacing: .045em;
  line-height: .92;
}
.hero .lede {
  max-width: 54ch;
  color: #d0d1cc;
  font-size: clamp(16px, 1.7vw, 20px);
  line-height: 1.55;
  letter-spacing: -.015em;
}
.summary-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-top: 1px solid #373a38;
  padding-top: 11px;
  color: #e6e7e1;
  font: 10px/1.5 var(--mono);
  letter-spacing: .045em;
  text-transform: uppercase;
}
.summary-link:hover { color: #fff; }

.hero .hero-row {
  display: grid;
  grid-template-columns: 1.25fr 1.25fr repeat(3, .7fr) minmax(160px, 1.4fr);
  gap: 0;
  margin-top: clamp(42px, 7vw, 78px);
  border-top: 1px solid #626660;
  border-bottom: 1px solid #373a38;
}
.hero .hs {
  min-width: 0;
  margin: 0;
  padding: 13px 14px 14px 0;
  border: 0;
  border-right: 1px solid #303330;
}
.hero .hs + .hs { padding-left: 14px; }
.hero .hs:last-child { border-right: 0; }
.hero .hs .k { font-size: 9px; letter-spacing: .105em; }
.hero .hs b {
  display: block;
  min-width: 0;
  overflow: hidden;
  color: #f0f0eb;
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.hero .hs #h-state { text-transform: lowercase; }
.hero .hs #h-addr { font-size: 10px; }

.hero-reading {
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-top: 22px;
  border: 1px solid #343735;
  background: rgba(12,13,13,.83);
}
.hero-summary {
  min-width: 0;
  display: grid;
  grid-template-rows: auto auto minmax(62px, 1fr) auto;
  padding: 18px 21px 15px;
}
.hero-summary + .hero-summary { border-left: 1px solid #343735; }
.summary-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  min-height: 16px;
}
.summary-top .k { font-size: 9px; letter-spacing: .12em; }
.summary-mark {
  color: #aeb2ac;
  font: 15px/1 var(--mono);
}
.hero-summary h2 {
  margin: 13px 0 8px;
  color: #f0f0eb;
  font-size: 22px;
  font-weight: 500;
  letter-spacing: -.035em;
}
.summary-mount {
  min-height: 60px;
  display: block;
  gap: 11px;
  color: #aeb2ac;
  font-size: 12px;
}
.summary-mount p { max-width: 37ch; }
.summary-empty-mark {
  color: #777b75;
  font: 16px var(--mono);
}
.hero-summary .summary-link { margin-top: 10px; }
.hero-last {
  grid-column: 1 / -1;
  min-width: 0;
  display: grid;
  grid-template-columns: 110px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 46px;
  padding: 7px 20px;
  border-top: 1px solid #343735;
}
.hero-last .k { font-size: 9px; }
.hero-last .mono {
  min-width: 0;
  overflow: hidden;
  color: #e0e1db;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.last-caret {
  width: 6px;
  height: 13px;
  background: #c4c7c0;
  opacity: .65;
}

.hero-bottom {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 20px;
  margin-top: 22px;
}
.hero .hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 24px;
  margin: 0;
}
.hero .hero-actions a {
  padding: 8px 0;
  border-bottom: 1px solid #626660;
  color: #eeefea;
  font: 10px/1.3 var(--mono);
  letter-spacing: .075em;
  text-transform: uppercase;
}
.hero .hero-actions a:hover { border-color: #e2e3dd; }
.hero .cue {
  margin: 0;
  font: 10px/1.5 var(--mono);
  letter-spacing: .035em;
}

/* A quiet, inline code-style prelude; the controller may replace its lines. */
.opening-terminal {
  width: min(var(--wrap), 100%);
  margin: 0 0 22px;
  padding: 14px 16px;
  border: 1px solid #373a38;
  background: rgba(9,10,10,.8);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  color: #9fa39d;
  font: 9px/1.5 var(--mono);
}
.opening-lines {
  min-width: 0;
  min-height: 42px;
  white-space: pre-wrap;
  font-size: 11px;
}
.opening-prompt { color: #e1e2dc; }
.landing-code-line { color: #aaaea8; }
.opening-separator { color: #626761; }
.opening-skip {
  flex: 0 0 auto;
  border: 1px solid #454945;
  padding: 6px 9px;
  color: #d0d2cc;
  font: 9px/1.4 var(--mono);
  letter-spacing: .025em;
}
.opening-skip:hover { border-color: #aeb2ac; color: #fff; }
.opening-skip:focus-visible { outline: 2px solid #e4e5df; outline-offset: 3px; }

.landing-token {
  display: flex;
  width: 100%;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  border-top: 1px solid #303330;
  padding: 9px 0;
  color: #e5e6e0;
  text-align: left;
  font: 11px/1.4 var(--mono);
}
.landing-token:first-child { border-top: 0; }
.landing-token-symbol { color: #f0f0eb; }
.landing-token-symbol { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.landing-token:hover { background: rgba(255,255,255,.035); }
.landing-token:focus-visible { outline: 2px solid var(--ink); outline-offset: 3px; }
.landing-token-value { color: #c1c4bd; font-variant-numeric: tabular-nums; }
.landing-token-change { color: #aeb2ac; font-variant-numeric: tabular-nums; }
.landing-summary { color: #bfc2bc; font-size: 12px; line-height: 1.6; }
.landing-token-change.up { color: var(--up); }
.landing-token-change.dn { color: var(--dn); }
.landing-session-time { font: 10px var(--mono); color: var(--ink2); }
.landing-session-stats { display: flex; gap: 28px; margin: 10px 0; }
.landing-session-stat { display: grid; gap: 2px; }
.landing-session-stat b { font: 20px var(--mono); color: var(--ink); }
.landing-session-stat span { font: 9px var(--mono); color: var(--dim); text-transform: uppercase; }
#landing-intro[hidden] { display: none; }

@media (max-width: 900px) {
  .hero { padding-top: 112px; }
  .hero .word { font-size: clamp(66px, 11vw, 108px); }
  .hero .hero-row { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .hero .hs:nth-child(3) { border-right: 0; }
  .hero .hs:nth-child(n+4) { border-top: 1px solid #303330; }
  .hero .hs:nth-child(4) { padding-left: 0; }
  .hero .hs:nth-child(5), .hero .hs:nth-child(6) { padding-left: 14px; }
}
@media (max-width: 640px) {
  .hero {
    min-height: 100dvh;
    padding: 104px 0 34px;
  }
  .hero .eyebrow { font-size: 9px; }
  .hero .word {
    margin: 16px 0 15px;
    font-size: clamp(52px, 14.8vw, 86px);
    letter-spacing: .025em;
  }
  .hero .lede { max-width: 34ch; font-size: 16px; }
  .hero .hero-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 32px;
  }
  .hero .hs { padding: 11px 10px 12px 0; }
  .hero .hs + .hs { padding-left: 10px; }
  .hero .hs:nth-child(odd) { padding-left: 0; border-right: 1px solid #303330; }
  .hero .hs:nth-child(even) { border-right: 0; }
  .hero .hs:nth-child(n+3) { border-top: 1px solid #303330; }
  .hero .hs:nth-child(3), .hero .hs:nth-child(5) { padding-left: 0; }
  .hero .hs:nth-child(4), .hero .hs:nth-child(6) { padding-left: 10px; }
  .hero-reading { grid-template-columns: 1fr; margin-top: 15px; }
  .hero-summary { padding: 16px; }
  .hero-summary + .hero-summary { border-left: 0; border-top: 1px solid #343735; }
  .hero-summary h2 { margin-top: 9px; }
  .summary-mount { min-height: 45px; }
  .hero-last {
    grid-template-columns: 80px minmax(0, 1fr) auto;
    gap: 8px;
    padding: 8px 12px;
  }
  .hero-last .mono { font-size: 10px; }
  .hero-bottom { align-items: flex-start; flex-direction: column; gap: 14px; }
  .hero .hero-actions { gap: 9px 18px; }
  .hero .hero-actions a { font-size: 9px; }
  .opening-terminal {
    align-items: flex-start;
    flex-direction: column;
    gap: 10px;
    margin-top: 21px;
    padding-inline: 28px;
  }
  .opening-lines { gap: 5px 8px; font-size: 8px; }
  .opening-skip { padding: 7px 9px; }
}
@media (prefers-reduced-motion: reduce) {
  .hero *, .opening-terminal * { scroll-behavior: auto; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}