/* =========================================================================
   GeeKPress Limelight — movie.css
   Theme-side gp_movie / gp_tvshow / gp_episode single layout.
   SKELETON BREAK Layer 1 lives in geekpress/single-movie.php: the server
   builds a slim "billing strip" — playbill columns on a stage band under
   the curtain scallop — ABOVE the React app (which carries the poster).
   ========================================================================= */

.lml-marquee { border-radius: var(--lml-radius-lg); }
.lml-marquee-inner {
	padding: 34px 40px 28px;
}

/* billing columns — playbill table */
.lml-marquee-bill {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
	gap: 22px 28px;
	align-content: center;
	min-height: 100%;
}
.lml-bill-cell { display: grid; gap: 9px; align-content: start; padding-top: 12px; border-top: 1px solid var(--lml-line-2); }
.lml-bill-label {
	font-family: var(--lml-font-mono);
	font-size: 10.5px;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--lml-lime);
}
.lml-bill-value { color: var(--lml-cream); font-family: var(--lml-font-display); font-size: 21px; }
.lml-bill-score { display: flex; align-items: center; gap: 14px; }
.lml-bill-score-num {
	font-family: var(--lml-font-display);
	font-weight: 400;
	font-size: 42px;
	line-height: 1;
	color: var(--lml-lime);
	text-shadow: 0 0 26px var(--lml-glow);
}
.lml-bill-score-side { display: grid; gap: 5px; }
.lml-bill-score-side small { color: var(--lml-text-mute); font-family: var(--lml-font-mono); font-size: 11px; }

.lml-release-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 7px; }
.lml-release-list li {
	display: flex;
	align-items: center;
	font-family: var(--lml-font-mono);
	font-size: 13px;
	color: var(--lml-text-dim);
}

/* the React app re-printed in our container — NO box: the hero backdrop
   bleeds full-width (border/overflow would frame and clip it) */
.lml-title-flow { display: grid; gap: 8px; }
.lml-movie-app {
	margin-top: 0;
}
.lml-title-sect { margin-top: 40px; }

/* breakpoints for the billing strip */
@media (max-width: 900px) {
	.lml-marquee-inner { padding: 26px 24px 22px; }
}
@media (max-width: 640px) {
	.lml-marquee-bill { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}
@media (max-width: 400px) {
	.lml-marquee-bill { grid-template-columns: minmax(0, 1fr); }
}