/* Edge-to-edge media; only reading and input surfaces receive horizontal padding. */
.home-feed-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; padding-inline: 12px; }
.home-feed-heading h2 { margin: 0; font-size: .9375rem; line-height: 1.3; letter-spacing: -.02em; font-weight: 600; }
.home-feed-heading button { color: var(--link); min-height: 44px; padding: 0 0 0 8px; font-size: .75rem; }
.home-feed-heading > span { color: var(--text-3); font-size: .6875rem; }
.home-following { margin-bottom: 6px; }
.home-following[hidden] { display: none; }
.home-following .home-feed-heading { min-height: 24px; padding-bottom: 4px; }
.home-following h2 { font-size: .75rem; color: var(--text-2); letter-spacing: 0; }
.home-following-rail { display: flex; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: none; gap: 0; scroll-snap-type: x proximity; }
.home-following-rail::-webkit-scrollbar { display: none; }
.home-following-item { flex: 0 0 112px; min-width: 0; height: 88px; margin-right: -6px; position: relative; text-align: left; scroll-snap-align: start; }
.home-following-cover { display: block; position: absolute; inset: 0; overflow: hidden; background: var(--surface-2); clip-path: polygon(8px 0,100% 0,calc(100% - 8px) 100%,0 100%); }
.home-following-item:first-child .home-following-cover { clip-path: polygon(0 0,100% 0,calc(100% - 8px) 100%,0 100%); }
.home-following-cover::after { content: ''; position: absolute; inset: 0; background: linear-gradient(transparent 30%,#000b); }
.home-following-item.watched .home-following-cover { opacity: .55; }
.home-following-cover img { width: 100%; height: 100%; object-fit: cover; }
.home-card-author { position: absolute; bottom: 7px; left: 10px; right: 13px; display: flex; align-items: center; gap: 4px; min-width: 0; color: #fff; font-size: .625rem; line-height: 1.4; text-shadow: 0 1px 3px #0009; pointer-events: none; }
.home-card-author > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.home-card-avatar { width: 16px; height: 16px; border-radius: 50%; object-fit: cover; flex: 0 0 auto; }
/* Exactly the author-gallery contact sheet: the tile is the button itself, native control appearance is off,
   the grid paints the dark seam colour under a 1px gap, and each tile's outer shadow covers that gap. */
.home-feed-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); align-items: start; gap: 1px; background: #101114; overflow: hidden; }
.home-content-card { min-width: 0; }
.home-content-open { display: block; position: relative; width: 100%; aspect-ratio: 9 / 16; padding: 0; margin: 0; border: 0; border-radius: 0; overflow: hidden; text-align: left; background: var(--surface-2); box-shadow: 1px 0 #101114, 0 1px #101114; -webkit-appearance: none; appearance: none; }
.home-content-cover { display: block; position: absolute; inset: 0; }
.home-content-cover > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
/* iOS WebKit draws a light placeholder outline around a sized <img> that has no bitmap yet. The gallery hides its
   image until it loads (.author-tile.loading img { opacity: 0 }); home does the same for every poster and avatar. */
.home-feed-grid img:not(.ready), .home-following-cover img:not(.ready), .home-card-avatar:not(.ready) { opacity: 0; }
.home-content-comment { grid-column: 1 / -1; display: grid; grid-template-columns: 42px minmax(0,1fr); align-items: center; gap: 10px; width: 100%; text-align: left; padding: 10px 12px; border-radius: 0; background: var(--surface-2); }
.home-conversation-copy { display: grid; gap: 4px; min-width: 0; }
.home-conversation-poster { width: 42px; height: 56px; object-fit: cover; border-radius: 3px; }
.home-comment-label { color: var(--link); font-size: .625rem; line-height: 1.3; }
.home-comment-body { color: var(--text); font-size: .8125rem; line-height: 1.4; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.home-comment-handle { color: var(--text-3); font-size: .625rem; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#home-feed-status { font-size: .8125rem; line-height: 1.5; margin: 12px; }
#home-feed-status:empty { display: none; }
.home-feed-more { width: calc(100% - 24px); margin: 8px 12px; }
.home-continue-clip { padding-inline: 12px; }
html[data-access-held] :is(.home-following,.home-discovery) { visibility: hidden; }
.home-following-item:focus-visible, .home-content-open:focus-visible, .home-content-comment:focus-visible { outline: 2px solid var(--link); outline-offset: -2px; z-index: 1; }

#home-feed-sentinel { height: 1px; }