/* Feed Deck — front end. Follows the theme: uses --rs-accent (Rota themes) when present. */
.fd-feed {
	--fd-accent: var(--rs-accent, var(--fd-own-accent, #3858E9));
	--fd-bg: #ffffff;
	--fd-ink: #16191F;
	--fd-muted: #5A6472;
	--fd-line: #E3E6EA;
	--fd-radius: var(--rs-r, 12px);
	--fd-gap: clamp(12px, 2vw, 20px);
	font: inherit;
}
.fd-style-dark { --fd-bg: #1F232B; --fd-ink: #F3F4F6; --fd-muted: #A9B1BD; --fd-line: rgba(255,255,255,0.12); }
.fd-style-theme { --fd-bg: transparent; --fd-ink: inherit; --fd-muted: currentColor; --fd-line: color-mix(in srgb, currentColor 18%, transparent); }

.fd-items { display: grid; grid-template-columns: repeat(var(--fd-cols, 3), minmax(0, 1fr)); gap: var(--fd-gap); align-items: start; }
.fd-layout-masonry .fd-items { display: block; columns: var(--fd-cols, 3) 260px; column-gap: var(--fd-gap); }
.fd-layout-masonry .fd-card { break-inside: avoid; margin-bottom: var(--fd-gap); }
.fd-layout-list .fd-items { grid-template-columns: minmax(0, 1fr); }
.fd-layout-list .fd-card { display: grid; grid-template-columns: minmax(0, 220px) minmax(0, 1fr); grid-template-areas: "media head" "media text" "media foot"; }
.fd-layout-list .fd-card-head { grid-area: head; }
.fd-layout-list .fd-media { grid-area: media; height: 100%; aspect-ratio: auto; }
.fd-layout-list .fd-text { grid-area: text; }
.fd-layout-list .fd-card-foot { grid-area: foot; }
.fd-layout-carousel .fd-items { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: calc((100% - (var(--fd-cols, 3) - 1) * var(--fd-gap)) / var(--fd-cols, 3)); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; padding-bottom: 4px; }
.fd-layout-carousel .fd-items::-webkit-scrollbar { display: none; }
.fd-layout-carousel .fd-card { scroll-snap-align: start; }

.fd-card { display: flex; flex-direction: column; background: var(--fd-bg); color: var(--fd-ink); border: 1px solid var(--fd-line); border-radius: var(--fd-radius); overflow: hidden; min-width: 0; }
.fd-card-head { display: flex; align-items: center; gap: 10px; padding: 14px 14px 12px; }
.fd-avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex: none; }
.fd-avatar-empty { display: grid; place-items: center; background: var(--fd-accent); color: #fff; font-weight: 700; }
.fd-who { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; flex: 1; }
.fd-who strong { font-size: 0.95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fd-who time { font-size: 0.8rem; color: var(--fd-muted); }
.fd-net { color: var(--fd-muted); display: inline-flex; }
.fd-on-facebook .fd-net { color: #1877F2; }
.fd-on-instagram .fd-net { color: #D62976; }
.fd-on-youtube .fd-net { color: #FF0000; }
.fd-on-rss .fd-net { color: #EE802F; }
.fd-style-dark .fd-net, .fd-style-theme .fd-net { color: inherit; opacity: 0.8; }

.fd-media { position: relative; display: block; aspect-ratio: 1 / 1; background: color-mix(in srgb, var(--fd-ink) 8%, transparent); overflow: hidden; }
.fd-on-youtube .fd-media { aspect-ratio: 16 / 9; }
.fd-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.35s; }
a.fd-media:hover img { transform: scale(1.02); }
.fd-yt { all: unset; position: absolute; inset: 0; cursor: pointer; }
.fd-yt:focus-visible { outline: 3px solid var(--fd-accent); outline-offset: -3px; }
.fd-media iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.fd-play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; background: rgba(0,0,0,0.62); color: #fff; padding-left: 3px; box-sizing: border-box; }
.fd-count { position: absolute; right: 10px; top: 10px; background: rgba(0,0,0,0.6); color: #fff; font-size: 0.75rem; font-weight: 700; padding: 3px 8px; border-radius: 999px; }

.fd-text { padding: 12px 14px 0; font-size: 0.95rem; line-height: 1.55; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: var(--fd-lines, 5); line-clamp: var(--fd-lines, 5); overflow: hidden; overflow-wrap: anywhere; }
.fd-text a { color: var(--fd-accent); }
.fd-card-foot { margin-top: auto; padding: 12px 14px 14px; font-size: 0.85rem; }
.fd-card-foot a { color: var(--fd-muted); font-weight: 600; text-decoration: none; }
.fd-card-foot a:hover, .fd-card-foot a:focus { color: var(--fd-accent); text-decoration: underline; }

.fd-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: var(--fd-gap); }
.fd-filter { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 999px; border: 1.5px solid var(--fd-line); background: transparent; color: inherit; font: inherit; font-size: 0.9rem; font-weight: 600; cursor: pointer; }
.fd-filter:hover { border-color: currentColor; }
.fd-filter.is-active { background: var(--fd-accent); border-color: var(--fd-accent); color: var(--rs-on-accent, #fff); }
.fd-more-wrap { text-align: center; margin-top: var(--fd-gap); }
.fd-more { padding: 12px 24px; border-radius: var(--fd-radius); border: 2px solid currentColor; background: transparent; color: inherit; font: inherit; font-weight: 700; cursor: pointer; }
.fd-more:hover { background: var(--fd-accent); border-color: var(--fd-accent); color: var(--rs-on-accent, #fff); }
.fd-more[disabled] { opacity: 0.6; cursor: progress; }
.fd-carousel-nav { display: flex; justify-content: flex-end; gap: 8px; margin-top: 12px; }
.fd-nav { width: 42px; height: 42px; border-radius: 50%; border: 1.5px solid var(--fd-line); background: transparent; color: inherit; display: grid; place-items: center; cursor: pointer; }
.fd-nav:hover { border-color: currentColor; }
.fd-follow { display: flex; flex-wrap: wrap; gap: 10px; margin-top: var(--fd-gap); }
.fd-follow-link { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border-radius: 999px; border: 1.5px solid var(--fd-line); color: inherit; text-decoration: none; font-weight: 600; font-size: 0.9rem; }
.fd-follow-link:hover { border-color: currentColor; }
.fd-empty { opacity: 0.75; }
.fd-feed .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
.fd-feed :focus-visible { outline: 3px solid var(--fd-accent); outline-offset: 2px; }

@media (max-width: 900px) {
	.fd-items { grid-template-columns: repeat(min(var(--fd-cols, 3), 2), minmax(0, 1fr)); }
	.fd-layout-carousel .fd-items { grid-auto-columns: calc((100% - var(--fd-gap)) / 2); }
}
@media (max-width: 560px) {
	.fd-items { grid-template-columns: minmax(0, 1fr); }
	.fd-layout-carousel .fd-items { grid-auto-columns: 85%; }
	.fd-layout-list .fd-card { grid-template-columns: minmax(0, 1fr); grid-template-areas: "head" "media" "text" "foot"; }
	.fd-layout-list .fd-media { aspect-ratio: 1 / 1; }
}
@media (prefers-reduced-motion: reduce) { .fd-media img { transition: none; } .fd-layout-carousel .fd-items { scroll-behavior: auto; } }