/*!
 * FKPF Admin — frontend styles.
 *
 * All rules are scoped under the .fkpf-* wrappers so the bundled
 * plugin styles never leak into the active theme. Color tokens come
 * from the standalone fkpf site so the plugin renders consistently on
 * both installations. The `--fkpf-*` custom properties are also
 * overridable by the theme through `:root`, so a theme that wants to
 * adopt FKPF cards into its own palette can override a single variable.
 */

.fkpf-list, .fkpf-archive, .fkpf-single, .fkpf-search-results, .fkpf-search, .fkpf-marquee-wrap {
	--fkpf-paper: #f7f3ea;
	--fkpf-paper-deep: #efe9db;
	--fkpf-ink: #2b2620;
	--fkpf-ink-soft: #5c5346;
	--fkpf-accent: #7a3b2e;
	--fkpf-accent-soft: #9c6b5e;
	--fkpf-rule: #d8cfbc;
	--fkpf-warn: #a83232;
	--fkpf-caution: #a3701a;
	--fkpf-ok: #4a7c46;

	color: var(--fkpf-ink);
	/* No font-family on purpose — the plugin inherits whatever the
	   active theme uses, it never imposes its own typeface. */
	font-size: 1rem;
	line-height: 1.55;
	box-sizing: border-box;
}

@media (prefers-color-scheme: dark) {
	.fkpf-list, .fkpf-archive, .fkpf-single, .fkpf-search-results, .fkpf-search, .fkpf-marquee-wrap {
		--fkpf-paper: #201d18;
		--fkpf-paper-deep: #262219;
		--fkpf-ink: #e8e1d3;
		--fkpf-ink-soft: #b0a692;
		--fkpf-accent: #d29a83;
		--fkpf-accent-soft: #a97e6e;
		--fkpf-rule: #3d372c;
		--fkpf-warn: #e0847a;
		--fkpf-caution: #d9a441;
		--fkpf-ok: #8fc984;
	}
}

.fkpf-list *,
.fkpf-archive *,
.fkpf-single *,
.fkpf-search-results *,
.fkpf-search *,
.fkpf-marquee-wrap * {
	box-sizing: border-box;
}

.fkpf-list a, .fkpf-archive a, .fkpf-single a, .fkpf-search-results a {
	color: var(--fkpf-accent);
	text-decoration: none;
}
.fkpf-list a:hover, .fkpf-archive a:hover, .fkpf-single a:hover, .fkpf-search-results a:hover {
	text-decoration: underline;
}

.fkpf-list h1, .fkpf-list h2, .fkpf-list h3,
.fkpf-archive h1, .fkpf-archive h2, .fkpf-archive h3,
.fkpf-single h1, .fkpf-single h2, .fkpf-single h3,
.fkpf-search-results h1, .fkpf-search-results h2, .fkpf-search-results h3 {
	margin: 1.4rem 0 0.6rem;
	font-weight: 700;
	color: var(--fkpf-ink);
}
.fkpf-single h1 { font-size: 1.7rem; margin-top: 0.5rem; }
.fkpf-list h2, .fkpf-archive h2, .fkpf-single h2 { font-size: 1.25rem; }
.fkpf-list h3, .fkpf-archive h3, .fkpf-single h3 { font-size: 1.05rem; }
.fkpf-search-group { font-size: 0.95rem; letter-spacing: 0.05em; color: var(--fkpf-ink-soft); text-transform: uppercase; }

.fkpf-none {
	font-style: italic;
	color: var(--fkpf-ink-soft);
	padding: 0.75rem 0;
}

/* ---- Archive tab navigation + overview section cards ---- */
.fkpf-arch-nav {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.25rem;
	border-bottom: 1px solid var(--fkpf-rule);
	margin: 0 0 1rem;
}
.fkpf-arch-nav > a {
	text-decoration: none;
	color: var(--fkpf-ink-soft);
	padding: 0.45rem 0.9rem;
	border: 1px solid transparent;
	border-bottom: none;
	font-size: 0.95rem;
}
.fkpf-arch-nav > a:hover { color: var(--fkpf-accent); text-decoration: none; }
.fkpf-arch-nav > a.active {
	color: var(--fkpf-accent);
	background: var(--fkpf-paper-deep);
	border-color: var(--fkpf-rule);
	margin-bottom: -1px;
	border-bottom: 1px solid var(--fkpf-paper-deep);
}

.fkpf-arch-overview {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
	gap: 1.1rem;
	margin: 1.4rem 0;
}
.fkpf-arch-section-card {
	display: block;
	border: 1px solid var(--fkpf-rule);
	background: var(--fkpf-paper);
	padding: 1.1rem 1.2rem;
	text-decoration: none;
	color: var(--fkpf-ink);
}
.fkpf-arch-section-card:hover { border-color: var(--fkpf-accent); text-decoration: none; }
.fkpf-arch-section-card .fkpf-arch-title { display: block; margin: 0 0 0.4rem; font-size: 1.05rem; font-weight: 700; color: var(--fkpf-ink); }
.fkpf-arch-section-card .fkpf-arch-lead { display: block; margin: 0; font-size: 0.95rem; line-height: 1.55; color: var(--fkpf-ink-soft); }
.fkpf-arch-count {
	display: block;
	font-size: 0.8rem;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--fkpf-accent);
	margin: 0 0 0.6rem;
}
@media (max-width: 48rem) {
	.fkpf-arch-nav > a { padding: 0.45rem 0.6rem; font-size: 0.9rem; }
	/* Toolbar: search gets the full width, controls slide below it */
	.fkpf-toolbar { flex-direction: column; align-items: stretch; }
	.fkpf-toolbar .fkpf-search { width: 100%; margin-right: 0; }
	.fkpf-toolbar .fkpf-search input[type="search"] { flex: 1; width: auto; min-width: 0; }
	.fkpf-search-live { min-width: 0; width: 100%; max-width: none; }
	.fkpf-controls { justify-content: space-between; }
}

/* ---- Toolbar (search + sort + view toggle) ---- */
.fkpf-toolbar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 0.75rem;
	margin: 0.9rem 0 1.1rem;
}
.fkpf-search {
	display: flex;
	gap: 0.4rem;
}
.fkpf-search input[type="search"] {
	/* Fully specified so theme form styles (radius, shadows, tall
	   padding) can't restyle the box. */
	appearance: none;
	-webkit-appearance: none;
	font: inherit;
	font-size: 0.9rem;
	line-height: 1.4;
	height: auto;
	padding: 0.35rem 0.6rem;
	margin: 0;
	border: 1px solid var(--fkpf-rule);
	border-radius: 0;
	box-shadow: none;
	background: var(--fkpf-paper-deep);
	color: var(--fkpf-ink);
	width: 13rem;
	max-width: 60vw;
}
.fkpf-search input[type="search"]::placeholder { color: var(--fkpf-ink-soft); opacity: 1; }
.fkpf-search input[type="search"]::-webkit-search-decoration,
.fkpf-search input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; }
.fkpf-search input[type="search"]:focus { outline: 2px solid var(--fkpf-accent); }
.fkpf-search button {
	appearance: none;
	-webkit-appearance: none;
	font: inherit;
	font-size: 0.9rem;
	line-height: 1.4;
	height: auto;
	padding: 0.35rem 0.9rem;
	margin: 0;
	border: 1px solid var(--fkpf-accent);
	border-radius: 0;
	box-shadow: none;
	text-transform: none;
	letter-spacing: normal;
	background: transparent;
	color: var(--fkpf-accent);
	cursor: pointer;
}
.fkpf-search button:hover { background: var(--fkpf-accent); color: var(--fkpf-paper); }
.fkpf-search-inline { margin-right: 0.6rem; }

/* Live search dropdown (mirrors the standalone .arch-search-live) */
.fkpf-search { position: relative; display: flex; gap: 0.4rem; align-items: center; }
/* Standalone form (not the toolbar one): breathing room around it. */
.fkpf-search:not(.fkpf-search-inline) { margin: 0.9rem 0 1.4rem; }
.fkpf-search-live {
	position: absolute;
	top: 100%; left: 0;
	min-width: 20rem;
	max-width: 90vw;
	background: var(--fkpf-paper);
	border: 1px solid var(--fkpf-rule);
	box-shadow: 0 6px 18px rgba(0, 0, 0, 0.12);
	z-index: 50;
	max-height: 22rem;
	overflow-y: auto;
}
.fkpf-search-live a {
	display: block;
	padding: 0.55rem 0.9rem;
	text-decoration: none;
	color: var(--fkpf-ink);
	border-bottom: 1px solid var(--fkpf-rule);
}
.fkpf-search-live a:last-child { border-bottom: none; }
.fkpf-search-live a:hover { background: var(--fkpf-paper-deep); color: var(--fkpf-accent); text-decoration: none; }
.fkpf-live-name { display: block; }
.fkpf-live-meta { display: block; font-size: 0.8rem; font-style: italic; color: var(--fkpf-ink-soft); }
.fkpf-live-none { display: block; padding: 0.55rem 0.9rem; font-style: italic; color: var(--fkpf-ink-soft); }

.fkpf-controls { display: inline-flex; align-items: center; gap: 0.75rem; }
.fkpf-toggle { display: inline-flex; border: 1px solid var(--fkpf-rule); }
.fkpf-toggle a {
	padding: 0.3rem 0.7rem;
	text-decoration: none;
	color: var(--fkpf-ink-soft);
	font-size: 0.85rem;
	letter-spacing: 0.05em;
	line-height: 1.4;
}
.fkpf-toggle a + a { border-left: 1px solid var(--fkpf-rule); }
.fkpf-toggle a.active { background: var(--fkpf-paper-deep); color: var(--fkpf-accent); }

.fkpf-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0 0 1.6rem; }
.fkpf-chips a {
	font-size: 0.8rem;
	letter-spacing: 0.04em;
	color: var(--fkpf-ink-soft);
	border: 1px solid var(--fkpf-rule);
	padding: 0.2rem 0.7rem;
	border-radius: 1rem;
	text-decoration: none;
}
.fkpf-chips a:hover { border-color: var(--fkpf-accent); color: var(--fkpf-accent); text-decoration: none; }
.fkpf-chips a.active { background: var(--fkpf-accent); border-color: var(--fkpf-accent); color: var(--fkpf-paper); }

/* ---- Grid view ----
   Mirrors the standalone archive: one full-width horizontal card per
   row (logo left, body right) on the deep paper background with the
   accent top rule. */
.fkpf-list .archive-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 1.25rem;
	margin: 1.5rem 0;
}
.fkpf-list .project-card {
	/* Every layout-relevant property is set explicitly so theme rules
	   for generic links/cards can't tear the card apart. */
	display: flex;
	flex-direction: row;
	align-items: flex-start;
	gap: 1.25rem;
	min-width: 0;
	color: var(--fkpf-ink);
	text-decoration: none;
	padding: 1.25rem 1.35rem;
	margin: 0;
	border: 1px solid var(--fkpf-rule);
	border-top: 2px solid var(--fkpf-accent-soft);
	border-radius: 0;
	box-shadow: none;
	background: var(--fkpf-paper-deep);
}
.fkpf-list .project-card:hover { border-color: var(--fkpf-accent); text-decoration: none; }
.fkpf-list .project-logo {
	flex: 0 0 3.25rem;
	width: 3.25rem; height: 3.25rem;
	display: flex; align-items: center; justify-content: center;
	border: 1px solid var(--fkpf-rule);
	background: var(--fkpf-paper);
}
.fkpf-list .project-logo img { max-width: 80%; max-height: 80%; }
.fkpf-list .project-logo .monogram {
	font-size: 1.4rem;
	color: var(--fkpf-accent);
	font-style: italic;
}
/* Miniature document cover in list/grid cards — scaled-down version
   of the single-page .doc-cover. */
.fkpf-list .doc-cover {
	flex: 0 0 4rem;
	width: 4rem;
	min-height: 5.5rem;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	overflow: hidden;
	background: linear-gradient(160deg, var(--fkpf-accent) 0%, #5a2b21 100%);
	color: #f3ead8;
	border: 1px solid var(--fkpf-rule);
	border-left: 3px solid #4a231b;
	padding: 0.35rem 0.4rem 0.3rem;
}
.fkpf-list .doc-cover-title { display: block; font-size: 0.55rem; line-height: 1.3; font-style: italic; }
.fkpf-list .doc-cover-author { display: block; font-size: 0.45rem; opacity: 0.85; margin-top: 0.25rem; }
.fkpf-list .doc-cover-foot { display: block; font-size: 0.4rem; letter-spacing: 0.2em; opacity: 0.75; margin-top: 0.3rem; }
.fkpf-list .doc-cover.has-image {
	padding: 0;
	border-left-width: 1px;
	background: var(--fkpf-paper);
	justify-content: center;
	align-items: center;
}
.fkpf-list .doc-cover img { max-width: 100%; max-height: 100%; display: block; }

.fkpf-list .project-card-body { display: flex; flex-direction: column; flex: 1; min-width: 0; }
/* Card text is spans-only (no h3/p inside the anchor — the parser
   would split it); each span renders as its own block. */
.fkpf-list .project-card-body .project-title { display: block; margin: 0 0 0.3rem; font-size: 1.05rem; font-weight: 700; line-height: 1.4; color: var(--fkpf-ink); }
.fkpf-list .project-card-body .project-desc { display: block; margin: 0; font-size: 0.95rem; line-height: 1.55; color: var(--fkpf-ink-soft); }
.fkpf-list .project-card-body .project-author { display: block; font-size: 0.85rem; font-style: italic; color: var(--fkpf-ink-soft); margin: 0 0 0.75rem; }
.fkpf-list .project-tags { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-top: auto; padding-top: 1.1rem; }

/* ---- List view ---- */
.fkpf-list .result-list,
.fkpf-list .arch-list,
.fkpf-search-results .result-list,
.fkpf-single .result-list,
.fkpf-list .fkpf-related-rows,
.fkpf-single .fkpf-related-rows {
	list-style: none;
	margin: 0 0 1.5rem;
	padding: 0;
}
.fkpf-list .result-list li,
.fkpf-list .arch-list li,
.fkpf-search-results .result-list li,
.fkpf-single .result-list li,
.fkpf-list .fkpf-related-rows li,
.fkpf-single .fkpf-related-rows li {
	padding: 0.5rem 0;
	border-bottom: 1px solid var(--fkpf-rule);
}
.fkpf-list .arch-list li { padding: 0.8rem 0.25rem; }
.fkpf-list .arch-list a { font-size: 1.05rem; }
.fkpf-list .arch-list-badges { margin-left: 0.6rem; display: inline-flex; gap: 0.4rem; flex-wrap: wrap; vertical-align: middle; }
.fkpf-result-meta, .result-meta {
	display: block;
	font-size: 0.85rem;
	font-style: italic;
	color: var(--fkpf-ink-soft);
	margin-top: 0.2rem;
}
.fkpf-list .arch-list .result-meta { margin-top: 0.25rem; }

/* ---- Badges ---- */
.fkpf-list .badge,
.fkpf-archive .badge,
.fkpf-single .badge,
.fkpf-search-results .badge {
	display: inline-block;
	font-size: 0.72rem;
	font-weight: 400;
	line-height: 1.6;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	white-space: nowrap;
	border: 1px solid var(--fkpf-rule);
	border-radius: 0;
	background: transparent;
	color: var(--fkpf-ink-soft);
	padding: 0.1rem 0.5rem;
	margin: 0;
	color: var(--fkpf-ink-soft);
	background: var(--fkpf-paper);
}
.fkpf-list .badge-status, .fkpf-single .badge-status, .fkpf-archive .badge-status { border-color: var(--fkpf-ok); color: var(--fkpf-ok); }
.fkpf-list .badge-license, .fkpf-single .badge-license, .fkpf-archive .badge-license { border-color: var(--fkpf-accent-soft); color: var(--fkpf-accent); }
.fkpf-list .badge-family, .fkpf-single .badge-family, .fkpf-archive .badge-family { border-color: var(--fkpf-ink-soft); }
.fkpf-list .badge-format, .fkpf-single .badge-format, .fkpf-archive .badge-format { border-color: var(--fkpf-ink-soft); }

/* ---- Pager ---- */
.fkpf-list .pager, .fkpf-archive .pager {
	display: flex;
	gap: 0.4rem;
	justify-content: center;
	margin: 2rem 0 0.5rem;
	font-size: 0.95rem;
}
.fkpf-list .pager a,
.fkpf-list .pager span,
.fkpf-archive .pager a,
.fkpf-archive .pager span {
	min-width: 2.1rem;
	text-align: center;
	padding: 0.3rem 0.5rem;
	border: 1px solid var(--fkpf-rule);
	text-decoration: none;
	color: var(--fkpf-ink-soft);
	background: var(--fkpf-paper);
}
.fkpf-list .pager a:hover, .fkpf-archive .pager a:hover { border-color: var(--fkpf-accent); color: var(--fkpf-accent); }
.fkpf-list .pager .active, .fkpf-archive .pager .active {
	background: var(--fkpf-paper-deep);
	color: var(--fkpf-accent);
	border-color: var(--fkpf-accent);
}

/* ---- Single page ---- */
.fkpf-single .project-head {
	display: flex;
	align-items: center;
	gap: 1.25rem;
	margin-bottom: 1.25rem;
}
.fkpf-single .project-logo {
	flex: 0 0 4.5rem;
	width: 4.5rem;
	height: 4.5rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--fkpf-rule);
	background: var(--fkpf-paper-deep);
}
.fkpf-single .project-logo .monogram { font-size: 2rem; color: var(--fkpf-accent); font-style: italic; }
.fkpf-single .project-logo img { max-width: 80%; max-height: 80%; }
.fkpf-single .license-logo img { max-width: 88%; max-height: 70%; }
.fkpf-single .project-head h1 { margin: 0; font-size: 1.7rem; }
.fkpf-single .project-author { font-size: 0.95rem; font-style: italic; color: var(--fkpf-ink-soft); margin: 0.2rem 0 0; }

.fkpf-single .project-tags { display: flex; gap: 0.5rem; flex-wrap: wrap; margin: 0.6rem 0 1rem; }

.fkpf-single table { border-collapse: collapse; width: 100%; font-size: 0.95rem; }
.fkpf-single .table-wrap { overflow-x: auto; margin: 1rem 0; }
.fkpf-single .table th, .fkpf-single .table td {
	text-align: left;
	padding: 0.55rem 0.8rem;
	border: 1px solid var(--fkpf-rule);
	vertical-align: top;
}
.fkpf-single .project-table th {
	width: 11rem;
	background: var(--fkpf-paper-deep);
	font-weight: 400;
	font-style: italic;
	color: var(--fkpf-ink-soft);
	white-space: nowrap;
}
.fkpf-single .check-table td:last-child { width: 3rem; text-align: center; }
.fkpf-check-yes, .fkpf-single .check-yes { color: var(--fkpf-ok); font-weight: 700; }
.fkpf-check-no, .fkpf-single .check-no { color: var(--fkpf-ink-soft); }

.fkpf-preservation { margin: 1rem 0; }
.fkpf-preservation-head {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: 1rem;
	margin: 0 0 0.6rem;
}
.fkpf-preservation-head h2 { margin: 0; }
.fkpf-preservation-score {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--fkpf-ink);
	white-space: nowrap;
}
.fkpf-preservation .table-wrap { border-top: 3px solid #d29a83; }
.fkpf-preservation-count { font-weight: 400; font-style: italic; color: var(--fkpf-ink-soft); }
@media (max-width: 48rem) {
	.fkpf-preservation-count { display: none; }
}
.fkpf-preservation-table th {
	width: 11rem;
	background: var(--fkpf-paper-deep);
	font-weight: 400;
	font-style: italic;
	color: var(--fkpf-ink-soft);
	white-space: nowrap;
}

/* "What's this?" info toggle — a small collapsible note, not the full
   card treatment .fkpf-drop uses for verification. */
.fkpf-info { margin: 0 0 0.9rem; font-size: 0.9rem; }
.fkpf-info summary {
	display: inline-flex;
	align-items: center;
	gap: 0.3rem;
	cursor: pointer;
	color: var(--fkpf-ink-soft);
	list-style: none;
}
.fkpf-info summary::-webkit-details-marker { display: none; }
.fkpf-info summary:hover { color: var(--fkpf-accent); }
.fkpf-info summary .fkpf-icon-info-circle { color: var(--fkpf-accent); }
.fkpf-info-panel {
	margin-top: 0.5rem;
	padding: 0.8rem 1rem;
	border: 1px solid var(--fkpf-rule);
	background: var(--fkpf-paper-deep);
}
.fkpf-info-panel p { margin: 0 0 0.7rem; }
.fkpf-info-more { display: inline-flex; align-items: center; gap: 0.3rem; font-weight: 700; }
.fkpf-info-more:hover { color: var(--fkpf-accent); }

.fkpf-preservation-info h2 { margin-top: 1.6rem; }
.fkpf-preservation-info .table-wrap { margin: 0.8rem 0 1.2rem; }
/* Inline Tabler icons (fkpf_icon()) — sized to the surrounding text,
   coloured via currentColor so .check-yes/.check-warn/.fkpf-stars just
   set `color` as before. */
.fkpf-icon {
	width: 1em;
	height: 1em;
	display: inline-block;
	vertical-align: -0.125em;
	flex: none;
}
.fkpf-stars {
	display: inline-flex;
	align-items: center;
	gap: 0.12em;
	vertical-align: -0.125em;
	color: var(--fkpf-accent);
}
.fkpf-stars .fkpf-icon { width: 1.05em; height: 1.05em; }
.fkpf-stars .fkpf-icon-star { color: var(--fkpf-ink-soft); opacity: 0.55; }
/* Standard WP screen-reader-only rule, repeated here so the star
   rating stays accessible even on themes that don't define it. */
.fkpf-preservation .screen-reader-text {
	position: absolute !important;
	width: 1px; height: 1px;
	margin: -1px; padding: 0; overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.fkpf-verification { margin: 1rem 0; }
.fkpf-verification-pending { font-style: italic; color: var(--fkpf-ink-soft); }
/* Live "checking now" / "queued" note — sits above the last known
   result, never replacing it (see fkpf_verification_progress_html()). */
.fkpf-verification-live {
	display: flex;
	align-items: center;
	gap: 0.55rem;
	margin: 0 0 1rem;
	font-style: italic;
	color: var(--fkpf-ink-soft);
}
.fkpf-verification-live-icon { flex: none; color: var(--fkpf-accent); }
.fkpf-verification-live-icon.is-spinning { animation: fkpf-spin 1.1s linear infinite; }
@keyframes fkpf-spin { to { transform: rotate(360deg); } }
.fkpf-progress {
	flex: 1 1 10rem;
	max-width: 14rem;
	height: 0.55rem;
	background: var(--fkpf-paper-deep);
	border: 1px solid var(--fkpf-rule);
	overflow: hidden;
}
.fkpf-progress-bar {
	display: block;
	height: 100%;
	width: 0;
	background: var(--fkpf-accent);
	transition: width 0.3s ease;
}
/* "Queued" — due but not yet picked up by the dispatcher, so there's no
   real percentage to show: a full-width sliding stripe instead of a
   fixed fill communicates "in the queue, moving" without claiming to
   know how close it is. */
.fkpf-progress-bar.is-indeterminate {
	width: 40%;
	animation: fkpf-progress-slide 1.4s ease-in-out infinite;
}
@keyframes fkpf-progress-slide {
	0%   { margin-left: 0%; }
	50%  { margin-left: 60%; }
	100% { margin-left: 0%; }
}
@media (prefers-reduced-motion: reduce) {
	.fkpf-progress-bar.is-indeterminate { animation: none; width: 100%; opacity: 0.4; }
	.fkpf-verification-live-icon.is-spinning { animation: none; }
}
/* Failed check cell — same slot as .check-yes/.check-no but in warn red. */
.fkpf-single .check-warn { color: var(--fkpf-warn); font-weight: 700; }
/* Partial verification result (some targets passed, some didn't) — a
   softer amber than a full failure, so a mixed result doesn't read as
   alarmingly as everything having failed. */
.fkpf-single .check-caution { color: var(--fkpf-caution); font-weight: 700; }
/* Collapsible verification blocks: the <summary> is the always-visible
   status row, styled like a table header row; the table drops out of it. */
.fkpf-verification .fkpf-drop { margin: 1rem 0; }
/* Summary is a stacked card: status / signature / last-verification
   each on its own line, chevron pinned to the right edge. */
.fkpf-verification .fkpf-drop summary {
	position: relative;
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 0.35rem;
	padding: 0.7rem 2.6rem 0.7rem 0.9rem;
	border: 1px solid var(--fkpf-rule);
	background: var(--fkpf-paper-deep);
	font-weight: 700;
	cursor: pointer;
	list-style: none;
}
/* The main verification drop gets the same accent top rule as the
   preservation table, so the trust block stands out on the page. */
.fkpf-verification .fkpf-drop-main summary {
	border-top: 3px solid #d29a83;
}
.fkpf-verification .fkpf-drop summary > .fkpf-icon-chevron-down {
	position: absolute;
	top: 50%;
	right: 0.9rem;
	margin-top: -0.5em;
	color: var(--fkpf-ink-soft);
	transition: transform 0.15s ease;
}
.fkpf-drop-status { display: inline-flex; align-items: center; gap: 0.35rem; }
.fkpf-drop-meta { font-weight: 700; color: var(--fkpf-ink); }
.fkpf-drop-label { font-style: italic; font-weight: 400; color: var(--fkpf-ink-soft); }
.fkpf-verification .fkpf-drop summary::-webkit-details-marker { display: none; }
.fkpf-verification .fkpf-drop[open] summary > .fkpf-icon-chevron-down { transform: rotate(180deg); }
.fkpf-verification .fkpf-drop .table-wrap { margin: 0; }
/* Per-platform (Windows/macOS/Linux/Other) drops nested inside the main
   verification drop — same collapsible pattern one level down, so each
   platform gets its own status without needing a heavier top-level card:
   lighter padding/weight, no accent rule, inset inside the parent's own
   padding rather than running edge-to-edge. */
.fkpf-verification .fkpf-drop .fkpf-drop-group {
	margin: 0.6rem 0.9rem;
}
.fkpf-verification .fkpf-drop .fkpf-drop-group summary {
	padding: 0.5rem 2.2rem 0.5rem 0.7rem;
	font-weight: 400;
	background: transparent;
	border-color: var(--fkpf-rule);
}
.fkpf-verification .fkpf-drop .fkpf-drop-group summary .fkpf-drop-status { font-weight: 700; }
.fkpf-verification .fkpf-drop[open] summary { border-bottom: 0; }
.fkpf-drop-date { font-style: italic; font-weight: 400; color: var(--fkpf-ink-soft); }
/* A failed target's row gets a tinted background too, not just the
   small ✓/✗ mark in its own cell — easier to spot at a glance in a
   longer per-platform table. */
.fkpf-verification .check-table tr.is-fail {
	background: rgba(168, 50, 50, 0.1); /* fallback for browsers without color-mix() */
	background: color-mix(in srgb, var(--fkpf-warn) 10%, transparent);
}
@media (prefers-reduced-motion: reduce) {
	.fkpf-verification .fkpf-drop summary > .fkpf-icon-chevron-down { transition: none; }
}
.fkpf-verification-history th { white-space: nowrap; }

.fkpf-rows { list-style: none; margin: 0; padding: 0; }
.fkpf-rows li { padding: 0.4rem 0; border-bottom: 1px solid var(--fkpf-rule); }
.fkpf-rows li.is-missing span { color: var(--fkpf-ink-soft); }
.fkpf-rows li.is-missing a { text-decoration: line-through; }
.fkpf-related-rows li a { font-weight: 600; }

/* ---- Document covers ---- */
.fkpf-single .doc-detail { display: flex; gap: 2rem; align-items: flex-start; }
.fkpf-single .doc-detail-body { flex: 1; min-width: 0; }
.fkpf-single .doc-cover-col { flex: 0 0 11rem; }
.fkpf-single .doc-cover {
	width: 11rem;
	min-height: 15rem;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	background: linear-gradient(160deg, var(--fkpf-accent) 0%, #5a2b21 100%);
	color: #f3ead8;
	border: 1px solid var(--fkpf-rule);
	border-left: 5px solid #4a231b;
	padding: 0.7rem 0.7rem 0.55rem;
}
.fkpf-single .doc-cover-image {
	background: var(--fkpf-paper-deep);
	border-left: 1px solid var(--fkpf-rule);
	padding: 0;
	justify-content: center;
	align-items: center;
	min-height: 0;
}
.fkpf-single .doc-cover-image img { max-width: 100%; height: auto; display: block; }
.fkpf-single .doc-cover-title { font-size: 1rem; line-height: 1.3; font-style: italic; }
.fkpf-single .doc-cover-author { font-size: 0.8rem; opacity: 0.85; margin-top: 0.5rem; }
.fkpf-single .doc-cover-foot { font-size: 0.55rem; letter-spacing: 0.2em; opacity: 0.75; margin-top: 0.6rem; }
@media (max-width: 40rem) {
	.fkpf-single .doc-detail { flex-direction: column; }
}

/* ---- Search results ---- */
.fkpf-search-results { margin-top: 1.5rem; }
.fkpf-search-title { font-size: 1.05rem; }
.fkpf-search-results .result-list a { font-weight: 600; }

/* ---- Archive wrapper tweaks ---- */
.fkpf-archive .page-header { margin-bottom: 0.5rem; }
.fkpf-archive .page-title { margin: 0; font-size: 1.7rem; }
/* ---- Featured marquee strip ---------------------------------------------- */
.fkpf-marquee-wrap {
	--fkpf-marquee-gap: 1.25rem;
	margin: 2.5rem 0;
}
.fkpf-marquee-wrap > h2 { margin: 0 0 0.4rem; font-size: 1.3rem; }
.fkpf-marquee-note {
	font-style: italic;
	color: var(--fkpf-ink-soft);
	font-size: 0.95rem;
	margin: 0 0 1.5rem;
}
/* The full-bleed strip uses 100vw, which includes the scrollbar width.
   The standalone site hides the resulting overflow on <body>; here we
   do it only when a marquee is actually on the page. */
body:has(.fkpf-marquee) { overflow-x: clip; }
.fkpf-marquee {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	overflow: hidden;
	border-top: 1px solid var(--fkpf-rule);
	border-bottom: 1px solid var(--fkpf-rule);
	background: var(--fkpf-paper-deep);
	-webkit-mask-image: linear-gradient(to right, transparent, #000 6rem, #000 calc(100% - 6rem), transparent);
	mask-image: linear-gradient(to right, transparent, #000 6rem, #000 calc(100% - 6rem), transparent);
}
.fkpf-marquee-track {
	display: flex;
	align-items: stretch;
	gap: var(--fkpf-marquee-gap);
	width: max-content;
	margin: 0;
	padding: 1rem 0;
	list-style: none;
	animation: fkpf-marquee-scroll 45s linear infinite;
}
.fkpf-marquee-track > li { margin: 0; }
.fkpf-marquee:hover .fkpf-marquee-track,
.fkpf-marquee:focus-within .fkpf-marquee-track { animation-play-state: paused; }
@keyframes fkpf-marquee-scroll {
	to { transform: translateX(calc(-50% - var(--fkpf-marquee-gap) / 2)); }
}
.fkpf-marquee + .fkpf-marquee { border-top: none; }
.fkpf-marquee-reverse .fkpf-marquee-track { animation-direction: reverse; animation-duration: 55s; }
.fkpf-marquee-item {
	display: flex;
	align-items: center;
	gap: 1rem;
	padding: 0.75rem 1.4rem 0.75rem 0.8rem;
	border: 1px solid var(--fkpf-rule);
	background: var(--fkpf-paper);
	text-decoration: none;
	color: var(--fkpf-ink);
	white-space: nowrap;
}
.fkpf-marquee-item:hover { border-color: var(--fkpf-accent); text-decoration: none; }
.fkpf-marquee-item:hover .fkpf-marquee-name { color: var(--fkpf-accent); }
.fkpf-marquee-item .project-logo {
	flex-basis: 4rem;
	width: 4rem;
	height: 4rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--fkpf-rule);
	background: var(--fkpf-paper);
}
.fkpf-marquee-item .project-logo .monogram {
	font-size: 1.6rem;
	color: var(--fkpf-accent);
	font-style: italic;
}
.fkpf-marquee-item .project-logo img { max-width: 80%; max-height: 80%; }
.fkpf-marquee-text { display: flex; flex-direction: column; line-height: 1.4; }
.fkpf-marquee-name { font-weight: 700; font-size: 1.1rem; }
.fkpf-marquee-meta { font-size: 0.85rem; font-style: italic; color: var(--fkpf-ink-soft); }

/* Stats strip below the marquee */
.fkpf-stat-strip {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 1.5rem 3.5rem;
	margin-top: 2rem;
	text-align: center;
}
.fkpf-stat-strip a { text-decoration: none; }
.fkpf-stat-strip a:hover .fkpf-stat-num { color: var(--fkpf-accent); }
.fkpf-stat-num {
	display: block;
	font-size: 2.1rem;
	line-height: 1.2;
	color: var(--fkpf-ink);
}
.fkpf-stat-label {
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: var(--fkpf-ink-soft);
}

/* Reduced motion: turn the marquee into a horizontally scrollable list */
@media (prefers-reduced-motion: reduce) {
	.fkpf-marquee-track { animation: none; }
	.fkpf-marquee { overflow-x: auto; -webkit-mask-image: none; mask-image: none; }
	.fkpf-marquee-track { width: auto; flex-wrap: nowrap; }
}
@media (max-width: 48rem) {
	.fkpf-marquee-item { padding: 0.6rem 1rem 0.6rem 0.6rem; gap: 0.8rem; }
	.fkpf-marquee-item .project-logo { flex-basis: 3.25rem; width: 3.25rem; height: 3.25rem; }
	.fkpf-marquee-name { font-size: 1rem; }
	.fkpf-marquee { --fkpf-marquee-gap: 0.9rem; }
}

/* ---- 404 page (see FKPF_Frontend::ensure_404_template()) ---- */
.fkpf-404-hero {
	text-align: center;
	padding: 1rem 1rem 2rem;
}
.fkpf-404-hero .fkpf-icon {
	width: 3rem;
	height: 3rem;
	color: var(--fkpf-accent-soft);
}
.fkpf-404-hero h1 {
	margin: 1rem 0 0.6rem;
}
.fkpf-404-hero p {
	color: var(--fkpf-ink-soft);
	max-width: 32rem;
	margin: 0 auto;
	line-height: 1.6;
}