/*
 * Lexinter Law School Directory: profile page, v2 design (0.2.0).
 * The only stylesheet on a v2 profile (lx-ls.css is not loaded there).
 * Scoped under .lx-ls-v2 so the theme is never restyled, with two exceptions that a sticky tab bar
 * needs, both limited to a v2 profile: #wrapper-container gets overflow: clip, and the page's
 * scroll-padding-top is set on html:has(.lx-ls-v2).
 * Layout from the owner's mock in design/v2/; rules in ARCHITECTURE.md §9.2.
 */

/* ---------- Tokens ---------- */
/* .lx-ls-pick-pop: the school switcher's panel, a child of <body> (0.2.20), uses the same colours. */
.lx-ls-v2,
.lx-ls-pick-pop {
	--lx-ls-ink: #0f1b31;
	--lx-ls-text: #3b4658;
	--lx-ls-muted: #5a6678;
	--lx-ls-line: #dfe6f1;
	--lx-ls-line-soft: #e9eef6;
	--lx-ls-card: #fff;
	--lx-ls-navy: #0f1b31;
	--lx-ls-navy-2: #16224a;
	--lx-ls-blue: #2563eb;
	--lx-ls-blue-dark: #1d4ed8;
	--lx-ls-sky: #38bdf8;
	--lx-ls-gold: #f5b800;
	--lx-ls-band: #eaf1fe;
	--lx-ls-pale: #f5f7fc;
	--lx-ls-tint: #e6eefe;
	--lx-ls-zebra: #f1f5fd;
	--lx-ls-good: #15803d;
	--lx-ls-bad: #b42318;
	--lx-ls-shadow: 0 1px 2px rgba(15, 27, 49, .06), 0 6px 18px rgba(15, 27, 49, .07);
	/*
	 * Height of the theme's sticky header: the tab bar sticks right under it. The mobile header grows
	 * with the window (62px at 320, 68px at 360, 73.5px from 395); the desktop header (from 1200px)
	 * measured 123px on www at 1715px. These are the values before the script runs and without it:
	 * lx-ls-v2.js measures the real header and sets --lx-ls-sticky (0.2.1), so the bar stays flush
	 * when the header is taller or shorter. Where a value is a little short the header simply covers
	 * the top edge of the bar (it has the higher z-index).
	 */
	--lx-ls-sticky: clamp(62px, calc(13px + 15.33vw), 73.5px);
	--lx-ls-tabs: 49px;
}
@media (min-width: 1200px) {
	.lx-ls-v2 {
		--lx-ls-sticky: 123px;
	}
}
/*
 * Logged in: the WordPress admin bar is fixed from 601px (46px tall up to 782px, 32px above) and the
 * theme moves its mobile header down by that much. The desktop header (from 1200px) stays where it
 * is, and under 601px the admin bar scrolls away with the page.
 */
@media (min-width: 601px) and (max-width: 782px) {
	.admin-bar .lx-ls-v2 {
		--lx-ls-sticky: calc(73.5px + 46px);
	}
}
@media (min-width: 783px) and (max-width: 1199px) {
	.admin-bar .lx-ls-v2 {
		--lx-ls-sticky: calc(73.5px + 32px);
	}
}
/* A very short window (a phone on its side, a page zoomed to 400%): the tab bar scrolls with the page. */
@media (max-height: 480px) {
	.lx-ls-v2 {
		--lx-ls-tabs: 0px;
	}
}

/* ---------- Shell and resets ---------- */
/*
 * The theme's #wrapper-container has overflow: hidden, which turns it into a scroll container and
 * stops position: sticky. overflow: clip clips the same way without that side effect.
 */
body.single-law_school #wrapper-container {
	overflow: clip;
}
/*
 * Whatever the browser scrolls into view (an anchor jump, a link reached with Shift+Tab) lands
 * below the theme header and the tab bar, with 8px to spare for the focus ring. The page is the
 * scroll container, so the offset sits on html and repeats the --lx-ls-sticky values above.
 * Bands take the 8px back (.lx-ls-band below), so a tab jump lands flush under the tab bar.
 * A browser without :has() keeps the plain scroll-margin-top on the bands.
 */
@supports selector(html:has(a)) {
	html:has(.lx-ls-v2) {
		--lx-ls-sticky: clamp(62px, calc(13px + 15.33vw), 73.5px);
		--lx-ls-tabs: 49px;
		scroll-padding-top: calc(var(--lx-ls-sticky) + var(--lx-ls-tabs) + 8px);
	}
	@media (min-width: 1200px) {
		html:has(.lx-ls-v2) {
			--lx-ls-sticky: 123px;
		}
	}
	@media (min-width: 601px) and (max-width: 782px) {
		html:has(.admin-bar .lx-ls-v2) {
			--lx-ls-sticky: calc(73.5px + 46px);
		}
	}
	@media (min-width: 783px) and (max-width: 1199px) {
		html:has(.admin-bar .lx-ls-v2) {
			--lx-ls-sticky: calc(73.5px + 32px);
		}
	}
	@media (max-height: 480px) {
		html:has(.lx-ls-v2) {
			--lx-ls-tabs: 0px;
		}
	}
}
.lx-ls-v2 {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
	background: #fff;
	color: var(--lx-ls-text);
	font-family: inherit;
	font-size: 16px;
	line-height: 1.55;
	font-variant-numeric: tabular-nums;
	text-align: left;
}
.lx-ls-v2 *,
.lx-ls-v2 *::before,
.lx-ls-v2 *::after {
	box-sizing: border-box;
}
.lx-ls-v2 h1,
.lx-ls-v2 h2,
.lx-ls-v2 h3 {
	margin: 0;
	padding: 0;
	font-family: inherit;
	letter-spacing: normal;
	text-transform: none;
}
.lx-ls-v2 p,
.lx-ls-v2 figure,
.lx-ls-v2 dl,
.lx-ls-v2 dd,
.lx-ls-v2 label {
	margin: 0;
}
.lx-ls-v2 ul,
.lx-ls-v2 ol {
	margin: 0;
	padding: 0;
	list-style: none;
}
.lx-ls-v2 li {
	margin: 0;
	padding: 0;
	list-style: none;
}
.lx-ls-v2 li::marker {
	content: none;
}
.lx-ls-v2 a {
	color: var(--lx-ls-blue-dark);
}
.lx-ls-v2 a:hover {
	color: var(--lx-ls-ink);
}
.lx-ls-v2 a:focus-visible,
.lx-ls-v2 summary:focus-visible,
.lx-ls-v2 input:focus-visible,
.lx-ls-v2 [tabindex]:focus-visible {
	/* !important: the theme's template.css has a { outline: none !important }, which would hide every focus ring. */
	outline: 3px solid var(--lx-ls-blue) !important;
	outline-offset: 2px;
}
.lx-ls-v2 .lx-ls-band--navy a:focus-visible,
.lx-ls-v2 .lx-ls-hero a:focus-visible,
.lx-ls-v2 .lx-ls-cta a:focus-visible {
	outline-color: var(--lx-ls-gold) !important;
}
.lx-ls-v2 .lx-ls-sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
	border: 0;
}
.lx-ls-v2 .lx-ls-ico {
	flex: none;
	width: 16px;
	height: 16px;
}
.lx-ls-v2 [hidden] {
	display: none !important;
}

/*
 * Inner column: the site's own width rule. 12px gutter below 768px, the theme container (750px
 * from 768, 970px from 992) and 80% of the window from 1200px. Bands are full-bleed around it.
 */
.lx-ls-v2 .lx-ls-wrap {
	width: 100%;
	margin: 0 auto;
	padding: 0 12px;
}
@media (min-width: 768px) {
	.lx-ls-v2 .lx-ls-wrap {
		width: 750px;
		padding: 0 15px;
	}
}
@media (min-width: 992px) {
	.lx-ls-v2 .lx-ls-wrap {
		width: 970px;
	}
}
@media (min-width: 1200px) {
	.lx-ls-v2 .lx-ls-wrap {
		width: 80%;
	}
}

/* ---------- Sticky tab bar ---------- */
.lx-ls-v2 .lx-ls-tabs {
	position: sticky;
	top: var(--lx-ls-sticky);
	/* Above the page's own content, below the theme's header (6 mobile, 99 desktop) and menu backdrop (10). */
	z-index: 5;
	background: #fff;
	border-bottom: 1px solid var(--lx-ls-line);
}
.lx-ls-v2 .lx-ls-tablist {
	position: relative;
	display: flex;
	gap: 2px;
	overflow-x: auto;
	scrollbar-width: none;
	-webkit-overflow-scrolling: touch;
}
.lx-ls-v2 .lx-ls-tablist::-webkit-scrollbar {
	display: none;
}
.lx-ls-v2 .lx-ls-tablist li {
	flex: none;
}
/*
 * Below 992px the strip can be wider than the window. Its right edge fades out, so a reader sees
 * that more tabs follow; an empty spacer at the end lets the last tab scroll clear of the fade.
 */
@media (max-width: 991px) {
	.lx-ls-v2 .lx-ls-tablist {
		-webkit-mask-image: linear-gradient(to right, #000 calc(100% - 32px), transparent);
		mask-image: linear-gradient(to right, #000 calc(100% - 32px), transparent);
	}
	.lx-ls-v2 .lx-ls-tablist::after {
		content: "";
		flex: 0 0 30px;
	}
}
@media (max-height: 480px) {
	.lx-ls-v2 .lx-ls-tabs {
		position: static;
	}
}
.lx-ls-v2 .lx-ls-tablist a {
	display: flex;
	align-items: center;
	height: 48px;
	padding: 0 14px;
	border-bottom: 3px solid transparent;
	color: #475569;
	font-size: 15px;
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
	text-decoration: none;
}
.lx-ls-v2 .lx-ls-tablist a:hover {
	color: var(--lx-ls-ink);
}
.lx-ls-v2 .lx-ls-tablist a[aria-current] {
	border-bottom-color: var(--lx-ls-blue);
	color: var(--lx-ls-blue-dark);
}
.lx-ls-v2 .lx-ls-tablist a:focus-visible {
	outline-offset: -3px;
}
/*
 * Once the page scrolls under the bar (lx-ls-v2.js adds .is-stuck) it turns navy, the colour of the
 * site header above it, so it stands out on the white and pale bands. Shadows only: a border would
 * change the bar's height and move the page.
 */
.lx-ls-v2 .lx-ls-tabs {
	transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}
.lx-ls-v2 .lx-ls-tabs.is-stuck {
	background: #0f1a30;
	border-bottom-color: rgba(255, 255, 255, .16);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 6px 16px rgba(15, 26, 48, .28);
}
.lx-ls-v2 .lx-ls-tabs.is-stuck .lx-ls-tablist a {
	color: #cbd5e1;
}
.lx-ls-v2 .lx-ls-tabs.is-stuck .lx-ls-tablist a:hover {
	color: #fff;
}
.lx-ls-v2 .lx-ls-tabs.is-stuck .lx-ls-tablist a[aria-current] {
	border-bottom-color: var(--lx-ls-gold);
	color: #fff;
}
.lx-ls-v2 .lx-ls-tabs.is-stuck .lx-ls-tablist a:focus-visible {
	outline-color: var(--lx-ls-gold) !important;
}

/* ---------- Hero ---------- */
.lx-ls-v2 .lx-ls-top {
	scroll-margin-top: calc(var(--lx-ls-sticky) + var(--lx-ls-tabs));
}
.lx-ls-v2 .lx-ls-hero {
	padding: 18px 0 88px;
	background: linear-gradient(105deg, #0f1b31 0%, #16224a 55%, #1d3a7c 100%);
	color: #fff;
}
.lx-ls-v2 .lx-ls-crumbs {
	margin-bottom: 6px;
	font-size: 13.5px;
	color: #c9d4ea;
}
.lx-ls-v2 .lx-ls-crumbs ol {
	display: flex;
	flex-wrap: wrap;
}
.lx-ls-v2 .lx-ls-crumbs li {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
}
.lx-ls-v2 .lx-ls-crumbs li + li::before {
	content: "\203A";
	/* Same sign with empty alternative text, so a screen reader does not read it out. A browser that does not know the syntax keeps the line above. */
	content: "\203A" / "";
	margin: 0 8px;
	color: #9fb0cf;
}
.lx-ls-v2 .lx-ls-crumbs a {
	display: inline-flex;
	align-items: center;
	min-height: 40px;
	color: #e3ecff;
	text-decoration: none;
}
.lx-ls-v2 .lx-ls-crumbs a:hover {
	color: #fff;
	text-decoration: underline;
}
.lx-ls-v2 .lx-ls-crumbs [aria-current] {
	color: #fff;
}
.lx-ls-v2 .lx-ls-hero-id {
	display: flex;
	align-items: center;
	gap: 16px;
}
.lx-ls-v2 .lx-ls-badge {
	display: flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	border-radius: 14px;
	background: var(--lx-ls-gold);
	color: var(--lx-ls-navy);
	font-size: 18px;
	font-weight: 800;
	letter-spacing: 0;
}
.lx-ls-v2 .lx-ls-badge--logo {
	overflow: hidden;
	background: #fff;
}
.lx-ls-v2 .lx-ls-badge--logo img {
	display: block;
	width: 52px;
	height: 52px;
	object-fit: contain;
}
.lx-ls-v2 .lx-ls-hero-t {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}
.lx-ls-v2 .lx-ls-h1 {
	color: #fff;
	font-size: 30px;
	font-weight: 800;
	line-height: 1.12;
}
.lx-ls-v2 .lx-ls-place {
	color: #c9d4ea;
	font-size: 16px;
}
.lx-ls-v2 .lx-ls-hero-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 16px;
	margin-top: 16px;
}
.lx-ls-v2 .lx-ls-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}
.lx-ls-v2 .lx-ls-chip {
	padding: 4px 12px;
	border-radius: 999px;
	background: rgba(255, 255, 255, .14);
	color: #fff;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.5;
}
.lx-ls-v2 .lx-ls-chip--warn {
	background: #fde68a;
	color: #513c00;
}
.lx-ls-v2 .lx-ls-site {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	min-height: 40px;
	color: #e3ecff;
	font-size: 14px;
	font-weight: 600;
}
.lx-ls-v2 .lx-ls-site:hover {
	color: #fff;
}
.lx-ls-v2 .lx-ls-site .lx-ls-ico {
	width: 14px;
	height: 14px;
}
.lx-ls-v2 .lx-ls-hero-note {
	margin-top: 10px;
	color: #e3ecff;
	font-size: 14px;
}
.lx-ls-v2 .lx-ls-tagline {
	max-width: 42em;
	margin-top: 16px;
	color: #fff;
	font-size: 18px;
	line-height: 1.5;
}
.lx-ls-v2 .lx-ls-hero-cta {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 20px;
}
.lx-ls-v2 .lx-ls-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 0 20px;
	border: 1px solid transparent;
	border-radius: 10px;
	font-size: 15.5px;
	font-weight: 800;
	line-height: 1.2;
	text-align: center;
	text-decoration: none;
	transition: background-color .15s;
}
.lx-ls-v2 .lx-ls-btn--gold,
.lx-ls-v2 .lx-ls-btn--gold:hover {
	background: var(--lx-ls-gold);
	color: var(--lx-ls-navy);
}
.lx-ls-v2 .lx-ls-btn--gold:hover {
	background: #ffcb2e;
}
.lx-ls-v2 .lx-ls-btn--ghost,
.lx-ls-v2 .lx-ls-btn--ghost:hover {
	border-color: rgba(255, 255, 255, .2);
	background: rgba(255, 255, 255, .14);
	color: #fff;
}
.lx-ls-v2 .lx-ls-btn--ghost:hover {
	background: rgba(255, 255, 255, .24);
}

/* ---------- Stat cards over the hero edge ---------- */
.lx-ls-v2 .lx-ls-stats {
	position: relative;
	margin-top: -60px;
	padding-bottom: 28px;
	background: linear-gradient(to bottom, transparent 60px, var(--lx-ls-pale) 60px);
}
.lx-ls-v2 .lx-ls-statgrid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}
.lx-ls-v2 .lx-ls-stat {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 2px;
	min-width: 0;
	padding: 16px 16px 14px;
	border-radius: 14px;
	background: #fff;
	box-shadow: 0 2px 4px rgba(15, 27, 49, .06), 0 10px 26px rgba(15, 27, 49, .12);
}
.lx-ls-v2 .lx-ls-stat-v {
	color: var(--lx-ls-ink);
	font-size: 30px;
	font-weight: 800;
	line-height: 1.1;
}
.lx-ls-v2 .lx-ls-stat-l,
.lx-ls-v2 .lx-ls-stat-s {
	color: var(--lx-ls-muted);
	font-size: 14px;
	line-height: 1.35;
}
.lx-ls-v2 .lx-ls-stat-s {
	font-size: 13px;
}
.lx-ls-v2 .lx-ls-pill {
	display: inline-block;
	margin-top: 8px;
	padding: 4px 10px;
	border-radius: 12px;
	background: var(--lx-ls-tint);
	color: var(--lx-ls-blue-dark);
	font-size: 12.5px;
	font-weight: 700;
	line-height: 1.35;
}

/* ---------- Bands ---------- */
.lx-ls-v2 .lx-ls-band {
	padding: 40px 0;
	background: #fff;
	scroll-margin-top: calc(var(--lx-ls-sticky) + var(--lx-ls-tabs));
}
@supports selector(html:has(a)) {
	/* html carries the offset (scroll-padding-top, near the top of this file); a band gives back the 8px kept for focus rings. */
	.lx-ls-v2 .lx-ls-top,
	.lx-ls-v2 .lx-ls-band {
		/* 0 first: a browser that will not take a negative value then lands 8px low, not a whole header low. */
		scroll-margin-top: 0;
		scroll-margin-top: -8px;
	}
}
.lx-ls-v2 .lx-ls-band--blue {
	background: var(--lx-ls-band);
}
.lx-ls-v2 .lx-ls-band--pale {
	background: var(--lx-ls-pale);
}
.lx-ls-v2 .lx-ls-band--navy {
	background: var(--lx-ls-navy);
	color: #d5deef;
}
.lx-ls-v2 .lx-ls-band--navy + .lx-ls-band--navy {
	border-top: 1px solid rgba(255, 255, 255, .12);
}
.lx-ls-v2 .lx-ls-band > .lx-ls-wrap {
	display: flex;
	flex-direction: column;
	gap: 18px;
}
.lx-ls-v2 .lx-ls-bh {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-bottom: 2px;
}
.lx-ls-v2 .lx-ls-eyebrow {
	display: flex;
	align-items: center;
	gap: 8px;
	color: var(--lx-ls-blue-dark);
	font-size: 12.5px;
	font-weight: 800;
	letter-spacing: .12em;
	line-height: 1.3;
	text-transform: uppercase;
}
.lx-ls-v2 .lx-ls-h2 {
	color: var(--lx-ls-ink);
	font-size: 25px;
	font-weight: 800;
	line-height: 1.2;
}
.lx-ls-v2 .lx-ls-h2::after {
	content: "";
	display: block;
	width: 56px;
	height: 4px;
	margin-top: 12px;
	border-radius: 2px;
	background: var(--lx-ls-blue);
}
.lx-ls-v2 .lx-ls-lede {
	max-width: 46em;
	color: #475569;
	font-size: 16.5px;
	line-height: 1.55;
}
.lx-ls-v2 .lx-ls-take {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	margin-top: 4px;
	padding: 14px 16px;
	border-left: 4px solid var(--lx-ls-blue);
	border-radius: 10px;
	background: #fff;
	box-shadow: var(--lx-ls-shadow);
	color: var(--lx-ls-ink);
	font-size: 15.5px;
	line-height: 1.5;
}
.lx-ls-v2 .lx-ls-take .lx-ls-ico {
	width: 18px;
	height: 18px;
	margin-top: 2px;
	color: #b88a00;
}
.lx-ls-v2 .lx-ls-take strong {
	font-weight: 800;
}
.lx-ls-v2 .lx-ls-band--navy .lx-ls-eyebrow {
	color: var(--lx-ls-gold);
}
.lx-ls-v2 .lx-ls-band--navy .lx-ls-h2,
.lx-ls-v2 .lx-ls-band--navy .lx-ls-h3 {
	color: #fff;
}
.lx-ls-v2 .lx-ls-band--navy .lx-ls-h2::after {
	background: var(--lx-ls-gold);
}
.lx-ls-v2 .lx-ls-band--navy .lx-ls-lede {
	color: #c9d4ea;
}
.lx-ls-v2 .lx-ls-band--navy .lx-ls-take {
	border-left-color: var(--lx-ls-gold);
	background: rgba(255, 255, 255, .09);
	box-shadow: none;
	color: #f1f5ff;
}
.lx-ls-v2 .lx-ls-band--navy .lx-ls-take .lx-ls-ico {
	color: var(--lx-ls-gold);
}
.lx-ls-v2 .lx-ls-h3 {
	color: var(--lx-ls-ink);
	font-size: 19px;
	font-weight: 800;
	line-height: 1.3;
}
.lx-ls-v2 .lx-ls-h3--sm {
	font-size: 15px;
	font-weight: 700;
}
.lx-ls-v2 .lx-ls-subhead {
	display: flex;
	flex-direction: column;
	gap: 2px;
	margin-top: 14px;
}
.lx-ls-v2 .lx-ls-subhead p,
.lx-ls-v2 .lx-ls-note,
.lx-ls-v2 .lx-ls-src {
	color: var(--lx-ls-muted);
	font-size: 13.5px;
	line-height: 1.5;
}
.lx-ls-v2 .lx-ls-band--navy > .lx-ls-wrap > .lx-ls-note,
.lx-ls-v2 .lx-ls-costbars .lx-ls-note {
	color: #b9c5dc;
}

/* ---------- Cards and grids ---------- */
.lx-ls-v2 .lx-ls-card {
	min-width: 0;
	padding: 16px;
	border: 1px solid var(--lx-ls-line-soft);
	border-top: 3px solid var(--lx-ls-blue);
	border-radius: 14px;
	background: var(--lx-ls-card);
	box-shadow: var(--lx-ls-shadow);
	color: var(--lx-ls-text);
}
.lx-ls-v2 .lx-ls-card-h {
	margin-bottom: 10px;
	color: var(--lx-ls-ink);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.35;
}
.lx-ls-v2 .lx-ls-card-h--next {
	margin-top: 18px;
}
.lx-ls-v2 .lx-ls-card > .lx-ls-note {
	margin-top: 10px;
}
.lx-ls-v2 .lx-ls-g {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 16px;
	align-items: stretch;
}
@media (min-width: 768px) {
	.lx-ls-v2 .lx-ls-g--2 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media (min-width: 992px) {
	.lx-ls-v2 .lx-ls-g--wide {
		grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
	}
	/* The chart card is as tall as the table next to it: the chart sits in the middle of the spare height. */
	.lx-ls-v2 .lx-ls-g--wide > .lx-ls-fig > .lx-ls-cq {
		margin-top: auto;
		margin-bottom: auto;
	}
}

/* ---------- Tiles (Profile::tile) ---------- */
/* Rows are always balanced: 3 = 3 or a stack; 4 = 4 or 2+2; 5 = 5, 3+2 or 2+2+1 wide; 6 = 3+3 or 2+2+2. */
.lx-ls-v2 .lx-ls-tq {
	min-width: 0;
	container-type: inline-size;
}
.lx-ls-v2 .lx-ls-tiles {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}
/* Next to a card (admissions): the 2+2 tiles fill the card's height. */
.lx-ls-v2 .lx-ls-g--2 > .lx-ls-tq > .lx-ls-tiles {
	grid-auto-rows: 1fr;
	height: 100%;
}
.lx-ls-v2 .lx-ls-tiles--3 {
	grid-template-columns: minmax(0, 1fr);
}
.lx-ls-v2 .lx-ls-tiles--5 > :last-child {
	grid-column: 1 / -1;
}
@container (min-width: 560px) {
	.lx-ls-v2 .lx-ls-tiles--3 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.lx-ls-v2 .lx-ls-tiles--5,
	.lx-ls-v2 .lx-ls-tiles--6 {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
	.lx-ls-v2 .lx-ls-tiles--5 > *,
	.lx-ls-v2 .lx-ls-tiles--6 > * {
		grid-column: span 2;
	}
	.lx-ls-v2 .lx-ls-tiles--5 > :nth-child(n+4) {
		grid-column: span 3;
	}
}
@container (min-width: 760px) {
	.lx-ls-v2 .lx-ls-tiles--4 {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}
@container (min-width: 1040px) {
	.lx-ls-v2 .lx-ls-tiles--5 {
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}
	.lx-ls-v2 .lx-ls-tiles--5 > *,
	.lx-ls-v2 .lx-ls-tiles--5 > :nth-child(n+4) {
		grid-column: auto;
	}
}
.lx-ls-v2 .lx-ls-tile {
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
	padding: 14px 14px 16px;
	border: 1px solid var(--lx-ls-line-soft);
	border-top: 3px solid var(--lx-ls-blue);
	border-radius: 14px;
	background: var(--lx-ls-card);
	box-shadow: var(--lx-ls-shadow);
}
.lx-ls-v2 .lx-ls-tile-l {
	color: var(--lx-ls-muted);
	font-size: 13.5px;
	line-height: 1.35;
}
.lx-ls-v2 .lx-ls-tile-v {
	color: var(--lx-ls-blue);
	font-size: 26px;
	font-weight: 800;
	line-height: 1.1;
	overflow-wrap: anywhere;
}
.lx-ls-v2 .lx-ls-tile-v.is-good {
	color: var(--lx-ls-good);
}
.lx-ls-v2 .lx-ls-tile-v.is-bad {
	color: var(--lx-ls-bad);
}
.lx-ls-v2 .lx-ls-tile-s {
	color: var(--lx-ls-muted);
	font-size: 12.5px;
	line-height: 1.4;
}
.lx-ls-v2 .lx-ls-tiles--num .lx-ls-tile-v {
	order: -1;
}
.lx-ls-v2 .lx-ls-tile.is-primary {
	border-color: transparent;
	background: linear-gradient(135deg, #1d4ed8, #1e3a8a);
}
.lx-ls-v2 .lx-ls-tile.is-primary .lx-ls-tile-v,
.lx-ls-v2 .lx-ls-tile.is-primary .lx-ls-tile-l,
.lx-ls-v2 .lx-ls-tile.is-primary .lx-ls-tile-s,
.lx-ls-v2 .lx-ls-tile.is-primary .lx-ls-pbar-label {
	color: #fff;
}
.lx-ls-v2 .lx-ls-tile.is-primary .lx-ls-pbar-track {
	background: rgba(255, 255, 255, .28);
}
.lx-ls-v2 .lx-ls-tile.is-primary .lx-ls-pbar-fill {
	background: var(--lx-ls-gold);
}
.lx-ls-v2 .lx-ls-tile.is-primary .lx-ls-pbar-mark {
	background: #fff;
}
.lx-ls-v2 .lx-ls-band--navy .lx-ls-tile {
	border-color: rgba(255, 255, 255, .12);
	border-top-color: var(--lx-ls-gold);
	background: rgba(255, 255, 255, .07);
	box-shadow: none;
}
.lx-ls-v2 .lx-ls-band--navy .lx-ls-tile-v {
	color: var(--lx-ls-gold);
}
.lx-ls-v2 .lx-ls-band--navy .lx-ls-tile-l {
	color: #e3ecff;
}
.lx-ls-v2 .lx-ls-band--navy .lx-ls-tile-s {
	color: #b9c5dc;
}

/* ---------- Percentile bar (Charts::pbar) ---------- */
.lx-ls-v2 .lx-ls-pbar {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.lx-ls-v2 .lx-ls-pbar-track {
	position: relative;
	display: block;
	height: 6px;
	margin-top: 4px;
	border-radius: 3px;
	background: #e1e8f3;
}
.lx-ls-v2 .lx-ls-pbar-fill {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	border-radius: 3px;
	background: var(--lx-ls-blue);
}
.lx-ls-v2 .lx-ls-pbar-mark {
	position: absolute;
	top: -4px;
	width: 3px;
	height: 14px;
	margin-left: -1.5px;
	border-radius: 1px;
	background: var(--lx-ls-navy);
}
.lx-ls-v2 .lx-ls-pbar-mark.is-max {
	margin-left: -3px;
}
.lx-ls-v2 .lx-ls-pbar-mark.is-min {
	margin-left: 0;
}
.lx-ls-v2 .lx-ls-pbar-label {
	display: block;
	color: var(--lx-ls-muted);
	font-size: 12.5px;
	font-weight: 400;
	line-height: 1.4;
}

/* ---------- LSAT / GPA band bars (Profile::band_row) ---------- */
.lx-ls-v2 .lx-ls-bandrow {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-bottom: 14px;
}
.lx-ls-v2 .lx-ls-bandrow-h {
	color: var(--lx-ls-muted);
	font-size: 14px;
}
.lx-ls-v2 .lx-ls-bandrow-h strong {
	margin-right: 4px;
	color: var(--lx-ls-ink);
	font-size: 15.5px;
	font-weight: 800;
}
.lx-ls-v2 .lx-ls-bandrow-h b {
	color: var(--lx-ls-ink);
	font-weight: 700;
	white-space: nowrap;
}
.lx-ls-v2 .lx-ls-track {
	position: relative;
	height: 12px;
	margin-top: 6px;
	border-radius: 6px;
	background: #e1e8f3;
}
.lx-ls-v2 .lx-ls-track-band {
	position: absolute;
	top: 0;
	bottom: 0;
	min-width: 4px;
	border-radius: 6px;
	background: #8fb2f6;
}
.lx-ls-v2 .lx-ls-track-med {
	position: absolute;
	top: -4px;
	width: 3px;
	height: 20px;
	margin-left: -1.5px;
	border-radius: 2px;
	background: var(--lx-ls-navy);
}
.lx-ls-v2 .lx-ls-track-mark {
	position: absolute;
	top: -6px;
	width: 24px;
	height: 24px;
	margin-left: -12px;
	border: 3px solid var(--lx-ls-navy);
	border-radius: 50%;
	background: var(--lx-ls-gold);
}
.lx-ls-v2 .lx-ls-track-scale {
	display: flex;
	justify-content: space-between;
	color: var(--lx-ls-muted);
	font-size: 12px;
}

/* ---------- Key facts ---------- */
.lx-ls-v2 .lx-ls-keyfacts {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px 20px;
}
.lx-ls-v2 .lx-ls-keyfact {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}
.lx-ls-v2 .lx-ls-keyfacts dt {
	color: var(--lx-ls-muted);
	font-size: 12.5px;
	font-weight: 600;
	line-height: 1.35;
}
.lx-ls-v2 .lx-ls-keyfacts dd {
	color: var(--lx-ls-ink);
	font-size: 15px;
	font-weight: 700;
	line-height: 1.35;
	overflow-wrap: anywhere;
}
@media (min-width: 768px) {
	.lx-ls-v2 .lx-ls-keyfacts {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.lx-ls-v2 .lx-ls-keyfacts--1,
	.lx-ls-v2 .lx-ls-keyfacts--2,
	.lx-ls-v2 .lx-ls-keyfacts--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}
@media (min-width: 1200px) {
	.lx-ls-v2 .lx-ls-keyfacts--4 {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
	.lx-ls-v2 .lx-ls-keyfacts--5 {
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}
	.lx-ls-v2 .lx-ls-keyfacts--6 {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
	/* A value over 24 characters (admissions.php): the card keeps its tablet rows, three across for five or six
	   facts (two for four); a card of one to three facts keeps its tablet columns, so no track stays empty. */
	.lx-ls-v2 .lx-ls-keyfacts--long.lx-ls-keyfacts--5,
	.lx-ls-v2 .lx-ls-keyfacts--long.lx-ls-keyfacts--6 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.lx-ls-v2 .lx-ls-keyfacts--long.lx-ls-keyfacts--4 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* ---------- Charts ---------- */
.lx-ls-v2 .lx-ls-fig {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.lx-ls-v2 .lx-ls-fig-c {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: baseline;
	gap: 6px 14px;
	margin: 0;
	padding: 0;
	color: var(--lx-ls-muted);
	font-size: 14px;
	text-align: left;
}
.lx-ls-v2 .lx-ls-fig-c strong {
	color: var(--lx-ls-ink);
	font-size: 16px;
	font-weight: 800;
}
.lx-ls-v2 .lx-ls-svg {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
}
/*
 * One chart, several sizes: the card shows the one whose labels stay readable at its width.
 * Line charts (.lx-ls-cq4): a = 300 wide, b = 440, c = 640, d = 920. The scatter has a and c only.
 * Without container queries the smallest stays.
 */
.lx-ls-v2 .lx-ls-cq {
	container-type: inline-size;
}
.lx-ls-v2 .lx-ls-v-b,
.lx-ls-v2 .lx-ls-v-c,
.lx-ls-v2 .lx-ls-v-d {
	display: none;
}
.lx-ls-v2 .lx-ls-cq .lx-ls-svg {
	margin: 0 auto;
}
.lx-ls-v2 .lx-ls-cq:not(.lx-ls-cq4) .lx-ls-v-a .lx-ls-svg {
	max-width: 420px;
}
.lx-ls-v2 .lx-ls-v-c .lx-ls-svg {
	max-width: 760px;
}
/* The 440-wide chart is shown in cards up to 640px wide. Held to 520px, its text stays near 15px, like the other charts. */
.lx-ls-v2 .lx-ls-v-b .lx-ls-svg {
	max-width: 520px;
}
.lx-ls-v2 .lx-ls-v-d .lx-ls-svg {
	max-width: 1100px;
}
@container (min-width: 416px) {
	.lx-ls-v2 .lx-ls-cq4 > .lx-ls-v-a {
		display: none;
	}
	.lx-ls-v2 .lx-ls-cq4 > .lx-ls-v-b {
		display: block;
	}
}
@container (min-width: 640px) {
	.lx-ls-v2 .lx-ls-cq > .lx-ls-v-a,
	.lx-ls-v2 .lx-ls-cq4 > .lx-ls-v-b {
		display: none;
	}
	.lx-ls-v2 .lx-ls-cq > .lx-ls-v-c {
		display: block;
	}
}
@container (min-width: 880px) {
	.lx-ls-v2 .lx-ls-cq4 > .lx-ls-v-c {
		display: none;
	}
	.lx-ls-v2 .lx-ls-cq4 > .lx-ls-v-d {
		display: block;
	}
}
.lx-ls-v2 .lx-ls-legend {
	display: flex;
	flex-wrap: wrap;
	gap: 6px 16px;
	color: var(--lx-ls-text);
	font-size: 13px;
	line-height: 1.4;
}
.lx-ls-v2 .lx-ls-legend li {
	display: flex;
	align-items: center;
	gap: 6px;
}
.lx-ls-v2 .lx-ls-sw {
	display: inline-block;
	flex: none;
	width: 11px;
	height: 11px;
	border-radius: 3px;
}
.lx-ls-v2 .lx-ls-sw--line {
	width: 16px;
	height: 3px;
	border-radius: 2px;
}
.lx-ls-v2 .lx-ls-sw--dash {
	width: 16px;
	height: 0;
	border-top: 2px dashed;
	border-radius: 0;
}
.lx-ls-v2 .lx-ls-sw--dot {
	border-radius: 50%;
	background: #8a97a8;
}
.lx-ls-v2 .lx-ls-sw--hl {
	width: 13px;
	height: 13px;
	border: 2px solid var(--lx-ls-navy);
	border-radius: 50%;
	background: var(--lx-ls-gold);
}
.lx-ls-v2 .lx-ls-legend--rows {
	flex: 1 1 180px;
	flex-direction: column;
	flex-wrap: nowrap;
	gap: 8px;
	/* In a very wide card each count stays near its label. */
	max-width: 360px;
	font-size: 14px;
}
.lx-ls-v2 .lx-ls-legend-l {
	flex: 1 1 auto;
}
.lx-ls-v2 .lx-ls-legend-n {
	color: var(--lx-ls-ink);
	font-weight: 800;
}
.lx-ls-v2 .lx-ls-donut {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 16px 24px;
}
.lx-ls-v2 .lx-ls-donut .lx-ls-svg {
	flex: none;
	width: 200px;
	height: 200px;
	margin: 0 auto;
}
.lx-ls-v2 .lx-ls-colchart {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.lx-ls-v2 .lx-ls-cols {
	display: grid;
	gap: 4px;
	align-items: end;
	height: 200px;
	padding-top: 4px;
	border-bottom: 1px solid #c5cfdd;
}
.lx-ls-v2 .lx-ls-col {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	gap: 3px;
	height: 100%;
	min-width: 0;
	color: var(--lx-ls-text);
	font-size: 12.5px;
}
.lx-ls-v2 .lx-ls-col.is-max {
	color: var(--lx-ls-ink);
	font-weight: 800;
}
.lx-ls-v2 .lx-ls-col-bar {
	display: block;
	width: 100%;
	border-radius: 6px 6px 0 0;
}
.lx-ls-v2 .lx-ls-cols-x {
	display: grid;
	gap: 4px;
	color: var(--lx-ls-muted);
	font-size: 12px;
	line-height: 1.25;
	text-align: center;
}
.lx-ls-v2 .lx-ls-cols-x span {
	min-width: 0;
	overflow-wrap: anywhere;
}
.lx-ls-v2 .lx-ls-fig--sizes .lx-ls-cols {
	height: 150px;
}
.lx-ls-v2 .lx-ls-stack {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.lx-ls-v2 .lx-ls-stack-bar {
	display: flex;
	height: 28px;
	overflow: hidden;
	border-radius: 8px;
	background: #e1e8f3;
}
.lx-ls-v2 .lx-ls-stack-bar span {
	display: block;
	height: 100%;
}

/* ---------- Tables ---------- */
.lx-ls-v2 table.lx-ls-tbl {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	border-spacing: 0;
	background: none;
	font-size: 14.5px;
	line-height: 1.4;
	table-layout: auto;
}
.lx-ls-v2 .lx-ls-tbl th,
.lx-ls-v2 .lx-ls-tbl td {
	padding: 10px 8px;
	border: 0;
	background: none;
	color: inherit;
	font-size: inherit;
	font-weight: 400;
	text-align: left;
	vertical-align: middle;
}
.lx-ls-v2 .lx-ls-tbl thead th {
	border-bottom: 1px solid var(--lx-ls-line);
	color: var(--lx-ls-muted);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .05em;
	text-transform: uppercase;
}
.lx-ls-v2 .lx-ls-tbl tbody tr:nth-child(odd) > * {
	background: var(--lx-ls-zebra);
}
.lx-ls-v2 .lx-ls-tbl .is-num {
	text-align: right;
	white-space: nowrap;
}
.lx-ls-v2 .lx-ls-tbl .is-strong,
.lx-ls-v2 .lx-ls-tbl tr.is-total > * {
	color: var(--lx-ls-ink);
	font-weight: 800;
}
.lx-ls-v2 .lx-ls-tbl .is-good {
	color: var(--lx-ls-good);
}
.lx-ls-v2 .lx-ls-tbl .is-bad {
	color: var(--lx-ls-bad);
}
.lx-ls-v2 .lx-ls-tbl caption {
	caption-side: bottom;
	padding: 10px 8px 0;
	color: var(--lx-ls-muted);
	font-size: 13px;
	text-align: left;
}
.lx-ls-v2 .lx-ls-tbl .lx-ls-barcell {
	width: 40%;
	min-width: 118px;
}
.lx-ls-v2 .lx-ls-tbl .lx-ls-sharecell {
	width: 34%;
	min-width: 84px;
}
.lx-ls-v2 .lx-ls-share-v {
	display: block;
}
.lx-ls-v2 .lx-ls-hbar {
	display: block;
	height: 6px;
	margin-top: 4px;
	overflow: hidden;
	border-radius: 3px;
	background: #e1e8f3;
}
.lx-ls-v2 .lx-ls-hbar > span {
	display: block;
	height: 100%;
	border-radius: 3px;
	background: var(--lx-ls-blue);
}
.lx-ls-v2 .lx-ls-tbl .lx-ls-pbar-track {
	margin-top: 0;
}
.lx-ls-v2 .lx-ls-scroll {
	max-width: 100%;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
.lx-ls-v2 .lx-ls-tbl--wide {
	min-width: 560px;
}
.lx-ls-v2 .lx-ls-tbl--jur {
	min-width: 300px;
}
.lx-ls-v2 .lx-ls-tbl--jur th,
.lx-ls-v2 .lx-ls-tbl--jur td {
	padding-left: 6px;
	padding-right: 6px;
}
@media (max-width: 479px) {
	.lx-ls-v2 .lx-ls-tbl--jur {
		font-size: 13.5px;
	}
	.lx-ls-v2 .lx-ls-tbl--jur th,
	.lx-ls-v2 .lx-ls-tbl--jur td {
		padding-left: 4px;
		padding-right: 4px;
	}
	/* On a phone every table inside a card gives up the wide header spacing, so it stays inside the card. */
	.lx-ls-v2 .lx-ls-tbl thead th {
		letter-spacing: 0;
	}
	.lx-ls-v2 .lx-ls-card > .lx-ls-tbl th,
	.lx-ls-v2 .lx-ls-card > .lx-ls-tbl td {
		padding-left: 5px;
		padding-right: 5px;
	}
	.lx-ls-v2 .lx-ls-card > .lx-ls-tbl .lx-ls-barcell {
		min-width: 96px;
	}
}
.lx-ls-v2 .lx-ls-tbl abbr {
	border: 0;
	text-decoration: none;
	cursor: help;
}
/* Year-by-year numbers (admissions): always open since 0.2.4, a card like the charts above it. */
.lx-ls-v2 .lx-ls-years .lx-ls-card-h {
	margin-bottom: 8px;
}

/* ---------- Notices and lists ---------- */
.lx-ls-v2 .lx-ls-warn {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 14px 16px;
	border: 1px solid #f1d98f;
	border-radius: 10px;
	background: #fff7dc;
	color: #4a3b12;
	font-size: 14.5px;
}
.lx-ls-v2 .lx-ls-warn .lx-ls-ico {
	width: 18px;
	height: 18px;
	margin-top: 2px;
	color: #8a6100;
}
.lx-ls-v2 .lx-ls-warn strong {
	color: inherit;
	font-weight: 800;
}
.lx-ls-v2 .lx-ls-facts {
	display: flex;
	flex-direction: column;
	gap: 8px;
	font-size: 14.5px;
}
.lx-ls-v2 .lx-ls-facts li {
	position: relative;
	padding-left: 18px;
}
.lx-ls-v2 .lx-ls-facts li::before {
	content: "";
	position: absolute;
	top: .58em;
	left: 2px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--lx-ls-sky);
}
.lx-ls-v2 .lx-ls-kv li {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	padding: 10px 8px;
	font-size: 14.5px;
}
.lx-ls-v2 .lx-ls-kv li:nth-child(odd) {
	background: var(--lx-ls-zebra);
}
.lx-ls-v2 .lx-ls-kv li span:last-child {
	color: var(--lx-ls-ink);
	font-weight: 800;
}
/*
 * About: the format the owner approved (0.2.3). The text in one column on the left, the "At a glance"
 * card on the right from 992px, stacked below. The card is one list of rows at every width: label on
 * the left, value on the right. Without a text (.lx-ls-about--facts) the card spans the band and its
 * facts sit side by side, in rows of equal length (.lx-ls-glance--n4 ... n8 = number of facts).
 */
.lx-ls-v2 .lx-ls-about {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	gap: 20px;
	align-items: start;
}
/* The card keeps the sketch's share of the band (about 39%) and starts level with the "About" eyebrow. */
@media (min-width: 992px) {
	.lx-ls-v2 .lx-ls-about {
		grid-template-columns: minmax(0, 1fr) clamp(320px, 39%, 640px);
		gap: 40px;
	}
}
/* Heading and text keep the rhythm the band gives its own children (18px). */
.lx-ls-v2 .lx-ls-about-main {
	display: flex;
	flex-direction: column;
	gap: 18px;
	min-width: 0;
}
.lx-ls-v2 .lx-ls-about-body {
	color: #27344a;
	font-size: 16.5px;
	line-height: 1.7;
}
/* Two classes: the 600px .lx-ls-card padding rule further down must not win. */
.lx-ls-v2 .lx-ls-card.lx-ls-glance {
	padding: 22px 28px 24px;
}
.lx-ls-v2 .lx-ls-glance .lx-ls-card-h {
	margin-bottom: 16px;
}
.lx-ls-v2 .lx-ls-glance-list {
	margin: 0;
}
.lx-ls-v2 .lx-ls-glance-row {
	display: flex;
	justify-content: space-between;
	gap: 16px;
	padding: 7px 0;
}
.lx-ls-v2 .lx-ls-glance-row:first-child {
	padding-top: 0;
}
.lx-ls-v2 .lx-ls-glance-row:last-child {
	padding-bottom: 0;
}
/* Sizes sit on dt and dd themselves: the theme styles both elements directly. */
.lx-ls-v2 .lx-ls-glance-row dt,
.lx-ls-v2 .lx-ls-glance-row dd {
	margin: 0;
	font-size: 15.5px;
	line-height: 1.45;
}
.lx-ls-v2 .lx-ls-glance-row dt {
	flex: none;
	color: var(--lx-ls-muted);
	font-weight: 400;
	white-space: nowrap;
}
.lx-ls-v2 .lx-ls-glance-row dd {
	flex: 1 1 0;
	min-width: 0;
	color: var(--lx-ls-ink);
	font-weight: 400;
	text-align: right;
	overflow-wrap: break-word;
}
.lx-ls-v2 .lx-ls-glance-row dd a {
	position: relative;
	display: inline-block;
	max-width: 100%;
	color: var(--lx-ls-blue-dark);
	text-decoration: none;
}
.lx-ls-v2 .lx-ls-glance-row dd a:hover {
	text-decoration: underline;
	text-underline-offset: 2px;
}
/* A 40px tap target without making the row taller or stretching the focus ring. */
.lx-ls-v2 .lx-ls-glance-row dd a::after {
	content: "";
	position: absolute;
	inset: -10px 0;
}
/* No text: the card spans the band. From 480px the facts sit side by side, label over value. */
@media (min-width: 992px) {
	.lx-ls-v2 .lx-ls-about--facts {
		grid-template-columns: minmax(0, 1fr);
	}
}
@media (min-width: 480px) {
	.lx-ls-v2 .lx-ls-about--facts .lx-ls-glance-list {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 14px 24px;
	}
	.lx-ls-v2 .lx-ls-about--facts .lx-ls-glance-row {
		display: block;
		padding: 0;
	}
	.lx-ls-v2 .lx-ls-about--facts .lx-ls-glance-row dt {
		white-space: normal;
	}
	.lx-ls-v2 .lx-ls-about--facts .lx-ls-glance-row dd {
		text-align: left;
	}
}
/* 480-699px: two per row; an odd last fact takes the whole row. */
@media (min-width: 480px) and (max-width: 699px) {
	.lx-ls-v2 .lx-ls-about--facts .lx-ls-glance-row:last-child:nth-child(odd) {
		grid-column: 1 / -1;
	}
}
/* From 700px: rows of equal length (5 = 3 + 2, 6 = 3 + 3, 7 = 4 + 3, 8 = 4 + 4). */
@media (min-width: 700px) {
	.lx-ls-v2 .lx-ls-about--facts .lx-ls-glance--n3 .lx-ls-glance-list,
	.lx-ls-v2 .lx-ls-about--facts .lx-ls-glance--n5 .lx-ls-glance-list,
	.lx-ls-v2 .lx-ls-about--facts .lx-ls-glance--n6 .lx-ls-glance-list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.lx-ls-v2 .lx-ls-about--facts .lx-ls-glance--n7 .lx-ls-glance-list,
	.lx-ls-v2 .lx-ls-about--facts .lx-ls-glance--n8 .lx-ls-glance-list {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
}
/* One row where every fact has room for it. */
@media (min-width: 1200px) {
	.lx-ls-v2 .lx-ls-about--facts .lx-ls-glance--n4 .lx-ls-glance-list {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
	.lx-ls-v2 .lx-ls-about--facts .lx-ls-glance--n5 .lx-ls-glance-list {
		grid-template-columns: repeat(5, minmax(0, 1fr));
	}
}
@media (min-width: 1500px) {
	.lx-ls-v2 .lx-ls-about--facts .lx-ls-glance--n6 .lx-ls-glance-list {
		grid-template-columns: repeat(6, minmax(0, 1fr));
	}
}
@media (min-width: 1900px) {
	.lx-ls-v2 .lx-ls-about--facts .lx-ls-glance--n7 .lx-ls-glance-list {
		grid-template-columns: repeat(7, minmax(0, 1fr));
	}
}
.lx-ls-v2 .lx-ls-about-body > * {
	margin: 0 0 1em;
}
.lx-ls-v2 .lx-ls-about-body > :last-child {
	margin-bottom: 0;
}

/* ---------- Your numbers (sliders) ---------- */
.lx-ls-v2 .lx-ls-pos .lx-ls-g {
	gap: 14px 28px;
}
.lx-ls-v2 .lx-ls-pos-col {
	display: flex;
	flex-direction: column;
	gap: 4px;
	min-width: 0;
}
.lx-ls-v2 .lx-ls-pos-l {
	color: var(--lx-ls-ink);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.3;
}
.lx-ls-v2 .lx-ls-pos-l label {
	display: inline;
	max-width: none;
	font: inherit;
}
.lx-ls-v2 .lx-ls-pos-v {
	color: var(--lx-ls-blue-dark);
}
.lx-ls-v2 .lx-ls-range {
	display: block;
	width: 100%;
	height: 40px;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
	accent-color: var(--lx-ls-blue);
	cursor: pointer;
}
.lx-ls-v2 .lx-ls-range:disabled {
	cursor: default;
}
.lx-ls-v2 .lx-ls-pos .lx-ls-bandrow {
	margin-bottom: 4px;
}
/*
 * The middle of a slider's thumb travels from half a thumb inside one end to half a thumb inside
 * the other. The bar under it is inset by the same 8px, so the marker stays under the thumb.
 */
.lx-ls-v2 .lx-ls-pos .lx-ls-track,
.lx-ls-v2 .lx-ls-pos .lx-ls-track-scale {
	margin-left: 8px;
	margin-right: 8px;
}
.lx-ls-v2 .lx-ls-pos-text {
	min-height: 3.1em;
	color: var(--lx-ls-ink);
	font-size: 14.5px;
	font-weight: 600;
	line-height: 1.5;
}

/* ---------- Cost: stacked bars (Profile::sbar) ---------- */
.lx-ls-v2 .lx-ls-costbars,
.lx-ls-v2 .lx-ls-costbar,
.lx-ls-v2 .lx-ls-sbar-wrap {
	display: flex;
	flex-direction: column;
	gap: 10px;
}
.lx-ls-v2 .lx-ls-costbars {
	gap: 16px;
}
.lx-ls-v2 .lx-ls-sbar {
	display: flex;
	height: 46px;
	min-width: 140px;
	overflow: hidden;
	border-radius: 10px;
}
.lx-ls-v2 .lx-ls-sbar-seg {
	display: flex;
	align-items: center;
	justify-content: center;
	min-width: 3px;
	overflow: hidden;
	font-size: 13.5px;
	line-height: 1;
	white-space: nowrap;
	container-type: inline-size;
}
.lx-ls-v2 .lx-ls-sbar-t,
.lx-ls-v2 .lx-ls-sbar-n {
	display: none;
}
.lx-ls-v2 .lx-ls-sbar-t b {
	font-weight: 800;
}
@container (min-width: 68px) {
	.lx-ls-v2 .lx-ls-sbar-t {
		display: block;
	}
}
@container (min-width: 184px) {
	.lx-ls-v2 .lx-ls-sbar-n {
		display: inline;
	}
}
/*
 * The legend repeats the bar once every segment shows its own name. Profile::sbar() works out the
 * row width where that starts and marks the wrap (--k480 ... --k1800); from that width the legend goes.
 */
.lx-ls-v2 .lx-ls-costbar {
	container-type: inline-size;
}
@container (min-width: 480px) {
	.lx-ls-v2 .lx-ls-sbar-wrap--k480 > .lx-ls-legend {
		display: none;
	}
}
@container (min-width: 600px) {
	.lx-ls-v2 .lx-ls-sbar-wrap--k600 > .lx-ls-legend {
		display: none;
	}
}
@container (min-width: 720px) {
	.lx-ls-v2 .lx-ls-sbar-wrap--k720 > .lx-ls-legend {
		display: none;
	}
}
@container (min-width: 860px) {
	.lx-ls-v2 .lx-ls-sbar-wrap--k860 > .lx-ls-legend {
		display: none;
	}
}
@container (min-width: 1000px) {
	.lx-ls-v2 .lx-ls-sbar-wrap--k1000 > .lx-ls-legend {
		display: none;
	}
}
@container (min-width: 1200px) {
	.lx-ls-v2 .lx-ls-sbar-wrap--k1200 > .lx-ls-legend {
		display: none;
	}
}
@container (min-width: 1450px) {
	.lx-ls-v2 .lx-ls-sbar-wrap--k1450 > .lx-ls-legend {
		display: none;
	}
}
@container (min-width: 1800px) {
	.lx-ls-v2 .lx-ls-sbar-wrap--k1800 > .lx-ls-legend {
		display: none;
	}
}
.lx-ls-v2 .lx-ls-band--navy .lx-ls-legend,
.lx-ls-v2 .lx-ls-band--navy .lx-ls-facts {
	color: #d5deef;
}

/* ---------- Keep exploring ---------- */
.lx-ls-v2 .lx-ls-sim {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.lx-ls-v2 .lx-ls-sim li {
	display: flex;
}
.lx-ls-v2 .lx-ls-simc {
	display: flex;
	align-items: center;
	gap: 10px;
	min-height: 52px;
	padding: 8px 16px 8px 12px;
	border: 1px solid var(--lx-ls-line);
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(15, 27, 49, .05);
	color: var(--lx-ls-ink);
	text-decoration: none;
}
.lx-ls-v2 a.lx-ls-simc::after {
	content: "\2192";
	content: "\2192" / "";
	margin-left: auto;
	color: var(--lx-ls-muted);
	font-weight: 700;
}
.lx-ls-v2 a.lx-ls-simc:hover {
	border-color: var(--lx-ls-blue);
	color: var(--lx-ls-blue-dark);
}
.lx-ls-v2 .lx-ls-simc--all {
	padding-left: 16px;
}
.lx-ls-v2 .lx-ls-simc-t {
	display: flex;
	flex-direction: column;
	line-height: 1.3;
}
.lx-ls-v2 .lx-ls-simc-t strong {
	font-size: 14.5px;
	font-weight: 800;
}
.lx-ls-v2 .lx-ls-simc-t span {
	color: var(--lx-ls-muted);
	font-size: 12.5px;
}
.lx-ls-v2 .lx-ls-mlogo {
	display: inline-flex;
	flex: none;
	align-items: center;
	justify-content: center;
	width: 28px;
	height: 28px;
	border-radius: 6px;
	object-fit: contain;
	font-size: 12px;
	font-weight: 800;
	line-height: 1;
	letter-spacing: -.02em;
}
/* Initials instead of a logo: wide enough for four letters at 12px. */
.lx-ls-v2 .lx-ls-mlogo--txt {
	width: auto;
	min-width: 28px;
	padding: 0 5px;
}
.lx-ls-v2 .lx-ls-fig .lx-ls-note a,
.lx-ls-v2 .lx-ls-teaser a {
	display: inline-block;
	padding: 10px 0;
}
/* "Hover over a dot ..." is for a pointer that can hover; a touch screen does not get the sentence. */
@media (hover: none) {
	.lx-ls-v2 .lx-ls-hover-only {
		display: none;
	}
}
.lx-ls-v2 .lx-ls-cta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 16px 24px;
	padding: 22px 20px;
	border-radius: 16px;
	background: linear-gradient(100deg, #1e3a8a, #1d4ed8);
	color: #fff;
}
.lx-ls-v2 .lx-ls-cta-t {
	flex: 1 1 280px;
}
.lx-ls-v2 .lx-ls-cta .lx-ls-h3 {
	color: #fff;
	font-size: 21px;
}
.lx-ls-v2 .lx-ls-cta p,
.lx-ls-v2 .lx-ls-cta label {
	color: #e9efff;
	font-size: 15px;
}
.lx-ls-v2 .lx-ls-cta-f {
	flex: 0 1 420px;
	min-width: 0;
}
.lx-ls-v2 .lx-ls-cta-f input[type="email"],
.lx-ls-v2 .lx-ls-cta-f input[type="text"] {
	width: 100%;
	max-width: 100%;
	min-height: 46px;
	margin: 0 0 8px;
	padding: 0 14px;
	border: 0;
	border-radius: 10px;
	background: #fff;
	color: var(--lx-ls-ink);
	font-size: 16px;
}
.lx-ls-v2 .lx-ls-cta-f input[type="submit"],
.lx-ls-v2 .lx-ls-cta-f button {
	min-height: 46px;
	padding: 0 20px;
	border: 0;
	border-radius: 10px;
	background: var(--lx-ls-gold);
	color: var(--lx-ls-navy);
	font-size: 15.5px;
	font-weight: 800;
	cursor: pointer;
}
.lx-ls-v2 .lx-ls-soon {
	display: inline-block;
	margin-left: 8px;
	padding: 2px 10px;
	border-radius: 999px;
	background: #fff3cc;
	color: #5f4400;
	font-size: 12px;
	font-weight: 800;
	vertical-align: middle;
}
.lx-ls-v2 .lx-ls-teaser p + p {
	margin-top: 8px;
}

/* ---------- FAQ ---------- */
.lx-ls-v2 .lx-ls-faq {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.lx-ls-v2 .lx-ls-faq-i {
	margin: 0;
	padding: 0;
	border: 1px solid var(--lx-ls-line-soft);
	border-radius: 12px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(15, 27, 49, .05);
}
.lx-ls-v2 .lx-ls-faq-i > summary {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 54px;
	padding: 10px 16px;
	cursor: pointer;
	list-style: none;
}
.lx-ls-v2 .lx-ls-faq-i > summary::-webkit-details-marker {
	display: none;
}
.lx-ls-v2 .lx-ls-faq-i > summary::before {
	content: "";
	flex: none;
	width: 0;
	height: 0;
	border-top: 5px solid transparent;
	border-bottom: 5px solid transparent;
	border-left: 7px solid var(--lx-ls-ink);
	transition: transform .15s;
}
.lx-ls-v2 .lx-ls-faq-i[open] > summary::before {
	transform: rotate(90deg);
}
.lx-ls-v2 .lx-ls-faq-i .lx-ls-h3 {
	font-size: 16px;
}
.lx-ls-v2 .lx-ls-faq-i > p {
	padding: 0 16px 16px 35px;
	font-size: 15.5px;
}

/* ---------- Wider screens ---------- */
@media (min-width: 600px) {
	.lx-ls-v2 .lx-ls-card {
		padding: 18px 20px 20px;
	}
	.lx-ls-v2 .lx-ls-tile {
		padding: 16px 18px 18px;
	}
	.lx-ls-v2 .lx-ls-tile-v {
		font-size: 30px;
	}
	.lx-ls-v2 .lx-ls-cta {
		padding: 26px 28px;
	}
	.lx-ls-v2 .lx-ls-cols {
		gap: 8px;
	}
	.lx-ls-v2 .lx-ls-cols-x {
		gap: 8px;
	}
}
@media (min-width: 768px) {
	.lx-ls-v2 .lx-ls-hero {
		padding-top: 24px;
	}
	.lx-ls-v2 .lx-ls-h1 {
		font-size: 40px;
	}
	.lx-ls-v2 .lx-ls-tagline {
		font-size: 19px;
	}
	.lx-ls-v2 .lx-ls-stat {
		padding: 18px 20px 16px;
	}
	.lx-ls-v2 .lx-ls-stat-v {
		font-size: 36px;
	}
	.lx-ls-v2 .lx-ls-band {
		padding: 56px 0;
	}
	.lx-ls-v2 .lx-ls-band > .lx-ls-wrap {
		gap: 20px;
	}
	.lx-ls-v2 .lx-ls-h2 {
		font-size: 30px;
	}
	.lx-ls-v2 .lx-ls-lede {
		font-size: 17px;
	}
}
@media (min-width: 992px) {
	.lx-ls-v2 .lx-ls-statgrid {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 14px;
	}
}
@media (max-width: 599px) {
	.lx-ls-v2 .lx-ls-crumbs li:first-child {
		display: none;
	}
	.lx-ls-v2 .lx-ls-crumbs li:nth-child(2)::before {
		content: none;
	}
	.lx-ls-v2 .lx-ls-badge {
		width: 56px;
		height: 56px;
		border-radius: 12px;
		font-size: 16px;
	}
	.lx-ls-v2 .lx-ls-badge--logo img {
		width: 46px;
		height: 46px;
	}
	.lx-ls-v2 .lx-ls-hero-cta .lx-ls-btn {
		flex: 1 1 150px;
		padding: 0 12px;
		font-size: 15px;
	}
	/* Similar schools: one full-width pill per row, so the rows line up. */
	.lx-ls-v2 .lx-ls-sim li,
	.lx-ls-v2 .lx-ls-simc {
		width: 100%;
	}
}

@media (prefers-reduced-motion: reduce) {
	.lx-ls-v2 *,
	.lx-ls-v2 *::before {
		transition: none !important;
		scroll-behavior: auto !important;
	}
}
@media print {
	.lx-ls-v2 .lx-ls-glance {
		break-inside: avoid;
	}
	.lx-ls-v2 .lx-ls-tabs,
	.lx-ls-v2 #numbers,
	.lx-ls-v2 .lx-ls-hero-cta,
	.lx-ls-v2 .lx-ls-cta {
		display: none;
	}
	.lx-ls-v2 details > * {
		display: block;
	}
	/* A closed <details> keeps its content hidden through this part; lx-ls-v2.js also opens them before printing. */
	.lx-ls-v2 details::details-content {
		display: block;
		content-visibility: visible;
	}
}

/* ---------- vNext (0.2.6, reviewed on Yale; every school since the rollout): colored chips, centered "At a glance", justified mobile text ---------- */
/* Colored filter chips on the navy hero (owner request). Readable on dark. */
.lx-ls-v2.lx-ls-vnext .lx-ls-chip--aba,
.lx-ls-v2.lx-ls-vnext .lx-ls-chip--type,
.lx-ls-v2.lx-ls-vnext .lx-ls-chip--prog,
.lx-ls-v2.lx-ls-vnext .lx-ls-chip--class {
	border: 1px solid transparent;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-chip--aba {
	background: rgba(74, 222, 128, .16);
	color: #4ade80;
	border-color: rgba(74, 222, 128, .35);
}
.lx-ls-v2.lx-ls-vnext .lx-ls-chip--type {
	background: rgba(245, 179, 1, .18);
	color: #fcd34d;
	border-color: rgba(252, 211, 77, .38);
}
.lx-ls-v2.lx-ls-vnext .lx-ls-chip--prog {
	background: rgba(124, 92, 246, .22);
	color: #c4b5fd;
	border-color: rgba(196, 181, 253, .4);
}
.lx-ls-v2.lx-ls-vnext .lx-ls-chip--class {
	background: rgba(56, 189, 248, .16);
	color: #7dd3fc;
	border-color: rgba(125, 211, 252, .38);
}
/* Provisionally approved: outlined like the chips above, in orange (amber is "Private"). Text 4.8:1 on the
   lightest part of the hero (#1d3a7c), 7.1:1 where the chips start (#0f1b31). */
.lx-ls-v2.lx-ls-vnext .lx-ls-chip--prov {
	border: 1px solid rgba(255, 169, 77, .45);
	background: rgba(249, 115, 22, .18);
	color: #ffa94d;
}
/*
 * "At a glance" beside the About text, centered on the paragraphs (owner requests, 0.2.6 and 0.2.15).
 * From 1400px the heading and the text become grid items of their own (display: contents on the
 * wrapper): the heading takes the first row, and the card shares the second row with the paragraphs,
 * both centered, so the card's middle lines up with the text's middle whichever of the two is taller.
 * 992-1399px: the left nav takes 289px, which left the text 300-420px wide beside the card, so there
 * the card goes under the text, as on tablets.
 */
@media (min-width: 992px) and (max-width: 1399px) {
	.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) {
		grid-template-columns: minmax(0, 1fr);
		gap: 24px;
	}
}
@media (min-width: 1400px) {
	.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) {
		row-gap: 18px;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) > .lx-ls-about-main {
		display: contents;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) .lx-ls-about-main > .lx-ls-bh {
		grid-column: 1;
		grid-row: 1;
		min-width: 0;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) .lx-ls-about-body {
		grid-column: 1;
		grid-row: 2;
		align-self: center;
		min-width: 0;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) > .lx-ls-glance {
		grid-column: 2;
		grid-row: 2;
		align-self: center;
	}
}
/*
 * "At a glance", centered (owner's pick "C", 0.2.16): the heading and every fact are centered, a small
 * label over its value. Two facts per row beside the text and on phones (an odd last fact takes the
 * whole row); four per row (three for 3, 5 or 6 facts) where the card spans the band under the text.
 */
.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) .lx-ls-glance {
	text-align: center;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) .lx-ls-glance-list {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 18px 18px;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) .lx-ls-glance-row {
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 3px;
	padding: 0;
	min-width: 0;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) .lx-ls-glance-row dt {
	font-size: 13px;
	white-space: normal;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) .lx-ls-glance-row dd {
	flex: none;
	max-width: 100%;
	font-size: 16px;
	font-weight: 600;
	text-align: center;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) .lx-ls-glance-row:last-child:nth-child(odd) {
	grid-column: 1 / -1;
}
@media (min-width: 768px) and (max-width: 1399px) {
	.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) .lx-ls-glance-list {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) .lx-ls-glance--n3 .lx-ls-glance-list,
	.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) .lx-ls-glance--n5 .lx-ls-glance-list,
	.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) .lx-ls-glance--n6 .lx-ls-glance-list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-about:not(.lx-ls-about--facts) .lx-ls-glance-row:last-child:nth-child(odd) {
		grid-column: auto;
	}
}
/*
 * "At a glance" without an About text (.lx-ls-about--facts): the same centered card (owner request,
 * after Yale's "C"), across the band. Heading and facts centered, a small label over its value; two
 * facts per row on phones, three from 768px. A last row that is not full sits centered under the others
 * (5 facts = 3 + 2, 7 = 3 + 3 + 1; on phones the odd last fact is centered).
 */
.lx-ls-v2.lx-ls-vnext .lx-ls-about--facts .lx-ls-glance {
	text-align: center;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-about--facts .lx-ls-glance-list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 18px;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-about--facts .lx-ls-glance-row {
	display: flex;
	flex: 0 0 calc((100% - 18px) / 2);
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 3px;
	padding: 0;
	min-width: 0;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-about--facts .lx-ls-glance-row dt {
	font-size: 13px;
	white-space: normal;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-about--facts .lx-ls-glance-row dd {
	flex: none;
	max-width: 100%;
	font-size: 16px;
	font-weight: 600;
	text-align: center;
}
@media (min-width: 768px) {
	.lx-ls-v2.lx-ls-vnext .lx-ls-about--facts .lx-ls-glance-row {
		flex-basis: calc((100% - 36px) / 3);
	}
}
/* A little more room at the sides on phones (owner request, 0.2.15): 18px instead of 12px. */
@media (max-width: 767px) {
	.lx-ls-v2.lx-ls-vnext .lx-ls-wrap {
		padding-left: 18px;
		padding-right: 18px;
	}
}
/* Justify body paragraphs on mobile for even left and right margins (owner request). */
@media (max-width: 620px) {
	.lx-ls-v2.lx-ls-vnext .lx-ls-about-body {
		text-align: justify;
		text-justify: inter-word;
		hyphens: auto;
	}
}

/* ---------- vNext sidebar (0.2.7): vertical nav on desktop; mobile keeps the top bar ---------- */
@media (min-width: 992px) {
	/* 0.2.10: full-width hero on top; the sidebar + bands sit in two columns below it (.lx-ls-vbelow). */
	.lx-ls-v2.lx-ls-vnext {
		--lx-ls-tabs: 0px;
	}
	/* 0.2.14 (owner: the Vermont page's outline, plus the left nav on desktop): the bands stay full
	   bleed, so each band's color runs to both edges with no mismatch at the sides, and every band keeps
	   the site's inner column (.lx-ls-wrap), the same width as the hero. The nav card and the bands share
	   one grid cell: the card sits sticky at the column's left edge above the band colors, and each
	   band's wrap leaves room for it. Replaces 0.2.13's full-width content. */
	.lx-ls-v2.lx-ls-vnext .lx-ls-vbelow {
		display: grid;
		grid-template-columns: minmax(0, 1fr);
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-vbelow > .lx-ls-tabs,
	.lx-ls-v2.lx-ls-vnext .lx-ls-vbelow > .lx-ls-vbands {
		grid-area: 1 / 1;
		min-width: 0;
	}
	/* Boxed card (0.2.13). Its left edge = the stat cards' left edge: the centered 970px column plus
	   its 15px padding here; 10% + 15px from 1200px (min-width:1200 rule after this block). */
	.lx-ls-v2.lx-ls-vnext .lx-ls-vbelow > .lx-ls-tabs {
		justify-self: start;
		align-self: start;
		width: 250px;
		margin: 24px 0 24px calc((100% - 970px) / 2 + 15px);
		position: sticky;
		top: calc(var(--lx-ls-sticky) + 16px);
		max-height: calc(100vh - var(--lx-ls-sticky) - 32px);
		overflow-y: auto;
		overscroll-behavior: contain;
		background: #fff;
		border: 1px solid var(--lx-ls-line);
		border-radius: 14px;
		box-shadow: 0 1px 3px rgba(15, 27, 49, .06), 0 10px 26px -18px rgba(15, 27, 49, .25);
		z-index: 4;
	}
	/* Room for the card in every band: the wrap's 15px padding + 250px card + 24px gap. */
	.lx-ls-v2.lx-ls-vnext .lx-ls-vbands .lx-ls-band > .lx-ls-wrap {
		padding-left: 289px;
	}
	/* Flush-left vertical list; drop the centered, horizontally-scrolling strip styling. */
	.lx-ls-v2.lx-ls-vnext .lx-ls-tabs > .lx-ls-wrap {
		max-width: none;
		width: 100%;
		padding: 14px 10px 18px;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-tablist {
		flex-direction: column;
		gap: 2px;
		overflow: visible;
		-webkit-mask-image: none;
		mask-image: none;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-tablist::after {
		content: none;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-tablist::before {
		content: "On this page";
		display: block;
		padding: 2px 14px 10px;
		font-size: 11px;
		letter-spacing: .09em;
		text-transform: uppercase;
		font-weight: 800;
		color: var(--lx-ls-muted);
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-tablist li {
		width: 100%;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-tablist a {
		height: auto;
		width: 100%;
		padding: 10px 14px;
		border-bottom: none;
		border-left: 3px solid transparent;
		border-radius: 0 8px 8px 0;
		justify-content: flex-start;
		white-space: normal;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-tablist a:hover {
		background: var(--lx-ls-pale);
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-tablist a[aria-current] {
		border-left-color: var(--lx-ls-blue);
		background: var(--lx-ls-band);
		color: var(--lx-ls-blue-dark);
	}
	/* The sidebar is always on screen, so cancel the scroll-stuck navy treatment and keep the card look. */
	.lx-ls-v2.lx-ls-vnext .lx-ls-tabs.is-stuck {
		background: #fff;
		border: 1px solid var(--lx-ls-line);
		border-radius: 14px;
		box-shadow: 0 1px 3px rgba(15, 27, 49, .06), 0 10px 26px -18px rgba(15, 27, 49, .25);
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-tabs.is-stuck .lx-ls-tablist a {
		color: #475569;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-tabs.is-stuck .lx-ls-tablist a:hover {
		color: var(--lx-ls-ink);
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-tabs.is-stuck .lx-ls-tablist a[aria-current] {
		border-left-color: var(--lx-ls-blue);
		border-bottom-color: transparent;
		color: var(--lx-ls-blue-dark);
	}
}
@media (min-width: 1200px) {
	/* .lx-ls-wrap is 80% wide from here, so the column's left edge sits at 10%. */
	.lx-ls-v2.lx-ls-vnext .lx-ls-vbelow > .lx-ls-tabs {
		margin-left: calc(10% + 15px);
	}
}

/* ---------- vNext batch 2 (0.2.8): sidebar extras, containment, centered glance, pies, chart tooltips, explorer panel ---------- */
/* Sidebar extras live in the DOM but show only as the desktop sidebar (hidden on the mobile top bar). */
.lx-ls-v2.lx-ls-vnext .lx-ls-vnav-ctrls,
.lx-ls-v2.lx-ls-vnext .lx-ls-vnav-foot,
.lx-ls-v2.lx-ls-vnext .lx-ls-tab-ico {
	display: none;
}
@media (min-width: 992px) {
	/* 0.2.9: full-width profile (owner reverted the 1280px containment). */
	.lx-ls-v2.lx-ls-vnext .lx-ls-vnav-ctrls {
		display: flex;
		flex-direction: column;
		gap: 10px;
		padding: 2px 12px 14px;
		border-bottom: 1px solid var(--lx-ls-line);
		margin-bottom: 10px;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-vnav-ctrl > span {
		display: block;
		font-size: 10.5px;
		letter-spacing: .09em;
		text-transform: uppercase;
		font-weight: 800;
		color: var(--lx-ls-muted);
		margin: 0 2px 4px;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-vnav-ctrl select {
		width: 100%;
		padding: 8px 10px;
		border: 1px solid var(--lx-ls-line);
		border-radius: 9px;
		background: #fff;
		color: var(--lx-ls-ink);
		font: inherit;
		font-size: 13.5px;
		font-weight: 600;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-vnav-ctrl select[disabled] {
		color: var(--lx-ls-muted);
		background: #f6f8fc;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-vnav-foot {
		display: block;
		margin: 14px 12px 2px;
		padding-top: 12px;
		border-top: 1px solid #eef2f8;
		font-size: 11.5px;
		line-height: 1.5;
		color: #8a93a3;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-tab-ico {
		display: inline-block;
		width: 17px;
		height: 17px;
		flex: none;
		color: #8a93a3;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-tablist a {
		gap: 10px;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-tablist a[aria-current] .lx-ls-tab-ico {
		color: var(--lx-ls-blue);
	}
	/* Give the race pies the full width of the Students band (stack the 'left/transferred' card below). */
	.lx-ls-v2.lx-ls-vnext #students .lx-ls-g--2 {
		grid-template-columns: 1fr;
	}
}

/* ---- Pie charts (race & ethnicity + students of color), built by lx-ls-v2.js ---- */
.lx-ls-v2.lx-ls-vnext .lx-ls-vpies {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
@media (max-width: 720px) {
	.lx-ls-v2.lx-ls-vnext .lx-ls-vpies {
		grid-template-columns: 1fr;
	}
}
/* 768-991px: the pies' card shares its row with another card, too narrow for two pies side by side. */
@media (min-width: 768px) and (max-width: 991px) {
	.lx-ls-v2.lx-ls-vnext .lx-ls-vpies {
		grid-template-columns: 1fr;
	}
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vpie h4 {
	font-size: 14px;
	margin: 0 0 2px;
	color: var(--lx-ls-ink);
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vpie-note {
	font-size: 12px;
	color: #8a93a3;
	margin-bottom: 10px;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vpie-row {
	display: flex;
	gap: 14px;
	align-items: center;
	flex-wrap: wrap;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vpie-row svg {
	flex: none;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vlegend {
	display: flex;
	flex-direction: column;
	gap: 5px;
	flex: 1;
	min-width: 150px;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vlegend .li {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 12.5px;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vlegend .sw {
	width: 11px;
	height: 11px;
	border-radius: 3px;
	flex: none;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vlegend .nm {
	flex: 1;
	min-width: 0;
	color: var(--lx-ls-ink);
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vlegend .vl {
	color: var(--lx-ls-muted);
	font-weight: 600;
	white-space: nowrap;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vlegend .li.dim {
	opacity: .4;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vpoc {
	margin-top: 12px;
	padding-top: 10px;
	border-top: 1px dashed var(--lx-ls-line);
	display: flex;
	justify-content: space-between;
	font-size: 13px;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vpoc b {
	color: var(--lx-ls-ink);
}
.lx-ls-v2.lx-ls-vnext .lx-ls-slice,
.lx-ls-v2.lx-ls-vnext .lx-ls-dslice {
	cursor: pointer;
	transition: opacity .12s;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-slice.fade,
.lx-ls-v2.lx-ls-vnext .lx-ls-dslice.fade {
	opacity: .3;
}

/* ---- Shared chart tooltip ---- */
.lx-ls-vtip {
	position: fixed;
	z-index: 2147483000;
	pointer-events: none;
	background: #0f1a30;
	color: #fff;
	border-radius: 9px;
	padding: 8px 11px;
	font-size: 12.5px;
	line-height: 1.3;
	box-shadow: 0 10px 28px rgba(0, 0, 0, .3);
	opacity: 0;
	transform: translateY(4px);
	transition: opacity .1s, transform .1s;
	max-width: 230px;
	font-family: inherit;
}
.lx-ls-vtip.on {
	opacity: 1;
	transform: translateY(0);
}
.lx-ls-vtip b {
	color: #fff;
	font-weight: 700;
}
.lx-ls-vtip .d {
	color: #aebdd8;
	font-size: 11.5px;
	margin-top: 2px;
}

/* ---- School explorer: filter panel beside the scatter ---- */
@media (min-width: 860px) {
	.lx-ls-v2.lx-ls-vnext .lx-ls-vexplore {
		display: grid;
		grid-template-columns: minmax(0, 1fr) 250px;
		gap: 16px;
		align-items: start;
	}
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vpanel {
	background: #fff;
	border: 1px solid var(--lx-ls-line);
	border-radius: 14px;
	padding: 14px 15px;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vpanel h4 {
	font-size: 14px;
	margin: 0 0 10px;
	color: var(--lx-ls-ink);
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vsearch {
	display: flex;
	align-items: center;
	gap: 8px;
	border: 1px solid var(--lx-ls-line);
	border-radius: 9px;
	padding: 8px 10px;
	margin-bottom: 12px;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vsearch svg {
	width: 15px;
	height: 15px;
	color: #8a93a3;
	flex: none;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vsearch input {
	border: none;
	outline: none;
	width: 100%;
	font: inherit;
	font-size: 13.5px;
	color: var(--lx-ls-ink);
	background: none;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vtog {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 13px;
	color: var(--lx-ls-ink);
	cursor: pointer;
	margin-bottom: 9px;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vtog .box {
	width: 36px;
	height: 20px;
	border-radius: 999px;
	background: var(--lx-ls-line);
	position: relative;
	flex: none;
	transition: background .15s;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vtog .box::after {
	content: "";
	position: absolute;
	top: 2px;
	left: 2px;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background: #fff;
	box-shadow: 0 1px 3px rgba(0, 0, 0, .25);
	transition: left .15s;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vtog.on .box {
	background: var(--lx-ls-blue);
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vtog.on .box::after {
	left: 18px;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vtog .dotc {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	flex: none;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vpanel .cap {
	font-size: 10.5px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: #8a93a3;
	font-weight: 800;
	margin: 6px 0 7px;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vfeat {
	max-height: 188px;
	overflow: auto;
	display: flex;
	flex-direction: column;
	gap: 1px;
	border: 1px solid #eef2f8;
	border-radius: 9px;
	padding: 6px;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vfeat label {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: var(--lx-ls-ink);
	padding: 4px 6px;
	border-radius: 7px;
	cursor: pointer;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vfeat label:hover {
	background: var(--lx-ls-pale);
}
.lx-ls-v2.lx-ls-vnext .lx-ls-vfeat input {
	accent-color: var(--lx-ls-blue);
	width: 15px;
	height: 15px;
}

/* ---------- vNext data year: "Latest data" pill, the year shown in the table ---------- */
.lx-ls-v2.lx-ls-vnext .lx-ls-vnav-year {
	cursor: pointer;
}
/* Only in a past-year view (?lx_ls_year): the parts that stay on the latest year carry the pill. */
.lx-ls-v2.lx-ls-vnext .lx-ls-latest-tag {
	display: inline-flex;
	align-items: center;
	padding: 2px 9px;
	border: 1px solid #c3d0e6;
	border-radius: 999px;
	background: #fff;
	color: var(--lx-ls-muted);
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .02em;
	line-height: 1.5;
	text-transform: none;
	white-space: nowrap;
	cursor: help;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-band--navy .lx-ls-latest-tag {
	border-color: rgba(255, 255, 255, .32);
	background: rgba(255, 255, 255, .08);
	color: #e2e8f5;
}
/* Above the admissions key facts (fee, deadlines, calendar): close to the card it labels. */
.lx-ls-v2.lx-ls-vnext .lx-ls-latest-row {
	display: flex;
	margin-bottom: -10px;
}
/* Under the "At a glance" heading, aligned like it (centered in the card beside or under the About text). */
.lx-ls-v2.lx-ls-vnext .lx-ls-glance-tag {
	margin: -8px 0 16px;
	line-height: 1;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-years .lx-ls-tbl tbody tr.is-selected > * {
	background: #fff4cc;
	color: var(--lx-ls-ink);
	font-weight: 700;
}
.lx-ls-v2.lx-ls-vnext .lx-ls-years .lx-ls-tbl tbody tr.is-selected > th {
	box-shadow: inset 4px 0 0 var(--lx-ls-gold);
}

/* ---------- vNext school switcher (0.2.20): the sidebar's school select as a searchable list with logos ---------- */
/* Built by lx-ls-v2.js (the select stays, hidden). .lx-ls-pick is the box in the sidebar card; .lx-ls-pick-pop
   is the panel, a child of <body> with position: fixed, so the card's own scrolling (overflow-y: auto) cannot
   cut it off. Desktop only, like the sidebar; below 992px nothing shows, as before. */
.lx-ls-v2.lx-ls-vnext .lx-ls-vnav-ctrl select[hidden],
.lx-ls-pick-pop[hidden],
.lx-ls-pick-pop [hidden] {
	display: none !important;
}
@media (min-width: 992px) {
	/* The box: logo tile, the school's name, the caret. Closed, the name shows in full on up to two lines
	   (.lx-ls-pick-lbl); focused or open, the text box takes its place on one line. Edge and radius as the
	   Data year select under it (--lx-ls-line, 9px); 46px tall = two lines of the name. The spacing is kept
	   tight (8px padding, 8px after the logo, a 12px caret slot) so the name gets 138px of the 204px box. */
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick {
		position: relative;
		display: flex;
		align-items: center;
		height: 46px;
		padding: 0 8px;
		border: 1px solid var(--lx-ls-line);
		border-radius: 9px;
		background: #fff;
		cursor: pointer;
		transition: border-color .12s ease, box-shadow .12s ease;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick-lbl {
		flex: 1 1 auto;
		min-width: 0;
		display: -webkit-box;
		overflow: hidden;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 2;
		line-clamp: 2;
		color: var(--lx-ls-ink);
		font-size: 13px;
		font-weight: 600;
		line-height: 1.25;
		overflow-wrap: break-word;
		text-align: left;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick:focus-within .lx-ls-pick-lbl,
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick.is-open .lx-ls-pick-lbl {
		display: none;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick:hover {
		border-color: #a3b3ca;
	}
	/* Focused or open: a dark 2px edge (border + 1px ring). */
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick:focus-within,
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick.is-open {
		border-color: var(--lx-ls-navy);
		box-shadow: 0 0 0 1px var(--lx-ls-navy);
	}
	/* A school was picked; its page is loading. */
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick.is-busy {
		opacity: .65;
		cursor: progress;
	}
	/* The text box fills the box's height (all of it takes a click) but its line is the text's own height,
	   so selected text is highlighted at text height. */
	.lx-ls-v2.lx-ls-vnext input.lx-ls-pick-in {
		flex: 1 1 auto;
		align-self: stretch;
		min-width: 0;
		width: 100%;
		height: auto;
		min-height: 0;
		margin: 0;
		padding: 0;
		border: 0;
		border-radius: 0;
		background: transparent;
		box-shadow: none;
		color: var(--lx-ls-ink);
		font: inherit;
		font-size: 13.5px;
		font-weight: 600;
		line-height: normal;
		text-overflow: ellipsis;
		cursor: pointer;
		-webkit-appearance: none;
		appearance: none;
	}
	/* Closed and not focused: the text box (the combobox, its value the full name) stays over the box,
	   unseen and not taking the pointer, so screen readers and the Tab key still reach it. */
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick:not(:focus-within):not(.is-open) input.lx-ls-pick-in {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		opacity: 0;
		pointer-events: none;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick.is-open input.lx-ls-pick-in {
		cursor: text;
	}
	.lx-ls-v2.lx-ls-vnext input.lx-ls-pick-in::placeholder {
		color: #7b8597;
		font-weight: 600;
		opacity: 1;
	}
	/* The box draws the focus (above); the general input ring would sit inside it. */
	.lx-ls-v2.lx-ls-vnext input.lx-ls-pick-in:focus,
	.lx-ls-v2.lx-ls-vnext input.lx-ls-pick-in:focus-visible {
		outline: none !important;
		box-shadow: none;
	}
	/* A 12px slot; the 18px icon's own margins overhang it. */
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick-caret {
		display: flex;
		flex: none;
		width: 12px;
		margin-left: 4px;
		color: var(--lx-ls-muted);
		transition: transform .15s ease;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick-caret svg {
		display: block;
		flex: none;
		width: 18px;
		height: 18px;
		margin: 0 -3px;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick.is-open .lx-ls-pick-caret {
		transform: rotate(180deg);
		color: var(--lx-ls-navy);
	}

	/* Logo tiles, in the box (24px) and on the rows (36px): the logo on white, or initials on the school's
	   colours (inline style), else on navy. */
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick-tile,
	.lx-ls-pick-pop .lx-ls-pick-tile {
		display: inline-flex;
		flex: none;
		align-items: center;
		justify-content: center;
		overflow: hidden;
		border: 1px solid #e3e8f0;
		background: #fff;
		color: #fff;
		font-weight: 800;
		line-height: 1;
		letter-spacing: -.02em;
		white-space: nowrap;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick-tile img,
	.lx-ls-pick-pop .lx-ls-pick-tile img {
		display: block;
		width: 100%;
		height: 100%;
		max-width: none;
		margin: 0;
		padding: 2px;
		border: 0;
		border-radius: 0;
		box-shadow: none;
		object-fit: contain;
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick-tile.is-txt,
	.lx-ls-pick-pop .lx-ls-pick-tile.is-txt {
		border-color: transparent;
		background: var(--lx-ls-navy);
	}
	.lx-ls-v2.lx-ls-vnext .lx-ls-pick > .lx-ls-pick-tile {
		width: 24px;
		height: 24px;
		margin-right: 8px;
		border-radius: 6px;
		font-size: 8.5px;
	}

	/* The panel: wider than the card, rounded, shadowed, its list scrolls (thin scrollbar). */
	.lx-ls-pick-pop {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 99990;
		box-sizing: border-box;
		width: 400px;
		margin: 0;
		padding: 0;
		overflow: hidden;
		border: 1px solid var(--lx-ls-line);
		border-radius: 12px;
		background: #fff;
		box-shadow: 0 2px 6px rgba(15, 27, 49, .06), 0 18px 44px -10px rgba(15, 27, 49, .3);
		color: var(--lx-ls-ink);
		font-size: 16px;
		line-height: 1.3;
		text-align: left;
	}
	.lx-ls-pick-pop *,
	.lx-ls-pick-pop *::before,
	.lx-ls-pick-pop *::after {
		box-sizing: border-box;
	}
	.lx-ls-pick-lb {
		position: relative;
		max-height: min(60vh, 480px);
		padding: 6px;
		overflow-y: auto;
		overscroll-behavior: contain;
		scrollbar-width: thin;
		scrollbar-color: #c3ccda transparent;
	}
	.lx-ls-pick-lb::-webkit-scrollbar {
		width: 8px;
	}
	.lx-ls-pick-lb::-webkit-scrollbar-thumb {
		border: 2px solid #fff;
		border-radius: 8px;
		background: #c3ccda;
	}
	/* "All law schools" under "Recent": a rule between the two groups. */
	.lx-ls-pick-grp:not([hidden]) + .lx-ls-pick-grp[role="group"] {
		margin-top: 6px;
		padding-top: 6px;
		border-top: 1px solid var(--lx-ls-line-soft);
	}
	.lx-ls-pick-h {
		padding: 8px 10px 6px;
		color: var(--lx-ls-muted);
		font-size: 11px;
		font-weight: 800;
		letter-spacing: .09em;
		text-transform: uppercase;
	}
	.lx-ls-pick-opt {
		display: flex;
		align-items: center;
		gap: 12px;
		min-height: 48px;
		padding: 6px 10px;
		border-radius: 9px;
		color: var(--lx-ls-ink);
		cursor: pointer;
	}
	.lx-ls-pick-opt:hover {
		background: var(--lx-ls-pale);
	}
	/* The row the arrow keys are on (aria-activedescendant). */
	.lx-ls-pick-opt.is-active {
		background: var(--lx-ls-tint);
		box-shadow: inset 3px 0 0 var(--lx-ls-blue);
	}
	/* Forced colours drop backgrounds and shadows: an outline marks the active row there, and the box when
	   it is focused or open (its 1px ring is a shadow). */
	@media (forced-colors: active) {
		.lx-ls-pick-opt.is-active {
			outline: 2px solid Highlight;
			outline-offset: -2px;
		}
		.lx-ls-v2.lx-ls-vnext .lx-ls-pick:focus-within,
		.lx-ls-v2.lx-ls-vnext .lx-ls-pick.is-open {
			outline: 2px solid Highlight;
			outline-offset: 1px;
		}
	}
	.lx-ls-pick-opt .lx-ls-pick-tile {
		width: 36px;
		height: 36px;
		border-radius: 8px;
		font-size: 11px;
	}
	.lx-ls-pick-nm {
		flex: 1 1 auto;
		min-width: 0;
		font-size: 15.5px;
		font-weight: 600;
		line-height: 1.3;
	}
	/* The school on screen: bold blue with a check. */
	.lx-ls-pick-opt.is-current .lx-ls-pick-nm {
		color: var(--lx-ls-blue-dark);
		font-weight: 800;
	}
	.lx-ls-pick-chk {
		flex: none;
		width: 18px;
		height: 18px;
		color: var(--lx-ls-blue);
	}
	.lx-ls-pick-none {
		margin: 0;
		padding: 18px 16px;
		color: var(--lx-ls-muted);
		font-size: 14.5px;
	}
	.lx-ls-pick-none:empty {
		padding: 0;
	}
	.lx-ls-pick-sr {
		position: absolute !important;
		width: 1px !important;
		height: 1px !important;
		margin: -1px !important;
		padding: 0 !important;
		overflow: hidden !important;
		clip: rect(0 0 0 0) !important;
		white-space: nowrap !important;
		border: 0 !important;
	}
}