/*
 * Help centre (/help/). Loaded only on help views (inc/help.php), on top of
 * style.css, whose tokens it uses throughout.
 *
 *  1. Hero, breadcrumbs, meta
 *  2. Search box and instant results
 *  3. Page layout, sidebar, table of contents
 *  4. Article content (the knowledge-base blocks)
 *  5. Lists, cards, index, role filter
 *  6. Help centre home
 *  7. Search page
 *  8. Responsive, print, motion
 */

.pk-help {
	--pk-h-nav: 268px;
	--pk-h-toc: 224px;
	--pk-h-sticky: calc(var(--pk-header-h) + 1.25rem);
	--pk-h-gap: clamp(1.75rem, 1rem + 2.5vw, 3.5rem);

	--pk-h-tip: var(--pk-brand-600);
	--pk-h-tip-bg: var(--pk-brand-50);
	--pk-h-warn: #b45309;
	--pk-h-warn-bg: #fff7e8;
	--pk-h-info: #1d6fb8;
	--pk-h-info-bg: #eef6fd;
	--pk-h-stop: #b42318;
	--pk-h-stop-bg: #fef3f2;
	--pk-h-why: #6941c6;
	--pk-h-why-bg: #f6f3fe;
}

/* ==========================================================================
   1. Hero, breadcrumbs, meta
   ========================================================================== */

.pk-hhero {
	position: relative;
	padding-block: clamp(1.75rem, 1.2rem + 2vw, 3rem) clamp(1.75rem, 1.2rem + 2vw, 2.75rem);
	border-bottom: 1px solid var(--pk-border);
	background:
		radial-gradient(40rem 18rem at 100% 0%, color-mix(in srgb, var(--pk-brand-100) 70%, transparent), transparent 70%),
		linear-gradient(180deg, var(--pk-brand-50), var(--pk-white));
}

.pk-hhero .pk-crumbs { margin-bottom: var(--pk-space-5); }
.pk-hhero .pk-crumbs span[aria-current] { color: var(--pk-ink-700); font-weight: 600; }

.pk-hhero h1 {
	margin: 0 0 var(--pk-space-3);
	font-size: clamp(1.75rem, 1.25rem + 1.9vw, 2.625rem);
	letter-spacing: -0.02em;
	line-height: 1.15;
}

.pk-hhero__head { max-width: 50rem; }

.pk-hhero__lead {
	margin: 0;
	color: var(--pk-ink-700);
	font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.1875rem);
	line-height: 1.6;
}

.pk-hhero__eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0 0 var(--pk-space-3);
	color: var(--pk-brand-700);
	font-size: var(--pk-text-sm);
	font-weight: 700;
}

.pk-hhero__eyebrow .pk-icon { width: 1.125rem; height: 1.125rem; }

.pk-hhero__icon {
	display: inline-grid;
	place-items: center;
	width: 3rem;
	height: 3rem;
	margin-bottom: var(--pk-space-4);
	border-radius: var(--pk-radius);
	background: var(--pk-white);
	box-shadow: var(--pk-shadow-sm), inset 0 0 0 1px var(--pk-brand-100);
	color: var(--pk-brand-600);
}

.pk-hhero__icon .pk-icon { width: 1.5rem; height: 1.5rem; }

.pk-hhero__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: var(--pk-space-8);
	align-items: end;
}

.pk-hhero__grid .pk-hsearch { margin-top: var(--pk-space-6); }

.pk-hhero__links {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pk-space-3) var(--pk-space-6);
	align-items: center;
	margin-top: var(--pk-space-6);
}

/* Module, area and article heroes line up with the content column below. */
@media (min-width: 901px) {
	.pk-hhero--article > .pk-container,
	.pk-hhero--module > .pk-container,
	.pk-hhero--area > .pk-container {
		padding-left: calc(var(--pk-gutter) + var(--pk-h-nav) + var(--pk-h-gap));
	}
}

/* Home hero: dark, centred. */
.pk-hhero--home {
	padding-block: clamp(3rem, 2rem + 4vw, 5.5rem);
	border-bottom: 0;
	background: var(--pk-ink-900);
	color: color-mix(in srgb, var(--pk-white) 78%, transparent);
	overflow: hidden;
}

.pk-hhero--home::before {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(44rem 24rem at 85% -10%, rgba(29, 165, 122, 0.32), transparent 62%),
		radial-gradient(30rem 20rem at 0% 110%, rgba(45, 212, 191, 0.12), transparent 60%);
	pointer-events: none;
}

.pk-hhero--home > * { position: relative; }

.pk-hhero__center {
	max-width: 46rem;
	margin-inline: auto;
	text-align: center;
}

.pk-hhero--home h1 {
	color: var(--pk-white);
	font-size: clamp(2.125rem, 1.4rem + 3vw, 3.5rem);
}

.pk-hhero--home .pk-eyebrow { color: var(--pk-brand-300); }

.pk-hhero--home .pk-hhero__lead {
	max-width: 40rem;
	margin-inline: auto;
	color: color-mix(in srgb, var(--pk-white) 76%, transparent);
}

.pk-hhero--home .pk-hsearch {
	margin: var(--pk-space-8) auto 0;
	text-align: left;
}

/* Meta row under a title. */
.pk-hmeta {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pk-space-2) var(--pk-space-5);
	margin: var(--pk-space-5) 0 0;
	padding: 0;
	list-style: none;
	color: var(--pk-muted);
	font-size: var(--pk-text-sm);
	font-weight: 600;
}

.pk-hmeta li {
	display: inline-flex;
	align-items: center;
	gap: 0.4rem;
	margin: 0;
}

.pk-hmeta .pk-icon { width: 1rem; height: 1rem; color: var(--pk-brand-600); }
.pk-hmeta a { color: var(--pk-brand-700); text-decoration: none; }
.pk-hmeta a:hover { text-decoration: underline; }

.pk-hfor {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--pk-space-2);
	margin: var(--pk-space-4) 0 0;
	font-size: var(--pk-text-sm);
}

.pk-hfor > span:first-child { color: var(--pk-muted); font-weight: 700; }

.pk-hstats {
	display: grid;
	gap: var(--pk-space-2);
	min-width: 13rem;
	margin: 0;
	padding: var(--pk-space-5);
	list-style: none;
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius-lg);
	background: color-mix(in srgb, var(--pk-white) 85%, transparent);
	box-shadow: var(--pk-shadow-xs);
	color: var(--pk-muted);
	font-size: var(--pk-text-sm);
	font-weight: 600;
}

.pk-hstats li { margin: 0; }
.pk-hstats strong { color: var(--pk-ink-900); font-size: var(--pk-text-lg); font-weight: 800; }
.pk-hstats a { color: inherit; text-decoration: none; }
.pk-hstats a:hover strong { color: var(--pk-brand-700); }

/* "On the same books" link. */
.pk-hbooks {
	display: inline-flex;
	align-items: center;
	gap: var(--pk-space-3);
	padding: 0.625rem 0.875rem 0.625rem 0.75rem;
	border: 1px solid var(--pk-brand-200);
	border-radius: var(--pk-radius);
	background: var(--pk-white);
	color: var(--pk-ink-900);
	font-size: 0.9375rem;
	font-weight: 700;
	line-height: 1.3;
	text-decoration: none;
	transition: border-color var(--pk-dur) var(--pk-ease), box-shadow var(--pk-dur) var(--pk-ease);
}

.pk-hbooks:hover { border-color: var(--pk-brand-400); box-shadow: var(--pk-shadow-sm); color: var(--pk-ink-900); }
.pk-hbooks > .pk-icon:first-child { width: 1.25rem; height: 1.25rem; flex: none; color: var(--pk-brand-600); }
.pk-hbooks > .pk-icon:last-child { width: 1rem; height: 1rem; flex: none; color: var(--pk-brand-600); }
.pk-hbooks small { display: block; color: var(--pk-muted); font-size: var(--pk-text-xs); font-weight: 700; letter-spacing: 0.02em; }

.pk-hbooks--sm {
	padding: 0.4375rem 0.625rem;
	border-color: var(--pk-border);
	font-size: var(--pk-text-sm);
}

.pk-hbooks--sm > .pk-icon:first-child { width: 1rem; height: 1rem; }

/* Chips. */
.pk-hchip {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	padding: 0.3125rem 0.75rem;
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius-full);
	background: var(--pk-white);
	color: var(--pk-ink-700);
	font: inherit;
	font-size: var(--pk-text-sm);
	font-weight: 600;
	line-height: 1.4;
	text-decoration: none;
	cursor: pointer;
	transition: border-color var(--pk-dur) var(--pk-ease), background var(--pk-dur) var(--pk-ease), color var(--pk-dur) var(--pk-ease);
}

.pk-hchip:hover,
.pk-hchip:focus-visible { border-color: var(--pk-brand-300); color: var(--pk-brand-700); background: var(--pk-white); }

.pk-hchip.is-active,
.pk-hchip[aria-pressed="true"] {
	border-color: var(--pk-brand-600);
	background: var(--pk-brand-600);
	color: var(--pk-white);
}

.pk-hchip span { opacity: 0.75; font-weight: 700; }

.pk-hchip--static {
	cursor: default;
	border-color: var(--pk-brand-100);
	background: var(--pk-brand-50);
	color: var(--pk-brand-800);
}

.pk-hchip--static:hover { border-color: var(--pk-brand-100); color: var(--pk-brand-800); background: var(--pk-brand-50); }

.pk-hchips {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pk-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.pk-hchips li { margin: 0; }

/* ==========================================================================
   2. Search box and instant results
   ========================================================================== */

.pk-hsearch {
	position: relative;
	max-width: 40rem;
}

.pk-hsearch input[type="search"] {
	width: 100%;
	height: 3.5rem;
	padding: 0 3.25rem 0 3.25rem;
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius-full);
	background: var(--pk-white);
	box-shadow: var(--pk-shadow);
	color: var(--pk-ink-900);
	font-family: inherit;
	font-size: var(--pk-text-lg);
	-webkit-appearance: none;
	appearance: none;
	transition: border-color var(--pk-dur) var(--pk-ease), box-shadow var(--pk-dur) var(--pk-ease);
}

.pk-hsearch input[type="search"]::-webkit-search-cancel-button { cursor: pointer; }
.pk-hsearch input::placeholder { color: var(--pk-gray-500); }

.pk-hsearch input[type="search"]:focus {
	outline: none;
	border-color: var(--pk-brand-400);
	box-shadow: 0 0 0 4px color-mix(in srgb, var(--pk-brand-400) 22%, transparent), var(--pk-shadow);
}

.pk-hsearch--md input[type="search"] { height: 3rem; font-size: var(--pk-text-base); }

.pk-hsearch__icon {
	position: absolute;
	left: 1.25rem;
	top: 1.75rem;
	width: 1.25rem;
	height: 1.25rem;
	transform: translateY(-50%);
	color: var(--pk-gray-500);
	pointer-events: none;
}

.pk-hsearch--md .pk-hsearch__icon { top: 1.5rem; left: 1.125rem; }

.pk-hsearch__key {
	position: absolute;
	right: 1.125rem;
	top: 1.75rem;
	transform: translateY(-50%);
	padding: 0.0625rem 0.4375rem;
	border: 1px solid var(--pk-border-strong);
	border-radius: 6px;
	background: var(--pk-gray-50);
	color: var(--pk-muted);
	font-family: var(--pk-font-mono);
	font-size: var(--pk-text-xs);
	pointer-events: none;
}

.pk-hsearch--md .pk-hsearch__key { top: 1.5rem; }
.pk-hsearch.has-text .pk-hsearch__key,
.pk-hsearch:focus-within .pk-hsearch__key { display: none; }

.pk-hsearch__results {
	position: absolute;
	z-index: 40;
	top: calc(100% + 0.5rem);
	left: 0;
	right: 0;
	max-height: min(70vh, 34rem);
	overflow-y: auto;
	overscroll-behavior: contain;
	padding: var(--pk-space-2);
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius-lg);
	background: var(--pk-white);
	box-shadow: var(--pk-shadow-lg);
	text-align: left;
}

.pk-hsearch__results[hidden] { display: none; }

.pk-hs-group {
	margin: var(--pk-space-2) var(--pk-space-3) var(--pk-space-1);
	color: var(--pk-muted);
	font-size: var(--pk-text-xs);
	font-weight: 800;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

.pk-hs-item {
	display: block;
	padding: 0.625rem 0.75rem;
	border-radius: var(--pk-radius-sm);
	color: var(--pk-ink-900);
	text-decoration: none;
}

.pk-hs-item:hover,
.pk-hs-item[aria-selected="true"] { background: var(--pk-brand-50); color: var(--pk-ink-900); }

.pk-hs-item strong { display: block; font-size: 0.9375rem; font-weight: 700; line-height: 1.35; }
.pk-hs-item mark { padding: 0; background: color-mix(in srgb, var(--pk-amber) 30%, transparent); color: inherit; border-radius: 2px; }

.pk-hs-item small {
	display: block;
	margin-top: 0.125rem;
	color: var(--pk-muted);
	font-size: var(--pk-text-xs);
	font-weight: 600;
}

.pk-hs-item span {
	display: -webkit-box;
	margin-top: 0.25rem;
	overflow: hidden;
	color: var(--pk-body);
	font-size: var(--pk-text-sm);
	line-height: 1.45;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.pk-hs-term { color: var(--pk-brand-700); font-size: var(--pk-text-xs); font-weight: 800; letter-spacing: 0.04em; text-transform: uppercase; }

.pk-hs-all,
.pk-hs-empty {
	display: block;
	margin-top: var(--pk-space-1);
	padding: 0.625rem 0.75rem;
	border-top: 1px solid var(--pk-border);
	color: var(--pk-brand-700);
	font-size: var(--pk-text-sm);
	font-weight: 700;
	text-decoration: none;
}

.pk-hs-empty { border-top: 0; color: var(--pk-muted); font-weight: 600; }
.pk-hs-all[aria-selected="true"], .pk-hs-all:hover { background: var(--pk-brand-50); border-radius: var(--pk-radius-sm); }

.pk-hpopular {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--pk-space-2);
	margin: var(--pk-space-5) 0 0;
	padding: 0;
	list-style: none;
}

.pk-hpopular li { margin: 0; }

.pk-hpopular a {
	display: inline-block;
	padding: 0.375rem 0.875rem;
	border: 1px solid color-mix(in srgb, var(--pk-white) 22%, transparent);
	border-radius: var(--pk-radius-full);
	color: color-mix(in srgb, var(--pk-white) 88%, transparent);
	font-size: var(--pk-text-sm);
	font-weight: 600;
	text-decoration: none;
	transition: background var(--pk-dur) var(--pk-ease), border-color var(--pk-dur) var(--pk-ease);
}

.pk-hpopular a:hover,
.pk-hpopular a:focus-visible {
	border-color: var(--pk-brand-300);
	background: color-mix(in srgb, var(--pk-brand-500) 22%, transparent);
	color: var(--pk-white);
}

/* ==========================================================================
   3. Page layout, sidebar, table of contents
   ========================================================================== */

.pk-hlayout {
	display: grid;
	grid-template-columns: var(--pk-h-nav) minmax(0, 1fr);
	gap: var(--pk-h-gap);
	align-items: start;
	padding-block: clamp(2rem, 1.5rem + 2vw, 3.5rem) var(--pk-section-y);
}

.pk-hlayout--article { grid-template-columns: var(--pk-h-nav) minmax(0, 1fr) var(--pk-h-toc); }
.pk-hlayout__main { min-width: 0; max-width: 50rem; }
.pk-hlayout--article .pk-hlayout__main { max-width: 46rem; }

.pk-hlayout__nav,
.pk-hlayout__toc {
	position: sticky;
	top: var(--pk-h-sticky);
	max-height: calc(100vh - var(--pk-h-sticky) - 1rem);
	overflow-y: auto;
	overscroll-behavior: contain;
	scrollbar-width: thin;
}

/* Sidebar */
.pk-hnav { font-size: 0.9375rem; }

.pk-hnav__mobile > summary { display: none; }

.pk-hnav__home {
	display: flex;
	align-items: center;
	gap: 0.625rem;
	margin-bottom: var(--pk-space-3);
	padding: 0.5rem 0.625rem;
	border-radius: var(--pk-radius-sm);
	color: var(--pk-ink-900);
	font-weight: 800;
	text-decoration: none;
}

.pk-hnav__home .pk-icon { width: 1.25rem; height: 1.25rem; color: var(--pk-brand-600); }
.pk-hnav__home:hover,
.pk-hnav__home.is-active { background: var(--pk-brand-50); color: var(--pk-brand-800); }

.pk-hnav__group { margin: 0 0 0.125rem; }

.pk-hnav__group > summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--pk-space-2);
	padding: 0.4375rem 0.625rem;
	border-radius: var(--pk-radius-sm);
	color: var(--pk-ink-800);
	font-weight: 700;
	line-height: 1.35;
	list-style: none;
	cursor: pointer;
	user-select: none;
}

.pk-hnav__group > summary::-webkit-details-marker { display: none; }
.pk-hnav__group > summary:hover { background: var(--pk-gray-50); }
.pk-hnav__group[open] > summary { color: var(--pk-ink-900); }

.pk-hnav__chev {
	width: 0.875rem;
	height: 0.875rem;
	flex: none;
	color: var(--pk-gray-500);
	transform: rotate(-90deg);
	transition: transform var(--pk-dur) var(--pk-ease);
}

.pk-hnav__group[open] > summary .pk-hnav__chev { transform: rotate(0deg); }

.pk-hnav__overview {
	display: block;
	margin: 0.125rem 0 0.25rem 0.625rem;
	padding: 0.3125rem 0.75rem;
	border-left: 2px solid var(--pk-border);
	color: var(--pk-brand-700);
	font-size: var(--pk-text-sm);
	font-weight: 700;
	text-decoration: none;
}

.pk-hnav__overview:hover,
.pk-hnav__overview.is-active { border-left-color: var(--pk-brand-500); background: var(--pk-brand-50); }

.pk-hnav__section {
	margin: var(--pk-space-3) 0 0.25rem 0.625rem;
	padding-left: 0.75rem;
	color: var(--pk-muted);
	font-size: 0.6875rem;
	font-weight: 800;
	letter-spacing: 0.07em;
	text-transform: uppercase;
}

.pk-hnav ul {
	margin: 0 0 var(--pk-space-2) 0.625rem;
	padding: 0;
	list-style: none;
	border-left: 2px solid var(--pk-border);
}

.pk-hnav li { margin: 0; }

.pk-hnav li a {
	display: block;
	margin-left: -2px;
	padding: 0.3125rem 0.5rem 0.3125rem 0.75rem;
	border-left: 2px solid transparent;
	color: var(--pk-body);
	font-size: var(--pk-text-sm);
	font-weight: 600;
	line-height: 1.4;
	text-decoration: none;
}

.pk-hnav li a:hover { border-left-color: var(--pk-brand-300); color: var(--pk-brand-700); }

.pk-hnav li a.is-active {
	border-left-color: var(--pk-brand-500);
	background: var(--pk-brand-50);
	color: var(--pk-brand-800);
}

/* Table of contents */
.pk-htoc { font-size: var(--pk-text-sm); }

.pk-htoc__title {
	margin: 0 0 var(--pk-space-2);
	color: var(--pk-ink-900);
	font-size: 0.75rem;
	font-weight: 800;
	letter-spacing: 0.07em;
	text-transform: uppercase;
}

.pk-htoc ul {
	margin: 0;
	padding: 0;
	list-style: none;
	border-left: 2px solid var(--pk-border);
}

.pk-htoc li { margin: 0; }
.pk-htoc li.is-h3 a { padding-left: 1.5rem; font-weight: 500; }

.pk-htoc a {
	display: block;
	margin-left: -2px;
	padding: 0.3125rem 0 0.3125rem 0.875rem;
	border-left: 2px solid transparent;
	color: var(--pk-body);
	font-weight: 600;
	line-height: 1.4;
	text-decoration: none;
}

.pk-htoc a:hover { color: var(--pk-brand-700); }
.pk-htoc a.is-active { border-left-color: var(--pk-brand-500); color: var(--pk-brand-800); }

.pk-htoc-mobile {
	display: none;
	margin-bottom: var(--pk-space-6);
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius);
	background: var(--pk-gray-25);
}

.pk-htoc-mobile summary {
	padding: 0.75rem 1rem;
	color: var(--pk-ink-900);
	font-weight: 700;
	cursor: pointer;
}

.pk-htoc-mobile ul { margin: 0; padding: 0 1rem 0.75rem 1.25rem; font-size: 0.9375rem; }
.pk-htoc-mobile li { margin: 0.25rem 0; }
.pk-htoc-mobile li.is-h3 { margin-left: 1rem; }
.pk-htoc-mobile a { color: var(--pk-link); text-decoration: none; }

/* ==========================================================================
   4. Article content (knowledge-base blocks)
   ========================================================================== */

.pk-kb {
	color: var(--pk-ink-700);
	font-size: 1.0625rem;
	line-height: 1.72;
	overflow-wrap: break-word;
}

.pk-kb > :first-child { margin-top: 0; }

.pk-kb :where(h2, h3, h4) {
	position: relative;
	color: var(--pk-ink-900);
	letter-spacing: -0.01em;
	scroll-margin-top: calc(var(--pk-header-h) + 1.5rem);
}

.pk-kb h2 { margin: var(--pk-space-12) 0 var(--pk-space-4); font-size: 1.625rem; line-height: 1.25; }
.pk-kb h3 { margin: var(--pk-space-8) 0 var(--pk-space-3); font-size: 1.25rem; line-height: 1.3; }
.pk-kb h4 { margin: var(--pk-space-6) 0 var(--pk-space-2); font-size: 1.0625rem; }

.pk-kb [id] { scroll-margin-top: calc(var(--pk-header-h) + 1.5rem); }

.pk-kb p { margin: 0 0 var(--pk-space-4); }
.pk-kb p.lead { color: var(--pk-ink-700); font-size: 1.125rem; }

.pk-kb ul,
.pk-kb ol { margin: 0 0 var(--pk-space-5); padding-left: 1.375rem; }

.pk-kb li { margin: 0.375rem 0; }
.pk-kb li > ul, .pk-kb li > ol { margin: 0.375rem 0 0.5rem; }
.pk-kb li::marker { color: var(--pk-brand-600); }

.pk-kb strong { color: var(--pk-ink-900); font-weight: 700; }

.pk-kb a {
	color: var(--pk-link);
	font-weight: 600;
	text-decoration: underline;
	text-decoration-color: color-mix(in srgb, var(--pk-brand-500) 40%, transparent);
	text-decoration-thickness: 1.5px;
	text-underline-offset: 3px;
}

.pk-kb a:hover { color: var(--pk-brand-800); text-decoration-color: currentColor; }

.pk-kb code {
	padding: 0.1em 0.375em;
	border-radius: 5px;
	background: var(--pk-gray-100);
	color: var(--pk-ink-900);
	font-family: var(--pk-font-mono);
	font-size: 0.875em;
}

.pk-kb pre {
	margin: var(--pk-space-5) 0;
	padding: var(--pk-space-4) var(--pk-space-5);
	overflow-x: auto;
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius);
	background: var(--pk-gray-50);
	color: var(--pk-ink-800);
	font-family: var(--pk-font-mono);
	font-size: 0.875rem;
	line-height: 1.7;
}

.pk-kb pre code {
	padding: 0;
	border-radius: 0;
	background: none;
	font-size: inherit;
	white-space: pre;
}

.pk-kb kbd {
	display: inline-block;
	padding: 0.0625rem 0.4375rem;
	border: 1px solid var(--pk-border-strong);
	border-bottom-width: 2px;
	border-radius: 6px;
	background: var(--pk-white);
	color: var(--pk-ink-900);
	font-family: var(--pk-font-mono);
	font-size: 0.8125em;
	line-height: 1.5;
}

.pk-kb blockquote {
	margin: var(--pk-space-6) 0;
	padding: var(--pk-space-1) 0 var(--pk-space-1) var(--pk-space-5);
	border-left: 3px solid var(--pk-border-strong);
	color: var(--pk-ink-700);
}

/* Copy-a-link anchors added by help.js */
.pk-hlink {
	position: absolute;
	left: -1.5rem;
	top: 50%;
	display: inline-grid;
	place-items: center;
	width: 1.25rem;
	height: 1.25rem;
	padding: 0;
	border: 0;
	border-radius: 5px;
	background: none;
	color: var(--pk-gray-400);
	font: inherit;
	font-size: 0.875rem;
	font-weight: 700;
	line-height: 1;
	opacity: 0;
	transform: translateY(-50%);
	cursor: pointer;
	transition: opacity var(--pk-dur) var(--pk-ease), color var(--pk-dur) var(--pk-ease);
}

.pk-kb :where(h2, h3):hover .pk-hlink,
.pk-hlink:focus-visible { opacity: 1; }
.pk-hlink:hover { color: var(--pk-brand-600); }
.pk-hlink.is-copied { opacity: 1; color: var(--pk-brand-600); }

/* Tables */
.pk-kb .table-wrap {
	margin: var(--pk-space-6) 0;
	overflow-x: auto;
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius);
	background: var(--pk-white);
}

.pk-kb table {
	width: 100%;
	margin: 0;
	border-collapse: collapse;
	font-size: 0.9375rem;
	line-height: 1.55;
}

.pk-kb :where(th, td) {
	padding: 0.625rem 0.875rem;
	border-bottom: 1px solid var(--pk-border);
	text-align: left;
	vertical-align: top;
}

.pk-kb tr:last-child td { border-bottom: 0; }

.pk-kb th {
	background: var(--pk-gray-50);
	color: var(--pk-ink-900);
	font-size: var(--pk-text-sm);
	font-weight: 700;
	white-space: nowrap;
}

.pk-kb tbody tr:hover td { background: var(--pk-gray-25); }
.pk-kb td:first-child { color: var(--pk-ink-900); font-weight: 600; }

/* Steps */
.pk-kb .steps {
	counter-reset: none;
	margin: var(--pk-space-6) 0 var(--pk-space-8);
	padding: 0;
	list-style: none;
}

.pk-kb .step {
	position: relative;
	display: grid;
	grid-template-columns: 2.25rem minmax(0, 1fr);
	gap: var(--pk-space-4);
	margin: 0;
	padding-bottom: var(--pk-space-5);
}

.pk-kb .step::marker { content: none; }

.pk-kb .step:not(:last-child)::before {
	content: "";
	position: absolute;
	left: calc(1.125rem - 1px);
	top: 2.5rem;
	bottom: 0.25rem;
	width: 2px;
	background: linear-gradient(var(--pk-brand-200), var(--pk-border));
}

.pk-kb .step-n {
	display: grid;
	place-items: center;
	width: 2.25rem;
	height: 2.25rem;
	border-radius: 50%;
	background: var(--pk-brand-600);
	box-shadow: 0 0 0 4px var(--pk-brand-50);
	color: var(--pk-white);
	font-size: 0.9375rem;
	font-weight: 800;
}

.pk-kb .step-b {
	min-width: 0;
	padding: 0.25rem 0 0;
}

.pk-kb .step-t {
	margin-bottom: var(--pk-space-2);
	color: var(--pk-ink-900);
	font-size: 1.0625rem;
	font-weight: 700;
	line-height: 1.45;
}

.pk-kb .step-meta {
	display: grid;
	gap: 0;
	margin: 0 0 var(--pk-space-2);
	overflow: hidden;
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius);
	background: var(--pk-gray-25);
	font-size: 0.9375rem;
	line-height: 1.55;
}

.pk-kb .step-meta > div {
	display: grid;
	grid-template-columns: 7.5rem minmax(0, 1fr);
	gap: var(--pk-space-3);
	padding: 0.5rem 0.875rem;
}

.pk-kb .step-meta > div + div { border-top: 1px solid var(--pk-border); }

.pk-kb .step-meta dt {
	color: var(--pk-muted);
	font-size: var(--pk-text-xs);
	font-weight: 800;
	letter-spacing: 0.05em;
	line-height: 2;
	text-transform: uppercase;
}

.pk-kb .step-meta dd { margin: 0; }
.pk-kb .step-meta .f-where dd strong { color: var(--pk-brand-800); }
.pk-kb .step-meta .f-needs dt { color: var(--pk-h-warn); }
.pk-kb .step-meta .f-approval dt { color: var(--pk-h-why); }
.pk-kb .step-x { font-size: 1rem; }
.pk-kb .step-x > :last-child { margin-bottom: 0; }

/* Callouts */
.pk-kb .callout {
	--c: var(--pk-h-info);
	--c-bg: var(--pk-h-info-bg);
	margin: var(--pk-space-6) 0;
	padding: var(--pk-space-4) var(--pk-space-5);
	border: 1px solid color-mix(in srgb, var(--c) 22%, transparent);
	border-left: 4px solid var(--c);
	border-radius: var(--pk-radius);
	background: var(--c-bg);
	font-size: 1rem;
}

.pk-kb .callout-tip { --c: var(--pk-h-tip); --c-bg: var(--pk-h-tip-bg); }
.pk-kb .callout-warn { --c: var(--pk-h-warn); --c-bg: var(--pk-h-warn-bg); }
.pk-kb .callout-approval { --c: var(--pk-h-why); --c-bg: var(--pk-h-why-bg); }
.pk-kb .callout-why { --c: var(--pk-h-why); --c-bg: var(--pk-h-why-bg); }
.pk-kb .callout-escalate { --c: var(--pk-h-stop); --c-bg: var(--pk-h-stop-bg); }

.pk-kb .callout-t {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: var(--pk-space-2);
	color: var(--c);
	font-size: 0.9375rem;
	font-weight: 800;
}

.pk-kb .callout-t::before {
	content: "";
	flex: none;
	width: 1.125rem;
	height: 1.125rem;
	background: currentColor;
	-webkit-mask: var(--pk-callout-icon) center / contain no-repeat;
	mask: var(--pk-callout-icon) center / contain no-repeat;
	--pk-callout-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 11v5M12 8h.01'/%3E%3C/svg%3E");
}

.pk-kb .callout-tip .callout-t::before { --pk-callout-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 18h6M10 21h4M12 3a6 6 0 0 0-4 10.5c.7.7 1 1.5 1 2.5h6c0-1 .3-1.8 1-2.5A6 6 0 0 0 12 3Z'/%3E%3C/svg%3E"); }
.pk-kb .callout-warn .callout-t::before,
.pk-kb .callout-escalate .callout-t::before { --pk-callout-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 2 20h20L12 3Z'/%3E%3Cpath d='M12 10v4M12 17h.01'/%3E%3C/svg%3E"); }
.pk-kb .callout-approval .callout-t::before { --pk-callout-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3 4 6v6c0 4.5 3.4 8.2 8 9 4.6-.8 8-4.5 8-9V6l-8-3Z'/%3E%3Cpath d='m8.5 12 2.5 2.5 4.5-5'/%3E%3C/svg%3E"); }

/* Worked examples: a figure-like card, set apart from advice callouts. */
.pk-kb .callout-example {
	--c: var(--pk-ink-800);
	padding: 0;
	overflow: hidden;
	border: 1px solid var(--pk-border-strong);
	border-left: 1px solid var(--pk-border-strong);
	background: var(--pk-white);
	box-shadow: var(--pk-shadow-xs);
}

.pk-kb .callout-example .callout-t {
	margin: 0;
	padding: 0.625rem 1.125rem;
	border-bottom: 1px solid var(--pk-border);
	background: linear-gradient(90deg, var(--pk-gray-50), var(--pk-white));
	color: var(--pk-ink-900);
}

.pk-kb .callout-example .callout-t::before {
	color: var(--pk-brand-600);
	--pk-callout-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='5' y='3' width='14' height='18' rx='2'/%3E%3Cpath d='M8 7h8M8 11h2M12 11h2M16 11h0M8 15h2M12 15h2M8 18h2M12 18h4'/%3E%3C/svg%3E");
}

.pk-kb .callout.callout-example > :not(.callout-t) { margin-inline: 1.125rem; }
.pk-kb .callout-example > .callout-t + * { margin-top: var(--pk-space-4); }
.pk-kb .callout.callout-example > :last-child { margin-bottom: var(--pk-space-4); }
.pk-kb .callout-example .table-wrap { margin-block: var(--pk-space-3); }
.pk-kb .callout-example table { font-variant-numeric: tabular-nums; }

.pk-kb .callout > :last-child { margin-bottom: 0; }
.pk-kb .callout p { margin-bottom: var(--pk-space-3); }
.pk-kb .callout ul, .pk-kb .callout ol { margin-bottom: var(--pk-space-3); }

/* What happens (effects) */
.pk-kb .effects {
	margin: var(--pk-space-6) 0;
	padding: 0;
	overflow: hidden;
	border: 1px solid var(--pk-brand-200);
	border-radius: var(--pk-radius);
	background: var(--pk-white);
}

.pk-kb .effects figcaption {
	display: flex;
	align-items: center;
	gap: 0.5rem;
	margin: 0;
	padding: 0.625rem 0.875rem;
	border-bottom: 1px solid var(--pk-brand-100);
	background: var(--pk-brand-50);
	color: var(--pk-brand-800);
	font-size: 0.9375rem;
	font-weight: 800;
	text-align: left;
}

.pk-kb .effects .table-wrap { margin: 0; border: 0; border-radius: 0; }
.pk-kb .effects > :not(figcaption):not(.table-wrap) { margin: var(--pk-space-4); }

/* Day in the life */
.pk-kb .timeline {
	margin: var(--pk-space-6) 0 var(--pk-space-8);
	padding: 0;
	list-style: none;
}

.pk-kb .timeline > li {
	position: relative;
	display: grid;
	grid-template-columns: 5.5rem minmax(0, 1fr);
	gap: var(--pk-space-4);
	margin: 0;
	padding-bottom: var(--pk-space-6);
}

.pk-kb .timeline > li::before {
	content: "";
	position: absolute;
	left: calc(5.5rem + 0.5rem);
	top: 0.5rem;
	bottom: 0;
	width: 2px;
	background: var(--pk-border);
}

.pk-kb .timeline > li:last-child::before { display: none; }

.pk-kb .timeline time {
	padding-top: 0.0625rem;
	color: var(--pk-brand-700);
	font-size: var(--pk-text-sm);
	font-weight: 800;
	font-variant-numeric: tabular-nums;
	text-align: right;
}

.pk-kb .tl-b {
	position: relative;
	padding-left: var(--pk-space-6);
}

.pk-kb .tl-b::before {
	content: "";
	position: absolute;
	left: -0.3125rem;
	top: 0.4375rem;
	width: 0.75rem;
	height: 0.75rem;
	border: 2px solid var(--pk-brand-500);
	border-radius: 50%;
	background: var(--pk-white);
}

.pk-kb .tl-t { margin-bottom: var(--pk-space-1); color: var(--pk-ink-900); font-weight: 700; }
.pk-kb .tl-b > :last-child { margin-bottom: 0; }

/* Cards (start here lists) */
.pk-kb .cards,
.pk-hcards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr));
	gap: var(--pk-space-3);
	margin: var(--pk-space-5) 0 var(--pk-space-8);
}

.pk-kb .card,
.pk-hcard {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	padding: var(--pk-space-4) var(--pk-space-5);
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius);
	background: var(--pk-white);
	text-decoration: none;
	transition: border-color var(--pk-dur) var(--pk-ease), box-shadow var(--pk-dur) var(--pk-ease), transform var(--pk-dur) var(--pk-ease);
}

.pk-kb a.card { font-weight: inherit; text-decoration: none; }

.pk-kb .card:hover,
.pk-hcard:hover {
	border-color: var(--pk-brand-300);
	box-shadow: var(--pk-shadow-sm);
	transform: translateY(-1px);
}

.pk-kb .card strong,
.pk-hcard strong { color: var(--pk-ink-900); font-size: 0.9375rem; line-height: 1.4; }

.pk-kb .card span,
.pk-hcard span { color: var(--pk-body); font-size: var(--pk-text-sm); font-weight: 500; line-height: 1.5; }

.pk-hcard--start { border-left: 3px solid var(--pk-brand-500); }

/* Area cards on a module home */
.pk-kb .kb-areas { margin: var(--pk-space-4) 0 var(--pk-space-8); }

.pk-kb .kb-area-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(14.5rem, 1fr));
	gap: var(--pk-space-3);
	margin-top: var(--pk-space-4);
}

.pk-kb a.kb-area-card {
	display: flex;
	flex-direction: column;
	gap: 0.375rem;
	padding: var(--pk-space-5);
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius-lg);
	background: linear-gradient(180deg, var(--pk-white), var(--pk-gray-25));
	font-weight: inherit;
	text-decoration: none;
	transition: border-color var(--pk-dur) var(--pk-ease), box-shadow var(--pk-dur) var(--pk-ease), transform var(--pk-dur) var(--pk-ease);
}

.pk-kb a.kb-area-card:hover { border-color: var(--pk-brand-300); box-shadow: var(--pk-shadow); transform: translateY(-2px); }
.pk-kb .kb-area-card strong { color: var(--pk-ink-900); font-size: 1.0625rem; }
.pk-kb .kb-area-card span { color: var(--pk-body); font-size: var(--pk-text-sm); font-weight: 500; line-height: 1.5; }
.pk-kb .kb-area-card em { margin-top: auto; padding-top: var(--pk-space-2); color: var(--pk-brand-700); font-size: var(--pk-text-sm); font-style: normal; font-weight: 700; }

/* FAQ */
.pk-kb .faq {
	margin: var(--pk-space-5) 0 var(--pk-space-8);
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius);
	background: var(--pk-white);
}

.pk-kb .faq details + details { border-top: 1px solid var(--pk-border); }

.pk-kb .faq summary {
	position: relative;
	padding: 0.875rem 3rem 0.875rem 1.125rem;
	color: var(--pk-ink-900);
	font-weight: 700;
	line-height: 1.45;
	list-style: none;
	cursor: pointer;
}

.pk-kb .faq summary::-webkit-details-marker { display: none; }

.pk-kb .faq summary::after {
	content: "+";
	position: absolute;
	right: 1.125rem;
	top: 50%;
	transform: translateY(-50%);
	color: var(--pk-brand-600);
	font-size: 1.375rem;
	font-weight: 500;
	line-height: 1;
}

.pk-kb .faq details[open] summary::after { content: "−"; }
.pk-kb .faq summary:hover { background: var(--pk-gray-25); }
.pk-kb .faq details > div { padding: 0 1.125rem 0.875rem; font-size: 1rem; }
.pk-kb .faq details > div > :last-child { margin-bottom: 0; }

/* Glossary terms in running text */
.pk-kb a.kb-term {
	position: relative;
	color: inherit;
	font-weight: inherit;
	text-decoration: underline dotted;
	text-decoration-color: var(--pk-brand-500);
	text-decoration-thickness: 1.5px;
	text-underline-offset: 4px;
	cursor: help;
}

.pk-kb a.kb-term:hover { color: var(--pk-brand-800); }

/* The tip exists only while it is shown: a hidden one near the right edge
   would still widen the page and give it a sideways scroll. */
.pk-kb a.kb-term::after {
	content: none;
	position: absolute;
	z-index: 30;
	left: 50%;
	bottom: calc(100% + 0.5rem);
	width: max-content;
	max-width: min(18rem, 80vw);
	padding: 0.5rem 0.75rem;
	border-radius: var(--pk-radius-sm);
	background: var(--pk-ink-900);
	box-shadow: var(--pk-shadow-lg);
	color: var(--pk-white);
	font-size: var(--pk-text-sm);
	font-weight: 500;
	line-height: 1.45;
	text-align: left;
	white-space: normal;
	opacity: 0;
	pointer-events: none;
	transform: translate(-50%, 4px);
	transition: opacity 0.15s ease, transform 0.15s ease;
}

.pk-kb a.kb-term:hover::after,
.pk-kb a.kb-term:focus-visible::after { content: attr(data-tip); opacity: 1; transform: translate(-50%, 0); }

/* Set by help.js when the term sits near an edge of the window. */
.pk-kb a.kb-term--end::after { left: auto; right: 0; transform: translate(0, 4px); }
.pk-kb a.kb-term--start::after { left: 0; transform: translate(0, 4px); }
.pk-kb a.kb-term--end:hover::after,
.pk-kb a.kb-term--end:focus-visible::after,
.pk-kb a.kb-term--start:hover::after,
.pk-kb a.kb-term--start:focus-visible::after { transform: translate(0, 0); }

/* Messages page */
.pk-kb .msgs { display: grid; gap: var(--pk-space-3); margin: var(--pk-space-4) 0 var(--pk-space-8); }

.pk-kb .msg {
	padding: var(--pk-space-4) var(--pk-space-5);
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius);
	background: var(--pk-white);
	font-size: 1rem;
}

.pk-kb .msg:target { border-color: var(--pk-brand-400); box-shadow: 0 0 0 3px var(--pk-brand-100); }
.pk-kb .msg header { margin-bottom: var(--pk-space-2); color: var(--pk-ink-900); font-size: 1.0625rem; }
.pk-kb .msg p { margin: 0 0 var(--pk-space-2); }
.pk-kb .msg p:last-child { margin-bottom: 0; }

.pk-kb .msg .lbl {
	display: block;
	color: var(--pk-muted);
	font-size: var(--pk-text-xs);
	font-weight: 800;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.pk-kb .msg-says {
	padding: 0.5rem 0.75rem;
	border-left: 3px solid var(--pk-h-warn);
	border-radius: 0 var(--pk-radius-sm) var(--pk-radius-sm) 0;
	background: var(--pk-h-warn-bg);
	color: var(--pk-ink-900);
	font-style: italic;
}

.pk-kb .msg-says .lbl { font-style: normal; }
.pk-kb .msg-rel { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; font-size: var(--pk-text-sm); }

/* Glossary page */
.pk-kb .letters {
	position: sticky;
	top: calc(var(--pk-header-h) + 0.5rem);
	z-index: 5;
	display: flex;
	flex-wrap: wrap;
	gap: 0.25rem;
	margin: 0 0 var(--pk-space-6);
	padding: 0.5rem;
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius);
	background: color-mix(in srgb, var(--pk-white) 94%, transparent);
	backdrop-filter: blur(6px);
}

.pk-kb .letters a {
	display: grid;
	place-items: center;
	min-width: 2rem;
	height: 2rem;
	border-radius: var(--pk-radius-sm);
	color: var(--pk-ink-700);
	font-size: var(--pk-text-sm);
	font-weight: 700;
	text-decoration: none;
}

.pk-kb .letters a:hover { background: var(--pk-brand-50); color: var(--pk-brand-800); }

.pk-kb .glossary { margin: 0; }

.pk-kb .g-letter {
	margin: var(--pk-space-8) 0 var(--pk-space-3);
	padding-bottom: var(--pk-space-2);
	border-bottom: 2px solid var(--pk-brand-100);
	color: var(--pk-brand-700);
	font-size: 1.5rem;
	font-weight: 800;
}

.pk-kb .glossary dt {
	margin-top: var(--pk-space-5);
	color: var(--pk-ink-900);
	font-size: 1.0625rem;
	font-weight: 800;
}

.pk-kb .glossary dt:target { color: var(--pk-brand-700); }
.pk-kb .g-alias { margin-left: 0.375rem; color: var(--pk-muted); font-size: var(--pk-text-sm); font-weight: 600; }
.pk-kb .glossary dd { margin: var(--pk-space-1) 0 0; font-size: 1rem; }
.pk-kb .g-short { color: var(--pk-ink-800); font-weight: 600; }
.pk-kb .g-rel { color: var(--pk-muted); font-size: var(--pk-text-sm); }

/* After the article */
.pk-hrelated,
.pk-hmore {
	margin-top: var(--pk-space-12);
	padding-top: var(--pk-space-8);
	border-top: 1px solid var(--pk-border);
}

.pk-hrelated h2,
.pk-hmore h2 { margin: 0 0 var(--pk-space-4); font-size: var(--pk-text-xl); }
.pk-hrelated .pk-hcards { margin-bottom: 0; }
.pk-hmore { margin-top: var(--pk-space-8); padding-top: 0; border-top: 0; }

.pk-hmore ul {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr));
	gap: 0.25rem var(--pk-space-6);
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 0.9375rem;
}

.pk-hmore li { margin: 0; }
.pk-hmore a { display: block; padding: 0.3125rem 0; color: var(--pk-link); font-weight: 600; text-decoration: none; }
.pk-hmore a:hover { text-decoration: underline; }

.pk-hfeedback {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--pk-space-3) var(--pk-space-4);
	margin-top: var(--pk-space-10);
	padding-top: var(--pk-space-6);
	border-top: 1px solid var(--pk-border);
}

.pk-hfeedback[hidden] { display: none; }
.pk-hfeedback__q { margin: 0; color: var(--pk-ink-900); font-weight: 700; }
.pk-hfeedback__btns { display: flex; gap: var(--pk-space-2); }
.pk-hfeedback__btns[hidden], .pk-hfeedback [hidden] { display: none; }
.pk-hfeedback__thanks { margin: 0; color: var(--pk-body); font-size: 0.9375rem; }
.pk-hfeedback__thanks a { color: var(--pk-link); font-weight: 700; }
.pk-hfeedback + .pk-hsupport { margin-top: var(--pk-space-5); }

.pk-hsupport {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pk-space-4);
	align-items: center;
	justify-content: space-between;
	margin-top: var(--pk-space-10);
	padding: var(--pk-space-5) var(--pk-space-6);
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius-lg);
	background: linear-gradient(135deg, var(--pk-gray-50), var(--pk-white));
}

.pk-hsupport strong { display: block; color: var(--pk-ink-900); }
.pk-hsupport p { max-width: 32rem; margin: 0.125rem 0 0; color: var(--pk-body); font-size: 0.9375rem; }

/* ==========================================================================
   5. Lists, index, role filter
   ========================================================================== */

.pk-hindex { margin-top: var(--pk-space-12); }
.pk-hlayout__main > .pk-hindex:first-child,
.pk-hstart + .pk-hindex { margin-top: var(--pk-space-8); }

.pk-hindex__head {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--pk-space-4);
	margin-bottom: var(--pk-space-5);
}

.pk-hindex__head h2 { margin: 0; font-size: var(--pk-text-2xl); }
.pk-hindex__head:empty { display: none; }

.pk-hindex__area { margin-bottom: var(--pk-space-8); }

.pk-hindex__area > h3,
.pk-hindex__area > h2 {
	margin: 0 0 var(--pk-space-2);
	padding-top: var(--pk-space-6);
	border-top: 1px solid var(--pk-border);
	font-size: var(--pk-text-xl);
}

.pk-hindex__area:first-of-type > h3,
.pk-hindex__area:first-of-type > h2 { border-top: 0; padding-top: 0; }

.pk-hindex__area > h3 a { color: var(--pk-ink-900); text-decoration: none; }
.pk-hindex__area > h3 a:hover { color: var(--pk-brand-700); }

.pk-hindex__summary { margin: 0 0 var(--pk-space-4); color: var(--pk-body); font-size: 0.9375rem; }

.pk-hindex__section h4 {
	margin: var(--pk-space-5) 0 var(--pk-space-2);
	color: var(--pk-muted);
	font-size: var(--pk-text-xs);
	font-weight: 800;
	letter-spacing: 0.07em;
	text-transform: uppercase;
}

.pk-hindex__empty { color: var(--pk-muted); }

.pk-hlist {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr));
	gap: var(--pk-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.pk-hlist__item { margin: 0; }

.pk-hlist__item a {
	display: flex;
	flex-direction: column;
	gap: 0.1875rem;
	height: 100%;
	padding: 0.75rem 0.875rem;
	border: 1px solid transparent;
	border-radius: var(--pk-radius);
	text-decoration: none;
	transition: border-color var(--pk-dur) var(--pk-ease), background var(--pk-dur) var(--pk-ease);
}

.pk-hlist__item a:hover { border-color: var(--pk-border); background: var(--pk-gray-25); }
.pk-hlist__item strong { color: var(--pk-link); font-size: 0.9375rem; line-height: 1.4; }
.pk-hlist__item span { color: var(--pk-body); font-size: var(--pk-text-sm); line-height: 1.5; }

.pk-hroles {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--pk-space-2);
}

.pk-hroles[hidden] { display: none; }
.pk-hroles__label { margin-right: var(--pk-space-1); color: var(--pk-muted); font-size: var(--pk-text-sm); font-weight: 700; }

[data-pk-filtered="out"] { display: none !important; }

.pk-hstart h2 { margin: 0 0 var(--pk-space-3); font-size: var(--pk-text-xl); }

/* ==========================================================================
   6. Help centre home
   ========================================================================== */

.pk-hcore__head {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: var(--pk-space-8);
	align-items: end;
	margin-bottom: var(--pk-space-6);
}

.pk-hcore__head h2 { margin: var(--pk-space-2) 0 var(--pk-space-3); font-size: var(--pk-display-3); }
.pk-hcore__head .pk-lead { max-width: 44rem; margin: 0; }

.pk-hcore__cta {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	gap: var(--pk-space-2);
}

.pk-hcore__count { color: var(--pk-muted); font-size: var(--pk-text-sm); font-weight: 600; }

.pk-hbasics {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--pk-space-2) var(--pk-space-4);
	margin: 0 0 var(--pk-space-8);
	padding: var(--pk-space-3) var(--pk-space-5);
	border: 1px dashed var(--pk-brand-200);
	border-radius: var(--pk-radius);
	background: var(--pk-brand-50);
	font-size: 0.9375rem;
}

.pk-hbasics span { color: var(--pk-ink-800); font-weight: 700; }
.pk-hbasics a { color: var(--pk-brand-800); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: var(--pk-brand-300); }

.pk-hprocess {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--pk-space-4);
	margin: 0;
	padding: 0;
	list-style: none;
	counter-reset: none;
}

.pk-hprocess__step {
	position: relative;
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: var(--pk-space-6);
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius-lg);
	background: var(--pk-white);
	box-shadow: var(--pk-shadow-xs);
	transition: border-color var(--pk-dur) var(--pk-ease), box-shadow var(--pk-dur) var(--pk-ease);
}

.pk-hprocess__step:hover { border-color: var(--pk-brand-200); box-shadow: var(--pk-shadow); }

.pk-hprocess__top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 2rem;
	margin-bottom: var(--pk-space-4);
}

.pk-hprocess__n {
	display: grid;
	place-items: center;
	width: 2rem;
	height: 2rem;
	border-radius: 50%;
	background: var(--pk-brand-600);
	color: var(--pk-white);
	font-size: var(--pk-text-sm);
	font-weight: 800;
}

.pk-hprocess__icon { color: var(--pk-brand-500); }
.pk-hprocess__icon .pk-icon { width: 1.5rem; height: 1.5rem; }

.pk-hprocess__step h3 { margin: 0 0 var(--pk-space-2); font-size: var(--pk-text-xl); }
.pk-hprocess__step h3 a { color: var(--pk-ink-900); text-decoration: none; }
.pk-hprocess__step h3 a:hover { color: var(--pk-brand-700); }
.pk-hprocess__step p { margin: 0 0 var(--pk-space-4); color: var(--pk-body); font-size: 0.9375rem; line-height: 1.55; }

.pk-hprocess__step ul {
	margin: auto 0 0;
	padding: var(--pk-space-3) 0 0;
	list-style: none;
	border-top: 1px solid var(--pk-border);
}

.pk-hprocess__step li { margin: 0; }

.pk-hprocess__step li a {
	display: block;
	padding: 0.3125rem 0;
	color: var(--pk-link);
	font-size: 0.9375rem;
	font-weight: 600;
	text-decoration: none;
}

.pk-hprocess__step li a::before { content: "→"; margin-right: 0.5rem; color: var(--pk-brand-400); }
.pk-hprocess__step li a:hover { color: var(--pk-brand-800); }

.pk-hmods {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--pk-space-5);
}

.pk-hmod {
	display: flex;
	flex-direction: column;
	gap: var(--pk-space-3);
	padding: var(--pk-space-6);
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius-lg);
	background: var(--pk-white);
	transition: border-color var(--pk-dur) var(--pk-ease), box-shadow var(--pk-dur) var(--pk-ease);
}

.pk-hmod:hover { border-color: var(--pk-brand-200); box-shadow: var(--pk-shadow); }

.pk-hmod header {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 0 var(--pk-space-3);
	align-items: center;
}

.pk-hmod header .pk-card__icon { grid-row: span 2; margin: 0; }
.pk-hmod h3 { margin: 0; font-size: var(--pk-text-lg); line-height: 1.3; }
.pk-hmod h3 a { color: var(--pk-ink-900); text-decoration: none; }
.pk-hmod h3 a:hover { color: var(--pk-brand-700); }
.pk-hmod__count { color: var(--pk-muted); font-size: var(--pk-text-sm); font-weight: 600; }
.pk-hmod > p { margin: 0; color: var(--pk-body); font-size: 0.9375rem; line-height: 1.55; }

.pk-hmod__areas {
	display: flex;
	flex-wrap: wrap;
	gap: 0.375rem;
	margin: 0;
	padding: 0;
	list-style: none;
}

.pk-hmod__areas li { margin: 0; }

.pk-hmod__areas a {
	display: inline-block;
	padding: 0.1875rem 0.625rem;
	border-radius: var(--pk-radius-full);
	background: var(--pk-gray-100);
	color: var(--pk-ink-700);
	font-size: var(--pk-text-xs);
	font-weight: 700;
	text-decoration: none;
}

.pk-hmod__areas a:hover { background: var(--pk-brand-100); color: var(--pk-brand-800); }

.pk-hmod footer {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--pk-space-3);
	margin-top: auto;
	padding-top: var(--pk-space-3);
}

.pk-hmod footer .pk-arrow-link { font-size: 0.9375rem; }

.pk-hroles-grid,
.pk-hbiz {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(17rem, 1fr));
	gap: var(--pk-space-4);
}

.pk-hrole,
.pk-hbiz__item {
	padding: var(--pk-space-5) var(--pk-space-6);
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius-lg);
	background: var(--pk-white);
}

.pk-hrole h3,
.pk-hbiz__item h3 {
	display: flex;
	align-items: center;
	gap: 0.625rem;
	margin: 0 0 var(--pk-space-3);
	font-size: var(--pk-text-lg);
}

.pk-hrole__icon {
	display: inline-grid;
	place-items: center;
	width: 2.25rem;
	height: 2.25rem;
	flex: none;
	border-radius: var(--pk-radius-sm);
	background: var(--pk-brand-50);
	color: var(--pk-brand-600);
}

.pk-hrole__icon .pk-icon { width: 1.125rem; height: 1.125rem; }

.pk-hrole ul,
.pk-hbiz__item ul { margin: 0; padding: 0; list-style: none; }

.pk-hrole li,
.pk-hbiz__item li {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	gap: var(--pk-space-3);
	margin: 0;
	padding: 0.375rem 0;
	border-top: 1px solid var(--pk-gray-100);
	font-size: 0.9375rem;
}

.pk-hrole li:first-child,
.pk-hbiz__item li:first-child { border-top: 0; }
.pk-hrole li a, .pk-hbiz__item li a { color: var(--pk-link); font-weight: 600; text-decoration: none; }
.pk-hrole li a:hover, .pk-hbiz__item li a:hover { text-decoration: underline; }
.pk-hrole li span { flex: none; color: var(--pk-muted); font-size: var(--pk-text-xs); font-weight: 700; }

.pk-hbiz__more {
	display: inline-flex;
	align-items: center;
	gap: 0.375rem;
	margin-top: var(--pk-space-3);
	color: var(--pk-brand-700);
	font-size: var(--pk-text-sm);
	font-weight: 700;
	text-decoration: none;
}

.pk-hbiz__more .pk-icon { width: 0.875rem; height: 0.875rem; }
.pk-hbiz__more:hover { text-decoration: underline; }

.pk-split--top { align-items: start; }

.pk-hfix {
	display: grid;
	gap: var(--pk-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.pk-hfix li {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--pk-space-2) var(--pk-space-4);
	margin: 0;
	padding: 0.875rem 1.125rem;
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius);
	background: var(--pk-white);
}

.pk-hfix__mod {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	min-width: 10rem;
	color: var(--pk-ink-900);
	font-weight: 800;
}

.pk-hfix__mod .pk-icon { width: 1.125rem; height: 1.125rem; color: var(--pk-brand-600); }
.pk-hfix a { color: var(--pk-link); font-size: 0.9375rem; font-weight: 600; text-decoration: none; }
.pk-hfix a:hover { text-decoration: underline; }

/* Accounting card on the resources page. */
.pk-card--featured {
	border-color: var(--pk-brand-300);
	background: linear-gradient(160deg, var(--pk-brand-50), var(--pk-white) 60%);
	box-shadow: var(--pk-shadow-sm);
}

/* The help search box on the dark support and resources heroes. */
.pk-page-hero--dark .pk-hsearch { margin-top: var(--pk-space-6); }

/* ==========================================================================
   7. Search page
   ========================================================================== */

.pk-hhero--search .pk-hsearch { margin-top: var(--pk-space-5); }

.pk-hsearch-page {
	max-width: 52rem;
	padding-block: var(--pk-space-8) var(--pk-section-y);
}

.pk-hfilters {
	display: flex;
	flex-wrap: wrap;
	gap: var(--pk-space-2);
	margin-bottom: var(--pk-space-6);
}

.pk-hresults {
	display: grid;
	gap: var(--pk-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
}

.pk-hresults li { margin: 0; }

.pk-hresults a {
	display: flex;
	flex-direction: column;
	gap: 0.25rem;
	padding: var(--pk-space-4) var(--pk-space-5);
	border: 1px solid var(--pk-border);
	border-radius: var(--pk-radius);
	background: var(--pk-white);
	text-decoration: none;
	transition: border-color var(--pk-dur) var(--pk-ease), box-shadow var(--pk-dur) var(--pk-ease);
}

.pk-hresults a:hover { border-color: var(--pk-brand-300); box-shadow: var(--pk-shadow-sm); }
.pk-hresults strong { color: var(--pk-link); font-size: 1.0625rem; }
.pk-hresults__where { color: var(--pk-muted); font-size: var(--pk-text-xs); font-weight: 700; }
.pk-hresults__desc { color: var(--pk-body); font-size: 0.9375rem; line-height: 1.55; }

.pk-hsearch-page__none h2 { font-size: var(--pk-text-xl); }

/* ==========================================================================
   8. Responsive, print, motion
   ========================================================================== */

@media (max-width: 1180px) {
	.pk-hlayout--article { grid-template-columns: var(--pk-h-nav) minmax(0, 1fr); }
	.pk-hlayout__toc { display: none; }
	.pk-htoc-mobile { display: block; }
	.pk-hprocess, .pk-hmods { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
	.pk-hlayout,
	.pk-hlayout--article {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--pk-space-5);
		padding-top: var(--pk-space-5);
	}

	.pk-hlayout__nav { position: static; max-height: none; overflow: visible; }

	.pk-hnav__mobile {
		border: 1px solid var(--pk-border);
		border-radius: var(--pk-radius);
		background: var(--pk-white);
	}

	.pk-hnav__mobile > summary {
		display: flex;
		align-items: center;
		gap: 0.625rem;
		padding: 0.75rem 1rem;
		color: var(--pk-ink-900);
		font-weight: 700;
		list-style: none;
		cursor: pointer;
	}

	.pk-hnav__mobile > summary::-webkit-details-marker { display: none; }
	.pk-hnav__mobile > summary .pk-icon { width: 1.125rem; height: 1.125rem; color: var(--pk-brand-600); }
	.pk-hnav__mobile[open] > summary { border-bottom: 1px solid var(--pk-border); }
	.pk-hnav__mobile > .pk-hnav__inner { padding: var(--pk-space-3); max-height: 70vh; overflow-y: auto; }

	.pk-hhero__grid,
	.pk-hcore__head { grid-template-columns: minmax(0, 1fr); }
	.pk-hstats { display: flex; flex-wrap: wrap; gap: var(--pk-space-2) var(--pk-space-5); min-width: 0; padding: var(--pk-space-3) var(--pk-space-4); }
	.pk-hcore__cta { align-items: flex-start; }
	.pk-hlink { display: none; }
}

@media (max-width: 640px) {
	.pk-hprocess, .pk-hmods { grid-template-columns: minmax(0, 1fr); }
	.pk-hsearch input[type="search"] { height: 3.125rem; padding-right: 1rem; font-size: var(--pk-text-base); }
	.pk-hsearch__icon { top: 1.5625rem; }
	.pk-hsearch__key { display: none; }
	.pk-hpopular { justify-content: flex-start; }
	.pk-hhero__center { text-align: left; }
	.pk-hhero--home .pk-hhero__lead { margin-inline: 0; }
	.pk-kb { font-size: 1rem; }
	.pk-kb h2 { font-size: 1.375rem; margin-top: var(--pk-space-10); }
	.pk-kb .step-meta > div { grid-template-columns: minmax(0, 1fr); gap: 0; }
	.pk-kb .timeline > li { grid-template-columns: minmax(0, 1fr); gap: var(--pk-space-1); }
	.pk-kb .timeline time { text-align: left; }
	.pk-kb .timeline > li::before { display: none; }
	.pk-kb .tl-b { padding-left: 0; }
	.pk-kb .tl-b::before { display: none; }
	.pk-kb a.kb-term::after { display: none; }
	.pk-hlist { grid-template-columns: minmax(0, 1fr); }
	.pk-doc-pager { grid-template-columns: minmax(0, 1fr); }
	.pk-doc-pager__link--next { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
	.pk-kb .card, .pk-hcard, .pk-kb a.kb-area-card { transition: none; transform: none !important; }
}

@media print {
	.pk-header, .pk-announce, .pk-footer, .pk-hlayout__nav, .pk-hlayout__toc, .pk-htoc-mobile, .pk-hsearch, .pk-hsupport, .pk-doc-pager, .pk-hrelated, .pk-hmore { display: none !important; }
	.pk-hlayout, .pk-hlayout--article { display: block; padding: 0; }
	.pk-hhero { padding: 0 0 1rem; background: none; border: 0; }
	.pk-kb a { color: inherit; text-decoration: none; }
	.pk-kb a.kb-term::after { display: none; }
	.pk-kb .step, .pk-kb .callout, .pk-kb .table-wrap { break-inside: avoid; }
}