/* Отчёт о турнире: шапка на фирменном фоне, колонка текста ~68 знаков, оглавление слева на десктопе */

.rhero { position: relative; display: flex; align-items: flex-end; min-height: clamp(460px, 40vw, 600px); background: #15123a; color: #fff; overflow: hidden; }
.rhero-bg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 70% center; }
.rhero::before { content: ""; position: absolute; inset: 0; z-index: 1;
  background: linear-gradient(90deg, rgba(21, 18, 58, .95) 0%, rgba(21, 18, 58, .86) 38%, rgba(21, 18, 58, .45) 66%, rgba(21, 18, 58, .1) 88%),
              linear-gradient(0deg, rgba(21, 18, 58, .7) 0%, rgba(21, 18, 58, 0) 45%); }
.rhero-in { position: relative; z-index: 2; width: 100%; padding-top: 64px; padding-bottom: 52px; }
.rhero-in > * { max-width: 820px; }
.rhero-crumbs { font-size: 13px; color: rgba(255, 255, 255, .8); margin-bottom: 22px; }
.rhero-crumbs a { color: #fff; font-weight: 600; text-decoration: none; }
.rhero-crumbs a:hover { color: #fff; text-decoration: underline; }
.rhero-k { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 0; margin: 0; font: 600 13px/1.3 var(--font); letter-spacing: .08em; text-transform: uppercase; color: rgba(255, 255, 255, .92); }
.rhero-k > span:not(.rtag) + span::before { content: "·"; margin: 0 10px; color: rgba(255, 255, 255, .55); }
.rtag { display: inline-block; background: var(--red); color: #fff; padding: 6px 10px 5px; margin-right: 14px; letter-spacing: .1em; }
.rhero-t { font: 600 clamp(34px, 4.4vw, 58px)/1.06 var(--serif); letter-spacing: -.015em; margin: 18px 0 16px; color: #fff; overflow-wrap: break-word; hyphens: auto; }
.rhero-sub { font: 400 clamp(18px, 1.6vw, 22px)/1.4 var(--font); color: rgba(255, 255, 255, .9); margin: 0 0 24px; max-width: 48ch; }
.rhero-m { display: flex; flex-wrap: wrap; gap: 6px 0; margin: 0; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .25); font-size: 15px; color: rgba(255, 255, 255, .82); max-width: 620px; }
.rhero-m > span + span::before { content: "·"; margin: 0 10px; color: rgba(255, 255, 255, .5); }
.rhero-m b { color: #fff; font-weight: 600; }
.rhero-m a { color: #fff; font-weight: 600; text-decoration: none; border-bottom: 1px solid rgba(255, 255, 255, .6); }
.rhero-m a:hover { color: #fff; border-bottom-color: #fff; }

.rdraft { margin: 24px 0 0; padding: 12px 16px; border-left: 4px solid var(--warn); background: #fff6e5; color: var(--warn); font-weight: 600; }

/* Колонки: оглавление 250 px + текст 68 знаков */
.rwrap { display: grid; grid-template-columns: 250px minmax(0, 68ch); justify-content: center; gap: 72px; padding-top: 56px; padding-bottom: 24px; }
.rwrap.no-toc { grid-template-columns: minmax(0, 68ch); }
.rside-in { position: sticky; top: calc(var(--hdr) + 28px); }
.rtoc { border-top: 2px solid var(--ink); }
.rtoc-h { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; padding: 12px 0 10px; font: 600 12px/1.3 var(--font); letter-spacing: .1em; text-transform: uppercase; color: var(--ink2); cursor: default; list-style: none; }
.rtoc-h::-webkit-details-marker { display: none; }
.rtoc-list { list-style: none; margin: 0; padding: 0; }
.rtoc-list li { border-top: 1px solid var(--line); }
.rtoc-list a { display: grid; grid-template-columns: 26px minmax(0, 1fr); gap: 6px; padding: 10px 0; font-size: 15px; line-height: 1.35; color: var(--ink2); text-decoration: none; transition: color .15s; }
.rtoc-n { font: 600 13px/1.6 var(--font); color: var(--grey); }
.rtoc-list a:hover { color: var(--blue); }
.rtoc-list a.on { color: var(--ink); font-weight: 600; }
.rtoc-list a.on .rtoc-n { color: var(--red-ink); }

/* Текст */
.rbody { font-size: 19px; line-height: 1.68; color: var(--ink); overflow-wrap: break-word; min-width: 0; }
.rbody > p { margin: 0 0 1.05em; }
.rbody > p:first-child { font-size: 22px; line-height: 1.55; color: var(--ink); }
.rbody h3 { position: relative; font: 600 clamp(25px, 2.4vw, 31px)/1.18 var(--serif); letter-spacing: -.01em; margin: 1.9em 0 .7em; padding-top: 20px; scroll-margin-top: calc(var(--hdr) + 20px); }
.rbody h3::before { content: ""; position: absolute; left: 0; top: 0; width: 48px; height: 4px; background: var(--red); }
.rbody strong { font-weight: 600; }
/* Жирная строка над списком («За волю к победе», «Топ-5 клубов…») — подпись, а не раздел */
.rbody > p:has(> strong:only-child) { margin: 1.6em 0 .5em; font: 600 14px/1.4 var(--font); letter-spacing: .07em; text-transform: uppercase; color: var(--blue); }
.rbody > p:has(> strong:only-child) + p:has(> strong:only-child) { margin-top: 1.2em; }
.rbody ul { list-style: none; margin: 0 0 1.4em; padding: 0; border-top: 1px solid var(--ink); }
.rbody li { position: relative; padding: 11px 0 11px 26px; border-bottom: 1px solid var(--line); line-height: 1.45; }
.rbody li::before { content: ""; position: absolute; left: 4px; top: 1.15em; width: 8px; height: 8px; background: var(--red); }
.rnum { font-weight: 600; font-variant-numeric: tabular-nums lining-nums; }
.rclub { color: var(--blue); text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--blue) 35%, transparent); text-decoration-thickness: 1.5px; text-underline-offset: 4px; }
.rclub:hover { color: var(--blue-dark); text-decoration-color: currentColor; }

.rfoot { margin-top: 48px; padding-top: 24px; border-top: 2px solid var(--ink); }
.rfoot-by { margin: 0 0 18px; font-size: 15px; color: var(--ink2); }

/* Поделиться */
.rshare { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.rshare-h { flex-basis: 100%; font: 600 12px/1.3 var(--font); letter-spacing: .1em; text-transform: uppercase; color: var(--ink2); margin-bottom: 2px; }
.rshare-b { display: inline-flex; align-items: center; gap: 8px; min-height: 42px; padding: 8px 14px; border: 1px solid var(--line); background: var(--paper); color: var(--ink); font: 600 14px/1 var(--font); text-decoration: none; cursor: pointer; transition: border-color .15s, color .15s, background .15s; }
.rshare-b:hover { border-color: var(--ink); color: var(--ink); }
.rshare-b.is-vk .ico { color: #0077ff; }
.rshare-b.is-tg .ico { color: #229ed9; }
.rshare-b.is-copy .ico { color: var(--blue); }
.rshare-b.is-done { border-color: var(--ok); color: var(--ok); }
.rshare-side { margin-top: 28px; }
.rshare-side .rshare-b { flex: 1 1 100%; justify-content: flex-start; }

.rtour { display: grid; gap: 4px; margin-top: 28px; padding: 18px 20px; border: 1px solid var(--line); border-left: 4px solid var(--blue); color: inherit; text-decoration: none; }
.rtour:hover { border-color: var(--ink); border-left-color: var(--blue); color: inherit; }
.rtour-k { font: 600 12px/1.3 var(--font); letter-spacing: .1em; text-transform: uppercase; color: var(--blue); }
.rtour-t { font: 600 22px/1.2 var(--serif); }
.rtour-t::after { content: "\2009\2192"; font-weight: 400; color: var(--blue); }
.rtour-m { font-size: 15px; color: var(--ink2); }
.rmore { margin-top: 64px; }

@media (max-width: 1200px) and (min-width: 1024px) { .rwrap { grid-template-columns: 220px minmax(0, 68ch); gap: 48px; } }
@media (max-width: 1023px) {
  .rwrap { grid-template-columns: minmax(0, 1fr); gap: 0; padding-top: 28px; max-width: calc(68ch + 2 * var(--gut)); }
  .rside-in { position: static; }
  .rshare-side { display: none; }
  .rtoc { margin-bottom: 32px; border: 1px solid var(--line); border-top: 3px solid var(--ink); padding: 0 16px; }
  .rtoc-h { cursor: pointer; padding: 14px 0; font-size: 13px; }
  .rtoc-h::after { content: ""; width: 9px; height: 9px; margin-left: auto; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); transform: translateY(-3px) rotate(45deg); transition: transform .2s; }
  .rtoc[open] .rtoc-h::after { transform: translateY(2px) rotate(-135deg); }
  .rtoc-h .num { margin-left: 8px; margin-right: 12px; }
  .rtoc-list { padding-bottom: 6px; }
}
@media (max-width: 700px) {
  .rhero { display: block; min-height: 0; }
  .rhero-bg { display: block; position: relative; aspect-ratio: 16 / 10; }
  .rhero-bg img { object-position: 72% center; }
  .rhero::before { background: linear-gradient(180deg, rgba(21, 18, 58, .1) 0%, rgba(21, 18, 58, .55) 22%, rgba(21, 18, 58, .96) 34%); }
  .rhero-in { margin-top: -92px; padding-top: 0; padding-bottom: 28px; }
  .rhero-crumbs { margin-bottom: 14px; }
  .rhero-k { font-size: 12px; }
  .rtag { margin-right: 10px; }
  .rhero-t { font-size: 31px; margin: 14px 0 12px; }
  .rhero-sub { font-size: 19px; margin-bottom: 18px; }
  .rhero-m { font-size: 14px; padding-top: 14px; }
  .rbody { font-size: 18px; line-height: 1.58; }
  .rbody > p:first-child { font-size: 19px; }
  .rbody h3 { font-size: 24px; margin-top: 1.7em; padding-top: 16px; }
  .rbody li { padding-left: 22px; }
  .rshare-b { flex: 1 1 auto; justify-content: center; padding: 8px 10px; }
  .rshare-b span { font-size: 13px; }
  .rtour-t { font-size: 20px; }
  .rmore { margin-top: 48px; }
}
@media (prefers-reduced-motion: reduce) { .rtoc-list a, .rshare-b, .rtoc-h::after { transition: none; } }

/* ---------- Тёмная тема (data-theme="dark", см. app.css): светлые подложки плашек — тёмными оттенками ---------- */
[data-theme="dark"] .rdraft { background: rgba(240, 169, 74, .1); }