/* Vote-post framing + read-more clamp. Loaded only on vote posts. */

/* Wide column that frames the TotalPoll widget edge-to-edge. */
.shining-vote-post #content .post,
.shining-vote-post .single-post-box {
	max-width: 1140px;
	margin-inline: auto;
}

/* Read-more clamp: SEO-safe (max-height, never display:none). */
.sa-readmore { position: relative; }
/* overflow:hidden lives on the base so the box can be smoothly grown/shrunk in
   BOTH states; JS animates max-height between the clamp and the real height. */
.sa-readmore__inner {
	position: relative;
	overflow: hidden;
	transition: max-height .45s cubic-bezier(.4, 0, .2, 1);
}
@media (prefers-reduced-motion: reduce) {
	.sa-readmore__inner { transition: none; }
}
.sa-readmore[data-readmore]:not(.is-open) .sa-readmore__inner {
	max-height: 320px;
	/* Fade the prose's OWN alpha to transparent near the bottom (a mask, not a
	   painted overlay). Whatever sits behind it — page bg, the post card, any
	   style preset — shows through, so it blends perfectly with no visible box.
	   The old approach painted a --sa-bg gradient on top, which read as a dark
	   rectangle wherever the content card wasn't exactly --sa-bg. */
	-webkit-mask-image: linear-gradient(to bottom, #000 calc(100% - 150px), transparent);
	        mask-image: linear-gradient(to bottom, #000 calc(100% - 150px), transparent);
}
/* Compact gradient pill toggle with a chevron that flips when expanded. */
.sa-readmore__toggle {
	display: flex;
	align-items: center;
	gap: .5rem;
	width: fit-content;
	/* Breathing room above the pill and — importantly — below it, so the toggle
	   never collides with the heading/paragraph that follows the fold. */
	margin: 1.25rem auto 2rem;
	padding: .55rem 1.3rem;
	background: var(--sa-gradient);
	color: #fff;
	border: 0;
	border-radius: var(--sa-radius-pill);
	font: inherit;
	font-weight: 600;
	font-size: .9rem;
	line-height: 1;
	letter-spacing: .01em;
	cursor: pointer;
	box-shadow: 0 6px 18px rgba(124, 58, 237, .35);
	transition: transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.sa-readmore__toggle:hover {
	transform: translateY(-1px);
	filter: brightness(1.08);
	box-shadow: 0 8px 24px rgba(192, 38, 211, .45);
}
.sa-readmore__toggle:focus-visible {
	outline: 2px solid var(--sa-violet-light);
	outline-offset: 2px;
}
/* Chevron drawn from two borders; points down, flips up when open. */
.sa-readmore__toggle::after {
	content: "";
	width: .46rem;
	height: .46rem;
	border-right: 2px solid currentColor;
	border-bottom: 2px solid currentColor;
	transform: rotate(45deg);
	margin-top: -2px;
	transition: transform .2s ease, margin-top .2s ease;
}
.sa-readmore.is-open .sa-readmore__toggle::after {
	transform: rotate(-135deg);
	margin-top: 2px;
}

/* Inline article ads relocated below the fold (voting.php). The extra top
   margin keeps the slot well clear of the Read more / Show less pill —
   AdSense's accidental-click guidance wants interactive elements and ads
   visibly separated, and the pill sits directly above this slot. */
.entry-content .sa-postfold-ad {
	margin-top: 2.5rem;
	margin-bottom: 2rem;
}
.entry-content .sa-postfold-ad + .sa-postfold-ad { margin-top: 2rem; }
