/* Homepage geometry and scale, matched to the desktop feed reference.

   Палитра и сама карточка публикации живут в общем слое feed-card.css —
   его подключает и лента, и страница поста. Здесь остаётся геометрия
   главной: ширина колонок, сетка, «Топовые фото» и сайдбар. */
:root {
  --feed-layout-width: 1020px;
  --feed-main-width: 660px;
  --feed-sidebar-width: 340px;
  --feed-column-gap: 20px;
}

.page-feed,
.page-feed body { background: var(--page-bg); }

.home-page { padding: 10px 24px 64px; }
.home-layout,
.top-photos { width: min(100%, var(--feed-layout-width)); max-width: none; margin-inline: auto; }
.home-layout {
  display: grid;
  grid-template-columns: minmax(0, var(--feed-main-width)) var(--feed-sidebar-width);
  gap: var(--feed-column-gap);
  align-items: start;
}
.home-feed { min-width: 0; padding-left: 0; }
.feed-list { gap: 16px; }
.feed-item { display: block; margin: 0; }

/* Подложки у блока нет: «Топовые фото недели» стоят прямо на фоне
   страницы, карточку с рамкой они больше не изображают — сетку держат
   сами фотографии. */
.top-photos { margin-bottom: 20px; gap: 14px; }
.top-photos__title { font-size: 26px; line-height: 1.2; font-weight: 700; color: var(--text); }
.top-photos__all { color: var(--green); }
.top-photos__all:hover { color: var(--green-dark); }
.top-photos__cell { border-radius: 10px; }
.top-photos__more { background: color-mix(in srgb, var(--green) 9%, var(--surface)); color: var(--green); }
.top-photos__more:hover { background: color-mix(in srgb, var(--green) 16%, var(--surface)); }

/* Сама карточка публикации — в feed-card.css. */

/* Sidebar matches the grid scale rather than shrinking its contents. */
.home-sidebar { gap: 20px; }
.sidebar-card { padding: 24px; gap: 19px; border-radius: 12px; }
.sidebar-card__title { font-size: 18px; line-height: 23px; font-weight: 700; color: var(--text); }
.sidebar-card__aside { font-size: 13px; }
.sidebar-card__more { font-size: 13px; }
.sidebar-contest { min-height: 360px; padding: 24px; gap: 15px; background: #fff8ea; }
.sidebar-contest .sidebar-card__title,
.sidebar-contest .sidebar-card__aside { color: var(--ochre); }
.sidebar-contest__badge { width: 104px; height: 104px; background: #ffedc8; color: #df8a11; box-shadow: inset 0 0 0 1px rgba(186, 117, 23, .13); }
.sidebar-contest__badge svg { width: 56px; height: 56px; }
.sidebar-contest__name { font-size: 20px; }
.sidebar-contest__text { font-size: 15px; }
.sidebar-contest__members { font-size: 13px; }
.sidebar-contest__cta {
  width: 100%;
  height: 42px;
  border: 1px solid var(--ochre);
  border-radius: 6px;
  background: #fffaf0;
  color: var(--ochre);
  font-size: 14px;
  font-weight: 600;
  cursor: default;
}
.sidebar-contest__leaves { opacity: .45; }
.sidebar-discussions__list,
.sidebar-places__list { gap: 19px; }
.sidebar-discussions__item { grid-template-columns: 52px minmax(0, 1fr) auto; gap: 13px; }
.sidebar-discussions__thumb,
.sidebar-places__thumb { display: block; width: 52px; height: 52px; border-radius: 7px; object-fit: cover; }
.sidebar-discussions__text {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: 14px;
  line-height: 20px;
  font-weight: 500;
  color: var(--text);
}
.sidebar-discussions__count { min-width: 34px; justify-content: flex-end; font-size: 13px; font-weight: 500; color: var(--text-secondary); }
.sidebar-places__link { grid-template-columns: 52px minmax(0, 1fr); gap: 13px; }
.sidebar-places__name { font-size: 14px; line-height: 1.35; font-weight: 600; }
.sidebar-places__count { margin-top: 2px; font-size: 13px; color: var(--text-secondary); }

@media (prefers-color-scheme: dark) {
  .sidebar-contest {
    background: color-mix(in srgb, var(--ochre) 10%, var(--surface));
    border-color: color-mix(in srgb, var(--ochre) 24%, var(--border));
  }
  .sidebar-contest__badge {
    background: color-mix(in srgb, var(--ochre) 18%, var(--surface-raised));
    color: var(--ochre);
    box-shadow: inset 0 0 0 1px var(--border);
  }
  .sidebar-contest__cta {
    background: var(--surface-raised);
  }
}

@media (max-width: 960px) {
  .home-layout { grid-template-columns: 1fr; }
  .home-sidebar { display: none; }
  .top-photos__title { font-size: 22px; }
}

@media (max-width: 640px) {
  /* Mobile is a separate, full-width composition rather than a scaled feed. */
  .home-page {
    width: 100%;
    padding: 12px 0 calc(28px + env(safe-area-inset-bottom, 0px));
    overflow-x: clip;
  }
  .top-photos {
    margin-bottom: 22px;
    padding: 5px 0 0;
  }
  .top-photos__head { padding-inline: 16px; }
  .top-photos__grid { padding-inline: 16px; }
  .top-photos__title { font-size: 18px; line-height: 23px; }
  .top-photos__all { gap: 5px; font-size: 13px; }
  .top-photos__cell { border-radius: 10px; }
  .top-photos__place { font-size: 18px; }

  .home-layout { padding-inline: 10px; overflow: visible; }
  .home-feed,
  .feed-list { overflow: visible; }
  .feed-list { gap: 18px; }
  .feed-item {
    overflow: hidden;
    border-radius: 14px;
    background: var(--surface);
    box-shadow: var(--shadow-sm);
  }
  .pagination { margin-inline: 0; }
}