/* rates-page.css — the Rate Index as "The Financial Page" (Vera, Sep 28
   2026): a broadsheet's market listings. Typography and hairline rules only;
   the live table and sliders (rates.mjs) are untouched. */
.rates .nameplate { text-align: center; margin-bottom: 56px; }
.nameplate__rule { border-top: 1px solid rgba(236,238,244,.7); border-bottom: 1px solid rgba(236,238,244,.7); height: 4px; }
.nameplate__name { font: 480 clamp(44px, 7vw, 92px)/1.05 var(--display); letter-spacing: -.01em; margin-top: 18px; }
.nameplate__date { display: flex; justify-content: center; flex-wrap: wrap; border-top: 1px solid rgba(236,238,244,.4); border-bottom: 1px solid rgba(236,238,244,.4); margin-top: 14px; }
.nameplate__date span { font: 500 12px var(--mono); letter-spacing: .08em; text-transform: uppercase; color: #9AA3B7; padding: 8px 18px; }
.nameplate__date span + span { border-left: 1px solid rgba(236,238,244,.3); }
.js-rules .nameplate__rule, .js-rules .nameplate__date { transform-origin: left; animation: rule 600ms ease both; }
@keyframes rule { from { transform: scaleX(0); } to { transform: none; } }

/* the broadsheet: the listings page itself */
.broadsheet { background: #F4F1EA; color: #1A1D2B; padding: 30px clamp(18px, 3vw, 40px) 36px; border-top: 3px solid #1A1D2B;
  --ink: #1A1D2B; --ink-soft: #5E6477; --navy: #1A1D2B; --rule: #D8D4CA; --rule-strong: #1A1D2B; --on-band: #1A1D2B; --on-band-soft: #5E6477; --band-rule: #D8D4CA; }
.broadsheet a { color: #1A1D2B !important; border-bottom-color: rgba(26,29,43,.4) !important; }
.broadsheet__head { display: flex; justify-content: space-between; font: 600 12px var(--mono); letter-spacing: .14em; text-transform: uppercase; padding-bottom: 10px; border-bottom: 1px solid #1A1D2B; }
.broadsheet__kick { font: 480 22px var(--display); margin: 22px 0 10px; }
.broadsheet .dial--wide { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 40px; padding: 14px 0 18px; border-bottom: 2px solid #1A1D2B; }
.broadsheet .dial--wide[hidden] { display: none; }
.broadsheet .field--dial label { display: flex; justify-content: space-between; align-items: baseline; font: 480 15px var(--body); color: #1A1D2B; }
.broadsheet .dial__out { font: 500 24px var(--mono); color: #1A1D2B; }
.broadsheet input[type="range"] { -webkit-appearance: none; appearance: none; width: 100%; height: 1px; background: #1A1D2B; border: 0; margin-top: 14px; }
.broadsheet input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; width: 16px; height: 16px; background: #1A1D2B; border-radius: 0; cursor: grab; }
.broadsheet input[type="range"]::-moz-range-thumb { width: 16px; height: 16px; background: #1A1D2B; border: 0; border-radius: 0; }
.broadsheet .dial__note { grid-column: 1 / -1; font-size: 13px; color: #5E6477; }
.broadsheet .table-frame { border: 0; background: none; margin-top: 18px; }
.broadsheet .ledger { background: none; }
.broadsheet .ledger caption { font: 400 13px var(--body); color: #5E6477; text-align: left; padding-bottom: 12px; }
.broadsheet .ledger th { font: 600 11px var(--mono); letter-spacing: .1em; text-transform: uppercase; color: #1A1D2B; border-bottom: 1px solid #1A1D2B; }
.broadsheet .ledger td, .broadsheet .ledger th[scope="row"] { color: #1A1D2B; border-bottom: 1px solid #E0DCD1; }
.broadsheet .ledger td.num, .broadsheet .ledger--index td { font-family: var(--mono) !important; font-weight: 500 !important; font-variant-numeric: tabular-nums; }
.broadsheet .ledger--index tbody tr:last-child th, .broadsheet .ledger--index tbody tr:last-child td { font-style: italic; border-top: 1px dashed #1A1D2B; font-family: var(--body) !important; }
.broadsheet .microcopy, .broadsheet .scope-note { color: #5E6477; font-size: 12.5px; }
.broadsheet__note-k { font: 600 11px var(--mono); letter-spacing: .14em; text-transform: uppercase; margin-top: 30px; padding-top: 16px; border-top: 1px solid #1A1D2B; }
.broadsheet .callout, .broadsheet__note { border: 0 !important; background: none !important; padding: 0 !important; margin-top: 8px; font: 400 18px/1.55 var(--body); color: #1A1D2B; max-width: 42em; }
.broadsheet .is-fresh { animation: none; background-image: linear-gradient(#1A1D2B, #1A1D2B); background-size: 100% 1px; background-position: 0 100%; background-repeat: no-repeat; }
.rates .flip { transition: transform 250ms cubic-bezier(.2,.8,.2,1); }

/* not listed */
.kick-row { font: 600 12px var(--mono); letter-spacing: .14em; text-transform: uppercase; color: #F08A91; margin-bottom: 10px; }

/* between the lines: the four hidden lines, two by two. The site-wide
   .pillars li row (title column beside text, styles.css) is undone here:
   inside a grid cell it squeezed the text to one word a line. */
#cannot .pillars--cannot { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; border-top: 1px solid rgba(236,238,244,.4); margin: 36px 0; max-width: 64rem; }
#cannot .pillars--cannot li { display: block; background: none !important; border: 0 !important; border-bottom: 1px solid rgba(236,238,244,.25) !important; padding: 28px 32px 32px 0 !important; border-radius: 0 !important; }
#cannot .pillars--cannot li:nth-child(even) { border-left: 1px solid rgba(236,238,244,.25) !important; padding-left: 32px !important; padding-right: 0 !important; }
#cannot .pillars--cannot h3 { font: 480 19px/1.3 var(--display); margin: 0 !important; min-height: 0; }
#cannot .pillars--cannot p { color: #9AA3B7; font-size: 15px; line-height: 1.6; margin-top: 10px; max-width: 34em; }
@media (max-width: 860px) {
  .broadsheet .dial--wide { grid-template-columns: 1fr; }
  #cannot .pillars--cannot { grid-template-columns: minmax(0, 1fr); }
  #cannot .pillars--cannot li, #cannot .pillars--cannot li:nth-child(even) { border-left: 0 !important; padding: 22px 0 !important; }
  .nameplate__date span { padding: 6px 10px; font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) { .js-rules .nameplate__rule, .js-rules .nameplate__date { animation: none; } .rates .flip { transition: none; } }
.nameplate__name { color: #ECEEF4; }
.broadsheet input[type="range"] { height: 18px; background: transparent !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important; }
.broadsheet input[type="range"]::-webkit-slider-runnable-track { height: 1px; background: #1A1D2B; }
.broadsheet input[type="range"]::-moz-range-track { height: 1px; background: #1A1D2B; }
.broadsheet input[type="range"]::-webkit-slider-thumb { margin-top: -8px; }
.broadsheet .ledger tbody th, .broadsheet .ledger tbody th .muted { text-transform: none !important; letter-spacing: 0 !important; font: 500 14px var(--body) !important; }
.broadsheet .ledger tbody th .muted { font-weight: 400 !important; font-size: 12.5px !important; color: #5E6477; display: block; }
@media (max-width: 380px) {
  .masthead__inner:has(.topnav) { padding-left: 14px; padding-right: 14px; column-gap: 6px; }
  .topnav .pill { padding-left: 10px; padding-right: 10px; }
}