/**
 * ====================================
 * Community Posts — стили постов
 * ====================================
 * 
 * Вдохновлено: Telegram channels, Reddit, VK
 * 
 * Принципы:
 * 1. Content-first — текст и медиа на первом месте
 * 2. Edge-to-edge media — фото без отступов по бокам карточки
 * 3. Compact header — аватар 36px, имя + время в одну строку
 * 4. Subtle footer — реакции и статистика не конкурируют с контентом
 * 5. Чистый whitespace — воздух между элементами
 * 
 * Структура:
 * .gc-post                    — карточка поста (базируется на .gc-card)
 *   .gc-post-header           — шапка (аватар + автор + время + действия)
 *   .gc-post-pinned           — бейдж закрепленного
 *   .gc-post-body             — контент (текст)
 *   .gc-post-media            — галерея (edge-to-edge)
 *   .gc-post-footer           — реакции + статистика
 * 
 * .gc-posts-compose-panel + .gc-posts-compose-slot — форма нового поста (отдельная панель над блоком ленты)
 * .gc-post-comments           — блок комментариев
 * .gc-comment                 — отдельный комментарий
 */

/* ========================================
   Post Card — Telegram-стиль
   Нет border, нет hover. Посты = контент в ленте.
   ======================================== */

.gc-post-attachments {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    gap: var(--space-2);
    margin: var(--space-1) var(--space-4) var(--space-3);
}

.gc-post-attachments--with-meta {
    align-items: center;
}

.gc-post-attachments--with-meta > .gc-post-counters {
    margin-inline-start: auto;
    align-self: flex-end;
}

.gc-post-attachment {
    --post-attachment-bg: var(--surface-interaction-row-hover);
    display: flex;
    align-items: center;
    gap: var(--space-1-5);
    flex: 0 1 auto;
    max-width: 100%;
    min-width: 0;
    min-height: 40px;
    padding: var(--space-1-5) var(--space-3);
    border-radius: var(--radius-12);
    background: var(--post-attachment-bg);
    box-shadow: inset 0 0 0 1px var(--border-subtle);
    color: var(--text-primary);
    font-size: var(--font-size-14);
    font-weight: 500;
    line-height: 1.25;
    text-decoration: none;
    transition-property: background-color, color, transform;
    transition-duration: var(--transition-fast);
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
}

.gc-post-attachment:active {
    transform: scale(0.96);
}

@media (prefers-reduced-motion: reduce) {
    .gc-post-attachment,
    .gc-post-chip,
    .gc-post-reaction,
    .gc-post-media-image,
    .gc-post-avatar-link,
    .gc-post-discussion-link {
        transition: none;
    }

    .gc-post-attachment:active,
    .gc-post-chip:active:not(:disabled),
    .gc-post-reaction:active:not(:disabled) {
        transform: none;
    }
}

.gc-post-attachment > i,
.gc-post-attachment > .gc-post-attachment-brand {
    flex-shrink: 0;
    width: 1em;
    height: 1em;
    font-size: var(--font-size-14);
    color: var(--text-secondary);
}
.gc-post-attachment-brand {
    display: block;
    fill: currentColor;
}
.gc-post-attachment > span { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.gc-post-attachment > .gc-post-attachment-leaders {
    display: flex;
    flex: 0 0 auto;
    padding-left: var(--space-1-5);
}
.gc-post-attachment-avatar {
    position: relative;
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    margin-left: calc(var(--space-1-5) * -1);
    border: 2px solid var(--post-attachment-bg);
    transition-property: border-color;
    transition-duration: var(--transition-fast);
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
    border-radius: var(--radius-full);
    overflow: hidden;
    background: var(--surface-elevated);
    color: var(--text-primary);
    font-size: var(--font-size-11);
    line-height: 1;
}
.gc-post-attachment-avatar:nth-child(1) { z-index: 3; }
.gc-post-attachment-avatar:nth-child(2) { z-index: 2; }
.gc-post-attachment-avatar > .gc-avatar-24 { width: 100%; height: 100%; font-size: var(--font-size-11); }
.gc-post-attachment:hover {
    --post-attachment-bg: color-mix(in srgb, var(--text-primary) 5%, var(--surface-interaction-row-hover));
    color: var(--text-primary);
}
.gc-post-attachment:focus-visible {
    outline: var(--gc-focus-outline);
    outline-offset: var(--gc-focus-outline-offset);
}

.gc-post {
    /* Контекст скругления для вложений (не зависит от plain-панелей вокруг ленты) */
    --gc-corner-outer: var(--radius-16);
    --gc-corner-nest: 0px;
    background: var(--surface-panel);
    border: 1px solid var(--border-subtle);
    border-radius: var(--gc-corner-outer);
    width: 100%;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    scroll-margin-top: var(--space-4);
}

/* ========================================
   Post Header — компактная шапка
   Паттерн: [avatar 36px] [name · time] [⋯]
   ======================================== */

.gc-post-header {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    padding: var(--space-4);
}

.gc-post-header-actions {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    flex-shrink: 0;
}

.gc-post-header-link {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    flex: 1;
    min-width: 0;
    text-decoration: none;
    color: inherit;
}

.gc-post-avatar-link {
    display: inline-flex;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
    overflow: hidden;
    border-radius: var(--radius-full);
    text-decoration: none;
    color: inherit;
    transition-property: filter;
    transition-duration: var(--transition-fast);
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
}

@media (hover: hover) and (pointer: fine) {
    a.gc-post-avatar-link:is(:hover, :focus-visible) {
        filter: brightness(0.85);
    }
}

.gc-post-community-avatars {
    position: relative;
    width: 36px;
    height: 36px;
    flex-shrink: 0;
}

.gc-post-community-avatars--paired {
    width: 48px;
    height: 42px;
}

.gc-post-community-avatars--paired > .gc-post-avatar-link + .gc-post-avatar-link {
    position: absolute;
    right: 0;
    bottom: 0;
    /* Выше кости фото основной аватарки (.gc-img-bone), иначе иконка «под» shimmer */
    z-index: 2;
    width: 28px;
    height: 28px;
    box-shadow: 0 0 0 2px var(--surface-panel);
}

.gc-post-community-avatars--paired > .gc-post-avatar-link + .gc-post-avatar-link > * {
    width: 28px;
    height: 28px;
}

.gc-post-community-avatars--paired > .gc-post-avatar-link + .gc-post-avatar-link > .gc-post-avatar-placeholder {
    background: var(--surface-primary);
    border: 0;
    color: var(--text-primary);
}

.gc-post-community-avatars--paired > .gc-post-avatar-link + .gc-post-avatar-link > .gc-post-avatar-placeholder i {
    font-size: var(--font-size-16);
    color: var(--text-primary);
}

/* Мета под именем (имя + дата / автор вертикально) */
.gc-post-header-meta {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    min-width: 0;
}

.gc-post-header .gc-post-avatar {
    width: 36px;
    height: 36px;
    border-radius: var(--radius-full);
    object-fit: cover;
    flex-shrink: 0;
}

.gc-post-header .gc-post-avatar.gc-img-slot,
.gc-post-avatar-link .gc-img-slot {
    display: block;
    width: 36px;
    height: 36px;
    overflow: hidden;
    flex-shrink: 0;
    background: var(--surface-control);
}

.gc-post-author-link {
    display: inline-flex;
    min-width: 0;
    text-decoration: none;
    color: inherit;
}

/* Byline name — тот же контракт, что `.gc-event-index-card-v2-1__byline-name`. */
.gc-post-author {
    font-size: var(--font-size-14);
    font-weight: 500;
    color: var(--text-primary);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 1.3;
}

.gc-post-author-link:is(:hover, :focus-visible) .gc-post-author {
    color: var(--accent-link);
}

.gc-post-author-link:focus-visible {
    outline: var(--gc-focus-outline);
    outline-offset: var(--gc-focus-outline-offset);
}

/* Дата под именем канала */
.gc-post-date {
    font-size: var(--font-size-13);
    color: var(--text-secondary);
    line-height: 1.3;
}

.gc-post-subauthor {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    min-width: 0;
    color: var(--text-secondary);
    text-decoration: none;
}

.gc-post-subauthor-icon {
    flex-shrink: 0;
    font-size: var(--font-size-13);
    line-height: 1;
}

.gc-post-subauthor-name {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: var(--font-size-13);
    font-weight: 400;
    line-height: 1.3;
}

a.gc-post-subauthor:is(:hover, :focus-visible) {
    color: var(--accent-link);
}

a.gc-post-subauthor:focus-visible {
    outline: var(--gc-focus-outline);
    outline-offset: var(--gc-focus-outline-offset);
}

/* Main feed / channel preview: тот же inset, что у `.gc-post` (space/4). */
.gc-post--feed-preview {
    --post-inset: var(--space-4);
}

.gc-post--feed-preview .gc-post-header {
    padding: var(--space-4) var(--post-inset);
}

.gc-post--feed-preview .gc-post-header-link {
    gap: var(--space-2);
}

.gc-post--feed-preview .gc-post-header-meta {
    gap: var(--space-1);
}

.gc-post-permalink {
    color: var(--text-secondary);
    font-size: var(--font-size-12);
    text-decoration: none;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
}

.gc-post--feed-preview .gc-post-body {
    padding: 0 var(--post-inset) var(--space-4);
    overflow-wrap: anywhere;
}

.gc-post--feed-preview .gc-post-media + .gc-post-body {
    padding-top: var(--space-4);
}

.gc-post-preview {
    position: relative;
    min-width: 0;
}

.gc-post-preview--collapsed {
    max-height: 236px;
    overflow: hidden;
}

.gc-post-preview--collapsed::after {
    content: '';
    position: absolute;
    inset: auto 0 0;
    height: 40px;
    background: linear-gradient(transparent, var(--surface-panel));
    pointer-events: none;
}

.gc-post-read-more {
    display: inline-flex;
    align-items: center;
    align-self: flex-start;
    gap: var(--space-1-5);
    min-height: 36px;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--text-primary);
    font: inherit;
    font-size: var(--font-size-14);
    font-weight: 600;
    cursor: pointer;
}

.gc-post--feed-preview .gc-post-footer--compact {
    flex-direction: row;
    align-items: center;
    gap: var(--space-3);
    padding: var(--space-3) var(--post-inset);
    border-top: 1px solid var(--border-subtle);
}

.gc-post-feed-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-2) var(--space-4);
    min-width: 0;
}

.gc-post-comment-action {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    min-height: 36px;
    color: var(--text-secondary);
    text-decoration: none;
    font-size: var(--font-size-13);
    font-weight: 500;
}

.gc-post-comment-action i { font-size: var(--font-size-18); }
.gc-post-footer--compact > .gc-post-stat { flex-shrink: 0; margin-inline-start: auto; }
.gc-post--feed-preview .gc-post-reaction-trigger,
.gc-post--feed-preview .gc-post-chip { min-height: 36px; min-width: 36px; }

.gc-post--feed-preview :is(a, button, [role="button"]):focus-visible {
    outline: 2px solid var(--text-secondary);
    outline-offset: -2px;
    border-radius: var(--radius-4);
}

@media (hover: hover) {
    .gc-post-comment-action:hover, .gc-post-permalink:hover { color: var(--text-primary); }
    .gc-post-read-more:hover { text-decoration: underline; text-underline-offset: 4px; }
}

@media (max-width: 576px) {
    .gc-post--feed-preview .gc-post-header-actions { gap: var(--space-1); }
}

/* Старый .gc-post-time (в шапке, устарел) */
.gc-post-time {
    font-size: var(--font-size-13);
    color: var(--text-secondary);
    white-space: nowrap;
    flex-shrink: 0;
}

/* Время в footer (справа) */
.gc-post-time-footer {
    font-size: var(--font-size-13);
    color: var(--text-secondary);
    white-space: nowrap;
    flex-shrink: 0;
}

/* Имя автора (подпись справа, как «via» в Telegram) */
.gc-post-via {
    font-size: var(--font-size-13);
    color: var(--text-secondary);
    max-width: 120px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* Placeholder когда у канала нет аватара */
.gc-post-header .gc-post-avatar-placeholder {
    width: 36px;
    height: 36px;
    border-radius: var(--radius-full);
    box-sizing: border-box;
    background: var(--surface-control);
    border: 1px solid var(--border-subtle);
    color: var(--text-secondary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-base);
    font-weight: 600;
    line-height: 1;
    flex-shrink: 0;
}

.gc-post-header .gc-post-avatar-placeholder i {
    font-weight: 400;
    font-size: var(--font-size-16);
}

/* Иконка «Закреплено» в строке счётчиков (Telegram-стиль) */
.gc-post-pin-icon {
    display: inline-flex;
    align-items: center;
    font-size: var(--font-size-14);
    color: var(--text-secondary);
}

/* Бейдж «Отредактировано» */
.gc-post-edited {
    font-size: var(--font-size-13);
    color: var(--text-secondary);
}

/* ========================================
   Post Body — текст поста
   ======================================== */

.gc-post-body {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: 0 var(--space-4) var(--space-3);
    font-size: var(--font-size-15);
    line-height: 1.65;
    color: var(--text-primary);
    word-wrap: break-word;
}

/* Body spacing belongs to the post; plain paragraphs participate in its gap. */
.gc-post-body > p {
    margin: 0;
}

.gc-post-header + .gc-post-body {
    padding-top: 0;
}

.gc-post-media + .gc-post-body {
    padding-top: var(--space-3);
}

/* Время на последней строке текста, если слева нет реакций. */
.gc-post-body.gc-post-body--inline-meta {
    display: flow-root;
}

.gc-post-body--inline-meta > .gc-post-title {
    margin-bottom: var(--space-2);
}

.gc-post-body--inline-meta:not(:has(.gc-post-tiptap)) > .gc-post-title {
    display: inline;
    margin-bottom: 0;
}

.gc-post-body--inline-meta > .gc-post-tiptap {
    display: contents;
}

.gc-post-body--inline-meta > .gc-post-tiptap > :not(:last-child) {
    margin-bottom: var(--space-2);
}

.gc-post-body--inline-meta > p:last-of-type,
.gc-post-body--inline-meta > .gc-post-tiptap > p:last-child {
    display: inline;
}

.gc-post-body--inline-meta > .gc-post-counters {
    float: right;
    margin-inline-start: var(--space-3);
    line-height: inherit;
}

/* Ссылка на заголовок — без дефолтного стиля ссылки */
.gc-post-title-link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.gc-post-title-link:hover .gc-post-title {
    color: var(--accent-link);
}

/* TipTap HTML контент — Telegram показывает полностью */
.gc-post-tiptap {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    /* Единый шаг между блоками: абзацы, эмбеды, списки — без gap+margin «двойного» ритма. */
    gap: var(--space-2);
    white-space: normal;
    /* Локально для embed/link block — не глобальный токен */
    --gc-post-embed-max-width: 20rem;
    --gc-post-embed-min-width: 11rem;
}

.gc-post-tiptap > * {
    margin: 0;
}

/* Пустые строки из TipTap (Enter) — не раздувают ленту */
.gc-post-tiptap > p:empty,
.gc-post-tiptap > p:has(> br:only-child) {
    display: none;
}

/* Абзац только с block embed — дети участвуют во flex-gap родителя */
.gc-post-tiptap > p:has(> :is(a[data-embed-card], .gc-post-link.gc-card-activity-event):only-child) {
    display: contents;
}

/* Смешанный абзац (текст + embed): колонка с тем же шагом */
.gc-post-tiptap > p:has(> :is(a[data-embed-card], .gc-post-link.gc-card-activity-event)) {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-2);
    width: 100%;
}

.gc-post-tiptap > :is(p, h1, h2, h3, ul, ol, blockquote) {
    width: 100%;
}

.gc-post-tiptap a[data-embed-card],
.gc-post-tiptap .gc-post-link {
    margin: 0;
}

/* Block row в tiptap / композере — compact tile или rich cover; glow — subscriptions.css (--post-embed). */
.gc-post-tiptap a[data-embed-card].gc-card-activity-event,
.gc-post-tiptap .gc-post-link.gc-card-activity-event,
.gc-post-compose-entry .stage-tiptap-editor a[data-embed-card].gc-card-activity-event,
.gc-post-compose-entry .stage-tiptap-editor .gc-post-link.gc-card-activity-event,
.channel-feed-compose .stage-tiptap-editor a[data-embed-card].gc-card-activity-event,
.channel-feed-compose .stage-tiptap-editor .gc-post-link.gc-card-activity-event {
    display: flex;
    flex-direction: row;
    align-items: center;
    align-self: flex-start;
    width: fit-content;
    max-width: min(100%, var(--gc-post-embed-max-width, 20rem));
    min-width: min(100%, var(--gc-post-embed-min-width, 11rem));
    color: inherit;
    text-decoration: none;
}

/* Rich preview — обложка 16:9 + текст снизу (ивент с cover) */
.gc-post-tiptap .gc-card-activity-event--post-rich,
.gc-post-compose-entry .stage-tiptap-editor .gc-card-activity-event--post-rich,
.channel-feed-compose .stage-tiptap-editor .gc-card-activity-event--post-rich {
    flex-direction: column;
    align-items: stretch;
    width: min(100%, var(--gc-post-embed-max-width, 20rem));
    min-width: 0;
    padding: 0;
    overflow: hidden;
}

.gc-post-embed-cover {
    aspect-ratio: 16 / 9;
    background: var(--surface-subtle);
    overflow: hidden;
    flex-shrink: 0;
}

.gc-post-embed-cover img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gc-post-embed-body {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    min-width: 0;
    padding: var(--space-3);
}

.gc-card-activity-event--post-rich .activity-event-info {
    width: 100%;
}

/* Results embed — чуть шире compact tile под таблицу */
.gc-post-tiptap .gc-card-activity-event--results,
.gc-post-compose-entry .stage-tiptap-editor .gc-card-activity-event--results,
.channel-feed-compose .stage-tiptap-editor .gc-card-activity-event--results {
    width: min(100%, var(--gc-post-embed-max-width, 20rem));
    min-width: min(100%, var(--gc-post-embed-min-width, 11rem));
    align-items: flex-start;
}

@media (min-width: 1280px) and (hover: hover) and (pointer: fine) {

.gc-post-tiptap a[data-embed-card].gc-card-activity-event:hover,

.gc-post-tiptap .gc-post-link.gc-card-activity-event:hover,

.gc-post-compose-entry .stage-tiptap-editor a[data-embed-card].gc-card-activity-event:hover,

.gc-post-compose-entry .stage-tiptap-editor .gc-post-link.gc-card-activity-event:hover,

.channel-feed-compose .stage-tiptap-editor a[data-embed-card].gc-card-activity-event:hover,

.channel-feed-compose .stage-tiptap-editor .gc-post-link.gc-card-activity-event:hover {
    color: inherit;
    text-decoration: none;
}
}


.gc-post-tiptap a[data-embed-card].gc-card-activity-event:focus-visible,

.gc-post-tiptap .gc-post-link.gc-card-activity-event:focus-visible,

.gc-post-compose-entry .stage-tiptap-editor a[data-embed-card].gc-card-activity-event:focus-visible,

.gc-post-compose-entry .stage-tiptap-editor .gc-post-link.gc-card-activity-event:focus-visible,

.channel-feed-compose .stage-tiptap-editor a[data-embed-card].gc-card-activity-event:focus-visible,

.channel-feed-compose .stage-tiptap-editor .gc-post-link.gc-card-activity-event:focus-visible {
    color: inherit;
    text-decoration: none;
}

.gc-post-tiptap.gc-text-content :is(p, h1, h2, h3, ul, ol, blockquote) {
    margin: 0;
}

.gc-post-tiptap.gc-text-content ul,
.gc-post-tiptap.gc-text-content ol {
    padding-left: var(--space-4);
}

/* Композер: plain `<a>` до present — compact tile preview */
.gc-post-compose-entry .stage-tiptap-editor,
.channel-feed-compose .stage-tiptap-editor {
    --gc-post-embed-max-width: 20rem;
    --gc-post-embed-min-width: 11rem;
}

.gc-post-compose-entry .stage-tiptap-editor p + p,
.channel-feed-compose .stage-tiptap-editor p + p {
    margin-top: var(--space-2);
}

.gc-post-compose-entry .stage-tiptap-editor > :is(a[data-embed-card], .gc-post-link.gc-card-activity-event),
.channel-feed-compose .stage-tiptap-editor > :is(a[data-embed-card], .gc-post-link.gc-card-activity-event),
.gc-post-compose-entry .stage-tiptap-editor p + :is(a[data-embed-card], .gc-post-link.gc-card-activity-event),
.channel-feed-compose .stage-tiptap-editor p + :is(a[data-embed-card], .gc-post-link.gc-card-activity-event),
.gc-post-compose-entry .stage-tiptap-editor :is(a[data-embed-card], .gc-post-link.gc-card-activity-event) + p,
.channel-feed-compose .stage-tiptap-editor :is(a[data-embed-card], .gc-post-link.gc-card-activity-event) + p {
    margin-top: var(--space-2);
}

.gc-post-compose-entry .stage-tiptap-editor > :first-child,
.channel-feed-compose .stage-tiptap-editor > :first-child {
    margin-top: 0;
}

.gc-post-compose-entry .stage-tiptap-editor a:not([data-embed-card]):not(.gc-card-activity-event):not(.event-widget):not([class*="yandex-map-"]),
.channel-feed-compose .stage-tiptap-editor a:not([data-embed-card]):not(.gc-card-activity-event):not(.event-widget):not([class*="yandex-map-"]) {
    display: flex;
    flex-direction: row;
    align-items: center;
    align-self: flex-start;
    gap: var(--space-2);
    width: fit-content;
    max-width: min(100%, var(--gc-post-embed-max-width, 20rem));
    min-width: min(100%, var(--gc-post-embed-min-width, 11rem));
    margin: var(--space-2) 0 0;
    padding: var(--space-3);
    border: 1px solid var(--gc-card-glow-rest-border, var(--border-subtle));
    border-radius: var(--radius-16);
    background: var(--surface-primary);
    box-shadow: var(--gc-card-glow-rest-shadow, var(--shadow-sm));
    color: var(--text-primary);
    font-size: inherit;
    font-weight: 500;
    line-height: 1.45;
    text-decoration: none;
    transition: var(--gc-card-glow-transition, border-color 85ms var(--ease-in), box-shadow 85ms var(--ease-in));
}

@media (min-width: 1280px) and (hover: hover) and (pointer: fine) {

.gc-post-compose-entry .stage-tiptap-editor a:not([data-embed-card]):not(.gc-card-activity-event):not(.event-widget):not([class*="yandex-map-"]):hover,

.channel-feed-compose .stage-tiptap-editor a:not([data-embed-card]):not(.gc-card-activity-event):not(.event-widget):not([class*="yandex-map-"]):hover {
    background: var(--gc-card-glow-hover-bg, var(--surface-primary));
    border-color: var(--gc-card-glow-hover-border, var(--border-default));
    box-shadow: var(--gc-card-glow-hover-shadow, var(--shadow-sm));
    color: var(--text-primary);
    text-decoration: none;
}
}


.gc-post-compose-entry .stage-tiptap-editor a:not([data-embed-card]):not(.gc-card-activity-event):not(.event-widget):not([class*="yandex-map-"]):focus-visible,

.channel-feed-compose .stage-tiptap-editor a:not([data-embed-card]):not(.gc-card-activity-event):not(.event-widget):not([class*="yandex-map-"]):focus-visible {
    background: var(--gc-card-glow-hover-bg, var(--surface-primary));
    border-color: var(--gc-card-glow-hover-border, var(--border-default));
    box-shadow: var(--gc-card-glow-hover-shadow, var(--shadow-sm));
    color: var(--text-primary);
    text-decoration: none;
}

/* Внешние link blocks: длинная подпись переносится; title — list-title ритм из cards.css */
.gc-post-link .activity-event-title.gc-post-link__label {
    white-space: normal;
    overflow: visible;
    text-overflow: unset;
}

.gc-post-link .gc-post-link__host {
    overflow-wrap: anywhere;
}

@media (prefers-reduced-motion: reduce) {
    .gc-post-compose-entry .stage-tiptap-editor a:not([data-embed-card]):not(.gc-card-activity-event):not(.event-widget):not([class*="yandex-map-"]),
    .channel-feed-compose .stage-tiptap-editor a:not([data-embed-card]):not(.gc-card-activity-event):not(.event-widget):not([class*="yandex-map-"]) {
        transition: none;
    }
}

/* Лента/карточка: ритм чуть плотнее «статьи», акцент мягче глобального .gc-text-content */
.gc-post-tiptap.gc-text-content strong,
.gc-post-tiptap.gc-text-content b {
    font-weight: 550;
}

.gc-post-tiptap.gc-text-content h1,
.gc-post-tiptap.gc-text-content h2,
.gc-post-tiptap.gc-text-content h3 {
    font-weight: 500;
    line-height: 1.35;
}

.gc-post-tiptap .gc-card-activity-event:not(.gc-card-activity-event--post-rich) {
    min-width: 0;
    align-items: center;
}

.gc-post-tiptap .gc-card-activity-event .activity-event-meta .gc-text-truncate {
    display: block;
    min-width: 0;
}

.gc-post-tiptap .gc-card-activity-event .activity-event-title {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.gc-card-activity-event--results {
    align-items: flex-start;
}

/* Layout делаем через UI Kit: gc-stack-sm / gc-flex / gc-gap-* */

.gc-embed-results {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.gc-embed-results .activity-event-info {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
}

.gc-embed-results-top {
    padding-top: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.gc-embed-results-top-item {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    min-width: 0;
    font-size: var(--font-size-14);
    color: var(--text-secondary);
}

.gc-embed-results-place {
    color: var(--text-secondary);
    font-variant-numeric: tabular-nums;
    flex-shrink: 0;
}

.gc-embed-results-avatar {
    width: 28px;
    height: 28px;
    border-radius: var(--radius-full);
    overflow: hidden;
    flex-shrink: 0;
    background: var(--surface-control);
    border: 1px solid var(--border-subtle);
    box-sizing: border-box;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

.gc-embed-results-avatar--photo {
    border: none;
}

.gc-embed-results-avatar img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.gc-embed-results-avatar-fallback {
    font-size: var(--font-size-13);
    font-weight: 600;
    color: var(--text-secondary);
    line-height: 1;
}

.gc-embed-results-name {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--text-primary);
    font-weight: 500;
}

.gc-embed-results-points {
    color: var(--text-secondary);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* Только что опубликованный пост: мягкое появление */
.gc-post--just-published {
    animation: gc-post-just-published-in 320ms var(--ease-out, ease-out) both;
}

@keyframes gc-post-just-published-in {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.gc-post-embed-avatar {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-full);
    object-fit: cover;
    flex-shrink: 0;
}

.gc-post-embed-subtitle {
    margin-top: 0;
    font-size: var(--font-size-13);
    color: var(--text-secondary);
    line-height: 1.3;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}


/* Заголовок поста (опционально) — ближе к телу ленты, без размера глобального h2 */
.gc-post-title {
    margin: 0;
    font-size: var(--font-size-20);
    font-weight: 550;
    line-height: 1.35;
}

.gc-post-readmore {
    color: var(--accent-link);
    font-weight: 500;
    text-decoration: none;
    font-size: var(--font-size-14);
}

.gc-post-readmore:hover {
    text-decoration: underline;
}

/* ========================================
   Post Media — edge-to-edge фотографии
   object-fit: cover — ячейка заполняется, лишнее обрезается; object-position по ориентации.
   Подложка .gc-post-media-blur — та же картинка, blur + cover под основным слоем (при cover основного
   слоя подложка не видна; без JS-переключения режимов — нет «сначала fill, потом fit»).
   Одно фото с метаданными: .gc-post-media-item--measured — высота через padding-bottom % от ширины (без cqw).
   ======================================== */

.gc-post-media {
    display: grid;
    gap: 2px;
    overflow: hidden;
    /* Без border-radius — карточка сама обрезает через overflow: hidden */
}

.gc-post-media-frame {
    position: relative;
}

.gc-post-counters--on-media {
    position: absolute;
    z-index: 1;
    right: var(--space-2);
    bottom: var(--space-2);
    margin-inline-start: 0;
    padding: var(--space-1) var(--space-2);
    border-radius: var(--radius-full);
    background: color-mix(in srgb, var(--fill-emphasis) 62%, transparent);
}

.gc-post-counters--on-media,
.gc-post-counters--on-media .gc-post-stat,
.gc-post-counters--on-media .gc-post-time-footer,
.gc-post-counters--on-media .gc-post-pin-icon {
    color: var(--text-on-scrim);
}

.gc-post-media--1 {
    grid-template-columns: 1fr;
}

.gc-post-media--2 {
    grid-template-columns: 1fr 1fr;
}

.gc-post-media--3 {
    grid-template-columns: 2fr 1fr;
    grid-template-rows: 1fr 1fr;
}

.gc-post-media--3 .gc-post-media-item:first-child {
    grid-row: 1 / 3;
    /* Базовый aspect-ratio 1:1 даёт высоту = ширине колонки; два ряда справа + row-gap
       дают большую сумму — левый кадр визуально «короче». Растягиваем на всю spanned-область. */
    aspect-ratio: unset;
    align-self: stretch;
    min-height: 0;
    height: 100%;
}

.gc-post-media--4 {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
}

/* --- Умная сетка 2 фото (ориентации из метаданных) --- */
.gc-post-media--2.gc-post-media--smart-2-pp {
    grid-template-columns: 1fr;
    grid-template-rows: minmax(0, auto) minmax(0, auto);
}

.gc-post-media--2.gc-post-media--smart-2-pp .gc-post-media-item {
    aspect-ratio: unset;
    width: 100%;
}

.gc-post-media--2.gc-post-media--smart-2-pp .gc-post-media-item[data-gc-media-orientation='portrait'] {
    aspect-ratio: var(--gc-media-ratio, 3 / 4);
    max-height: min(72vh, 640px);
}

.gc-post-media--2.gc-post-media--smart-2-pp .gc-post-media-item:not([data-gc-media-orientation='portrait']) {
    aspect-ratio: 1 / 1;
    max-height: min(52vh, 480px);
}

.gc-post-media--2.gc-post-media--smart-2-ll {
    grid-template-columns: 1fr 1fr;
    grid-template-rows: auto;
}

.gc-post-media--2.gc-post-media--smart-2-ll .gc-post-media-item {
    aspect-ratio: 3 / 2;
    max-height: min(36vw, 280px);
    min-height: 0;
}

.gc-post-media--2.gc-post-media--smart-2-pl {
    grid-template-columns: minmax(0, 0.92fr) minmax(0, 1.08fr);
    grid-template-rows: minmax(0, auto);
    align-items: stretch;
}

.gc-post-media--2.gc-post-media--smart-2-pl .gc-post-media-item:first-child {
    grid-column: 1;
    grid-row: 1;
    aspect-ratio: var(--gc-media-ratio, 3 / 4);
}

.gc-post-media--2.gc-post-media--smart-2-pl .gc-post-media-item:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
    aspect-ratio: unset;
    height: 100%;
    min-height: 0;
}

.gc-post-media--2.gc-post-media--smart-2-lp {
    grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
    grid-template-rows: minmax(0, auto);
    align-items: stretch;
}

.gc-post-media--2.gc-post-media--smart-2-lp .gc-post-media-item:first-child {
    grid-column: 1;
    grid-row: 1;
    aspect-ratio: unset;
    height: 100%;
    min-height: 0;
}

.gc-post-media--2.gc-post-media--smart-2-lp .gc-post-media-item:nth-child(2) {
    grid-column: 2;
    grid-row: 1;
    aspect-ratio: var(--gc-media-ratio, 3 / 4);
}

/* --- Умная сетка 3–4 фото: только доля строк/колонок и форма ячеек --- */
.gc-post-media--3.gc-post-media--smart-3-portrait-heavy {
    grid-template-columns: 1.88fr 1fr;
    grid-template-rows: 1.1fr 1.1fr;
}

.gc-post-media--3.gc-post-media--smart-3-landscape-heavy {
    grid-template-columns: 1.58fr 1fr;
    grid-template-rows: 0.9fr 0.9fr;
}

.gc-post-media--4.gc-post-media--smart-4-portrait-heavy .gc-post-media-item {
    aspect-ratio: 3 / 4;
}

.gc-post-media--4.gc-post-media--smart-4-landscape-heavy .gc-post-media-item {
    aspect-ratio: 4 / 3;
}

.gc-post-media-item {
    position: relative;
    overflow: hidden;
    background: var(--surface-control);
    aspect-ratio: 1 / 1;
    min-width: 0;
}

/* Chromatic edge на ячейках галереи (better-ui image outlines). */
.gc-post-media--1 .gc-post-media-item,
.gc-post-media--2 .gc-post-media-item,
.gc-post-media--3 .gc-post-media-item,
.gc-post-media--4 .gc-post-media-item,
.gc-post-media--5 .gc-post-media-item,
.gc-post-media--6 .gc-post-media-item,
.gc-post-media--7 .gc-post-media-item,
.gc-post-media--8 .gc-post-media-item,
.gc-post-media--9 .gc-post-media-item,
.gc-post-media--10 .gc-post-media-item {
    outline: 1px solid color-mix(in srgb, var(--fill-emphasis) 10%, transparent);
    outline-offset: -1px;
}

/* Одиночное фото без метаданных — квадрат; с --measured — отдельные правила (не смешивать max-height) */
.gc-post-media--1 .gc-post-media-item:not(.gc-post-media-item--measured) {
    aspect-ratio: 1 / 1;
    max-height: min(85vh, 920px);
}

/*
 * Одно фото с --gc-media-ratio: высота = min(ширина/ratio, cap) через padding-bottom % (от ширины ячейки).
 * Без cqw/container queries — стабильно в flex-лейауте.
 */
.gc-post-media--1 .gc-post-media-item--measured {
    aspect-ratio: unset;
    width: 100%;
    height: 0;
    padding-bottom: min(calc(100% / var(--gc-media-ratio)), min(85vh, 920px));
    position: relative;
    box-sizing: content-box;
}

/* Только 2 фото без smart-*: одна строка — можно выставить ratio из файла. Сетка 2×2 на 4 фото с
 * grid-template-rows: 1fr 1fr + разные aspect-ratio на ячейках ломает раскладку — там остаётся 1:1
 * или классы smart-4-* (3/4 и 4/3) из PostMediaGridLayout. */
.gc-post-media--2:not([class*="smart"]) .gc-post-media-item:not([data-gc-media-bucket="unknown"]) {
    aspect-ratio: var(--gc-media-ratio);
    max-height: min(52vh, 560px);
}

/* Кадрирование ближе к Telegram: портрет — верх (лица), панорама — центр кадра */
.gc-post-media-item[data-gc-media-orientation='portrait'] .gc-post-media-image,
.gc-post-media-item[data-gc-media-orientation='portrait'] .gc-post-media-blur img {
    object-position: center 18%;
}

.gc-post-media-item[data-gc-media-tall='1'] .gc-post-media-image,
.gc-post-media-item[data-gc-media-tall='1'] .gc-post-media-blur img {
    object-position: center 10%;
}

/* 3 фото: крупный кадр слева на двух рядах — center 18%/10% для портрета съедает низ при object-fit: cover */
.gc-post-media--3 .gc-post-media-item:first-child .gc-post-media-image,
.gc-post-media--3 .gc-post-media-item:first-child .gc-post-media-blur img {
    object-position: center center;
}

.gc-post-media-item[data-gc-media-orientation='landscape'] .gc-post-media-image,
.gc-post-media-item[data-gc-media-orientation='landscape'] .gc-post-media-blur img {
    object-position: center center;
}

.gc-post-media-item[data-gc-media-wide='1'] .gc-post-media-image,
.gc-post-media-item[data-gc-media-wide='1'] .gc-post-media-blur img {
    object-position: center 48%;
}

.gc-post-media--5,
.gc-post-media--6,
.gc-post-media--7,
.gc-post-media--8,
.gc-post-media--9,
.gc-post-media--10 {
    --gc-post-media-row: clamp(120px, 13vw, 178px);
    grid-auto-flow: dense;
    grid-auto-rows: var(--gc-post-media-row);
}

/* Профиль по соотношениям (PostMediaGridLayout): портретный / альбомный альбом 5–10 */
.gc-post-media--5.gc-post-media--ratio-profile-portrait,
.gc-post-media--6.gc-post-media--ratio-profile-portrait,
.gc-post-media--7.gc-post-media--ratio-profile-portrait,
.gc-post-media--8.gc-post-media--ratio-profile-portrait,
.gc-post-media--9.gc-post-media--ratio-profile-portrait,
.gc-post-media--10.gc-post-media--ratio-profile-portrait {
    --gc-post-media-row: clamp(132px, 14.5vw, 190px);
}

.gc-post-media--5.gc-post-media--ratio-profile-landscape,
.gc-post-media--6.gc-post-media--ratio-profile-landscape,
.gc-post-media--7.gc-post-media--ratio-profile-landscape,
.gc-post-media--8.gc-post-media--ratio-profile-landscape,
.gc-post-media--9.gc-post-media--ratio-profile-landscape,
.gc-post-media--10.gc-post-media--ratio-profile-landscape {
    --gc-post-media-row: clamp(112px, 12vw, 168px);
}

.gc-post-media--5 .gc-post-media-item,
.gc-post-media--6 .gc-post-media-item,
.gc-post-media--7 .gc-post-media-item,
.gc-post-media--8 .gc-post-media-item,
.gc-post-media--9 .gc-post-media-item,
.gc-post-media--10 .gc-post-media-item {
    height: 100%;
    min-height: 0;
    aspect-ratio: auto;
}

.gc-post-media--5 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.gc-post-media--5 .gc-post-media-item:nth-child(1) {
    grid-column: 1 / 3;
    grid-row: 1 / 3;
}

.gc-post-media--5 .gc-post-media-item:nth-child(2) {
    grid-column: 3;
    grid-row: 1;
}

.gc-post-media--5 .gc-post-media-item:nth-child(3) {
    grid-column: 3;
    grid-row: 2;
}

.gc-post-media--5 .gc-post-media-item:nth-child(4) {
    grid-column: 1;
    grid-row: 3;
}

.gc-post-media--5 .gc-post-media-item:nth-child(5) {
    grid-column: 2 / 4;
    grid-row: 3;
}

.gc-post-media--6 {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.gc-post-media--6 .gc-post-media-item:nth-child(1) {
    grid-column: 1 / 3;
    grid-row: 1 / 3;
}

.gc-post-media--6 .gc-post-media-item:nth-child(2) {
    grid-column: 3;
    grid-row: 1;
}

.gc-post-media--6 .gc-post-media-item:nth-child(3) {
    grid-column: 3;
    grid-row: 2;
}

.gc-post-media--6 .gc-post-media-item:nth-child(4) {
    grid-column: 1;
    grid-row: 3;
}

.gc-post-media--6 .gc-post-media-item:nth-child(5) {
    grid-column: 2;
    grid-row: 3;
}

.gc-post-media--6 .gc-post-media-item:nth-child(6) {
    grid-column: 3;
    grid-row: 3;
}

.gc-post-media--7 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.gc-post-media--7 .gc-post-media-item:nth-child(1) {
    grid-column: 1 / 3;
    grid-row: 1 / 3;
}

.gc-post-media--7 .gc-post-media-item:nth-child(2) {
    grid-column: 3;
    grid-row: 1;
}

.gc-post-media--7 .gc-post-media-item:nth-child(3) {
    grid-column: 4;
    grid-row: 1;
}

.gc-post-media--7 .gc-post-media-item:nth-child(4) {
    grid-column: 3;
    grid-row: 2;
}

.gc-post-media--7 .gc-post-media-item:nth-child(5) {
    grid-column: 4;
    grid-row: 2;
}

.gc-post-media--7 .gc-post-media-item:nth-child(6) {
    grid-column: 1;
    grid-row: 3;
}

.gc-post-media--7 .gc-post-media-item:nth-child(7) {
    grid-column: 2 / 5;
    grid-row: 3;
}

.gc-post-media--8 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.gc-post-media--8 .gc-post-media-item:nth-child(1) {
    grid-column: 1 / 3;
    grid-row: 1 / 3;
}

.gc-post-media--8 .gc-post-media-item:nth-child(2) {
    grid-column: 3 / 5;
    grid-row: 1;
}

.gc-post-media--8 .gc-post-media-item:nth-child(3) {
    grid-column: 3;
    grid-row: 2;
}

.gc-post-media--8 .gc-post-media-item:nth-child(4) {
    grid-column: 4;
    grid-row: 2;
}

.gc-post-media--8 .gc-post-media-item:nth-child(5) {
    grid-column: 1;
    grid-row: 3;
}

.gc-post-media--8 .gc-post-media-item:nth-child(6) {
    grid-column: 2;
    grid-row: 3;
}

.gc-post-media--8 .gc-post-media-item:nth-child(7) {
    grid-column: 3;
    grid-row: 3;
}

.gc-post-media--8 .gc-post-media-item:nth-child(8) {
    grid-column: 4;
    grid-row: 3;
}

.gc-post-media--9 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.gc-post-media--9 .gc-post-media-item:nth-child(1) {
    grid-column: 1 / 3;
    grid-row: 1;
}

.gc-post-media--9 .gc-post-media-item:nth-child(2) {
    grid-column: 3 / 5;
    grid-row: 1;
}

.gc-post-media--9 .gc-post-media-item:nth-child(3) {
    grid-column: 1;
    grid-row: 2;
}

.gc-post-media--9 .gc-post-media-item:nth-child(4) {
    grid-column: 2;
    grid-row: 2;
}

.gc-post-media--9 .gc-post-media-item:nth-child(5) {
    grid-column: 3;
    grid-row: 2;
}

.gc-post-media--9 .gc-post-media-item:nth-child(6) {
    grid-column: 4;
    grid-row: 2;
}

.gc-post-media--9 .gc-post-media-item:nth-child(7) {
    grid-column: 1;
    grid-row: 3;
}

.gc-post-media--9 .gc-post-media-item:nth-child(8) {
    grid-column: 2;
    grid-row: 3;
}

.gc-post-media--9 .gc-post-media-item:nth-child(9) {
    grid-column: 3 / 5;
    grid-row: 3;
}

.gc-post-media--10 {
    grid-template-columns: repeat(4, minmax(0, 1fr));
}

.gc-post-media--10 .gc-post-media-item:nth-child(1) {
    grid-column: 1 / 3;
    grid-row: 1 / 3;
}

.gc-post-media--10 .gc-post-media-item:nth-child(2) {
    grid-column: 3 / 5;
    grid-row: 1;
}

.gc-post-media--10 .gc-post-media-item:nth-child(3) {
    grid-column: 3;
    grid-row: 2;
}

.gc-post-media--10 .gc-post-media-item:nth-child(4) {
    grid-column: 4;
    grid-row: 2;
}

.gc-post-media--10 .gc-post-media-item:nth-child(5) {
    grid-column: 1;
    grid-row: 3;
}

.gc-post-media--10 .gc-post-media-item:nth-child(6) {
    grid-column: 2;
    grid-row: 3;
}

.gc-post-media--10 .gc-post-media-item:nth-child(7) {
    grid-column: 3;
    grid-row: 3;
}

.gc-post-media--10 .gc-post-media-item:nth-child(8) {
    grid-column: 4;
    grid-row: 3;
}

.gc-post-media--10 .gc-post-media-item:nth-child(9) {
    grid-column: 1 / 3;
    grid-row: 4;
}

.gc-post-media--10 .gc-post-media-item:nth-child(10) {
    grid-column: 3 / 5;
    grid-row: 4;
}

.gc-post-media-blur {
    position: absolute;
    inset: 0;
    overflow: hidden;
}

.gc-post-media-blur img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: blur(18px);
    transform: scale(1.12);
    opacity: 0.9;
}

.gc-post-media-item::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, color-mix(in srgb, var(--fill-emphasis) 6%, transparent), color-mix(in srgb, var(--fill-emphasis) 12%, transparent));
    pointer-events: none;
}

.gc-post-media-image {
    position: absolute;
    inset: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    cursor: zoom-in;
    transition-property: transform;
    transition-duration: var(--transition-base);
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
}

.gc-post-media-item:hover .gc-post-media-image {
    transform: scale(1.02);
}

.gc-post-media--1 .gc-post-media-item:hover .gc-post-media-image {
    transform: none;
}

/* Оверлей "+N" для 4+ фото */
.gc-post-media-more {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--fill-emphasis) 55%, transparent);
    color: var(--text-on-solid);
    font-size: var(--font-size-24);
    font-weight: 700;
    pointer-events: none;
}

/* ========================================
   Post Footer — Telegram-стиль
   Реакции слева, счётчики справа
   ======================================== */

.gc-post-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    padding: var(--space-2) var(--space-4) var(--space-4);
    min-height: 44px;
}

/* Реакции (чипы + триггер + picker) */
.gc-post-chips {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-1-5);
    align-items: center;
    position: relative;
}

.gc-post-chip {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: var(--space-1);
    padding: var(--space-1) var(--space-2);
    min-height: 28px;
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-full);
    background: transparent;
    font-size: var(--font-size-13);
    color: var(--text-secondary);
    cursor: pointer;
    line-height: 1;
    transition-property: background-color, color, border-color, transform;
    transition-duration: var(--transition-fast);
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
    font-family: inherit;
}

.gc-post-chip:hover:not(:disabled) {
    background: var(--surface-interaction-control-hover);
    color: var(--text-primary);
}

.gc-post-chip:active:not(:disabled) {
    transform: scale(0.96);
}

.gc-post-chip:disabled {
    cursor: default;
    opacity: 1;
}

.gc-post-chip--active {
    background: var(--fill-primary);
    border-color: var(--fill-primary);
    color: var(--text-on-fill-primary);
}

.gc-post-chip--active .gc-post-chip-count {
    color: var(--text-on-fill-primary);
    font-weight: 600;
}

.gc-post-chip--active:hover:not(:disabled) {
    background: var(--gc-btn-primary-hover-bg);
    border-color: var(--gc-btn-primary-hover-bg);
    color: var(--text-on-fill-primary);
}

.gc-post-chip--pop {
    animation: gc-post-reaction-pop 420ms cubic-bezier(0.34, 1.56, 0.64, 1);
    transform-origin: center bottom;
}

.gc-post-chip--pop .gc-post-chip-emoji {
    display: inline-block;
    animation: gc-post-reaction-emoji-bounce 420ms cubic-bezier(0.34, 1.56, 0.64, 1);
    transform-origin: center;
}

@keyframes gc-post-reaction-pop {
    0% {
        transform: scale(0.45);
        opacity: 0;
    }
    55% {
        transform: scale(1.16);
        opacity: 1;
    }
    78% {
        transform: scale(0.94);
    }
    100% {
        transform: scale(1);
        opacity: 1;
    }
}

@keyframes gc-post-reaction-emoji-bounce {
    0% {
        transform: scale(0.4) rotate(-22deg);
    }
    40% {
        transform: scale(1.4) rotate(14deg);
    }
    68% {
        transform: scale(0.9) rotate(-8deg);
    }
    100% {
        transform: scale(1) rotate(0deg);
    }
}

/* «+» реакции — GcBtn. Класс для пилюли и поворота иконки. */
.gc-post-footer-actions {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-1-5);
    min-width: 0;
}

.gc-post-comment-count {
    font-variant-numeric: tabular-nums;
}

.gc-post-footer-actions > .gc-btn > i,
.gc-post-chips > .gc-btn > i {
    font-size: var(--font-size-16);
}

/* Пилюля футера: комментарии, «+», текст «Подробнее». Светлее panel — subtle, не elevated.
 * shadcn-vibe: muted secondary fill, named transitions + press scale от .gc-btn. */
.gc-btn.gc-post-comment-btn,
.gc-btn.gc-post-reaction-trigger {
    background-color: var(--surface-subtle);
    color: var(--text-secondary);
    border-radius: var(--radius-full);
    flex-shrink: 0;
    transition-property: transform, background-color, color, border-color, box-shadow;
    transition-duration: var(--transition-fast);
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
}

.gc-btn.gc-post-comment-btn:is(:hover, :focus-visible, :active),
.gc-btn.gc-post-reaction-trigger:is(:hover, :focus-visible, :active, [aria-expanded="true"]),
html.gc-touch-scrolling .gc-btn.gc-post-comment-btn:is(:hover, :active),
html.gc-touch-scrolling .gc-btn.gc-post-reaction-trigger:is(:hover, :active, [aria-expanded="true"]) {
    background-color: var(--surface-interaction-control-hover);
    color: var(--text-primary);
}

.gc-btn.gc-post-reaction-trigger[aria-busy="true"] {
    opacity: 1;
    cursor: progress;
}

.gc-post-reaction-trigger-emoji,
.gc-post-reaction-trigger-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-16);
    line-height: 1;
    color: inherit;
    transition-property: transform;
    transition-duration: 150ms;
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
}

.gc-post-reaction-trigger[aria-expanded="true"] .gc-post-reaction-trigger-icon {
    transform: rotate(45deg);
}

.gc-post-reaction-trigger:active .gc-post-reaction-trigger-icon {
    transform: scale(0.88);
}

.gc-post-reaction-trigger[aria-expanded="true"]:active .gc-post-reaction-trigger-icon {
    transform: rotate(45deg) scale(0.88);
}

.gc-post-chip-emoji {
    font-size: var(--font-size-16);
    line-height: 1;
}

.gc-post-chip-count {
    font-size: var(--font-size-13);
    font-weight: 500;
    min-width: 0.5em;
    font-variant-numeric: tabular-nums;
}

.gc-post-footer--feed {
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 0;
    min-height: 0;
}

.gc-post-footer-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    min-width: 0;
    padding: var(--space-1) var(--space-4) var(--space-4);
}

.gc-post-header + .gc-post-footer--feed .gc-post-footer-top {
    padding-top: 0;
}

.gc-post-media + .gc-post-footer--feed .gc-post-footer-top {
    padding-top: var(--space-2);
}

/* Body уже даёт space/3 снизу; + space/1 сверху футера ≈ space/4 до CTA (ритм шапки). */

.gc-post-discussion-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
    width: 100%;
    min-height: 48px;
    margin-top: auto;
    padding: var(--space-2) var(--space-4);
    border-top: 1px solid var(--border-subtle);
    border-radius: 0;
    text-decoration: none;
    color: var(--text-secondary);
    font-size: var(--font-size-14);
    font-weight: 500;
    line-height: 1.2;
    transition-property: color, background-color;
    transition-duration: var(--transition-fast);
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
}

.gc-post-discussion-link:hover {
    background: color-mix(in srgb, var(--fill-primary) 6%, transparent);
    color: var(--text-primary);
}

.gc-post-discussion-link:active {
    background: color-mix(in srgb, var(--fill-primary) 10%, transparent);
}

.gc-post-discussion-link i {
    font-size: var(--font-size-16);
    flex-shrink: 0;
}

.gc-post-discussion-link__left {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    min-width: 0;
}

/* Скелетон ленты: та же сетка, что у ссылки «Обсуждение», без клика */
.gc-post-discussion-link--skeleton {
    pointer-events: none;
    cursor: default;
}

.gc-post-discussion-link--skeleton .gc-post-discussion-link__left {
    flex: 1;
    min-width: 0;
}

.gc-post-discussion-link--skeleton .gc-post-discussion-link__left .gc-skeleton {
    max-width: 12rem;
}

.gc-post-discussion-link-chev-skeleton {
    width: var(--font-size-16);
    height: var(--font-size-16);
    border-radius: var(--radius-8);
    flex-shrink: 0;
}

/* Счётчики справа: просмотры и время */
.gc-post-counters {
    display: flex;
    align-items: center;
    gap: var(--space-2);
    flex-shrink: 0;
    min-width: 0;
    margin-inline-start: auto;
}

.gc-post-stat {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    font-size: var(--font-size-13);
    color: var(--text-secondary);
    text-decoration: none;
}

.gc-post-stat i {
    font-size: var(--font-size-14);
}

/* Реакции-кнопки на детальной странице (крупнее) */
.gc-post-reactions {
    display: flex;
    flex-wrap: wrap;
    gap: var(--space-1);
}

.gc-post-reaction {
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    padding: var(--space-1-5) var(--space-3);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-full);
    background: transparent;
    font-size: var(--font-size-14);
    color: var(--text-secondary);
    cursor: pointer;
    line-height: 1;
    transition-property: background-color, color, border-color, transform;
    transition-duration: var(--transition-fast);
    transition-timing-function: cubic-bezier(0.2, 0, 0, 1);
    font-family: inherit;
}

.gc-post-reaction:hover {
    background: color-mix(in srgb, var(--fill-primary) 6%, transparent);
    border-color: var(--border-default);
}

.gc-post-reaction:active:not(:disabled) {
    transform: scale(0.96);
}

.gc-post-reaction--active {
    background: rgba(var(--accent-link-rgb), 0.12);
    border-color: var(--accent-link);
    color: var(--accent-link);
}

.gc-post-reaction:disabled {
    cursor: default;
    opacity: 0.6;
}

.gc-post-reaction-emoji {
    font-size: 18px;
}

.gc-post-reaction-count {
    font-weight: 500;
    min-width: 12px;
}

/* Детальная статистика */
.gc-post-stats-detail {
    display: flex;
    gap: var(--space-4);
}

.gc-post-stats-detail .gc-post-stat {
    font-size: var(--font-size-14);
}

.gc-post-stats-detail .gc-post-stat i {
    font-size: var(--font-size-base);
}

/* ========================================
   Comments Section
   ======================================== */

/* Секция комментариев — отдельный блок в паттерне проекта */
.gc-post-comments {
    background: transparent;
    border: 0;
    border-radius: 0;
    overflow: visible;
}

.gc-post-comments-header {
    padding: 0 0 var(--space-2);
    border: 0;
    background: transparent;
}

.gc-post-comments-header h4 {
    margin: 0;
    font-size: var(--font-size-base);
    font-weight: 500;
    color: var(--text-primary);
}

.gc-post-comments-body {
    padding: 0 0 var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

/* Comment Compose */
.gc-comment-compose {
    display: flex;
    gap: var(--space-2);
    align-items: flex-start;
}

.gc-comment-compose-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.gc-comment-compose-avatar {
    width: 36px;
    height: 36px;
    border-radius: var(--radius-full);
    object-fit: cover;
    flex-shrink: 0;
}

.gc-comment-compose-dock {
    position: fixed;
    left: var(--gc-comment-compose-left, 16px);
    width: min(var(--gc-comment-compose-width, calc(100vw - 32px)), 100vw - 32px);
    bottom: 0;
    z-index: 75;
    background: var(--surface-panel);
}

.gc-comment-compose-dock--floating {
    bottom: 16px;
    background: transparent;
}

.gc-comment-compose-shell {
    background: var(--surface-control);
    border: none;
    border-top: 1px solid var(--border-subtle);
    border-radius: 0;
    box-shadow: none;
}

.gc-comment-compose-shell--floating {
    background: var(--surface-panel);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-16);
    box-shadow: var(--shadow-lg);
}

.gc-comment-compose-skeleton {
    width: 100%;
    margin-top: var(--space-4);
}

.gc-comment-compose-skeleton .gc-comment-compose-field.gc-input-shell {
    min-height: 44px;
}

.gc-comment-compose--dock {
    padding: var(--space-2) var(--space-4);
    align-items: center;
}

.gc-comment-compose-field.gc-input-shell,
.gc-comment-reply-row.gc-input-shell {
    gap: var(--space-1);
    align-items: center;
    min-height: 44px;
    padding: 0 var(--space-1);
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.gc-comment-compose-field.gc-input-shell:focus-within,
.gc-comment-reply-row.gc-input-shell:focus-within {
    border: none;
    background: transparent;
    box-shadow: none;
}

.gc-comment-compose-entry textarea,
.gc-comment-compose-input__textarea {
    display: block;
    align-self: center;
    min-height: 22px !important;
    height: auto;
    padding: 11px 0 !important;
    border-radius: 0 !important;
    font-size: var(--font-size-14) !important;
    line-height: 1.4;
    resize: none;
    overflow-y: hidden;
    flex: 1;
    border: none !important;
    background: transparent !important;
    box-shadow: none !important;
}

.gc-comment-reply-send.gc-post-compose-send {
    flex-shrink: 0;
    width: 44px;
    min-width: 44px;
    height: 44px;
    margin-bottom: 0;
    border-radius: 0 !important;
    background: transparent;
    color: var(--text-secondary);
}

.gc-comment-reply-send.gc-post-compose-send:hover:not(:disabled) {
    background: color-mix(in srgb, var(--fill-primary) 6%, transparent);
    color: var(--text-primary);
}

.gc-comment-form-status {
    min-height: 18px;
    margin: 0;
    padding-left: 0;
}

.gc-comment-form-status:empty {
    display: none;
}

.gc-comment-reply-preview {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-2);
    padding: var(--space-2);
    border-left: 2px solid rgba(var(--accent-link-rgb), 0.45);
    border-radius: var(--radius-8);
    background: var(--surface-control);
}

.gc-comment-reply-preview-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

.gc-comment-reply-preview-label,
.gc-comment-reply-preview-author {
    font-size: var(--font-size-13);
    line-height: 1.3;
}

.gc-comment-reply-preview-label {
    color: var(--text-secondary);
}

.gc-comment-reply-preview-author {
    color: var(--accent-link);
    font-weight: 500;
}

.gc-comment-reply-preview-text {
    margin: 0;
    font-size: var(--font-size-14);
    line-height: 1.4;
    color: var(--text-secondary);
    white-space: pre-wrap;
    word-wrap: break-word;
}

.gc-comment-reply-preview-close {
    width: 28px;
    min-width: 28px;
    height: 28px;
    border: none;
    border-radius: var(--radius-full);
    background: transparent;
    color: var(--text-secondary);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}

.gc-comment-reply-preview-close:hover {
    background: color-mix(in srgb, var(--fill-primary) 6%, transparent);
    color: var(--text-primary);
}

/* ========================================
   Comment Thread
   Паттерн Telegram: bubble-style
   ======================================== */

.gc-comment {
    display: flex;
    gap: var(--space-2);
    align-items: flex-end;
}

.post-comments__list {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.post-comments__list > .gc-comment + .gc-comment {
    margin-top: 0;
    padding-top: 0;
    border-top: none;
}

.gc-comment-main {
    flex: 1;
    min-width: 0;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    align-items: flex-start;
}

.gc-comment-row {
    width: auto;
    max-width: min(82%, 720px);
    display: inline-flex;
    align-items: flex-start;
    position: relative;
    padding-right: calc(var(--space-1) + var(--space-8));
}

.gc-comment-bubble {
    position: relative;
    background: var(--surface-panel);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-16) var(--radius-16) var(--radius-16) var(--radius-8);
    padding: var(--space-2);
    display: block;
    width: auto;
    min-width: 0;
    max-width: 100%;
}

.gc-comment-author {
    display: block;
    font-weight: 500;
    font-size: var(--font-size-14);
    line-height: 1.3;
    color: var(--accent-link);
    text-decoration: none;
    margin: 0;
}

.gc-comment-author:hover {
    color: var(--accent-link-hover);
}

.gc-comment-quote {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    margin: var(--space-1) 0;
    padding: var(--space-2);
    border-left: 2px solid rgba(var(--accent-link-rgb), 0.45);
    border-radius: var(--radius-8);
    background: var(--surface-control);
}

.gc-comment-quote--interactive {
    cursor: pointer;
    transition: background-color var(--transition-fast), border-color var(--transition-fast);
}

.gc-comment-quote--interactive:hover,
.gc-comment-quote--interactive:focus-visible {
    background: color-mix(in srgb, var(--fill-primary) 6%, transparent);
    border-left-color: rgba(var(--accent-link-rgb), 0.8);
    outline: none;
}

.gc-comment-quote-author {
    font-size: var(--font-size-13);
    font-weight: 500;
    line-height: 1.3;
    color: var(--accent-link);
    text-decoration: none;
}

.gc-comment-quote-author:hover {
    color: var(--accent-link-hover);
}

.gc-comment-quote-text {
    margin: 0;
    font-size: var(--font-size-13);
    line-height: 1.4;
    color: var(--text-secondary);
    white-space: pre-wrap;
    word-wrap: break-word;
}

.gc-comment--quoted-target .gc-comment-bubble {
    box-shadow: 0 0 0 1px rgba(var(--accent-link-rgb), 0.6);
    background: color-mix(in srgb, var(--surface-panel) 88%, rgba(var(--accent-link-rgb), 0.12));
}

.gc-comment-bodyline {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: end;
    column-gap: var(--space-2);
}

.gc-comment-meta {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end;
    width: auto;
    gap: var(--space-2);
    margin: 0;
    padding: 0;
    flex-wrap: nowrap;
    align-self: end;
}

.gc-comment-time,
.gc-comment-meta .gc-post-edited {
    font-size: var(--font-size-13);
    line-height: 1;
    color: var(--text-secondary);
    white-space: nowrap;
}

.gc-comment-reply-btn {
    border: none;
    background: transparent;
    padding: 0;
    font-size: var(--font-size-13);
    line-height: 1;
    color: var(--text-secondary);
    cursor: pointer;
}

.gc-comment-reply-btn:hover {
    color: var(--text-primary);
}

.gc-comment-menu {
    position: absolute;
    top: var(--space-product-2);
    right: var(--space-1);
}

.gc-comment-menu > .gc-dropdown-toggle {
    opacity: 0;
    pointer-events: none;
    transform: translateY(var(--space-product-2));
    transition: opacity var(--transition-fast), transform var(--transition-fast);
}

.gc-comment:hover .gc-comment-menu > .gc-dropdown-toggle,
.gc-comment:focus-within .gc-comment-menu > .gc-dropdown-toggle {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}

@media (hover: none) {
    .gc-comment-menu > .gc-dropdown-toggle {
        opacity: 1;
        pointer-events: auto;
        transform: none;
    }
}

.gc-comment-text {
    display: block;
    font-size: var(--font-size-15);
    line-height: 1.5;
    color: var(--text-primary);
    white-space: pre-wrap;
    word-wrap: break-word;
    margin: 0;
    min-width: 0;
}

.gc-comment-text:last-child {
    margin-bottom: 0;
}

/* ========================================
   Comment thread — Reddit-style (PostShow)
   ======================================== */

.gc-post-comments--thread .gc-post-comments-body {
    gap: var(--space-4);
    padding-top: 0;
    border-top: none;
}

.gc-comment-compose-root {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.gc-comment-composer {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

/* Пилюля в покое. При фокусе вниз выезжают только кнопки, углы с половины высоты до radius/16. */
.gc-comment-composer__box.gc-input-shell {
    --gc-comment-composer-line: calc(var(--font-size-14) * 1.4);
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    height: auto;
    min-height: var(--gc-input-min-height);
    padding: var(--space-2) var(--gc-input-padding-x, var(--space-4));
    overflow: hidden;
    border-radius: calc(var(--gc-input-min-height) / 2);
    cursor: text;
    transition:
        border-color var(--transition-base) var(--ease-out),
        box-shadow var(--transition-base) var(--ease-out),
        background-color var(--transition-base) var(--ease-out),
        border-radius var(--transition-base) var(--ease-out);
}

.gc-comment-composer--active .gc-comment-composer__box.gc-input-shell {
    border-radius: var(--radius-16);
    cursor: auto;
}

.gc-comment-composer__textarea {
    display: block;
    width: 100%;
    min-width: 0;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    outline: none;
    resize: none;
    color: var(--gc-input-fg, var(--text-primary));
    font-family: inherit;
    font-size: var(--font-size-14);
    line-height: 1.4;
    padding: 0;
    height: auto;
    min-height: var(--gc-comment-composer-line);
    overflow: hidden;
    field-sizing: fixed;
}

.gc-comment-composer__textarea::placeholder {
    color: var(--gc-input-placeholder, var(--text-tertiary));
    line-height: inherit;
}

.gc-comment-composer--idle .gc-comment-composer__textarea {
    flex: 0 0 auto;
    margin-block: auto;
}

.gc-comment-composer__actions {
    display: grid;
    grid-template-rows: 0fr;
    min-height: 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition:
        grid-template-rows var(--transition-base) var(--ease-out),
        opacity var(--transition-base) var(--ease-out),
        visibility 0s linear var(--transition-base);
}

.gc-comment-composer--active .gc-comment-composer__actions {
    grid-template-rows: 1fr;
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition:
        grid-template-rows var(--transition-base) var(--ease-out),
        opacity var(--transition-base) var(--ease-out),
        visibility 0s linear 0s;
}

.gc-comment-composer__actions-inner {
    min-height: 0;
    overflow: hidden;
}

.gc-comment-composer__actions-row {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: var(--space-2);
    padding-top: var(--space-2);
}

/*
 * Comment tree (PostShow) — gc-ctree*
 * На посте первый уровень; дискуссия — один отступ со скруглённым └.
 *
 * [av] author · time
 *  │   text
 *  −   +  Ответить  ⋯
 *  ╰─  [av] reply
 */
.gc-ctree-list {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

.gc-ctree {
    --gc-ctree-gutter: 28px;
    --gc-ctree-gap: var(--space-2);
    --gc-ctree-line: 1px;
    --gc-ctree-corner: var(--radius-8);
    --gc-ctree-elbow-gap: var(--space-2);
    --gc-ctree-stub: calc((var(--gc-ctree-gutter) / 2) + var(--gc-ctree-gap));
    --gc-ctree-line-color: var(--border-default);
    --gc-ctree-toggle-color: var(--text-primary);
    --gc-ctree-rail-end: 0px;
    display: grid;
    grid-template-columns: var(--gc-ctree-gutter) minmax(0, 1fr);
    column-gap: var(--gc-ctree-gap);
    grid-auto-flow: row;
    width: 100%;
    min-width: 0;
    align-items: stretch;
}

.gc-ctree__avatar {
    grid-column: 1;
    justify-self: center;
    width: var(--gc-ctree-gutter);
    height: var(--gc-ctree-gutter);
}

.gc-ctree__meta {
    grid-column: 2;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-1) var(--space-1-5);
    min-height: var(--gc-ctree-gutter);
}

.gc-ctree__author {
    font-size: var(--font-size-13);
    font-weight: 600;
    color: var(--text-primary);
    text-decoration: none;
}

.gc-ctree__author:hover {
    color: var(--accent-link);
}

.gc-ctree__dot {
    color: var(--text-secondary);
    font-size: var(--font-size-12);
    user-select: none;
}

.gc-ctree__time,
.gc-ctree__edited {
    font-size: var(--font-size-12);
    color: var(--text-secondary);
}

.gc-ctree__more {
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: var(--accent-link);
    font-size: var(--font-size-12);
    font-weight: 500;
    cursor: pointer;
}

.gc-ctree__more:hover {
    text-decoration: underline;
}

/* Сегменты линии в gutter: текст → −/Ответить → reply → kids */
.gc-ctree__text-spine,
.gc-ctree__action-spine,
.gc-ctree__reply-spine {
    grid-column: 1;
    position: relative;
    justify-self: stretch;
}

.gc-ctree__action-spine {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: var(--gc-btn-sm-min-height);
}

.gc-ctree__mid-line {
    position: absolute;
    top: 0;
    bottom: 0;
    left: calc(50% - (var(--gc-ctree-line) / 2));
    width: var(--gc-ctree-line);
    background: var(--gc-ctree-line-color);
    pointer-events: none;
}

/*
 * Reddit-узел: тёмное кольцо + белая заливка + тёмный −.
 * Линия за ним серая; кольцо не наследует цвет линии.
 */
.gc-ctree__toggle {
    --gc-ctree-toggle-size: 16px;
    --gc-ctree-toggle-stroke: 1.5px;
    --gc-ctree-toggle-arm: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--gc-ctree-toggle-size);
    height: var(--gc-ctree-toggle-size);
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    border: 2px solid var(--gc-ctree-toggle-color);
    border-radius: var(--radius-full);
    background: var(--surface-page);
    color: var(--gc-ctree-toggle-color);
    cursor: pointer;
    flex-shrink: 0;
    z-index: 1;
    position: relative;
}

.gc-ctree__toggle-mark,
.gc-ctree__toggle-mark::after {
    position: absolute;
    left: 50%;
    top: 50%;
    background: currentColor;
    border-radius: 1px;
    transform: translate(-50%, -50%);
    pointer-events: none;
}

.gc-ctree__toggle-mark {
    width: var(--gc-ctree-toggle-arm);
    height: var(--gc-ctree-toggle-stroke);
}

.gc-ctree__toggle[aria-expanded="false"] .gc-ctree__toggle-mark::after {
    content: '';
    width: var(--gc-ctree-toggle-stroke);
    height: var(--gc-ctree-toggle-arm);
}

.gc-ctree__toggle:hover {
    background: var(--surface-page);
    border-color: var(--gc-ctree-toggle-color);
    color: var(--gc-ctree-toggle-color);
    outline: none;
}

.gc-ctree__toggle:focus-visible {
    background: var(--surface-page);
    border-color: var(--gc-ctree-toggle-color);
    color: var(--gc-ctree-toggle-color);
    outline: var(--gc-focus-outline);
    outline-offset: var(--gc-focus-outline-offset);
}

.gc-ctree__text {
    grid-column: 2;
    margin: 0;
    padding-bottom: var(--space-1);
    font-size: var(--font-size-14);
    line-height: 1.5;
    color: var(--text-primary);
    min-width: 0;
}

.gc-ctree__actions {
    grid-column: 2;
    display: flex;
    align-items: center;
    gap: var(--space-1);
    min-height: var(--gc-btn-sm-min-height);
    overflow: visible;
}

/*
 * Оптика как у Reddit: в статике край глифа/текста = край текста комментария.
 * Hit-area кнопки уходит влево за счёт отрицательного margin (= padding кнопки).
 */
.gc-ctree__actions > .gc-btn.gc-btn-sm:first-child,
.gc-ctree__actions > .gc-ctree__react:first-child > .gc-btn.gc-btn-sm {
    margin-inline-start: calc(-1 * var(--gc-btn-padding-x-sm));
}

.gc-ctree__actions > .gc-ctree__react:first-child > .gc-btn.gc-btn-icon-sm {
    margin-inline-start: calc(-1 * (var(--gc-btn-sm-min-height) - 1em) / 2);
}

.gc-ctree__actions > .gc-dropdown:first-child > .gc-btn.gc-btn-icon-sm {
    margin-inline-start: calc(-1 * (var(--gc-btn-sm-min-height) - 1em) / 2);
}

.gc-ctree__actions > .gc-dropdown:first-child > .gc-btn.gc-btn-sm:not(.gc-btn-icon-sm) {
    margin-inline-start: calc(-1 * var(--gc-btn-padding-x-sm));
}

/* Пикер позиционируется от ghost «+». */
.gc-ctree__react {
    position: relative;
    display: inline-flex;
    align-items: center;
    flex-shrink: 0;
}

.gc-ctree__actions > .gc-post-chips--in-actions {
    flex: 0 1 auto;
    min-width: 0;
    gap: var(--space-1);
}

/* Одна семья: ghost «+» / «Ответить» + icon-ghost ⋯ */
.gc-ctree__actions > .gc-btn.gc-btn-ghost,
.gc-ctree__actions > .gc-ctree__react > .gc-btn.gc-btn-ghost,
.gc-ctree__actions > .gc-dropdown > .gc-btn.gc-btn-ghost {
    color: var(--text-secondary);
}

.gc-ctree__actions > .gc-btn.gc-btn-ghost:is(:hover, :focus-visible),
.gc-ctree__actions > .gc-ctree__react > .gc-btn.gc-btn-ghost:is(:hover, :focus-visible, [aria-expanded="true"]),
.gc-ctree__actions > .gc-dropdown > .gc-btn.gc-btn-ghost:is(:hover, :focus-visible, [aria-expanded="true"]) {
    color: var(--text-primary);
}

.gc-ctree__reply {
    grid-column: 2;
    margin-top: var(--space-2);
    min-width: 0;
}

/* Вертикаль через ответы; высота = --gc-ctree-rail-end (до центра последней) */
.gc-ctree__branch-rail {
    grid-column: 1;
    justify-self: center;
    width: 18px;
    height: 100%;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
    position: relative;
}

.gc-ctree__branch-rail::before {
    content: '';
    position: absolute;
    top: 0;
    left: calc(50% - (var(--gc-ctree-line) / 2));
    width: var(--gc-ctree-line);
    height: var(--gc-ctree-rail-end);
    background: var(--gc-ctree-line-color);
    pointer-events: none;
}

/* Только своя ветка — не :has(.…) по потомкам, иначе дочка подсвечивает родителя */
.gc-ctree:has(> .gc-ctree__branch-rail:hover),
.gc-ctree:has(> .gc-ctree__branch-rail:focus-visible),
.gc-ctree:has(> .gc-ctree__action-spine > .gc-ctree__toggle:hover),
.gc-ctree:has(> .gc-ctree__action-spine > .gc-ctree__toggle:focus-visible) {
    --gc-ctree-line-color: var(--text-primary);
}

.gc-ctree__branch-rail:focus-visible {
    outline: none;
}

.gc-ctree__replies {
    grid-column: 2;
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    /* padding, не margin — иначе rail и mid-line расходятся */
    padding-top: var(--space-3);
    min-width: 0;
}

.gc-ctree__kid {
    position: relative;
}

/*
 * └ : четверть кольца + горизонтальный stub с зазором до аватара.
 * Правую половину круга клипаем — иначе на горизонтали шип вверх.
 * Прямой rail (--gc-ctree-rail-end) останавливается у верха дуги.
 */
.gc-ctree__elbow {
    position: absolute;
    left: calc(-1 * var(--gc-ctree-stub));
    top: calc((var(--gc-ctree-gutter) / 2) - var(--gc-ctree-corner));
    width: calc(var(--gc-ctree-stub) - var(--gc-ctree-elbow-gap));
    height: var(--gc-ctree-corner);
    overflow: hidden;
    pointer-events: none;
    z-index: 1;
}

.gc-ctree__elbow::before {
    content: '';
    position: absolute;
    left: calc(var(--gc-ctree-line) / -2);
    top: calc(-1 * var(--gc-ctree-corner));
    width: calc(var(--gc-ctree-corner) * 2);
    height: calc(var(--gc-ctree-corner) * 2);
    box-sizing: border-box;
    border: var(--gc-ctree-line) solid var(--gc-ctree-line-color);
    border-radius: 50%;
    /* только нижняя-левая четверть (правая даёт ответвление вверх) */
    clip-path: inset(0 50% 0 0);
}

.gc-ctree__elbow::after {
    content: '';
    position: absolute;
    left: calc(var(--gc-ctree-corner) - var(--gc-ctree-line));
    right: 0;
    bottom: 0;
    height: var(--gc-ctree-line);
    background: var(--gc-ctree-line-color);
}

.gc-post-thread-comments {
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

@media (max-width: 768px) {
    .gc-post--thread > .gc-post-title,
    .gc-post--thread .gc-post-title {
        font-size: var(--font-size-20);
    }

    .gc-post-thread-shell--detail {
        max-width: none;
    }
}

/* Аватар в комментарии (32px) */
.gc-comment-avatar {
    width: 36px;
    height: 36px;
    border-radius: var(--radius-full);
    object-fit: cover;
    flex-shrink: 0;
    margin-top: 0;
    align-self: flex-end;
}

/* Empty state */
.gc-post-comments-empty {
    text-align: center;
    padding: var(--space-8) 0 calc(var(--space-8) + var(--space-2));
    color: var(--text-secondary);
}

.gc-post-comments-empty i {
    font-size: 40px;
    opacity: 0.3;
    display: block;
    margin-bottom: var(--space-2);
}

/* ========================================
   Post Form — create / edit
   ======================================== */

.gc-post-form-editor {
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-16);
    background: var(--surface-control);
    padding: var(--space-2);
    min-height: 180px;
}

/* Editor height rules migrated to `public/css/tiptap-editor.css` */

.gc-post-form-media-actions {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: var(--space-1);
}

.gc-post-form-notify {
    display: inline-flex;
    align-items: flex-start;
    gap: var(--space-2);
    color: var(--text-primary);
    font-size: var(--font-size-14);
    line-height: 1.45;
}

.gc-post-form-notify input {
    margin-top: 2px;
}

/* ========================================
   Feed-level: Quick Post Compose
   Telegram-style: аватар + rounded input
   ======================================== */

.gc-post-compose {
    padding: 0;
}

.gc-post-compose-body {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
}

/* Превью загруженных фото */
.gc-post-compose-photos {
    display: none;
    flex-direction: column;
    gap: var(--space-1);
}

.gc-post-compose-form--stacked .gc-post-compose-photos {
    gap: var(--space-4);
}

.gc-post-compose-photos.has-photos {
    display: flex;
}

.gc-post-compose-photos-grid {
    display: none;
}

.gc-post-compose-photos.has-grid .gc-post-compose-photos-grid {
    display: grid;
}

/* Сетка миниатюр на странице редактирования поста (не как в ленте) */
.gc-post-compose-photos.has-grid .gc-post-compose-photos-grid:not(.gc-post-media) {
    grid-template-columns: repeat(auto-fill, minmax(72px, 1fr));
    gap: var(--space-1);
}

/* Превью при создании поста: та же вёрстка, что у опубликованного поста */
.gc-post-compose-photos-grid.gc-post-compose-media-preview {
    border-radius: var(--radius-16);
}

.gc-post-compose-media-preview .gc-post-compose-media-preview-image {
    cursor: default;
    pointer-events: none;
}

.gc-post-compose-media-preview .gc-post-media-item:hover .gc-post-compose-media-preview-image {
    transform: none;
}

.gc-post-compose-media-preview-remove {
    position: absolute;
    top: var(--space-1);
    right: var(--space-1);
    z-index: 3;
    width: 28px;
    height: 28px;
    padding: 0;
    border: none;
    border-radius: var(--radius-full);
    background: color-mix(in srgb, var(--fill-emphasis) 65%, transparent);
    color: var(--text-on-solid);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-14);
    line-height: 1;
    transition: background var(--transition-fast);
}

.gc-post-compose-media-preview-remove:hover {
    background: var(--danger-color);
}

.gc-post-compose-media-preview-remove i {
    font-size: var(--font-size-base);
    line-height: 1;
}

.gc-post-compose-progress {
    display: none;
    flex-direction: column;
    gap: 6px;
    padding: var(--space-1);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-8);
    background: var(--surface-control);
}

.gc-post-compose-progress.is-visible {
    display: flex;
}

.gc-post-compose-progress-track {
    position: relative;
    width: 100%;
    height: 6px;
    overflow: hidden;
    border-radius: var(--radius-full);
    background: var(--surface-control);
}

.gc-post-compose-progress-bar {
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: var(--accent-link);
    transition: width 180ms ease;
}

.gc-post-compose-progress-text {
    margin: 0;
    font-size: var(--font-size-13);
    line-height: 1.4;
    color: var(--text-secondary);
}

/* Посты: локальные тексты прогресса не показываем (оставляем только top-loader) */
.gc-post-compose-progress-text {
    display: none;
}

.gc-post-compose-progress.is-indeterminate .gc-post-compose-progress-bar {
    width: 38%;
    animation: gc-post-compose-progress-indeterminate 1s ease-in-out infinite;
}

.gc-post-compose-progress.is-error .gc-post-compose-progress-bar {
    width: 100%;
    background: var(--danger-color);
}

.gc-post-compose-form--stacked .gc-post-compose-progress.is-visible {
    border: none;
    background: transparent;
    padding: 0;
    gap: var(--space-1);
}

.gc-post-compose-form--stacked .gc-post-compose-progress-track {
    height: var(--space-2);
}

.gc-post-compose-form--stacked .gc-post-compose-progress-bar {
    background: var(--gc-progress-fill);
}

.gc-post-compose-progress.is-error .gc-post-compose-progress-text {
    color: var(--danger-color);
}

@keyframes gc-post-compose-progress-indeterminate {
    0% {
        transform: translateX(-110%);
    }
    100% {
        transform: translateX(290%);
    }
}

.gc-post-compose-photo {
    position: relative;
    aspect-ratio: 1;
    border-radius: var(--radius-8);
    overflow: hidden;
    background: var(--surface-control);
}

.gc-post-compose-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.gc-post-compose-photo-remove {
    position: absolute;
    top: var(--space-1);
    right: var(--space-1);
    width: 22px;
    height: 22px;
    background: color-mix(in srgb, var(--fill-emphasis) 70%, transparent);
    border: none;
    border-radius: var(--radius-full);
    color: var(--text-on-solid);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    transition: background var(--transition-fast);
}

.gc-post-compose-photo-remove:hover {
    background: var(--danger-color);
}

.gc-post-compose-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-left: calc(36px + var(--space-2));
}

.gc-post-compose-attach {
    cursor: pointer;
}

.gc-post-compose-shell {
    box-shadow: none;
    background: var(--surface-control);
    border: none;
    border-top: 1px solid var(--border-subtle);
    border-radius: 0;
}

.gc-post-compose-shell--floating {
    background: var(--surface-panel);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-16);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
}

.gc-post-compose-dock:not(.gc-post-compose-dock--inline) {
    position: fixed;
    left: 50%;
    width: min(948px, calc(100vw - 48px));
    bottom: 0;
    z-index: 80;
    background: var(--surface-panel);
    transform: translateX(-50%);
    overflow: visible;
}

@media (min-width: 1280px) {
    .gc-post-compose-dock:not(.gc-post-compose-dock--inline) {
        width: max(
            0px,
            calc(
                min(100vw, var(--layout-page-max-width))
                - var(--layout-catalog-sidebar-width)
                - var(--layout-channel-sidebar-width)
                - (var(--space-2) * 2)
                - 32px
            )
        );
        transform: translateX(calc(
            -50%
            + ((var(--layout-catalog-sidebar-width) - var(--layout-channel-sidebar-width)) / 2)
        ));
    }

    /* Нет правого rail (закрепы / предстоящие) — не резервируем колонку и не сужаем док относительно неё */
    .channel-posts-layout--single .gc-post-compose-dock:not(.gc-post-compose-dock--inline) {
        width: max(
            0px,
            calc(
                min(100vw, var(--layout-page-max-width))
                - var(--layout-catalog-sidebar-width)
                - (var(--space-2) * 2)
                - 32px
            )
        );
        transform: translateX(-50%);
    }
}

.gc-post-compose-dock--floating {
    bottom: 16px;
    background: transparent;
}

/* Панель «Новый пост» — док внизу колонки ленты (sticky bottom на десктопе, fixed на адаптиве) */
.gc-posts-compose-panel {
    flex-shrink: 0;
    background: var(--surface-panel);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-16);
    overflow: hidden;
}

.channel-posts-main--with-compose {
    gap: var(--space-4);
    overflow-anchor: none;
}

.channel-feed-compose-flow {
    flex-shrink: 0;
    height: 0;
    margin-top: calc(-1 * var(--space-4));
    pointer-events: none;
    overflow: hidden;
    overflow-anchor: none;
}

/* Desktop ≥992: док — flex-обёртка sticky bottom; mobile <992 — fixed (media ниже) */
.channel-feed-mobile-dock {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    position: static;
    inset: auto;
    width: 100%;
    max-width: none;
    max-height: none;
    overflow: visible;
    padding: 0;
    margin: 0;
    border: none;
    border-radius: 0;
    box-shadow: none;
    background: transparent;
    transform: none;
    pointer-events: auto;
    contain: none;
    clip-path: none;
}

/* Inertia: форма нового поста — gc-panel, не comment-dock */
.gc-panel.gc-panel--secondary.channel-feed-compose,
.channel-feed-mobile-dock {
    --channel-feed-compose-dock-bg: var(--surface-secondary);
    --channel-feed-compose-lift-shadow: 0 calc(-1 * var(--space-2)) var(--space-8) color-mix(in srgb, var(--gray-1000) 50%, transparent);
    --channel-feed-compose-lift-shadow-compact:
        0 calc(-1 * var(--space-1)) var(--space-4) color-mix(in srgb, var(--fill-emphasis) 14%, transparent),
        0 var(--space-4) var(--space-12) color-mix(in srgb, var(--fill-emphasis) 24%, transparent);
}

.gc-panel.gc-panel--secondary.channel-feed-compose {
    --channel-feed-compose-line: calc(var(--font-size-16) * 1.5);
    --channel-feed-compose-avatar: 36px;
    --channel-feed-compose-sticky-top: var(--layout-context-rail-sticky-top);
    --compose-fold: 0;
    --compose-flow-shift: 0px;
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    flex-shrink: 0;
    overflow: hidden;
    overflow-anchor: none;
    overscroll-behavior: none;
    max-height: min(80dvh, 48rem);
    position: relative;
    top: auto;
    z-index: 1;
    border: 1px solid var(--border-subtle);
    transition:
        max-height var(--transition-slow) var(--ease-out),
        box-shadow var(--transition-slow) var(--ease-out),
        padding var(--transition-slow) var(--ease-out);
}

[data-theme="light"] .gc-panel.gc-panel--secondary.channel-feed-compose,
[data-theme="light"] .channel-feed-mobile-dock {
    --channel-feed-compose-lift-shadow: 0 calc(-1 * var(--space-2)) var(--space-8) color-mix(in srgb, var(--fill-emphasis) 14%, transparent);
    --channel-feed-compose-lift-shadow-compact:
        0 calc(-1 * var(--space-1)) var(--space-4) color-mix(in srgb, var(--fill-emphasis) 8%, transparent),
        0 var(--space-4) var(--space-12) color-mix(in srgb, var(--fill-emphasis) 14%, transparent);
}

@media (prefers-color-scheme: light) {
    :root:not([data-theme]) .gc-panel.gc-panel--secondary.channel-feed-compose,
    :root:not([data-theme]) .channel-feed-mobile-dock {
        --channel-feed-compose-lift-shadow: 0 calc(-1 * var(--space-2)) var(--space-8) color-mix(in srgb, var(--fill-emphasis) 14%, transparent);
        --channel-feed-compose-lift-shadow-compact:
            0 calc(-1 * var(--space-1)) var(--space-4) color-mix(in srgb, var(--fill-emphasis) 8%, transparent),
            0 var(--space-4) var(--space-12) color-mix(in srgb, var(--fill-emphasis) 14%, transparent);
    }
}


@media (min-width: 992px) {
    body.inertia-shell .channel-posts-main--with-compose {
        min-height: 100%;
        padding-bottom: var(--channel-feed-compose-dock-space, 0px);
    }

    .channel-posts-main--with-compose > .channel-feed-compose-flow,
    .channel-feed-mobile-dock > .channel-feed-compose-flow {
        display: none;
    }

    /* Фикс. хост: left/width синхронизируются с .channel-posts-main (JS) */
    .channel-feed-desktop-dock-host {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        position: fixed;
        bottom: var(--space-4);
        left: 0;
        right: auto;
        z-index: var(--z-fixed);
        box-sizing: border-box;
        width: 100%;
        padding: 0;
        pointer-events: none;
        overflow: visible;
        transform: none;
        background: transparent;
        transition: transform var(--transition-base) ease-out;
    }

    .channel-feed-desktop-dock-host.is-scroll-hidden {
        transform: translate3d(0, calc(100% + var(--space-8)), 0);
        pointer-events: none;
    }

    .channel-feed-desktop-dock-host.is-scroll-hidden > * {
        pointer-events: none;
    }

    .channel-feed-desktop-dock-host.is-visit-leaving {
        visibility: hidden;
        pointer-events: none;
    }

    .channel-feed-desktop-dock-host > .channel-feed-mobile-dock {
        pointer-events: auto;
        transform: none;
        flex: 0 0 auto;
        position: relative;
        z-index: 1;
    }

    .channel-feed-mobile-dock {
        --channel-feed-compose-dock-inset-x: var(--space-4);
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        margin-inline: 0;
        padding: 0;
        overflow: hidden;
        background: var(--channel-feed-compose-dock-bg, var(--surface-secondary));
        border: 1px solid var(--border-subtle);
        border-radius: var(--radius-16);
        box-shadow: var(--channel-feed-compose-lift-shadow);
        transform: none;
        transition: box-shadow var(--transition-slow) var(--ease-out);
    }

    /* Compact: заметнее в покое — тень карточки, без усиления границ при раскрытии */
    .channel-feed-mobile-dock.has-compose:has(.channel-feed-compose.is-compact) {
        background: var(--surface-panel);
        box-shadow: var(--channel-feed-compose-lift-shadow-compact);
    }

    /* Форма (+ закреп): чуть уже колонки постов, по центру */
    .channel-feed-mobile-dock.has-compose {
        box-sizing: border-box;
        width: calc(100% - (var(--channel-feed-compose-dock-inset-x) * 2));
        max-width: none;
        margin-inline: auto;
        align-self: center;
    }

    /* Отдельный закреп — плавающая карточка с отступами от краёв ленты. */
    .channel-feed-mobile-dock.has-pins:not(.has-compose) {
        box-sizing: border-box;
        width: calc(100% - (var(--space-3) * 2));
        max-width: none;
        margin-inline: auto;
        align-self: center;
        border-radius: var(--radius-16);
        border: 1px solid var(--border-subtle);
        box-shadow: var(--channel-feed-compose-lift-shadow);
    }

    /* compose + pins: одна карточка; закреп flush к краям dock */
    .channel-feed-mobile-dock.has-compose.has-pins {
        display: flex;
        flex-direction: column;
    }

    .channel-feed-mobile-dock.has-compose .gc-panel.gc-panel--secondary.channel-feed-compose {
        border: none;
        box-shadow: none !important;
        background: transparent;
        border-radius: 0;
    }

    .channel-feed-mobile-dock.has-compose.has-pins .gc-panel.gc-panel--secondary.channel-feed-compose {
        flex: 0 1 auto;
        border-radius: 0;
    }

    .channel-feed-mobile-dock .gc-mobile-nav-pinned-fixed {
        display: block !important;
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        width: 100%;
        max-width: none;
        margin: 0;
        transform: none;
        z-index: auto;
        padding: 0;
        background: transparent !important;
        box-shadow: none !important;
        border: none !important;
        border-radius: 0;
    }

    .channel-feed-mobile-dock.has-compose.has-pins .gc-mobile-nav-pinned-fixed {
        flex-shrink: 0;
        border-top: 1px solid var(--border-subtle) !important;
    }

    .channel-feed-mobile-dock .gc-mobile-nav-pinned-fixed .gc-mobile-nav-pinned {
        width: 100%;
        padding: 0;
        margin: 0;
    }

    /* Inset как у compose (space/3 space/4); перебивает navbar.css space/2 */
    .channel-feed-mobile-dock .gc-mobile-nav-pinned-fixed .channel-pinned-switcher {
        width: 100%;
        max-width: none;
        padding: var(--space-3) var(--space-4);
        gap: var(--space-2);
        border-radius: 0;
        box-sizing: border-box;
    }

    .channel-feed-mobile-dock.has-pins:not(.has-compose) .gc-mobile-nav-pinned-fixed {
        border-top: none !important;
    }

    .channel-feed-mobile-dock > .channel-feed-compose-flow,
    .channel-feed-mobile-dock > #photos-input,
    .channel-feed-mobile-dock > input[type="file"],
    .channel-feed-mobile-dock > .modal.gc-rich-editor-modal:not(.gc-modal-is-open) {
        display: none !important;
    }

    .channel-feed-mobile-dock .gc-panel.gc-panel--secondary.channel-feed-compose {
        display: flex;
        flex-direction: column;
        position: relative;
        left: auto;
        right: auto;
        top: auto;
        bottom: auto;
        box-sizing: border-box;
        width: 100%;
        max-width: none;
        margin-inline: 0;
        min-height: 0;
        max-height: min(70dvh, 48rem);
        z-index: auto;
        padding: var(--space-4);
        gap: var(--space-3);
        transform: none;
        transition:
            max-height var(--transition-slow) var(--ease-out),
            padding var(--transition-slow) var(--ease-out);
    }

    .channel-feed-mobile-dock.has-compose.has-pins .gc-panel.gc-panel--secondary.channel-feed-compose {
        max-height: min(calc(70dvh - 5.5rem), 48rem);
    }

    .channel-feed-mobile-dock .gc-panel.gc-panel--secondary.channel-feed-compose.is-compact {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        align-items: center;
        column-gap: var(--space-3);
        row-gap: 0;
        padding: var(--space-3) var(--space-4);
        min-height: calc(var(--space-3) * 2 + max(var(--channel-feed-compose-line), var(--channel-feed-compose-avatar)));
        max-height: calc(var(--space-3) * 2 + max(var(--channel-feed-compose-line), var(--channel-feed-compose-avatar)));
    }

    .channel-feed-mobile-dock.has-compose.has-pins .gc-panel.gc-panel--secondary.channel-feed-compose.is-compact {
        min-height: calc(var(--gc-mobile-bottom-nav-outer-height) - env(safe-area-inset-bottom, 0px));
        max-height: calc(var(--gc-mobile-bottom-nav-outer-height) - env(safe-area-inset-bottom, 0px));
    }

    .channel-feed-mobile-dock .gc-panel.gc-panel--secondary.channel-feed-compose:not(.is-compact),
    .channel-feed-mobile-dock .gc-panel.gc-panel--secondary.channel-feed-compose.is-editing {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        min-height: 0;
        padding: var(--space-4);
        gap: var(--space-3);
        max-height: min(70dvh, 48rem);
    }

    .channel-feed-mobile-dock.has-compose.has-pins .gc-panel.gc-panel--secondary.channel-feed-compose:not(.is-compact),
    .channel-feed-mobile-dock.has-compose.has-pins .gc-panel.gc-panel--secondary.channel-feed-compose.is-editing {
        max-height: min(calc(70dvh - 5.5rem), 48rem);
    }

    .channel-feed-mobile-dock .gc-panel.gc-panel--secondary.channel-feed-compose.is-compact .gc-panel-title {
        display: none;
    }

    .channel-feed-mobile-dock .gc-panel.gc-panel--secondary.channel-feed-compose.is-compact > .gc-panel-footer,
    .channel-feed-mobile-dock .gc-panel.gc-panel--secondary.channel-feed-compose.is-compact .channel-feed-compose__media {
        display: none;
    }

    .channel-feed-mobile-dock .gc-panel.gc-panel--secondary.channel-feed-compose.is-compact > .gc-panel-header {
        grid-column: 1;
        grid-row: 1;
    }

    .channel-feed-mobile-dock .gc-panel.gc-panel--secondary.channel-feed-compose.is-compact > .channel-feed-compose__scroll {
        grid-column: 2;
        grid-row: 1;
        min-width: 0;
    }

    .channel-feed-mobile-dock .gc-panel.gc-panel--secondary.channel-feed-compose:not(.is-compact) .channel-feed-compose__editor-mount,
    .channel-feed-mobile-dock .gc-panel.gc-panel--secondary.channel-feed-compose:not(.is-compact) .channel-feed-compose__editor .stage-tiptap-editor {
        min-height: calc(var(--channel-feed-compose-line) * 4);
    }

    .channel-feed-mobile-dock .gc-panel.gc-panel--secondary.channel-feed-compose.is-stuck::before {
        display: none;
    }

    /* Visit skeleton: без fixed dock (форма/закреп появляются с live). */
    .gc-inertia-visit-skeleton .channel-feed-desktop-dock-host,
    .gc-inertia-visit-skeleton .channel-feed-mobile-dock {
        display: none !important;
    }
}

@media (max-width: 991.98px) {
    .channel-feed-desktop-dock-host {
        display: contents;
    }

    body:has(.channel-feed-mobile-dock.has-compose:not(.has-pins)) {
        --gc-body-pad-bottom: var(--gc-mobile-bottom-nav-outer-height);
    }

    body:has(.channel-feed-mobile-dock.has-compose.has-pins) {
        --gc-body-pad-bottom: calc(
            var(--gc-mobile-bottom-nav-outer-height) - env(safe-area-inset-bottom, 0px)
            + 5.5rem
        );
    }

    body:not(.inertia-shell):has(.channel-feed-mobile-dock.has-compose:not(.has-pins)),
    body:not(.inertia-shell):has(.channel-feed-mobile-dock.has-compose.has-pins) {
        padding-bottom: var(--gc-body-pad-bottom);
    }

    body:has(#post-compose-dock) .gc-mobile-nav-bottom,
    body:has(.channel-feed-mobile-dock.has-compose) .gc-mobile-nav-bottom {
        display: none !important;
    }

    body:not(.inertia-shell):has(.channel-feed-mobile-dock.has-compose) .channel-posts-layout--pinned-mobile-bottom {
        padding-bottom: 0;
    }

    body.inertia-shell:has(.channel-feed-mobile-dock.has-compose) .channel-posts-main {
        padding-bottom: calc(var(--space-6) + var(--gc-body-pad-bottom));
    }

    body.inertia-shell:has(.channel-feed-mobile-dock.has-compose) .channel-posts-layout--pinned-mobile-bottom {
        padding-bottom: 0;
    }

    body.inertia-shell:has(.channel-feed-mobile-dock.has-compose.is-scroll-hidden) .channel-posts-main {
        padding-bottom: var(--space-4);
    }

    .channel-posts-main--with-compose {
        display: flex;
        flex-direction: column;
        gap: var(--space-4);
    }

    .channel-posts-main--with-compose > .channel-feed-compose-flow,
    .channel-feed-mobile-dock > .channel-feed-compose-flow {
        display: none;
    }

    .channel-feed-mobile-dock {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        position: fixed;
        /* Выше капсулы таббара (тот же --z-fixed, но позже в DOM). */
        z-index: calc(var(--z-fixed) + 1);
        width: auto;
        max-width: none;
        pointer-events: none;
        transition: transform var(--transition-base) ease-out, bottom var(--transition-base) ease-out;
    }

    /* Compose-only: pins без compose остаются у края при hides chrome (см. e2e pinned-dock). */
    .channel-feed-mobile-dock.has-compose.is-scroll-hidden {
        transform: translate3d(0, calc(100% + var(--space-6)), 0);
        pointer-events: none;
    }

    .channel-feed-mobile-dock > * {
        pointer-events: auto;
    }

    .channel-feed-mobile-dock.has-compose:not(.has-pins) {
        left: 0;
        right: 0;
        bottom: 0;
    }

    .channel-feed-mobile-dock.has-compose.has-pins {
        left: var(--space-2);
        right: var(--space-2);
        bottom: calc(env(safe-area-inset-bottom, 0px) + var(--space-2));
        overflow: visible;
        background: var(--channel-feed-compose-dock-bg, var(--surface-secondary));
        border: 1px solid var(--border-subtle);
        border-radius: var(--radius-16);
        box-shadow: var(--channel-feed-compose-lift-shadow);
        transition: transform var(--transition-base) ease-out, box-shadow var(--transition-slow) var(--ease-out);
    }

    .channel-feed-mobile-dock.has-compose.has-pins:has(.channel-feed-compose.is-compact) {
        background: var(--surface-panel);
        box-shadow: var(--channel-feed-compose-lift-shadow-compact);
    }

    .channel-feed-mobile-dock.has-pins:not(.has-compose) {
        --channel-pinned-edge-bottom: max(var(--space-3), env(safe-area-inset-bottom, 0px));
        top: auto;
        left: max(var(--space-6), env(safe-area-inset-left, 0px));
        right: max(var(--space-6), env(safe-area-inset-right, 0px));
        width: auto;
        max-width: none;
        transform: translate3d(0, var(--gc-visual-viewport-bottom-shift, 0px), 0);
        bottom: calc(var(--gc-mobile-bottom-nav-outer-height) + var(--space-3));
        overflow: hidden;
        background: transparent;
        border: 1px solid var(--border-subtle);
        border-radius: var(--radius-16);
        box-shadow: var(--channel-feed-compose-lift-shadow);
        transition:
            bottom var(--transition-base) ease-out,
            left var(--transition-base) ease-out,
            right var(--transition-base) ease-out,
            transform var(--transition-base) ease-out;
    }

    /* С таббаром: закреп опускается к краю экрана, остаётся кликабельным. */
    html.gc-mobile-chrome-scroll-hidden .channel-feed-mobile-dock.has-pins:not(.has-compose) {
        bottom: var(--channel-pinned-edge-bottom, 12px);
    }

    .gc-panel.gc-panel--secondary.channel-feed-compose {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        top: auto;
        width: auto;
        max-width: none;
        z-index: var(--z-fixed);
        border-radius: var(--radius-16) var(--radius-16) 0 0;
        padding: var(--space-2) var(--space-4) calc(env(safe-area-inset-bottom, 0px) + var(--space-2));
        gap: var(--space-3);
        max-height: min(70dvh, 48rem);
        box-shadow: var(--channel-feed-compose-lift-shadow);
        transition:
            max-height var(--transition-slow) var(--ease-out),
            box-shadow var(--transition-slow) var(--ease-out);
    }

    .gc-panel.gc-panel--secondary.channel-feed-compose.is-compact {
        background: var(--surface-panel);
        box-shadow: var(--channel-feed-compose-lift-shadow-compact);
    }

    .channel-feed-mobile-dock .gc-panel.gc-panel--secondary.channel-feed-compose {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        top: auto;
        width: 100%;
        z-index: auto;
    }

    .channel-feed-mobile-dock.has-compose.has-pins .gc-panel.gc-panel--secondary.channel-feed-compose {
        border: none;
        border-radius: var(--radius-16) var(--radius-16) 0 0;
        padding: var(--space-2) var(--space-4);
        max-height: calc(70dvh - 5.5rem);
        box-shadow: none;
    }

    .channel-feed-mobile-dock.has-compose.has-pins .gc-panel.gc-panel--secondary.channel-feed-compose:not(.is-compact),
    .channel-feed-mobile-dock.has-compose.has-pins .gc-panel.gc-panel--secondary.channel-feed-compose.is-editing {
        padding: var(--space-4);
    }

    .gc-panel.gc-panel--secondary.channel-feed-compose.is-photo-sheet {
        display: none;
    }

    .gc-panel.gc-panel--secondary.channel-feed-compose > .gc-panel-header,
    .gc-panel.gc-panel--secondary.channel-feed-compose > .gc-panel-content,
    .gc-panel.gc-panel--secondary.channel-feed-compose > .gc-panel-footer,
    .gc-panel.gc-panel--secondary.channel-feed-compose .gc-panel-content {
        padding: 0;
    }

    .gc-panel.gc-panel--secondary.channel-feed-compose.is-compact {
        padding-inline: var(--space-4);
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        align-items: center;
        column-gap: var(--space-3);
        row-gap: 0;
        min-height: var(--gc-mobile-bottom-nav-outer-height);
        max-height: var(--gc-mobile-bottom-nav-outer-height);
    }

    .gc-panel.gc-panel--secondary.channel-feed-compose:not(.is-compact),
    .gc-panel.gc-panel--secondary.channel-feed-compose.is-editing {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        padding: var(--space-4) var(--space-4) calc(var(--space-4) + env(safe-area-inset-bottom, 0px));
        gap: var(--space-3);
    }

    .channel-feed-mobile-dock.has-compose.has-pins .gc-panel.gc-panel--secondary.channel-feed-compose.is-compact,
    .channel-feed-mobile-dock.has-compose.has-pins .gc-panel.gc-panel--secondary.channel-feed-compose.is-pending.is-compact {
        min-height: calc(var(--gc-mobile-bottom-nav-outer-height) - env(safe-area-inset-bottom, 0px));
        max-height: calc(var(--gc-mobile-bottom-nav-outer-height) - env(safe-area-inset-bottom, 0px));
    }

    .gc-panel.gc-panel--secondary.channel-feed-compose.is-compact .gc-panel-title {
        display: none;
    }

    .gc-panel.gc-panel--secondary.channel-feed-compose.is-compact > .gc-panel-footer,
    .gc-panel.gc-panel--secondary.channel-feed-compose.is-compact .channel-feed-compose__media {
        display: none;
    }

    .channel-feed-compose.is-compact .channel-feed-compose__editor-mount,
    .channel-feed-compose.is-compact .channel-feed-compose__editor .stage-tiptap-editor,
    .channel-feed-compose.is-compact .channel-feed-compose__editor-skeleton {
        min-height: var(--channel-feed-compose-line);
        max-height: var(--channel-feed-compose-line);
    }

    .channel-feed-mobile-dock .gc-mobile-nav-pinned-fixed {
        position: relative;
        left: auto;
        right: auto;
        bottom: auto;
        width: 100%;
        transform: none;
        z-index: auto;
        padding: 0;
        background: var(--surface-secondary) !important;
        box-shadow: none;
        border: none !important;
    }

    .channel-feed-mobile-dock .gc-mobile-nav-pinned-fixed .channel-pinned-switcher {
        padding: var(--space-3) var(--space-4);
    }

    .channel-feed-mobile-dock.has-compose.has-pins .gc-mobile-nav-pinned-fixed {
        border-top: 1px solid var(--border-subtle) !important;
    }

    .channel-feed-mobile-dock.has-compose.has-pins .channel-pinned-switcher {
        width: 100%;
        max-width: none;
    }
}

@supports ((backdrop-filter: blur(20px)) or (-webkit-backdrop-filter: blur(20px))) {
    .channel-feed-mobile-dock.has-pins:not(.has-compose) {
        background: color-mix(in srgb, var(--surface-secondary) 78%, transparent);
        -webkit-backdrop-filter: blur(20px) saturate(140%);
        backdrop-filter: blur(20px) saturate(140%);
    }

    .channel-feed-mobile-dock.has-pins:not(.has-compose) .gc-mobile-nav-pinned-fixed {
        background: transparent !important;
    }
}

.gc-panel.gc-panel--secondary.channel-feed-compose.is-stuck {
    box-shadow: var(--shadow-lg);
}

.gc-panel.gc-panel--secondary.channel-feed-compose.is-stuck::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 100%;
    height: var(--layout-three-col-subheader-gap);
    background: var(--surface-page);
    pointer-events: none;
}

@media (min-width: 992px) {
    .gc-panel.gc-panel--secondary.channel-feed-compose.is-stuck::before {
        display: none;
    }
}

@media (max-width: 991.98px) {
    .gc-panel.gc-panel--secondary.channel-feed-compose {
        --compose-flow-shift: 0px;
    }

    .gc-panel.gc-panel--secondary.channel-feed-compose.is-stuck::before {
        display: none;
    }
}

.gc-panel.gc-panel--secondary.channel-feed-compose > .gc-panel-header,
.gc-panel.gc-panel--secondary.channel-feed-compose > .gc-panel-footer,
.gc-panel.gc-panel--secondary.channel-feed-compose > .channel-feed-compose__body,
.gc-panel.gc-panel--secondary.channel-feed-compose .gc-panel-content {
    padding: 0;
}

.gc-panel.gc-panel--secondary.channel-feed-compose > .gc-panel-header,
.gc-panel.gc-panel--secondary.channel-feed-compose > .gc-panel-footer {
    flex-shrink: 0;
}

.gc-panel.gc-panel--secondary.channel-feed-compose.is-photo-sheet {
    visibility: hidden;
    pointer-events: none;
}

.gc-panel.gc-panel--secondary.channel-feed-compose > .gc-panel-footer {
    opacity: calc(1 - var(--compose-fold, 0));
}

.gc-panel.gc-panel--secondary.channel-feed-compose.is-compact > .gc-panel-footer {
    display: none;
}

.gc-panel.gc-panel--secondary.channel-feed-compose:not(.is-compact):not(.is-photo-sheet) {
    display: flex;
    flex-direction: column;
    min-height: 0;
}

.gc-panel.gc-panel--secondary.channel-feed-compose > .channel-feed-compose__body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-width: 0;
    min-height: var(--channel-feed-compose-line);
    gap: var(--space-3);
}

.channel-feed-compose:not(.is-compact) > .channel-feed-compose__scroll {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    align-self: stretch;
}

.channel-feed-compose__scroll.gc-scroll-area {
    flex: 1 1 auto;
    min-height: 0;
}

.channel-feed-compose.is-compact > .channel-feed-compose__scroll {
    flex: 0 0 auto;
    min-height: 0;
    max-height: none;
    overflow: visible;
}

.channel-feed-compose.is-compact > .channel-feed-compose__scroll.gc-scroll-area--vertical > .gc-scroll-area__viewport {
    overflow: visible !important;
    height: auto !important;
}

.channel-feed-compose.is-compact > .channel-feed-compose__scroll > .gc-scroll-area__scrollbar {
    display: none !important;
}

.gc-panel.gc-panel--secondary.channel-feed-compose.is-compact > .channel-feed-compose__scroll {
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
}

.channel-feed-compose:not(.is-compact) > .channel-feed-compose__body,
.channel-feed-compose.is-editing:not(.is-compact) > .channel-feed-compose__body,
.channel-feed-compose.has-content:not(.is-compact) > .channel-feed-compose__body,
.channel-feed-compose:not(.is-compact) > .channel-feed-compose__scroll .channel-feed-compose__body {
    overflow: visible;
}

.gc-rich-editor-modal--scroll-area-body .description-editor-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    padding: 0;
    scrollbar-gutter: auto;
    overflow: hidden;
}

.gc-rich-editor-modal--scroll-area-body .description-editor-scroll {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
}

.gc-rich-editor-modal--scroll-area-body .description-editor-container {
    display: flex;
    flex-direction: column;
    flex: 0 0 auto;
    min-height: 0;
    gap: 0;
    overflow: visible;
}

/*
 * Fullscreen + reading column (канал: пост compose).
 * Лист на весь viewport; колонка 768 — как contained-карточка заметки:
 * одинаковый inset space/4 у заголовка, текста и кнопок.
 */
@media (min-width: 768px) {
    .gc-rich-editor-modal.gc-rich-editor-modal--column:not(.gc-rich-editor-modal--contained)
        .modal-header.gc-event-description-modal-header {
        justify-content: center;
        padding-inline: 0;
    }

    .gc-rich-editor-modal.gc-rich-editor-modal--column:not(.gc-rich-editor-modal--contained)
        .description-editor-body.modal-body,
    .gc-rich-editor-modal.gc-rich-editor-modal--column:not(.gc-rich-editor-modal--contained)
        .gc-event-description-modal-footer-outer {
        display: flex;
        flex-direction: column;
        align-items: center;
        align-self: stretch;
        width: 100%;
    }

    .gc-rich-editor-modal.gc-rich-editor-modal--column:not(.gc-rich-editor-modal--contained)
        .gc-event-description-modal-header-toolbar,
    .gc-rich-editor-modal.gc-rich-editor-modal--column:not(.gc-rich-editor-modal--contained)
        .description-editor-scroll,
    .gc-rich-editor-modal.gc-rich-editor-modal--column:not(.gc-rich-editor-modal--contained)
        .gc-event-description-modal-footer.modal-footer {
        box-sizing: border-box;
        width: 100%;
        max-width: var(--layout-event-main-max-width);
        margin-inline: auto;
        flex-shrink: 0;
    }

    .gc-rich-editor-modal.gc-rich-editor-modal--column:not(.gc-rich-editor-modal--contained)
        .gc-event-description-modal-header-toolbar {
        padding-inline: var(--space-4);
    }

    .gc-rich-editor-modal.gc-rich-editor-modal--column:not(.gc-rich-editor-modal--contained)
        .description-editor-scroll {
        flex: 1 1 auto;
        min-height: 0;
        align-self: center;
    }

    .gc-rich-editor-modal.gc-rich-editor-modal--column:not(.gc-rich-editor-modal--contained)
        .gc-event-description-modal-footer.modal-footer {
        /* padding: space/4 уже из .gc-modal .modal-footer — как у шапки */
        padding-inline: var(--space-4);
    }
}

/* Inset текста как у contained-заметки / описания (stage-tiptap padding обнулён в модалке) */
.gc-rich-editor-modal.channel-feed-compose-sheet .gc-event-description-tiptap-root.tiptap-editor {
    padding: var(--space-4);
}

.channel-feed-compose.is-compact .channel-feed-compose__body {
    flex: 0 0 auto;
    min-height: var(--channel-feed-compose-line);
    overflow: visible;
    gap: 0;
}

.channel-feed-compose .gc-panel-content {
    flex: 0 0 auto;
    padding: 0;
}

.channel-feed-compose__media {
    flex: 0 0 auto;
    min-width: 0;
    max-width: none;
}

.channel-feed-compose__media:not(.has-media) {
    display: none;
}

.channel-feed-compose__media.has-media {
    padding: 0;
}

.channel-feed-compose.is-editing .channel-feed-compose__media.has-media {
    padding: 0 0 var(--space-3);
}

.channel-feed-compose.is-editing .gc-post-compose-photos.has-grid .gc-post-compose-media-preview.gc-post-media {
    width: 100%;
    overflow: hidden;
    border-radius: var(--radius-16);
}

.channel-feed-compose.is-editing .gc-post-media--1 .gc-post-media-item:not(.gc-post-media-item--measured) {
    max-height: min(32dvh, 20rem);
}

.channel-feed-compose.is-editing .gc-post-media--1 .gc-post-media-item--measured {
    padding-bottom: min(calc(100% / var(--gc-media-ratio)), min(32dvh, 20rem));
}

.channel-feed-compose__identity {
    display: flex;
    align-items: center;
    gap: var(--space-3);
    min-width: 0;
}

.channel-feed-compose__avatar,
.channel-feed-compose__avatar-skeleton {
    display: block;
    width: var(--channel-feed-compose-avatar);
    height: var(--channel-feed-compose-avatar);
    border-radius: var(--radius-full);
    flex-shrink: 0;
}

.channel-feed-compose__title-skeleton {
    display: block;
    width: 7.5rem;
    height: var(--space-4);
    border-radius: var(--radius-8);
}

.channel-feed-compose__editor {
    position: relative;
    min-width: 0;
    flex-shrink: 0;
    min-height: var(--channel-feed-compose-line);
}

.channel-feed-compose__editor-skeleton {
    display: block;
    min-height: calc(var(--channel-feed-compose-line) * 4);
    border-radius: var(--radius-8);
}

.channel-feed-compose.is-compact .channel-feed-compose__editor-skeleton {
    min-height: var(--channel-feed-compose-line);
}

.channel-feed-compose.is-pending .channel-feed-compose__editor-mount {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none;
}

.channel-feed-compose__editor-mount,
.channel-feed-compose__editor .stage-tiptap-editor {
    min-height: calc(var(--channel-feed-compose-line) * 4);
    max-height: min(40dvh, calc(var(--channel-feed-compose-line) * 12));
}

.channel-feed-compose__editor .stage-tiptap-editor {
    box-sizing: border-box;
    width: 100%;
    padding: 0;
    margin: 0;
    background: transparent;
    border: none;
    border-radius: 0;
    font-family: var(--font-family-base, inherit);
    font-size: var(--font-size-16);
    font-weight: 400;
    line-height: 1.5;
    color: var(--text-primary);
    overflow-x: hidden;
    overflow-y: hidden;
}

.channel-feed-compose:not(.is-compact) .channel-feed-compose__editor-mount,
.channel-feed-compose:not(.is-compact) .channel-feed-compose__editor .stage-tiptap-editor {
    max-height: none;
}

.channel-feed-compose.is-editing:not(.is-compact) .channel-feed-compose__editor-mount,
.channel-feed-compose.is-editing:not(.is-compact) .channel-feed-compose__editor .stage-tiptap-editor,
.channel-feed-compose.has-content:not(.is-compact) .channel-feed-compose__editor-mount,
.channel-feed-compose.has-content:not(.is-compact) .channel-feed-compose__editor .stage-tiptap-editor {
    overflow: visible;
}

.channel-feed-compose.is-compact .channel-feed-compose__editor-mount,
.channel-feed-compose.is-compact .channel-feed-compose__editor .stage-tiptap-editor {
    min-height: var(--channel-feed-compose-line);
    max-height: var(--channel-feed-compose-line);
    overflow: hidden;
}

.channel-feed-compose.is-compact .channel-feed-compose__editor .stage-tiptap-editor p.is-editor-empty:first-child {
    white-space: nowrap;
    overflow: hidden;
}

.channel-feed-compose.is-compact .channel-feed-compose__editor .stage-tiptap-editor p.is-editor-empty:first-child br.ProseMirror-trailingBreak {
    display: none;
}

.channel-feed-compose.is-compact .channel-feed-compose__editor .stage-tiptap-editor p.is-editor-empty:first-child::before {
    float: left;
    height: 0;
    white-space: nowrap;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
}

.channel-feed-compose__editor .stage-tiptap-editor p {
    margin: 0;
    line-height: 1.5;
}

.channel-feed-compose__editor .stage-tiptap-editor p + p {
    margin-top: var(--space-2);
}

.channel-feed-compose__editor .stage-tiptap-editor p.is-editor-empty:first-child::before {
    content: attr(data-placeholder);
    float: left;
    height: 0;
    color: var(--text-secondary);
    pointer-events: none;
    font-size: var(--font-size-16);
    font-weight: 400;
    line-height: 1.5;
}

.channel-feed-compose .gc-post-compose-photos {
    gap: var(--space-3);
    width: 100%;
    min-width: 0;
}

.gc-rich-editor-modal:is(.channel-feed-compose-sheet, .weapon-note-compose-sheet) {
    --channel-feed-compose-line: calc(var(--font-size-16) * 1.5);
}

.gc-rich-editor-modal:is(.channel-feed-compose-sheet, .weapon-note-compose-sheet) .description-editor-body {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    padding: 0;
    scrollbar-gutter: auto;
    overflow: hidden;
}

.gc-rich-editor-modal:is(.channel-feed-compose-sheet, .weapon-note-compose-sheet):not(.gc-rich-editor-modal--scroll-area-body) .description-editor-container {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    min-height: 0;
    gap: 0;
    overflow-x: hidden;
    overflow-y: auto;
}

.gc-rich-editor-modal:is(.channel-feed-compose-sheet, .weapon-note-compose-sheet) .channel-feed-compose__media.has-media {
    padding: var(--space-4) var(--space-4) 0;
}

.gc-rich-editor-modal:is(.channel-feed-compose-sheet, .weapon-note-compose-sheet) .gc-post-compose-photos.has-grid .gc-post-compose-media-preview.gc-post-media {
    width: 100%;
    overflow: hidden;
    border-radius: var(--radius-16);
}

.gc-rich-editor-modal:is(.channel-feed-compose-sheet, .weapon-note-compose-sheet) .gc-post-media--1 .gc-post-media-item:not(.gc-post-media-item--measured) {
    max-height: min(40dvh, 28rem);
}

.gc-rich-editor-modal:is(.channel-feed-compose-sheet, .weapon-note-compose-sheet) .gc-post-media--1 .gc-post-media-item--measured {
    padding-bottom: min(calc(100% / var(--gc-media-ratio)), min(40dvh, 28rem));
}

.gc-rich-editor-modal.channel-feed-compose-sheet .gc-event-description-tiptap-root {
    min-height: 0;
    flex: 1 1 auto;
}

/* Заметка: тот же inset, что у описания мероприятия — padding на .tiptap-editor, не второй слой host */
.gc-rich-editor-modal.weapon-note-compose-sheet .gc-event-description-tiptap-root {
    min-height: 0;
    flex: 0 1 auto;
}

.gc-rich-editor-modal.weapon-note-compose-sheet .description-editor-container > .channel-feed-compose__media.has-media + .tiptap-editor {
    padding-top: var(--space-3);
}

.gc-rich-editor-modal.channel-feed-compose-sheet .channel-feed-compose__editor-host {
    padding: var(--space-4);
}

@media (max-width: 767.98px) {
    .gc-rich-editor-modal.channel-feed-compose-sheet .description-editor-container > .channel-feed-compose__media.has-media + .tiptap-editor .channel-feed-compose__editor-host {
        padding-top: var(--space-3);
    }
}

.gc-rich-editor-modal.channel-feed-compose-sheet .gc-event-description-modal-footer-actions.modal-footer {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: var(--space-3);
}

.gc-rich-editor-modal.channel-feed-compose-sheet .gc-event-description-modal-footer-buttons {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: var(--space-2);
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
    margin-left: 0;
}

.gc-rich-editor-modal.channel-feed-compose-sheet .gc-event-description-modal-footer-buttons > .gc-panel-actions {
    flex: 0 0 auto;
    margin-right: auto;
}

.gc-rich-editor-modal.channel-feed-compose-sheet .gc-event-description-modal-footer-buttons > .gc-btn,
.gc-rich-editor-modal.channel-feed-compose-sheet .gc-event-description-modal-footer-buttons > .gc-dropdown {
    flex: 0 0 auto;
}

.gc-rich-editor-modal.channel-feed-compose-sheet .gc-event-description-modal-footer-buttons .gc-panel-actions--spread {
    width: 100%;
}

.gc-rich-editor-modal.channel-feed-compose-sheet .channel-feed-compose__editor-mount,
.gc-rich-editor-modal.channel-feed-compose-sheet .channel-feed-compose__editor .stage-tiptap-editor {
    min-height: calc(var(--channel-feed-compose-line) * 4);
    max-height: none;
    overflow: visible;
}

.gc-rich-editor-modal.channel-feed-compose-sheet .channel-feed-compose__editor .stage-tiptap-editor {
    box-sizing: border-box;
    width: 100%;
    padding: 0;
    margin: 0;
    background: transparent;
    border: none;
    font-size: var(--font-size-16);
    line-height: 1.5;
    color: var(--text-primary);
}

.channel-feed-compose .gc-post-compose-progress.is-visible {
    border: none;
    background: transparent;
    padding: 0;
    gap: var(--space-1);
}

.channel-feed-compose .gc-post-compose-progress-text {
    display: block;
}

.channel-feed-compose .gc-post-compose-progress-track {
    height: var(--space-2);
}

.channel-feed-compose .gc-post-compose-progress-bar {
    background: var(--gc-progress-fill);
}

.channel-feed-compose__btn-skeleton {
    display: block;
    width: 4.5rem;
    height: 40px;
    border-radius: var(--radius-8);
}

.channel-feed-compose__btn-skeleton--primary {
    width: 8.5rem;
}

/* Слот скелетона + формы внутри панели */
.gc-posts-compose-slot {
    position: relative;
    flex-shrink: 0;
    border-bottom: none;
    /*
     * Скелетон дока — position:absolute; inset:0 и не задаёт высоту родителю.
     * В x-skeleton.channel-feed в слоте только скелетон (нет in-flow формы) — без min-height слот схлопывается.
     * Реальная форма: до монтирования TipTap у #post_content_editor нет .stage-tiptap-editor, а у поля в футере min-height:0.
     */
    min-height: calc(var(--space-2) * 2 + 2.5rem);
}

.gc-post-compose-dock--inline {
    position: static;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    max-width: none;
    transform: none;
    z-index: auto;
    background: transparent;
    overflow: visible;
}

.gc-post-compose-dock--inline.gc-post-compose-dock--skeleton {
    position: absolute;
    inset: 0;
    z-index: 2;
    width: 100%;
    pointer-events: none;
    background: var(--surface-panel);
}

.gc-post-compose-shell--inline {
    background: var(--surface-panel);
    border: none;
    border-radius: 0;
    box-shadow: none;
}

.gc-post-compose-dock--inline:not(.gc-post-compose-dock--skeleton) {
    position: relative;
    z-index: 1;
}

.gc-post-compose-page-overlay {
    position: fixed;
    inset: 0;
    pointer-events: none;
    opacity: 0;
    transition: opacity var(--transition-fast);
    z-index: 70;
    background:
        linear-gradient(
            180deg,
            color-mix(in srgb, var(--fill-emphasis) 32%, transparent),
            color-mix(in srgb, var(--fill-emphasis) 14%, transparent) 38%,
            color-mix(in srgb, var(--fill-emphasis) 4%, transparent) 68%,
            transparent
        ),
        radial-gradient(circle at 50% 100%, color-mix(in srgb, var(--fill-emphasis-inverse) 12%, transparent), transparent 34%),
        radial-gradient(circle at 50% 100%, color-mix(in srgb, var(--fill-emphasis) 26%, transparent), transparent 58%);
}

.gc-post-compose-dock--floating:focus-within + .gc-post-compose-page-overlay,
.gc-post-compose-dock--floating.is-expanded + .gc-post-compose-page-overlay {
    opacity: 1;
}

.gc-post-compose-dock.is-pending {
    opacity: 0;
    pointer-events: none;
    /* Резервируем высоту, пока форма невидима — слот не должен зависеть только от min-height слота */
    min-height: calc(var(--space-2) * 2 + 2.5rem);
}

.gc-post-compose-dock--skeleton {
    z-index: 79;
    pointer-events: none;
}

.gc-post-compose-shell {
    width: 100%;
}

.gc-post-compose-form {
    margin: 0;
    display: flex;
    align-items: flex-end;
    gap: var(--space-1);
    padding: var(--space-2);
}

/* Лента канала: колонка (галерея → прогресс → строка аватар+редактор | кнопки) */
.gc-post-compose-form--stacked.gc-comment-compose--dock {
    flex-direction: column;
    align-items: stretch;
    gap: var(--space-4);
    padding: var(--space-2);
    padding-left: var(--space-4);
}

.gc-post-compose-form--stacked.gc-comment-compose {
    align-items: stretch;
}

.gc-post-compose-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: var(--space-4);
    width: 100%;
}

.gc-post-compose-footer-editor {
    display: flex;
    align-items: flex-end;
    gap: var(--space-4);
    flex: 1 1 0;
    min-width: 0;
}

.gc-post-compose-footer-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-2);
    flex-shrink: 0;
}

.gc-post-compose-action-btn {
    box-sizing: border-box;
    width: 40px;
    height: 40px;
    min-width: 40px;
    padding: 0;
    margin: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid var(--border-subtle);
    border-radius: var(--gc-dropdown-icon-toggle-radius);
    background-color: var(--surface-panel);
    color: var(--text-primary);
    cursor: pointer;
    transition:
        background-color var(--transition-fast),
        border-color var(--transition-fast),
        color var(--transition-fast),
        opacity var(--transition-fast);
}

.gc-post-compose-action-btn:hover {
    background-color: var(--surface-control);
    color: var(--text-primary);
}

.gc-post-compose-action-btn:focus-visible {
    outline: var(--gc-focus-outline);
    outline-offset: var(--gc-focus-outline-offset);
}

.gc-post-compose-action-btn i {
    font-size: var(--font-size-18);
    line-height: 1;
}

.gc-post-compose-form--stacked .gc-post-compose-send-dropdown {
    width: 40px;
    min-width: 40px;
    align-self: center;
}

.gc-post-compose-shell--skeleton {
    overflow: hidden;
}

.gc-post-compose-avatar-slot {
    width: 40px;
    min-width: 40px;
    height: 44px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    align-self: flex-end;
}

.gc-post-compose-form--stacked .gc-post-compose-avatar-slot {
    height: 40px;
    align-self: flex-end;
}

.gc-post-compose-avatar-skeleton {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-full);
    flex-shrink: 0;
}

.gc-post-compose-icon-skeleton {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-8);
    flex-shrink: 0;
    display: block;
}

.gc-post-compose-input-skeleton {
    box-sizing: border-box;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    display: block;
    height: 40px;
    border-radius: var(--radius-8);
    flex: 1 1 auto;
}

.gc-post-compose-main {
    gap: var(--space-1);
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

.gc-post-compose-form--stacked .gc-post-compose-main {
    gap: var(--space-4);
    width: 100%;
    justify-content: flex-start;
}

.gc-post-compose-avatar {
    width: 40px;
    height: 40px;
    border-radius: var(--radius-full);
    object-fit: cover;
    flex-shrink: 0;
}

.gc-post-compose-avatar.gc-img-slot,
.gc-post-compose-avatar-slot .gc-img-slot {
    display: block;
    width: 40px;
    height: 40px;
    overflow: hidden;
    background: var(--surface-control);
}

.gc-post-compose-entry.gc-input-shell {
    gap: var(--space-1);
    align-items: flex-end;
    min-height: 44px;
    padding: 0 var(--space-1);
    border: none;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

.gc-post-compose-entry--editor-only.gc-input-shell {
    flex: 1 1 0;
    min-width: 0;
    padding: 0;
    align-items: stretch;
}

/*
 * Раньше здесь было min-height: 0 — flex с flex-basis 0 схлопывал слот до ~1px,
 * пока не смонтирован TipTap (#post_content_editor с min-height ещё не давал высоты колонке).
 * Оставляем минимум строки редактора; рост по контенту не ломается.
 */
.gc-post-compose-form--stacked .gc-post-compose-footer .gc-post-compose-entry.gc-input-shell {
    min-height: 2.5rem;
}

.gc-post-compose-editor-wrap {
    flex: 1 1 0;
    min-width: 0;
    display: flex;
    align-items: stretch;
}

.gc-post-compose-dock--skeleton .gc-post-compose-editor-wrap {
    flex: 1 1 0;
    min-width: 0;
}

.gc-post-compose-dock--skeleton .gc-post-compose-input-skeleton.gc-skeleton {
    display: block;
    width: 100%;
    flex: 1 1 auto;
    min-width: 0;
}

.gc-post-compose-entry #post_content_editor {
    flex: 1;
    min-width: 0;
    /* 0 до TipTap давало схлопывание слота (absolute скелетон + opacity:0 форма). */
    min-height: 2.5rem;
    background: transparent;
    border: none;
    border-radius: 0;
    padding: 0;
}

.gc-post-compose-entry .stage-tiptap-editor {
    box-sizing: border-box;
    width: 100%;
    /* Высота строки как у аватарки/кнопок 40px; вертикальные поля симметричные под line-height */
    min-height: 40px;
    max-height: none;
    height: auto;
    overflow: visible;
    background: transparent;
    border: none;
    border-radius: 0;
    padding: var(--space-2) 0;
    font-family: var(--font-family-base, inherit);
    font-weight: 400;
    font-size: var(--font-size-14);
    line-height: 1.4;
    transition: background-color var(--transition-fast);
    color: var(--text-primary);
}

.gc-post-compose-entry .stage-tiptap-editor p {
    margin: 0;
    line-height: 1.4;
}

.gc-post-compose-entry .stage-tiptap-editor p + p {
    margin-top: var(--space-1);
}

/* Текстовое поле комментария — те же метрики, что редактор поста в ленте */
.gc-post-compose-entry--editor-only textarea.gc-comment-compose-input__textarea {
    box-sizing: border-box;
    width: 100%;
    min-height: 40px !important;
    height: auto;
    overflow-y: hidden;
    background: transparent !important;
    border: none !important;
    border-radius: 0 !important;
    padding: var(--space-2) 0 !important;
    font-family: var(--font-family-base, inherit);
    font-weight: 400;
    font-size: var(--font-size-14) !important;
    line-height: 1.4;
    color: var(--text-primary);
    resize: none;
    box-shadow: none !important;
    outline: none;
    display: block;
    align-self: stretch;
    flex: 1 1 auto;
    min-width: 0;
}

.gc-post-compose-entry--editor-only textarea.gc-comment-compose-input__textarea::placeholder {
    color: var(--text-secondary);
    opacity: 1;
}

/* Плейсхолдер в потоке (как в stage-editor), без absolute — совпадает с первой строкой текста */
.gc-post-compose-entry .stage-tiptap-editor p.is-editor-empty:first-child::before {
    content: attr(data-placeholder);
    float: left;
    height: 0;
    color: var(--text-secondary);
    pointer-events: none;
    font-family: var(--font-family-base, inherit);
    font-size: var(--font-size-14);
    font-weight: 400;
    line-height: 1.4;
}

/*
 * Лента канала, адаптив: плейсхолдер в одну строку.
 * Не вешать overflow: hidden на ::before — у псевдоэлемента float + height: 0 из базового правила
 * (см. выше) это полностью скрывает текст плейсхолдера на малых экранах.
 */
@media (max-width: 991.98px) {
    .gc-post-compose-form.gc-comment-compose.gc-comment-compose--dock.gc-post-compose-form--stacked
        .gc-post-compose-entry
        .stage-tiptap-editor
        p.is-editor-empty:first-child {
        min-width: 0;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .gc-post-compose-form.gc-comment-compose.gc-comment-compose--dock.gc-post-compose-form--stacked
        .gc-post-compose-entry
        .stage-tiptap-editor
        p.is-editor-empty:first-child::before {
        white-space: nowrap;
    }
}

.gc-post-compose-photo-trigger {
    width: 44px;
    min-width: 44px;
    height: 44px;
    align-self: flex-end;
}

.gc-post-compose-form--stacked .gc-post-compose-photo-trigger {
    width: 40px;
    min-width: 40px;
    height: 40px;
    align-self: center;
}

.gc-post-compose-photo-trigger i,
.gc-post-compose-send i {
    font-size: 18px;
    line-height: 1;
}

.gc-post-compose-photo-trigger.gc-btn {
    color: var(--text-secondary);
}

.gc-post-compose-send {
    width: 44px;
    min-width: 44px;
    height: 44px;
    align-self: flex-end;
    color: var(--text-secondary);
    background-color: var(--surface-control);
    border-color: transparent;
}

.gc-post-compose-send:disabled {
    opacity: 0.55;
}

.gc-post-compose-dock.is-expanded .gc-post-compose-send:not(:disabled),
.gc-post-compose-send:not(:disabled) {
    background: var(--accent-link);
    border-color: var(--accent-link);
    color: var(--text-on-solid);
}

.gc-post-compose-send:hover:not(:disabled) {
    background: var(--accent-link-hover);
    border-color: var(--accent-link-hover);
}

/* Лента: кнопки отправки и вложения — обводка как в макете, не заливка accent */
.gc-post-compose-form--stacked .gc-post-compose-footer-actions .gc-post-compose-send.gc-dropdown-toggle:not(:disabled),
.gc-post-compose-form--stacked .gc-post-compose-dock.is-expanded .gc-post-compose-footer-actions .gc-post-compose-send.gc-dropdown-toggle:not(:disabled) {
    background-color: var(--surface-panel);
    border-color: var(--border-subtle);
    color: var(--text-secondary);
}

.gc-post-compose-form--stacked .gc-post-compose-footer-actions .gc-post-compose-send.gc-dropdown-toggle:hover:not(:disabled),
.gc-post-compose-form--stacked .gc-post-compose-dock.is-expanded .gc-post-compose-footer-actions .gc-post-compose-send.gc-dropdown-toggle:hover:not(:disabled) {
    background-color: var(--surface-control);
    border-color: var(--border-subtle);
    color: var(--text-primary);
}

.gc-post-compose-form--stacked .gc-post-compose-footer-actions .gc-post-compose-send.gc-dropdown-toggle[aria-expanded="true"]:not(:disabled) {
    background-color: var(--surface-control);
    border-color: var(--border-subtle);
    color: var(--text-primary);
}

.gc-post-compose-form--stacked .gc-post-compose-action-btn.gc-dropdown-toggle-icon {
    width: 40px;
    height: 40px;
    min-width: 40px;
    border-radius: var(--gc-dropdown-icon-toggle-radius);
    padding: 0;
}

.gc-post-compose-send-dropdown {
    width: 44px;
    min-width: 44px;
    display: flex;
    justify-content: center;
    flex-shrink: 0;
    align-self: flex-end;
}

.gc-post-compose-send-skeleton-slot {
    align-items: center;
}

/* Специфичность > .gc-skeleton (skeleton.css подключается после posts.css и задаёт width: 100%) */
.gc-post-compose-action-skeleton.gc-skeleton {
    box-sizing: border-box;
    width: 40px;
    min-width: 40px;
    max-width: 40px;
    height: 40px;
    flex: 0 0 40px;
    border-radius: var(--gc-dropdown-icon-toggle-radius);
    display: block;
}

.gc-post-compose-editor-wrap--skeleton {
    flex: 1 1 0;
    min-width: 0;
    min-height: 2.5rem;
    display: flex;
    align-items: stretch;
}

/* ========================================
   Detail Page — расширения
   ======================================== */

.gc-post-message {
    background: transparent;
    border: 0;
    border-radius: 0;
    overflow: visible;
}

.channel-posts-main--detail {
    width: 100%;
    gap: var(--space-2);
    box-sizing: border-box;
}

.gc-post-thread-shell {
    position: relative;
}

.gc-post-thread-shell--detail {
    display: flex;
    flex-direction: column;
    gap: var(--space-6);
    padding-bottom: var(--space-8);
    max-width: 680px;
}

/* Только страница поста: без карточки и бокового инсета, на фоне страницы */
.gc-post-thread-shell--detail > .gc-post {
    background: transparent;
    border: none;
    border-radius: 0;
    overflow: visible;
}

.gc-post-thread-shell--detail > .gc-post .gc-post-header,
.gc-post-thread-shell--detail > .gc-post .gc-post-body,
.gc-post-thread-shell--detail > .gc-post .gc-post-footer-top {
    padding-inline: 0;
}

.gc-post-thread-shell--detail > .gc-post .gc-post-attachments {
    margin-inline: 0;
}

.gc-post-thread-shell--detail > .gc-post .gc-post-media,
.gc-post-thread-shell--detail > .gc-post .gc-post-media-frame {
    border-radius: var(--radius-16);
    overflow: hidden;
}

/* Reddit-style detail: пост flat на canvas, без карточки ленты */
.gc-post--thread {
    display: flex;
    flex-direction: column;
    gap: var(--space-3);
    background: transparent;
    border: none;
    border-radius: 0;
    overflow: visible;
}

.gc-post--thread .gc-post-header {
    padding: 0;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--space-2);
}

.gc-post--thread .gc-post-header-link {
    gap: var(--space-2);
    flex: 1;
    min-width: 0;
}

.gc-post--thread .gc-post-header > .gc-dropdown {
    flex-shrink: 0;
    margin-left: auto;
    align-self: flex-start;
}

.gc-post--thread .gc-post-avatar-link,
.gc-post--thread .gc-post-header .gc-post-avatar,
.gc-post--thread .gc-post-header .gc-post-avatar.gc-img-slot,
.gc-post--thread .gc-post-header .gc-post-avatar-placeholder {
    width: 28px;
    height: 28px;
}

.gc-post--thread .gc-post-header-meta--inline {
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 0 var(--space-1-5);
}

.gc-post--thread .gc-post-author {
    font-size: var(--font-size-13);
    font-weight: 500;
}

.gc-post--thread .gc-post-subauthor-name,
.gc-post--thread .gc-post-date {
    font-size: var(--font-size-12);
}

.gc-post-meta-sep {
    color: var(--text-secondary);
    font-size: var(--font-size-12);
    line-height: 1;
    user-select: none;
}

.gc-post--thread > .gc-post-title {
    font-size: var(--font-size-24);
    font-weight: 600;
    line-height: 1.25;
    margin: 0;
    color: var(--text-primary);
    letter-spacing: -0.01em;
}

.gc-post--thread .gc-post-body {
    padding: 0;
}

.gc-post--thread .gc-post-tiptap,
.gc-post--thread .gc-post-body {
    font-size: var(--font-size-15);
    line-height: 1.55;
    color: var(--text-primary);
}

.gc-post--thread .gc-post-title {
    font-size: var(--font-size-24);
    font-weight: 600;
    line-height: 1.25;
    margin: 0;
}

.gc-post-footer--thread {
    padding: var(--space-3) 0 0;
    margin: 0;
    border-top: none;
    min-height: 0;
}

.gc-post-footer--thread .gc-post-footer-top {
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-2);
}

.gc-post-footer--thread .gc-post-counters {
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
}

.gc-post-message-row {
    display: flex;
    align-items: flex-end;
    gap: var(--space-2);
}

.gc-post-message-avatar {
    flex-shrink: 0;
}

.gc-post-message-avatar .gc-post-avatar,
.gc-post-message-avatar .gc-post-avatar-placeholder {
    width: 36px;
    height: 36px;
    border-radius: var(--radius-full);
    object-fit: cover;
    flex-shrink: 0;
}

.gc-post-message-main {
    flex: 0 1 min(82%, 720px);
    min-width: 0;
    max-width: min(82%, 720px);
}

/* Страница поста: пузырь на всю ширину области справа от аватара */
.gc-post-thread-shell--detail .gc-post-message-main {
    flex: 1 1 auto;
    max-width: none;
}

.gc-post-message-bubble {
    background: var(--surface-panel);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-16) var(--radius-16) var(--radius-16) var(--radius-8);
    overflow: hidden;
}

@media (min-width: 992px) {
    .channel-posts-main--detail {
        padding-left: 0;
    }
}

@media (max-width: 768px) {
    .gc-post-message-main {
        flex-basis: auto;
        max-width: 100%;
    }
}

/* Детальная страница: чуть крупнее заголовок */
/* Детальная страница: аватар побольше */
.gc-post--detail .gc-post-header .gc-post-avatar {
    width: 36px;
    height: 36px;
}

.gc-post--detail .gc-post-header .gc-post-avatar-placeholder {
    width: 36px;
    height: 36px;
}

.gc-post--detail.gc-post--thread .gc-post-avatar-link,
.gc-post--detail.gc-post--thread .gc-post-header .gc-post-avatar,
.gc-post--detail.gc-post--thread .gc-post-header .gc-post-avatar.gc-img-slot,
.gc-post--detail.gc-post--thread .gc-post-header .gc-post-avatar-placeholder {
    width: 28px;
    height: 28px;
}

.gc-post--detail .gc-post-footer--detail {
    padding: var(--space-1) var(--space-4) var(--space-4);
    min-height: 0;
    border-top: none;
    margin: 0;
}

.gc-post--detail .gc-post-footer--detail.gc-post-footer--thread {
    padding: var(--space-3) 0 0;
    border-top: none;
}

.gc-post-message .gc-post-header {
    padding: var(--space-2);
    padding-bottom: var(--space-1);
    justify-content: space-between;
    align-items: flex-start;
    gap: var(--space-1);
}

.gc-post-header-meta--stretch {
    flex: 1;
    min-width: 0;
}

.gc-post-message .gc-post-author {
    font-weight: 500;
    font-size: var(--font-size-14);
    line-height: 1.3;
    color: var(--accent-link);
}

.gc-post-message .gc-post-author-link:hover .gc-post-author {
    color: var(--accent-link-hover);
}

.gc-post-message .gc-post-body {
    padding: var(--space-2);
    font-size: var(--font-size-15);
    line-height: 1.5;
}

.gc-post-message .gc-post-footer--detail {
    padding: 0 var(--space-2) var(--space-2);
}

.gc-post-header + .gc-post-footer--detail {
    padding-top: 0;
}

.gc-post-media + .gc-post-footer--detail {
    padding-top: var(--space-2);
}

.gc-post-body + .gc-post-footer--detail {
    padding-top: var(--space-1);
}

/* ========================================
   Reaction Picker — стиль gc-dropdown-menu, ряд emoji
   ======================================== */


.gc-post-reaction-picker {
    --gc-corner-outer: var(--radius-16);
    --gc-corner-nest: var(--gc-dropdown-group-padding);
    --gc-corner-inner: max(0px, calc(var(--gc-corner-outer) - var(--gc-corner-nest)));
    display: grid;
    grid-template-columns: repeat(6, var(--gc-dropdown-item-min-height));
    align-items: center;
    gap: 0;
    padding: var(--gc-dropdown-group-padding);
    color: var(--gc-dropdown-menu-text);
    background: var(--gc-dropdown-menu-bg);
    border: 1px solid var(--gc-dropdown-menu-border);
    border-radius: var(--gc-corner-outer);
    box-shadow: var(--shadow-md);
    backdrop-filter: blur(var(--gc-dropdown-menu-blur)) saturate(var(--gc-dropdown-menu-saturate));
    -webkit-backdrop-filter: blur(var(--gc-dropdown-menu-blur)) saturate(var(--gc-dropdown-menu-saturate));
    position: absolute;
    bottom: calc(100% + var(--space-2));
    left: 0;
    z-index: var(--z-dropdown);
    overflow: visible;
    transform-origin: bottom left;
    animation: gc-post-reaction-picker-in 200ms cubic-bezier(0.2, 0.9, 0.2, 1);
}

@supports not (backdrop-filter: blur(1px)) {
    .gc-post-reaction-picker {
        background: var(--gc-dropdown-menu-bg-fallback);
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
}

@keyframes gc-post-reaction-picker-in {
    from {
        opacity: 0;
        transform: scale(0.9) translateY(8px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.gc-post-reaction-picker-item {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: var(--gc-dropdown-item-min-height);
    height: var(--gc-dropdown-item-min-height);
    min-width: var(--gc-dropdown-item-min-height);
    padding: 0;
    background: transparent;
    border: none;
    border-radius: var(--gc-corner-inner);
    font-size: var(--font-size-20);
    cursor: pointer;
    line-height: 1;
    appearance: none;
    -webkit-appearance: none;
    transform-origin: center bottom;
    animation: gc-post-reaction-picker-item-in 320ms cubic-bezier(0.34, 1.45, 0.64, 1) both;
    transition:
        background var(--transition-fast),
        transform 140ms cubic-bezier(0.34, 1.45, 0.64, 1);
}

.gc-post-reaction-picker-item:nth-child(1) { animation-delay: 16ms; }
.gc-post-reaction-picker-item:nth-child(2) { animation-delay: 36ms; }
.gc-post-reaction-picker-item:nth-child(3) { animation-delay: 56ms; }
.gc-post-reaction-picker-item:nth-child(4) { animation-delay: 76ms; }
.gc-post-reaction-picker-item:nth-child(5) { animation-delay: 96ms; }
.gc-post-reaction-picker-item:nth-child(6) { animation-delay: 116ms; }
.gc-post-reaction-picker-item:nth-child(n + 7) { animation-delay: 136ms; }

@keyframes gc-post-reaction-picker-item-in {
    from {
        opacity: 0;
        transform: scale(0.55) translateY(10px);
    }
    to {
        opacity: 1;
        transform: scale(1) translateY(0);
    }
}

.gc-post-reaction-picker-item:hover,
.gc-post-reaction-picker-item:focus-visible {
    background: var(--gc-dropdown-item-hover-bg);
    outline: none;
    transform: scale(1.28) translateY(-4px);
    z-index: 1;
}

.gc-post-reaction-picker-item--selected {
    background: color-mix(in srgb, var(--text-on-solid) 14%, transparent);
    box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--text-on-solid) 42%, transparent);
}

.gc-post-reaction-picker-item--selected:hover,
.gc-post-reaction-picker-item--selected:focus-visible {
    background: var(--gc-dropdown-item-hover-bg);
    box-shadow: inset 0 0 0 1.5px color-mix(in srgb, var(--text-on-solid) 55%, transparent);
    transform: scale(1.28) translateY(-4px);
}

.gc-post-reaction-picker-item:active {
    transform: scale(0.92);
}

@media (prefers-reduced-motion: reduce) {
    .gc-post-chip--pop,
    .gc-post-chip--pop .gc-post-chip-emoji,
    .gc-post-reaction-picker,
    .gc-post-reaction-picker-item {
        animation: none;
    }

    .gc-post-reaction-trigger-icon,
    .gc-post-reaction-picker-item {
        transition: none;
    }

    .gc-post-reaction-trigger[aria-expanded="true"] .gc-post-reaction-trigger-icon {
        transform: none;
    }

    .gc-post-reaction-picker-item:hover,
    .gc-post-reaction-picker-item:focus-visible,
    .gc-post-reaction-picker-item--selected:hover,
    .gc-post-reaction-picker-item--selected:focus-visible {
        transform: none;
    }
}

/* ========================================
   Feed Layout (страница ленты постов)
   ======================================== */

.channel-posts-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--layout-channel-sidebar-width);
    gap: var(--space-6);
    align-items: start;
}

.channel-posts-layout--single {
    width: 100%;
    grid-template-columns: minmax(0, 1fr);
    justify-items: center;
}

.channel-posts-layout--single .channel-posts-main {
    width: 100%;
    max-width: calc(
        var(--layout-page-max-width)
        - var(--layout-catalog-sidebar-width)
        - (var(--space-2) * 2)
    );
    margin: 0 auto;
}

/* Inertia: дети ленты заполняют PageGrid; кап колонки — layout-utilities ≥1280 */
body.inertia-shell .channel-posts-layout--single {
    justify-items: stretch;
}

body.inertia-shell .channel-posts-layout--single .channel-posts-main,
body.inertia-shell .catalog-main--content > .channel-feed-mobile-rail,
body.inertia-shell .catalog-main--content > .channels-show-rail-fallback {
    width: 100%;
    max-width: none;
    margin-inline: 0;
}

@media (min-width: 992px) {
    /* Правый rail на десктопе пуст — убираем из потока, иначе лишний row-gap у одноколоночной сетки */
    .channel-posts-layout--single .channel-posts-sidebar {
        display: none;
    }
}

.channel-posts-sidebar {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
    position: sticky;
    top: var(--layout-context-rail-sticky-top);
    align-self: start;
    max-height: calc(100vh - 100px);
    overflow-y: auto;
}

/* Десктопный правый rail: закреп и «Предстоящие» — оболочки .catalog-nav (catalog.css) */

.channel-pinned-panel {
    position: static;
}

.channel-pinned-panel-content {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

.channel-community-description {
    display: flex;
    flex-direction: column;
    gap: var(--space-1);
    color: var(--text-secondary);
    font-size: var(--font-size-14);
    line-height: 1.5;
}

.channel-community-description p {
    margin: 0;
}

.channel-sidebar-list {
    width: 100%;
}

/* Dock / mobile bar: flush к краям chrome. Скругление — у compact-чипа и у карточки compose-дока. */
.channel-pinned-switcher:not(.catalog-nav-item):not(.channel-pinned-switcher--compact) {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    width: 100%;
    padding: var(--space-2);
    box-sizing: border-box;
    cursor: pointer;
    background: none;
    border-radius: 0;
    transition: background-color var(--transition-fast);
}

.channel-pinned-switcher:not(.catalog-nav-item):hover {
    background: var(--gc-interactive-hover-bg);
}

/* В правом rail закреп оформлен как .catalog-nav-item (hover/active — catalog.css) */
.catalog-nav.channel-pinned-nav > .channel-pinned-panel > .channel-pinned-switcher.catalog-nav-item {
    flex-direction: column;
    align-items: stretch;
    align-self: stretch;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

/* Узкая колонка rail: плотнее базового .catalog-nav-item (catalog.css) */
.catalog-nav.channel-pinned-nav .catalog-nav-item,
.catalog-nav.channel-upcoming-nav .catalog-nav-item {
    gap: var(--space-1);
    padding-block: var(--space-2);
    padding-inline: var(--space-2);
}

.catalog-nav.channel-pinned-nav,
.catalog-nav.channel-upcoming-nav {
    --catalog-nav-inset: var(--space-1);
}

.channel-pinned-panel--slider {
    overflow: hidden;
}

.channel-pinned-switcher-rail-wrap {
    width: 100%;
    min-width: 0;
}

.channel-pinned-switcher:focus-visible {
    outline: var(--gc-focus-outline);
    outline-offset: -2px;
}

.channel-pinned-switcher-rail {
    display: flex;
    flex-direction: row;
    gap: var(--space-1);
    align-items: stretch;
    justify-content: stretch;
    width: 100%;
}

.channel-pinned-switcher-dot {
    flex: 1 1 0;
    display: block;
    height: 0.25rem;
    min-width: 0;
    padding: 0;
    border: none;
    border-radius: var(--radius-full);
    background: var(--border-default);
    transition: background-color var(--transition-fast);
}

button.channel-pinned-switcher-dot {
    cursor: pointer;
}

.channel-pinned-switcher-dot.is-active {
    background: var(--accent-link);
}

.channel-pinned-switcher--compact {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    width: max-content;
    max-width: min(100%, 20rem);
    padding: var(--space-3);
    gap: var(--space-1-5);
    box-sizing: border-box;
    cursor: pointer;
    background: var(--surface-primary);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-16);
    box-shadow: var(--shadow-sm);
    transition: background-color var(--transition-fast), border-color var(--transition-fast);
}

.channel-pinned-switcher--compact .catalog-nav-title {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 12rem;
}

.channel-feed-pinned-sticky {
    display: none;
}

.channel-pinned-switcher-stage {
    width: 100%;
    min-width: 0;
    overflow: hidden;
}

.channel-pinned-switcher-track {
    display: flex;
    flex-direction: row;
    width: 100%;
    transition: transform var(--transition-fast);
    will-change: transform;
}

.channel-pinned-slide {
    display: block;
    flex: 0 0 100%;
    width: 100%;
    min-width: 100%;
    color: inherit;
    box-sizing: border-box;
}

.channel-pinned-slide::before {
    display: none !important;
}

.channel-pinned-slide .sidebar-transport-person {
    width: 100%;
    min-width: 0;
    align-items: center;
}

/* Иконки / превью закрепа и «Предстоящих» в rail: светлая плитка как у .gc-list-media-square (lists.css — --ui-surface-1) */
.catalog-nav.channel-pinned-nav .channel-pinned-slide :is(.gc-list-media-icon, .gc-list-media-square.sm, .gc-list-avatar-square.sm, .gc-img-slot.gc-list-media-square),
.catalog-nav.channel-upcoming-nav .catalog-nav-item.channel-upcoming-event-link > .gc-list-media-icon.sm {
    background: var(--surface-control);
    border: 1px solid var(--border-subtle);
}

.catalog-nav.channel-pinned-nav .channel-pinned-slide .gc-list-media-icon i,
.catalog-nav.channel-pinned-nav .channel-pinned-slide .sidebar-icon-box i,
.catalog-nav.channel-pinned-nav .channel-pinned-slide .sidebar-weapon-icon i,
.catalog-nav.channel-upcoming-nav .gc-list-media-icon.sm i {
    color: var(--text-primary);
}

.channel-pinned-slide .catalog-nav-content {
    min-width: 0;
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    min-height: 0;
}

/* В карусели закрепа — до двух строк; базовый .catalog-nav-title — одна строка */
.catalog-nav.channel-pinned-nav .catalog-nav-title {
    white-space: normal;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
}

/* Не задавать display: block — ломает flex-ряд .gc-interactive-row (иконка / текст / шеврон на одной линии). */
.channel-upcoming-event-link {
    color: inherit;
    text-decoration: none;
}

.channel-upcoming-event-link .gc-list-content > p {
    margin: 0;
}

.channel-upcoming-event-link__chev {
    color: var(--text-secondary);
}

/* Предстоящие в rail: пункты = .catalog-nav-item; chevron — второй <i>, вправо */
.catalog-nav.channel-upcoming-nav .catalog-nav-item.channel-upcoming-event-link > i.channel-upcoming-event-link__chev {
    margin-left: auto;
    flex-shrink: 0;
}

/* Мобильный rail ленты: карточка канала + предстоящие в одной секции */
.channel-feed-mobile-rail {
    min-width: 0;
}

.channel-sidebar-card.channel-sidebar-card--feed-mobile {
    --channel-sidebar-avatar-overlap: 0px;
    background: transparent;
    border: none;
    border-radius: 0;
    overflow: visible;
}

.channel-sidebar-card--feed-mobile .channel-sidebar-card-cover--feed-mobile {
    border-radius: var(--radius-16);
}

.channel-sidebar-card--feed-mobile.channel-sidebar-card--no-cover .channel-sidebar-card-cover {
    display: none;
}

.channel-sidebar-card--feed-mobile .channel-sidebar-card-body--feed-mobile {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
    padding: var(--space-3) 0 0;
}

.channel-sidebar-card--feed-mobile:has(.channel-sidebar-card-upcoming) .channel-sidebar-card-body--feed-mobile {
    padding-bottom: 0;
}

.channel-sidebar-card--feed-mobile.channel-sidebar-card--no-cover .channel-sidebar-card-body {
    padding-top: 0;
}

.channel-feed-mobile-rail__identity > .channel-sidebar-card-actions-wrap {
    margin-inline-start: auto;
    flex-shrink: 0;
    align-self: center;
}

.channel-feed-mobile-rail__identity {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: var(--space-3);
    min-width: 0;
}

.channel-sidebar-card--feed-mobile .channel-sidebar-card-avatar--feed-mobile {
    --channel-sidebar-avatar-size: 88px;
    margin-top: calc(var(--channel-sidebar-avatar-overlap) * -1);
    flex-shrink: 0;
}

.channel-sidebar-card--feed-mobile .channel-sidebar-card-content--feed-mobile {
    flex: 1;
    min-width: 0;
    padding-top: var(--channel-sidebar-avatar-overlap);
    padding-bottom: 0;
    gap: var(--space-product-2);
}

.channel-sidebar-card--feed-mobile .channel-sidebar-card-avatar img,
.channel-sidebar-card--feed-mobile .channel-sidebar-card-avatar .gc-img-slot,
.channel-sidebar-card--feed-mobile .channel-sidebar-card-avatar-placeholder {
    border: none;
    box-shadow: none;
}

.channel-sidebar-card--feed-mobile .channel-sidebar-card-name {
    font-size: var(--type-heading-h4-size);
    font-weight: 500;
    line-height: calc(22 / 16);
}

.channel-sidebar-card--feed-mobile .channel-sidebar-card-description {
    color: var(--text-primary);
    line-height: calc(22 / 14);
}

.channel-sidebar-card--feed-mobile .channel-sidebar-card-slug {
    color: var(--text-secondary);
}

.channel-sidebar-card--feed-mobile:not(:has(.channel-sidebar-card-upcoming)):not(:has(.channel-sidebar-card-actions-wrap--feed-mobile)) .channel-sidebar-card-content--feed-mobile {
    padding-bottom: 0;
}

/* Отступ данных до «Предстоящих»: нижний padding у тела карточки, без margin у блока списка */
.channel-sidebar-card:has(.channel-sidebar-card-upcoming) .channel-sidebar-card-body {
    padding-bottom: var(--space-2);
}

/* Compact identity: body уже space-2 inline — зона --list без второго inset */
.channel-sidebar-card--feed-mobile .channel-sidebar-card-upcoming .channel-upcoming-panel-content.gc-panel-content--list {
    padding-inline: 0;
}

/* Tablet fallback: body space-4 — зона --list + space-2 = 16px до иконки, как у данных */
.channel-sidebar-card:not(.channel-sidebar-card--feed-mobile) .channel-sidebar-card-upcoming .channel-upcoming-panel-content.gc-panel-content--list {
    padding-inline: var(--space-2);
}


.channel-pinned-fish-note {
    font-size: var(--font-size-13);
}

.channel-pinned-empty {
    padding: var(--space-4) 0;
}

.channel-posts-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--space-4);
}

/* Оболочка ленты: без собственного фона — между дневными секциями виден фон страницы */
.gc-posts-stream {
    display: flex;
    flex-direction: column;
    background: transparent;
    border: none;
    border-radius: 0;
    overflow: visible;
    margin-bottom: 0;
}

.gc-posts-stream--empty {
    margin-bottom: 0;
}

/* На адаптиве — без боковых линий у края экрана (скругления сохраняем) */
@media (max-width: 991.98px) {
    .channel-posts-main .gc-posts-stream,
    .channel-posts-main .gc-posts-compose-panel {
        /* border-left: none;
        border-right: none; */
    }

    .channel-posts-main .gc-card:not(.gc-card-activity-event) {
        /* border-left: none;
        border-right: none; */
    }
}

/* Как у карточки поста: шапка в потоке, ⋮ справа; без прав — больше воздуха сверху у центрального блока */
.gc-post--technical {
    padding: var(--space-4) var(--space-4) var(--space-6);
}

.gc-post--technical--no-manage {
    padding-top: var(--space-8);
}

.gc-post-technical-header {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: var(--space-2);
    margin-bottom: var(--space-2);
}

.gc-post-header .gc-dropdown,
.gc-post-header .gc-dropdown-root,
.gc-post-technical-header .gc-dropdown,
.gc-post-technical-header .gc-dropdown-root {
    flex-shrink: 0;
}

.gc-post-technical-inner,
.gc-feed-service-message {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: var(--space-2);
    text-align: center;
}

.gc-post-technical-avatar-wrap,
.gc-feed-service-avatar-wrap {
    display: flex;
    align-items: center;
    justify-content: center;
}

.gc-post-technical-avatar,
.gc-feed-service-avatar {
    width: 64px;
    height: 64px;
    border-radius: var(--radius-full);
    object-fit: cover;
    border: 2px solid var(--border-subtle);
    background: var(--surface-control);
    box-sizing: border-box;
}

.gc-post-technical-avatar.gc-img-slot,
.gc-feed-service-avatar.gc-img-slot,
.gc-post-technical-avatar-wrap .gc-img-slot {
    display: block;
    width: 64px;
    height: 64px;
    overflow: hidden;
}

.gc-post-technical-avatar-fallback,
.gc-feed-service-avatar-fallback {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-size-18);
    font-weight: 600;
    line-height: 1;
    color: var(--text-secondary);
}

.gc-post-technical-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 2rem;
    padding: 0 var(--space-4);
    border-radius: var(--radius-full);
    background: var(--surface-control);
    color: var(--text-primary);
    font-size: var(--font-size-14);
    font-weight: 500;
    text-decoration: none;
}

.gc-post-technical-badge.profile-trigger {
    cursor: pointer;
}

.gc-post-technical-badge.profile-trigger:hover,
.gc-post-technical-badge.profile-trigger:focus-visible {
    background: var(--gc-interactive-hover-bg);
}

.gc-post-technical-time {
    color: var(--font-muted);
    font-size: var(--font-size-13);
}

.gc-feed-service-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: var(--space-1) var(--space-4);
    border-radius: var(--radius-full);
    background: var(--surface-control);
    border: 1px solid var(--border-subtle);
    color: var(--text-secondary);
    font-size: var(--font-size-14);
    font-weight: 500;
}

/*
 * Лента канала: день-карточки + маркеры дат между ними.
 * Тот же шаг, что каталог (`--catalog-feed-marker-gap`) — пилюля в зазоре,
 * без отрицательного margin на предыдущую карточку.
 */
.gc-posts-feed {
    --catalog-feed-marker-gap: var(--space-4);
    display: flex;
    flex-direction: column;
    gap: var(--catalog-feed-marker-gap);
}

/* Секции ленты канала по календарному дню — отдельная поверхность на фоне страницы */
.gc-channel-feed-day {
    display: flex;
    flex-direction: column;
    gap: 0;
    min-width: 0;
    background: var(--surface-panel);
    border: 1px solid var(--border-subtle);
    border-radius: var(--radius-16);
    overflow: hidden;
    padding: 0;
}

/* Бадж даты — общий для канала, /feed, /events, челленджей */
.gc-channel-feed-day-marker {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
}

.gc-channel-feed-day-marker__badge {
    max-width: 100%;
    min-height: 0;
    padding: var(--space-1) var(--space-3);
    font-size: var(--font-size-13);
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: light-dark(var(--text-primary), var(--text-secondary));
    background: color-mix(in srgb, var(--surface-primary) 22%, transparent);
    border: 1px solid var(--border-subtle);
    box-shadow: none;
    backdrop-filter: blur(32px);
    -webkit-backdrop-filter: blur(32px);
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
    .gc-channel-feed-day-marker__badge {
        background: light-dark(var(--surface-primary), var(--surface-elevated));
        backdrop-filter: none;
        -webkit-backdrop-filter: none;
    }
}

.gc-channel-feed-day__posts {
    display: flex;
    flex-direction: column;
    min-width: 0;
    /* Верх задаёт .gc-post-header — без второго space/1 над первой шапкой */
    padding-top: 0;
}

.gc-posts-feed:empty {
    display: none;
}

.gc-posts-sentinel {
    display: block;
    width: 100%;
    min-height: 1px;
}

.gc-posts-sentinel.is-hidden {
    display: none;
}

.gc-posts-sentinel.is-loading {
    min-height: var(--space-8);
}

.gc-posts-stream .gc-post {
    border: none;
    border-radius: 0;
    background: transparent;
    overflow: visible;
    scroll-margin-top: 84px;
}

/* Мобильный закреп: запас снизу над фикс. панелью (glass-бар как нижний навбар) */
@media (min-width: 992px) {
    .channel-feed-pinned-sticky {
        display: flex;
        justify-content: center;
        position: sticky;
        bottom: var(--space-4);
        z-index: var(--z-sticky);
        width: 100%;
        pointer-events: none;
        padding-inline: var(--space-4);
        box-sizing: border-box;
    }

    /* Sticky-закреп кликабелен; hover — на .channel-pinned-switcher */
    .channel-feed-pinned-sticky > .channel-pinned-switcher {
        pointer-events: auto;
    }

    .channel-posts-layout--pinned-mobile-bottom {
        padding-bottom: var(--space-12);
    }
}

@media (max-width: 991.98px) {
    .channel-posts-layout--pinned-mobile-bottom {
        padding-bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px));
    }
}

.gc-posts-feed > .gc-post + .gc-post,
.gc-channel-feed-day__posts > .gc-post + .gc-post {
    border-top: 1px solid var(--border-subtle);
}

.gc-posts-load-more {
    display: none;
    margin-top: var(--space-6);
}

.gc-posts-load-more.is-visible {
    display: block;
}

.gc-posts-loader {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: var(--space-16) 0;
    color: var(--text-secondary);
    font-size: var(--font-size-20);
}

/* ========================================
   Activity Feed — Event / Epic cards
   ======================================== */

.activity-event-meta--accent {
    color: var(--text-secondary);
}

/* Иконка закрытого события (замок) */
.activity-event-lock {
    font-size: 14px;
    color: var(--text-secondary);
}

/* Эпик-карточка с обложкой */
.gc-epic-card-cover {
    display: flex;
    flex-direction: column;
    padding: 0 !important;
    overflow: hidden;
    position: relative;
    aspect-ratio: 16 / 9;
}

.gc-epic-card-background {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    filter: blur(20px);
    transform: scale(1.1);
    z-index: 0;
}

.gc-epic-card-image {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: contain;
    transition: transform var(--transition-base);
    z-index: 1;
}

@media (min-width: 1280px) and (hover: hover) and (pointer: fine) {

.gc-epic-card-cover:hover .gc-epic-card-image {
    transform: scale(1.03);
}
}

.gc-epic-card-gradient {
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, color-mix(in srgb, var(--fill-emphasis) 70%, transparent) 0%, color-mix(in srgb, var(--fill-emphasis) 40%, transparent) 40%, transparent 100%);
    transition: opacity var(--transition-base);
    z-index: 2;
}

.gc-epic-card-content {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: var(--space-4);
    color: var(--text-on-solid);
    z-index: 3;
}

.gc-epic-card-meta {
    font-size: var(--font-size-14);
    opacity: 0.9;
    margin-bottom: var(--space-1);
}

.gc-epic-card-title {
    font-size: var(--font-size-base);
    font-weight: 500;
}

/* ========================================
   Responsive
   ======================================== */

@media (max-width: 1279px) {
    .channel-posts-layout {
        grid-template-columns: 1fr;
        gap: var(--space-4);
    }

    .channel-posts-sidebar:not(.channel-posts-sidebar--feed-rail):not(:has(.channel-upcoming-nav)) {
        display: none;
    }
}

@media (max-width: 991px) {
    .gc-post-compose-dock:not(.gc-post-compose-dock--inline) {
        left: var(--space-2);
        right: var(--space-2);
        width: auto;
        transform: none;
    }

    .channel-posts-sidebar {
        order: 1;
        position: static;
        max-height: none;
        overflow: visible;
    }

    .channel-posts-main {
        order: 2;
    }
}

@media (max-width: 768px) {
    .channel-posts-layout {
        grid-template-columns: 1fr;
    }

    .channel-posts-layout--single .channel-posts-main {
        width: 100%;
        max-width: none;
    }

    body.inertia-shell .channel-posts-layout--single .channel-posts-main,
    body.inertia-shell .catalog-main--content > .channel-feed-mobile-rail,
    body.inertia-shell .catalog-main--content > .channels-show-rail-fallback {
        max-width: none;
        margin-inline: 0;
    }

    .channel-posts-sidebar {
        position: static;
    }

    .gc-post-compose-form {
        gap: 0;
    }

    .gc-post-compose-form--stacked {
        gap: var(--space-4);
    }

    .gc-post-compose-avatar-slot {
        display: none;
    }

    .gc-post-compose-dock--floating:not(.gc-post-compose-dock--inline) {
        bottom: 12px;
    }

    /* Не трогаем --measured: иначе портрет сжимается по высоте (58vh) при той же ширине — жёсткий crop */
    .gc-post-media--1 .gc-post-media-item:not(.gc-post-media-item--measured) {
        max-height: min(58vh, 560px);
    }

    .gc-post-media--2.gc-post-media--smart-2-pl,
    .gc-post-media--2.gc-post-media--smart-2-lp {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
    }

    .gc-post-media--2.gc-post-media--smart-2-pl .gc-post-media-item:first-child,
    .gc-post-media--2.gc-post-media--smart-2-pl .gc-post-media-item:nth-child(2),
    .gc-post-media--2.gc-post-media--smart-2-lp .gc-post-media-item:first-child,
    .gc-post-media--2.gc-post-media--smart-2-lp .gc-post-media-item:nth-child(2) {
        grid-column: auto;
        grid-row: auto;
        width: 100%;
        height: auto;
    }

    .gc-post-media--2.gc-post-media--smart-2-pl .gc-post-media-item:first-child,
    .gc-post-media--2.gc-post-media--smart-2-lp .gc-post-media-item:nth-child(2) {
        aspect-ratio: var(--gc-media-ratio, 3 / 4);
    }

    .gc-post-media--2.gc-post-media--smart-2-pl .gc-post-media-item:nth-child(2),
    .gc-post-media--2.gc-post-media--smart-2-lp .gc-post-media-item:first-child {
        aspect-ratio: var(--gc-media-ratio, 3 / 2);
    }

    .gc-post-media--2.gc-post-media--smart-2-ll {
        grid-template-columns: 1fr;
        grid-template-rows: auto auto;
    }

    .gc-post-media--2.gc-post-media--smart-2-ll .gc-post-media-item {
        aspect-ratio: var(--gc-media-ratio, 3 / 2);
        max-height: min(42vh, 320px);
    }

    .gc-comment-compose-dock {
        left: var(--space-4);
        width: calc(100vw - var(--space-6));
        bottom: var(--space-4);
    }

    .gc-comment-compose-dock--floating {
        bottom: 12px;
    }

    .gc-comment-compose--dock {
        padding-left: var(--space-2);
        padding-right: var(--space-2);
    }

    .gc-comment-bubble {
        max-width: 100%;
    }

    .gc-comment-row {
        max-width: calc(100vw - 116px);
        padding-right: 0;
        width: 100%;
        display: flex;
        gap: var(--space-1);
    }

    .gc-comment-menu {
        position: static;
        flex-shrink: 0;
    }

    .gc-post-media--5,
    .gc-post-media--6,
    .gc-post-media--7,
    .gc-post-media--8,
    .gc-post-media--9,
    .gc-post-media--10 {
        grid-auto-rows: clamp(132px, 34vw, 220px);
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .gc-post-media--5.gc-post-media--ratio-profile-portrait,
    .gc-post-media--6.gc-post-media--ratio-profile-portrait,
    .gc-post-media--7.gc-post-media--ratio-profile-portrait,
    .gc-post-media--8.gc-post-media--ratio-profile-portrait,
    .gc-post-media--9.gc-post-media--ratio-profile-portrait,
    .gc-post-media--10.gc-post-media--ratio-profile-portrait {
        grid-auto-rows: clamp(148px, 36vw, 240px);
    }

    .gc-post-media--5.gc-post-media--ratio-profile-landscape,
    .gc-post-media--6.gc-post-media--ratio-profile-landscape,
    .gc-post-media--7.gc-post-media--ratio-profile-landscape,
    .gc-post-media--8.gc-post-media--ratio-profile-landscape,
    .gc-post-media--9.gc-post-media--ratio-profile-landscape,
    .gc-post-media--10.gc-post-media--ratio-profile-landscape {
        grid-auto-rows: clamp(118px, 30vw, 200px);
    }

    /*
     * Сброс десктопных grid-column/grid-row у nth-child — иначе они сильнее
     * .gc-post-media-item { grid-column: auto } и при 2 колонках часть кадров
     * уезжает в несуществующие треки / обрезается (видно «только три фото»).
     */
    .gc-post-media--5 .gc-post-media-item:nth-child(n),
    .gc-post-media--6 .gc-post-media-item:nth-child(n),
    .gc-post-media--7 .gc-post-media-item:nth-child(n),
    .gc-post-media--8 .gc-post-media-item:nth-child(n),
    .gc-post-media--9 .gc-post-media-item:nth-child(n),
    .gc-post-media--10 .gc-post-media-item:nth-child(n) {
        grid-row: auto;
        grid-column: auto;
    }

    .gc-post-media--5 .gc-post-media-item:first-child,
    .gc-post-media--7 .gc-post-media-item:first-child,
    .gc-post-media--9 .gc-post-media-item:first-child {
        grid-column: 1 / -1;
    }
    
    .gc-post-reactions {
        flex-wrap: wrap;
    }
    
    .gc-post-footer--feed {
        padding: var(--space-1) 0 0;
    }

    .gc-post-footer-top {
        width: 100%;
        padding: 0 var(--space-3) var(--space-3);
    }
    
    .gc-post-compose-toolbar {
        padding-left: 0;
    }

    .gc-post-compose-entry .stage-tiptap-editor {
        overscroll-behavior: auto;
        touch-action: manipulation;
    }
    
    .gc-post-comments-body {
        padding-left: 0;
        padding-right: 0;
        padding-bottom: var(--space-2);
    }
}

/*
 * Adaptive: шапка/тело/футер поста — space/3 (12), не space/4 поверх
 * уже ужатого --layout-content-inset-x. Иначе в day-card аватар сидит
 * глубже, чем «Ближайшие» / identity на том же экране.
 */
@media (max-width: 991.98px) {
    .gc-post--feed-preview {
        --post-inset: var(--space-3);
    }

    .gc-post-header {
        padding: var(--space-3);
    }

    .gc-post--feed-preview .gc-post-header {
        padding: var(--space-3) var(--post-inset);
    }

    .gc-post-body {
        padding: 0 var(--space-3) var(--space-3);
    }

    .gc-post--feed-preview .gc-post-body {
        padding: 0 var(--post-inset) var(--space-3);
    }

    .gc-post-footer {
        padding: var(--space-2) var(--space-3) var(--space-3);
    }

    .gc-post-footer--feed {
        padding: 0;
    }

    .gc-post-footer-top {
        padding: var(--space-1) var(--space-3) var(--space-3);
    }

    .gc-post--feed-preview .gc-post-footer--compact {
        padding: var(--space-3) var(--post-inset);
    }

    .gc-post--detail .gc-post-footer--detail {
        padding: var(--space-2);
    }
}