/* ════════════════════════════════════════════════════════════════════════════════════════════════════════
   LUSTLIT SITE ART (2026-10-01): the girls on the site's own pages.
   Hayden, 2026-10-01: "It doesn't look like a porn site, because theres no sexy, enticing art of our characters."
   Then: "every page has some kind of different, sexual pose or some kind of eye candy" and "have different designs
   for each device".

   Markup comes from site-art/slots/<season>/<slot>.html (build_slots.py); the rules that name a picture are in
   site-art/generated.css. Two seasons: default (her approved look on crimson) and october (No. 1's costumes; the
   pumpkin is No. 1's own accent, #f97316).

   FOUR DESIGNS, ONE PER KIND OF SCREEN
     phone            <= 599px          the group pans across all seven; cards two up; pin-ups under the words
     portrait tablet  600-1100, upright the two-row group (a <picture> source); cards three up; pin-ups at the edges
     landscape, desk  the rest          the wide line-up; cards four up; pin-ups either side of the words
     wide             >= 1800px         a bigger line-up; all seven cards in one row
   A phone held sideways (short and wide) puts the words beside the group.

   The colour law holds: #ef4444 is the accent and type, #c41e3a only ever a fill or a glow, no gold, numbers white.
   October bends ONE thing: eyebrows and chips go pumpkin, scoped to body.ll-season-october. Icons are drawn. Every
   picture keeps its watermark visible: nothing here fades or crops the bottom-right corner of an image.
   ════════════════════════════════════════════════════════════════════════════════════════════════════════ */

:root {
	--llsa-pumpkin: #f97316;
	--llsa-ink: rgba(255, 255, 255, .78);
	--llsa-card: #121014;
}

/* ── shared type ──────────────────────────────────────────────────────────────────────────────────────── */
.llsa-eyebrow {
	display: inline-block;
	font-size: .6875rem;
	font-weight: 700;
	letter-spacing: .26em;
	text-transform: uppercase;
	color: #ef4444;
}
body.ll-season-october .llsa-eyebrow { color: var(--llsa-pumpkin); }
.llsa-title {
	margin: .55rem auto .7rem;
	font-size: clamp(1.9rem, 4vw, 2.75rem);
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -.03em;
	color: #fff;
}
.llsa-sub {
	max-width: 40rem;
	margin: 0 auto 2.25rem;
	font-size: 1.02rem;
	line-height: 1.65;
	color: var(--llsa-ink);
}
.llsa-ctas {
	display: flex;
	flex-wrap: wrap;
	gap: .75rem;
	justify-content: center;
}

/* ── THE GROUP: the hero, and the band on About ────────────────────────────────────────────────────────── */
.llsa-hero,
.llsa-band {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	background: #0a0a0a;
	text-align: center;
}
.llsa-hero { padding: clamp(5.25rem, 9vw, 6.75rem) var(--space-md, 1rem) 0; }
.llsa-band { padding: clamp(2rem, 4vw, 3rem) var(--space-md, 1rem) 0; border-bottom: 1px solid rgba(255, 255, 255, .06); }
.llsa-hero__glow {
	position: absolute;
	inset: 0;
	z-index: -1;
	pointer-events: none;
	background:
		radial-gradient(62% 78% at 50% 104%, rgba(196, 30, 58, .72), rgba(196, 30, 58, 0) 72%),
		radial-gradient(26% 36% at 50% 104%, rgba(239, 68, 68, .34), transparent 72%),
		radial-gradient(130% 95% at 50% 35%, transparent 55%, rgba(0, 0, 0, .72) 100%);
}
.llsa-hero--october .llsa-hero__glow {
	background:
		radial-gradient(3.2% 5.6% at 86% 17%, rgba(255, 244, 228, .9), rgba(255, 244, 228, .9) 60%, rgba(255, 244, 228, 0) 100%),
		radial-gradient(14% 22% at 86% 17%, rgba(255, 236, 210, .12), transparent 70%),
		radial-gradient(60% 74% at 50% 106%, rgba(249, 115, 22, .5), rgba(249, 115, 22, 0) 72%),
		radial-gradient(30% 42% at 50% 106%, rgba(196, 30, 58, .58), transparent 72%),
		radial-gradient(130% 95% at 50% 35%, transparent 55%, rgba(0, 0, 0, .74) 100%);
}
.llsa-hero__text {
	position: relative;
	z-index: 2;
	max-width: 46rem;
	margin: 0 auto;
}
.llsa-hero__title {
	margin: .55rem 0 .7rem;
	font-size: clamp(2.35rem, 5.6vw, 4.1rem);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -.035em;
	color: #fff;
}
.llsa-hero__sub {
	max-width: 38rem;
	margin: 0 auto 1.6rem;
	font-size: 1.08rem;
	line-height: 1.6;
	color: var(--llsa-ink);
}
.llsa-hero__stage {
	position: relative;
	max-width: 1500px;
	margin: clamp(1.5rem, 3vw, 2.5rem) auto 0;
}
.llsa-band .llsa-hero__stage { margin-top: 0; }
.llsa-hero__stage picture { display: block; }
.llsa-hero__group {
	display: block;
	width: 100%;
	height: auto;
	margin: 0 auto;
}
/* The floor: the site's neon seam under their feet (neon-seam.md: #ef4444 core, drop-shadow aura, never box-shadow). */
.llsa-hero__floor {
	position: absolute;
	left: 50%;
	bottom: 0;
	width: min(92%, 1180px);
	height: 2px;
	transform: translateX(-50%);
	background: linear-gradient(90deg, rgba(239, 68, 68, 0), #ef4444 22%, #ef4444 78%, rgba(239, 68, 68, 0));
	filter: drop-shadow(0 0 6px rgba(239, 68, 68, .9)) drop-shadow(0 0 18px rgba(239, 68, 68, .55));
	z-index: 3;
	pointer-events: none;
}
body.ll-season-october .llsa-hero .llsa-hero__floor {
	background: linear-gradient(90deg, rgba(249, 115, 22, 0), var(--llsa-pumpkin) 22%, #ef4444 50%, var(--llsa-pumpkin) 78%, rgba(249, 115, 22, 0));
	filter: drop-shadow(0 0 6px rgba(249, 115, 22, .85)) drop-shadow(0 0 18px rgba(239, 68, 68, .5));
}
.llsa-band__line { margin: 0; padding: 1.1rem 0 1.4rem; }
.llsa-band__line a { font-weight: 700; color: #ef4444; text-decoration: none; }
.llsa-band__line a:hover { color: #f87171; }

/* wide screens: a bigger line-up */
@media (min-width: 1800px) {
	.llsa-hero__stage { max-width: 1760px; }
}

/* portrait tablets: the two-row group (the <picture> serves it), held to the screen's height */
@media (min-width: 600px) and (max-width: 1100px) and (orientation: portrait) {
	.llsa-hero__group {
		width: auto;
		max-width: min(100%, 980px);
		max-height: 62vh;
	}
	.llsa-hero { padding-top: clamp(5rem, 11vw, 6.5rem); }
	.llsa-hero__title { font-size: clamp(2.6rem, 7vw, 3.6rem); }
}

/* phones: the group first, panning slowly across all seven; the words under it */
@keyframes llsa-pan {
	from { transform: translateX(0); }
	to   { transform: translateX(calc(-100% + 100vw)); }
}
@media (max-width: 599px) {
	.llsa-hero {
		display: flex;
		flex-direction: column-reverse;
		padding: var(--header-height, 56px) 0 2.6rem;
	}
	.llsa-band { padding: 0; }
	.llsa-hero__text { padding: 0 1.15rem; }
	.llsa-hero__stage {
		height: min(58vh, 480px);
		margin: 0 0 1.4rem;
		overflow: hidden;
	}
	.llsa-band .llsa-hero__stage { margin: 0; height: min(50vh, 420px); }
	.llsa-hero__group {
		height: 100%;
		width: auto;
		max-width: none;
		margin: 0;
		animation: llsa-pan 30s ease-in-out infinite alternate;
		will-change: transform;
	}
	.llsa-hero__title { font-size: clamp(2.1rem, 10vw, 2.7rem); }
	.llsa-hero__sub { font-size: 1rem; }
	.llsa-hero__glow {                       /* the light pools under the group, not under the words */
		background:
			radial-gradient(80% 40% at 50% 60%, rgba(196, 30, 58, .62), rgba(196, 30, 58, 0) 72%),
			radial-gradient(40% 22% at 50% 60%, rgba(239, 68, 68, .3), transparent 72%);
	}
	.llsa-band .llsa-hero__glow { background: radial-gradient(90% 60% at 50% 100%, rgba(196, 30, 58, .6), transparent 72%); }
	.llsa-hero--october .llsa-hero__glow {
		background:
			radial-gradient(85% 42% at 50% 60%, rgba(249, 115, 22, .48), rgba(249, 115, 22, 0) 72%),
			radial-gradient(45% 24% at 50% 60%, rgba(196, 30, 58, .5), transparent 72%);
	}
}
@media (max-width: 380px), (max-height: 700px) and (max-width: 599px) {
	.llsa-hero__stage { height: min(52vh, 400px); }      /* small phones keep the words on the first screen */
}
@media (max-width: 599px) and (prefers-reduced-motion: reduce) {
	.llsa-hero__group { animation: none; transform: translateX(calc(-50% + 50vw)); }
}

/* a phone held sideways: the words beside the group */
@media (orientation: landscape) and (max-height: 520px) and (min-width: 600px) {
	.llsa-hero {
		display: grid;
		grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
		align-items: end;
		gap: 1rem;
		padding: calc(var(--header-height, 56px) + .75rem) 1.25rem 0;
		text-align: left;
	}
	.llsa-hero__text { margin: 0 0 2rem; }
	.llsa-hero .llsa-ctas { justify-content: flex-start; }
	.llsa-hero__title { font-size: 2rem; }
	.llsa-hero__sub { font-size: .95rem; margin: 0 0 1rem; }
	.llsa-hero__stage { margin: 0; }
	.llsa-hero__group { max-height: calc(100vh - var(--header-height, 56px) - 1rem); width: auto; max-width: 100%; }
}

/* ── THE CURRENT ISSUE ────────────────────────────────────────────────────────────────────────────────── */
.llsa-issue {
	padding: clamp(3.5rem, 7vw, 5rem) var(--space-md, 1rem);
	background: linear-gradient(180deg, #0a0a0a, #0e0b0d);
	border-top: 1px solid rgba(255, 255, 255, .06);
}
.llsa-issue__inner {
	display: grid;
	grid-template-columns: minmax(0, 340px) minmax(0, 1fr);
	gap: clamp(1.75rem, 5vw, 4rem);
	align-items: center;
	max-width: 1040px;
	margin: 0 auto;
}
.llsa-issue__cover {
	display: block;
	position: relative;
	border-radius: 3px;
	transform: perspective(1400px) rotateY(-9deg);
	box-shadow: 18px 22px 46px rgba(0, 0, 0, .65);
	transition: transform .5s ease;
}
.llsa-issue__cover:hover { transform: perspective(1400px) rotateY(-3deg); }
.llsa-issue__cover img { display: block; width: 100%; height: auto; border-radius: 3px; }
.llsa-issue__cover::after {          /* the spine's shade, as on the Issues page */
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 3px;
	background: linear-gradient(90deg, rgba(0, 0, 0, .35), rgba(255, 255, 255, .06) 4%, transparent 9%);
	pointer-events: none;
}
.llsa-issue__title {
	margin: .45rem 0 .5rem;
	font-size: clamp(1.9rem, 4vw, 2.6rem);
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -.03em;
	color: #fff;
}
.llsa-issue__kicker { margin: 0 0 1rem; font-size: 1.12rem; font-weight: 700; line-height: 1.45; color: #fff; }
.llsa-issue__counts {
	display: flex;
	flex-wrap: wrap;
	gap: .35rem 1.1rem;
	margin: 0 0 1.5rem;
	font-size: .72rem;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .62);
}
.llsa-issue__counts b { font-size: 1.15rem; letter-spacing: 0; color: #fff; margin-right: .3rem; }
.llsa-issue .llsa-ctas { justify-content: flex-start; }
@media (max-width: 760px) {
	.llsa-issue__inner { grid-template-columns: 1fr; text-align: center; }
	.llsa-issue__cover { max-width: 260px; margin: 0 auto; transform: none; }
	.llsa-issue__counts, .llsa-issue .llsa-ctas { justify-content: center; }
}

/* ── THE CARDS: the girls, the costumes, the stories ──────────────────────────────────────────────────── */
.llsa-roster {
	padding: clamp(3.5rem, 7vw, 5.5rem) var(--space-md, 1rem);
	background: #0a0a0a;
	text-align: center;
}
.llsa-grid {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: clamp(1rem, 2vw, 1.5rem) clamp(.75rem, 1.6vw, 1.25rem);
	max-width: 1240px;
	margin: 0 auto;
}
.llsa-card {
	flex: 0 1 calc(25% - 1rem);                          /* desktop: four up */
	display: flex;
	flex-direction: column;
	min-width: 0;
	text-align: left;
	text-decoration: none;
	color: inherit;
	-webkit-tap-highlight-color: transparent;
}
.llsa-card__art {
	position: relative;
	display: block;
	aspect-ratio: 7 / 9;
	overflow: hidden;
	border-radius: var(--tile-radius, 6px);
	border: 1px solid rgba(255, 255, 255, .08);
	background:
		radial-gradient(85% 70% at 50% 92%, color-mix(in srgb, var(--c, #c41e3a) 58%, transparent), transparent 72%),
		linear-gradient(180deg, #151116 0%, #0b0a0c 100%);
	transition: border-color .25s ease;
}
.llsa-card__art img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	transition: transform .55s cubic-bezier(.2, .7, .2, .94);
}
.llsa-card--girl .llsa-card__art img {
	top: auto;
	height: 96%;
	object-fit: contain;
	object-position: center bottom;
	transform-origin: 50% 100%;
}
.llsa-card--picture .llsa-card__art img { object-fit: cover; object-position: center top; }
.llsa-card:hover .llsa-card__art,
.llsa-card:focus-visible .llsa-card__art { border-color: rgba(239, 68, 68, .55); }
body.ll-season-october .llsa-card:hover .llsa-card__art,
body.ll-season-october .llsa-card:focus-visible .llsa-card__art { border-color: rgba(249, 115, 22, .6); }
.llsa-card:hover .llsa-card__art img { transform: scale(1.035); }
.llsa-card__chip {
	position: absolute;
	top: .65rem;
	left: .65rem;
	z-index: 2;
	padding: .3rem .6rem;
	border-radius: 999px;
	font-size: .62rem;
	font-weight: 700;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #fff;
	background: rgba(10, 10, 10, .62);
	border: 1px solid rgba(239, 68, 68, .55);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}
body.ll-season-october .llsa-card__chip { border-color: rgba(249, 115, 22, .7); }
.llsa-card__body { display: flex; flex-direction: column; gap: .2rem; padding: .85rem .2rem 0; }
.llsa-card__kicker {
	font-size: .64rem;
	font-weight: 700;
	letter-spacing: .2em;
	text-transform: uppercase;
	color: #ef4444;
}
body.ll-season-october .llsa-card__kicker { color: var(--llsa-pumpkin); }
.llsa-card__name { font-size: 1.12rem; font-weight: 800; letter-spacing: -.02em; line-height: 1.2; color: #fff; }
.llsa-card__line { font-size: .9rem; line-height: 1.5; color: rgba(255, 255, 255, .7); }
.llsa-card--girl .llsa-card__line { font-style: italic; }          /* italic means tagline (design-system.md §2) */
.llsa-card__go {
	margin-top: .35rem;
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #ef4444;
}
body.ll-season-october .llsa-card__go { color: var(--llsa-pumpkin); }

/* wide: all seven in one row */
@media (min-width: 1800px) {
	.llsa-grid { max-width: 1720px; }
	.llsa-card { flex-basis: calc(14.2857% - 1.1rem); }
	.llsa-card__line { font-size: .86rem; }
}
/* tablets: three up */
@media (min-width: 600px) and (max-width: 899px) {
	.llsa-card { flex-basis: calc(33.333% - .85rem); }
}
/* phones: two up */
@media (max-width: 599px) {
	.llsa-card { flex-basis: calc(50% - .5rem); }
	.llsa-card__chip { top: .45rem; left: .45rem; padding: .25rem .5rem; font-size: .56rem; letter-spacing: .12em; }
}
@media (max-width: 380px) {
	.llsa-card__name { font-size: 1rem; }
	.llsa-card__line { font-size: .84rem; }
}

/* ── WHAT MEMBERS SEE ─────────────────────────────────────────────────────────────────────────────────── */
.llsa-members {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding: clamp(4rem, 9vw, 6.5rem) var(--space-md, 1rem);
	background: #0a0a0a;
	border-top: 1px solid rgba(255, 255, 255, .06);
	border-bottom: 1px solid rgba(255, 255, 255, .06);
	text-align: center;
}
.llsa-members__wall {
	position: absolute;
	inset: -6% -4%;
	z-index: -2;
	display: grid;
	grid-template-columns: repeat(8, 1fr);                /* desktop */
	gap: 10px;
	transform: rotate(-4deg) scale(1.06);
	opacity: .82;
}
.llsa-members__wall img {
	display: block;
	width: 100%;
	aspect-ratio: 7 / 9;
	object-fit: cover;
	border-radius: 6px;
}
.llsa-members::before {
	content: "";
	position: absolute;
	inset: 0;
	z-index: -1;
	background:
		radial-gradient(55% 70% at 50% 50%, rgba(10, 10, 10, .88), rgba(10, 10, 10, .45) 70%, rgba(10, 10, 10, .12)),
		linear-gradient(180deg, #0a0a0a 0%, rgba(10, 10, 10, 0) 18%, rgba(10, 10, 10, 0) 82%, #0a0a0a 100%);
}
.llsa-members__panel {
	position: relative;
	max-width: 36rem;
	margin: 0 auto;
	padding: clamp(1.8rem, 4vw, 2.6rem) clamp(1.25rem, 4vw, 2.6rem);
	border-radius: 10px;
	background: rgba(13, 9, 11, .82);
	border: 1px solid rgba(239, 68, 68, .42);
}
.llsa-members__lock { display: block; width: 34px; height: 34px; margin: 0 auto .7rem; color: #ef4444; }
body.ll-season-october .llsa-members__lock { color: var(--llsa-pumpkin); }
.llsa-members .llsa-sub { margin-bottom: 1.6rem; }
@media (min-width: 1800px) { .llsa-members__wall { grid-template-columns: repeat(10, 1fr); } }
@media (min-width: 600px) and (max-width: 1099px) { .llsa-members__wall { grid-template-columns: repeat(6, 1fr); } }
@media (max-width: 599px) { .llsa-members__wall { grid-template-columns: repeat(4, 1fr); } }

/* ── THE STORIES PAGE: a lead picture, then the issues' stories ────────────────────────────────────────── */
.llsa-stories {
	grid-column: 1 / -1;
	padding: .5rem 0 3rem;
	text-align: center;
}
.llsa-stories .llsa-grid { max-width: 1180px; }
.llsa-stories__more { margin: 2.4rem 0 0; }
.llsa-stories__more a { font-weight: 700; color: #ef4444; text-decoration: none; }
.llsa-feature {
	display: grid;
	grid-template-columns: minmax(0, 5fr) minmax(0, 6fr);
	gap: clamp(1.5rem, 4vw, 3.25rem);
	align-items: center;
	max-width: 1040px;
	margin: 0 auto clamp(3rem, 6vw, 4.5rem);
	text-align: left;
}
.llsa-feature__art {
	position: relative;
	display: block;
	overflow: hidden;
	border-radius: 8px;
	border: 1px solid rgba(255, 255, 255, .08);
	box-shadow: 0 30px 60px -20px color-mix(in srgb, var(--c, #c41e3a) 55%, transparent);
}
.llsa-feature__art img { display: block; width: 100%; height: auto; transition: transform .6s cubic-bezier(.2, .7, .2, .94); }
.llsa-feature__art:hover img { transform: scale(1.03); }
.llsa-feature__title {
	margin: .5rem 0 .35rem;
	font-size: clamp(2.2rem, 4.5vw, 3.3rem);
	font-weight: 800;
	line-height: 1;
	letter-spacing: -.035em;
	color: #fff;
}
.llsa-feature__by {
	margin: 0 0 1rem;
	font-size: .78rem;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: rgba(255, 255, 255, .62);
}
.llsa-feature__line { margin: 0 0 .6rem; font-size: 1.2rem; font-weight: 700; line-height: 1.4; color: #fff; }
.llsa-feature__dek { margin: 0 0 1.5rem; font-size: 1rem; line-height: 1.6; color: var(--llsa-ink); }
.llsa-feature .llsa-ctas { justify-content: flex-start; }
@media (min-width: 1800px) { .llsa-stories .llsa-grid { max-width: 1720px; } }
@media (min-width: 600px) and (max-width: 899px) {
	.llsa-feature { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
}
@media (max-width: 599px) {
	.llsa-feature { grid-template-columns: 1fr; text-align: center; padding: 0 .25rem; }
	.llsa-feature__art { max-width: 420px; margin: 0 auto; }
	.llsa-feature .llsa-ctas { justify-content: center; }
}

/* ── A PIN-UP EITHER SIDE OF THE WORDS (Membership, My LustLit) ───────────────────────────────────────── */
.membership-hero,
.mll-gate-hero {
	position: relative;
	isolation: isolate;
	overflow: hidden;
}
.membership-hero > *:not(.llsa-flank),
.mll-gate-hero-inner { position: relative; z-index: 2; }
.llsa-flank__girl {
	position: absolute;
	bottom: 0;
	z-index: 1;
	height: 100%;
	pointer-events: none;
}
.llsa-flank__girl::before {                             /* her colour, glowing at her feet */
	content: "";
	position: absolute;
	inset: 30% -25% -6% -25%;
	z-index: -1;
	background: radial-gradient(50% 50% at 50% 80%, color-mix(in srgb, var(--c, #c41e3a) 55%, transparent), transparent 72%);
}
.llsa-flank__girl img { display: block; height: 100%; width: auto; }
.llsa-flank__girl--l { left: max(1.5vw, calc(50% - 720px)); }
.llsa-flank__girl--r { right: max(1.5vw, calc(50% - 720px)); }
/* desktop: tall enough for the girls to stand at full height beside the words */
@media (min-width: 1100px) {
	.membership-hero:has(.llsa-flank),
	.mll-gate-hero:has(.llsa-flank) { min-height: 600px; display: flex; flex-direction: column; justify-content: center; }
	.llsa-flank__girl { height: 94%; }
}
/* tablets: smaller, pressed to the edges */
@media (min-width: 600px) and (max-width: 1099px) {
	.membership-hero:has(.llsa-flank),
	.mll-gate-hero:has(.llsa-flank) { min-height: 520px; display: flex; flex-direction: column; justify-content: center; }
	.llsa-flank__girl { height: 66%; opacity: .95; }
	.llsa-flank__girl--l { left: -3%; }
	.llsa-flank__girl--r { right: -3%; }
}
/* with a pin-up either side, the words keep to the middle column */
@media (min-width: 600px) {
	.membership-hero:has(.llsa-flank) .membership-hero-sub { max-width: 34rem; margin-left: auto; margin-right: auto; }
	.mll-gate-hero:has(.llsa-flank) .mll-gate-hero-inner { max-width: 36rem; margin-left: auto; margin-right: auto; }
}
@media (min-width: 600px) and (max-width: 1099px) {
	.membership-hero:has(.llsa-flank) .membership-hero-sub { max-width: 26rem; }
	.mll-gate-hero:has(.llsa-flank) .mll-gate-hero-inner { max-width: 28rem; }
}
/* small tablets: the words need the middle, so the pair steps further out */
@media (min-width: 600px) and (max-width: 899px) {
	.llsa-flank__girl { height: 54%; }
	.llsa-flank__girl--l { left: -9%; }
	.llsa-flank__girl--r { right: -9%; }
}
/* phones: the pair stands under the words */
@media (max-width: 599px) {
	.llsa-flank {
		display: flex;
		justify-content: center;
		align-items: flex-end;
		height: min(46vh, 360px);
		margin: 1.5rem -1rem 0;
	}
	.llsa-flank__girl { position: relative; height: 100%; left: auto; right: auto; }
	.llsa-flank__girl--l { margin-right: -12%; }
}

/* ── HER WIKI PAGE, AND HER DISTRICT'S: her art in the hero band, and where to read or meet her ──────────── */
.wiki-hero__wrap { position: relative; z-index: 1; }      /* her name stays above her art */
.llsa-wikiart {
	position: absolute;
	right: max(3vw, calc((100vw - 1360px) / 2));
	bottom: 0;
	z-index: 2;
	height: 92%;                                           /* room above her head under the menu bar */
	width: auto;
	pointer-events: none;
}
.llsa-wikiart::before {                                  /* her own colour, glowing behind her */
	content: "";
	position: absolute;
	inset: 18% -18% -10% -18%;
	z-index: -1;
	background: radial-gradient(50% 55% at 50% 72%, color-mix(in srgb, var(--c, #c41e3a) 55%, transparent), transparent 72%);
}
.llsa-wikiart img { display: block; height: 100%; width: auto; }
.llsa-wikichip {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	margin-top: 14px;
	padding: .45rem .85rem;
	border-radius: 999px;
	font-size: .82rem;
	font-weight: 600;
	color: #fff;
	text-decoration: none;
	background: rgba(10, 10, 10, .55);
	border: 1px solid rgba(239, 68, 68, .6);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	transition: background .2s ease, border-color .2s ease;
}
.llsa-wikichip b { font-weight: 800; }
.llsa-wikichip:hover { background: rgba(239, 68, 68, .2); border-color: #ef4444; color: #fff; }
body.ll-season-october .llsa-wikichip { border-color: rgba(249, 115, 22, .75); }
body.ll-season-october .llsa-wikichip:hover { background: rgba(249, 115, 22, .18); border-color: var(--llsa-pumpkin); }
/* tablets */
@media (min-width: 641px) and (max-width: 1024px) {
	.llsa-wikiart { right: 0; }
}
/* phones: a taller band, so she stands above her name instead of behind it */
@media (max-width: 640px) {
	.wiki-hero:has(.llsa-wikiart) { height: 440px; }
	.llsa-wikiart { right: -8%; height: 84%; }
	.wiki-hero:has(.llsa-wikiart) .wiki-hero__inner {
		background: linear-gradient(0deg, rgba(10, 10, 10, .9) 0%, rgba(10, 10, 10, .5) 36%, rgba(10, 10, 10, 0) 62%);
	}
	.llsa-wikichip { font-size: .76rem; margin-top: 10px; }
}

/* ── THE 404: Rose in the season's art ───────────────────────────────────────────────────────────────── */
.lustlit-404-image:has(.llsa-404) {
	background: radial-gradient(55% 45% at 50% 82%, rgba(196, 30, 58, .45), transparent 72%);
}
body.ll-season-october .lustlit-404-image:has(.llsa-404) {
	background: radial-gradient(55% 45% at 50% 82%, rgba(249, 115, 22, .4), transparent 72%);
}

/* ── ABOUT + AUTHORS: her approved card in place of the January portrait ──────────────────────────────── */
.about-v2-author-portrait.llsa-portrait,
.author-profile-portrait.llsa-portrait img {
	background:
		radial-gradient(85% 65% at 50% 92%, color-mix(in srgb, var(--c, #c41e3a) 58%, transparent), transparent 72%),
		linear-gradient(180deg, #151116 0%, #0b0a0c 100%);
}
.about-v2-author-portrait.llsa-portrait img {
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center bottom;
}
.author-profile-portrait.llsa-portrait img {             /* the profile keeps its 2:3 frame and radius */
	height: auto;
	object-fit: contain;
	object-position: center bottom;
}