.jockey-labels { margin: 2px 0 10px; font-size: 12px; line-height: 1.5; }
.jl-heading { display: block; margin-bottom: 3px; font-size: 10px; opacity: .7; }
.jl-item { margin: 3px 0; border: 1px solid rgba(100,116,139,.3); border-radius: 7px; overflow: hidden; }
.jl-item summary { padding: 5px 8px; cursor: pointer; background: rgba(100,116,139,.08); overflow-wrap: anywhere; }
.jl-item summary:focus-visible { outline: 2px solid #578bd3; outline-offset: -2px; }
.jl-condition { opacity: .8; font-size: 11px; }
.jl-summary-stats { display: block; padding-left: 13px; font-variant-numeric: tabular-nums; }
.jl-body { padding: 7px 9px; }
.jl-metrics { display: flex; flex-wrap: wrap; gap: 3px 12px; font-variant-numeric: tabular-nums; }
.jl-note { margin-top: 5px; opacity: .7; font-size: 10px; }
.jl-more > summary { padding: 4px 2px; cursor: pointer; font-size: 11px; opacity: .85; }
.jl-empty { display: block; font-size: 10px; opacity: .7; padding: 3px 0; }
.jl-more > summary:focus-visible { outline: 2px solid #578bd3; }
.cl-group { margin: 8px 0 10px; }
.cl-heading { margin: 0 0 4px; font-size: 11px; font-weight: 700; opacity: .8; }
.cl-fold > summary { cursor: pointer; padding: 4px 0; }
.cl-fold > summary:focus-visible { outline: 2px solid #578bd3; outline-offset: 2px; }
.cl-group .jockey-labels { margin: 0; }
.cl-row, .jl-item > summary.cl-row { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 3px 8px; padding: 7px 10px; margin: 4px 0; border-radius: 8px; font-size: 13px; line-height: 1.45; }
.cl-good, .jl-item > summary.cl-good { background: rgba(218,13,0,.08); --cl-accent: #c62318; }
.cl-bad, .jl-item > summary.cl-bad { background: rgba(55,97,187,.08); --cl-accent: #3761bb; }
.cl-mild-good, .jl-item > summary.cl-mild-good { background: rgba(180,99,12,.08); --cl-accent: #94520a; }
.cl-mild-bad, .jl-item > summary.cl-mild-bad { background: rgba(38,122,136,.08); --cl-accent: #267180; }
.cl-neutral { background: rgba(100,116,139,.08); --cl-accent: #637183; }
.cl-badge { padding: 1px 6px; border-radius: 4px; background: var(--cl-accent); color: white; font-size: 10px; font-weight: 700; white-space: nowrap; }
.cl-condition { min-width: 0; overflow-wrap: anywhere; }
.cl-record { color: var(--cl-accent); white-space: nowrap; font-variant-numeric: tabular-nums; font-size: 13.5px; }
.cl-returns { grid-column: 2 / -1; display: flex; flex-wrap: wrap; gap: 2px 12px; font-size: 11.5px; opacity: .85; font-variant-numeric: tabular-nums; }
.cl-returns b { font-weight: 600; }
.cl-returns .cl-dim { opacity: .7; margin-left: 6px; }
.cl-group .jf-item { border: 0; margin: 3px 0; border-radius: 6px; }
.jf-item > summary.cl-row { margin: 0; list-style: none; }
.jf-item > summary::-webkit-details-marker { display: none; }
.jf-item[open] > summary { border-radius: 6px 6px 0 0; }
.jf-item > .jl-body { border: 1px solid rgba(100,116,139,.2); border-top: 0; border-radius: 0 0 6px 6px; }
body.dark .cl-good { --cl-accent: #ff948b; }
body.dark .cl-bad { --cl-accent: #94b6ff; }
body.dark .cl-mild-good { --cl-accent: #edbd7c; }
body.dark .cl-mild-bad { --cl-accent: #83cad7; }
body.dark .cl-neutral { --cl-accent: #b9c5d5; }
body.dark .cl-badge { color: #171a25; }
.cl-missing-note { font-size: 10px; opacity: .65; margin-top: 2px; }
.cl-sub-heading { margin: 8px 0 2px; font-size: 11px; font-weight: 700; opacity: .75; }
.cl-link-sum { font-size: 11px; opacity: .85; margin: 0 0 3px; font-variant-numeric: tabular-nums; }
/* 馬と騎手: 縦並び（馬→騎手）。広い入れ物では2列にし、1行ずつ同じ高さでそろえる */
.cl-columns { display: flex; flex-direction: column; }
.cl-cell { min-width: 0; }
.cl-cell.cl-h { order: 1; }
.cl-cell.cl-j { order: 2; }
.cl-cell:empty { display: none; }
.cl-cell.cl-head { margin-top: 6px; }
.cl-cell.cl-j.cl-head { margin-top: 12px; }
.cl-cell > .cl-row, .cl-cell > .jl-item { margin: 4px 0; }
.cl-cell > .jl-more { margin: 2px 0; }
@container rp (min-width: 560px) {   /* 入れ物の内側の幅（余白を除く） */
  .cl-columns:not(.cl-single) { display: grid; grid-template-columns: 1fr 1fr; gap: 0 14px; align-items: stretch; }
  .cl-columns:not(.cl-single) .cl-cell.cl-h { grid-column: 1; order: 0; }   /* order を戻して DOM 順（馬・騎手が交互）で1行ずつ置く */
  .cl-columns:not(.cl-single) .cl-cell.cl-j { grid-column: 2; order: 0; }
  .cl-columns:not(.cl-single) .cl-cell:empty { display: block; }
  .cl-columns:not(.cl-single) .cl-cell.cl-j.cl-head { margin-top: 6px; }
  .cl-columns:not(.cl-single) .cl-cell { display: flex; flex-direction: column; }
  .cl-columns:not(.cl-single) .cl-cell > .cl-row, .cl-columns:not(.cl-single) .cl-cell > .jl-item { flex: 1; }
}
