/* Queue 947: League Rules shown as Discord-style cards (dashboard preview) and as headed, numbered
   sections (My Team, the league's public page). Sizes are the kit's seven: 12, 14, 16, 20, 24, 32, 48. */

/* ── Discord-style card (the live preview) ─────────────────────────────── */
.lrp-discord { display: flex; flex-direction: column; gap: 8px; padding: 16px; border-radius: 14px; background: #313338; min-width: 0; }
.lrp-card { --lrp-bar: #2ec22e; display: flex; max-width: 100%; min-width: 0; border-radius: 4px; background: #2b2d31; border-left: 4px solid var(--lrp-bar); color: #dbdee1; font-size: 14px; line-height: 1.4; overflow: hidden; }
.lrp-body { flex: 1 1 auto; min-width: 0; padding: 8px 16px 16px 12px; display: flex; flex-direction: column; gap: 8px; }
.lrp-author { font-size: 12px; color: #b5bac1; font-weight: 600; }
.lrp-main { display: flex; gap: 16px; align-items: flex-start; justify-content: space-between; min-width: 0; }
.lrp-text { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.lrp-title { font-size: 16px; font-weight: 700; color: #f2f3f5; margin-top: 8px; }
.lrp-desc { margin-top: 8px; }
.lrp-desc p { margin: 0 0 8px; }
.lrp-desc h2, .lrp-desc h3, .lrp-desc h4 { margin: 12px 0 4px; color: #f2f3f5; font-weight: 700; }
.lrp-desc h2 { font-size: 20px; }
.lrp-desc h3 { font-size: 16px; }
.lrp-desc h4 { font-size: 14px; }
.lrp-desc ol, .lrp-desc ul { margin: 0 0 8px; padding-left: 24px; }
.lrp-desc li { margin: 2px 0; }
.lrp-desc blockquote { margin: 0 0 8px; padding-left: 8px; border-left: 4px solid #4e5058; }
.lrp-desc code { background: #1e1f22; padding: 0 4px; border-radius: 3px; }
.lrp-desc .lrv-small { font-size: 12px; color: #b5bac1; }
.lrp-thumb { flex: 0 0 auto; width: 64px; height: 64px; object-fit: cover; border-radius: 4px; }
.lrp-image { display: block; width: 100%; max-height: 240px; object-fit: cover; border-radius: 4px; }
.lrp-footer { font-size: 12px; color: #b5bac1; }
.lrp-empty { margin: 0; color: #b5bac1; font-size: 14px; }
.lr-preview-count { font-size: 12px; text-transform: uppercase; letter-spacing: .05em; color: var(--muted, #8b95a3); margin: 0 0 8px; }
.lr-preview-notes { margin: 12px 0 0; padding: 0 0 0 20px; font-size: 14px; color: var(--muted, #8b95a3); }
.lr-preview-notes:empty { display: none; }

/* ── Read-only rulebook (My Team, public page) ─────────────────────────── */
.lrv { display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.lrv-section { border: 1px solid color-mix(in srgb, currentColor 18%, transparent); border-radius: 14px; padding: 16px 24px; min-width: 0; }
.lrv-head { margin: 0 0 12px; font-size: 20px; font-weight: 700; line-height: 1.2; display: flex; align-items: center; gap: 8px; }
.lrv-head::before { content: ""; flex: 0 0 4px; align-self: stretch; border-radius: 2px; background: var(--lrv-accent, #2ec22e); }
.lrv-body { font-size: 16px; line-height: 1.5; overflow-wrap: anywhere; }
.lrv-body p { margin: 0 0 12px; }
.lrv-body p:last-child, .lrv-body ol:last-child, .lrv-body ul:last-child { margin-bottom: 0; }
.lrv-body h2, .lrv-body h3, .lrv-body h4 { margin: 16px 0 8px; font-size: 16px; font-weight: 700; }
.lrv-body ol, .lrv-body ul { margin: 0 0 12px; padding: 0; list-style: none; counter-reset: lrv; display: flex; flex-direction: column; gap: 8px; }
.lrv-body li { position: relative; padding-left: 32px; min-height: 24px; }
.lrv-body ol > li { counter-increment: lrv; }
.lrv-body ol > li::before { content: counter(lrv); position: absolute; left: 0; top: 0; width: 24px; height: 24px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; background: color-mix(in srgb, var(--lrv-accent, #2ec22e) 22%, transparent); color: inherit; }
.lrv-body ul > li::before { content: ""; position: absolute; left: 9px; top: 9px; width: 6px; height: 6px; border-radius: 3px; background: var(--lrv-accent, #2ec22e); }
.lrv-body blockquote { margin: 0 0 12px; padding-left: 12px; border-left: 4px solid color-mix(in srgb, currentColor 25%, transparent); }
.lrv-body .lrv-small { font-size: 12px; opacity: .7; }
.lrv-body code { padding: 0 4px; border-radius: 4px; background: color-mix(in srgb, currentColor 12%, transparent); }
.lrv-empty { margin: 0; opacity: .75; }
.lrv-updated { margin: 0 0 12px; font-size: 14px; opacity: .75; }
@media (max-width: 640px) {
  .lrv-section { padding: 16px; }
  .lrp-thumb { width: 48px; height: 48px; }
  .lrp-discord { padding: 8px; }
}