.market-snapshot {
  --market-ink: var(--text, #183c33);
  --market-sub: var(--sub, #567267);
  --market-rule: var(--border, #dce6df);
  --market-surface: var(--card, #fff);
  --market-soft: #f4f0e4;
  margin: 28px 0;
  padding: 22px 24px;
  color: var(--market-ink);
  background: var(--market-surface);
  border: 1px solid var(--market-rule);
  border-radius: 10px;
  scroll-margin-top: 20px;
}
#ward-page .market-snapshot {
  --market-ink: var(--km-ink);
  --market-sub: var(--km-sub);
  --market-rule: var(--km-rule);
  --market-surface: var(--km-surface);
  --market-soft: var(--km-soft);
  margin: 24px 20px;
}
.market-snapshot-heading { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 8px 20px; }
.market-snapshot h2 { margin: 0; font-size: 18px; color: inherit; }
.market-snapshot-heading p { margin: 0; font-size: 12px; color: var(--market-sub); }
.market-snapshot-summary { margin: 14px 0 18px; line-height: 1.9; }
.market-scroll-hint { display: none; }
.market-table-scroll { overflow-x: auto; border: 1px solid var(--market-rule); border-radius: 6px; }
.market-snapshot table { width: 100%; min-width: 540px; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.market-snapshot caption { padding: 10px 14px; text-align: left; font-size: 12px; color: var(--market-sub); }
.market-snapshot th, .market-snapshot td { position: static; padding: 10px 14px; border: 0; border-bottom: 1px solid var(--market-rule); text-align: right; white-space: nowrap; }
.market-snapshot thead th { font-size: 12px; color: var(--market-ink); background: var(--market-soft); }
.market-snapshot th:first-child { text-align: left; }
.market-snapshot tbody th { font-size: 14px; font-weight: 500; color: inherit; background: transparent; }
.market-snapshot tbody tr { cursor: auto; }
.market-snapshot tbody tr:hover > * { background: var(--market-soft); }
.market-snapshot tbody tr:last-child > * { border-bottom: 0; }
.market-snapshot a { color: inherit; text-underline-offset: 3px; }
.market-snapshot a:hover { text-decoration-thickness: 2px; }
.market-snapshot-note { margin: 14px 0 0; color: var(--market-sub); font-size: 12px; line-height: 1.8; }
.market-list-link { display: inline-block; color: inherit; font-size: 12px; margin: 8px 0; text-underline-offset: 3px; }
#ward-page .market-list-link { margin: 0 20px 16px; }
@media (max-width: 600px) {
  .market-snapshot { padding: 18px 14px; }
  #ward-page .market-snapshot { margin: 20px 12px; }
  .market-snapshot h2 { font-size: 16px; }
  .market-snapshot-summary { font-size: 13px; }
  .market-scroll-hint { display: block; margin: 0 0 8px; color: var(--market-sub); font-size: 11px; }
}
