/* R25 market surface: presentation only. Quotes, chart geometry, DOM order,
 * routing and the persistent Agent remain owned by the existing modules. */
.view-market-board {
  --mb-bg: #faf9fc;
  --mb-card: #fff;
  --mb-ink: #302c38;
  --mb-ink-2: #534d60;
  --mb-muted: #746d7e;
  --mb-faint: #827a8d;
  --mb-brand: #8050bc;
  --mb-up: #16816a;
  --mb-down: #c54461;
  --mb-flat: #827a8d;
  --mb-border: #e9e4ef;
  --mb-gray: #f6f3f9;
  background: var(--mb-bg);
}
.view-market-board .mb-wrap,
.main.with-ai-side .view-market-board .mb-wrap {
  width: 100%; max-width: 1280px; margin-inline: auto;
  padding: 4px 28px 48px; background: transparent;
}
.view-market-board .mb-page-head {
  align-items: center; padding: 22px 0 18px; gap: 8px 14px;
}
.view-market-board .mb-page-time {
  padding: 4px 9px; border-radius: 6px; background: #f1eef6;
}
.view-market-board .mb-search {
  height: 44px; margin-bottom: 8px; padding-inline: 16px;
  border-color: #e1dae9; border-radius: 12px;
  box-shadow: 0 2px 6px #30264003;
  transition: border-color .15s, box-shadow .15s;
}
.view-market-board .mb-search-icon { color: var(--mb-brand); stroke: currentColor; width: 18px; height: 18px; }
.view-market-board .mb-search:focus-within {
  border-color: #a98bc9; box-shadow: 0 0 0 3px #8050bc0c;
}
.view-market-board .mb-section { padding: 24px 0 4px; }
.view-market-board .mb-sec-head { margin-bottom: 12px; align-items: center; }
.view-market-board .mb-sec-title { display: flex; align-items: center; gap: 9px; }
.view-market-board .mb-sec-title::before {
  content: ''; width: 3px; height: 14px; border-radius: 3px;
  flex: none; background: #b092d0;
}
.view-market-board .mb-sec-footer { margin-top: 9px; padding-left: 2px; }
.view-market-board .mb-hot-grid,
.main.with-ai-side .view-market-board .mb-hot-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px;
}
.view-market-board .mb-etf {
  min-width: 0; padding: 12px 14px 10px;
  border: 1px solid var(--mb-border); border-radius: 12px;
  background: linear-gradient(145deg, #fff 48%, #faf8fd);
  box-shadow: 0 3px 12px #30264004;
}
.main.with-ai-side .view-market-board .mb-etf-head,
.view-market-board .mb-etf-head {
  display: block;
}
.view-market-board .mb-etf-name,
.main.with-ai-side .view-market-board .mb-etf-name {
  display: block; min-width: 0; overflow: hidden; white-space: nowrap;
  text-overflow: ellipsis; font-size: var(--type-body-size); line-height: var(--type-body-line);
}
.view-market-board .mb-etf-code { margin-top: 0; }
.view-market-board .mb-etf-quote {
  display: flex; align-items: center; justify-content: space-between; gap: 6px;
  margin-top: 6px; flex-wrap: wrap;
}
.view-market-board .mb-etf-price {
  margin: 0; font-size: var(--type-page-size); line-height: var(--type-page-line);
  font-weight: 600; letter-spacing: -.02em;
}
.view-market-board :is(.mb-etf-chg, .mb-focus-chg, .mb-tok-chg) {
  display: inline-flex; align-items: center; border-radius: 6px;
  padding: 3px 7px; font-size: var(--type-caption-size);
  line-height: var(--type-caption-line); font-weight: 500;
}
.view-market-board :is(.mb-etf-chg, .mb-focus-chg, .mb-tok-chg).mb-up { background: #eaf6f1; color: var(--mb-up); }
.view-market-board :is(.mb-etf-chg, .mb-focus-chg, .mb-tok-chg).mb-down { background: #fcf0f3; color: var(--mb-down); }
.view-market-board :is(.mb-etf-chg, .mb-focus-chg, .mb-tok-chg).mb-flat { background: #f2eff5; color: var(--mb-flat); }
.view-market-board .mb-etf-spark { margin-top: 6px; padding: 0; border-radius: 6px; }
.view-market-board .mb-etf:has(.mb-up) .mb-etf-spark { background: linear-gradient(180deg, transparent 20%, #eaf6f140); }
.view-market-board .mb-etf:has(.mb-down) .mb-etf-spark { background: linear-gradient(180deg, transparent 20%, #fcf0f340); }
.view-market-board .mb-etf-spark .mb-spark { width: 100%; height: 32px; }
.view-market-board .mb-etf:has(.mb-up) .mb-spark path { stroke: #27a58d; }
.view-market-board .mb-etf:has(.mb-down) .mb-spark path { stroke: #d15b75; }
.view-market-board .mb-focus-grid { gap: 12px; background: transparent; }
.view-market-board .mb-focus-cell,
.main.with-ai-side .view-market-board .mb-focus-cell:nth-child(n) {
  min-width: 0; padding: 16px 18px;
  border: 1px solid var(--mb-border); border-radius: 12px;
  background: #fff; transition: border-color .15s, background .15s;
}
.view-market-board .mb-focus-cell:hover,
.main.with-ai-side .view-market-board .mb-focus-cell:nth-child(n):hover { background: #fcfaff; border-color: #cbb6e0; }
.view-market-board .mb-focus-co { margin-top: 4px; }
.view-market-board .mb-focus-quote { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: 16px; }
.view-market-board .mb-focus-price { font-weight: 600; font-variant-numeric: tabular-nums; }
.view-market-board .mb-table-wrap { border: 1px solid var(--mb-border); border-radius: 12px; background: white; }
.view-market-board .mb-table th { padding: 12px 14px; background: #f5f2f9; border-bottom-color: var(--mb-border); }
.view-market-board .mb-table td { padding: 11px 14px; border-bottom-color: #f0ecf5; }
.view-market-board .mb-table tbody tr:nth-child(even) { background: #fcfbfe; }
.view-market-board .mb-table tbody tr:hover { background: #f6f1fc; }
.view-market-board .mb-table .mb-sec-sym { color: #57466b; }
.view-market-board .mb-kalshi-grid,
.main.with-ai-side .view-market-board .mb-kalshi-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.view-market-board .mb-kalshi-card { min-width: 0; padding: 18px; border: 1px solid var(--mb-border); border-radius: 14px; }
.view-market-board .mb-kalshi-brand { align-self: flex-start; color: var(--mb-brand); padding: 3px 8px; background: #f1eaf8; border-radius: 6px; margin-bottom: 12px; }
.view-market-board .mb-kalshi-q { flex: 1; overflow-wrap: anywhere; }
.view-market-board .mb-kalshi-labels { margin-top: 18px; }
.view-market-board .mb-kalshi-bar { height: 7px; border-radius: 5px; }
.view-market-board .mb-kalshi-meta { padding-top: 12px; margin-top: 14px; border-top: 1px solid #f0ecf5; gap: 7px; }
.view-market-board .mb-tok-list { border: 1px solid var(--mb-border); border-radius: 12px; overflow: hidden; }
.view-market-board .mb-tok-row { padding: 16px 18px; gap: 8px; }
.view-market-board .mb-tok-main { flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.view-market-board .mb-tok-sym { padding: 4px 8px; border-radius: 6px; background: #f1eaf8; color: #6e49b9; }
.view-market-board .mb-tok-sub { gap: 4px; }
.view-market-board .mb-openable:focus-visible { outline: 2px solid #9874c0; outline-offset: -3px; }
/* Width follows the actual right-hand workspace, not the outer browser. */
@container market-content (max-width: 719px) {
  .view-market-board .mb-hot-grid,
  .main.with-ai-side .view-market-board .mb-hot-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container market-content (min-width: 1120px) {
  .main.with-ai-side .view-market-board .mb-focus-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
}
@container market-content (max-width: 640px) {
  .main.with-ai-side .view-market-board .mb-wrap { padding-inline: 18px; }
  .view-market-board .mb-etf { padding: 12px 12px 10px; }
  .main.with-ai-side .view-market-board .mb-kalshi-grid { grid-template-columns: minmax(0, 1fr); }
}
@container market-content (max-width: 440px) {
  .view-market-board .mb-hot-grid { grid-template-columns: minmax(0, 1fr); }
  .main.with-ai-side .view-market-board :is(.mb-hot-grid, .mb-focus-grid) { grid-template-columns: minmax(0, 1fr); }
  .main.with-ai-side .view-market-board .mb-wrap { padding-inline: 14px; }
  .view-market-board .mb-page-time { overflow-wrap: anywhere; }
  .view-market-board .mb-tok-name { flex-basis: 55%; }
}
@media (prefers-reduced-motion: reduce) {
  .view-market-board :is(.mb-search, .mb-focus-cell) { transition: none; }
}
.mb-etf.mb-openable { cursor: pointer; transition: box-shadow .15s ease, background .15s ease; }
.mb-etf.mb-openable:hover { background: #faf8ff; box-shadow: inset 0 0 0 1px #d8cbea; }
.mb-etf.mb-openable:focus-visible { outline: 2px solid var(--am-brand-600, #7c3aed); outline-offset: 2px; }