/* Live checker progress states. Kept apart from styles.css so parallel edits there do not collide. */
.run-progress-wrap { margin: 0 0 var(--space-5); }
.run-progress { width: 100%; height: 8px; appearance: none; border: 0; border-radius: var(--radius-full); background: var(--color-white); overflow: hidden; }
.run-progress::-webkit-progress-bar { background: var(--color-white); border-radius: var(--radius-full); }
.run-progress::-webkit-progress-value { background: var(--color-blue); border-radius: var(--radius-full); transition: width .3s ease; }
.run-progress::-moz-progress-bar { background: var(--color-blue); border-radius: var(--radius-full); }
.result-status { color: var(--color-gray-600); margin: var(--space-2) 0 0; }
.is-queued .result-img-empty { color: var(--color-gray-400, #9ca3af); }
.is-running .result-img-empty { color: var(--color-gray-900); gap: var(--space-3); grid-auto-flow: row; align-content: center; justify-items: center; }
.check-spinner {
  width: 28px; height: 28px; border-radius: var(--radius-full);
  border: 3px solid var(--color-header-border); border-top-color: var(--color-blue);
  animation: check-spin .8s linear infinite;
}
@keyframes check-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .check-spinner { animation-duration: 2.4s; } }
.feed-run { scroll-margin-top: 96px; margin-top: var(--space-6); border-top: 1px solid var(--color-header-border); padding-top: var(--space-5); }
.feed-run .result-status { margin-top: calc(-1 * var(--space-3)); }
.feed-run-count { color: var(--color-gray-600); margin: var(--space-1) 0 0; }
.feed-run[open] > summary { margin-bottom: var(--space-4); }
.feed-run > summary { cursor: pointer; list-style: none; display: grid; grid-template-columns: 1fr 20px; gap: var(--space-3); align-items: center; min-height: 44px; }
.feed-run > summary::-webkit-details-marker { display: none; }
.feed-run > summary::after { content: ""; box-sizing: border-box; width: 20px; height: 20px; align-self: start; border-right: 2px solid var(--color-gray-500); border-bottom: 2px solid var(--color-gray-500); transform: rotate(45deg) translateY(-3px); transition: transform .2s ease; }
.feed-run[open] > summary::after { transform: rotate(-135deg) translateY(-3px); }
@media (min-width: 861px) {
  /* Level name and prompt sit as a full-width header above the five cells. */
  /* A run has up to 23 columns: cells keep 120px and the run scrolls sideways. */
  .feed-run .result-grid { overflow-x: auto; overscroll-behavior-x: contain; }
  .feed-run .result-row { grid-template-columns: repeat(var(--cols, 5), minmax(120px, 1fr)); }
  .feed-run .result-row > .result-level { grid-column: 1 / -1; }
  .feed-run .result-head > .result-level { display: none; }
  .feed-run .prompt-level { font-size: var(--text-sm); line-height: 20px; white-space: nowrap; }
  .feed-run .result-head { display: none; }
  .feed-run .result-row { align-items: start; }
  .feed-run .result-img-empty { aspect-ratio: auto; min-height: 72px; }
  .feed-run .result-verdict { font-size: var(--text-sm); line-height: 20px; }
  .feed-run .result-cell::before { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}
.feed-run .result-cell::before { content: attr(data-model); display: block; padding: var(--space-2) var(--space-3) 0; font-size: var(--text-sm); color: var(--color-gray-500); }
.result-retry { margin-top: var(--space-3); padding: 6px 12px; font-size: var(--text-sm); min-height: 0; }
.feed-run-meta { margin: 0 0 var(--space-4); }
.feed-run-meta .method-link { display: inline-block; padding: 12px 0; margin: -12px 0; }
.feed-run-foot { color: var(--color-gray-600); margin: var(--space-3) 0 0; }
.feed-run img.result-img, .live-card img.result-img { display: block; width: 100%; aspect-ratio: 1; background: var(--color-gray-100); object-fit: cover; }
.feed-run-close { margin-top: var(--space-4); min-height: 44px; }
/* Live checks inside the Index pages */
.live-section { margin: var(--space-10) 0; }
.live-note { color: var(--color-gray-600); margin: var(--space-2) 0 var(--space-4); }
/* Live checks grid: one row per character, five levels */
.live-row { margin: 0 0 var(--space-6); }
.live-row-head { margin: 0 0 var(--space-3); color: var(--color-gray-900); }
.live-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: var(--space-3); align-items: stretch; }
.live-card { padding: var(--space-3); }
.live-card .result-img { border-radius: var(--radius-md); }
.live-card .result-cap { padding: var(--space-2) 0 0; }
.live-card figcaption { display: flex; flex-direction: column; }
.live-card .result-img { aspect-ratio: 1; background: var(--color-gray-100); }
.live-card .result-cap p { margin: 0; }
.live-card .result-verdict { font-size: var(--text-sm); line-height: 20px; white-space: nowrap; }
.live-card-level { color: var(--color-gray-500); margin-bottom: var(--space-1) !important; }
.live-card-top { color: var(--color-gray-600); margin-top: var(--space-1) !important; }
@media (max-width: 760px) {
  .live-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
  /* A refused cell is one row: model, then verdict. */
  .result-grid .result-cell[data-status="refused"] { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); padding: 10px 12px; min-height: 44px; }
  .result-grid .result-cell[data-status="refused"] > .result-img-empty { display: none; }
  .result-grid .result-cell[data-status="refused"] { flex-direction: row; flex-wrap: nowrap; text-align: left; }
  .result-grid .result-cell[data-status="refused"]::before { padding: 0; flex: 0 0 124px; width: auto; white-space: nowrap; }
  .result-grid .result-cell[data-status="refused"] > .result-cap { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); padding: 0; flex: 1 1 0; min-width: 0; }
  .result-grid .result-cell[data-status="refused"] .result-verdict { margin: 0; white-space: nowrap; }
}
/* Model page: latest live checks, five prompt types per row */
.model-checks .live-cards { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.model-checks .live-card .result-verdict { white-space: normal; }
.model-checks .result-img-empty { aspect-ratio: 1; border-radius: var(--radius-md); }
.model-checks .result-prompt { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.model-checks-more { min-height: 44px; }
@media (max-width: 760px) {
  .model-checks .live-cards { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 150px; overflow-x: auto; overscroll-behavior-x: contain; padding-bottom: var(--space-2); }
}
/* /check results grid. Scoped to #results so the Live checks feed keeps its own layout.
   Each prompt level is a header over one row of model cards. The row fills the width when
   five cards fit at 180px or more and scrolls sideways when they do not. */
@media (min-width: 1100px) {
  /* Wide screens: let the results use more than the 880px text column. */
  #results { margin-inline: calc(50% - min(620px, 50vw - var(--page-gutter) - 8px)); }
}
#results .result-grid { grid-template-columns: minmax(0, 1fr); }
#results .result-row.result-head { display: none; }
#results .result-row { display: block; }
#results .result-level { padding-top: 0; margin: 0 0 var(--space-2); }
#results .result-row + .result-row { margin-top: var(--space-4); }
#results .result-cells {
  display: grid; grid-auto-flow: column; grid-auto-columns: minmax(208px, 1fr); gap: var(--space-3);
  max-width: calc(var(--cols, 5) * 280px);
  overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x proximity; padding-bottom: var(--space-2);
}
#results .result-cell { display: flex; flex-direction: column; flex-wrap: nowrap; align-items: stretch; gap: 0; min-width: 0; min-height: 0; padding: 0; text-align: left; scroll-snap-align: start; }
#results .result-cell::before { content: attr(data-model); display: block; flex: none; width: auto; padding: var(--space-2) var(--space-3); font-size: var(--text-sm); line-height: 20px; color: var(--color-gray-500); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
#results .result-cell > .result-img, #results .result-cell > .result-img-link { grid-column: auto; }
#results .result-img, #results .result-img-empty { width: 100%; aspect-ratio: 1; box-sizing: border-box; }
#results .result-img-empty { display: grid; place-items: center; align-content: center; gap: var(--space-2); padding: var(--space-3); font-size: var(--text-sm); line-height: 20px; }
#results .result-cell[data-status="refused"] > .result-img-empty { display: grid; }
#results .check-spinner { width: 20px; height: 20px; border-width: 2px; }
#results .result-cap { flex: 1 1 auto; display: flex; flex-direction: column; flex-wrap: nowrap; align-items: flex-start; gap: 2px; padding: var(--space-3); min-width: 0; }
#results .result-cap p { max-width: 100%; }
#results .result-verdict { font-size: 15px; line-height: 20px; font-weight: var(--font-bold); margin: 0 !important; }
#results .result-det { font-size: var(--text-sm); line-height: 20px; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
#results .result-retry {
  margin-top: auto; padding: var(--space-2) 0 0; min-height: 32px; border: 0; background: none;
  font: inherit; font-size: var(--text-sm); line-height: 20px; font-weight: var(--font-medium);
  color: var(--color-blue); white-space: nowrap; cursor: pointer; text-align: left;
}
#results .result-retry:hover { text-decoration: underline; }
#results .result-retry:focus-visible { outline: 2px solid var(--color-blue); outline-offset: 2px; }
/* A refusal reason or extra matches stay readable on touch and keyboard: two lines, then the rest on demand. */
.feed-run .result-det, .live-card .result-det { overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.result-more { font-size: var(--text-sm); line-height: 20px; color: var(--color-gray-600); }
.result-more > summary { cursor: pointer; color: var(--color-blue); min-height: 24px; }
.result-more ul { margin: var(--space-1) 0 0; padding-left: var(--space-4); }
.result-note { color: var(--color-gray-600); }
/* Live checks: find a property; runs that do not count in the score say so. */
.feed-search { margin: 0 0 var(--space-4); max-width: 560px; }
.feed-run-note { color: var(--color-gray-600); margin: var(--space-1) 0 0; }
.model-checks .board-error, .detail-head .board-error { padding: var(--space-4) 0; text-align: left; }