.lr-grid { list-style: none; margin: 22px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 196px), 1fr)); gap: 16px; }
.lr-card { display: flex; min-width: 0; margin: 0; }
.lr-body {
flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; text-align: center;
padding: 26px 16px 24px; border-radius: var(--radius-lg); background: var(--panel); color: var(--paper-dim);
}
.honour-roll .lr-body { background: var(--panel-2); }
.lr-portrait {
display: block; flex: none; width: 124px; height: 124px; margin: 0 0 16px; padding: 3px; border-radius: 50%;
border: 2px solid var(--brand-gold); background: var(--panel); overflow: hidden;
}
.honour-roll .lr-portrait { background: var(--panel-2); }
.lr-portrait img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: center 25%; border-radius: 50%; }
.lr-medal { display: block; width: 100%; height: 100%; }
.lr-medal-disc { fill: #f1ede4; }
.lr-medal-rule { fill: none; stroke: var(--brand-gold); stroke-width: 1.25; }
.lr-medal-text { fill: var(--brand-crimson); font: 700 21px/1 var(--font-display); letter-spacing: .04em; }
.lr-medal-suit { font-size: 24px; }
.lr-name { display: block; max-width: 100%; color: var(--paper); font-size: 1.0625rem; font-weight: 600; line-height: 1.3; letter-spacing: -.01em; overflow-wrap: anywhere; }
.lr-stage { display: block; max-width: 100%; margin-top: 3px; color: var(--muted); font-size: .9rem; font-style: italic; line-height: 1.35; overflow-wrap: anywhere; }
.lr-honour { display: block; margin-top: 10px; color: var(--brass); font-size: .75rem; font-weight: 600; line-height: 1.4; letter-spacing: .06em; text-transform: uppercase; }
.lr-since { display: block; color: var(--muted); font-weight: 500; letter-spacing: .02em; text-transform: none; font-size: .8125rem; }
.lr-died { display: block; margin-top: 2px; color: var(--muted); font-size: .8125rem; }
.lr-more { display: block; margin-top: auto; padding-top: 12px; color: var(--link); font-size: .875rem; font-weight: 500; }
.lr-grid .lr-link { padding-block: 26px 24px; color: var(--paper-dim); text-decoration: none; transition: background-color .2s var(--ease); }
.lr-grid .lr-link:hover { background: var(--panel-2); text-decoration: none; }
.lr-grid .lr-link:hover .lr-more { text-decoration: underline; color: var(--link-hover); }
.lr-grid .lr-link:focus-visible { outline: 3px solid var(--focus); outline-offset: 3px; }
@media (max-width: 600px) {
.lr-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.lr-body, .lr-grid .lr-link { padding: 18px 8px 16px; }
.lr-portrait { width: 92px; height: 92px; margin-bottom: 12px; }
.lr-name { font-size: 1rem; }
.lr-stage { font-size: .85rem; }
}
@media (prefers-reduced-motion: reduce) { .lr-grid .lr-link { transition: none; } }
@media (prefers-contrast: more) {
.lr-body { border: 1px solid var(--line); }
.lr-stage, .lr-since, .lr-died { color: var(--paper-dim); }
.lr-portrait { border-width: 3px; }
}
@media (forced-colors: active) {
.lr-body { border: 1px solid CanvasText; }
.lr-grid .lr-link { border-color: LinkText; }
.lr-portrait { border-color: CanvasText; }
.lr-medal-disc { fill: Canvas; }
.lr-medal-rule { stroke: CanvasText; }
.lr-medal-text { fill: CanvasText; }
}