/* FocalPick theme. Two schemes share one set of tokens: dark (camera body) and light (studio). */

@font-face {
	font-family: "Archivo";
	font-style: normal;
	font-weight: 100 900;
	font-stretch: 62% 125%;
	font-display: swap;
	src: url("../fonts/archivo.woff2") format("woff2");
}

@font-face {
	font-family: "JetBrains Mono";
	font-style: normal;
	font-weight: 100 800;
	font-display: swap;
	src: url("../fonts/jetbrains-mono.woff2") format("woff2");
}

/* ------------------------------------------------------------------ tokens */

:root,
[data-scheme="dark"] {
	color-scheme: dark;
	--bg: #0e0f11;
	--bg-alt: #121417;
	--surface: #17191c;
	--surface-2: #121417;
	--plate: #f1f0ec;
	--plate-ink: #6b7077;
	--border: #24272b;
	--border-strong: #34383e;
	--text: #f2f1ee;
	--text-2: #c4c7cc;
	--muted: #8e949b;
	--grey-head: #8e949b;
	--accent: #ff3b30;
	--accent-text: #ff6a61;
	--btn: #e5261c;
	--btn-text: #ffffff;
	--solid: #f2f1ee;
	--solid-text: #0e0f11;
	--band: #121417;
	--band-text: #f2f1ee;
	--band-text-2: #c4c7cc;
	--band-card: #17191c;
	--band-border: #24272b;
	--strip: #121417;
	--strip-border: #2c3035;
	--strip-note: #17191c;
	--bracket: #f2f1ee;
	--lens-shadow: transparent;
	--shadow: none;
	--good: #4cc38a;
	--bad: #ff6a61;
}

[data-scheme="light"] {
	color-scheme: light;
	--bg: #f6f5f2;
	--bg-alt: #edece7;
	--surface: #ffffff;
	--surface-2: #f6f5f2;
	--plate: #f1f0ec;
	--plate-ink: #6b7077;
	--border: #dcdad3;
	--border-strong: #c4c2ba;
	--text: #121315;
	--text-2: #3d4147;
	--muted: #5f646b;
	--grey-head: #6b7077;
	--accent: #d7261e;
	--accent-text: #b5170f;
	--btn: #d7261e;
	--btn-text: #ffffff;
	--solid: #121315;
	--solid-text: #ffffff;
	--band: #121315;
	--band-text: #f2f1ee;
	--band-text-2: #c4c7cc;
	--band-card: #1b1d20;
	--band-border: #2c3035;
	--strip: #121315;
	--strip-border: #2c3035;
	--strip-note: #1b1d20;
	--bracket: #121315;
	--lens-shadow: #dcdad3;
	--shadow: 0 1px 2px rgba(18, 19, 21, 0.04), 0 8px 24px rgba(18, 19, 21, 0.05);
	--good: #13804f;
	--bad: #b3261e;
}

@media (prefers-color-scheme: light) {
	[data-scheme="auto"] {
		color-scheme: light;
		--bg: #f6f5f2;
		--bg-alt: #edece7;
		--surface: #ffffff;
		--surface-2: #f6f5f2;
		--border: #dcdad3;
		--border-strong: #c4c2ba;
		--text: #121315;
		--text-2: #3d4147;
		--muted: #5f646b;
		--grey-head: #6b7077;
		--accent: #d7261e;
		--accent-text: #b5170f;
		--btn: #d7261e;
		--solid: #121315;
		--solid-text: #ffffff;
		--band: #121315;
		--band-card: #1b1d20;
		--band-border: #2c3035;
		--strip: #121315;
		--strip-note: #1b1d20;
		--bracket: #121315;
		--lens-shadow: #dcdad3;
		--shadow: 0 1px 2px rgba(18, 19, 21, 0.04), 0 8px 24px rgba(18, 19, 21, 0.05);
		--good: #13804f;
		--bad: #b3261e;
	}
}

/* ------------------------------------------------------------------ base */

*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	background: var(--bg);
	color: var(--text);
	font-family: "Archivo", system-ui, -apple-system, "Segoe UI", sans-serif;
	font-size: 17px;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

img {
	max-width: 100%;
	height: auto;
}

a {
	color: var(--text);
	text-decoration: none;
}

a:hover {
	color: var(--accent-text);
}

:focus-visible {
	outline: 2px solid var(--accent);
	outline-offset: 3px;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}

.fp-skip {
	position: absolute;
	left: 16px;
	top: -60px;
	z-index: 100;
	padding: 10px 14px;
	border-radius: 8px;
	background: var(--solid);
	color: var(--solid-text);
	font-weight: 700;
}

.fp-skip:focus {
	top: 12px;
}

.fp-container {
	max-width: 1240px;
	margin: 0 auto;
	padding-left: 24px;
	padding-right: 24px;
}

.fp-narrow {
	max-width: 808px;
}

.fp-mono,
.fp-label,
.fp-kicker,
.fp-eyebrow {
	font-family: "JetBrains Mono", ui-monospace, monospace;
}

.fp-label {
	display: block;
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--muted);
}

.fp-dot {
	display: inline-block;
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: var(--accent);
	flex: none;
}

.fp-icon {
	flex: none;
}

/* ------------------------------------------------------------------ buttons and fields */

.fp-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	min-height: 44px;
	padding: 0 18px;
	border: 0;
	border-radius: 10px;
	font: inherit;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.2;
	cursor: pointer;
	white-space: nowrap;
	transition: filter 0.15s ease, transform 0.15s ease;
}

.fp-btn:hover {
	filter: brightness(1.08);
}

.fp-btn:active {
	transform: translateY(1px);
}

.fp-btn--accent,
.fp-btn--accent:hover {
	background: var(--btn);
	color: var(--btn-text);
}

.fp-btn--solid,
.fp-btn--solid:hover {
	background: var(--solid);
	color: var(--solid-text);
}

.fp-btn--ghost,
.fp-btn--ghost:hover {
	background: transparent;
	color: var(--text);
	border: 1px solid var(--border-strong);
}

.fp-btn--lg {
	min-height: 58px;
	padding: 0 26px;
	font-size: 17px;
	border-radius: 12px;
}

.fp-link {
	align-self: flex-start;
	font-weight: 600;
	font-size: 15px;
	border-bottom: 1px solid var(--border-strong);
	padding-bottom: 2px;
}

.fp-field {
	flex: 1 1 260px;
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 48px;
	padding: 0 16px;
	border: 1px solid var(--border-strong);
	border-radius: 10px;
	background: var(--surface);
	color: var(--muted);
}

.fp-field input {
	flex: 1;
	min-width: 0;
	border: 0;
	outline: none;
	background: transparent;
	color: var(--text);
	font: inherit;
	font-size: 16px;
}

.fp-field input::placeholder {
	color: var(--muted);
}

.fp-field:focus-within {
	border-color: var(--text);
}

.fp-field--lg {
	min-height: 58px;
	border-radius: 12px;
}

.fp-field--lg input {
	font-size: 17px;
}

.fp-searchform {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

/* ------------------------------------------------------------------ header */

.fp-header {
	position: sticky;
	top: 0;
	z-index: 50;
	background: color-mix(in srgb, var(--bg) 92%, transparent);
	backdrop-filter: saturate(1.4) blur(10px);
	-webkit-backdrop-filter: saturate(1.4) blur(10px);
	border-bottom: 1px solid var(--border);
}

.admin-bar .fp-header {
	top: 32px;
}

.fp-header__inner {
	display: flex;
	align-items: center;
	gap: 28px;
	min-height: 72px;
}

.fp-logo,
.custom-logo-link {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-weight: 800;
	font-size: 22px;
	letter-spacing: -0.02em;
	font-stretch: 112%;
	color: var(--text);
	flex: none;
}

.custom-logo {
	max-height: 40px;
	width: auto;
}

.fp-logo__dot {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--accent);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 18%, transparent);
}

.fp-nav {
	flex: 1;
	min-width: 0;
}

.fp-menu {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 28px;
	font-size: 15px;
	font-weight: 500;
}

.fp-menu a {
	color: var(--text-2);
}

.fp-menu .current-menu-item > a,
.fp-menu .current-menu-parent > a,
.fp-menu a:hover {
	color: var(--text);
}

.fp-header__actions {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-left: auto;
}

.fp-iconbtn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 10px;
	border: 1px solid var(--border-strong);
	background: var(--surface);
	color: var(--text);
	cursor: pointer;
	list-style: none;
}

.fp-iconbtn::-webkit-details-marker {
	display: none;
}

.fp-pop {
	position: relative;
}

.fp-pop[open] > .fp-iconbtn {
	border-color: var(--text);
}

.fp-pop__panel {
	position: absolute;
	right: 0;
	top: calc(100% + 10px);
	width: min(440px, calc(100vw - 32px));
	padding: 16px;
	border: 1px solid var(--border-strong);
	border-radius: 14px;
	background: var(--surface);
	box-shadow: 0 18px 48px rgba(0, 0, 0, 0.35);
}

.fp-pop--menu {
	display: none;
}

.fp-menu--stack {
	flex-direction: column;
	gap: 0;
	font-size: 17px;
}

.fp-menu--stack a {
	display: block;
	padding: 12px 4px;
	border-bottom: 1px solid var(--border);
}

.fp-menu--stack li:last-child a {
	border-bottom: 0;
}

@media (max-width: 900px) {
	.fp-nav,
	.fp-header__cta {
		display: none;
	}

	.fp-pop--menu {
		display: block;
	}

	.fp-header__inner {
		min-height: 64px;
	}
}

@media (max-width: 782px) {
	.admin-bar .fp-header {
		top: 46px;
	}
}

@media (max-width: 600px) {
	.admin-bar .fp-header {
		top: 0;
		position: relative;
	}
}

/* ------------------------------------------------------------------ hero */

.fp-hero {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 48px;
	padding-top: 72px;
	padding-bottom: 64px;
}

.fp-hero__text {
	flex: 1 1 520px;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 26px;
}

.fp-eyebrow {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	font-size: 13px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--text-2);
}

.fp-hero__title {
	margin: 0;
	font-size: clamp(44px, 6.4vw, 76px);
	line-height: 0.98;
	font-weight: 800;
	letter-spacing: -0.035em;
	font-stretch: 108%;
}

.fp-hero__title span {
	display: block;
	color: var(--grey-head);
}

.fp-hero__sub {
	margin: 0;
	max-width: 540px;
	font-size: 20px;
	line-height: 1.55;
	color: var(--text-2);
}

.fp-finder {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	max-width: 580px;
}

.fp-chips {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
}

.fp-chips__label {
	font-size: 13px;
	color: var(--muted);
	margin-right: 4px;
}

.fp-chip {
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 13px;
	padding: 8px 12px;
	border-radius: 999px;
	border: 1px solid var(--border-strong);
	background: var(--surface);
	color: var(--text-2);
}

.fp-chip:hover {
	border-color: var(--text);
	color: var(--text);
}

.fp-hero__art {
	flex: 1 1 380px;
	min-width: 0;
	display: flex;
	justify-content: center;
}

.fp-viewfinder {
	position: relative;
	width: 100%;
	max-width: 480px;
	aspect-ratio: 1;
	background:
		linear-gradient(var(--bracket), var(--bracket)) top left / 44px 2px no-repeat,
		linear-gradient(var(--bracket), var(--bracket)) top left / 2px 44px no-repeat,
		linear-gradient(var(--bracket), var(--bracket)) top right / 44px 2px no-repeat,
		linear-gradient(var(--bracket), var(--bracket)) top right / 2px 44px no-repeat,
		linear-gradient(var(--bracket), var(--bracket)) bottom left / 44px 2px no-repeat,
		linear-gradient(var(--bracket), var(--bracket)) bottom left / 2px 44px no-repeat,
		linear-gradient(var(--bracket), var(--bracket)) bottom right / 44px 2px no-repeat,
		linear-gradient(var(--bracket), var(--bracket)) bottom right / 2px 44px no-repeat;
}

.fp-lens {
	display: block;
	width: 100%;
	height: 100%;
}

.fp-lens__shadow {
	fill: var(--lens-shadow);
	opacity: 0.6;
}

.fp-lens__rec {
	fill: var(--accent);
}

.fp-viewfinder__tag {
	position: absolute;
	left: 50%;
	bottom: -12px;
	transform: translateX(-50%);
	padding: 4px 12px;
	background: var(--bg);
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 12px;
	letter-spacing: 0.12em;
	color: var(--muted);
	white-space: nowrap;
}

.fp-ruler {
	border-top: 1px solid var(--border);
	border-bottom: 1px solid var(--border);
	background: var(--bg-alt);
}

.fp-ruler__inner {
	display: flex;
	justify-content: space-between;
	gap: 8px;
	padding-top: 18px;
	padding-bottom: 18px;
	overflow-x: auto;
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 13px;
	color: var(--muted);
	white-space: nowrap;
}

.fp-ruler .is-on {
	color: var(--accent-text);
	font-weight: 600;
}

/* ------------------------------------------------------------------ sections */

.fp-section {
	display: flex;
	flex-direction: column;
	gap: 32px;
	padding-top: 88px;
	padding-bottom: 40px;
}

.fp-section__head {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.fp-section__head--split {
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: flex-end;
	gap: 20px;
}

.fp-kicker {
	margin: 0;
	font-size: 13px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--accent-text);
}

.fp-h2 {
	margin: 0;
	font-size: clamp(32px, 4vw, 44px);
	line-height: 1.08;
	font-weight: 800;
	letter-spacing: -0.03em;
}

.fp-empty {
	margin: 0;
	padding: 28px;
	border: 1px dashed var(--border-strong);
	border-radius: 16px;
	color: var(--text-2);
}

.fp-tabs {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	padding: 4px;
	border-radius: 12px;
	background: var(--surface);
	border: 1px solid var(--border);
}

.fp-tabs[hidden] {
	display: none;
}

.fp-tab {
	min-height: 40px;
	padding: 0 16px;
	border: 0;
	border-radius: 9px;
	background: transparent;
	color: var(--text-2);
	font: inherit;
	font-size: 14px;
	font-weight: 600;
	cursor: pointer;
}

.fp-tab[aria-pressed="true"] {
	background: var(--solid);
	color: var(--solid-text);
	font-weight: 700;
}

.fp-grid {
	display: grid;
	gap: 16px;
}

.fp-grid--cams {
	grid-template-columns: repeat(auto-fill, minmax(min(260px, 100%), 1fr));
}

.fp-grid--guides {
	grid-template-columns: repeat(auto-fill, minmax(min(300px, 100%), 1fr));
	gap: 32px 24px;
}

.fp-cam {
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 16px;
	padding: 20px;
	border-radius: 16px;
	background: var(--surface);
	border: 1px solid var(--border);
	box-shadow: var(--shadow);
	color: var(--text);
	transition: border-color 0.15s ease, transform 0.15s ease;
}

.fp-cam:hover {
	color: var(--text);
	border-color: var(--border-strong);
	transform: translateY(-2px);
}

.fp-cam[hidden] {
	display: none;
}

.fp-cam__top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 8px;
}

.fp-cam__mount {
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 12px;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--muted);
}

.fp-badge {
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 11px;
	padding: 4px 8px;
	border-radius: 6px;
	background: var(--bg-alt);
	color: var(--text-2);
	text-transform: uppercase;
}

.fp-cam__media {
	min-width: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 120px;
	border-radius: 10px;
	background: var(--plate);
	color: var(--plate-ink);
	overflow: hidden;
}

.fp-cam__media img {
	min-width: 0;
	max-width: 100%;
	width: 100%;
	height: 100%;
	object-fit: contain;
	mix-blend-mode: multiply;
}

.fp-cam__name {
	font-size: 20px;
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 1.25;
}

.fp-cam__go {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: -10px;
	font-size: 14px;
	color: var(--muted);
}

.fp-jobs {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(220px, 100%), 1fr));
	gap: 1px;
	background: var(--border);
	border: 1px solid var(--border);
	border-radius: 16px;
	overflow: hidden;
}

.fp-job {
	display: flex;
	flex-direction: column;
	gap: 8px;
	min-height: 120px;
	padding: 24px;
	background: var(--bg);
	color: var(--text);
}

a.fp-job:hover {
	background: var(--surface);
	color: var(--text);
}

.fp-job__name {
	font-size: 19px;
	font-weight: 700;
}

.fp-job__rule {
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 12.5px;
	line-height: 1.5;
	color: var(--muted);
}

.fp-band {
	margin-top: 48px;
	background: var(--band);
	color: var(--band-text);
	border-top: 1px solid var(--border);
	border-bottom: 1px solid var(--border);
}

.fp-band .fp-section {
	padding-bottom: 88px;
}

.fp-band .fp-kicker {
	color: #ff6a61;
}

.fp-band .fp-link {
	color: var(--band-text);
	border-color: #5b6168;
}

.fp-rules {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(280px, 100%), 1fr));
	gap: 20px;
}

.fp-rule {
	display: flex;
	flex-direction: column;
	gap: 14px;
	padding: 28px;
	border-radius: 16px;
	background: var(--band-card);
	border: 1px solid var(--band-border);
}

.fp-rule__n {
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 40px;
	font-weight: 500;
	line-height: 1;
	color: #6f757c;
}

.fp-rule h3 {
	margin: 0;
	font-size: 22px;
}

.fp-rule p {
	margin: 0;
	font-size: 16px;
	line-height: 1.6;
	color: var(--band-text-2);
}

.fp-card {
	display: flex;
	flex-direction: column;
	gap: 14px;
	min-width: 0;
}

.fp-card__media {
	min-width: 0;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 16 / 10;
	border-radius: 14px;
	background: var(--plate);
	color: var(--plate-ink);
	overflow: hidden;
}

.fp-card__media img {
	min-width: 0;
	max-width: 100%;
	width: 100%;
	height: 100%;
	padding: 18px;
	object-fit: contain;
	mix-blend-mode: multiply;
}

.fp-card__tag {
	position: absolute;
	top: 14px;
	left: 14px;
	padding: 5px 9px;
	border-radius: 6px;
	background: #121315;
	color: #ffffff;
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 11px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
}

.fp-card__title {
	margin: 0;
	font-size: 23px;
	line-height: 1.25;
	font-weight: 700;
	letter-spacing: -0.015em;
}

.fp-card__text {
	margin: -4px 0 0;
	font-size: 15px;
	line-height: 1.55;
	color: var(--muted);
}

.fp-archive-desc,
.fp-archive-search {
	max-width: 720px;
	color: var(--text-2);
}

.pagination .nav-links {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 24px;
}

.pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	min-height: 44px;
	padding: 0 14px;
	border: 1px solid var(--border-strong);
	border-radius: 10px;
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 14px;
}

.pagination .page-numbers.current {
	background: var(--solid);
	color: var(--solid-text);
	border-color: var(--solid);
}

.fp-404 {
	display: flex;
	flex-direction: column;
	gap: 24px;
	max-width: 760px;
	padding-top: 96px;
	padding-bottom: 120px;
}

/* ------------------------------------------------------------------ article */

.fp-article__head {
	display: flex;
	flex-direction: column;
	gap: 20px;
	padding-top: 40px;
}

.fp-crumbs {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 13px;
	color: var(--muted);
}

.fp-crumbs a {
	color: var(--muted);
}

.fp-crumbs [aria-current] {
	color: var(--text-2);
}

.fp-title {
	margin: 0;
	max-width: 920px;
	font-size: clamp(36px, 5.2vw, 64px);
	line-height: 1.03;
	font-weight: 800;
	letter-spacing: -0.035em;
	font-stretch: 106%;
}

.fp-dek {
	margin: 0;
	max-width: 760px;
	font-size: 20px;
	line-height: 1.55;
	color: var(--text-2);
}

.fp-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 8px 14px;
	font-size: 14px;
	color: var(--muted);
}

.fp-meta a {
	color: var(--text-2);
}

.fp-specstrip {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
	margin-top: 8px;
	border-radius: 16px;
	background: var(--strip);
	border: 1px solid var(--strip-border);
	color: #f2f1ee;
	overflow: hidden;
}

.fp-spec {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 18px 22px;
	border-right: 1px solid var(--strip-border);
	border-bottom: 1px solid var(--strip-border);
	margin: 0 -1px -1px 0;
}

.fp-spec__k {
	display: flex;
	align-items: center;
	gap: 8px;
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: #a3a7ad;
}

.fp-spec__v {
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 20px;
	font-weight: 600;
}

.fp-spec--note {
	background: var(--strip-note);
}

.fp-spec--note .fp-spec__k {
	color: #ff6a61;
}

.fp-spec__note {
	font-size: 15px;
	line-height: 1.45;
	color: #d6d8db;
}

.fp-layout {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 48px;
	padding-top: 40px;
	padding-bottom: 72px;
}

.fp-main {
	flex: 999 1 620px;
	min-width: 0;
}

.fp-aside {
	flex: 1 1 260px;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 20px;
	position: sticky;
	top: 96px;
	max-height: calc(100vh - 120px);
	overflow-y: auto;
}

.fp-toc {
	padding: 22px;
	border: 1px solid var(--border);
	border-radius: 16px;
	background: var(--surface);
	box-shadow: var(--shadow);
}

.fp-toc ol {
	list-style: none;
	margin: 10px 0 0;
	padding: 0;
}

.fp-toc a {
	display: flex;
	gap: 10px;
	padding: 7px 0;
	font-size: 14.5px;
	line-height: 1.35;
	color: var(--text-2);
}

.fp-toc a:hover,
.fp-toc a.is-active {
	color: var(--text);
}

.fp-toc a.is-active {
	font-weight: 700;
}

.fp-toc li.is-pick a {
	padding-left: 6px;
}

.fp-toc__num {
	flex: none;
	font-family: "JetBrains Mono", ui-monospace, monospace;
	color: var(--muted);
}

.fp-toc-mobile {
	display: none;
	margin-bottom: 28px;
	border: 1px solid var(--border);
	border-radius: 14px;
	background: var(--surface);
}

.fp-toc-mobile > summary {
	padding: 14px 18px;
	font-weight: 700;
	cursor: pointer;
}

.fp-toc-mobile .fp-toc {
	border: 0;
	box-shadow: none;
	padding-top: 0;
	background: transparent;
}

.fp-toc-mobile .fp-toc .fp-label {
	display: none;
}

.fp-asidebox {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	padding: 22px;
	border-radius: 16px;
	background: var(--bg-alt);
	border: 1px solid var(--border);
}

.fp-asidebox p {
	margin: 0;
	font-size: 15px;
	line-height: 1.5;
	color: var(--text-2);
}

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

	.fp-toc-mobile {
		display: block;
	}
}

.fp-author {
	display: flex;
	gap: 18px;
	align-items: flex-start;
	margin-top: 56px;
	padding: 24px;
	border: 1px solid var(--border);
	border-radius: 16px;
	background: var(--surface);
}

.fp-author__img {
	border-radius: 50%;
	flex: none;
}

.fp-author__name {
	display: block;
	margin-top: 4px;
	font-size: 18px;
	font-weight: 700;
}

.fp-author p {
	margin: 6px 0 0;
	font-size: 15px;
	color: var(--text-2);
}

.fp-related {
	padding-top: 24px;
	padding-bottom: 88px;
	display: flex;
	flex-direction: column;
	gap: 28px;
	border-top: 1px solid var(--border);
}

.fp-related .fp-h2 {
	margin-top: 56px;
	font-size: 32px;
}

/* ------------------------------------------------------------------ article body */

.fp-entry {
	font-size: 17.5px;
	line-height: 1.75;
	color: var(--text-2);
}

.fp-entry > * {
	max-width: 760px;
}

.fp-entry > .ae-table-wrap,
.fp-entry > .ae-card,
.fp-entry > .ae-proscons,
.fp-entry > .ae-versus,
.fp-entry > .alignwide,
.fp-entry > figure.wp-block-table {
	max-width: none;
}

.fp-entry p {
	margin: 0 0 1.15em;
}

.fp-entry strong {
	color: var(--text);
}

.fp-entry a:not(.ae-btn):not(.ae-table__name) {
	color: var(--text);
	text-decoration: underline;
	text-decoration-color: var(--accent);
	text-underline-offset: 3px;
}

.fp-entry h2,
.fp-entry h3,
.fp-entry h4 {
	color: var(--text);
	line-height: 1.2;
	letter-spacing: -0.02em;
	scroll-margin-top: 96px;
}

.fp-entry h2 {
	margin: 2.2em 0 0.6em;
	font-size: 30px;
	font-weight: 800;
}

.fp-entry h3 {
	margin: 1.8em 0 0.5em;
	font-size: 22px;
	font-weight: 800;
}

.fp-entry h4 {
	margin: 1.5em 0 0.4em;
	font-size: 18px;
}

.fp-entry ul,
.fp-entry ol {
	padding-left: 1.2em;
	margin: 0 0 1.2em;
}

.fp-entry li {
	margin: 0.3em 0;
}

.fp-entry li::marker {
	color: var(--muted);
}

.fp-entry blockquote {
	margin: 1.5em 0;
	padding: 4px 0 4px 20px;
	border-left: 3px solid var(--accent);
	color: var(--text);
	font-size: 19px;
}

.fp-entry figure {
	margin: 1.5em 0;
}

.fp-entry figcaption {
	font-size: 14px;
	color: var(--muted);
	margin-top: 8px;
}

.fp-entry img {
	border-radius: 12px;
}

.fp-entry hr {
	border: 0;
	border-top: 1px solid var(--border);
	margin: 2.5em 0;
}

.fp-entry table:not(.ae-table) {
	width: 100%;
	border-collapse: collapse;
	font-size: 15px;
}

.fp-entry table:not(.ae-table) th,
.fp-entry table:not(.ae-table) td {
	padding: 10px 12px;
	border-bottom: 1px solid var(--border);
	text-align: left;
}

.fp-entry code {
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 0.88em;
	padding: 2px 6px;
	border-radius: 6px;
	background: var(--bg-alt);
}

/* ------------------------------------------------------------------ CreBirds Ai cards, tables and buttons */

.fp {
	--ae-primary: var(--btn);
	--ae-on-primary: var(--btn-text);
	--ae-dark: var(--solid);
	--ae-on-dark: var(--solid-text);
	--ae-surface: var(--plate);
	--ae-border: var(--border);
	--ae-text: var(--text);
	--ae-muted: var(--muted);
	--ae-good: var(--good);
	--ae-bad: var(--bad);
	--ae-radius: 14px;
}

.fp-entry .ae-disclosure {
	padding: 0;
	border: 0;
	font-size: 14px;
	line-height: 1.5;
	color: var(--muted);
}

.fp-entry .ae-num {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 1.9em;
	height: 1.9em;
	margin-right: 0.45em;
	padding: 0 0.35em;
	border-radius: 8px;
	background: var(--solid);
	color: var(--solid-text);
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 0.6em;
	font-weight: 600;
	vertical-align: 0.28em;
	letter-spacing: 0;
}

.fp-entry .ae-pick-heading {
	margin-top: 2.4em;
	padding-top: 1.1em;
	border-top: 1px solid var(--border);
	font-size: 32px;
	letter-spacing: -0.025em;
}

/* Quick picks table */
.fp-entry .ae-table-wrap {
	margin: 1.6em 0 2em;
	border: 1px solid var(--border);
	border-radius: 16px;
	background: var(--surface);
	box-shadow: var(--shadow);
}

.fp-entry .ae-table {
	font-size: 15px;
	color: var(--text-2);
}

.fp-entry .ae-table th,
.fp-entry .ae-table td {
	padding: 14px 16px;
	border-bottom: 1px solid var(--border);
}

.fp-entry .ae-table thead th {
	background: var(--surface-2);
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--muted);
}

.fp-entry .ae-table .ae-num {
	background: transparent;
	color: var(--muted);
	font-size: 14px;
	margin: 0;
	min-width: 0;
	padding: 0;
	height: auto;
	vertical-align: baseline;
}

.fp-entry .ae-table__img {
	width: 64px;
	height: 64px;
	padding: 6px;
	border-radius: 10px;
	background: var(--plate);
	object-fit: contain;
	mix-blend-mode: normal;
}

.fp-entry .ae-table__name {
	color: var(--text);
	font-weight: 700;
	line-height: 1.3;
}

.fp-entry .ae-table__label {
	margin-top: 3px;
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 11px;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--muted);
}

/* Pick card */
.fp-entry .ae-card {
	position: relative;
	margin: 1em 0 1.4em;
	padding: 22px;
	border: 1px solid var(--border);
	border-radius: 20px;
	background: var(--surface);
	box-shadow: var(--shadow);
}

.fp-entry .ae-card__label {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	margin: 0 0 12px;
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--text);
}

.fp-entry .ae-card__label::before {
	content: "";
	width: 9px;
	height: 9px;
	border-radius: 50%;
	background: var(--accent);
}

.fp-entry .ae-card__fit {
	display: flex;
	align-items: center;
	gap: 8px;
	width: fit-content;
	margin: 0 0 16px;
	padding: 8px 12px;
	border-radius: 8px;
	border: 1px solid var(--border);
	background: var(--bg);
	font-size: 14px;
	line-height: 1.35;
	color: var(--text-2);
}

.fp-entry .ae-card__fit::before {
	content: "\2713";
	color: var(--good);
	font-weight: 700;
}

.fp-entry .ae-card__media {
	position: relative;
	min-height: 220px;
	margin: 0 0 16px;
	padding: 36px;
	border-radius: 14px;
	background:
		linear-gradient(#9a9ea4, #9a9ea4) top 14px left 14px / 22px 2px no-repeat,
		linear-gradient(#9a9ea4, #9a9ea4) top 14px left 14px / 2px 22px no-repeat,
		linear-gradient(#9a9ea4, #9a9ea4) top 14px right 14px / 22px 2px no-repeat,
		linear-gradient(#9a9ea4, #9a9ea4) top 14px right 14px / 2px 22px no-repeat,
		linear-gradient(#9a9ea4, #9a9ea4) bottom 14px left 14px / 22px 2px no-repeat,
		linear-gradient(#9a9ea4, #9a9ea4) bottom 14px left 14px / 2px 22px no-repeat,
		linear-gradient(#9a9ea4, #9a9ea4) bottom 14px right 14px / 22px 2px no-repeat,
		linear-gradient(#9a9ea4, #9a9ea4) bottom 14px right 14px / 2px 22px no-repeat,
		var(--plate);
}

.fp-entry .ae-card__img {
	max-height: 260px;
	border-radius: 0;
	mix-blend-mode: multiply;
}

.fp-entry .ae-card__name {
	color: var(--text);
	font-size: 19px;
}

/* Buttons */
.fp-entry .ae-buttons {
	gap: 10px;
}

.fp-entry .ae-btn,
.fp-entry .ae-btn:visited {
	min-height: 52px;
	padding: 12px 20px;
	border-radius: 11px;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0;
}

.fp-entry .ae-btn::after {
	content: "\2197";
}

.fp-entry .ae-btn--primary,
.fp-entry .ae-btn--primary:visited,
.fp-entry .ae-btn--primary:hover {
	background: var(--btn);
	color: var(--btn-text) !important;
}

.fp-entry .ae-btn--dark,
.fp-entry .ae-btn--dark:visited,
.fp-entry .ae-btn--dark:hover {
	background: var(--solid);
	color: var(--solid-text) !important;
}

.fp-entry .ae-buttons--compact .ae-btn {
	min-height: 40px;
	padding: 8px 14px;
	font-size: 14px;
	border-radius: 9px;
}

.fp-entry .ae-table--picks .ae-buttons--compact .ae-btn--primary {
	background: transparent;
	color: var(--text) !important;
	border: 1px solid var(--border-strong);
}

.fp-entry .ae-table--picks .ae-buttons--compact .ae-btn--primary:hover {
	border-color: var(--btn);
	background: var(--btn);
	color: var(--btn-text) !important;
}

/* Pros and cons */
.fp-entry .ae-proscons {
	gap: 24px;
	margin: 1.2em 0 1.4em;
}

.fp-entry .ae-pros,
.fp-entry .ae-cons {
	padding: 0;
	border: 0;
}

.fp-entry .ae-proscons__title {
	margin-bottom: 8px;
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 11px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--muted) !important;
}

.fp-entry .ae-proscons ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.fp-entry .ae-proscons li {
	position: relative;
	margin: 0 0 6px;
	padding-left: 20px;
	font-size: 15.5px;
	line-height: 1.5;
	color: var(--text);
}

.fp-entry .ae-pros li::before,
.fp-entry .ae-cons li::before {
	position: absolute;
	left: 0;
	font-weight: 700;
}

.fp-entry .ae-pros li::before {
	content: "+";
	color: var(--good);
}

.fp-entry .ae-cons li::before {
	content: "\2212";
	color: var(--bad);
}

/* Key specs */
.fp-entry .ae-specs {
	margin: 0 0 1.6em;
	padding: 0 18px;
	border: 1px solid var(--border);
	border-radius: 14px;
	background: var(--surface-2);
}

.fp-entry .ae-specs summary {
	padding: 14px 0;
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 12px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--text);
}

.fp-entry .ae-table--compact th,
.fp-entry .ae-table--compact td {
	padding: 8px 0;
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 13.5px;
}

.fp-entry .ae-table--compact th {
	color: var(--muted);
	font-weight: 500;
}

.fp-entry .ae-table--compact td {
	color: var(--text);
}

/* Versus */
.fp-entry .ae-versus .ae-card {
	margin: 0;
}

.fp-entry .ae-winner {
	color: var(--accent-text);
}

/* Mobile buy bar (built by theme.js from the first pick) */
.fp-buybar {
	position: fixed;
	left: 12px;
	right: 12px;
	bottom: 12px;
	z-index: 40;
	display: none;
	align-items: center;
	gap: 12px;
	padding: 10px 10px 10px 16px;
	border-radius: 16px;
	background: #121315;
	border: 1px solid #34383e;
	color: #f2f1ee;
	box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
	transform: translateY(140%);
	transition: transform 0.25s ease;
}

.fp-buybar.is-on {
	transform: none;
}

.fp-buybar__text {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
	flex: 1;
}

.fp-buybar__label {
	font-family: "JetBrains Mono", ui-monospace, monospace;
	font-size: 10.5px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: #a3a7ad;
}

.fp-buybar__name {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	font-size: 14.5px;
	font-weight: 700;
}

.fp-buybar .fp-btn {
	min-height: 46px;
	color: var(--btn-text);
}

@media (max-width: 760px) {
	.fp-buybar {
		display: flex;
	}

	body.single {
		padding-bottom: 84px;
	}
}

/* ------------------------------------------------------------------ footer */

.fp-footer {
	margin-top: 40px;
	background: var(--bg-alt);
	border-top: 1px solid var(--border);
}

.fp-footer__top {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 40px;
	padding-top: 56px;
	padding-bottom: 40px;
}

.fp-footer__brand {
	display: flex;
	flex-direction: column;
	gap: 14px;
	max-width: 380px;
}

.fp-footer__brand p {
	margin: 0;
	font-size: 15px;
	line-height: 1.6;
	color: var(--muted);
}

.fp-menu--footer {
	flex-direction: column;
	gap: 10px;
}

.fp-footer__bottom {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 16px;
	padding-top: 20px;
	padding-bottom: 32px;
	border-top: 1px solid var(--border);
	font-size: 13px;
	color: var(--muted);
}

/* ------------------------------------------------------------------ small screens */

@media (max-width: 600px) {
	.fp-container {
		padding-left: 16px;
		padding-right: 16px;
	}

	.fp-hero {
		padding-top: 40px;
		gap: 40px;
	}

	.fp-hero__sub {
		font-size: 18px;
	}

	.fp-finder .fp-btn {
		width: 100%;
	}

	.fp-section {
		padding-top: 64px;
	}

	.fp-entry {
		font-size: 17px;
	}

	.fp-entry .ae-pick-heading {
		font-size: 26px;
	}

	.fp-entry .ae-card {
		padding: 16px;
		border-radius: 18px;
	}

	.fp-entry .ae-card__media {
		min-height: 200px;
		padding: 28px;
	}

	.fp-specstrip {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* Quick picks: one stacked row per lens instead of a squeezed table. */
	.fp-entry .ae-table--picks thead {
		display: none;
	}

	.fp-entry .ae-table--picks,
	.fp-entry .ae-table--picks tbody {
		display: block;
	}

	.fp-entry .ae-table--picks tr {
		display: grid;
		grid-template-columns: auto minmax(0, 1fr);
		align-items: start;
		gap: 10px 12px;
		padding: 16px;
		border-bottom: 1px solid var(--border);
	}

	.fp-entry .ae-table--picks tr:last-child {
		border-bottom: 0;
	}

	.fp-entry .ae-table--picks td {
		display: block;
		padding: 0;
		border: 0;
	}

	.fp-entry .ae-table--picks td:nth-child(2) {
		display: none;
	}

	.fp-entry .ae-table--picks td.ae-table__num {
		width: auto;
		padding-top: 1px;
	}

	.fp-entry .ae-table--picks td:last-child {
		grid-column: 1 / -1;
		width: auto;
		min-width: 0;
	}

	.fp-entry .ae-table--picks .ae-buttons {
		flex-direction: row;
	}

	.fp-spec--note {
		grid-column: 1 / -1;
	}
}

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

	* {
		transition: none !important;
	}
}
