/* ==========================================================================
   Recash.tech Lab UI — theme-aware, RTL-ready, vendor chrome hidden
   ========================================================================== */

html {
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--rl-nav-h, 4.25rem) + 12px);
	background-color: var(--rl-canvas);
}

html.rl-section-bar-on {
	scroll-padding-top: calc(var(--rl-section-bar-h, 3rem) + 12px);
}

.rl-project [id^="rl-"],
.rl-shell--home [id^="rl-"] {
	scroll-margin-top: calc(var(--rl-section-bar-h, 3rem) + 12px);
}

html.rl-section-bar-on .rl-nav {
	transform: translateY(-100%);
	opacity: 0;
	pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
}

:root,
html[data-rl-theme="light"] {
	--rl-canvas: #eef1f4;
	--rl-canvas-2: #eef1f4;
	--rl-ink: #0b0d10;
	--rl-ink-2: #2a3038;
	--rl-muted: #6a7380;
	--rl-line: rgba(11, 13, 16, 0.12);
	--rl-line-strong: rgba(11, 13, 16, 0.28);
	--rl-panel: #ffffff;
	--rl-nav-bg: rgba(238, 241, 244, 0.92);
	--rl-nav-border: rgba(11, 13, 16, 0.1);
	--rl-signal: #d4ff4f;
	--rl-signal-ink: #10140a;
	--rl-ice: #8fd9ff;
	--rl-dev: #c45c26;
	--rl-done: #1f6b4a;
	--rl-archive: #6a7380;
	--rl-hero-fg: #f4f6f8;
	--rl-footer-bg: #eef1f4;
	--rl-footer-fg: #2a3038;
	--rl-lift: #ffffff;
	--rl-shadow: rgba(11, 13, 16, 0.14);
	--rl-dot: rgba(11, 13, 16, 0.12);
	--rl-glow-signal: rgba(212, 255, 79, 0.14);
	--rl-glow-ice: rgba(143, 217, 255, 0.1);
	/* Text links: never bare lime on light surfaces */
	--rl-link: #0b0d10;
	--rl-link-hover: #1f6b4a;
	--rl-max: 1200px;
	--rl-pad: clamp(1.25rem, 4vw, 3.5rem);
	--rl-nav-h: 4.25rem;
	--rl-section-bar-h: 3rem;
	--rl-display: "Bricolage Grotesque", "Segoe UI", sans-serif;
	--rl-mono: "IBM Plex Mono", ui-monospace, monospace;
	--rl-ease: cubic-bezier(0.22, 1, 0.36, 1);
}

html[data-rl-theme="dark"] {
	--rl-canvas: #0b0d10;
	--rl-canvas-2: #0b0d10;
	--rl-ink: #eef2f6;
	--rl-ink-2: #c9d1da;
	--rl-muted: #8b95a3;
	--rl-line: rgba(238, 242, 246, 0.1);
	--rl-line-strong: rgba(238, 242, 246, 0.28);
	--rl-panel: #161c24;
	--rl-nav-bg: rgba(11, 13, 16, 0.92);
	--rl-nav-border: rgba(238, 242, 246, 0.14);
	--rl-signal: #d4ff4f;
	--rl-signal-ink: #10140a;
	--rl-ice: #7ec8ef;
	--rl-dev: #ff9b5a;
	--rl-done: #5dcea0;
	--rl-archive: #8b95a3;
	--rl-footer-bg: #0b0d10;
	--rl-footer-fg: #c9d1da;
	--rl-lift: #1a222c;
	--rl-shadow: rgba(0, 0, 0, 0.55);
	--rl-dot: rgba(238, 242, 246, 0.16);
	--rl-glow-signal: rgba(212, 255, 79, 0.08);
	--rl-glow-ice: rgba(126, 200, 239, 0.07);
	/* Light ink on dark canvas — ice hover, not pale lime text */
	--rl-link: #eef2f6;
	--rl-link-hover: #7ec8ef;
	color-scheme: dark;
}

/* Hide parent magazine chrome entirely from UI */
.jeg_header_wrapper,
.jeg_header_sticky,
.jeg_navbar_mobile_wrapper,
.jeg_ad,
.jnews_header_top_ads,
.jnews_header_bottom_ads,
.jeg_sidefeed,
.footer-holder,
.jscroll-to-top,
.jnews_dock_player,
.jnews_podcast,
.jnews_mobile_sticky_ads,
p.copyright,
.copyright {
	display: none !important;
}

body.recash-lab-home .jnews_dock_player {
	display: none !important;
}

.jeg_viewport,
.jeg_main,
.jeg_container,
.jeg_content {
	max-width: none !important;
	width: 100% !important;
	padding: 0 !important;
	margin: 0 !important;
	background: transparent !important;
}

body.recash-lab-ui {
	margin: 0;
	min-height: 100%;
	/* One continuous solid canvas — no gradient bands or section fills */
	background-color: var(--rl-canvas);
	background-image: none;
	color: var(--rl-ink);
	font-family: var(--rl-display);
}

.rl-skip {
	position: absolute;
	inset-inline-start: 1rem;
	top: -4rem;
	z-index: 1000;
	padding: 0.6rem 0.9rem;
	background: var(--rl-signal);
	color: var(--rl-signal-ink);
	text-decoration: none;
}

.rl-skip:focus {
	top: 1rem;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

/* ========== NAV ========== */
.rl-nav {
	position: sticky;
	top: 0;
	z-index: 100;
	backdrop-filter: blur(14px);
	background: var(--rl-nav-bg);
	border-bottom: 1px solid transparent;
	transition: border-color 0.25s ease, background 0.25s ease, transform 0.28s var(--rl-ease), opacity 0.28s ease;
}

.rl-nav.is-scrolled {
	border-bottom-color: var(--rl-nav-border);
}

/* Below-the-fold sticky section nav — pins to viewport top */
.rl-section-bar {
	position: sticky;
	top: 0;
	z-index: 110;
	min-height: var(--rl-section-bar-h);
	background: color-mix(in srgb, var(--rl-nav-bg) 94%, var(--rl-ink) 6%);
	backdrop-filter: blur(12px);
	border-bottom: 1px solid var(--rl-nav-border);
	transform: translateY(-120%);
	opacity: 0;
	pointer-events: none;
	transition: transform 0.28s var(--rl-ease), opacity 0.28s ease;
}

.rl-section-bar.is-visible {
	transform: translateY(0);
	opacity: 1;
	pointer-events: auto;
}

.rl-section-bar__inner {
	width: min(100% - (var(--rl-pad) * 2), var(--rl-max));
	margin-inline: auto;
	min-height: var(--rl-section-bar-h);
	display: flex;
	align-items: center;
	gap: 0.65rem 0.85rem;
}

.rl-section-bar__tools {
	display: flex;
	align-items: center;
	gap: 0.35rem;
	margin-inline-start: auto;
	flex: 0 0 auto;
}

.rl-section-bar__tools .rl-tool {
	width: 2.15rem;
	height: 2.15rem;
	min-width: 2.15rem;
	min-height: 2.15rem;
}

.rl-section-bar__label {
	flex: 0 0 auto;
	font-family: var(--rl-mono);
	font-size: 0.62rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-section-bar__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: nowrap;
	align-items: center;
	gap: 0.2rem;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
	scrollbar-width: none;
	min-width: 0;
	flex: 1 1 auto;
	-webkit-mask-image: linear-gradient(90deg, transparent, #000 0.75rem, #000 calc(100% - 0.75rem), transparent);
	mask-image: linear-gradient(90deg, transparent, #000 0.75rem, #000 calc(100% - 0.75rem), transparent);
}

.rl-section-bar__list::-webkit-scrollbar {
	display: none;
}

.rl-section-bar__list a,
.rl-section-bar__list a:link,
.rl-section-bar__list a:visited {
	display: inline-flex;
	align-items: center;
	min-height: 2rem;
	padding: 0.3rem 0.7rem;
	font-family: var(--rl-mono);
	font-size: 0.72rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--rl-muted);
	background: transparent;
	border: 1px solid transparent;
	white-space: nowrap;
	transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease;
}

.rl-section-bar__list a:hover,
.rl-section-bar__list a:focus-visible {
	color: var(--rl-ink);
	border-color: var(--rl-line-strong);
	background: color-mix(in srgb, var(--rl-ink) 5%, transparent);
}

/* Active pill — dark ink on signal in both themes (beats parent :link/:visited). */
body.recash-lab-ui .rl-section-bar__list a.is-active,
body.recash-lab-ui .rl-section-bar__list a.is-active:link,
body.recash-lab-ui .rl-section-bar__list a.is-active:visited,
body.recash-lab-ui .rl-section-bar__list a.is-active:hover,
body.recash-lab-ui .rl-section-bar__list a.is-active:focus-visible {
	color: var(--rl-signal-ink);
	background: var(--rl-signal);
	border-color: var(--rl-signal);
}

.rl-section-bar__extra a,
.rl-section-bar__extra a:link,
.rl-section-bar__extra a:visited {
	border-color: var(--rl-line);
	color: var(--rl-ink);
}

.rl-section-bar__extra a:hover,
.rl-section-bar__extra a:focus-visible {
	color: var(--rl-ink);
	border-color: var(--rl-line-strong);
	background: color-mix(in srgb, var(--rl-ink) 5%, transparent);
}

@media (max-width: 700px) {
	.rl-section-bar__label {
		display: none;
	}

	.rl-section-bar__inner {
		width: 100%;
		padding-inline: var(--rl-pad);
	}

	.rl-section-bar__list {
		min-width: 0;
		flex: 1 1 auto;
	}
}

.rl-nav__bar {
	min-height: var(--rl-nav-h);
	width: min(100% - (var(--rl-pad) * 2), var(--rl-max));
	margin-inline: auto;
	display: flex;
	align-items: center;
	gap: 1.25rem;
}

.rl-logo,
.rl-logo:link,
.rl-logo:visited {
	display: inline-flex;
	align-items: baseline;
	gap: 0.35rem;
	color: var(--rl-ink);
	text-decoration: none;
	box-shadow: none;
	outline: none;
	flex: 0 0 auto;
	line-height: 1;
	transition: color 0.2s ease;
}

/* Theme-safe hover — stay on ink tokens; no parent ice/lime link wash */
body.recash-lab-ui .rl-logo:hover,
body.recash-lab-ui .rl-logo:focus-visible,
body.recash-lab-ui .rl-logo:hover:link,
body.recash-lab-ui .rl-logo:hover:visited,
body.recash-lab-ui .rl-logo:focus-visible:link,
body.recash-lab-ui .rl-logo:focus-visible:visited {
	color: var(--rl-ink);
	text-decoration: none;
	box-shadow: none;
	opacity: 1;
	filter: none;
}

html[data-rl-theme="light"] body.recash-lab-ui .rl-logo:hover,
html[data-rl-theme="light"] body.recash-lab-ui .rl-logo:focus-visible {
	color: color-mix(in srgb, var(--rl-ink) 78%, #1f6b4a 22%);
}

html[data-rl-theme="dark"] body.recash-lab-ui .rl-logo:hover,
html[data-rl-theme="dark"] body.recash-lab-ui .rl-logo:focus-visible {
	color: color-mix(in srgb, var(--rl-ink) 86%, var(--rl-signal) 14%);
}

.rl-logo__mark {
	display: inline-flex;
	align-items: center;
	gap: 0.14rem;
	align-self: center;
	height: 1.05em;
	color: inherit;
}

.rl-logo__bar {
	display: block;
	width: 0.22rem;
	height: 1.05em;
	border-radius: 0.08rem;
	background: currentColor;
}

.rl-logo__bar.is-soft {
	opacity: 0.35;
}

.rl-logo__dot {
	display: block;
	width: 0.32rem;
	height: 0.32rem;
	margin-inline-start: 0.08rem;
	border-radius: 50%;
	background: currentColor;
	align-self: flex-start;
	margin-top: 0.12em;
}

.rl-logo__word {
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: clamp(1.55rem, 2.4vw, 1.85rem);
	letter-spacing: -0.055em;
	line-height: 0.9;
	color: inherit;
}

.rl-logo__tld {
	font-family: var(--rl-mono);
	font-size: 0.62rem;
	font-weight: 500;
	letter-spacing: 0.16em;
	opacity: 0.55;
	align-self: center;
	transform: translateY(0.08em);
	color: inherit;
	transition: opacity 0.2s ease;
}

.rl-logo:hover .rl-logo__tld,
.rl-logo:focus-visible .rl-logo__tld {
	opacity: 0.8;
}

.rl-logo--footer .rl-logo__word {
	font-size: clamp(1.7rem, 2.6vw, 2rem);
}

.rl-logo img {
	display: block;
	height: 1.7rem;
	width: auto;
}

html[data-rl-theme="dark"] .rl-logo img {
	filter: invert(1) brightness(1.05);
}

html[data-rl-theme="dark"] .rl-logo:hover img,
html[data-rl-theme="dark"] .rl-logo:focus-visible img {
	filter: invert(1) brightness(1.12);
}

.rl-nav__links {
	display: flex;
	align-items: center;
	gap: 0.15rem;
	margin-inline: auto;
}

.rl-nav__links a {
	font-family: var(--rl-mono);
	font-size: 0.72rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--rl-muted);
	padding: 0.55rem 0.75rem;
	border-bottom: 2px solid transparent;
	transition: color 0.2s ease, border-color 0.2s ease;
}

.rl-nav__links a:hover,
.rl-nav__links a:focus-visible {
	color: var(--rl-ink);
	border-bottom-color: var(--rl-signal);
}

.rl-nav__tools {
	display: flex;
	align-items: center;
	gap: 0.35rem;
	margin-inline-start: auto;
}

.rl-tool {
	position: relative;
	display: inline-grid;
	place-items: center;
	width: 2.4rem;
	height: 2.4rem;
	min-width: 2.4rem;
	min-height: 2.4rem;
	padding: 0;
	border: 1px solid var(--rl-line);
	background: transparent;
	color: var(--rl-ink);
	cursor: pointer;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	line-height: 0;
	flex: 0 0 auto;
}

/* Stack icon layers in one cell so sun/moon + sr-text don't shift centering */
.rl-tool > * {
	grid-area: 1 / 1;
	justify-self: center;
	align-self: center;
}

.rl-tool:hover,
.rl-tool:focus-visible {
	border-color: var(--rl-ink);
}

.rl-tool__label {
	display: none;
}

.rl-tool__icon {
	display: grid;
	place-items: center;
	width: 18px;
	height: 18px;
	line-height: 0;
	pointer-events: none;
}

.rl-tool__icon svg,
.rl-tool > svg {
	display: block;
	width: 18px;
	height: 18px;
	margin: 0;
}

.rl-tool__icon--moon {
	display: none;
}

html[data-rl-theme="dark"] .rl-tool__icon--sun {
	display: none;
}

html[data-rl-theme="dark"] .rl-tool__icon--moon {
	display: grid;
}

.rl-nav__burger {
	display: none;
	width: 2.4rem;
	height: 2.4rem;
	border: 1px solid var(--rl-line);
	background: transparent;
	padding: 0;
	cursor: pointer;
}

.rl-nav__burger span {
	display: block;
	width: 1rem;
	height: 1.5px;
	margin: 0.28rem auto;
	background: var(--rl-ink);
}

.rl-nav__drawer {
	display: grid;
	gap: 0.25rem;
	padding: 0.5rem var(--rl-pad) 1rem;
	border-top: 1px solid var(--rl-line);
	background: var(--rl-nav-bg);
}

.rl-nav__drawer[hidden] {
	display: none !important;
}

.rl-nav__drawer a {
	font-family: var(--rl-mono);
	font-size: 0.85rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--rl-ink);
	padding: 0.75rem 0;
	border-bottom: 1px solid var(--rl-line);
}

.rl-nav__topics {
	margin: 0.75rem 0 0;
	font-family: var(--rl-mono);
	font-size: 0.7rem;
	color: var(--rl-muted);
	line-height: 1.5;
}

.rl-nav__topics span {
	display: block;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	margin-bottom: 0.25rem;
}

.rl-search {
	border-top: 1px solid var(--rl-line);
	padding: 0.75rem var(--rl-pad) 1rem;
	background: var(--rl-nav-bg);
}

.rl-search[hidden] {
	display: none !important;
}

.rl-search form {
	width: min(100%, var(--rl-max));
	margin-inline: auto;
	display: flex;
	gap: 0.5rem;
}

.rl-search input {
	flex: 1;
	min-height: 2.6rem;
	border: 1px solid var(--rl-line-strong);
	background: var(--rl-panel);
	color: var(--rl-ink);
	padding: 0 0.85rem;
	font-family: var(--rl-display);
}

.rl-search button {
	border: 0;
	background: var(--rl-ink);
	color: var(--rl-canvas);
	padding: 0 1rem;
	font-family: var(--rl-mono);
	font-size: 0.75rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	cursor: pointer;
}

html[data-rl-theme="dark"] .rl-search button {
	background: var(--rl-signal);
	color: var(--rl-signal-ink);
}

/* ========== LAYOUT ========== */
.rl-shell {
	position: relative;
	overflow: clip;
	padding-bottom: 2rem;
	background: transparent;
}

/* Article reading layout needs overflow visible so the rail can stick */
.rl-shell.rl-article,
body.recash-lab-ui .rl-shell.rl-article {
	overflow: visible !important;
}

.rl-wrap {
	width: min(100% - (var(--rl-pad) * 2), var(--rl-max));
	margin-inline: auto;
}

.rl-wrap--narrow {
	width: 100%;
}

.rl-meta {
	font-family: var(--rl-mono);
	font-size: 0.72rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--rl-muted);
	margin: 0 0 1rem;
}

/* ========== HERO ========== */
.rl-hero {
	position: relative;
	isolation: isolate;
	min-height: calc(100svh - var(--rl-nav-h));
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: calc(var(--rl-pad) + 1rem) var(--rl-pad) var(--rl-pad);
	overflow: hidden;
	/* Always dark stage; dark theme canvas matches so no scroll seam */
	background: #0b0d10;
	color: var(--rl-hero-fg);
}

.rl-hero__visual {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.rl-hero__stage,
.rl-hero__canvas {
	pointer-events: auto;
}

.rl-hero__grain,
.rl-hero__veil {
	pointer-events: none;
}

.rl-hero__canvas {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	z-index: 1;
}

.rl-hero__tip {
	position: absolute;
	z-index: 5;
	top: 0;
	inset-inline-start: 0;
	pointer-events: none;
	min-width: 12rem;
	max-width: 18rem;
	padding: 0.65rem 0.8rem;
	background: rgba(11, 13, 16, 0.88);
	border: 1px solid rgba(212, 255, 79, 0.35);
	color: #f4f6f8;
	backdrop-filter: blur(8px);
}

.rl-hero__tip[hidden] {
	display: none !important;
}

.rl-hero__tip strong {
	display: block;
	font-family: var(--rl-display);
	font-size: 0.95rem;
	letter-spacing: -0.02em;
	margin-bottom: 0.2rem;
}

.rl-hero__tip span {
	display: block;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	line-height: 1.4;
	color: rgba(244, 246, 248, 0.72);
}

.rl-hero__tip em {
	display: inline-block;
	margin-top: 0.45rem;
	font-style: normal;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.04em;
	color: var(--rl-signal-ink);
	background: var(--rl-signal);
	padding: 0.2rem 0.45rem;
}

.rl-hero__tip.is-product {
	border-color: rgba(212, 255, 79, 0.65);
}

/* View-only product demo: outer size = screen layout; iframe renders at 1920×1080 then scales down */
.rl-demo-preview {
	--rl-demo-w: min(22rem, 42vw);
	--rl-demo-h: calc(var(--rl-demo-w) * 9 / 16);
	position: absolute;
	z-index: 6;
	top: 0;
	inset-inline-start: 0;
	pointer-events: none;
	width: var(--rl-demo-w);
	padding: 0.55rem;
	background: rgba(11, 13, 16, 0.92);
	border: 1px solid rgba(212, 255, 79, 0.4);
	backdrop-filter: blur(10px);
	box-shadow: 0 18px 40px rgba(0, 0, 0, 0.45);
	transition: opacity 0.2s var(--rl-ease), transform 0.2s var(--rl-ease);
}

.rl-demo-preview[hidden] {
	display: none !important;
}

.rl-demo-preview__chrome {
	display: flex;
	align-items: center;
	gap: 0.45rem;
	margin-bottom: 0.45rem;
	min-width: 0;
}

.rl-demo-preview__dot {
	width: 0.45rem;
	height: 0.45rem;
	border-radius: 50%;
	background: var(--rl-signal);
	flex: 0 0 auto;
	box-shadow: 0 0 0 3px rgba(212, 255, 79, 0.18);
}

.rl-demo-preview__title {
	font-family: var(--rl-display);
	font-size: 0.82rem;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: #f4f6f8;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	min-width: 0;
	flex: 1 1 auto;
}

.rl-demo-preview__badge {
	font-family: var(--rl-mono);
	font-size: 0.58rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--rl-signal-ink);
	background: var(--rl-signal);
	padding: 0.18rem 0.4rem;
	flex: 0 0 auto;
	text-decoration: none;
	border: 0;
	cursor: pointer;
}

a.rl-demo-preview__badge[aria-disabled="true"] {
	pointer-events: none;
	opacity: 0.72;
	cursor: default;
}

.rl-demo-preview__viewport {
	position: relative;
	width: 100%;
	height: var(--rl-demo-h);
	overflow: hidden;
	border: 1px solid rgba(244, 246, 248, 0.12);
	background:
		linear-gradient(135deg, rgba(18, 24, 32, 0.95), rgba(11, 13, 16, 0.98)),
		repeating-linear-gradient(
			-45deg,
			transparent,
			transparent 6px,
			rgba(244, 246, 248, 0.03) 6px,
			rgba(244, 246, 248, 0.03) 12px
		);
}

.rl-demo-preview__frame {
	position: absolute;
	top: 0;
	inset-inline-start: 0;
	width: 1920px;
	height: 1080px;
	border: 0;
	pointer-events: none;
	transform: scale(calc(var(--rl-demo-w) / 1920px));
	transform-origin: top left;
	background: #fff;
}

[dir="rtl"] .rl-demo-preview__frame {
	transform-origin: top right;
}

.rl-demo-preview__note {
	margin: 0.4rem 0 0;
	font-family: var(--rl-mono);
	font-size: 0.58rem;
	letter-spacing: 0.04em;
	color: rgba(244, 246, 248, 0.55);
}

.rl-hero__legend {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.55rem 0.75rem;
	margin: 0.35rem 0 0;
	font-family: var(--rl-mono);
	font-size: 0.72rem;
	letter-spacing: 0.04em;
	color: rgba(244, 246, 248, 0.62);
}

.rl-hero__legend-key {
	display: inline-flex;
	align-items: center;
	padding: 0.28rem 0.5rem;
	border: 1px solid rgba(212, 255, 79, 0.45);
	color: var(--rl-signal);
	letter-spacing: 0.12em;
	text-transform: uppercase;
	font-size: 0.62rem;
}

.rl-hero__legend-rich {
	display: none;
}

.rl-hero[data-rl-graph-mode="rich"] .rl-hero__legend-lite {
	display: none;
}

.rl-hero[data-rl-graph-mode="rich"] .rl-hero__legend-rich {
	display: inline;
}

/* Desktop: SVG placeholder softens while WebGL constellation lazy-loads */
@media (min-width: 901px) {
	.rl-hero.is-graph-loading .rl-graph-fallback {
		opacity: 0.55;
		transition: opacity 0.45s ease;
	}

	.rl-hero[data-rl-graph-mode="rich"]:not(.is-graph-loading) .rl-graph-fallback[hidden] {
		display: none !important;
	}
}

.rl-hero__stage {
	position: absolute;
	inset: 0;
	z-index: 1;
}

.rl-hero__stage[hidden] {
	display: none !important;
}

.rl-graph-fallback {
	position: absolute;
	inset: 8% 4% 12%;
	z-index: 1;
	color: rgba(244, 246, 248, 0.85);
	display: grid;
	align-content: center;
	justify-items: center;
	gap: 0.75rem;
}

.rl-graph-fallback[hidden] {
	display: none !important;
}

.rl-graph-fallback__label {
	margin: 0;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: rgba(212, 255, 79, 0.75);
}

.rl-graph-fallback__svg,
.rl-graph-fallback svg {
	width: min(100%, 720px);
	height: auto;
	overflow: visible;
}

.rl-graph-fallback__node rect {
	fill: rgba(18, 24, 32, 0.92);
	stroke: rgba(143, 217, 255, 0.45);
	stroke-width: 1.5;
}

.rl-graph-fallback__node.is-hub rect {
	stroke: rgba(212, 255, 79, 0.7);
}

.rl-graph-fallback__node.is-product {
	cursor: pointer;
}

.rl-graph-fallback__node.is-product rect {
	stroke: rgba(212, 255, 79, 0.75);
}

.rl-graph-fallback__node.is-project {
	cursor: pointer;
}

.rl-graph-fallback__node.is-project rect {
	stroke: rgba(212, 255, 79, 0.55);
}

.rl-graph-fallback__node.is-product:hover rect,
.rl-graph-fallback__node.is-product:focus-visible rect,
.rl-graph-fallback__node.is-project:hover rect,
.rl-graph-fallback__node.is-project:focus-visible rect {
	fill: rgba(28, 36, 44, 0.98);
	stroke: #d4ff4f;
}

.rl-graph-fallback__node text {
	fill: #f4f6f8;
	font-family: var(--rl-display);
	font-size: 15px;
	font-weight: 700;
}

.rl-graph-fallback__sub {
	font-family: var(--rl-mono) !important;
	font-size: 10px !important;
	font-weight: 500 !important;
	fill: #d4ff4f !important;
}

.rl-graph-fallback__node.is-rail text {
	font-size: 12px;
	font-weight: 600;
	fill: rgba(244, 246, 248, 0.7);
}

/* Mobile product map — large touch targets, crawlable links */
.rl-hero__products {
	display: grid;
	grid-template-columns: 1fr;
	gap: 0.55rem;
	margin: 0 0 1.15rem;
}

.rl-hero__product {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	min-height: 3.25rem;
	padding: 0.7rem 0.85rem;
	text-decoration: none;
	color: #f4f6f8;
	background: rgba(18, 24, 32, 0.72);
	border: 1px solid rgba(244, 246, 248, 0.14);
	-webkit-tap-highlight-color: transparent;
	touch-action: manipulation;
}

.rl-hero__product.is-live {
	border-color: rgba(212, 255, 79, 0.45);
}

.rl-hero__product.is-spine {
	border-color: rgba(212, 255, 79, 0.32);
}

.rl-hero__product.is-note {
	border-style: dashed;
	border-color: rgba(143, 217, 255, 0.4);
}

.rl-hero__product.is-rail {
	opacity: 0.78;
}

.rl-hero__product.is-note .rl-hero__product-mark {
	background: rgba(143, 217, 255, 0.9);
	color: #0b0d10;
}

a.rl-hero__product:hover,
a.rl-hero__product:focus-visible {
	border-color: var(--rl-signal);
	background: rgba(28, 36, 44, 0.92);
}

.rl-hero__product-mark {
	display: grid;
	place-items: center;
	width: 2rem;
	height: 2rem;
	flex: 0 0 auto;
	border-radius: 50%;
	background: var(--rl-signal);
	color: var(--rl-signal-ink);
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: 0.85rem;
}

.rl-hero__product.is-rail .rl-hero__product-mark {
	background: rgba(244, 246, 248, 0.16);
	color: #f4f6f8;
}

.rl-hero__product-copy {
	display: flex;
	flex-direction: column;
	gap: 0.12rem;
	min-width: 0;
}

.rl-hero__product-copy strong {
	font-family: var(--rl-display);
	font-size: 0.95rem;
	font-weight: 700;
	letter-spacing: -0.02em;
}

.rl-hero__product-copy em {
	font-style: normal;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	color: rgba(244, 246, 248, 0.62);
}

.rl-index__item.is-graph-hot .rl-index__link {
	/* Keep page canvas unified — accent only, no tinted row slab */
	background: transparent;
	padding-inline: 0.85rem;
	border-inline-start: 3px solid var(--rl-signal);
}

.rl-hero__grain {
	position: absolute;
	inset: 0;
	opacity: 0.2;
	mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.55'/%3E%3C/svg%3E");
}

.rl-hero__veil {
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background:
		linear-gradient(105deg, rgba(11, 13, 16, 0.88) 0%, rgba(11, 13, 16, 0.35) 42%, rgba(11, 13, 16, 0.55) 100%),
		radial-gradient(700px 320px at 72% 35%, rgba(212, 255, 79, 0.12), transparent 62%);
}

.rl-hero__grain {
	z-index: 2;
}

/* Above hero canvas/bg, under copy / CTAs / scroll */
.rl-hero__fade {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1;
	height: clamp(2.25rem, 6vh, 3.75rem);
	opacity: 0.5;
	pointer-events: none;
	background: linear-gradient(
		180deg,
		rgba(11, 13, 16, 0) 0%,
		rgba(11, 13, 16, 0.28) 55%,
		#0b0d10 100%
	);
}

html[data-rl-theme="light"] .rl-hero__fade {
	background: linear-gradient(
		180deg,
		rgba(255, 255, 255, 0) 0%,
		color-mix(in srgb, var(--rl-canvas) 40%, transparent) 55%,
		var(--rl-canvas) 100%
	);
}

html[data-rl-theme="dark"] .rl-hero__fade {
	background: linear-gradient(
		180deg,
		rgba(11, 13, 16, 0) 0%,
		color-mix(in srgb, var(--rl-canvas) 45%, transparent) 55%,
		var(--rl-canvas) 100%
	);
}

.rl-hero__content {
	position: relative;
	z-index: 3;
	width: min(100%, 40rem);
}

.rl-hero__brand {
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: clamp(3.4rem, 16vw, 8.5rem);
	line-height: 0.84;
	letter-spacing: -0.055em;
	margin: 0 0 0.85rem;
	overflow: hidden;
	color: var(--rl-hero-fg);
}

.rl-hero__brand span {
	display: inline-block;
	color: inherit;
}

.rl-hero .rl-meta {
	color: rgba(244, 246, 248, 0.62);
}

.rl-hero__value {
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: clamp(1.35rem, 3.6vw, 1.85rem);
	line-height: 1.28;
	letter-spacing: -0.035em;
	max-width: 22ch;
	margin: 0 0 1.5rem;
	color: rgba(244, 246, 248, 0.94);
	text-wrap: balance;
}

.rl-hero__cta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.65rem;
	margin-bottom: 1.15rem;
}

.rl-hero__focus {
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
	margin: 0;
	padding: 0;
}

.rl-hero__focus li {
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.04em;
	padding: 0.35rem 0.55rem;
	border: 1px solid rgba(244, 246, 248, 0.22);
	color: rgba(244, 246, 248, 0.78);
}

.rl-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.55rem;
	min-height: 3rem;
	padding: 0.7rem 1.2rem;
	font-family: var(--rl-mono);
	font-size: 0.78rem;
	letter-spacing: 0.04em;
	text-decoration: none;
	border: 1px solid var(--rl-line-strong);
	background: var(--rl-lift);
	color: var(--rl-ink);
	transition: transform 0.25s var(--rl-ease), background 0.25s ease, color 0.25s ease, border-color 0.25s ease;
	touch-action: manipulation;
}

.rl-btn:hover {
	transform: translateY(-2px);
	border-color: var(--rl-ink);
}

.rl-btn--signal {
	background: var(--rl-signal);
	color: var(--rl-signal-ink);
	border-color: var(--rl-signal);
}

.rl-btn--signal:hover,
.rl-btn--signal:focus-visible {
	color: var(--rl-signal-ink);
	background: var(--rl-signal);
	border-color: var(--rl-signal);
}

.rl-btn--line,
.rl-btn--line:link,
.rl-btn--line:visited {
	background: transparent;
	color: var(--rl-ink);
	border-color: var(--rl-line-strong);
}

.rl-btn--line:hover,
.rl-btn--line:focus-visible {
	background: color-mix(in srgb, var(--rl-ink) 6%, transparent);
	border-color: var(--rl-ink);
	color: var(--rl-ink);
}

.rl-hero a.rl-btn--line,
.rl-hero a.rl-btn--line:link,
.rl-hero a.rl-btn--line:visited,
.rl-hero a.rl-btn--line:hover,
.rl-hero a.rl-btn--line:focus,
.rl-hero a.rl-btn--line:focus-visible,
.rl-hero a.rl-btn--line:active {
	background: rgba(244, 246, 248, 0.06);
	color: #f4f6f8;
	border-color: rgba(244, 246, 248, 0.42);
}

.rl-hero a.rl-btn--line:hover,
.rl-hero a.rl-btn--line:focus-visible {
	background: rgba(244, 246, 248, 0.16);
	color: #f4f6f8;
	border-color: rgba(244, 246, 248, 0.72);
}

.rl-hero a.rl-btn--signal {
	background: var(--rl-signal);
	color: var(--rl-signal-ink);
	border-color: var(--rl-signal);
}

.rl-hero__scroll,
.rl-hero__scroll:link,
.rl-hero__scroll:visited {
	position: absolute;
	inset-inline-end: var(--rl-pad);
	bottom: var(--rl-pad);
	z-index: 3;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.65rem;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	text-decoration: none;
	/* Hero stage is always dark — keep light label in both themes */
	color: rgba(244, 246, 248, 0.62);
}

.rl-hero__scroll:hover,
.rl-hero__scroll:focus-visible {
	color: rgba(244, 246, 248, 0.92);
}

/* Beat theme/link tokens that would paint dark ink on the dark hero */
body.recash-lab-ui .rl-hero__scroll,
body.recash-lab-ui .rl-hero__scroll:link,
body.recash-lab-ui .rl-hero__scroll:visited,
html[data-rl-theme="light"] body.recash-lab-ui .rl-hero__scroll,
html[data-rl-theme="light"] body.recash-lab-ui .rl-hero__scroll:link,
html[data-rl-theme="light"] body.recash-lab-ui .rl-hero__scroll:visited,
html[data-rl-theme="dark"] body.recash-lab-ui .rl-hero__scroll,
html[data-rl-theme="dark"] body.recash-lab-ui .rl-hero__scroll:link,
html[data-rl-theme="dark"] body.recash-lab-ui .rl-hero__scroll:visited {
	color: rgba(244, 246, 248, 0.68);
}

body.recash-lab-ui .rl-hero__scroll:hover,
body.recash-lab-ui .rl-hero__scroll:focus-visible,
html[data-rl-theme="light"] body.recash-lab-ui .rl-hero__scroll:hover,
html[data-rl-theme="light"] body.recash-lab-ui .rl-hero__scroll:focus-visible,
html[data-rl-theme="dark"] body.recash-lab-ui .rl-hero__scroll:hover,
html[data-rl-theme="dark"] body.recash-lab-ui .rl-hero__scroll:focus-visible {
	color: rgba(244, 246, 248, 0.95);
}

.rl-hero__scroll-line {
	width: 1px;
	height: 3.5rem;
	background: linear-gradient(to bottom, var(--rl-signal), transparent);
	transform-origin: top;
}

/* ========== SECTIONS ========== */
.rl-section {
	padding: clamp(3.5rem, 8vw, 6.5rem) 0;
}

.rl-section__head {
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	gap: 2rem;
	margin-bottom: 2.25rem;
	padding-bottom: 1.25rem;
	border-bottom: 1px solid var(--rl-line-strong);
}

.rl-section__head--stack {
	flex-direction: column;
	align-items: flex-start;
	border-bottom-color: var(--rl-line);
}

.rl-section__title {
	font-weight: 700;
	font-size: clamp(2rem, 4.5vw, 3.25rem);
	letter-spacing: -0.04em;
	line-height: 1;
	margin: 0 0 0.65rem;
	color: var(--rl-ink);
}

.rl-section__lede,
.rl-section__empty {
	margin: 0;
	max-width: 36rem;
	color: var(--rl-muted);
	font-size: 1.02rem;
	line-height: 1.5;
}

.rl-section__more {
	margin: 1.75rem 0 0;
	font-family: var(--rl-mono);
	font-size: 0.78rem;
	letter-spacing: 0.04em;
	display: flex;
	align-items: center;
	gap: 0.75rem;
}

body.recash-lab-ui .rl-section__more a {
	color: var(--rl-link);
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}

body.recash-lab-ui .rl-section__more a:hover,
body.recash-lab-ui .rl-section__more a:focus-visible {
	color: var(--rl-link-hover);
}

.rl-dot {
	width: 3px;
	height: 3px;
	border-radius: 50%;
	background: var(--rl-muted);
}

.rl-pin {
	margin: 0;
	padding: 0.9rem 1rem;
	background: transparent;
	color: var(--rl-ink);
	border: 1px solid var(--rl-line-strong);
	display: grid;
	gap: 0.35rem;
	min-width: min(100%, 16rem);
}

.rl-pin__label {
	font-family: var(--rl-mono);
	font-size: 0.65rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--rl-muted);
	opacity: 1;
}

/* Beat parent theme link colors — high contrast in both themes */
body.recash-lab-ui .rl-pin__link,
body.recash-lab-ui .rl-pin a.rl-pin__link {
	color: var(--rl-link);
	font-weight: 700;
	font-size: 1.05rem;
	text-decoration: none;
	letter-spacing: -0.02em;
}

body.recash-lab-ui .rl-pin__link:hover,
body.recash-lab-ui .rl-pin__link:focus-visible,
body.recash-lab-ui .rl-pin a.rl-pin__link:hover,
body.recash-lab-ui .rl-pin a.rl-pin__link:focus-visible {
	color: var(--rl-link-hover);
	text-decoration: underline;
	text-underline-offset: 0.18em;
}

.rl-status {
	display: inline-flex;
	align-items: center;
	font-family: var(--rl-mono);
	font-size: 0.62rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	padding: 0.28rem 0.45rem;
	border: 1px solid currentColor;
	white-space: nowrap;
}

.rl-status--active {
	color: var(--rl-signal-ink);
	background: var(--rl-signal);
	border-color: var(--rl-signal);
}

/* Filled badge — dark ink on signal, readable on light + dark */
body.recash-lab-ui .rl-pin .rl-status--active {
	color: var(--rl-signal-ink);
	background: var(--rl-signal);
	border-color: var(--rl-signal);
}

.rl-status--in-development {
	color: var(--rl-dev);
}

.rl-status--completed {
	color: var(--rl-done);
}

.rl-status--archived {
	color: var(--rl-archive);
}

/* Work index */
.rl-index {
	list-style: none;
	margin: 0;
	padding: 0;
}

.rl-index__item {
	border-bottom: 1px solid var(--rl-line);
}

.rl-index__item:first-child {
	border-top: 1px solid var(--rl-line);
}

.rl-index__link {
	display: grid;
	grid-template-columns: 3rem 5.5rem 1fr auto;
	gap: 1rem 1.1rem;
	align-items: center;
	padding: 1.2rem 0.35rem;
	text-decoration: none;
	color: inherit;
	transition: background 0.25s ease, padding 0.25s var(--rl-ease);
}

.rl-index__link:hover {
	background: color-mix(in srgb, var(--rl-ink) 5%, transparent);
	padding-inline: 0.85rem;
}

.rl-index__num {
	font-family: var(--rl-mono);
	font-size: 0.78rem;
	color: var(--rl-muted);
}

.rl-index__media {
	width: 5.5rem;
	height: 3.6rem;
	background-size: cover;
	background-position: center;
	border: 1px solid var(--rl-line);
}

.rl-index__main {
	display: grid;
	gap: 0.45rem;
	min-width: 0;
}

.rl-index__title-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.65rem 0.85rem;
}

.rl-index__title {
	font-weight: 700;
	font-size: clamp(1.3rem, 2.5vw, 1.8rem);
	letter-spacing: -0.03em;
	line-height: 1.1;
	color: var(--rl-ink);
}

.rl-index__value {
	color: var(--rl-muted);
	font-size: 0.98rem;
	line-height: 1.45;
	max-width: 52ch;
}

.rl-tags {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.rl-tags span {
	font-family: var(--rl-mono);
	font-size: 0.66rem;
	color: var(--rl-ink-2);
	padding: 0.2rem 0.4rem;
	background: color-mix(in srgb, var(--rl-ink) 8%, transparent);
}

.rl-index__go {
	width: 2.5rem;
	height: 2.5rem;
	display: grid;
	place-items: center;
	border: 1px solid var(--rl-line-strong);
	background: transparent;
	color: var(--rl-ink);
	transition: background 0.25s ease, border-color 0.25s ease, transform 0.25s var(--rl-ease), color 0.25s ease;
}

.rl-index__link:hover .rl-index__go,
.rl-index__item.is-graph-hot .rl-index__go {
	/* Signal fill + dark icon — never pale yellow on white */
	background: var(--rl-signal);
	border-color: var(--rl-signal);
	color: var(--rl-signal-ink);
	transform: translateX(3px);
}

html[dir="rtl"] .rl-index__link:hover .rl-index__go {
	transform: translateX(-3px);
}

html[dir="rtl"] .rl-index__go svg,
html[dir="rtl"] .rl-btn svg {
	transform: scaleX(-1);
}

/* Split */
.rl-split {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0;
	width: min(100% - (var(--rl-pad) * 2), var(--rl-max));
	margin: 0 auto 4rem;
	border: 1px solid var(--rl-line-strong);
	background: var(--rl-panel);
	backdrop-filter: blur(10px);
}

.rl-split .rl-section {
	padding: clamp(2rem, 4vw, 3rem);
	margin: 0;
}

.rl-split .rl-research {
	border-inline-end: 1px solid var(--rl-line);
}

.rl-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.rl-list li + li {
	border-top: 1px solid var(--rl-line);
}

body.recash-lab-ui .rl-list a {
	display: flex;
	justify-content: space-between;
	gap: 1rem;
	padding: 0.95rem 0;
	text-decoration: none;
	color: var(--rl-link);
}

.rl-list a span {
	font-weight: 600;
	letter-spacing: -0.02em;
	line-height: 1.25;
	color: inherit;
}

body.recash-lab-ui .rl-list a:hover,
body.recash-lab-ui .rl-list a:hover span {
	color: var(--rl-link-hover);
}

.rl-list time {
	font-family: var(--rl-mono);
	font-size: 0.72rem;
	color: var(--rl-muted);
	white-space: nowrap;
}

.rl-list--boxed {
	border: 1px solid var(--rl-line-strong);
	background: var(--rl-panel);
}

.rl-list--boxed li + li {
	border-top-color: var(--rl-line);
}

.rl-list--boxed a {
	padding: 1.05rem 1.25rem;
}

/* Artifacts showcase */
.rl-artifacts__grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 0.85rem;
}

.rl-artifact {
	display: grid;
	grid-template-rows: 1fr auto;
	min-width: 0;
	border: 1px solid var(--rl-line-strong);
	background: var(--rl-panel);
	transition: border-color 0.2s ease, transform 0.25s var(--rl-ease);
}

.rl-artifact:hover {
	border-color: color-mix(in srgb, var(--rl-signal) 50%, var(--rl-line-strong));
	transform: translateY(-3px);
}

.rl-artifact__link {
	display: grid;
	grid-template-rows: auto 1fr;
	height: 100%;
	text-decoration: none;
	color: inherit;
	min-width: 0;
}

.rl-artifact__media {
	position: relative;
	display: block;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: #151b22;
	border-bottom: 1px solid var(--rl-line);
}

.rl-artifact__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	transition: transform 0.35s var(--rl-ease);
}

.rl-artifact:hover .rl-artifact__media img {
	transform: scale(1.04);
}

.rl-artifact__media--empty {
	background:
		linear-gradient(135deg, color-mix(in srgb, var(--rl-dev) 22%, transparent), transparent 55%),
		linear-gradient(225deg, color-mix(in srgb, var(--rl-signal) 14%, transparent), transparent 50%),
		#151b22;
}

.rl-artifact__index {
	position: absolute;
	inset-inline-start: 0.65rem;
	bottom: 0.65rem;
	z-index: 1;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.08em;
	padding: 0.28rem 0.45rem;
	background: rgba(11, 13, 16, 0.78);
	color: #f4f6f8;
	border: 1px solid rgba(244, 246, 248, 0.18);
}

.rl-artifact__body {
	display: grid;
	align-content: start;
	gap: 0.4rem;
	padding: 0.9rem 0.95rem 1.05rem;
	min-width: 0;
}

.rl-artifact__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem 0.7rem;
	font-family: var(--rl-mono);
	font-size: 0.66rem;
	letter-spacing: 0.05em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-artifact__title {
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: 1.05rem;
	letter-spacing: -0.025em;
	line-height: 1.25;
	color: var(--rl-ink);
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.rl-artifact__excerpt {
	font-size: 0.9rem;
	line-height: 1.45;
	color: var(--rl-muted);
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.rl-artifact__project {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 0.75rem;
	padding: 0.65rem 0.95rem;
	border-top: 1px solid var(--rl-line);
	text-decoration: none;
	background: color-mix(in srgb, var(--rl-ink) 3%, var(--rl-panel));
}

.rl-artifact__project-label {
	font-family: var(--rl-mono);
	font-size: 0.62rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-artifact__project-name {
	font-size: 0.86rem;
	font-weight: 600;
	letter-spacing: -0.02em;
	color: var(--rl-ink);
	text-align: end;
}

.rl-artifact__project:hover .rl-artifact__project-name {
	color: var(--rl-link-hover);
}

.rl-project .rl-artifacts {
	padding: 0;
	width: 100%;
	max-width: none;
	margin: 0 0 2.25rem;
}

.rl-project .rl-artifacts .rl-wrap {
	width: 100%;
	max-width: none;
	margin: 0;
}

.rl-project .rl-artifacts .rl-section__head {
	margin-bottom: 1.35rem;
	max-width: 40rem;
}

.rl-project .rl-artifacts .rl-section__title {
	font-size: clamp(1.45rem, 2.8vw, 1.95rem);
}

.rl-project .rl-artifacts__grid {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

@media (max-width: 700px) {
	.rl-project .rl-artifacts__grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 960px) {
	.rl-artifacts__grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 640px) {
	.rl-artifacts__grid {
		grid-template-columns: 1fr;
	}
}

/* Topic-grouped articles */
.rl-research .rl-filters--topics {
	margin: 0 0 1.75rem;
}

.rl-filter.is-empty,
span.rl-filter {
	opacity: 0.45;
	cursor: default;
}

span.rl-filter {
	pointer-events: none;
}

.rl-topic-groups {
	display: grid;
	gap: 2.25rem;
}

.rl-topic__head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	margin-bottom: 0.85rem;
	padding-bottom: 0.55rem;
	border-bottom: 1px solid var(--rl-line);
}

.rl-topic__head-actions {
	display: flex;
	align-items: center;
	gap: 0.75rem;
	flex-wrap: wrap;
	justify-content: flex-end;
}

.rl-topic__title {
	margin: 0;
	font-family: var(--rl-display);
	font-size: 1.15rem;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--rl-ink);
}

.rl-topic__more {
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--rl-muted);
	white-space: nowrap;
}

.rl-topic__more:hover {
	color: var(--rl-dev);
}

/* Horizontal article rails — hidden scrollbar + overflow cues */
.rl-posts-rail {
	position: relative;
	isolation: isolate;
}

.rl-posts-rail::before,
.rl-posts-rail::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 1.85rem;
	width: clamp(1.5rem, 5vw, 2.75rem);
	z-index: 2;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.25s ease;
}

.rl-posts-rail::before {
	left: 0;
	background: linear-gradient(90deg, var(--rl-canvas) 0%, transparent 100%);
}

.rl-posts-rail::after {
	right: 0;
	background: linear-gradient(270deg, var(--rl-canvas) 0%, transparent 100%);
}

.rl-posts-rail.can-start::before,
.rl-posts-rail.can-end::after {
	opacity: 1;
}

.rl-posts {
	list-style: none;
	margin: 0;
	padding: 0.15rem 0 0.35rem;
	display: flex;
	gap: 0.9rem;
	overflow-x: auto;
	overflow-y: hidden;
	scroll-snap-type: x mandatory;
	scroll-padding-inline: 0.15rem;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior-x: contain;
	scrollbar-width: none;
	-ms-overflow-style: none;
	outline: none;
}

.rl-posts::-webkit-scrollbar {
	display: none;
	width: 0;
	height: 0;
}

.rl-posts:focus-visible {
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--rl-signal) 55%, transparent);
}

.rl-posts__item {
	flex: 0 0 min(18.5rem, 78vw);
	scroll-snap-align: start;
	min-width: 0;
}

.rl-posts-rail__nav {
	position: absolute;
	top: calc(50% - 1.1rem);
	z-index: 3;
	display: grid;
	place-items: center;
	width: 2.35rem;
	height: 2.35rem;
	padding: 0;
	border: 1px solid var(--rl-line-strong);
	border-radius: 0;
	background: color-mix(in srgb, var(--rl-panel) 92%, transparent);
	color: var(--rl-ink);
	cursor: pointer;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translateY(-50%);
	transition: opacity 0.2s ease, background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);
	touch-action: manipulation;
}

.rl-posts-rail__nav--prev {
	left: 0.35rem;
}

.rl-posts-rail__nav--next {
	right: 0.35rem;
}

.rl-posts-rail.is-overflow .rl-posts-rail__nav {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}

.rl-posts-rail.is-overflow:not(.can-start) .rl-posts-rail__nav--prev,
.rl-posts-rail.is-overflow:not(.can-end) .rl-posts-rail__nav--next {
	opacity: 0.28;
	pointer-events: none;
}

.rl-posts-rail__nav:hover,
.rl-posts-rail__nav:focus-visible {
	background: var(--rl-lift);
	border-color: var(--rl-ink);
	outline: none;
}

.rl-posts-rail__nav:focus-visible {
	box-shadow: 0 0 0 2px color-mix(in srgb, var(--rl-signal) 50%, transparent);
}

.rl-posts-rail__hint {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	margin: 0.55rem 0 0;
	font-family: var(--rl-mono);
	font-size: 0.64rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-posts-rail__hint[hidden] {
	display: none !important;
}

.rl-posts-rail__hint-ico {
	display: grid;
	place-items: center;
	color: var(--rl-ink);
	opacity: 0.55;
}

html[data-rl-theme="dark"] .rl-posts-rail__nav {
	background: color-mix(in srgb, var(--rl-panel) 88%, transparent);
	border-color: rgba(244, 246, 248, 0.18);
	color: #f4f6f8;
}

html[data-rl-theme="dark"] .rl-posts-rail__nav:hover,
html[data-rl-theme="dark"] .rl-posts-rail__nav:focus-visible {
	background: var(--rl-lift);
	border-color: rgba(244, 246, 248, 0.45);
}

@media (hover: none) and (pointer: coarse) {
	/* Touch: rely on edge fades + hint; keep chevrons subtler */
	.rl-posts-rail.is-overflow .rl-posts-rail__nav {
		opacity: 0.72;
	}
}

@media (prefers-reduced-motion: reduce) {
	.rl-posts {
		scroll-behavior: auto;
	}

	.rl-posts-rail::before,
	.rl-posts-rail::after,
	.rl-posts-rail__nav {
		transition: none;
	}
}

.rl-posts__link {
	display: flex;
	flex-direction: column;
	height: 100%;
	padding: 0;
	text-decoration: none;
	color: inherit;
	border: 1px solid var(--rl-line);
	background: var(--rl-panel);
	overflow: hidden;
	transition: border-color 0.2s ease, transform 0.2s var(--rl-ease);
}

.rl-posts__link:hover {
	border-color: color-mix(in srgb, var(--rl-signal) 55%, var(--rl-line));
	transform: translateY(-2px);
}

.rl-posts__media {
	display: block;
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: #1a222c;
	border-bottom: 1px solid var(--rl-line);
}

.rl-posts__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
}

.rl-posts__media--empty {
	background:
		linear-gradient(135deg, rgba(212, 255, 79, 0.16), transparent 55%),
		#151b22;
}

.rl-posts__body {
	display: grid;
	align-content: start;
	gap: 0.35rem;
	min-width: 0;
	padding: 0.75rem 0.8rem 0.9rem;
}

.rl-posts__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem 0.75rem;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.04em;
	color: var(--rl-muted);
	text-transform: uppercase;
}

.rl-posts__title {
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: 1.05rem;
	letter-spacing: -0.02em;
	line-height: 1.25;
	color: var(--rl-ink);
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.rl-posts__excerpt {
	font-size: 0.88rem;
	line-height: 1.45;
	color: var(--rl-muted);
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.rl-split--single {
	grid-template-columns: 1fr;
}

.rl-split--single .rl-section {
	max-width: 40rem;
}

/* Open source libraries — iconic showcases */
.rl-oss__grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.15rem;
}

.rl-oss__card {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 1.15rem 1.25rem;
	padding: 1.25rem 1.2rem 1.35rem;
	border: 1px solid var(--rl-line-strong);
	background: var(--rl-panel);
	overflow: hidden;
}

.rl-oss__card--lab {
	border-color: color-mix(in srgb, var(--rl-ink) 28%, var(--rl-line-strong));
	background: var(--rl-panel);
}

html[data-rl-theme="dark"] .rl-oss__card--lab {
	border-color: color-mix(in srgb, var(--rl-signal) 28%, var(--rl-line-strong));
}

.rl-oss__visual {
	position: relative;
	width: 5rem;
	flex: 0 0 auto;
	display: grid;
	justify-items: center;
	align-content: start;
	padding-top: 0.15rem;
}

.rl-oss__mark-wrap {
	position: relative;
	width: 4.75rem;
	height: 4.75rem;
	display: grid;
	place-items: center;
}

.rl-oss__mark {
	position: relative;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 3.35rem;
	height: 3.35rem;
	border: 1px solid color-mix(in srgb, var(--rl-signal) 55%, var(--rl-line));
	background: var(--rl-signal);
	color: var(--rl-signal-ink);
}

.rl-oss__mark--crate {
	background: color-mix(in srgb, var(--rl-ice) 70%, var(--rl-lift));
	border-color: color-mix(in srgb, var(--rl-ice) 70%, var(--rl-line));
	color: var(--rl-signal-ink);
}

.rl-oss__orbit {
	position: absolute;
	inset: 0;
	border: 1px dashed color-mix(in srgb, var(--rl-signal) 40%, transparent);
	border-radius: 50%;
	pointer-events: none;
	animation: rl-orbit-spin 18s linear infinite;
}

.rl-oss__orbit::before {
	content: "";
	position: absolute;
	top: -0.2rem;
	left: 50%;
	width: 0.4rem;
	height: 0.4rem;
	margin-left: -0.2rem;
	border-radius: 50%;
	background: var(--rl-signal);
}

.rl-oss__lang-row {
	margin: 0;
}

.rl-oss__lang {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.3rem 0.55rem 0.3rem 0.3rem;
	border: 1px solid transparent;
	font-family: var(--rl-mono);
	line-height: 1;
}

.rl-oss__lang-mark {
	display: grid;
	place-items: center;
	width: 1.25rem;
	height: 1.25rem;
	flex: 0 0 auto;
	border-radius: 2px;
}

.rl-oss__lang-name {
	font-size: 0.68rem;
	font-weight: 600;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	white-space: nowrap;
}

/* Solid language chips — readable in light + dark */
.rl-oss__lang--typescript {
	background: #3178c6;
	border-color: #3178c6;
	color: #ffffff;
}

.rl-oss__lang--typescript .rl-oss__lang-mark {
	background: rgba(255, 255, 255, 0.18);
	color: #ffffff;
}

.rl-oss__lang--rust {
	background: #1c1917;
	border-color: #1c1917;
	color: #f5f5f4;
}

.rl-oss__lang--rust .rl-oss__lang-mark {
	background: rgba(222, 165, 132, 0.22);
	color: #dea584;
}

html[data-rl-theme="light"] .rl-oss__lang--rust {
	background: #292524;
	border-color: #292524;
	color: #fafaf9;
}

html[data-rl-theme="dark"] .rl-oss__lang--typescript {
	background: #3b82c4;
	border-color: #3b82c4;
	color: #ffffff;
}

html[data-rl-theme="dark"] .rl-oss__lang--rust {
	background: #44403c;
	border-color: #57534e;
	color: #fafaf9;
}

html[data-rl-theme="dark"] .rl-oss__lang--rust .rl-oss__lang-mark {
	background: rgba(222, 165, 132, 0.2);
	color: #f0c2a0;
}

@keyframes rl-orbit-spin {
	to {
		transform: rotate(360deg);
	}
}

@media (prefers-reduced-motion: reduce) {
	.rl-oss__orbit,
	.rl-sdk-showcase__ring {
		animation: none;
	}
}

.rl-oss__content {
	display: flex;
	flex-direction: column;
	gap: 0.7rem;
	min-width: 0;
}

.rl-oss__top {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.5rem 0.75rem;
}

.rl-oss__badge {
	font-family: var(--rl-mono);
	font-size: 0.66rem;
	letter-spacing: 0.04em;
	color: var(--rl-muted);
}

.rl-oss__lab-link {
	font-family: var(--rl-mono);
	font-size: 0.64rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--rl-ink);
	background: transparent;
	border: 1px solid var(--rl-line-strong);
	padding: 0.22rem 0.45rem;
	transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.rl-oss__lab-link:hover,
.rl-oss__lab-link:focus-visible {
	border-color: var(--rl-ink);
	background: color-mix(in srgb, var(--rl-ink) 8%, transparent);
	color: var(--rl-ink);
}

.rl-oss__title {
	margin: 0;
	font-family: var(--rl-display);
	font-size: clamp(1.35rem, 2.4vw, 1.75rem);
	letter-spacing: -0.03em;
	line-height: 1.1;
	color: var(--rl-ink);
}

.rl-oss__title a {
	color: inherit;
	text-decoration: none;
}

.rl-oss__title a:hover {
	color: var(--rl-dev);
}

.rl-oss__value {
	margin: 0;
	color: var(--rl-muted);
	line-height: 1.45;
	flex: 1;
}

/* Copyable CLI / install commands */
.rl-copy-cmd {
	display: grid;
	gap: 0.35rem;
	margin: 0;
	max-width: 100%;
}

.rl-copy-cmd__label {
	font-family: var(--rl-mono);
	font-size: 0.62rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-copy-cmd__row {
	display: flex;
	align-items: stretch;
	gap: 0;
	max-width: 100%;
	border: 1px solid var(--rl-line-strong);
	background: color-mix(in srgb, var(--rl-ink) 4%, var(--rl-panel));
	overflow: hidden;
}

.rl-copy-cmd__surface {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	align-items: center;
	gap: 0.55rem;
	margin: 0;
	padding: 0.7rem 0.85rem;
	border: 0;
	background: transparent;
	color: inherit;
	text-align: start;
	cursor: pointer;
	touch-action: manipulation;
}

.rl-copy-cmd__surface:focus-visible {
	outline: none;
	box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--rl-signal) 70%, transparent);
}

.rl-copy-cmd__prompt {
	flex: 0 0 auto;
	font-family: var(--rl-mono);
	font-size: 0.78rem;
	line-height: 1;
	color: var(--rl-muted);
	user-select: none;
}

.rl-copy-cmd__code {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	padding: 0;
	font-family: var(--rl-mono);
	font-size: 0.78rem;
	line-height: 1.4;
	letter-spacing: 0.01em;
	color: var(--rl-ink);
	white-space: nowrap;
	overflow-x: auto;
	text-align: start;
	pointer-events: none;
	-webkit-overflow-scrolling: touch;
}

.rl-copy-cmd__btn {
	flex: 0 0 auto;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.4rem;
	min-width: 5.75rem;
	padding: 0 0.9rem;
	border: 0;
	border-inline-start: 1px solid var(--rl-line-strong);
	background: transparent;
	color: var(--rl-ink);
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	cursor: pointer;
	touch-action: manipulation;
	transition: background 0.2s ease, color 0.2s ease;
}

.rl-copy-cmd__btn:hover,
.rl-copy-cmd__surface:hover {
	background: color-mix(in srgb, var(--rl-signal) 16%, transparent);
}

.rl-copy-cmd__btn:focus-visible {
	outline: 2px solid var(--rl-signal);
	outline-offset: -2px;
}

.rl-copy-cmd__btn-icon {
	display: grid;
	place-items: center;
}

.rl-copy-cmd__btn-icon--check {
	display: none;
}

.rl-copy-cmd.is-copied .rl-copy-cmd__btn,
.rl-copy-cmd__btn.is-copied {
	background: var(--rl-signal);
	color: var(--rl-signal-ink);
}

.rl-copy-cmd.is-copied .rl-copy-cmd__btn-icon--copy,
.rl-copy-cmd__btn.is-copied .rl-copy-cmd__btn-icon--copy {
	display: none;
}

.rl-copy-cmd.is-copied .rl-copy-cmd__btn-icon--check,
.rl-copy-cmd__btn.is-copied .rl-copy-cmd__btn-icon--check {
	display: grid;
}

.rl-copy-cmd.is-copied .rl-copy-cmd__row {
	border-color: color-mix(in srgb, var(--rl-signal) 55%, var(--rl-line-strong));
}

.rl-copy-cmd__hint {
	font-family: var(--rl-mono);
	font-size: 0.62rem;
	letter-spacing: 0.04em;
	color: var(--rl-muted);
}

.rl-copy-cmd.is-copied .rl-copy-cmd__hint {
	color: var(--rl-dev);
}

.rl-copy-cmd--on-dark .rl-copy-cmd__label,
.rl-copy-cmd--on-dark .rl-copy-cmd__hint,
.rl-copy-cmd--on-dark .rl-copy-cmd__prompt {
	color: rgba(244, 246, 248, 0.55);
}

.rl-copy-cmd--on-dark .rl-copy-cmd__row {
	border-color: rgba(244, 246, 248, 0.2);
	background: rgba(11, 13, 16, 0.55);
}

.rl-copy-cmd--on-dark .rl-copy-cmd__code {
	color: #f4f6f8;
}

.rl-copy-cmd--on-dark .rl-copy-cmd__btn {
	color: #f4f6f8;
	border-inline-start-color: rgba(244, 246, 248, 0.2);
}

.rl-copy-cmd--on-dark .rl-copy-cmd__btn:hover,
.rl-copy-cmd--on-dark .rl-copy-cmd__surface:hover {
	background: rgba(212, 255, 79, 0.16);
}

.rl-copy-cmd--on-dark.is-copied .rl-copy-cmd__btn {
	background: var(--rl-signal);
	color: var(--rl-signal-ink);
}

.rl-copy-cmd--on-dark.is-copied .rl-copy-cmd__hint {
	color: var(--rl-signal);
}

@media (max-width: 560px) {
	.rl-copy-cmd__row {
		flex-wrap: wrap;
	}

	.rl-copy-cmd__surface {
		flex: 1 1 100%;
		border-bottom: 1px solid var(--rl-line-strong);
	}

	.rl-copy-cmd__btn {
		flex: 1 1 100%;
		min-height: 2.75rem;
		border-inline-start: 0;
	}

	.rl-copy-cmd--on-dark .rl-copy-cmd__surface {
		border-bottom-color: rgba(244, 246, 248, 0.16);
	}
}

.rl-oss__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem;
	margin-top: 0.15rem;
}

.rl-btn-icon {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	min-height: 2.35rem;
	padding: 0.35rem 0.7rem;
	font-family: var(--rl-mono);
	font-size: 0.7rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--rl-ink);
	border: 1px solid var(--rl-line-strong);
	background: var(--rl-lift);
	transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
	touch-action: manipulation;
}

.rl-btn-icon:link,
.rl-btn-icon:visited {
	color: var(--rl-ink);
	background: var(--rl-lift);
	border-color: var(--rl-line-strong);
}

.rl-btn-icon:hover,
.rl-btn-icon:focus-visible {
	color: var(--rl-ink);
	border-color: var(--rl-ink);
	background: color-mix(in srgb, var(--rl-ink) 8%, var(--rl-lift));
}

.rl-btn-icon--github:link,
.rl-btn-icon--github:visited {
	border-color: color-mix(in srgb, #24292f 45%, var(--rl-line-strong));
}

.rl-btn-icon--github:hover,
.rl-btn-icon--github:focus-visible {
	background: #24292f;
	border-color: #24292f;
	color: #ffffff;
}

html[data-rl-theme="dark"] .rl-btn-icon--github:link,
html[data-rl-theme="dark"] .rl-btn-icon--github:visited {
	border-color: rgba(238, 242, 246, 0.32);
}

html[data-rl-theme="dark"] .rl-btn-icon--github:hover,
html[data-rl-theme="dark"] .rl-btn-icon--github:focus-visible {
	background: #f0f3f6;
	border-color: #f0f3f6;
	color: #0b0d10;
}

.rl-btn-icon--lg {
	min-height: 2.65rem;
	padding: 0.45rem 0.9rem;
	font-size: 0.74rem;
}

.rl-icon {
	flex: 0 0 auto;
	display: block;
}

.rl-links .rl-btn-icon {
	border-bottom: 0;
}

.rl-project__lab-link {
	margin: 0 0 1.75rem;
}

@media (max-width: 900px) {
	.rl-oss__grid {
		grid-template-columns: 1fr;
	}

	.rl-oss__card {
		grid-template-columns: 1fr;
		gap: 0.9rem;
	}

	.rl-oss__visual {
		width: 5rem;
	}

	.rl-oss__mark-wrap {
		width: 3.75rem;
		height: 3.75rem;
	}
}

/* Archive / project / article */
.rl-archive,
.rl-project,
.rl-article {
	width: min(100% - (var(--rl-pad) * 2), var(--rl-max));
	margin: 0 auto;
	padding: clamp(2.5rem, 6vw, 4.5rem) 0 5rem;
}

/* Reading posts — wider canvas + sticky rail */
.rl-article {
	width: min(100% - (var(--rl-pad) * 2), 1180px);
}

.rl-article__inner {
	display: block;
}

.rl-article__head {
	max-width: none;
	margin-bottom: 2rem;
	padding-bottom: 1.35rem;
	border-bottom: 1px solid var(--rl-line-strong);
}

.rl-article__head .rl-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.55rem;
	margin: 0 0 0.85rem;
}

.rl-article__title {
	font-weight: 700;
	letter-spacing: -0.045em;
	line-height: 1.05;
	margin: 0 0 0.85rem;
	font-size: clamp(2.1rem, 5.2vw, 3.6rem);
	color: var(--rl-ink);
	max-width: 22ch;
}

.rl-article__lede {
	margin: 0 0 1.1rem;
	max-width: 52rem;
	font-size: clamp(1.05rem, 2vw, 1.25rem);
	line-height: 1.5;
	color: var(--rl-muted);
}

.rl-article__topics {
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
}

.rl-chip {
	display: inline-flex;
	align-items: center;
	font-family: var(--rl-mono);
	font-size: 0.66rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--rl-ink);
	border: 1px solid var(--rl-line-strong);
	background: color-mix(in srgb, var(--rl-ink) 5%, transparent);
	padding: 0.35rem 0.55rem;
	transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.rl-chip:hover,
.rl-chip:focus-visible {
	border-color: var(--rl-ink);
	background: color-mix(in srgb, var(--rl-ink) 10%, transparent);
	color: var(--rl-ink);
}

.rl-chip--muted {
	color: var(--rl-muted);
	border-color: var(--rl-line);
	background: transparent;
}

.rl-article__layout {
	display: grid;
	gap: 2rem;
	align-items: start;
}

.rl-article__main {
	min-width: 0;
}

.rl-article__aside {
	min-width: 0;
	align-self: start;
}

.rl-article__rail {
	display: grid;
	gap: 0.85rem;
}

.rl-rail-card {
	padding: 1rem 1.05rem 1.1rem;
	border: 1px solid var(--rl-line-strong);
	background: color-mix(in srgb, var(--rl-panel) 92%, var(--rl-canvas));
	overflow: visible;
}

.rl-article__hero {
	margin: 0 0 1.75rem;
	border: 1px solid var(--rl-line-strong);
	overflow: hidden;
	background: var(--rl-lift);
}

.rl-article__hero-img {
	display: block;
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	object-fit: cover;
}

.rl-article__body.entry-content {
	max-width: 48rem;
	font-size: 1.05rem;
	line-height: 1.75;
	color: var(--rl-ink);
}

.rl-article__body.entry-content > *:first-child {
	margin-top: 0;
}

.rl-article__body.entry-content h2,
.rl-article__body.entry-content h3 {
	scroll-margin-top: calc(var(--rl-nav-h, 4.25rem) + 1rem);
	color: var(--rl-ink);
	letter-spacing: -0.03em;
	line-height: 1.2;
}

.rl-article__body.entry-content h2 {
	margin: 2.4rem 0 0.85rem;
	font-size: clamp(1.45rem, 2.4vw, 1.85rem);
}

.rl-article__body.entry-content h3 {
	margin: 1.85rem 0 0.65rem;
	font-size: clamp(1.15rem, 1.8vw, 1.35rem);
}

.rl-article__body.entry-content p,
.rl-article__body.entry-content ul,
.rl-article__body.entry-content ol {
	margin: 0 0 1.15rem;
}

.rl-article__body.entry-content ul,
.rl-article__body.entry-content ol {
	padding-inline-start: 1.25rem;
}

.rl-article__body.entry-content li + li {
	margin-top: 0.35rem;
}

.rl-article__body.entry-content blockquote {
	margin: 1.5rem 0;
	padding: 0.85rem 1rem;
	border-inline-start: 3px solid var(--rl-ink);
	background: color-mix(in srgb, var(--rl-ink) 5%, transparent);
	color: var(--rl-ink-2);
}

.rl-article__body.entry-content pre,
.rl-article__body.entry-content code {
	font-family: var(--rl-mono);
}

.rl-article__body.entry-content code {
	font-size: 0.88em;
	padding: 0.12em 0.35em;
	border: 1px solid var(--rl-line);
	background: var(--rl-lift);
	color: var(--rl-ink);
}

.rl-article__body.entry-content pre {
	margin: 1.35rem 0;
	padding: 1rem 1.1rem;
	overflow-x: auto;
	border: 1px solid var(--rl-line-strong);
	background: var(--rl-lift);
	color: var(--rl-ink);
	line-height: 1.55;
	-webkit-overflow-scrolling: touch;
}

.rl-article__body.entry-content pre code {
	padding: 0;
	border: 0;
	background: transparent;
}

.rl-article__body.entry-content img {
	max-width: 100%;
	height: auto;
	border: 1px solid var(--rl-line);
}

.rl-article__body.entry-content figure {
	margin: 1.5rem 0;
}

.rl-article__body.entry-content figcaption {
	margin-top: 0.45rem;
	font-family: var(--rl-mono);
	font-size: 0.72rem;
	color: var(--rl-muted);
}

.rl-article__foot {
	margin-top: 2.5rem;
	padding-top: 1.25rem;
	border-top: 1px solid var(--rl-line);
}

body.recash-lab-ui .rl-article__back {
	font-family: var(--rl-mono);
	font-size: 0.78rem;
	letter-spacing: 0.04em;
	color: var(--rl-link);
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}

body.recash-lab-ui .rl-article__back:hover,
body.recash-lab-ui .rl-article__back:focus-visible {
	color: var(--rl-link-hover);
}

.rl-rail-card__label {
	margin: 0 0 0.7rem;
	font-family: var(--rl-mono);
	font-size: 0.62rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-toc__list,
.rl-rail-card__chips,
.rl-rail-card__list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.rl-toc__list {
	display: grid;
	gap: 0.2rem;
	border-inline-start: 2px solid var(--rl-line);
	padding-inline-start: 0.75rem;
}

.rl-toc__item a {
	display: block;
	padding: 0.28rem 0;
	font-size: 0.86rem;
	line-height: 1.35;
	color: var(--rl-muted);
	text-decoration: none;
	border: 0;
	transition: color 0.2s ease;
}

.rl-toc__item--h3 a {
	padding-inline-start: 0.75rem;
	font-size: 0.8rem;
}

body.recash-lab-ui .rl-toc__item a:hover,
body.recash-lab-ui .rl-toc__item a:focus-visible {
	color: var(--rl-ink);
}

body.recash-lab-ui .rl-toc__item.is-active a {
	color: var(--rl-ink);
	font-weight: 600;
}

.rl-toc__item.is-active {
	position: relative;
}

.rl-toc__item.is-active::before {
	content: "";
	position: absolute;
	inset-inline-start: calc(-0.75rem - 2px);
	top: 0.2rem;
	bottom: 0.2rem;
	width: 2px;
	background: var(--rl-ink);
}

.rl-rail-card__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
}

.rl-rail-product {
	display: grid;
	gap: 0.75rem;
	text-decoration: none;
	color: inherit;
}

.rl-rail-product__media {
	display: block;
	width: 100%;
	aspect-ratio: 16 / 9;
	background-size: cover;
	background-position: center;
	border: 1px solid var(--rl-line);
}

.rl-rail-product__body {
	display: grid;
	gap: 0.4rem;
}

.rl-rail-product__title {
	font-weight: 700;
	font-size: 1.05rem;
	letter-spacing: -0.02em;
	color: var(--rl-ink);
}

.rl-rail-product__value {
	font-size: 0.88rem;
	line-height: 1.4;
	color: var(--rl-muted);
}

body.recash-lab-ui .rl-rail-product:hover .rl-rail-product__title,
body.recash-lab-ui .rl-rail-product:focus-visible .rl-rail-product__title {
	color: var(--rl-link-hover);
}

.rl-rail-card__list {
	display: grid;
	gap: 0;
}

.rl-rail-card__list li + li {
	border-top: 1px solid var(--rl-line);
}

.rl-rail-card__list a {
	display: grid;
	gap: 0.2rem;
	padding: 0.7rem 0;
	text-decoration: none;
	color: var(--rl-link);
}

.rl-rail-card__list a span {
	font-size: 0.92rem;
	line-height: 1.35;
	font-weight: 600;
	color: inherit;
}

.rl-rail-card__list time {
	font-family: var(--rl-mono);
	font-size: 0.66rem;
	color: var(--rl-muted);
}

body.recash-lab-ui .rl-rail-card__list a:hover,
body.recash-lab-ui .rl-rail-card__list a:focus-visible {
	color: var(--rl-link-hover);
}

html[data-rl-theme="dark"] .rl-rail-card {
	background: color-mix(in srgb, var(--rl-lift) 88%, transparent);
	border-color: var(--rl-line-strong);
}

html[data-rl-theme="dark"] .recash-lab-banner {
	background: color-mix(in srgb, var(--rl-dev) 16%, var(--rl-lift));
	border-inline-start-color: var(--rl-ice);
	color: var(--rl-ink);
}

html[data-rl-theme="light"] .recash-lab-banner {
	background: color-mix(in srgb, var(--rl-done) 10%, #fff);
	border-inline-start-color: var(--rl-done);
	color: var(--rl-ink);
}

@media (min-width: 960px) {
	.rl-article__layout {
		grid-template-columns: minmax(0, 1fr) minmax(15.5rem, 18.5rem);
		gap: 2.75rem;
	}

	/* Sticky on the grid item (aside), not an inner child — otherwise the
	   containing block is only as tall as the rail and sticky never engages. */
	.rl-article__aside {
		position: sticky;
		top: calc(var(--rl-nav-h, 4.25rem) + 1rem);
		max-height: calc(100svh - var(--rl-nav-h, 4.25rem) - 2rem);
		overflow-x: hidden;
		overflow-y: auto;
		overscroll-behavior: contain;
		scrollbar-width: thin;
		scrollbar-color: color-mix(in srgb, var(--rl-muted) 55%, transparent) transparent;
	}

	.rl-article__aside::-webkit-scrollbar {
		width: 6px;
	}

	.rl-article__aside::-webkit-scrollbar-thumb {
		background: color-mix(in srgb, var(--rl-muted) 45%, transparent);
		border-radius: 999px;
	}

	html.rl-section-bar-on .rl-article__aside {
		top: calc(var(--rl-section-bar-h, 3rem) + 0.75rem);
		max-height: calc(100svh - var(--rl-section-bar-h, 3rem) - 1.5rem);
	}

	.rl-article__rail {
		position: static;
		max-height: none;
		overflow: visible;
	}

	.rl-article__body.entry-content {
		max-width: 52rem;
	}
}

@media (max-width: 959px) {
	.rl-article__layout {
		display: flex;
		flex-direction: column;
	}

	.rl-article__aside {
		order: -1;
	}

	.rl-toc__list {
		display: flex;
		gap: 0.35rem;
		overflow-x: auto;
		border-inline-start: 0;
		padding-inline-start: 0;
		padding-bottom: 0.15rem;
		-webkit-overflow-scrolling: touch;
	}

	.rl-toc__item {
		flex: 0 0 auto;
	}

	.rl-toc__item a {
		padding: 0.4rem 0.65rem;
		border: 1px solid var(--rl-line-strong);
		background: color-mix(in srgb, var(--rl-ink) 4%, transparent);
		white-space: nowrap;
		font-size: 0.78rem;
	}

	.rl-toc__item--h3 a {
		padding-inline-start: 0.65rem;
	}

	.rl-toc__item.is-active::before {
		display: none;
	}

	body.recash-lab-ui .rl-toc__item.is-active a {
		background: var(--rl-ink);
		border-color: var(--rl-ink);
		color: var(--rl-canvas);
	}

	html[data-rl-theme="dark"] .rl-toc__item.is-active a {
		background: var(--rl-signal);
		border-color: var(--rl-signal);
		color: var(--rl-signal-ink);
	}
}

/* Interactive project stage — split copy + framed viewport */
.rl-stage {
	--rl-stage-accent: var(--rl-signal);
	--rl-stage-pad: 1.25rem;
	display: grid;
	grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
	gap: 0;
	min-height: clamp(22rem, 46vw, 30rem);
	margin: 0 0 2.25rem;
	overflow: hidden;
	border: 1px solid var(--rl-line-strong);
	background:
		radial-gradient(640px 280px at 12% 20%, color-mix(in srgb, var(--rl-stage-accent) 14%, transparent), transparent 65%),
		linear-gradient(135deg, #0b0d10 0%, #121820 52%, #0b0d10 100%);
	color: #f4f6f8;
}

.rl-stage.is-loading .rl-stage__chrome-state {
	color: var(--rl-stage-accent);
}

.rl-stage__copy {
	position: relative;
	z-index: 2;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 0.85rem;
	padding: var(--rl-stage-pad) clamp(1.15rem, 2.5vw, 1.75rem);
	border-inline-end: 1px solid rgba(244, 246, 248, 0.1);
	background: linear-gradient(105deg, rgba(11, 13, 16, 0.92) 0%, rgba(11, 13, 16, 0.55) 100%);
}

.rl-stage__badge {
	display: flex;
	align-items: center;
	gap: 0.7rem;
}

.rl-stage__badge-mark {
	display: grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	flex: 0 0 auto;
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: 1.15rem;
	background: var(--rl-stage-accent);
	color: #10140a;
}

.rl-stage__kicker {
	margin: 0;
	font-family: var(--rl-mono);
	font-size: 0.64rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--rl-stage-accent);
}

.rl-stage__blurb {
	margin: 0;
	max-width: 28rem;
	font-family: var(--rl-display);
	font-size: clamp(1.2rem, 2.3vw, 1.55rem);
	font-weight: 700;
	letter-spacing: -0.025em;
	line-height: 1.28;
}

.rl-stage__metric {
	margin: 0;
	font-family: var(--rl-mono);
	font-size: 0.72rem;
	letter-spacing: 0.04em;
	line-height: 1.45;
	color: rgba(244, 246, 248, 0.62);
}

.rl-stage__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem;
	margin-top: 0.15rem;
}

.rl-stage__actions .rl-btn-icon,
.rl-stage__actions .rl-btn-icon:link,
.rl-stage__actions .rl-btn-icon:visited {
	color: #f4f6f8;
	border-color: rgba(244, 246, 248, 0.32);
	background: rgba(11, 13, 16, 0.55);
	backdrop-filter: blur(8px);
}

.rl-stage__actions .rl-btn-icon:hover,
.rl-stage__actions .rl-btn-icon:focus-visible {
	border-color: var(--rl-stage-accent);
	color: #10140a;
	background: var(--rl-stage-accent);
}

.rl-stage__actions .rl-btn-icon--github,
.rl-stage__actions .rl-btn-icon--github:link,
.rl-stage__actions .rl-btn-icon--github:visited {
	background: #24292f;
	border-color: #24292f;
	color: #ffffff;
}

.rl-stage__actions .rl-btn-icon--github:hover,
.rl-stage__actions .rl-btn-icon--github:focus-visible {
	background: #f0f3f6;
	border-color: #f0f3f6;
	color: #0b0d10;
}

.rl-stage__hint {
	margin: 0.2rem 0 0;
	font-family: var(--rl-mono);
	font-size: 0.62rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: rgba(244, 246, 248, 0.42);
}

.rl-stage[data-rl-stage-mode="lite"] .rl-stage__hint--rich,
.rl-stage[data-rl-stage-mode="rich"] .rl-stage__hint--lite {
	display: none;
}

.rl-stage[data-rl-stage-mode="rich"] .rl-stage__hint--rich,
.rl-stage[data-rl-stage-mode="lite"] .rl-stage__hint--lite {
	display: block;
}

.rl-stage__viewport {
	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 100%;
	padding: 0.85rem;
	background:
		radial-gradient(480px 260px at 70% 40%, color-mix(in srgb, var(--rl-stage-accent) 18%, transparent), transparent 70%),
		#0a0c0f;
}

.rl-stage__viewport--product {
	justify-content: center;
	padding: 0.7rem 0.75rem 0.9rem;
}

.rl-stage--product {
	min-height: clamp(24rem, 48vw, 32rem);
}

.rl-stage__viewport--product .rl-stage__scene {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 1 1 auto;
	min-height: 0;
	padding: 0.35rem 0.15rem 0.15rem;
}

.rl-laptop-preview {
	width: 100%;
	max-width: 34rem;
	margin: 0 auto;
}

.rl-laptop-preview--stage .rl-laptop-stage--embed {
	margin: 0;
	padding: 0;
	perspective: 1200px;
	overflow: visible;
	background: transparent;
	border: 0;
}

.rl-laptop-preview--stage .rl-laptop--embed {
	max-width: 100%;
}

.rl-laptop-preview--stage .rl-laptop__note {
	margin-top: 0.55rem;
	color: rgba(244, 246, 248, 0.5);
}

.rl-laptop-preview--stage .rl-laptop__hit span {
	min-height: 2rem;
	padding: 0.35rem 0.7rem;
	font-size: 0.64rem;
}

.rl-product-cta--after-hero {
	margin-top: 0;
}

.rl-project--product-duo .rl-stage--product {
	margin-bottom: 0;
}

@media (max-width: 900px) {
	.rl-stage__viewport--product .rl-stage__scene {
		min-height: 14rem;
	}

	.rl-laptop-preview {
		max-width: 26rem;
	}
}

.rl-stage__chrome {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	padding: 0.45rem 0.65rem;
	margin-bottom: 0.65rem;
	border: 1px solid rgba(244, 246, 248, 0.12);
	background: rgba(18, 24, 32, 0.88);
}

.rl-stage__chrome-dot {
	width: 0.45rem;
	height: 0.45rem;
	border-radius: 50%;
	background: var(--rl-stage-accent);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--rl-stage-accent) 25%, transparent);
}

.rl-stage__chrome-label {
	font-family: var(--rl-mono);
	font-size: 0.62rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: rgba(244, 246, 248, 0.7);
}

.rl-stage__chrome-state {
	margin-inline-start: auto;
	font-family: var(--rl-mono);
	font-size: 0.62rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgba(244, 246, 248, 0.45);
}

.rl-stage__scene {
	position: relative;
	flex: 1 1 auto;
	min-height: clamp(14rem, 32vw, 22rem);
	border: 1px solid rgba(244, 246, 248, 0.14);
	background: #07090c;
	overflow: hidden;
	box-shadow:
		inset 0 0 0 1px rgba(212, 255, 79, 0.04),
		inset 0 0 48px rgba(0, 0, 0, 0.35);
}

.rl-stage__canvas-wrap,
.rl-stage__lite {
	position: absolute;
	inset: 0;
	z-index: 0;
}

.rl-stage__canvas-wrap[hidden],
.rl-stage__lite[hidden] {
	display: none !important;
}

.rl-stage__canvas {
	display: block;
	width: 100%;
	height: 100%;
}

.rl-stage__lite-grid {
	position: absolute;
	inset: 0;
	opacity: 0.28;
	background-image:
		linear-gradient(rgba(244, 246, 248, 0.07) 1px, transparent 1px),
		linear-gradient(90deg, rgba(244, 246, 248, 0.07) 1px, transparent 1px);
	background-size: 28px 28px;
	mask-image: radial-gradient(circle at 50% 45%, #000 18%, transparent 72%);
}

.rl-stage__lite-orb {
	position: absolute;
	top: 50%;
	left: 50%;
	width: min(9.5rem, 46%);
	height: min(9.5rem, 46%);
	transform: translate(-50%, -50%);
	display: grid;
	place-items: center;
}

.rl-stage__lite-mark {
	position: relative;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 3.75rem;
	height: 3.75rem;
	font-family: var(--rl-display);
	font-size: 1.75rem;
	font-weight: 700;
	background: var(--rl-stage-accent);
	color: #10140a;
}

.rl-stage__lite-ring {
	position: absolute;
	inset: 0.25rem;
	border: 1px solid color-mix(in srgb, var(--rl-stage-accent) 55%, transparent);
	border-radius: 50%;
	animation: rl-orbit-spin 16s linear infinite;
}

.rl-stage__lite-ring--2 {
	inset: -0.55rem;
	border-style: dashed;
	opacity: 0.55;
	animation-duration: 24s;
	animation-direction: reverse;
}

@media (max-width: 960px) {
	.rl-stage {
		grid-template-columns: 1fr;
		min-height: 0;
	}

	.rl-stage__copy {
		border-inline-end: 0;
		border-bottom: 1px solid rgba(244, 246, 248, 0.1);
		padding: 1.15rem 1.15rem 1.25rem;
	}

	.rl-stage__viewport {
		padding: 0.75rem;
	}

	.rl-stage__scene {
		min-height: 15rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.rl-stage__lite-ring {
		animation: none;
	}
}

/* Project page segments */
.rl-segment {
	margin: 0 0 2.25rem;
}

/* Breathing room between hero / product stage and Facts */
.rl-project #rl-facts {
	margin-top: clamp(2.75rem, 6vw, 5rem);
	padding-top: clamp(0.5rem, 1.5vw, 1rem);
}

.rl-project .rl-product-cta + #rl-facts,
.rl-project .rl-stage + #rl-facts,
.rl-project .rl-project__lab-link + #rl-facts {
	margin-top: clamp(3.25rem, 7vw, 5.5rem);
}

.rl-segment__head {
	margin-bottom: 1rem;
	max-width: 40rem;
}

.rl-segment__title {
	margin: 0;
	font-family: var(--rl-display);
	font-size: clamp(1.35rem, 2.6vw, 1.75rem);
	letter-spacing: -0.03em;
	line-height: 1.15;
	color: var(--rl-ink);
}

.rl-segment__lede {
	margin: 0.45rem 0 0;
	color: var(--rl-muted);
	line-height: 1.45;
}

.rl-segment--split {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1rem;
}

.rl-panel {
	padding: 1.2rem 1.25rem 1.3rem;
	border: 1px solid var(--rl-line-strong);
	background: var(--rl-panel);
}

.rl-panel--body {
	max-width: none;
}

.rl-panel__label {
	margin: 0 0 0.75rem;
	font-family: var(--rl-mono);
	font-size: 0.64rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-tags--panel {
	margin: 0;
	padding: 0;
	list-style: none;
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
}

.rl-tags--panel li {
	padding: 0.35rem 0.55rem;
	border: 1px solid var(--rl-line);
	font-family: var(--rl-mono);
	font-size: 0.7rem;
}

.rl-project__head-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.65rem 0.85rem;
	margin-bottom: 0.65rem;
}

.rl-project__head-row .rl-kicker {
	margin: 0;
}

/* Keep Active badge from visually swallowing the Projects link on hover */
.rl-project__head-row .rl-status {
	position: relative;
	z-index: 1;
	flex: 0 0 auto;
}

body.recash-lab-ui .rl-project__head-row .rl-kicker a,
body.recash-lab-ui .rl-project__head-row .rl-kicker a:link,
body.recash-lab-ui .rl-project__head-row .rl-kicker a:visited {
	position: relative;
	z-index: 2;
	color: var(--rl-link);
	text-decoration: none;
	border-bottom: 1px solid color-mix(in srgb, var(--rl-link) 45%, transparent);
	background: transparent;
}

body.recash-lab-ui .rl-project__head-row .rl-kicker a:hover,
body.recash-lab-ui .rl-project__head-row .rl-kicker a:focus,
body.recash-lab-ui .rl-project__head-row .rl-kicker a:focus-visible,
body.recash-lab-ui .rl-project__head-row .rl-kicker a:active {
	color: var(--rl-link-hover);
	border-bottom-color: var(--rl-link-hover);
	background: transparent;
	outline: none;
}

body.recash-lab-ui .rl-project__head-row .rl-kicker a:focus-visible {
	outline: 2px solid var(--rl-link-hover);
	outline-offset: 3px;
}

.rl-archive__head,
.rl-project__head {
	margin-bottom: 2rem;
	padding-bottom: 1.25rem;
	border-bottom: 1px solid var(--rl-line-strong);
	max-width: 44rem;
}

/* Research tag / category / blog feed — Lab UI (not JNews magazine) */
.rl-feed-archive {
	width: min(100% - (var(--rl-pad) * 2), var(--rl-max));
	margin: 0 auto;
	padding: clamp(2.25rem, 5vw, 3.75rem) 0 clamp(3.5rem, 7vw, 5.5rem);
}

.rl-feed-archive__head {
	max-width: 40rem;
}

.rl-feed {
	display: grid;
	gap: 0.85rem;
}

.rl-feed__item {
	margin: 0;
}

.rl-feed__link {
	display: grid;
	grid-template-columns: minmax(6.5rem, 11rem) minmax(0, 1fr);
	gap: 1rem 1.25rem;
	align-items: start;
	padding: 0.85rem;
	text-decoration: none;
	color: inherit;
	border: 1px solid var(--rl-line-strong);
	background: color-mix(in srgb, var(--rl-panel) 88%, var(--rl-canvas));
	transition: border-color 0.2s ease, background 0.2s ease, transform 0.2s var(--rl-ease);
}

.rl-feed__link:hover,
.rl-feed__link:focus-visible {
	border-color: var(--rl-ink);
	background: color-mix(in srgb, var(--rl-ink) 5%, var(--rl-panel));
	outline: none;
	transform: translateY(-1px);
}

.rl-feed__media {
	display: block;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: var(--rl-lift);
	border: 1px solid var(--rl-line);
}

.rl-feed__media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.rl-feed__media--empty {
	background:
		linear-gradient(135deg, color-mix(in srgb, var(--rl-signal) 16%, transparent), transparent 55%),
		var(--rl-lift);
}

.rl-feed__body {
	display: grid;
	gap: 0.4rem;
	min-width: 0;
	padding-top: 0.15rem;
}

.rl-feed__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.45rem 0.65rem;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.04em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-feed__title {
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: clamp(1.05rem, 2vw, 1.35rem);
	letter-spacing: -0.025em;
	line-height: 1.25;
	color: var(--rl-ink);
}

.rl-feed__excerpt {
	font-size: 0.95rem;
	line-height: 1.5;
	color: var(--rl-muted);
}

body.recash-lab-ui a.rl-feed__link,
body.recash-lab-ui a.rl-feed__link:link,
body.recash-lab-ui a.rl-feed__link:visited {
	color: inherit;
	text-decoration: none;
}

body.recash-lab-ui a.rl-feed__link:hover .rl-feed__title,
body.recash-lab-ui a.rl-feed__link:focus-visible .rl-feed__title {
	color: var(--rl-link-hover);
}

.rl-feed-archive__empty {
	margin: 0;
	color: var(--rl-muted);
	font-size: 1.05rem;
}

.rl-feed-archive__pages {
	margin-top: 2rem;
}

.rl-feed-archive__pages .page-numbers {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.rl-feed-archive__pages .page-numbers li {
	margin: 0;
}

.rl-feed-archive__pages a,
.rl-feed-archive__pages span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 2.35rem;
	min-height: 2.35rem;
	padding: 0.35rem 0.55rem;
	font-family: var(--rl-mono);
	font-size: 0.72rem;
	letter-spacing: 0.04em;
	text-decoration: none;
	border: 1px solid var(--rl-line-strong);
	color: var(--rl-ink);
	background: transparent;
}

.rl-feed-archive__pages a:hover,
.rl-feed-archive__pages a:focus-visible {
	border-color: var(--rl-ink);
	color: var(--rl-link-hover);
	outline: none;
}

.rl-feed-archive__pages .current {
	background: var(--rl-ink);
	border-color: var(--rl-ink);
	color: var(--rl-canvas);
}

html[data-rl-theme="dark"] .rl-feed-archive__pages .current {
	background: var(--rl-signal);
	border-color: var(--rl-signal);
	color: var(--rl-signal-ink);
}

html[data-rl-theme="dark"] .rl-feed__link {
	background: color-mix(in srgb, var(--rl-lift) 72%, transparent);
}

@media (max-width: 640px) {
	.rl-feed__link {
		grid-template-columns: 1fr;
		gap: 0.75rem;
	}

	.rl-feed__media {
		aspect-ratio: 16 / 9;
	}
}

.rl-archive__title,
.rl-project__title {
	font-weight: 700;
	letter-spacing: -0.045em;
	line-height: 0.95;
	margin: 0 0 0.75rem;
	font-size: clamp(2.4rem, 6vw, 4.4rem);
	color: var(--rl-ink);
}

.rl-archive__lede,
.rl-project__value {
	margin: 0;
	color: var(--rl-muted);
	font-size: 1.1rem;
	line-height: 1.45;
}

.rl-filters {
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
	margin-top: 1.5rem;
}

.rl-filter {
	font-family: var(--rl-mono);
	font-size: 0.7rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--rl-ink);
	background: var(--rl-lift);
	border: 1px solid var(--rl-line-strong);
	padding: 0.45rem 0.7rem;
}

.rl-filter:link,
.rl-filter:visited {
	color: var(--rl-ink);
	background: var(--rl-lift);
	border-color: var(--rl-line-strong);
}

.rl-filter.is-active,
.rl-filter:hover,
.rl-filter:focus-visible {
	color: var(--rl-ink);
	background: color-mix(in srgb, var(--rl-ink) 8%, var(--rl-lift));
	border-color: var(--rl-ink);
}

.rl-kicker {
	font-family: var(--rl-mono);
	font-size: 0.72rem;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	margin: 0 0 0.85rem;
	color: var(--rl-muted);
}

.rl-kicker a,
.rl-kicker a:link,
.rl-kicker a:visited {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px solid var(--rl-line-strong);
	background: transparent;
}

.rl-kicker a:hover,
.rl-kicker a:focus-visible,
.rl-kicker a:active {
	color: var(--rl-link-hover);
	border-bottom-color: var(--rl-link-hover);
	background: transparent;
	outline: none;
}

.rl-project__updated {
	font-family: var(--rl-mono);
	font-size: 0.75rem;
	color: var(--rl-muted);
	margin: 1rem 0 0;
}

.rl-spec {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.9rem;
	margin: 0;
	padding: 0;
	border: 0;
}

.rl-spec__card {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 0.35rem 0.85rem;
	padding: 1.2rem 1.25rem 1.3rem;
	border: 1px solid var(--rl-line-strong);
	background: var(--rl-panel);
	min-width: 0;
}

.rl-spec__mark {
	grid-row: 1 / span 2;
	align-self: start;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.1em;
	color: var(--rl-signal-ink);
	background: var(--rl-signal);
	padding: 0.28rem 0.4rem;
	line-height: 1;
}

.rl-spec__label {
	margin: 0;
	font-family: var(--rl-mono);
	font-size: 0.66rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--rl-muted);
	font-weight: 500;
}

.rl-spec__value {
	margin: 0;
	line-height: 1.5;
	color: var(--rl-ink);
}

.rl-spec dt {
	font-family: var(--rl-mono);
	font-size: 0.66rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--rl-muted);
	margin: 0 0 0.35rem;
}

.rl-spec dd {
	margin: 0;
	line-height: 1.45;
}

.rl-links {
	display: flex;
	flex-wrap: wrap;
	gap: 0.85rem 1.25rem;
	list-style: none;
	margin: 0 0 2rem;
	padding: 0;
}

body.recash-lab-ui .rl-links a:not(.rl-btn-icon) {
	font-family: var(--rl-mono);
	font-size: 0.75rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--rl-link);
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}

body.recash-lab-ui .rl-links a:not(.rl-btn-icon):hover,
body.recash-lab-ui .rl-links a:not(.rl-btn-icon):focus-visible {
	color: var(--rl-link-hover);
}

body.recash-lab-ui .rl-links a.rl-btn-icon,
body.recash-lab-ui .rl-links a.rl-btn-icon:link,
body.recash-lab-ui .rl-links a.rl-btn-icon:visited {
	border-bottom: 0;
}

.rl-project__body {
	max-width: 42rem;
	line-height: 1.7;
}

.rl-project__body.rl-panel {
	max-width: none;
	padding: 1.35rem 1.4rem 1.5rem;
}

.rl-project__body.rl-panel > *:first-child {
	margin-top: 0;
}

.rl-project__body.rl-panel > *:last-child {
	margin-bottom: 0;
}

.recash-lab-banner {
	margin: 0 0 1.5rem;
	padding: 1rem 1.1rem;
	border-inline-start: 3px solid var(--rl-ink);
	background: color-mix(in srgb, var(--rl-signal) 28%, transparent);
}

.recash-lab-banner__label {
	display: block;
	font-family: var(--rl-mono);
	font-size: 0.66rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	margin-bottom: 0.3rem;
}

.recash-lab-banner__text {
	margin: 0;
	line-height: 1.4;
}

/* Footer-edge product dock — flush, no gap above footer (theme-aware) */
.rl-footer-dock {
	margin: 0;
	padding: 0;
	background: var(--rl-footer-bg);
	color: var(--rl-footer-fg);
	border-top: 1px solid var(--rl-line-strong);
	overflow-x: clip;
	max-width: 100vw;
}

.rl-footer-dock__bar {
	width: min(100% - (var(--rl-pad) * 2), var(--rl-max));
	margin: 0 auto;
	padding: 1rem 0 0.35rem;
	display: flex;
	flex-wrap: wrap;
	align-items: end;
	justify-content: space-between;
	gap: 0.85rem 1.5rem;
}

.rl-footer-dock__kicker {
	margin: 0 0 0.2rem;
	font-family: var(--rl-mono);
	font-size: 0.62rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-footer-dock__lede {
	margin: 0;
	font-size: 0.92rem;
	color: var(--rl-footer-fg);
}

.rl-footer-dock__tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
}

.rl-footer-dock__tab {
	display: grid;
	gap: 0.1rem;
	min-width: 7.5rem;
	padding: 0.55rem 0.75rem;
	border: 1px solid var(--rl-line-strong);
	background: color-mix(in srgb, var(--rl-lift) 72%, transparent);
	color: var(--rl-ink);
	text-align: start;
	cursor: pointer;
	font: inherit;
	transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease;
}

.rl-footer-dock__tab:hover,
.rl-footer-dock__tab:focus-visible {
	border-color: var(--rl-ink);
	color: var(--rl-ink);
	background: color-mix(in srgb, var(--rl-ink) 6%, var(--rl-lift));
	outline: none;
}

.rl-footer-dock__tab.is-active,
.rl-footer-dock__tab[aria-selected="true"] {
	background: var(--rl-signal);
	border-color: var(--rl-signal);
	color: var(--rl-signal-ink);
}

.rl-footer-dock__tab.is-active .rl-footer-dock__tab-label,
.rl-footer-dock__tab[aria-selected="true"] .rl-footer-dock__tab-label {
	color: inherit;
	opacity: 0.78;
}

.rl-footer-dock__tab-title {
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: 0.95rem;
	letter-spacing: -0.02em;
	color: inherit;
}

.rl-footer-dock__tab-label {
	font-family: var(--rl-mono);
	font-size: 0.6rem;
	letter-spacing: 0.04em;
	color: var(--rl-muted);
	opacity: 1;
}

/* Desktop: laptop + product notes as one centered composition */
.rl-footer-dock__body {
	width: min(100% - (var(--rl-pad) * 2), var(--rl-max));
	margin: 0 auto;
	padding: 0.85rem 0 1.15rem;
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(15rem, 0.8fr);
	gap: 1.25rem clamp(1.5rem, 3vw, 2.75rem);
	align-items: center;
	box-sizing: border-box;
}

.rl-laptop-stage--dock {
	width: 100%;
	max-width: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
	overflow: hidden;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.rl-laptop-stage--dock .rl-laptop {
	width: 100%;
	max-width: min(38rem, 100%);
	margin-inline: auto;
	box-sizing: border-box;
}

.rl-laptop-stage--dock .rl-laptop__note {
	padding-bottom: 0.35rem;
	color: var(--rl-muted);
}

.rl-laptop-stage--dock .rl-laptop-stage__glow {
	opacity: 0.25;
}

html[data-rl-theme="light"] .rl-laptop-stage--dock .rl-laptop-stage__glow {
	opacity: 0.35;
	background: radial-gradient(ellipse at center, color-mix(in srgb, var(--rl-signal) 18%, transparent), transparent 70%);
}

.rl-laptop-stage--dock .rl-laptop-stage__floor {
	display: none;
}

.rl-footer-dock__notes {
	min-width: 0;
	padding: 0.35rem 0 0.5rem;
}

.rl-footer-dock__note {
	display: grid;
	gap: 0.55rem;
	align-content: start;
}

.rl-footer-dock__note[hidden] {
	display: none;
}

.rl-footer-dock__notes-kicker {
	margin: 0;
	font-family: var(--rl-mono);
	font-size: 0.62rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	/* Never bare signal/lime as text — unreadable on light, muddy on dark */
	color: var(--rl-muted);
	font-weight: 500;
}

html[data-rl-theme="dark"] .rl-footer-dock__notes-kicker {
	color: color-mix(in srgb, var(--rl-footer-fg) 72%, transparent);
}

.rl-footer-dock__notes-title {
	margin: 0;
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: clamp(1.45rem, 2.2vw, 1.85rem);
	letter-spacing: -0.03em;
	line-height: 1.15;
	color: var(--rl-footer-fg);
}

.rl-footer-dock__notes-label {
	margin: 0;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-footer-dock__notes-body {
	margin: 0.15rem 0 0;
	font-size: 0.95rem;
	line-height: 1.55;
	color: color-mix(in srgb, var(--rl-footer-fg) 82%, transparent);
	max-width: 32ch;
}

.rl-footer-dock__notes-points {
	margin: 0.35rem 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 0.4rem;
}

.rl-footer-dock__notes-points li {
	position: relative;
	padding-inline-start: 0.95rem;
	font-size: 0.86rem;
	line-height: 1.4;
	color: color-mix(in srgb, var(--rl-footer-fg) 78%, transparent);
}

.rl-footer-dock__notes-points li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	top: 0.55em;
	width: 0.35rem;
	height: 0.35rem;
	border-radius: 50%;
	background: var(--rl-signal);
}

.rl-footer-dock__notes-cta {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	margin-top: 0.55rem;
	width: fit-content;
	font-family: var(--rl-mono);
	font-size: 0.72rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--rl-footer-fg);
	border-bottom: 1px solid color-mix(in srgb, var(--rl-footer-fg) 35%, transparent);
	padding-bottom: 0.15rem;
	transition: color 0.2s ease, border-color 0.2s ease;
}

/* Theme-aware: never bare lime on light; keep visited/active consistent */
body.recash-lab-ui a.rl-footer-dock__notes-cta,
body.recash-lab-ui a.rl-footer-dock__notes-cta:link,
body.recash-lab-ui a.rl-footer-dock__notes-cta:visited {
	color: var(--rl-footer-fg);
	border-bottom-color: color-mix(in srgb, var(--rl-footer-fg) 35%, transparent);
	background: transparent;
}

body.recash-lab-ui a.rl-footer-dock__notes-cta:hover,
body.recash-lab-ui a.rl-footer-dock__notes-cta:focus,
body.recash-lab-ui a.rl-footer-dock__notes-cta:focus-visible,
body.recash-lab-ui a.rl-footer-dock__notes-cta:active {
	color: var(--rl-link-hover);
	border-bottom-color: var(--rl-link-hover);
	background: transparent;
	outline: none;
}

body.recash-lab-ui a.rl-footer-dock__notes-cta:focus-visible {
	outline: 2px solid var(--rl-link-hover);
	outline-offset: 3px;
}

html[data-rl-theme="dark"] .rl-footer-dock__tab:not(.is-active):not([aria-selected="true"]) {
	background: color-mix(in srgb, var(--rl-lift) 40%, transparent);
	border-color: color-mix(in srgb, var(--rl-footer-fg) 22%, transparent);
	color: var(--rl-footer-fg);
}

html[data-rl-theme="dark"] .rl-footer-dock__tab:not(.is-active):not([aria-selected="true"]):hover,
html[data-rl-theme="dark"] .rl-footer-dock__tab:not(.is-active):not([aria-selected="true"]):focus-visible {
	border-color: color-mix(in srgb, var(--rl-footer-fg) 45%, transparent);
	color: #f4f6f8;
	background: color-mix(in srgb, var(--rl-footer-fg) 8%, transparent);
}

html[data-rl-theme="dark"] .rl-footer-dock__tab:not(.is-active):not([aria-selected="true"]) .rl-footer-dock__tab-label {
	color: color-mix(in srgb, var(--rl-footer-fg) 72%, transparent);
}

@media (max-width: 900px) {
	.rl-footer-dock__body {
		display: block;
		width: min(100% - (max(1.25rem, var(--rl-pad)) * 2), var(--rl-max));
		padding: 0.75rem 0 0.5rem;
	}

	.rl-footer-dock__notes {
		display: none;
	}

	.rl-laptop-stage--dock {
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		overflow: hidden;
		box-sizing: border-box;
	}

	.rl-laptop-stage--dock .rl-laptop {
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
	}
}

@media (max-width: 720px) {
	.rl-footer-dock__bar {
		padding-top: 0.85rem;
	}

	.rl-footer-dock__tabs {
		width: 100%;
		display: grid;
		grid-template-columns: repeat(3, minmax(0, 1fr));
		gap: 0.35rem;
	}

	.rl-footer-dock__tab {
		min-width: 0;
		padding: 0.45rem 0.4rem;
	}

	.rl-footer-dock__tab-label {
		display: none;
	}

	.rl-laptop-stage--dock .rl-laptop__lid {
		padding: 0;
	}

	.rl-laptop-stage--dock .rl-laptop__base {
		margin-inline: 0;
	}

	.rl-laptop-stage--dock .rl-laptop__rig {
		filter: drop-shadow(0 14px 24px rgba(0, 0, 0, 0.28));
	}
}

.rl-laptop__slide {
	position: absolute;
	inset: 0;
}

.rl-laptop__slide[hidden] {
	display: none !important;
}

.rl-laptop__slide .rl-laptop__shot,
.rl-laptop__slide .rl-laptop__frame {
	position: absolute;
	inset: 0;
}

.rl-laptop__slide .rl-laptop__frame {
	width: 1920px;
	height: 1080px;
	inset: auto;
	top: 0;
	inset-inline-start: 0;
}

/* Footer */
.rl-footer {
	background: var(--rl-footer-bg);
	color: var(--rl-footer-fg);
	padding: clamp(2.25rem, 4vw, 3.5rem) var(--rl-pad) 2rem;
	margin-top: 0;
	border-top: 0;
}

body.recash-lab-ui .rl-shell {
	padding-bottom: 0;
}

/* Contact / About keep space above the Live products dock */
body.recash-lab-ui .rl-shell.rl-contact,
body.recash-lab-ui .rl-shell.rl-about {
	padding-bottom: clamp(4.5rem, 9vw, 7rem);
}

.rl-footer__inner {
	width: min(100%, var(--rl-max));
	margin-inline: auto;
	display: grid;
	gap: 2.25rem;
}

.rl-footer__top {
	display: grid;
	grid-template-columns: minmax(0, 1.15fr) minmax(0, 1.6fr);
	gap: clamp(1.75rem, 4vw, 3rem);
	align-items: start;
}

.rl-footer__brand .rl-logo {
	margin-bottom: 0.85rem;
}

.rl-footer__tagline {
	margin: 0 0 0.65rem;
	max-width: 28rem;
	line-height: 1.5;
	color: var(--rl-muted);
	font-size: 0.98rem;
}

.rl-footer__presence {
	margin: 0;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--rl-ink-2);
}

.rl-footer__cols {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1.25rem 1.5rem;
}

.rl-footer__heading {
	margin: 0 0 0.75rem;
	font-family: var(--rl-mono);
	font-size: 0.66rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-footer__list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.55rem;
}

.rl-footer__list a {
	font-size: 0.92rem;
	color: var(--rl-footer-fg);
	text-decoration: none;
	line-height: 1.3;
}

.rl-footer__list a:hover,
.rl-footer__list a:focus-visible {
	color: var(--rl-link-hover);
}

.rl-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	gap: 0.65rem 1.25rem;
	padding-top: 1.35rem;
	border-top: 1px solid var(--rl-line);
}

.rl-footer__copy,
.rl-footer__meta {
	margin: 0;
	font-family: var(--rl-mono);
	font-size: 0.7rem;
	letter-spacing: 0.04em;
	color: var(--rl-muted);
}

.rl-footer__sep {
	margin: 0 0.35rem;
	opacity: 0.55;
}

/* About page */
.rl-about {
	width: min(100% - (var(--rl-pad) * 2), var(--rl-max));
	margin: 0 auto;
	padding: clamp(2rem, 5vw, 3.5rem) 0 clamp(4.5rem, 9vw, 7rem);
}

.rl-about__hero {
	position: relative;
	isolation: isolate;
	padding: clamp(2.5rem, 7vw, 4.25rem) 0 clamp(2rem, 4vw, 2.75rem);
	margin-bottom: clamp(2rem, 4vw, 3rem);
	border-bottom: 1px solid var(--rl-line-strong);
	overflow: hidden;
}

.rl-about__hero-glow {
	position: absolute;
	inset: -20% -10% auto -10%;
	height: min(420px, 70%);
	z-index: -1;
	pointer-events: none;
	background:
		radial-gradient(ellipse 55% 70% at 12% 40%, var(--rl-glow-signal), transparent 70%),
		radial-gradient(ellipse 45% 60% at 88% 20%, var(--rl-glow-ice), transparent 68%);
	opacity: 1;
}

.rl-about__brand {
	margin: 0 0 0.65rem;
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: clamp(2.8rem, 8vw, 5.2rem);
	letter-spacing: -0.05em;
	line-height: 0.95;
	color: var(--rl-ink);
}

.rl-about__title {
	margin: 0 0 0.85rem;
	max-width: 22ch;
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: clamp(1.35rem, 2.8vw, 1.85rem);
	letter-spacing: -0.03em;
	line-height: 1.2;
	color: var(--rl-ink-2);
}

.rl-about__lede {
	margin: 0 0 1.5rem;
	max-width: 36rem;
	font-size: 1.05rem;
	line-height: 1.55;
	color: var(--rl-muted);
}

.rl-about__cta {
	display: flex;
	flex-wrap: wrap;
	gap: 0.65rem;
	align-items: center;
}

.rl-about__tracks {
	list-style: none;
	margin: 0 0 clamp(0.5rem, 2vw, 1rem);
	padding: 0.85rem 0 1.1rem;
	display: flex;
	flex-wrap: wrap;
	gap: 0.35rem 0;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--rl-muted);
	border-bottom: 1px solid var(--rl-line);
}

.rl-about__tracks li:not(:last-child)::after {
	content: "·";
	margin: 0 0.65rem;
	opacity: 0.45;
}

.rl-about__block {
	padding: clamp(1.75rem, 3.5vw, 2.5rem) 0;
	border-bottom: 1px solid var(--rl-line);
}

.rl-about__kicker {
	margin: 0 0 0.55rem;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--rl-muted);
	font-weight: 500;
}

.rl-about__kicker--on-dark {
	color: rgba(244, 246, 248, 0.55);
}

.rl-about__heading {
	margin: 0 0 0.85rem;
	max-width: 28ch;
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: clamp(1.45rem, 3vw, 1.9rem);
	letter-spacing: -0.035em;
	line-height: 1.15;
	color: var(--rl-ink);
}

.rl-about__copy {
	margin: 0;
	max-width: 40rem;
	font-size: 1.02rem;
	line-height: 1.6;
	color: var(--rl-ink-2);
}

.rl-about__list {
	list-style: none;
	margin: 1.25rem 0 0;
	padding: 0;
	display: grid;
	gap: 0.65rem;
}

.rl-about__item {
	position: relative;
	display: grid;
	gap: 0.35rem;
	padding: 1.15rem 2.75rem 1.15rem 1.15rem;
	border: 1px solid var(--rl-line-strong);
	background: var(--rl-panel);
	color: inherit;
	text-decoration: none;
	transition: border-color 0.22s var(--rl-ease), background 0.22s var(--rl-ease), transform 0.22s var(--rl-ease);
}

.rl-about__item:hover,
.rl-about__item:focus-visible {
	border-color: var(--rl-ink);
	background: var(--rl-lift);
	outline: none;
}

@media (hover: hover) and (pointer: fine) {
	.rl-about__item:hover {
		transform: translateY(-2px);
	}
}

.rl-about__item--oss {
	grid-template-columns: auto 1fr;
	align-items: start;
	column-gap: 0.9rem;
	padding-inline-start: 1rem;
}

.rl-about__item-icon {
	display: grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	margin-top: 0.1rem;
	border: 1px solid var(--rl-line);
	color: var(--rl-ink);
	background: color-mix(in srgb, var(--rl-panel) 70%, var(--rl-signal) 12%);
}

.rl-about__item-stack {
	display: grid;
	gap: 0.35rem;
	min-width: 0;
}

.rl-about__item-top {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 0.4rem 0.85rem;
}

.rl-about__item-name {
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: 1.15rem;
	letter-spacing: -0.025em;
	color: var(--rl-ink);
}

.rl-about__item-role {
	font-family: var(--rl-mono);
	font-size: 0.64rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-about__item-body {
	font-size: 0.95rem;
	line-height: 1.45;
	color: var(--rl-muted);
	max-width: 38rem;
}

.rl-about__item-go {
	position: absolute;
	top: 50%;
	right: 1rem;
	display: grid;
	place-items: center;
	color: var(--rl-ink);
	opacity: 0.35;
	transform: translateY(-50%);
	transition: opacity 0.2s ease, transform 0.22s var(--rl-ease);
}

.rl-about__item:hover .rl-about__item-go,
.rl-about__item:focus-visible .rl-about__item-go {
	opacity: 1;
	transform: translateY(-50%) translateX(3px);
}

.rl-about__spine {
	margin: clamp(1.75rem, 3.5vw, 2.5rem) 0;
	padding: clamp(1.85rem, 4vw, 2.75rem) clamp(1.35rem, 3vw, 2.25rem);
	background: #0b0d10;
	color: #f4f6f8;
	position: relative;
	overflow: hidden;
	border: 1px solid rgba(244, 246, 248, 0.1);
}

.rl-about__spine::before {
	content: "";
	position: absolute;
	inset: 0;
	pointer-events: none;
	background:
		radial-gradient(ellipse 55% 90% at 0% 40%, rgba(212, 255, 79, 0.18), transparent 62%),
		radial-gradient(ellipse 45% 70% at 100% 20%, rgba(143, 217, 255, 0.12), transparent 55%);
}

.rl-about__spine-inner {
	position: relative;
	max-width: 38rem;
}

.rl-about__spine-title {
	margin: 0 0 0.85rem;
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: clamp(1.75rem, 4vw, 2.55rem);
	letter-spacing: -0.045em;
	line-height: 1.05;
	/* Light ink on dark card — never theme --rl-ink */
	color: #f4f6f8;
	background: linear-gradient(105deg, #ffffff 0%, #f4f6f8 48%, #d4ff4f 160%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

.rl-about__spine-copy {
	margin: 0 0 1.45rem;
	font-size: 1.05rem;
	line-height: 1.55;
	color: rgba(244, 246, 248, 0.78);
	max-width: 42ch;
}

.rl-about__close {
	padding: clamp(2rem, 4vw, 3rem) 0 clamp(1.5rem, 3vw, 2.25rem);
	display: grid;
	gap: 1.15rem;
	justify-items: start;
}

.rl-about__close-copy {
	margin: 0;
	max-width: 32rem;
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: clamp(1.25rem, 2.6vw, 1.55rem);
	letter-spacing: -0.03em;
	line-height: 1.25;
	color: var(--rl-ink);
}

html[dir="rtl"] .rl-about__item {
	padding: 1.15rem 1.15rem 1.15rem 2.75rem;
}

html[dir="rtl"] .rl-about__item-go {
	right: auto;
	left: 1rem;
}

html[dir="rtl"] .rl-about__item:hover .rl-about__item-go,
html[dir="rtl"] .rl-about__item:focus-visible .rl-about__item-go {
	transform: translateY(-50%) translateX(-3px);
}

@media (prefers-reduced-motion: reduce) {
	.rl-about__item,
	.rl-about__item-go {
		transition: none;
	}

	.rl-about__item:hover {
		transform: none;
	}
}

/* Contact page */
.rl-contact {
	width: min(100% - (var(--rl-pad) * 2), var(--rl-max));
	margin: 0 auto;
	padding: clamp(2.5rem, 6vw, 4.5rem) 0 clamp(4.5rem, 9vw, 7rem);
}

.rl-contact__head {
	max-width: 40rem;
	margin-bottom: 2.25rem;
	padding-bottom: 1.35rem;
	border-bottom: 1px solid var(--rl-line-strong);
}

.rl-contact__title {
	margin: 0 0 0.75rem;
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: clamp(2.2rem, 5vw, 3.4rem);
	letter-spacing: -0.04em;
	line-height: 1.05;
	color: var(--rl-ink);
}

.rl-contact__lede {
	margin: 0;
	max-width: 36rem;
	font-size: 1.08rem;
	line-height: 1.55;
	color: var(--rl-muted);
}

.rl-contact__grid {
	display: grid;
	grid-template-columns: minmax(0, 1.2fr) minmax(0, 0.9fr);
	gap: 1rem;
	align-items: start;
}

.rl-contact__panel {
	padding: 1.35rem 1.4rem 1.5rem;
	border: 1px solid var(--rl-line-strong);
	background: var(--rl-panel);
}

.rl-contact__panel-title {
	margin: 0 0 1.15rem;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--rl-muted);
	font-weight: 500;
}

.rl-contact__channels {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 1.15rem;
}

.rl-contact__channel {
	display: grid;
	gap: 0.2rem;
	padding-bottom: 1.05rem;
	border-bottom: 1px solid var(--rl-line);
}

.rl-contact__channel:last-child {
	padding-bottom: 0;
	border-bottom: 0;
}

.rl-contact__channel-label {
	font-family: var(--rl-mono);
	font-size: 0.66rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-contact__channel-value {
	font-family: var(--rl-display);
	font-size: 1.15rem;
	font-weight: 700;
	letter-spacing: -0.02em;
	color: var(--rl-ink);
	text-decoration: none;
}

.rl-contact__channel-value:hover,
.rl-contact__channel-value:focus-visible {
	color: var(--rl-link-hover);
}

.rl-contact__channel-note {
	font-size: 0.9rem;
	color: var(--rl-muted);
	line-height: 1.4;
}

.rl-contact__cta-wrap {
	margin: 1.5rem 0 0;
}

.rl-contact__facts {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0.95rem;
}

.rl-contact__facts li {
	display: grid;
	gap: 0.2rem;
}

.rl-contact__fact-key {
	font-family: var(--rl-mono);
	font-size: 0.64rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-contact__fact-val {
	font-size: 0.98rem;
	line-height: 1.4;
	color: var(--rl-ink);
}

.rl-contact__aside-note {
	margin: 1.35rem 0 0;
	padding-top: 1.1rem;
	border-top: 1px solid var(--rl-line);
	font-size: 0.92rem;
	line-height: 1.5;
	color: var(--rl-muted);
}

@media (max-width: 900px) {
	.rl-footer__top {
		grid-template-columns: 1fr;
	}

	.rl-footer__cols {
		grid-template-columns: 1fr 1fr;
	}

	.rl-contact__grid {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 560px) {
	.rl-footer__cols {
		grid-template-columns: 1fr;
	}

	.rl-footer__bottom {
		flex-direction: column;
		align-items: flex-start;
	}
}

@media (max-width: 960px) {
	.rl-nav__links {
		display: none;
	}

	.rl-nav__burger {
		display: inline-block;
	}

	.rl-tool__label {
		display: none;
	}

	.rl-section__head {
		flex-direction: column;
		align-items: flex-start;
	}

	.rl-split {
		grid-template-columns: 1fr;
	}

	.rl-split .rl-research {
		border-inline-end: 0;
		border-bottom: 1px solid var(--rl-line);
	}

	.rl-section__head .rl-pin {
		width: 100%;
		min-width: 0;
	}

	.rl-index__link {
		grid-template-columns: 2.25rem 1fr;
		grid-template-areas:
			"num main"
			"media media";
		align-items: start;
		gap: 0.75rem 0.85rem;
	}

	.rl-index__num {
		grid-area: num;
		padding-top: 0.2rem;
	}

	.rl-index__main {
		grid-area: main;
	}

	.rl-index__media {
		grid-area: media;
		width: 100%;
		height: clamp(7.5rem, 42vw, 11rem);
	}

	.rl-index__go {
		display: none;
	}

	.rl-spec {
		grid-template-columns: 1fr;
	}

	.rl-segment--split {
		grid-template-columns: 1fr;
	}

	.rl-hero__scroll {
		position: static;
		inset: auto;
		flex-direction: row;
		justify-content: center;
		gap: 0.55rem;
		margin-top: 0.25rem;
		order: 3;
		padding: 0.75rem 0 0;
	}

	.rl-hero__scroll-line {
		width: 2.5rem;
		height: 1px;
		background: linear-gradient(to right, var(--rl-signal), transparent);
	}

	.rl-posts {
		gap: 0.75rem;
		padding-bottom: 0.35rem;
	}

	.rl-posts__item {
		flex-basis: min(16.5rem, 84vw);
	}
}

/* Mobile: stack copy → map. Never overlay text on nodes. */
@media (max-width: 900px) {
	.rl-hero {
		min-height: auto;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		gap: 1.75rem;
		padding-top: 1.25rem;
		padding-bottom: 2.25rem;
		overflow: visible;
	}

	.rl-hero__content {
		order: 1;
		width: 100%;
		z-index: 2;
	}

	.rl-hero__visual {
		order: 2;
		position: relative;
		inset: auto;
		z-index: 1;
		min-height: 0;
		width: 100%;
		padding: 1rem 0 0;
		border-top: 1px solid rgba(244, 246, 248, 0.12);
		pointer-events: auto;
	}

	/* Keep WebGL / preview off the phone layout entirely */
	.rl-hero__stage,
	.rl-demo-preview,
	.rl-hero__tip {
		display: none !important;
	}

	.rl-hero__grain {
		opacity: 0.1;
		mix-blend-mode: normal;
	}

	.rl-hero__veil {
		background:
			radial-gradient(420px 180px at 100% 0%, rgba(212, 255, 79, 0.1), transparent 70%),
			linear-gradient(180deg, transparent 0%, rgba(11, 13, 16, 0.2) 100%);
	}

	.rl-graph-fallback {
		position: relative;
		inset: auto;
		display: grid !important;
		width: 100%;
		gap: 0.65rem;
		justify-items: stretch;
	}

	.rl-graph-fallback[hidden] {
		display: grid !important;
	}

	.rl-graph-fallback__svg {
		width: 100%;
		max-width: none;
		background: rgba(18, 24, 32, 0.55);
		border: 1px solid rgba(244, 246, 248, 0.1);
		border-radius: 2px;
	}

	.rl-hero__value {
		max-width: 22ch;
		margin-bottom: 1.35rem;
		font-size: clamp(1.2rem, 5.6vw, 1.55rem);
	}

	.rl-hero__brand {
		font-size: clamp(3.6rem, 18vw, 5.5rem);
		margin-bottom: 0.7rem;
	}

	.rl-hero__cta {
		display: grid;
		grid-template-columns: 1fr;
		gap: 0.55rem;
		margin-bottom: 0;
	}

	.rl-hero__cta .rl-btn {
		width: 100%;
	}

	.rl-hero__legend {
		justify-content: flex-start;
		margin: 0;
	}

	.rl-hero__legend-rich {
		display: none;
	}

	.rl-hero__legend-lite {
		display: inline;
	}

	.rl-hero__products {
		display: none !important;
	}

	.rl-hero__scroll {
		order: 3;
		align-self: flex-start;
	}
}

@media (min-width: 901px) {
	.rl-hero__products {
		display: none;
	}

	.rl-graph-fallback__label {
		display: none;
	}

	.rl-hero__legend-lite {
		display: none;
	}

	.rl-hero__legend-rich {
		display: inline;
	}

	.rl-hero[data-rl-graph-mode="lite"] .rl-hero__legend-lite {
		display: inline;
	}

	.rl-hero[data-rl-graph-mode="lite"] .rl-hero__legend-rich {
		display: none;
	}

	/* Desktop: copy sits over left; constellation owns the right field */
	.rl-hero__content {
		max-width: min(40rem, 46vw);
	}

	.rl-hero__veil {
		background:
			linear-gradient(105deg, rgba(11, 13, 16, 0.92) 0%, rgba(11, 13, 16, 0.55) 38%, rgba(11, 13, 16, 0.28) 100%),
			radial-gradient(700px 320px at 72% 35%, rgba(212, 255, 79, 0.12), transparent 62%);
	}
}

@media (min-width: 961px) {
	.rl-nav__drawer {
		display: none !important;
	}
}

/* Below-fold: avoid content-visibility — it paints horizontal seams while scrolling */

@media (prefers-reduced-motion: reduce) {
	.rl-btn,
	.rl-index__link,
	.rl-index__go,
	.rl-demo-preview {
		transition: none;
	}

	.rl-hero__grain {
		display: none;
	}
}

/* Orchestration Lab — inference map */
.rl-orch {
	margin: 0 0 2.75rem;
	padding: 1.75rem 0 0;
	border-top: 1px solid var(--rl-line-strong);
}

.rl-orch__head {
	max-width: 42rem;
	margin-bottom: 1.5rem;
}

.rl-orch__title {
	margin: 0 0 0.65rem;
	font-family: var(--rl-display);
	font-size: clamp(1.45rem, 2.8vw, 1.95rem);
	letter-spacing: -0.03em;
	line-height: 1.15;
	color: var(--rl-ink);
}

.rl-orch__lede {
	margin: 0;
	color: var(--rl-muted);
	line-height: 1.5;
}

.rl-sdk-showcase {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: 1.25rem 1.5rem;
	align-items: center;
	margin: 0 0 1.75rem;
	padding: 1.35rem 1.4rem 1.5rem;
	border: 1px solid color-mix(in srgb, var(--rl-signal) 50%, var(--rl-line-strong));
	background:
		radial-gradient(520px 220px at 0% 50%, color-mix(in srgb, var(--rl-signal) 18%, transparent), transparent 68%),
		radial-gradient(380px 180px at 100% 0%, color-mix(in srgb, var(--rl-ice) 14%, transparent), transparent 60%),
		var(--rl-panel);
	position: relative;
	overflow: hidden;
}

.rl-sdk-showcase::after {
	content: "";
	position: absolute;
	inset-inline-end: 0;
	top: 0;
	bottom: 0;
	width: 3px;
	background: linear-gradient(180deg, var(--rl-signal), var(--rl-ice));
	opacity: 0.85;
}

.rl-sdk-showcase__visual {
	position: relative;
	width: 5.5rem;
	height: 5.5rem;
	display: grid;
	place-items: center;
}

.rl-sdk-showcase__mark {
	position: relative;
	z-index: 1;
	display: grid;
	place-items: center;
	width: 3.75rem;
	height: 3.75rem;
	background: var(--rl-signal);
	color: var(--rl-signal-ink);
	border: 1px solid color-mix(in srgb, var(--rl-signal) 70%, #10140a);
}

.rl-sdk-showcase__ring {
	position: absolute;
	inset: 0.15rem;
	border: 1px solid color-mix(in srgb, var(--rl-signal) 45%, transparent);
	border-radius: 50%;
	animation: rl-orbit-spin 14s linear infinite;
}

.rl-sdk-showcase__ring--2 {
	inset: -0.35rem;
	border-style: dashed;
	opacity: 0.55;
	animation-duration: 22s;
	animation-direction: reverse;
}

.rl-sdk-showcase__kicker {
	margin: 0 0 0.35rem;
	font-family: var(--rl-mono);
	font-size: 0.64rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--rl-dev);
}

.rl-sdk-showcase__title {
	margin: 0 0 0.45rem;
	font-family: var(--rl-display);
	font-size: clamp(1.4rem, 2.6vw, 1.85rem);
	letter-spacing: -0.03em;
	line-height: 1.1;
	color: var(--rl-ink);
}

.rl-sdk-showcase__title a {
	color: inherit;
	text-decoration: none;
}

.rl-sdk-showcase__title a:hover {
	color: var(--rl-dev);
}

.rl-sdk-showcase__copy {
	margin: 0 0 0.75rem;
	color: var(--rl-muted);
	line-height: 1.45;
	max-width: 42rem;
}

.rl-sdk-showcase__body > .rl-copy-cmd {
	margin: 0 0 0.85rem;
}

.rl-sdk-showcase__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem;
}

.rl-orch__stage {
	position: relative;
	padding: clamp(1.25rem, 2.5vw, 1.85rem);
	border: 1px solid var(--rl-line-strong);
	background:
		radial-gradient(circle at 1px 1px, var(--rl-dot) 1px, transparent 0) 0 0 / 18px 18px,
		linear-gradient(180deg, color-mix(in srgb, var(--rl-panel) 72%, transparent), var(--rl-panel));
	overflow: hidden;
}

.rl-orch__map {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 1.15rem 1.25rem;
	position: relative;
	z-index: 1;
	align-items: stretch;
}

.rl-orch__hub,
.rl-orch__join,
.rl-orch__col--out {
	grid-column: 1 / -1;
}

.rl-orch__col {
	display: flex;
	flex-direction: column;
	min-width: 0;
}

.rl-orch__col-label {
	margin: 0 0 0.65rem;
	display: flex;
	align-items: center;
	gap: 0.55rem;
	font-family: var(--rl-mono);
	font-size: 0.66rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-orch__step {
	display: inline-grid;
	place-items: center;
	min-width: 1.85rem;
	height: 1.35rem;
	padding: 0 0.35rem;
	border: 1px solid var(--rl-line-strong);
	background: var(--rl-lift);
	color: var(--rl-ink);
	font-size: 0.62rem;
	letter-spacing: 0.06em;
}

.rl-orch__step--hub {
	background: var(--rl-signal);
	border-color: color-mix(in srgb, var(--rl-signal) 55%, #10140a);
	color: var(--rl-signal-ink);
}

.rl-orch__node {
	position: relative;
	flex: 1;
	padding: 1.35rem 1.35rem 1.45rem;
	border: 1px solid var(--rl-line-strong);
	background: color-mix(in srgb, var(--rl-panel) 96%, var(--rl-canvas));
	transition: border-color 0.25s var(--rl-ease), transform 0.25s var(--rl-ease), box-shadow 0.25s var(--rl-ease);
}

.rl-orch__node:hover {
	border-color: color-mix(in srgb, var(--rl-ink) 42%, var(--rl-line-strong));
	transform: translateY(-2px);
	box-shadow: 0 12px 28px var(--rl-shadow);
}

.rl-orch__node--local {
	border-color: color-mix(in srgb, var(--rl-dev) 58%, var(--rl-line-strong));
	background:
		linear-gradient(90deg, color-mix(in srgb, var(--rl-dev) 78%, transparent) 0 3px, transparent 3px),
		linear-gradient(135deg, color-mix(in srgb, var(--rl-dev) 8%, transparent), transparent 42%),
		color-mix(in srgb, var(--rl-panel) 96%, var(--rl-canvas));
}

.rl-orch__node--hosted {
	border-color: color-mix(in srgb, var(--rl-ice) 55%, var(--rl-line-strong));
	background:
		linear-gradient(90deg, color-mix(in srgb, var(--rl-ice) 75%, transparent) 0 3px, transparent 3px),
		linear-gradient(135deg, color-mix(in srgb, var(--rl-ice) 10%, transparent), transparent 42%),
		color-mix(in srgb, var(--rl-panel) 96%, var(--rl-canvas));
}

.rl-orch__node--hub {
	border-color: color-mix(in srgb, var(--rl-dev) 35%, var(--rl-line-strong));
	background:
		radial-gradient(680px 220px at 12% 0%, color-mix(in srgb, var(--rl-dev) 14%, transparent), transparent 55%),
		radial-gradient(420px 180px at 95% 100%, color-mix(in srgb, var(--rl-signal) 12%, transparent), transparent 50%),
		color-mix(in srgb, var(--rl-panel) 88%, var(--rl-dev));
	padding: 1.45rem 1.45rem 1.55rem;
}

.rl-orch__node--out {
	background:
		linear-gradient(90deg, color-mix(in srgb, var(--rl-ink) 55%, transparent) 0 3px, transparent 3px),
		linear-gradient(180deg, color-mix(in srgb, var(--rl-ice) 7%, transparent), transparent 55%),
		color-mix(in srgb, var(--rl-panel) 96%, var(--rl-canvas));
}

.rl-orch__node-top {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	margin-bottom: 0.65rem;
}

.rl-orch__icon {
	display: grid;
	place-items: center;
	width: 2.35rem;
	height: 2.35rem;
	flex: 0 0 auto;
	border: 1px solid var(--rl-line-strong);
	background: var(--rl-canvas);
	color: var(--rl-ink);
}

.rl-orch__node--local .rl-orch__icon {
	border-color: color-mix(in srgb, var(--rl-dev) 45%, var(--rl-line));
	color: var(--rl-dev);
	background: color-mix(in srgb, var(--rl-dev) 10%, var(--rl-canvas));
}

.rl-orch__node--hosted .rl-orch__icon {
	border-color: color-mix(in srgb, var(--rl-ice) 50%, var(--rl-line));
	color: color-mix(in srgb, var(--rl-ice) 35%, var(--rl-ink));
	background: color-mix(in srgb, var(--rl-ice) 12%, var(--rl-canvas));
}

.rl-orch__icon--hub {
	background: var(--rl-signal);
	border-color: color-mix(in srgb, var(--rl-signal) 60%, #10140a);
	color: var(--rl-signal-ink);
}

.rl-orch__node-kicker {
	font-family: var(--rl-mono);
	font-size: 0.64rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-orch__node strong {
	display: block;
	font-family: var(--rl-display);
	font-size: clamp(1.15rem, 2vw, 1.35rem);
	letter-spacing: -0.025em;
	line-height: 1.15;
	margin-bottom: 0.55rem;
}

.rl-orch__node > p {
	margin: 0 0 1rem;
	color: var(--rl-muted);
	line-height: 1.5;
	font-size: 0.95rem;
}

.rl-orch__chips {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
}

.rl-orch__chips li {
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.04em;
	padding: 0.35rem 0.6rem;
	border: 1px solid var(--rl-line-strong);
	background: color-mix(in srgb, var(--rl-canvas) 78%, transparent);
	color: var(--rl-ink);
}

/* Ports live in join rails only — never overlapping card edges/text */
.rl-orch__port {
	display: inline-grid;
	place-items: center;
	min-height: 1.2rem;
	padding: 0.15rem 0.45rem;
	font-family: var(--rl-mono);
	font-size: 0.58rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	line-height: 1;
	color: var(--rl-ink);
	background: var(--rl-lift);
	border: 1px solid var(--rl-line-strong);
	box-shadow: 0 0 0 3px var(--rl-canvas);
	position: relative;
	z-index: 2;
}

.rl-orch__stem {
	display: block;
	width: 1px;
	height: 0.85rem;
	margin: 0 auto;
	background: repeating-linear-gradient(
		180deg,
		color-mix(in srgb, var(--rl-ink) 55%, transparent) 0 3px,
		transparent 3px 6px
	);
}

/* Connection bands — labels sit above dashed routes with solid stage backing */
.rl-orch__join {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0.55rem;
	padding: 0.35rem 0.5rem;
	min-height: 4.5rem;
	position: relative;
	z-index: 3;
}

.rl-orch__join-label {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	margin: 0;
	padding: 0.35rem 0.75rem;
	font-family: var(--rl-mono);
	font-size: 0.62rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--rl-ink);
	white-space: nowrap;
	background: var(--rl-lift);
	border: 1px solid var(--rl-line-strong);
	position: relative;
	z-index: 4;
	box-shadow: 0 0 0 4px var(--rl-canvas);
}

.rl-orch__join--merge {
	gap: 0.65rem;
	padding: 0.55rem 0.75rem 0.7rem;
}

.rl-orch__join-fork {
	display: grid;
	grid-template-columns: 1fr 1fr;
	width: min(100%, 36rem);
	gap: 1.25rem;
}

.rl-orch__join-leg {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.35rem;
}

.rl-orch__join-bridge {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.65rem;
	width: min(100%, 28rem);
}

.rl-orch__bridge-line {
	flex: 1;
	height: 1px;
	min-width: 1.5rem;
	background: repeating-linear-gradient(
		90deg,
		color-mix(in srgb, var(--rl-ink) 50%, transparent) 0 4px,
		transparent 4px 8px
	);
}

.rl-orch__join-sink {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.35rem;
}

.rl-orch__join--down {
	gap: 0.45rem;
	padding: 0.7rem 0.5rem 0.85rem;
	min-height: 5rem;
}

.rl-orch__join--down .rl-orch__stem {
	height: 1rem;
}

.rl-orch__metrics {
	list-style: none;
	margin: 0 0 1.15rem;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.7rem;
}

.rl-orch__metrics li {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	padding: 0.85rem 0.9rem 0.95rem;
	border: 1px solid var(--rl-line-strong);
	background: color-mix(in srgb, var(--rl-canvas) 62%, transparent);
	position: relative;
	overflow: hidden;
}

.rl-orch__metrics li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	top: 0;
	bottom: 0;
	width: 2px;
	background: var(--rl-dev);
	opacity: 0.8;
}

.rl-orch__metrics li:nth-child(2)::before {
	background: var(--rl-ice);
}

.rl-orch__metrics li:nth-child(3)::before {
	background: var(--rl-signal);
}

.rl-orch__metrics li:nth-child(4)::before {
	background: var(--rl-done);
}

.rl-orch__metric-key {
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--rl-ink);
}

.rl-orch__metrics em {
	font-style: normal;
	font-size: 0.86rem;
	color: var(--rl-muted);
	line-height: 1.35;
}

.rl-orch__sdk {
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem;
}

.rl-orch__consumers {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.rl-orch__consumers a,
.rl-orch__consumers span {
	display: inline-flex;
	align-items: center;
	min-height: 2rem;
	padding: 0.35rem 0.75rem;
	font-family: var(--rl-mono);
	font-size: 0.72rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	border: 1px solid var(--rl-line-strong);
	color: var(--rl-ink);
	background: var(--rl-canvas);
}

.rl-orch__consumers a:hover {
	border-color: var(--rl-ink);
	background: color-mix(in srgb, var(--rl-signal) 35%, var(--rl-canvas));
}

@media (min-width: 960px) {
	.rl-orch__map {
		grid-template-columns: 1fr 1fr;
		grid-template-areas:
			"local hosted"
			"join join"
			"hub hub"
			"join2 join2"
			"out out";
		gap: 1.35rem 1.35rem;
	}

	.rl-orch__col:first-child {
		grid-area: local;
	}

	.rl-orch__col:nth-child(2) {
		grid-area: hosted;
	}

	.rl-orch__join--merge {
		grid-area: join;
	}

	.rl-orch__hub {
		grid-area: hub;
	}

	.rl-orch__join--down {
		grid-area: join2;
	}

	.rl-orch__col--out {
		grid-area: out;
	}

	.rl-orch__metrics {
		grid-template-columns: repeat(4, minmax(0, 1fr));
		gap: 0.75rem;
	}

	.rl-orch__join-fork {
		width: min(100%, 42rem);
		gap: clamp(4rem, 18vw, 12rem);
	}
}

@media (max-width: 640px) {
	.rl-orch__map {
		grid-template-columns: 1fr;
		gap: 1rem;
	}

	.rl-orch__metrics {
		grid-template-columns: 1fr;
	}

	.rl-sdk-showcase {
		grid-template-columns: 1fr;
	}

	.rl-sdk-showcase__visual {
		width: 4.5rem;
		height: 4.5rem;
	}

	.rl-orch__stage {
		padding: 1rem;
	}

	.rl-orch__join-fork {
		grid-template-columns: 1fr 1fr;
		gap: 1rem;
		width: 100%;
	}

	.rl-orch__join-label {
		white-space: normal;
		text-align: center;
		max-width: 14rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.rl-orch__node:hover {
		transform: none;
	}

	.rl-sdk-showcase__ring {
		animation: none;
	}
}

/* Orchestration Lab — Narrative brief */
.rl-narrative {
	display: grid;
	gap: 1.25rem;
}

.rl-narrative__lead {
	padding: 1.35rem 1.4rem 1.45rem;
	border: 1px solid color-mix(in srgb, var(--rl-signal) 45%, var(--rl-line-strong));
	background:
		radial-gradient(520px 180px at 0% 0%, color-mix(in srgb, var(--rl-signal) 16%, transparent), transparent 65%),
		var(--rl-panel);
	position: relative;
}

.rl-narrative__lead::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	top: 0;
	bottom: 0;
	width: 3px;
	background: var(--rl-signal);
}

.rl-narrative__eyebrow {
	margin: 0 0 0.45rem;
	font-family: var(--rl-mono);
	font-size: 0.64rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--rl-dev);
}

.rl-narrative__lead-text {
	margin: 0;
	max-width: 46rem;
	font-family: var(--rl-display);
	font-size: clamp(1.15rem, 2.2vw, 1.4rem);
	letter-spacing: -0.02em;
	line-height: 1.35;
	color: var(--rl-ink);
}

.rl-narrative__chapters {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	gap: 0;
}

.rl-narrative__chapter {
	display: grid;
	grid-template-columns: 2.5rem minmax(0, 1fr);
	gap: 0.85rem 1rem;
	align-items: stretch;
}

.rl-narrative__index {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top: 0.15rem;
}

.rl-narrative__num {
	display: inline-grid;
	place-items: center;
	width: 2rem;
	height: 2rem;
	flex: 0 0 auto;
	font-family: var(--rl-mono);
	font-size: 0.72rem;
	letter-spacing: 0.06em;
	border: 1px solid var(--rl-line-strong);
	background: var(--rl-canvas);
	color: var(--rl-ink);
	z-index: 1;
}

.rl-narrative__rail {
	flex: 1;
	width: 1px;
	margin-top: 0.45rem;
	min-height: 1.5rem;
	background: repeating-linear-gradient(
		180deg,
		color-mix(in srgb, var(--rl-ink) 40%, transparent) 0 3px,
		transparent 3px 7px
	);
}

.rl-narrative__chapter:last-child .rl-narrative__rail {
	display: none;
}

.rl-narrative__card {
	margin-bottom: 1.15rem;
	padding: 1.3rem 1.3rem 1.4rem;
	border: 1px solid var(--rl-line-strong);
	background: color-mix(in srgb, var(--rl-panel) 96%, var(--rl-canvas));
}

.rl-narrative__chapter:last-child .rl-narrative__card {
	margin-bottom: 0;
}

.rl-narrative__chapter--local .rl-narrative__card {
	border-color: color-mix(in srgb, var(--rl-dev) 45%, var(--rl-line-strong));
	background:
		linear-gradient(90deg, color-mix(in srgb, var(--rl-dev) 75%, transparent) 0 3px, transparent 3px),
		color-mix(in srgb, var(--rl-panel) 96%, var(--rl-canvas));
}

.rl-narrative__chapter--hosted .rl-narrative__card {
	border-color: color-mix(in srgb, var(--rl-ice) 45%, var(--rl-line-strong));
	background:
		linear-gradient(90deg, color-mix(in srgb, var(--rl-ice) 72%, transparent) 0 3px, transparent 3px),
		color-mix(in srgb, var(--rl-panel) 96%, var(--rl-canvas));
}

.rl-narrative__chapter--sdk .rl-narrative__card,
.rl-narrative__card--open {
	background:
		radial-gradient(480px 160px at 100% 0%, color-mix(in srgb, var(--rl-signal) 12%, transparent), transparent 60%),
		color-mix(in srgb, var(--rl-panel) 96%, var(--rl-canvas));
}

.rl-narrative__card-top {
	display: flex;
	align-items: flex-start;
	gap: 0.75rem;
	margin-bottom: 0.75rem;
}

.rl-narrative__icon {
	display: grid;
	place-items: center;
	width: 2.25rem;
	height: 2.25rem;
	flex: 0 0 auto;
	border: 1px solid var(--rl-line-strong);
	background: var(--rl-canvas);
	color: var(--rl-ink);
}

.rl-narrative__chapter--local .rl-narrative__icon {
	color: var(--rl-dev);
	border-color: color-mix(in srgb, var(--rl-dev) 40%, var(--rl-line));
	background: color-mix(in srgb, var(--rl-dev) 10%, var(--rl-canvas));
}

.rl-narrative__chapter--hosted .rl-narrative__icon {
	color: color-mix(in srgb, var(--rl-ice) 30%, var(--rl-ink));
	border-color: color-mix(in srgb, var(--rl-ice) 45%, var(--rl-line));
	background: color-mix(in srgb, var(--rl-ice) 12%, var(--rl-canvas));
}

.rl-narrative__icon--signal {
	background: var(--rl-signal);
	border-color: color-mix(in srgb, var(--rl-signal) 55%, #10140a);
	color: var(--rl-signal-ink);
}

.rl-narrative__kicker {
	margin: 0 0 0.2rem;
	font-family: var(--rl-mono);
	font-size: 0.62rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-narrative__heading {
	margin: 0;
	font-family: var(--rl-display);
	font-size: clamp(1.15rem, 2vw, 1.35rem);
	letter-spacing: -0.025em;
	line-height: 1.15;
	color: var(--rl-ink);
}

.rl-narrative__card > p {
	margin: 0 0 0.95rem;
	color: var(--rl-muted);
	line-height: 1.55;
	max-width: 44rem;
}

.rl-narrative__code-row {
	list-style: none;
	margin: 0 0 1rem;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
}

.rl-narrative__code-row code {
	display: inline-block;
	padding: 0.35rem 0.55rem;
	font-family: var(--rl-mono);
	font-size: 0.74rem;
	border: 1px solid var(--rl-line-strong);
	background: color-mix(in srgb, var(--rl-ink) 4%, var(--rl-canvas));
}

.rl-narrative__card > .rl-copy-cmd {
	margin: 0 0 0.95rem;
	max-width: 28rem;
}

.rl-narrative__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5rem;
}

.rl-narrative__callout {
	margin: 0 0 1rem;
	padding: 0.9rem 1rem;
	border: 1px solid color-mix(in srgb, var(--rl-dev) 35%, var(--rl-line-strong));
	background: color-mix(in srgb, var(--rl-dev) 8%, var(--rl-canvas));
}

.rl-narrative__callout p {
	margin: 0;
	color: var(--rl-ink);
	line-height: 1.45;
	font-size: 0.98rem;
}

.rl-narrative__chips,
.rl-narrative__providers {
	list-style: none;
	margin: 0 0 0.85rem;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
}

.rl-narrative__chips li,
.rl-narrative__providers li {
	font-family: var(--rl-mono);
	font-size: 0.7rem;
	letter-spacing: 0.04em;
	padding: 0.35rem 0.6rem;
	border: 1px solid var(--rl-line-strong);
	background: color-mix(in srgb, var(--rl-canvas) 80%, transparent);
	color: var(--rl-ink);
}

.rl-narrative__providers li {
	text-transform: uppercase;
	letter-spacing: 0.06em;
	font-size: 0.66rem;
}

.rl-narrative__more {
	margin: 0 !important;
}

body.recash-lab-ui .rl-narrative__more a {
	font-family: var(--rl-mono);
	font-size: 0.72rem;
	letter-spacing: 0.04em;
	color: var(--rl-link);
	text-decoration: none;
	border-bottom: 1px solid currentColor;
}

body.recash-lab-ui .rl-narrative__more a:hover,
body.recash-lab-ui .rl-narrative__more a:focus-visible {
	color: var(--rl-link-hover);
	border-bottom-color: currentColor;
}

.rl-narrative__metrics {
	list-style: none;
	margin: 0 0 1rem;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 0.65rem;
}

.rl-narrative__metrics li {
	display: flex;
	flex-direction: column;
	gap: 0.35rem;
	padding: 0.85rem 0.9rem 0.95rem;
	border: 1px solid var(--rl-line-strong);
	background: color-mix(in srgb, var(--rl-canvas) 60%, transparent);
	position: relative;
}

.rl-narrative__metrics li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0;
	top: 0;
	bottom: 0;
	width: 2px;
	background: var(--rl-dev);
}

.rl-narrative__metrics li:nth-child(2)::before { background: var(--rl-ice); }
.rl-narrative__metrics li:nth-child(3)::before { background: var(--rl-signal); }
.rl-narrative__metrics li:nth-child(4)::before { background: var(--rl-done); }

.rl-narrative__metric-key {
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--rl-ink);
}

.rl-narrative__metrics em {
	font-style: normal;
	font-size: 0.88rem;
	color: var(--rl-muted);
	line-height: 1.4;
}

.rl-narrative__strategy {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.55rem 0.75rem;
	margin: 0 !important;
	padding: 0.75rem 0.85rem;
	border: 1px dashed var(--rl-line-strong);
	background: color-mix(in srgb, var(--rl-ink) 3%, var(--rl-canvas));
	max-width: none !important;
}

.rl-narrative__strategy span {
	font-family: var(--rl-mono);
	font-size: 0.62rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-narrative__strategy code {
	font-family: var(--rl-mono);
	font-size: 0.8rem;
	color: var(--rl-ink);
}

@media (min-width: 900px) {
	.rl-narrative__metrics {
		grid-template-columns: repeat(4, minmax(0, 1fr));
	}

	.rl-narrative__chapter {
		grid-template-columns: 2.75rem minmax(0, 1fr);
		gap: 0.85rem 1.25rem;
	}
}

@media (max-width: 640px) {
	.rl-narrative__metrics {
		grid-template-columns: 1fr;
	}

	.rl-narrative__chapter {
		grid-template-columns: 2rem minmax(0, 1fr);
		gap: 0.65rem 0.75rem;
	}

	.rl-narrative__card {
		padding: 1.1rem 1.05rem 1.2rem;
	}
}

/* ==========================================================================
   Dark mode polish — keep lab surfaces readable & theme-token driven
   ========================================================================== */

/* Beat parent (JNews) heading / button colors in dark mode */
body.recash-lab-ui h1,
body.recash-lab-ui h2,
body.recash-lab-ui h3,
body.recash-lab-ui h4,
body.recash-lab-ui .rl-section__title,
body.recash-lab-ui .rl-segment__title,
body.recash-lab-ui .rl-project__title,
body.recash-lab-ui .rl-archive__title,
body.recash-lab-ui .rl-article__title,
body.recash-lab-ui .rl-narrative__heading,
body.recash-lab-ui .rl-narrative__lead-text,
body.recash-lab-ui .rl-oss__title,
body.recash-lab-ui .rl-orch__title,
body.recash-lab-ui .rl-sdk-showcase__title,
body.recash-lab-ui .rl-index__title,
body.recash-lab-ui .rl-topic__title,
body.recash-lab-ui .rl-posts__title,
body.recash-lab-ui .entry-title {
	color: var(--rl-ink);
}

body.recash-lab-ui a.rl-btn:not(.rl-btn--signal):not(.rl-btn--line),
body.recash-lab-ui a.rl-btn:not(.rl-btn--signal):not(.rl-btn--line):link,
body.recash-lab-ui a.rl-btn:not(.rl-btn--signal):not(.rl-btn--line):visited,
body.recash-lab-ui a.rl-btn-icon,
body.recash-lab-ui a.rl-btn-icon:link,
body.recash-lab-ui a.rl-btn-icon:visited,
body.recash-lab-ui a.rl-filter,
body.recash-lab-ui a.rl-filter:link,
body.recash-lab-ui a.rl-filter:visited {
	color: var(--rl-ink);
	background: var(--rl-lift);
	border-color: var(--rl-line-strong);
}

/* Icon-only chrome (theme toggle, etc.) — keep square; do not squash labeled btn-icons */
body.recash-lab-ui .rl-tool,
body.recash-lab-ui button.rl-tool {
	color: var(--rl-ink);
	background: var(--rl-lift);
	border-color: var(--rl-line-strong);
	display: inline-grid;
	place-items: center;
	width: 2.4rem;
	height: 2.4rem;
	min-width: 2.4rem;
	min-height: 2.4rem;
	padding: 0;
	line-height: 0;
}

body.recash-lab-ui a.rl-btn-icon,
body.recash-lab-ui a.rl-btn-icon:link,
body.recash-lab-ui a.rl-btn-icon:visited {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	width: auto;
	height: auto;
	min-width: 0;
	min-height: 2.35rem;
	padding: 0.35rem 0.7rem;
	line-height: 1.2;
	text-decoration: none;
}

body.recash-lab-ui a.rl-btn-icon--lg,
body.recash-lab-ui a.rl-btn-icon--lg:link,
body.recash-lab-ui a.rl-btn-icon--lg:visited {
	min-height: 2.65rem;
	padding: 0.45rem 0.9rem;
}

body.recash-lab-ui .rl-section-bar__tools .rl-tool,
body.recash-lab-ui .rl-section-bar__tools button.rl-tool {
	width: 2.15rem;
	height: 2.15rem;
	min-width: 2.15rem;
	min-height: 2.15rem;
}

body.recash-lab-ui a.rl-btn:not(.rl-btn--signal):not(.rl-btn--line):hover,
body.recash-lab-ui a.rl-btn:not(.rl-btn--signal):not(.rl-btn--line):focus-visible,
body.recash-lab-ui a.rl-btn-icon:not(.rl-btn-icon--github):hover,
body.recash-lab-ui a.rl-btn-icon:not(.rl-btn-icon--github):focus-visible,
body.recash-lab-ui a.rl-filter:hover,
body.recash-lab-ui a.rl-filter:focus-visible,
body.recash-lab-ui a.rl-filter.is-active {
	color: var(--rl-ink);
	background: color-mix(in srgb, var(--rl-ink) 8%, var(--rl-lift));
	border-color: var(--rl-ink);
}

body.recash-lab-ui a.rl-btn--line,
body.recash-lab-ui a.rl-btn--line:link,
body.recash-lab-ui a.rl-btn--line:visited {
	color: var(--rl-ink);
	background: transparent;
	border-color: var(--rl-line-strong);
}

body.recash-lab-ui a.rl-btn--line:hover,
body.recash-lab-ui a.rl-btn--line:focus-visible {
	color: var(--rl-ink);
	background: color-mix(in srgb, var(--rl-ink) 6%, transparent);
	border-color: var(--rl-ink);
}

body.recash-lab-ui .rl-hero a.rl-btn--line,
body.recash-lab-ui .rl-hero a.rl-btn--line:link,
body.recash-lab-ui .rl-hero a.rl-btn--line:visited,
body.recash-lab-ui .rl-hero a.rl-btn--line:hover,
body.recash-lab-ui .rl-hero a.rl-btn--line:focus-visible {
	color: #f4f6f8;
	background: rgba(244, 246, 248, 0.08);
	border-color: rgba(244, 246, 248, 0.45);
}

body.recash-lab-ui .rl-hero a.rl-btn--line:hover,
body.recash-lab-ui .rl-hero a.rl-btn--line:focus-visible {
	background: rgba(244, 246, 248, 0.16);
	border-color: rgba(244, 246, 248, 0.72);
}

body.recash-lab-ui a.rl-btn--signal,
body.recash-lab-ui a.rl-btn--signal:link,
body.recash-lab-ui a.rl-btn--signal:visited,
body.recash-lab-ui a.rl-btn--signal:hover,
body.recash-lab-ui a.rl-btn--signal:focus-visible {
	color: var(--rl-signal-ink);
	background: var(--rl-signal);
	border-color: var(--rl-signal);
}

body.recash-lab-ui a.rl-about__item,
body.recash-lab-ui a.rl-about__item:link,
body.recash-lab-ui a.rl-about__item:visited,
body.recash-lab-ui a.rl-about__item:hover,
body.recash-lab-ui a.rl-about__item:focus-visible {
	color: inherit;
	text-decoration: none;
	box-shadow: none;
}

/* Dark surfaces keep light ink (hero / stage / about spine) */
body.recash-lab-ui .rl-hero h1,
body.recash-lab-ui .rl-hero h2,
body.recash-lab-ui .rl-hero .rl-hero__brand,
body.recash-lab-ui .rl-stage h1,
body.recash-lab-ui .rl-stage h2 {
	color: #f4f6f8;
}

body.recash-lab-ui .rl-about__spine-title,
body.recash-lab-ui .rl-about__spine h2 {
	color: #f4f6f8;
	background: linear-gradient(105deg, #ffffff 0%, #f4f6f8 48%, #d4ff4f 160%);
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
}

body.recash-lab-ui .rl-stage__actions a.rl-btn-icon,
body.recash-lab-ui .rl-stage__actions a.rl-btn-icon:link,
body.recash-lab-ui .rl-stage__actions a.rl-btn-icon:visited {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	width: auto;
	height: auto;
	min-width: 0;
	min-height: 2.65rem;
	padding: 0.45rem 0.9rem;
	line-height: 1.2;
	color: #f4f6f8;
	background: rgba(11, 13, 16, 0.55);
	border-color: rgba(244, 246, 248, 0.32);
	text-decoration: none;
}

body.recash-lab-ui .rl-stage__actions a.rl-btn-icon:hover,
body.recash-lab-ui .rl-stage__actions a.rl-btn-icon:focus-visible {
	color: #10140a;
	background: var(--rl-stage-accent, var(--rl-signal));
	border-color: var(--rl-stage-accent, var(--rl-signal));
}

body.recash-lab-ui .rl-stage__actions a.rl-btn-icon--github,
body.recash-lab-ui .rl-stage__actions a.rl-btn-icon--github:link,
body.recash-lab-ui .rl-stage__actions a.rl-btn-icon--github:visited {
	background: #24292f;
	border-color: #24292f;
	color: #ffffff;
}

body.recash-lab-ui .rl-stage__actions a.rl-btn-icon--github:hover,
body.recash-lab-ui .rl-stage__actions a.rl-btn-icon--github:focus-visible {
	background: #f0f3f6;
	border-color: #f0f3f6;
	color: #0b0d10;
}

html[data-rl-theme="dark"] .rl-orch__node--hub {
	background:
		radial-gradient(680px 220px at 12% 0%, color-mix(in srgb, var(--rl-dev) 18%, transparent), transparent 55%),
		radial-gradient(420px 180px at 95% 100%, color-mix(in srgb, var(--rl-signal) 10%, transparent), transparent 50%),
		color-mix(in srgb, var(--rl-panel) 92%, var(--rl-canvas-2));
}

html[data-rl-theme="dark"] .rl-orch__node--local,
html[data-rl-theme="dark"] .rl-orch__node--hosted,
html[data-rl-theme="dark"] .rl-orch__node--out,
html[data-rl-theme="dark"] .rl-orch__node {
	background-color: color-mix(in srgb, var(--rl-panel) 92%, var(--rl-canvas));
}

html[data-rl-theme="dark"] .rl-orch__chips li,
html[data-rl-theme="dark"] .rl-orch__metrics li,
html[data-rl-theme="dark"] .rl-orch__consumers a,
html[data-rl-theme="dark"] .rl-orch__consumers span,
html[data-rl-theme="dark"] .rl-narrative__chips li,
html[data-rl-theme="dark"] .rl-narrative__providers li,
html[data-rl-theme="dark"] .rl-narrative__code-row code,
html[data-rl-theme="dark"] .rl-narrative__metrics li {
	background: var(--rl-lift);
	border-color: var(--rl-line-strong);
}

html[data-rl-theme="dark"] .rl-narrative__lead {
	background:
		radial-gradient(520px 180px at 0% 0%, color-mix(in srgb, var(--rl-signal) 10%, transparent), transparent 65%),
		var(--rl-panel);
	border-color: color-mix(in srgb, var(--rl-signal) 35%, var(--rl-line-strong));
}

html[data-rl-theme="dark"] .rl-narrative__callout {
	background: color-mix(in srgb, var(--rl-dev) 14%, var(--rl-lift));
	border-color: color-mix(in srgb, var(--rl-dev) 45%, var(--rl-line-strong));
}

html[data-rl-theme="dark"] .rl-narrative__strategy {
	background: var(--rl-lift);
	border-color: var(--rl-line-strong);
}

html[data-rl-theme="dark"] .rl-narrative__card,
html[data-rl-theme="dark"] .rl-sdk-showcase,
html[data-rl-theme="dark"] .rl-panel,
html[data-rl-theme="dark"] .rl-spec__card {
	border-color: var(--rl-line-strong);
}

html[data-rl-theme="dark"] .rl-copy-cmd__row {
	background: var(--rl-lift);
	border-color: var(--rl-line-strong);
}

html[data-rl-theme="dark"] .rl-copy-cmd__btn {
	color: var(--rl-ink);
}

html[data-rl-theme="dark"] .rl-copy-cmd__btn:hover,
html[data-rl-theme="dark"] .rl-copy-cmd__surface:hover {
	background: color-mix(in srgb, var(--rl-signal) 18%, var(--rl-lift));
	color: var(--rl-ink);
}

/* Content / narrative links — theme tokens, never pale lime on light */
body.recash-lab-ui .rl-project__body.entry-content a,
body.recash-lab-ui .rl-article__body.entry-content a,
body.recash-lab-ui .rl-narrative a:not(.rl-btn-icon):not(.rl-btn) {
	color: var(--rl-link-hover);
	text-decoration: underline;
	text-underline-offset: 0.14em;
}

body.recash-lab-ui .rl-project__body.entry-content a:hover,
body.recash-lab-ui .rl-article__body.entry-content a:hover,
body.recash-lab-ui .rl-narrative a:not(.rl-btn-icon):not(.rl-btn):hover {
	color: var(--rl-link);
}

html[data-rl-theme="dark"] .rl-project__body.entry-content code,
html[data-rl-theme="dark"] .rl-narrative code {
	background: var(--rl-lift);
	border-color: var(--rl-line-strong);
	color: var(--rl-ink);
}

html[data-rl-theme="dark"] .rl-list--boxed a,
html[data-rl-theme="dark"] .rl-list a {
	color: var(--rl-link);
}

.rl-tags--oss {
	gap: 0.4rem;
}

.rl-tags--oss li {
	list-style: none;
	margin: 0;
	padding: 0;
}

.rl-tags--oss li span {
	display: inline-block;
	font-family: var(--rl-mono);
	font-size: 0.66rem;
	letter-spacing: 0.02em;
	color: var(--rl-ink-2);
	padding: 0.22rem 0.45rem;
	border: 1px solid var(--rl-line);
	background: color-mix(in srgb, var(--rl-ink) 6%, transparent);
}

html[data-rl-theme="dark"] .rl-tags--oss li span {
	color: var(--rl-ink-2);
	border-color: var(--rl-line-strong);
	background: color-mix(in srgb, var(--rl-lift) 80%, transparent);
}

html[data-rl-theme="dark"] .rl-demo-preview__frame {
	background: var(--rl-canvas-2);
}

html[data-rl-theme="light"] {
	color-scheme: light;
}

/* Narrative chapter accents — product / research / voice */
.rl-narrative__chapter--product .rl-narrative__card,
.rl-narrative__chapter--sdk .rl-narrative__card {
	background:
		radial-gradient(480px 160px at 100% 0%, color-mix(in srgb, var(--rl-signal) 12%, transparent), transparent 60%),
		color-mix(in srgb, var(--rl-panel) 96%, var(--rl-canvas));
}

.rl-narrative__chapter--research .rl-narrative__card {
	border-color: color-mix(in srgb, var(--rl-done) 40%, var(--rl-line-strong));
	background:
		linear-gradient(90deg, color-mix(in srgb, var(--rl-done) 70%, transparent) 0 3px, transparent 3px),
		color-mix(in srgb, var(--rl-panel) 96%, var(--rl-canvas));
}

.rl-narrative__chapter--research .rl-narrative__icon {
	color: var(--rl-done);
	border-color: color-mix(in srgb, var(--rl-done) 40%, var(--rl-line));
	background: color-mix(in srgb, var(--rl-done) 12%, var(--rl-canvas));
}

.rl-narrative__chapter--voice .rl-narrative__card {
	border-color: color-mix(in srgb, var(--rl-ice) 40%, var(--rl-line-strong));
	background:
		linear-gradient(90deg, color-mix(in srgb, var(--rl-ice) 70%, transparent) 0 3px, transparent 3px),
		radial-gradient(420px 140px at 0% 0%, color-mix(in srgb, var(--rl-ice) 10%, transparent), transparent 55%),
		color-mix(in srgb, var(--rl-panel) 96%, var(--rl-canvas));
}

.rl-narrative__chapter--voice .rl-narrative__icon {
	color: color-mix(in srgb, var(--rl-ice) 25%, var(--rl-ink));
	border-color: color-mix(in srgb, var(--rl-ice) 45%, var(--rl-line));
	background: color-mix(in srgb, var(--rl-ice) 12%, var(--rl-canvas));
}

.rl-narrative__chapter--product .rl-narrative__icon {
	background: color-mix(in srgb, var(--rl-signal) 22%, var(--rl-canvas));
	border-color: color-mix(in srgb, var(--rl-signal) 45%, var(--rl-line));
	color: var(--rl-signal-ink);
}

html[data-rl-theme="dark"] .rl-narrative__chapter--product .rl-narrative__icon {
	color: var(--rl-signal);
	background: color-mix(in srgb, var(--rl-signal) 14%, var(--rl-lift));
}

.rl-narrative__actions + .rl-narrative__more,
.rl-narrative__chips + .rl-narrative__more,
.rl-narrative__providers + .rl-narrative__more,
.rl-narrative__metrics + .rl-narrative__more,
.rl-copy-cmd + .rl-narrative__more {
	margin-top: 0.85rem !important;
}

/* ========== Product CTA — immersive cinematic laptop stage ========== */
.rl-segment.rl-product-cta {
	--rl-cine-progress: 0;
	--rl-cine-screen: 0;
	--rl-cine-exit: 0;
	--rl-cine-raw: 0;
	--rl-cine-beat-a: 0;
	--rl-cine-beat-b: 0;
	position: relative;
	isolation: isolate;
	margin: 1.25rem 0 0;
	margin-inline: calc(50% - 50vw);
	width: 100vw;
	max-width: 100vw;
	padding: clamp(2.5rem, 6vw, 4.5rem) max(var(--rl-pad), calc((100vw - var(--rl-max)) / 2)) clamp(3rem, 7vw, 5.5rem);
	overflow: hidden;
	background: var(--rl-canvas);
	border: 0;
}

.rl-product-cta__pin {
	position: relative;
	z-index: 1;
}

/* Rich 3D: runway for approach / closed holds / open / fade. */
.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] {
	min-height: 285vh;
	padding: 0;
	margin-bottom: 0;
	overflow: visible;
	background: var(--rl-canvas);
}

.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"][data-rl-laptop-screen-mode="iframe"] {
	min-height: 330vh;
}

.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"].is-cine-handoff {
	pointer-events: none;
}

.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__pin {
	--rl-cine-pin-top: var(--rl-nav-h, 4.25rem);
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1;
	height: calc(100svh - var(--rl-cine-pin-top));
	min-height: 0;
	overflow: hidden;
	padding: clamp(1.25rem, 3vw, 2rem) max(var(--rl-pad), calc((100vw - var(--rl-max)) / 2)) clamp(1.5rem, 3.5vw, 2.5rem);
	background: var(--rl-canvas);
	opacity: calc(1 - var(--rl-cine-exit, 0));
	transform: translate3d(0, calc(var(--rl-cine-exit, 0) * 6vh), 0);
	transform-origin: 50% 42%;
	box-sizing: border-box;
	pointer-events: none;
}

html.rl-section-bar-on .rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__pin {
	--rl-cine-pin-top: var(--rl-section-bar-h, 3rem);
}

.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__head,
.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-laptop-3d__open {
	pointer-events: auto;
	position: relative;
	z-index: 6;
}

.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__beats {
	pointer-events: none;
	z-index: 7;
}

/* Closed-hold content — full pin width; signup docks right, insights spans center+right. */
.rl-product-cta__beats {
	position: absolute;
	top: clamp(5.25rem, 11vh, 7.5rem);
	left: max(var(--rl-pad), calc((100vw - var(--rl-max)) / 2));
	right: max(var(--rl-pad), calc((100vw - var(--rl-max)) / 2));
	z-index: 7;
	pointer-events: none;
}

.rl-cine-beat {
	position: absolute;
	top: 0;
	opacity: 0;
	transform: translate3d(0, 14px, 0);
	transition: opacity 0.4s ease, transform 0.5s cubic-bezier(0.22, 1, 0.36, 1);
	pointer-events: none;
}

.rl-cine-beat--signup {
	inset-inline-end: 0;
	width: min(22rem, 34vw);
	padding: 1.05rem 1.15rem 1.2rem;
	border: 1px solid color-mix(in srgb, var(--rl-line-strong) 80%, transparent);
	background: color-mix(in srgb, var(--rl-canvas) 92%, transparent);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	box-shadow: 0 16px 48px color-mix(in srgb, var(--rl-ink) 10%, transparent);
}

html[data-rl-theme="dark"] .rl-cine-beat--signup {
	background: color-mix(in srgb, var(--rl-canvas) 82%, transparent);
	border-color: rgba(244, 246, 248, 0.12);
}

/* Hold B: center story + right KPI type */
.rl-cine-beat--insights {
	left: clamp(17.5rem, 26vw, 23rem);
	right: 0;
	width: auto;
	display: grid;
	grid-template-columns: minmax(15rem, 1.15fr) minmax(11rem, 0.85fr);
	gap: 1.1rem 1.35rem;
	align-items: stretch;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}

.rl-segment.rl-product-cta.is-cine-beat-a .rl-cine-beat--signup,
.rl-segment.rl-product-cta.is-cine-beat-b .rl-cine-beat--insights {
	transform: translate3d(0, 0, 0);
}

.rl-cine-beat[hidden] {
	display: block !important;
	visibility: hidden;
}

.rl-cine-beat--insights[hidden] {
	display: grid !important;
}

.rl-cine-beat:not([hidden]) {
	visibility: visible;
}

.rl-cine-beat__story {
	padding: 1.15rem 1.25rem 1.3rem;
	border: 1px solid color-mix(in srgb, var(--rl-line-strong) 80%, transparent);
	background: color-mix(in srgb, var(--rl-canvas) 92%, transparent);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	box-shadow: 0 18px 48px color-mix(in srgb, var(--rl-ink) 10%, transparent);
}

html[data-rl-theme="dark"] .rl-cine-beat__story {
	background: color-mix(in srgb, var(--rl-canvas) 80%, transparent);
	border-color: rgba(244, 246, 248, 0.12);
}

.rl-cine-beat__title {
	margin: 0.15rem 0 0.45rem;
	font-family: var(--rl-display);
	font-size: clamp(1.45rem, 2.6vw, 1.9rem);
	font-weight: 700;
	letter-spacing: -0.035em;
	line-height: 1.1;
	color: var(--rl-ink);
}

.rl-cine-beat__lede {
	margin: 0 0 1rem;
	font-size: 0.95rem;
	line-height: 1.45;
	color: var(--rl-muted);
	max-width: 34ch;
}

.rl-cine-beat__stats {
	display: grid;
	grid-template-rows: 1fr 1fr;
	gap: 0.85rem;
	min-height: 100%;
}

.rl-cine-beat__stat {
	display: grid;
	align-content: center;
	gap: 0.2rem;
	padding: 0.95rem 1.05rem 1.05rem;
	border: 1px solid color-mix(in srgb, var(--rl-line-strong) 75%, transparent);
	background: color-mix(in srgb, var(--rl-canvas) 90%, transparent);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	box-shadow: 0 14px 36px color-mix(in srgb, var(--rl-ink) 8%, transparent);
}

html[data-rl-theme="dark"] .rl-cine-beat__stat {
	background: color-mix(in srgb, var(--rl-canvas) 78%, transparent);
	border-color: rgba(244, 246, 248, 0.12);
}

.rl-cine-beat__stat-value {
	font-family: var(--rl-display);
	font-weight: 700;
	font-size: clamp(2.6rem, 5.2vw, 3.75rem);
	line-height: 0.88;
	letter-spacing: -0.06em;
	color: var(--rl-signal);
}

.rl-cine-beat__stat-label {
	margin-top: 0.35rem;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--rl-ink);
}

.rl-cine-beat__stat-text {
	font-size: 0.86rem;
	line-height: 1.35;
	color: var(--rl-muted);
}

.rl-cine-beat__form {
	display: grid;
	gap: 0.65rem;
}

.rl-cine-beat__hp {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.rl-cine-beat__field {
	display: grid;
	gap: 0.28rem;
}

.rl-cine-beat__label {
	font-family: var(--rl-mono);
	font-size: 0.66rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-cine-beat__field input {
	width: 100%;
	min-height: 2.45rem;
	padding: 0.55rem 0.75rem;
	border: 1px solid color-mix(in srgb, var(--rl-line-strong) 85%, transparent);
	border-radius: 0;
	background: color-mix(in srgb, var(--rl-canvas) 70%, transparent);
	color: var(--rl-ink);
	font: inherit;
	font-size: 0.92rem;
}

.rl-cine-beat__field input:focus {
	outline: 1px solid var(--rl-signal);
	outline-offset: 1px;
}

.rl-cine-beat__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.75rem 1rem;
	margin-top: 0.15rem;
}

body.recash-lab-ui a.rl-cine-beat__link,
body.recash-lab-ui a.rl-cine-beat__link:link,
body.recash-lab-ui a.rl-cine-beat__link:visited {
	display: inline-flex;
	align-items: center;
	min-height: 2.35rem;
	padding: 0.45rem 0.85rem;
	font-family: var(--rl-mono);
	font-size: 0.72rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--rl-ink);
	background: transparent;
	border: 1px solid var(--rl-line-strong);
}

body.recash-lab-ui a.rl-cine-beat__link:hover,
body.recash-lab-ui a.rl-cine-beat__link:focus-visible {
	color: var(--rl-ink);
	background: color-mix(in srgb, var(--rl-ink) 7%, var(--rl-canvas));
	border-color: var(--rl-ink);
}

html[data-rl-theme="dark"] body.recash-lab-ui a.rl-cine-beat__link,
html[data-rl-theme="dark"] body.recash-lab-ui a.rl-cine-beat__link:link,
html[data-rl-theme="dark"] body.recash-lab-ui a.rl-cine-beat__link:visited {
	color: var(--rl-ink);
	border-color: rgba(244, 246, 248, 0.35);
}

html[data-rl-theme="dark"] body.recash-lab-ui a.rl-cine-beat__link:hover,
html[data-rl-theme="dark"] body.recash-lab-ui a.rl-cine-beat__link:focus-visible {
	color: var(--rl-signal-ink);
	background: var(--rl-signal);
	border-color: var(--rl-signal);
}

.rl-cine-beat__status {
	margin: 0.15rem 0 0;
	font-family: var(--rl-mono);
	font-size: 0.72rem;
	letter-spacing: 0.04em;
	color: var(--rl-signal);
}

.rl-cine-beat__features {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.4rem;
}

.rl-cine-beat__features li {
	padding: 0.28rem 0.55rem;
	font-family: var(--rl-mono);
	font-size: 0.66rem;
	letter-spacing: 0.04em;
	color: var(--rl-muted);
	border: 1px solid color-mix(in srgb, var(--rl-line) 90%, transparent);
}

@media (max-width: 1100px) {
	.rl-cine-beat--insights {
		left: clamp(15rem, 24vw, 20rem);
		grid-template-columns: minmax(13rem, 1fr) minmax(9.5rem, 0.75fr);
		gap: 0.85rem;
	}

	.rl-cine-beat__stat-value {
		font-size: clamp(2.2rem, 4.5vw, 3rem);
	}
}

@media (max-width: 900px) {
	/* Beats sit in normal flow on mobile — no nested scrollbar mid-page */
	.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__beats,
	.rl-product-cta--after-hero .rl-product-cta__beats,
	.rl-product-cta.is-lite .rl-product-cta__beats {
		position: relative;
		top: auto;
		bottom: auto;
		left: auto;
		right: auto;
		width: auto;
		margin: 1rem 0 0;
		max-height: none;
		overflow: visible;
		-webkit-overflow-scrolling: auto;
	}

	.rl-cine-beat,
	.rl-cine-beat--signup,
	.rl-cine-beat--insights {
		position: relative;
		left: auto;
		right: auto;
		width: 100%;
		inset: auto;
		transform: none;
		max-height: none;
	}

	.rl-cine-beat--signup {
		width: 100%;
		padding: 0.9rem 1rem 1.05rem;
	}

	.rl-cine-beat--insights {
		display: grid;
		grid-template-columns: 1fr;
		gap: 0.75rem;
	}

	.rl-cine-beat--insights[hidden] {
		display: none !important;
	}

	.rl-cine-beat__stats {
		grid-template-columns: 1fr 1fr;
		grid-template-rows: auto;
	}

	/* Mobile after-hero: compact section, visible 2D laptop (no tall cinematic runway) */
	.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"],
	.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"][data-rl-laptop-screen-mode="iframe"],
	.rl-product-cta--after-hero,
	.rl-product-cta--after-hero.is-lite {
		min-height: 0 !important;
	}

	.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__pin {
		padding: 0.75rem max(var(--rl-pad), 1rem) 1rem;
	}

	.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__head {
		max-width: min(100%, 22rem);
		padding: 0.8rem 0.9rem 0.95rem;
		margin-bottom: 0;
	}

	.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"].is-mobile-3d .rl-laptop-3d__canvas,
	.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"].is-mobile-3d .rl-laptop-3d__iframe-host {
		-webkit-mask-image: none;
		mask-image: none;
		filter: none;
	}

	.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"].is-mobile-3d .rl-product-cta__vignette {
		background: linear-gradient(180deg, var(--rl-canvas) 0%, transparent 10%, transparent 78%, var(--rl-canvas) 100%);
	}

	/* Softer exit fade on mobile — pin stays readable until handoff */
	.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__pin {
		opacity: calc(1 - (var(--rl-cine-exit, 0) * 0.85));
		transform: translate3d(0, calc(var(--rl-cine-exit, 0) * 3vh), 0);
	}

	.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__pin.is-released {
		opacity: 0;
		visibility: hidden;
	}
}

.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-laptop-3d__state {
	z-index: 6;
}

/* JS pin — bypasses ancestor overflow:clip on .rl-shell */
.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__pin.is-pinned {
	position: fixed;
	top: var(--rl-cine-pin-top, var(--rl-nav-h, 4.25rem));
	left: 0;
	width: 100vw;
	height: calc(100svh - var(--rl-cine-pin-top, var(--rl-nav-h, 4.25rem)));
}

.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__pin.is-released {
	position: absolute;
	top: auto;
	bottom: 0;
	left: 0;
	width: 100%;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.rl-product-cta__atmosphere {
	position: absolute;
	inset: 0;
	z-index: 0;
	pointer-events: none;
	overflow: hidden;
}

.rl-product-cta__wash {
	position: absolute;
	inset: -10% -5% 0;
	background:
		radial-gradient(70% 55% at 50% 18%, color-mix(in srgb, var(--rl-signal) 16%, transparent), transparent 68%),
		radial-gradient(55% 45% at 82% 78%, color-mix(in srgb, var(--rl-ice) 12%, transparent), transparent 70%),
		linear-gradient(
			180deg,
			color-mix(in srgb, var(--rl-canvas) 0%, transparent) 0%,
			color-mix(in srgb, var(--rl-ink) 5%, var(--rl-canvas)) 38%,
			var(--rl-canvas) 72%,
			color-mix(in srgb, var(--rl-canvas) 92%, transparent) 100%
		);
}

html[data-rl-theme="dark"] .rl-product-cta__wash {
	background:
		radial-gradient(68% 52% at 50% 16%, rgba(212, 255, 79, 0.12), transparent 65%),
		radial-gradient(50% 42% at 85% 80%, rgba(126, 200, 239, 0.1), transparent 68%),
		linear-gradient(180deg, transparent 0%, #10141a 42%, #0b0d10 78%, transparent 100%);
}

.rl-product-cta__beam {
	position: absolute;
	left: 50%;
	top: 8%;
	width: min(48rem, 78vw);
	height: 58%;
	transform: translateX(-50%) scale(calc(0.88 + (var(--rl-cine-screen) * 0.14)));
	background: radial-gradient(
		ellipse at 50% 30%,
		color-mix(in srgb, var(--rl-ice) calc(8% + var(--rl-cine-screen) * 12%), transparent),
		transparent 72%
	);
	filter: blur(36px);
	opacity: calc(0.22 + var(--rl-cine-screen) * 0.28);
	transition: opacity 0.4s ease;
}

.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__beam,
.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__grain {
	opacity: 0.1;
	pointer-events: none;
}

.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__wash {
	background: linear-gradient(
		180deg,
		color-mix(in srgb, var(--rl-canvas) 88%, transparent) 0%,
		var(--rl-canvas) 45%,
		var(--rl-canvas) 100%
	);
}

.rl-product-cta__vignette {
	position: absolute;
	inset: 0;
	z-index: 3;
	pointer-events: none;
	background:
		radial-gradient(120% 80% at 50% 40%, transparent 35%, color-mix(in srgb, var(--rl-canvas) 55%, transparent) 100%),
		linear-gradient(180deg, color-mix(in srgb, var(--rl-canvas) 70%, transparent), transparent 18%, transparent 78%, var(--rl-canvas));
}

html[data-rl-theme="dark"] .rl-product-cta__vignette {
	background:
		radial-gradient(120% 80% at 50% 40%, transparent 32%, rgba(11, 13, 16, 0.72) 100%),
		linear-gradient(180deg, rgba(11, 13, 16, 0.75), transparent 20%, transparent 76%, #0b0d10);
}

/* Rich: denser edge dissolve so the live iframe never punches through the fade */
.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__vignette {
	z-index: 5;
	background:
		linear-gradient(180deg, var(--rl-canvas) 0%, transparent 14%, transparent 84%, var(--rl-canvas) 100%),
		linear-gradient(90deg, var(--rl-canvas) 0%, transparent 7%, transparent 93%, var(--rl-canvas) 100%),
		radial-gradient(120% 80% at 50% 42%, transparent 38%, color-mix(in srgb, var(--rl-canvas) 62%, transparent) 100%);
}

html[data-rl-theme="dark"] .rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__vignette {
	background:
		linear-gradient(180deg, #0b0d10 0%, transparent 14%, transparent 84%, #0b0d10 100%),
		linear-gradient(90deg, #0b0d10 0%, transparent 7%, transparent 93%, #0b0d10 100%),
		radial-gradient(120% 80% at 50% 42%, transparent 36%, rgba(11, 13, 16, 0.78) 100%);
}

.rl-product-cta__grain {
	position: absolute;
	inset: 0;
	opacity: 0.035;
	mix-blend-mode: overlay;
	background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
	background-size: 180px 180px;
}

.rl-product-cta__head {
	max-width: 40rem;
	position: relative;
	z-index: 4;
	transform: translateY(calc((1 - var(--rl-cine-progress)) * 10px));
	opacity: calc(0.72 + var(--rl-cine-progress) * 0.28);
	transition: opacity 0.5s ease, transform 0.5s ease;
}

.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__head {
	max-width: min(20rem, 30vw);
	padding: 1.05rem 1.2rem 1.15rem;
	border: 1px solid color-mix(in srgb, var(--rl-line-strong) 80%, transparent);
	background: color-mix(in srgb, var(--rl-canvas) 92%, transparent);
	backdrop-filter: blur(16px);
	-webkit-backdrop-filter: blur(16px);
	box-shadow: 0 16px 48px color-mix(in srgb, var(--rl-ink) 10%, transparent);
}

html[data-rl-theme="dark"] .rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__head {
	background: color-mix(in srgb, var(--rl-canvas) 82%, transparent);
	border-color: rgba(244, 246, 248, 0.12);
}

.rl-product-cta.is-cinematic-done .rl-product-cta__head,
.rl-product-cta.is-lite.is-cinematic-done .rl-product-cta__head,
.rl-product-cta.is-lite .rl-product-cta__head {
	opacity: 1;
	transform: none;
}

.rl-product-cta__actions {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.85rem 1.15rem;
	margin: 1.15rem 0 0;
}

.rl-product-cta__host {
	font-family: var(--rl-mono);
	font-size: 0.72rem;
	letter-spacing: 0.06em;
	color: var(--rl-muted);
}

.rl-laptop-stage {
	position: relative;
	isolation: isolate;
	z-index: 1;
	margin: 1.75rem 0 0;
	padding: clamp(1.25rem, 3.5vw, 2.5rem) 0 clamp(1.5rem, 4vw, 2.75rem);
	perspective: 1600px;
	perspective-origin: 50% 38%;
	overflow: visible;
	border-radius: 0;
	background: transparent;
	border: 0;
}

.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-laptop-stage {
	position: absolute;
	inset: 0;
	z-index: 1;
	margin: 0;
	padding: 0;
	perspective: none;
	overflow: hidden;
}

html[data-rl-theme="dark"] .rl-laptop-stage {
	background: transparent;
	border-color: transparent;
}

html[data-rl-theme="dark"] .rl-segment.rl-product-cta {
	background: var(--rl-canvas);
}

.rl-laptop-stage__horizon {
	position: absolute;
	left: 5%;
	right: 5%;
	bottom: 12%;
	height: 1px;
	z-index: 0;
	pointer-events: none;
	background: linear-gradient(
		90deg,
		transparent,
		color-mix(in srgb, var(--rl-ink) 18%, transparent) 20%,
		color-mix(in srgb, var(--rl-signal) 35%, transparent) 50%,
		color-mix(in srgb, var(--rl-ink) 18%, transparent) 80%,
		transparent
	);
	opacity: calc(0.25 + var(--rl-cine-screen, 0) * 0.45);
}

.rl-laptop-3d {
	position: relative;
	z-index: 1;
	width: min(52rem, 100%);
	margin: 0 auto;
	aspect-ratio: 16 / 10;
	min-height: clamp(16rem, 42vw, 26rem);
	touch-action: pan-y;
	cursor: default;
}

.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-laptop-3d {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	min-height: 0;
	margin: 0;
	aspect-ratio: auto;
	touch-action: pan-y;
	cursor: default;
}

.rl-laptop-3d:active {
	cursor: grabbing;
}

.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-laptop-3d:active {
	cursor: default;
}

.rl-laptop-3d[hidden] {
	display: none !important;
}

.rl-laptop-3d__canvas {
	display: block;
	width: 100%;
	height: 100%;
	pointer-events: none;
}

.rl-laptop-3d__iframe-host {
	position: absolute;
	inset: 0;
	z-index: 2;
	overflow: hidden;
	pointer-events: none;
}

.rl-laptop-3d__iframe-host[hidden] {
	display: none !important;
}

.rl-laptop-3d__iframe-clip {
	position: absolute;
	left: 0;
	top: 0;
	width: 1280px;
	height: 720px;
	overflow: hidden;
	transform-origin: 0 0;
	will-change: transform;
	background: #0b0d10;
}

.rl-laptop-3d__iframe {
	position: absolute;
	left: 0;
	top: 0;
	width: 1280px;
	height: 720px;
	border: 0;
	margin: 0;
	padding: 0;
	background: #0b0d10;
	transform-origin: 0 0;
	pointer-events: none;
	will-change: transform;
	overflow: hidden;
	scrollbar-width: none;
}

.rl-laptop-3d__iframe.is-pan-fallback {
	height: 1600px;
}

.rl-laptop-3d__iframe::-webkit-scrollbar {
	display: none;
	width: 0;
	height: 0;
}

.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-laptop-3d__canvas,
.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-laptop-3d__iframe-host {
	filter: none;
	/* Soft dissolve into the section — canvas + iframe share the same edge mask */
	-webkit-mask-image:
		linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%),
		linear-gradient(180deg, transparent 0%, #000 7%, #000 86%, transparent 100%);
	mask-image:
		linear-gradient(90deg, transparent 0%, #000 6%, #000 94%, transparent 100%),
		linear-gradient(180deg, transparent 0%, #000 7%, #000 86%, transparent 100%);
	-webkit-mask-composite: source-in;
	mask-composite: intersect;
}

.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-laptop-stage__glow,
.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-laptop-stage__floor,
.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-laptop-stage__horizon {
	display: none;
}

.rl-laptop-3d__state {
	position: absolute;
	left: max(0.85rem, calc((100vw - var(--rl-max)) / 2));
	bottom: 0.85rem;
	z-index: 6;
	margin: 0;
	padding: 0.3rem 0.55rem;
	font-family: var(--rl-mono);
	font-size: 0.62rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--rl-ink);
	background: color-mix(in srgb, var(--rl-panel) 88%, transparent);
	border: 1px solid var(--rl-line-strong);
	pointer-events: none;
}

.rl-laptop-3d__open {
	position: absolute;
	right: max(0.85rem, calc((100vw - var(--rl-max)) / 2));
	bottom: 0.85rem;
	z-index: 5;
	display: inline-flex;
	align-items: center;
	min-height: 2.25rem;
	padding: 0.4rem 0.8rem;
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	text-decoration: none;
	color: var(--rl-signal-ink);
	background: var(--rl-signal);
	border: 1px solid color-mix(in srgb, var(--rl-signal) 70%, #10140a);
	pointer-events: auto;
	touch-action: manipulation;
}

body.recash-lab-ui a.rl-laptop-3d__open,
body.recash-lab-ui a.rl-laptop-3d__open:link,
body.recash-lab-ui a.rl-laptop-3d__open:visited,
body.recash-lab-ui a.rl-laptop-3d__open:hover,
body.recash-lab-ui a.rl-laptop-3d__open:focus-visible {
	color: var(--rl-signal-ink);
	background: var(--rl-signal);
	border-color: color-mix(in srgb, var(--rl-signal) 70%, #10140a);
	text-decoration: none;
	width: auto;
	height: auto;
	min-width: 0;
	min-height: 2.25rem;
	padding: 0.4rem 0.8rem;
	display: inline-flex;
	place-items: unset;
	line-height: 1.2;
}

[data-rl-laptop-stage][data-rl-laptop-mode="rich"] [data-rl-laptop-lite] {
	display: none !important;
}

[data-rl-laptop-stage][data-rl-laptop-mode="rich"] .rl-laptop-3d {
	display: block;
}

.rl-laptop-stage.is-loading .rl-laptop-3d__state {
	color: var(--rl-dev);
}

.rl-laptop-stage__glow {
	position: absolute;
	inset: 12% 8% auto;
	height: 52%;
	z-index: 0;
	pointer-events: none;
	background: radial-gradient(ellipse at center, color-mix(in srgb, var(--rl-signal) 26%, transparent), transparent 70%);
	filter: blur(34px);
	opacity: calc(0.28 + var(--rl-cine-screen, 0) * 0.5);
	transform: translateZ(0) scale(calc(0.92 + var(--rl-cine-screen, 0) * 0.12));
}

.rl-laptop-stage__floor {
	position: absolute;
	left: 4%;
	right: 4%;
	bottom: 4%;
	height: 34%;
	z-index: 0;
	pointer-events: none;
	background:
		linear-gradient(180deg, transparent, color-mix(in srgb, var(--rl-ink) 7%, transparent) 42%, transparent),
		repeating-linear-gradient(
			90deg,
			color-mix(in srgb, var(--rl-ink) 7%, transparent) 0 1px,
			transparent 1px 56px
		);
	mask-image: linear-gradient(180deg, transparent, #000 30%, transparent 96%);
	opacity: 0.38;
}

.rl-laptop {
	--rl-laptop-scale: 0.4;
	position: relative;
	z-index: 1;
	margin: 0 auto;
	max-width: min(52rem, 94%);
}

.rl-laptop__rig {
	position: relative;
	filter: drop-shadow(0 22px 36px rgba(0, 0, 0, 0.32));
}

.rl-laptop__lid {
	position: relative;
	padding: 0 1.5%;
	transform-style: preserve-3d;
}

.rl-laptop__bezel {
	border-radius: 0.85rem 0.85rem 0.35rem 0.35rem;
	padding: 0.55rem 0.55rem 0.7rem;
	background: linear-gradient(165deg, #343b45 0%, #1a1f27 48%, #10151b 100%);
	border: 1px solid rgba(244, 246, 248, 0.16);
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.08) inset,
		0 -1px 0 rgba(0, 0, 0, 0.35) inset,
		0 24px 48px rgba(0, 0, 0, 0.28);
}

html[data-rl-theme="light"] .rl-laptop__bezel {
	background: linear-gradient(165deg, #3f4854 0%, #222933 50%, #151a21 100%);
}

html[data-rl-theme="dark"] .rl-laptop__bezel {
	background: #ffffff;
	border-color: #ffffff;
	box-shadow:
		0 1px 0 rgba(255, 255, 255, 0.9) inset,
		0 -1px 0 rgba(16, 20, 28, 0.06) inset,
		0 24px 48px rgba(0, 0, 0, 0.35);
}

html[data-rl-theme="dark"] .rl-laptop__screen {
	box-shadow: 0 0 0 1px #ffffff;
}

html[data-rl-theme="dark"] .rl-laptop__address {
	background: rgba(16, 20, 28, 0.12);
	color: rgba(16, 20, 28, 0.72);
}

html[data-rl-theme="dark"] .rl-laptop__hinge {
	background: linear-gradient(180deg, #b0b7c2, #c8ced8);
}

html[data-rl-theme="dark"] .rl-laptop__base {
	background: linear-gradient(180deg, #e4e7ec 0%, #c8ced8 100%);
	border-color: rgba(16, 20, 28, 0.12);
	box-shadow: 0 14px 28px rgba(0, 0, 0, 0.32);
}

html[data-rl-theme="dark"] .rl-laptop__indent {
	background: rgba(16, 20, 28, 0.14);
}

html[data-rl-theme="dark"] .rl-laptop__rig {
	filter: drop-shadow(0 22px 36px rgba(0, 0, 0, 0.42));
}

.rl-laptop__chrome {
	display: flex;
	align-items: center;
	gap: 0.65rem;
	margin-bottom: 0.45rem;
	min-width: 0;
}

.rl-laptop__traffic {
	display: inline-flex;
	gap: 0.28rem;
	flex: 0 0 auto;
}

.rl-laptop__traffic span {
	width: 0.42rem;
	height: 0.42rem;
	border-radius: 50%;
	background: rgba(244, 246, 248, 0.22);
}

.rl-laptop__traffic span:nth-child(1) { background: #ff5f57; }
.rl-laptop__traffic span:nth-child(2) { background: #febc2e; }
.rl-laptop__traffic span:nth-child(3) { background: #28c840; }

.rl-laptop__address {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	align-items: center;
	gap: 0.4rem;
	padding: 0.28rem 0.65rem;
	border-radius: 999px;
	background: rgba(0, 0, 0, 0.35);
	color: rgba(244, 246, 248, 0.72);
	font-family: var(--rl-mono);
	font-size: 0.68rem;
	letter-spacing: 0.02em;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.rl-laptop__lock {
	width: 0.45rem;
	height: 0.45rem;
	border-radius: 50%;
	background: var(--rl-signal);
	box-shadow: 0 0 0 2px rgba(212, 255, 79, 0.2);
	flex: 0 0 auto;
}

.rl-laptop__screen {
	position: relative;
	width: 100%;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	border-radius: 0.2rem;
	background: #0b0d10;
	container-type: inline-size;
	container-name: rl-laptop-screen;
	isolation: isolate;
}

.rl-laptop__shot {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: top center;
	pointer-events: none;
	user-select: none;
	transform: scale(1.01);
}

.rl-laptop__frame {
	position: absolute;
	top: 0;
	inset-inline-start: 0;
	width: 1920px;
	height: 1080px;
	border: 0;
	background: #fff;
	pointer-events: none;
	transform: scale(var(--rl-laptop-scale));
	transform-origin: top left;
	user-select: none;
}

[dir="rtl"] .rl-laptop__frame {
	transform-origin: top right;
}

.rl-laptop__glass {
	position: absolute;
	inset: 0;
	z-index: 3;
	pointer-events: none;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), transparent 28%);
}

.rl-laptop__shutter {
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background: #050608;
	transform-origin: top center;
	transform: scaleY(1);
	opacity: 1;
}

.rl-laptop__hit {
	position: absolute;
	inset: 0;
	z-index: 4;
	display: grid;
	place-items: end center;
	padding: 0.85rem;
	text-decoration: none;
	color: #10140a;
	opacity: 1;
	background: linear-gradient(180deg, transparent 55%, rgba(11, 13, 16, 0.5) 100%);
}

.rl-laptop__hit span {
	display: inline-flex;
	align-items: center;
	min-height: 2.35rem;
	padding: 0.45rem 0.9rem;
	font-family: var(--rl-mono);
	font-size: 0.7rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	background: var(--rl-signal);
	border: 1px solid color-mix(in srgb, var(--rl-signal) 70%, #10140a);
}

.rl-laptop__hinge {
	height: 0.35rem;
	margin: 0 0.5%;
	background: linear-gradient(180deg, #0a0c0f, #1a2028);
	border-radius: 0 0 2px 2px;
}

.rl-laptop__base {
	position: relative;
	height: 0.95rem;
	margin: 0 -0.5%;
	border-radius: 0 0 0.75rem 0.75rem;
	background: linear-gradient(180deg, #222932 0%, #0f1318 100%);
	border: 1px solid rgba(244, 246, 248, 0.1);
	border-top: 0;
	box-shadow: 0 14px 28px rgba(0, 0, 0, 0.28);
}

.rl-laptop__indent {
	position: absolute;
	top: 0.22rem;
	left: 50%;
	transform: translateX(-50%);
	width: min(28%, 8rem);
	height: 0.22rem;
	border-radius: 999px;
	background: rgba(244, 246, 248, 0.12);
}

.rl-laptop__note {
	margin: 0.85rem 0 0;
	text-align: center;
	font-family: var(--rl-mono);
	font-size: 0.66rem;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--rl-muted);
}

.rl-laptop-stage.is-live.is-cinematic-done .rl-laptop-stage__glow,
.rl-product-cta.is-cinematic-done .rl-laptop-stage__glow {
	animation: rl-laptop-pulse 4.8s ease-in-out infinite;
}

@keyframes rl-laptop-pulse {
	0%,
	100% { opacity: 0.45; transform: translateZ(0) scale(1); }
	50% { opacity: 0.75; transform: translateZ(0) scale(1.05); }
}

/* Lite cinematic entrance (mobile / fallback) — scroll-driven via --rl-cine-* */
.rl-product-cta.is-lite.is-cinematic-ready .rl-laptop__rig {
	transform:
		translate3d(0, calc((1 - var(--rl-cine-progress, 0)) * 22px), 0)
		scale(calc(0.94 + var(--rl-cine-progress, 0) * 0.06))
		rotateX(calc(12deg - var(--rl-cine-lid, 0) * 7deg));
	opacity: calc(0.55 + var(--rl-cine-progress, 0) * 0.45);
	transform-origin: 50% 80%;
	will-change: transform, opacity;
	transition: none;
}

.rl-product-cta.is-lite.is-cinematic-ready .rl-laptop__lid {
	transform: rotateX(calc(-8deg - var(--rl-cine-lid, 0) * 87deg));
	transform-origin: 50% 100%;
	transition: none;
}

.rl-product-cta.is-lite.is-cinematic-ready .rl-laptop__shutter {
	transform: scaleY(calc(1 - var(--rl-cine-screen, 0)));
	opacity: calc(1 - var(--rl-cine-screen, 0));
	transition: none;
}

.rl-product-cta.is-lite.is-cinematic-playing .rl-product-cta__beam,
.rl-product-cta.is-lite.is-cinematic-done .rl-product-cta__beam {
	opacity: calc(0.35 + var(--rl-cine-screen, 0) * 0.4);
	transform: translateX(-50%) scale(calc(0.95 + var(--rl-cine-screen, 0) * 0.1));
	transition: none;
}

.rl-laptop-3d__canvas {
	filter: none;
}

@media (max-width: 900px) {
	.rl-product-cta {
		margin-inline: calc(50% - 50vw);
		width: 100vw;
		padding: 2rem var(--rl-pad) 2.75rem;
		min-height: 0 !important;
		overflow: visible;
	}

	.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"],
	.rl-segment.rl-product-cta[data-rl-laptop-mode="lite"],
	.rl-product-cta--after-hero,
	.rl-product-cta--after-hero.is-lite {
		min-height: 0 !important;
		padding: 2rem var(--rl-pad) 2.75rem;
		overflow: visible;
		background: var(--rl-canvas);
	}

	.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__pin,
	.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__pin.is-pinned,
	.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__pin.is-released,
	.rl-product-cta__pin,
	.rl-product-cta--after-hero .rl-product-cta__pin {
		position: relative !important;
		top: auto !important;
		bottom: auto !important;
		left: auto !important;
		width: auto !important;
		height: auto !important;
		min-height: 0 !important;
		overflow: visible !important;
		padding: 0 !important;
		opacity: 1 !important;
		visibility: visible !important;
		transform: none !important;
		will-change: auto;
		background: transparent;
		pointer-events: auto;
	}

	.rl-segment.rl-product-cta[data-rl-laptop-mode="rich"] .rl-product-cta__head,
	.rl-product-cta--after-hero .rl-product-cta__head,
	.rl-product-cta--after-hero.is-lite .rl-product-cta__head {
		position: relative;
		z-index: 2;
		max-width: none;
		margin: 0 0 1.25rem;
		padding: 0;
		border: 0;
		background: transparent;
		backdrop-filter: none;
		box-shadow: none;
		opacity: 1 !important;
		transform: none !important;
		pointer-events: auto;
	}

	.rl-laptop-stage:not(.rl-laptop-stage--dock) {
		perspective: none;
		padding: 1rem 0 1.5rem;
	}

	/* Live Products dock — body owns inset; stage fills its column */
	.rl-footer-dock .rl-footer-dock__body {
		width: min(100% - (max(1.25rem, var(--rl-pad)) * 2), var(--rl-max));
		margin-inline: auto;
		padding: 0.75rem 0 0.5rem;
		display: block;
		box-sizing: border-box;
	}

	.rl-footer-dock .rl-footer-dock__notes {
		display: none;
	}

	.rl-footer-dock .rl-laptop-stage--dock {
		width: 100% !important;
		max-width: 100% !important;
		margin: 0 !important;
		padding: 0 !important;
		box-sizing: border-box;
		overflow: hidden;
	}

	.rl-footer-dock .rl-laptop-stage--dock .rl-laptop {
		width: 100% !important;
		max-width: 100% !important;
		margin-inline: auto;
		box-sizing: border-box;
	}

	.rl-footer-dock .rl-laptop-stage--dock .rl-laptop__lid {
		padding-inline: 0;
	}

	.rl-footer-dock .rl-laptop-stage--dock .rl-laptop__base {
		margin-inline: 0;
	}

	.rl-product-cta--after-hero .rl-laptop-stage,
	.rl-product-cta--after-hero.is-lite .rl-laptop-stage,
	.rl-product-cta--after-hero.is-cinematic-ready .rl-laptop-stage {
		display: block !important;
		position: relative;
		z-index: 1;
		inset: auto;
		width: 100%;
		margin: 0.25rem 0 0;
		padding: 0.5rem 0 0;
		overflow: visible;
		perspective: none;
		transform: none;
	}

	/* Flat open 2D laptop — never leave the lid/shutter in cinematic closed state */
	.rl-product-cta--after-hero [data-rl-laptop-lite],
	.rl-product-cta--after-hero.is-lite [data-rl-laptop-lite],
	.rl-product-cta--after-hero[data-rl-laptop-mode="rich"] [data-rl-laptop-lite],
	.rl-product-cta--after-hero.is-cinematic-ready [data-rl-laptop-lite] {
		display: block !important;
		visibility: visible !important;
		opacity: 1 !important;
		width: 100%;
		max-width: min(28rem, 100%);
		margin-inline: auto;
	}

	.rl-product-cta--after-hero .rl-laptop-3d,
	.rl-product-cta--after-hero .rl-product-cta__beats,
	.rl-product-cta--after-hero .rl-product-cta__vignette,
	.rl-product-cta--after-hero .rl-laptop-stage__glow,
	.rl-product-cta--after-hero .rl-laptop-stage__floor,
	.rl-product-cta--after-hero .rl-laptop-stage__horizon {
		display: none !important;
	}

	.rl-product-cta--after-hero .rl-laptop,
	.rl-product-cta--after-hero.is-lite .rl-laptop {
		display: block !important;
		width: 100%;
		max-width: min(28rem, 100%);
		margin-inline: auto;
		transform: none !important;
		opacity: 1 !important;
	}

	.rl-product-cta--after-hero .rl-laptop__rig,
	.rl-product-cta--after-hero.is-lite .rl-laptop__rig,
	.rl-product-cta--after-hero.is-lite.is-cinematic-ready .rl-laptop__rig,
	.rl-product-cta--after-hero.is-lite.is-cinematic-playing .rl-laptop__rig,
	.rl-product-cta--after-hero.is-lite.is-cinematic-done .rl-laptop__rig,
	.rl-product-cta--after-hero.is-cinematic-ready .rl-laptop__rig {
		transform: none !important;
		transform-origin: 50% 50%;
		opacity: 1 !important;
		filter: drop-shadow(0 18px 32px rgba(0, 0, 0, 0.32));
		transition: none !important;
		will-change: auto;
	}

	.rl-product-cta--after-hero .rl-laptop__lid,
	.rl-product-cta--after-hero.is-lite.is-cinematic-ready .rl-laptop__lid,
	.rl-product-cta--after-hero.is-cinematic-ready .rl-laptop__lid {
		transform: none !important;
		transform-origin: 50% 100%;
		transition: none !important;
	}

	.rl-product-cta--after-hero .rl-laptop__base,
	.rl-product-cta--after-hero .rl-laptop__hinge {
		transform: none !important;
		opacity: 1 !important;
	}

	.rl-product-cta--after-hero .rl-laptop__screen {
		aspect-ratio: 16 / 9;
		min-height: 10rem;
	}

	.rl-product-cta--after-hero .rl-laptop__shot,
	.rl-product-cta--after-hero .rl-laptop__frame {
		display: block !important;
		width: 100%;
		height: 100%;
		object-fit: cover;
		opacity: 1 !important;
	}

	.rl-product-cta--after-hero .rl-laptop__note {
		margin-top: 0.65rem;
		text-align: center;
		opacity: 1;
	}

	.rl-product-cta--after-hero .rl-laptop__shutter,
	.rl-product-cta--after-hero.is-lite.is-cinematic-ready .rl-laptop__shutter,
	.rl-product-cta--after-hero.is-lite.is-cinematic-playing .rl-laptop__shutter,
	.rl-product-cta--after-hero.is-lite.is-cinematic-done .rl-laptop__shutter,
	.rl-product-cta--after-hero.is-cinematic-ready .rl-laptop__shutter {
		transform: scaleY(0) !important;
		opacity: 0 !important;
		pointer-events: none;
	}

	.rl-product-cta--after-hero .rl-laptop__hit {
		opacity: 1;
		pointer-events: auto;
	}

	.rl-laptop {
		max-width: 100%;
	}

	.rl-laptop__rig {
		filter: drop-shadow(0 16px 28px rgba(0, 0, 0, 0.28));
	}

	.rl-laptop-3d {
		display: none !important;
	}

	.rl-product-cta__grain {
		display: none;
	}
}

@media (max-width: 640px) {
	.rl-laptop__lid {
		padding: 0;
	}

	.rl-laptop__bezel {
		padding: 0.4rem 0.4rem 0.55rem;
		border-radius: 0.65rem 0.65rem 0.25rem 0.25rem;
	}

	.rl-laptop__address {
		font-size: 0.6rem;
	}

	.rl-laptop-stage__floor {
		opacity: 0.22;
	}
}

@media (prefers-reduced-motion: reduce) {
	.rl-laptop-stage.is-live.is-cinematic-done .rl-laptop-stage__glow,
	.rl-product-cta.is-cinematic-done .rl-laptop-stage__glow {
		animation: none;
	}

	.rl-product-cta.is-lite.is-cinematic-ready .rl-laptop__rig,
	.rl-product-cta.is-lite.is-cinematic-playing .rl-laptop__rig,
	.rl-product-cta.is-lite.is-cinematic-done .rl-laptop__rig {
		transform: none;
		opacity: 1;
		transition: none;
	}

	.rl-product-cta.is-lite.is-cinematic-ready .rl-laptop__lid,
	.rl-product-cta.is-lite.is-cinematic-playing .rl-laptop__lid,
	.rl-product-cta.is-lite.is-cinematic-done .rl-laptop__lid {
		transform: rotateX(-95deg);
		transition: none;
	}

	.rl-product-cta.is-lite.is-cinematic-ready .rl-laptop__shutter,
	.rl-product-cta.is-lite.is-cinematic-playing .rl-laptop__shutter,
	.rl-product-cta.is-lite.is-cinematic-done .rl-laptop__shutter {
		transform: scaleY(0);
		opacity: 0;
		transition: none;
	}

	.rl-product-cta__head {
		opacity: 1;
		transform: none;
	}
}