/* Projection-backed graded reference tables. This file deliberately does not
   inherit card-detail layout: game and set pages need a readable, no-JS table
   at every width, while each grade's history belongs on the card page. */
.graded-market-view-toggle {
  display: flex;
  gap: 18px;
  margin: 12px 0 20px;
}
.graded-market-view-toggle a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  color: var(--text-secondary);
  text-decoration: none;
}
.graded-market-view-toggle a[aria-current="page"] { color: var(--accent-amber); }
.graded-market-controls { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 0 0 22px; }
.graded-market-control { display: grid; gap: 5px; min-width: 0; }
.graded-market-control label { color: var(--text-muted); font-size: var(--fs-label); }
.graded-market-control input, .graded-market-control select {
  min-width: 0; width: 100%; max-width: 100%;
  min-height: 44px; padding: 0 10px; background: var(--bg-secondary); border: 1px solid var(--border);
  border-radius: var(--radius-md); color: var(--text-primary); font: inherit; font-size: var(--fs-input);
}
.graded-market-apply { min-height: 44px; padding: 0 16px; border-radius: var(--radius-md); background: var(--bg-secondary); border: 1px solid var(--border); color: var(--accent-amber); font-weight: 600; }
.graded-market-heading { display: flex; gap: 16px; justify-content: space-between; align-items: baseline; }
.graded-market-count { color: var(--text-muted); font-size: var(--fs-meta); white-space: nowrap; }
.graded-market-table { min-width: 1040px; }
.graded-market-table .graded-market-selected { color: var(--accent-amber); }
.graded-market-card-link { font-weight: 600; }
.graded-market-details { min-width: 210px; color: var(--text-secondary); font-size: var(--fs-meta) !important; overflow-wrap: anywhere; }
.graded-market-details span { display: block; margin-bottom: 3px; overflow-wrap: anywhere; }
.graded-market-capture-note { display: block; margin-top: 3px; color: var(--text-muted); font-family: var(--font-sans); font-size: var(--fs-label); text-align: right; }
.graded-market-mobile-label { display: none; }
.graded-market-directory { margin-top: 30px; }
.graded-market-directory-table { min-width: 720px; }
.graded-market-pagination { display: flex; align-items: center; gap: 16px; margin: 18px 0; color: var(--text-secondary); }
.graded-market-pagination a { display: inline-flex; align-items: center; min-height: 44px; color: var(--accent-amber); }
@media (max-width: 640px) {
  .graded-market-view-toggle { gap: 12px; margin-bottom: 16px; }
  .graded-market-controls { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
  .graded-market-control { min-width: 0; }
  .graded-market-control:first-child { grid-column: 1 / -1; }
  .graded-market-apply { width: 100%; }
  .graded-market-heading { display: block; }
  .graded-market-count { margin: 0 0 12px; }
  .graded-market-table { min-width: 0; }
  .graded-market-table, .graded-market-table tbody { display: block; }
  .graded-market-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
  .graded-market-table tbody tr { display: grid; grid-template-columns: 1fr 1fr; gap: 3px 10px; margin-bottom: 12px; padding: 12px; background: var(--zebra); border-radius: var(--radius-md); }
  .graded-market-table td { padding: 2px 0; }
  .graded-market-table td:first-child, .graded-market-table .graded-market-details { grid-column: 1 / -1; }
  .graded-market-table .graded-market-other-grade { display: none; }
  .graded-market-table .graded-market-selected { display: block; padding: 4px 0; }
  .graded-market-details { min-width: 0; margin-top: 5px; max-width: 100%; }
  .graded-market-mobile-label { display: block; color: var(--text-muted); font-family: var(--font-sans); font-size: var(--fs-label); text-align: left; }
  .graded-market-capture-note { text-align: left; }
}

.graded-market-percentage > summary { min-height: 44px; padding-block: 10px; cursor: pointer; }
