/* /retrospecto — «Carreiras em Revista»; builds on corridas.css + components. */

/* big edition number (signature: mono figure on the sheet) */
.rtop__n, .rone__n { margin: 0; font-weight: 600; letter-spacing: -.07em; line-height: .8; color: var(--color-brand); display: flex; align-items: flex-start; gap: 6px; }
.rtop__n small, .rone__n small { font-size: 16px; letter-spacing: 0; color: var(--color-muted); font-weight: 500; margin-top: 8px; }
.rtop__n { font-size: clamp(5rem, 3rem + 6vw, 9rem); }

/* latest edition */
.rtop__main { grid-column: 1 / 9; padding: 30px 32px; display: flex; flex-direction: column; gap: 22px; }
.rtop__photo { grid-column: 9 / 13; margin: 0; display: flex; flex-direction: column; }
.rtop__photo picture { flex: 1; display: block; }
.rtop__photo img { width: 100%; height: 100%; min-height: 280px; object-fit: cover; object-position: 74% 50%; }
.rtop__photo figcaption { padding: 12px 20px 14px; font-size: 14px; color: var(--color-muted); border-top: 1px solid var(--color-border); }
.rtop__head { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px 28px; align-items: end; padding-bottom: 20px; border-bottom: 1px solid var(--color-text); }
.rtop__head .tile__h { font-size: clamp(1.4rem, 1.1rem + 1vw, 2rem); margin-bottom: 14px; }
.rtop__nums { display: grid; grid-template-columns: repeat(3, auto); justify-content: start; gap: 0; margin: 0; }
.rtop__nums div { padding: 0 18px; border-left: 1px solid var(--color-border); }
.rtop__nums div:first-child { padding-left: 0; border-left: 0; }
.rtop__nums dt { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--color-muted); }
.rtop__nums dd { margin: 0; font-family: var(--font-mono); font-size: 22px; font-weight: 600; letter-spacing: -.03em; }
.rtop__form caption { padding-bottom: 8px; }
.rtop__form .num .oct { background: var(--color-brand); }
.rtop__form td.horse a { text-decoration: none; }
.rtop__form td.horse a:hover { text-decoration: underline; }
.rtop__cta { margin-top: auto; }

/* archive */
.rarch { margin: 0; padding: 0; background: var(--color-surface); border: 1px solid var(--color-border); border-top: 2px solid var(--color-text); }
.rarch__i { display: grid; grid-template-columns: 112px minmax(0, 1fr) auto auto; gap: 12px 24px; align-items: center; padding: 12px 20px; border-bottom: 1px solid var(--color-border); transition: background-color var(--dur-fast); }
.rarch__i:last-child { border-bottom: 0; }
.rarch__i:hover { background: var(--color-surface-2); }
.rarch__n { display: inline-flex; align-items: baseline; gap: 4px; font-family: var(--font-mono); font-size: 34px; font-weight: 600; letter-spacing: -.05em; color: var(--color-brand); text-decoration: none; min-height: 44px; }
.rarch__n small { font-size: 12px; letter-spacing: 0; color: var(--color-muted); font-weight: 500; }
.rarch__n:hover { color: var(--color-brand-deep); text-decoration: underline; text-underline-offset: 4px; text-decoration-thickness: 2px; }
.rarch__d { display: flex; flex-direction: column; min-width: 0; }
.rarch__d b { font-weight: 600; font-size: 17px; letter-spacing: -.01em; }
.rarch__d small { font-size: 13px; color: var(--color-muted); }

/* detail: summary strip */
.rsum { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1px; margin: 0; background: var(--color-border); border: 1px solid var(--color-border); border-top: 2px solid var(--color-text); }
.rsum div { background: var(--color-surface); padding: 14px 18px; display: flex; flex-direction: column; gap: 6px; }
.rsum dt { font-family: var(--font-mono); font-size: 11px; letter-spacing: .12em; text-transform: uppercase; color: var(--color-muted); }
.rsum dd { margin: 0; font-size: 26px; font-weight: 600; letter-spacing: -.03em; }
.rsum dd .oct { --s: 48px; font-size: 16px; }
.rsum dd .lnk { font-size: 16px; letter-spacing: 0; min-height: 0; }

/* detail: one programme-sheet row per animal */
.rv { margin: 0; padding: 0; background: var(--color-surface); border: 1px solid var(--color-border); border-top: 2px solid var(--color-text); }
.rv__i {
  display: grid; grid-template-columns: 64px minmax(0, 1.3fr) minmax(0, 1.4fr) minmax(0, 1fr) 96px;
  gap: 12px 24px; align-items: start; padding: 18px 20px; border-bottom: 1px solid var(--color-border);
  transition: background-color var(--dur-fast);
}
.rv__i:last-child { border-bottom: 0; }
.rv__i:hover { background: var(--color-surface-2); }
.rv__i.is-win { background: var(--color-brand-tint); }
.rv__n { display: flex; flex-direction: column; align-items: center; gap: 6px; }
.rv__n .oct { --s: 48px; font-size: 20px; }
.rv__n .mono { font-size: 12px; color: var(--color-muted); }
.rv__horse { margin: 0; font-size: 21px; font-weight: 600; letter-spacing: -.03em; line-height: 1.1; overflow-wrap: anywhere; }
.rv__fil { margin: 6px 0 0; font-size: 15px; }
.rv__isp { margin: 4px 0 0; font-size: 12px; color: var(--color-muted); }
.rv__who, .rv__camp { margin: 0; display: grid; gap: 0; border-top: 1px solid var(--color-text); }
.rv__who div, .rv__camp div { display: grid; grid-template-columns: 104px 1fr; gap: 10px; padding: 5px 0; border-bottom: 1px solid var(--color-border); }
.rv__who dt, .rv__camp dt { font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--color-muted); padding-top: 2px; }
.rv__who dd, .rv__camp dd { margin: 0; font-size: 14px; font-weight: 500; }
.rv__camp div { grid-template-columns: 1fr; gap: 2px; }
.rv__res { display: flex; flex-direction: column; align-items: center; gap: 8px; text-align: center; }
.rv__res .kick { font-size: 10px; letter-spacing: .1em; }
.rv__pos .oct { --s: 52px; font-size: 18px; }
.rv__pos--t { font-size: 13px; font-weight: 600; padding: 6px 8px; border: 1px dashed var(--color-muted); }

/* detail: edition without transcription */
.rone { grid-column: 1 / 9; display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 20px 32px; align-items: start; padding: 30px 32px; }
.rone__n { font-size: clamp(4.5rem, 3rem + 4vw, 7rem); }
.rone__side { grid-column: 9 / 13; }
.rone__cta { margin-top: 18px; }
.rone__races { margin-top: 24px; }
.rback { margin: 12px 0 0; }

/* guide */
.rguide__main { grid-column: 1 / 9; padding: 28px 32px; }
.rguide__main .tile__h { margin-bottom: 18px; }
.rguide__txt { margin-top: 20px; max-width: 64ch; }
.rguide__txt p { margin: 0 0 12px; color: var(--color-muted); }
.rguide__txt b { color: var(--color-text); font-weight: 600; }
.rguide__side { grid-column: 9 / 13; display: flex; flex-direction: column; }
.rguide__side .tile__h { margin-bottom: 14px; }
.rguide__list { counter-reset: g; margin: 0 0 12px; padding: 0; border-top: 1px solid var(--color-text); }
.rguide__list li { counter-increment: g; display: grid; grid-template-columns: 30px 1fr; padding: 7px 0; border-bottom: 1px solid var(--color-border); font-size: 15px; }
.rguide__list li::before { content: counter(g, decimal-leading-zero); font-family: var(--font-mono); font-size: 12px; color: var(--color-accent); padding-top: 2px; }
.rguide__side .lnk { margin-top: auto; }

@media (max-width: 1279px) {
  .rtop__form thead { display: none; }
  .rtop__form, .rtop__form tbody, .rtop__form tr, .rtop__form td { display: block; width: 100%; }
  .rtop__form tr { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 4px 10px; padding: 12px 0; border-bottom: 1px solid var(--color-border); }
  .rtop__form td { border: 0 !important; padding: 0 !important; }
  .rtop__form td.num { grid-row: span 3; }
  .rtop__form td[data-label] { font-size: 14px; }
  .rtop__form td[data-label]::before { content: attr(data-label) " · "; font-family: var(--font-mono); font-size: 11px; letter-spacing: .1em; color: var(--color-muted); }
  .rv__i { grid-template-columns: 56px minmax(0, 1fr) minmax(0, 1fr) 88px; }
  .rv__h { grid-column: 2 / 4; }
  .rv__n { grid-row: span 2; }
  .rv__res { grid-column: 4; grid-row: 1 / span 2; }
  .rv__who { grid-column: 2; }
  .rv__camp { grid-column: 3; }
  .rtop__main { grid-column: 1 / 8; } .rtop__photo { grid-column: 8 / 13; }
}
@media (max-width: 899px) {
  .rtop__main, .rtop__photo, .rone, .rone__side, .rguide__main, .rguide__side { grid-column: 1 / -1; }
  .rtop__photo img { max-height: 340px; }
  .rsum { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .rsum div:last-child { grid-column: 1 / -1; }
  .rarch__i { grid-template-columns: 96px minmax(0, 1fr) auto; }
  .rarch__i .docs__act { grid-column: 2 / -1; }
}
@media (max-width: 759px) {
  .rtop__main, .rone, .rguide__main { padding: 22px 18px; }
  .rtop__head { grid-template-columns: 1fr; }
  .rtop__n { font-size: 5.5rem; }
  .rone { grid-template-columns: 1fr; }
  .rarch__i { grid-template-columns: 76px minmax(0, 1fr); padding: 12px 16px; gap: 8px 14px; }
  .rarch__n { font-size: 28px; }
  .rarch__s { grid-column: 2; }
  .rarch__s:empty { display: none; }
  .rarch__i .docs__act { grid-column: 1 / -1; }
  .rarch__i .docs__act .ibtn { flex: 1; }
  .rv__i { grid-template-columns: 48px minmax(0, 1fr) auto; padding: 16px; gap: 10px 12px; }
  .rv__n { grid-row: auto; }
  .rv__n .oct { --s: 44px; font-size: 17px; }
  .rv__h { grid-column: 2; }
  .rv__res { grid-column: 3; grid-row: 1; }
  .rv__pos .oct { --s: 44px; font-size: 15px; }
  .rv__who, .rv__camp { grid-column: 1 / -1; }
  .rv__horse { font-size: 18px; }
  .rsum dd { font-size: 22px; }
}