/* Ретроградные планеты и затмения (pages/retro.py, pages/eclipses.py). Общие части — pages.css. */

.rt-wide { max-width: none; }
.rt-wide > p, .rt-wide > h2 { max-width: 72ch; }
.rt-now__h { font: 400 clamp(1.5rem, 2.4vw, 2rem)/1.15 var(--display); color: var(--title); }
.rt-now__say { margin-top: 18px; max-width: 68ch; line-height: 1.6; color: var(--ink); }
.pg-facts dd small { font: 400 .8rem/1 var(--text); color: var(--mute); }

/* таблицы периодов: вторая строка в ячейке — положение */
.rt-table td small, .rt-table th small { display: block; margin-top: 3px; font-size: .78rem; color: var(--mute); }
.rt-table th a, .rt-table td a { color: var(--glow-hi); text-decoration-color: rgba(255, 215, 114, .45); text-underline-offset: .2em; }
.rt-table td .r { color: var(--tense); }
/* закреплённая первая колонка: ячейка заголовка тоже стоит на месте при прокрутке вбок и лежит поверх строк;
   у строки «сейчас» фон непрозрачный, чтобы под закреплённой ячейкой не просвечивали соседние колонки */
.rt-table thead th:first-child { left: 0; z-index: 3; }
.rt-table tbody th { z-index: 2; }
.rt-table .is-now th { background: linear-gradient(rgba(255, 215, 114, .08), rgba(255, 215, 114, .08)), #0a1247; }
.rt-tag { display: inline-block !important; margin: 0 0 0 8px !important; padding: 2px 8px; border-radius: 999px; font-size: .7rem !important; line-height: 1.3;
  color: var(--on-glow) !important; background: var(--glow); vertical-align: 1px; }
.rt-tag--soft { color: var(--glow-hi) !important; background: rgba(255, 215, 114, .14); border: 1px solid rgba(255, 215, 114, .45); }

/* ретроградные сейчас */
.rt-list { margin-top: 18px; display: grid; gap: 10px; }
.rt-list li { display: grid; grid-template-columns: minmax(0, 8.5em) minmax(0, 1fr); gap: 2px 14px; align-items: baseline; padding: 14px 16px;
  border: 1px solid rgba(255, 215, 114, .22); border-radius: 16px; background: rgba(255, 255, 255, .03); color: var(--mute); }
.rt-list__name { font: 400 1.35rem/1.1 var(--display); color: var(--title); }
.rt-list strong { color: var(--ink); font-weight: 500; }
.rt-list small { grid-column: 2; font-size: .84rem; }

/* шкала года */
.rt-tl { margin: 22px 0 0; }
.rt-tl__months, .rt-tl__row { display: grid; grid-template-columns: 6.2em minmax(0, 1fr); gap: 10px; align-items: center; }
.rt-tl__months div { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); font: 400 .66rem/1 var(--mono); color: var(--mute); }
.rt-tl__months i { font-style: normal; padding-left: 2px; border-left: 1px solid var(--hair); }
.rt-tl__row { margin-top: 8px; }
.rt-tl__name { font-size: .88rem; color: var(--ink); }
.rt-tl__track { position: relative; height: 22px; border-radius: 6px; background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .045) 0 calc(100% / 12 - 1px), var(--hair) calc(100% / 12 - 1px) calc(100% / 12)); }
.rt-tl__track b { position: absolute; top: 3px; bottom: 3px; min-width: 3px; border-radius: 4px; background: linear-gradient(180deg, #dcc6ff, var(--tense)); box-shadow: 0 0 12px rgba(201, 169, 255, .45); }
.rt-tl__track em { position: absolute; top: -4px; bottom: -4px; width: 2px; margin-left: -1px; background: var(--glow); box-shadow: 0 0 10px rgba(255, 215, 114, .9); }
.rt-tl figcaption { margin-top: 12px; }

/* переходы по годам и по планетам */
.rt-years, .rt-jump { margin-top: 18px; display: flex; flex-wrap: wrap; gap: 10px; padding: 0; list-style: none; }
.rt-years a, .rt-years span, .rt-jump a { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 18px; border-radius: 999px; text-decoration: none;
  color: var(--glow-hi); border: 1px solid rgba(255, 215, 114, .4); background: rgba(255, 215, 114, .05); font-variant-numeric: tabular-nums; }
.rt-years a:hover, .rt-jump a:hover { background: rgba(255, 215, 114, .14); border-color: var(--glow); }
.rt-years span[aria-current] { color: var(--on-glow); background: var(--glow); border-color: var(--glow); }
.rt-jump small { font-size: .74rem; min-width: 1.6em; padding: 1px 6px; border-radius: 999px; text-align: center; color: var(--on-glow); background: rgba(201, 169, 255, .85); }
.pg__text .rt-years { margin-top: 14px; }

/* затмения */
.ec-near__k { font-size: .86rem; color: var(--mute); letter-spacing: .02em; }
.ec-near__h, .ec-card__h { margin-top: 8px; font: 400 clamp(1.6rem, 3vw, 2.4rem)/1.1 var(--display); color: var(--title); text-wrap: balance; }
.ec-near__h a { color: inherit; text-decoration-color: rgba(255, 215, 114, .4); text-underline-offset: .18em; }
.ec-card { scroll-margin-top: 90px; }
.ec-card__say { margin-top: 16px; max-width: 70ch; line-height: 1.65; color: var(--mute); }
.ec-card__say:first-of-type { color: var(--ink); }
.ec-near--solar, .ec-card--solar { background-image: radial-gradient(120% 90% at 100% 0, rgba(247, 204, 75, .13), transparent 60%); }
.ec-near--lunar, .ec-card--lunar { background-image: radial-gradient(120% 90% at 100% 0, rgba(201, 169, 255, .14), transparent 60%); }
.ec-dot { display: inline-block; width: 10px; height: 10px; margin-right: 8px; border-radius: 50%; vertical-align: 1px; }
.ec-dot--solar { background: var(--sun); box-shadow: 0 0 8px rgba(247, 204, 75, .8); }
.ec-dot--lunar { background: radial-gradient(circle at 35% 35%, #fff, #d8cbff 60%, var(--tense)); box-shadow: 0 0 8px rgba(201, 169, 255, .7); }
.ec-cell a { display: block; padding: 2px 0; }
.ec-steps { margin-top: 18px; display: grid; gap: 10px; counter-reset: s; }
.ec-steps__i { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 2px 4px; align-items: baseline; padding: 12px 16px;
  border: 1px solid rgba(255, 215, 114, .22); border-radius: 16px; background: rgba(255, 255, 255, .03); }
.ec-steps__i a { color: var(--ink); font-size: 1.02rem; text-decoration-color: rgba(255, 215, 114, .4); text-underline-offset: .2em; }
.ec-steps__i small { grid-column: 2; color: var(--mute); font-size: .84rem; }
.ec-steps__i.is-past { opacity: .6; }

@media (max-width: 640px) {
  /* первая колонка закреплена: на телефоне переносим её текст, чтобы на экране оставалось место для дат */
  .rt-table tbody th { white-space: normal; min-width: 8.2em; max-width: 9.6em; }
  .rt-list li { grid-template-columns: minmax(0, 1fr); }
  .rt-list small { grid-column: 1; }
  .rt-tl__months, .rt-tl__row { grid-template-columns: 5.4em minmax(0, 1fr); gap: 8px; }
  .rt-tl__name { font-size: .8rem; }
  .rt-tl__months i:nth-child(even) { color: transparent; }
  .rt-years a, .rt-years span, .rt-jump a { padding: 8px 14px; }
}

/* сетка ссылок внутри текста: без точек-маркеров списка статьи */
.pg__text .pg-grid li { margin-top: 0; padding-left: 0; }
.pg__text .pg-grid li::before { content: none; }