:root {
	--hap-ink: #17221d;
	--hap-muted: #5f6f66;
	--hap-green: #2d6a4f;
	--hap-green-dark: #1f4f3c;
	--hap-mint: #e8f3ec;
	--hap-cream: #f8f5ed;
	--hap-line: #dbe4dd;
}

body.hap-site {
	background: var(--hap-cream);
	color: var(--hap-ink);
}

.hap-site .wp-site-blocks {
	padding: 0;
}

.hap-site .wp-block-post-content {
	max-width: 1180px;
	margin: 0 auto;
	padding: 42px 24px 90px;
}

/* Block themes constrain direct content children to their narrow reading width.
 * The wiki home uses card grids, so let those children use the full content shell. */
.hap-site .wp-block-post-content > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	width: 100%;
	max-width: 1180px;
}

.hap-site.home .wp-block-post-title {
	display: none;
}

.hap-shell {
	width: min(1180px, calc(100% - 48px));
	margin: 0 auto;
}

.hap-site-header {
	position: sticky;
	top: 0;
	z-index: 30;
	background: rgba(248, 245, 237, .94);
	border-bottom: 1px solid var(--hap-line);
	backdrop-filter: blur(14px);
}

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

.hap-site-header .hap-shell {
	display: grid;
	grid-template-columns: auto 1fr auto;
	align-items: center;
	gap: 26px;
	min-height: 76px;
}

.hap-header-panel {
	display: contents;
}

.hap-menu-toggle {
	display: none;
}

.hap-logo {
	color: var(--hap-ink);
	font-size: 25px;
	font-weight: 850;
	letter-spacing: -.04em;
	text-decoration: none;
}

.hap-logo span {
	color: var(--hap-green);
}

.hap-site-header nav {
	display: flex;
	justify-content: center;
	gap: 24px;
}

.hap-site-header nav a {
	color: var(--hap-ink);
	font-size: 14px;
	font-weight: 700;
	text-decoration: none;
}

.hap-header-search {
	display: flex;
	gap: 6px;
}

.hap-header-search input {
	width: 120px;
	padding: 9px 12px;
	border: 1px solid var(--hap-line);
	border-radius: 999px;
	background: #fff;
}

.hap-header-search button {
	padding: 9px 13px;
	border: 0;
	border-radius: 999px;
	background: var(--hap-green);
	color: #fff;
	font-weight: 700;
}

.hap-home-hero,
.hap-profile-hero,
.hap-page-intro {
	position: relative;
	overflow: hidden;
	margin: 0 0 72px;
	padding: clamp(48px, 8vw, 100px);
	border-radius: 34px;
	background: linear-gradient(135deg, #dceee2 0%, #f3edda 62%, #f7d7bc 100%);
}

.hap-home-hero::after,
.hap-profile-hero::after {
	content: "";
	position: absolute;
	right: -80px;
	top: -90px;
	width: 330px;
	height: 330px;
	border: 74px solid rgba(255,255,255,.5);
	border-radius: 50%;
}

.hap-home-hero h1,
.hap-profile-hero h1,
.hap-page-intro h1 {
	position: relative;
	z-index: 1;
	max-width: 760px;
	margin: 10px 0 22px;
	font-size: clamp(43px, 7vw, 84px);
	line-height: .98;
	letter-spacing: -.06em;
}

.hap-eyebrow {
	position: relative;
	z-index: 1;
	margin: 0;
	color: var(--hap-green-dark);
	font-size: 12px;
	font-weight: 850;
	letter-spacing: .18em;
}

.hap-lead {
	position: relative;
	z-index: 1;
	max-width: 690px;
	color: #3d5247;
	font-size: clamp(18px, 2.2vw, 24px);
	line-height: 1.65;
}

.hap-home-hero .wp-block-buttons {
	position: relative;
	z-index: 1;
	margin-top: 34px;
}

.hap-site .wp-element-button {
	border-radius: 999px;
	background: var(--hap-green);
	font-weight: 750;
}

.hap-site .is-style-outline .wp-element-button {
	color: var(--hap-green-dark);
	background: transparent;
	border-color: var(--hap-green-dark);
}

.hap-site .wp-block-post-content > h2 {
	margin: 70px 0 10px;
	font-size: clamp(30px, 4vw, 48px);
	letter-spacing: -.04em;
}

.hap-pet-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 16px;
	margin: 30px 0 70px;
}

.hap-pet-card {
	display: grid;
	grid-template-columns: 60px 1fr auto;
	align-items: center;
	gap: 16px;
	padding: 24px;
	border: 1px solid var(--hap-line);
	border-radius: 22px;
	background: #fff;
	color: var(--hap-ink);
	box-shadow: 0 12px 36px rgba(24,52,38,.06);
	text-decoration: none;
	transition: transform .2s ease, box-shadow .2s ease;
}

.hap-pet-card:hover {
	transform: translateY(-4px);
	box-shadow: 0 18px 42px rgba(24,52,38,.12);
}

.hap-pet-avatar {
	display: grid;
	place-items: center;
	width: 60px;
	height: 60px;
	border-radius: 20px;
	background: var(--hap-mint);
	color: var(--hap-green-dark);
	font-size: 24px;
	font-weight: 850;
}

.hap-pet-jamong .hap-pet-avatar { background: #ffe1d3; color: #a2462a; }
.hap-pet-avo .hap-pet-avatar { background: #e4edc9; color: #4f6828; }

.hap-pet-card strong,
.hap-pet-card small {
	display: block;
}

.hap-pet-card strong { font-size: 21px; }
.hap-pet-card small { margin-top: 4px; color: var(--hap-muted); }

.hap-species-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 14px;
	margin: 28px 0 58px;
}

.hap-species-grid a {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr) auto;
	align-items: start;
	gap: 12px;
	padding: 22px;
	border: 1px solid var(--hap-line);
	border-radius: 20px;
	background: #fff;
	color: var(--hap-ink);
	text-decoration: none;
	transition: transform .2s ease, border-color .2s ease;
}

.hap-species-grid a:hover {
	transform: translateY(-3px);
	border-color: #9eb8a6;
}

.hap-species-avatar {
	display: block;
	width: 56px;
	height: 56px;
	margin: 0;
	border: 2px solid #e4eee7;
	border-radius: 50%;
	background: var(--hap-mint);
	object-fit: cover;
	object-position: center;
}

.hap-species-grid strong,
.hap-species-grid em,
.hap-species-grid small { display: block; }
.hap-species-grid strong { font-size: 18px; }
.hap-species-grid em { margin-top: 3px; color: var(--hap-green); font-family: Georgia, serif; font-size: 12px; }
.hap-species-grid small { margin-top: 9px; color: var(--hap-muted); line-height: 1.5; }

.hap-species-credits {
	margin: -42px 0 58px;
	color: var(--hap-muted);
	font-size: 12px;
}

.hap-species-credits summary {
	cursor: pointer;
	font-weight: 700;
}

.hap-species-credits ul {
	margin: 10px 0 0;
	padding-left: 20px;
}

.hap-species-credits a { color: var(--hap-green-dark); }

.hap-category-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
	margin: 28px 0 32px;
}

.hap-category-grid a {
	display: block;
	padding: 24px 26px;
	border: 1px solid var(--hap-line);
	border-radius: 18px;
	background: rgba(255,255,255,.72);
	color: var(--hap-ink);
	text-decoration: none;
}

.hap-category-grid strong,
.hap-category-grid span {
	display: block;
}

.hap-category-grid strong { font-size: 18px; }
.hap-category-grid span { margin-top: 7px; color: var(--hap-muted); line-height: 1.55; }

.hap-search {
	margin: 28px 0 68px;
}

.hap-search-primary .wp-block-search__inside-wrapper {
	padding: 8px;
	border: 1px solid #abc0b1;
	border-radius: 18px;
	background: #fff;
	box-shadow: 0 16px 45px rgba(24,52,38,.08);
}

.hap-observation-lab {
	margin-top: 78px;
	padding: 34px;
	border: 1px solid var(--hap-line);
	border-radius: 26px;
	background: rgba(232,243,236,.62);
}

.hap-observation-lab h2 { margin-top: 0; }
.hap-observation-lab .hap-pet-grid { margin-bottom: 0; }

.hap-post-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
	margin-top: 28px;
}

.hap-post-grid article {
	overflow: hidden;
	border: 1px solid var(--hap-line);
	border-radius: 20px;
	background: #fff;
}

.hap-post-grid article a {
	display: block;
	color: var(--hap-ink);
	text-decoration: none;
}

.hap-post-grid img,
.hap-post-placeholder {
	display: grid;
	place-items: center;
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	background: linear-gradient(135deg, #d8eadf, #f4dfc5);
	color: var(--hap-green-dark);
	font-size: 13px;
	font-weight: 850;
	letter-spacing: .15em;
}

.hap-post-grid small,
.hap-post-grid h3,
.hap-post-grid p {
	display: block;
	margin-left: 20px;
	margin-right: 20px;
}

.hap-post-grid small { margin-top: 18px; color: var(--hap-green); font-weight: 750; }
.hap-post-grid h3 { margin-top: 7px; margin-bottom: 8px; font-size: 20px; line-height: 1.35; }
.hap-post-grid p { margin-top: 0; margin-bottom: 22px; color: var(--hap-muted); line-height: 1.55; }

.hap-empty,
.hap-profile-facts {
	padding: 32px;
	border: 1px dashed #9db4a7;
	border-radius: 20px;
	background: rgba(255,255,255,.55);
}

.hap-empty strong,
.hap-empty span { display: block; }
.hap-empty span { margin-top: 6px; color: var(--hap-muted); }

.hap-profile-facts {
	margin-bottom: 48px;
}

.hap-profile-facts h2 { margin-top: 0; }

.hap-profile-layout {
	display: grid;
	grid-template-columns: minmax(280px, .85fr) 1.15fr;
	gap: 42px;
	align-items: center;
	margin-bottom: 52px;
}

.hap-profile-photo {
	display: block;
	min-height: 420px;
	margin: 0;
	overflow: hidden;
	border-radius: 30px;
	background: linear-gradient(145deg, var(--hap-mint), #efd8b7);
	aspect-ratio: 4 / 5;
}

.hap-profile-image,
.hap-profile-photo-placeholder {
	display: grid;
	place-items: center;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hap-profile-photo-placeholder {
	color: var(--hap-green-dark);
	font-family: Georgia, serif;
	font-size: 84px;
}

.hap-profile-copy h1 {
	margin: 6px 0 16px;
	font-family: Georgia, serif;
	font-size: clamp(48px, 7vw, 86px);
	line-height: .95;
}

.hap-fact-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin: 28px 0 0;
}

.hap-fact-grid div {
	padding: 15px 17px;
	border: 1px solid var(--hap-line);
	border-radius: 14px;
	background: rgba(255,255,255,.68);
}

.hap-fact-grid dt {
	color: var(--hap-muted);
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .06em;
}

.hap-fact-grid dd {
	margin: 5px 0 0;
	color: var(--hap-ink);
	font-size: 15px;
	font-weight: 750;
}

.hap-pet-thumb {
	width: 60px;
	height: 60px;
	flex: 0 0 60px;
	object-fit: cover;
	border-radius: 20px;
}

.hap-note {
	margin-top: 46px;
	padding: 18px 20px;
	border-left: 4px solid var(--hap-green);
	background: var(--hap-mint);
	color: #42554a;
}

.hap-site-footer {
	margin-top: 70px;
	padding: 48px 0;
	border-top: 1px solid var(--hap-line);
	background: #e8ece5;
}

.hap-site-footer .hap-shell {
	display: flex;
	align-items: end;
	justify-content: space-between;
	gap: 36px;
}

.hap-site-footer p {
	max-width: 520px;
	margin: 10px 0 0;
	color: var(--hap-muted);
	font-size: 13px;
	line-height: 1.6;
}

/* Long-form wiki articles: keep every element inside one readable column. */
.hap-site.single-post .wp-block-post-content,
.hap-site.hap-knowledge-document .wp-block-post-content {
	box-sizing: border-box;
	width: min(calc(100% - 48px), 880px);
	max-width: 880px;
	padding: 38px 0 90px;
	overflow: clip;
}

.hap-site.single-post .wp-block-post-content > :where(:not(.alignleft):not(.alignright):not(.alignfull)),
.hap-site.hap-knowledge-document .wp-block-post-content > :where(:not(.alignleft):not(.alignright):not(.alignfull)) {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
}

.hap-site.single-post .wp-block-post-title,
.hap-site.single-post .wp-block-post-date,
.hap-site.hap-knowledge-document .wp-block-post-title,
.hap-site.hap-knowledge-document .wp-block-post-date {
	box-sizing: border-box;
	width: min(calc(100% - 48px), 880px);
	max-width: 880px;
	margin-right: auto;
	margin-left: auto;
}

.hap-wiki-article {
	font-size: 16px;
	line-height: 1.82;
	word-break: keep-all;
	overflow-wrap: anywhere;
}

.hap-wiki-article > p.hap-wiki-deck {
	margin: 0 0 24px;
	padding: 16px 18px;
	border: 1px solid var(--hap-line);
	border-left: 5px solid var(--hap-green);
	background: #f2f4f2;
	color: #314039;
}

.hap-wiki-article h2,
.hap-wiki-article h3 {
	position: relative;
	box-sizing: border-box;
	max-width: 100%;
	scroll-margin-top: 110px;
	word-break: keep-all;
}

.hap-wiki-article h2 {
	margin: 48px 0 18px;
	padding: 0 0 9px;
	border-bottom: 2px solid #bbc7bf;
	font-size: clamp(24px, 3.2vw, 31px);
	line-height: 1.35;
}

.hap-wiki-article h3 {
	margin: 34px 0 13px;
	padding-left: 11px;
	border-left: 4px solid #94aa9d;
	font-size: clamp(19px, 2.4vw, 23px);
	line-height: 1.4;
}

.hap-wiki-article h2[data-hap-section]::before,
.hap-wiki-article h3[data-hap-section]::before {
	content: attr(data-hap-section) ". ";
	color: var(--hap-green);
	font-variant-numeric: tabular-nums;
}

.hap-wiki-toc {
	box-sizing: border-box;
	width: 100%;
	margin: 24px 0 38px;
	border: 1px solid #cbd5ce;
	background: #f6f7f6;
}

.hap-wiki-toc summary {
	cursor: pointer;
	padding: 12px 15px;
	background: #e8ece9;
	font-size: 15px;
	font-weight: 800;
	list-style-position: inside;
}

.hap-wiki-toc ol {
	margin: 0;
	padding: 12px 18px 16px;
	list-style: none;
	columns: 2;
	column-gap: 28px;
}

.hap-wiki-toc li {
	break-inside: avoid;
	margin: 3px 0;
	font-size: 14px;
	line-height: 1.55;
}

.hap-wiki-toc li.hap-toc-h3 {
	padding-left: 17px;
	font-size: 13px;
}

.hap-wiki-toc a {
	color: #254e3d;
	text-decoration: none;
}

.hap-wiki-toc a:hover {
	text-decoration: underline;
}

.hap-wiki-article .hap-table-scroll {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	margin: 20px 0 28px;
	overflow-x: auto;
	border: 1px solid #c7d0ca;
	background: #fff;
	-webkit-overflow-scrolling: touch;
}

.hap-wiki-article table {
	width: 100%;
	min-width: 540px;
	margin: 0;
	border-collapse: collapse;
	font-size: 14px;
	line-height: 1.55;
}

.hap-wiki-article th,
.hap-wiki-article td {
	padding: 10px 12px;
	border: 1px solid #d7dfda;
	vertical-align: top;
	text-align: left;
}

.hap-wiki-article th {
	background: #e8eee9;
	color: #263d32;
	font-weight: 800;
}

.hap-wiki-article .hap-wiki-infobox th:first-child,
.hap-wiki-article .hap-wiki-infobox td:first-child {
	width: 126px;
	background: #edf2ee;
	font-weight: 750;
}

/* Media must never become wider than the prose column. */
.hap-wiki-article img,
.hap-wiki-article figure,
.hap-wiki-article figcaption,
.hap-wiki-article .wp-block-gallery {
	box-sizing: border-box;
	max-width: 100% !important;
}

.hap-wiki-article img {
	height: auto;
	overflow: hidden;
}

.hap-wiki-article > figure.wp-block-image {
	width: min(100%, 480px) !important;
	margin: 24px auto 30px !important;
	overflow: hidden;
	text-align: center;
}

.hap-wiki-article > figure.wp-block-image img {
	display: block;
	width: auto !important;
	max-width: 100% !important;
	max-height: 320px;
	margin: 0 auto;
	object-fit: contain;
	border-radius: 10px;
}

.hap-wiki-article > figure.wp-block-gallery {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	width: 100% !important;
	margin: 24px 0 32px !important;
	gap: 10px !important;
	overflow: hidden;
}

.hap-wiki-article > figure.wp-block-gallery > figure.wp-block-image {
	display: block !important;
	width: 100% !important;
	min-width: 0 !important;
	margin: 0 !important;
	overflow: hidden;
	background: #eef1ef;
}

.hap-wiki-article > figure.wp-block-gallery > figure.wp-block-image img {
	display: block;
	width: 100% !important;
	height: 210px !important;
	max-width: 100% !important;
	object-fit: cover;
}

.hap-wiki-article figcaption {
	width: 100%;
	margin: 0 !important;
	padding: 8px 9px 9px;
	background: #f1f3f1;
	color: #5b665f;
	font-size: 11px;
	line-height: 1.45;
	text-align: left;
	overflow-wrap: anywhere;
}

.hap-wiki-article blockquote {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	margin: 24px 0;
	padding: 16px 18px;
	border-left: 5px solid #73927f;
	background: #edf2ee;
}

.hap-wiki-article .hap-note {
	margin: 18px 0 28px;
	padding: 15px 17px;
}

.hap-wiki-article .hap-related-guide {
	margin: 34px 0;
	padding: 18px 20px;
	border: 1px solid #b9c9bf;
	border-radius: 12px;
	background: #eef4f0;
}

.hap-wiki-article .hap-related-guide a {
	color: #214b39;
	text-decoration: none;
}

.hap-wiki-article .hap-source-list {
	padding-left: 22px;
	font-size: 14px;
}

.hap-wiki-article .hap-source-list li {
	margin: 7px 0;
}

.hap-wiki-article hr {
	margin: 45px 0;
	border: 0;
	border-top: 1px solid #cbd4ce;
}

@media (max-width: 900px) {
	.hap-site-header .hap-shell { grid-template-columns: 1fr auto; }
	.hap-site-header nav { grid-column: 1 / -1; grid-row: 2; justify-content: flex-start; overflow-x: auto; padding-bottom: 15px; }
	.hap-header-search { grid-column: 2; grid-row: 1; }
	.hap-pet-grid,
	.hap-post-grid { grid-template-columns: 1fr; }
	.hap-species-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.hap-category-grid { grid-template-columns: 1fr; }
	.hap-profile-layout { grid-template-columns: 1fr; }
}

@media (max-width: 600px) {
	.admin-bar .hap-site-header { top: 46px; }
	.hap-shell { width: min(100% - 28px, 1180px); }
	.hap-site .wp-block-post-content { padding: 24px 14px 70px; }
	.hap-site.single-post .wp-block-post-content,
	.hap-site.hap-knowledge-document .wp-block-post-content {
		width: calc(100% - 24px);
		max-width: calc(100% - 24px);
		padding: 22px 0 66px;
		overflow: hidden;
	}
	.hap-site.single-post .wp-block-post-title,
	.hap-site.single-post .wp-block-post-date,
	.hap-site.hap-knowledge-document .wp-block-post-title,
	.hap-site.hap-knowledge-document .wp-block-post-date {
		width: calc(100% - 24px);
		max-width: calc(100% - 24px);
	}
	.hap-home-hero,
	.hap-profile-hero,
	.hap-page-intro { padding: 38px 26px; border-radius: 24px; }
	.hap-home-hero h1,
	.hap-profile-hero h1,
	.hap-page-intro h1 { font-size: 43px; }
	.hap-header-search input { display: none; }
	.hap-site-footer .hap-shell { display: block; }
	.hap-species-grid { grid-template-columns: 1fr; }
	.hap-species-grid a { grid-template-columns: 48px minmax(0, 1fr) auto; padding: 18px; }
	.hap-species-avatar { width: 48px; height: 48px; }
	.hap-observation-lab { padding: 24px; }
	.hap-profile-photo { min-height: 0; }
	.hap-fact-grid { grid-template-columns: 1fr; }

	.hap-wiki-article { font-size: 15.5px; line-height: 1.78; }
	.hap-wiki-article > p.hap-wiki-deck { padding: 14px 15px; }
	.hap-wiki-article h2 { margin-top: 40px; font-size: 24px; }
	.hap-wiki-article h3 { margin-top: 29px; font-size: 19px; }
	.hap-wiki-toc ol { columns: 1; padding: 10px 14px 14px; }
	.hap-wiki-toc li { font-size: 13px; }
	.hap-wiki-article table { min-width: 500px; font-size: 13px; }
	.hap-wiki-article th,
	.hap-wiki-article td { padding: 8px 9px; }
	.hap-wiki-article > figure.wp-block-image {
		width: 100% !important;
		max-width: 100% !important;
		margin: 18px auto 24px !important;
	}
	.hap-wiki-article > figure.wp-block-image img {
		width: auto !important;
		max-width: 100% !important;
		max-height: min(32vh, 190px);
	}
	.hap-wiki-article > figure.wp-block-gallery {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 6px !important;
	}
	.hap-wiki-article > figure.wp-block-gallery > figure.wp-block-image img {
		height: clamp(108px, 29vw, 150px) !important;
	}
	.hap-wiki-article figcaption {
		padding: 6px 7px 7px;
		font-size: 10px;
		line-height: 1.4;
	}
}

/* 2.0 information architecture and reader tools */
.hap-breadcrumbs {
	margin: 0 0 18px;
	font-size: 13px;
}

.hap-breadcrumbs ol {
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.hap-breadcrumbs li:not(:last-child)::after {
	content: "›";
	margin-left: 7px;
	color: #849087;
}

.hap-breadcrumbs a { color: var(--hap-green-dark); }
.hap-breadcrumbs [aria-current="page"] { color: var(--hap-muted); }

.hap-document-tabs {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 8px;
	margin: 0 0 12px;
	padding: 7px;
	border: 1px solid var(--hap-line);
	border-radius: 14px;
	background: #fff;
}

.hap-document-tabs a,
.hap-document-tabs span {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 8px 12px;
	border-radius: 9px;
	color: var(--hap-ink);
	font-weight: 750;
	text-align: center;
	text-decoration: none;
}

.hap-document-tabs a:hover { background: var(--hap-mint); }
.hap-document-tabs .is-current { background: var(--hap-green); color: #fff; }
.hap-document-tabs .is-coming { color: #7c8881; background: #f3f5f3; }
.hap-document-tabs small { margin-left: 5px; font-size: 10px; font-weight: 600; }

.hap-taxonomy-chips {
	display: flex;
	flex-wrap: wrap;
	gap: 7px;
	margin: 12px 0 25px;
}

.hap-taxonomy-chips a {
	padding: 6px 10px;
	border: 1px solid #c9d8cf;
	border-radius: 999px;
	background: #f5faf7;
	color: #315c48;
	font-size: 12px;
	text-decoration: none;
}

.hap-review-line {
	margin: -15px 0 26px;
	color: #748078;
	font-size: 11px;
	text-align: right;
}

.hap-species-filter,
.hap-compare-controls {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
	align-items: end;
	gap: 10px;
	margin: 20px 0 7px;
	padding: 14px;
	border: 1px solid var(--hap-line);
	border-radius: 15px;
	background: #fff;
}

.hap-species-filter label,
.hap-compare-controls label {
	display: grid;
	gap: 6px;
	color: #44534b;
	font-size: 12px;
	font-weight: 750;
}

.hap-species-filter select,
.hap-compare-controls select {
	width: 100%;
	min-height: 44px;
	padding: 8px 35px 8px 10px;
	border: 1px solid #bfcac3;
	border-radius: 8px;
	background: #fff;
	color: var(--hap-ink);
}

.hap-filter-reset,
.hap-print-action button,
.hap-suggestion button {
	min-height: 44px;
	padding: 9px 16px;
	border: 0;
	border-radius: 9px;
	background: var(--hap-green);
	color: #fff;
	font-weight: 800;
	cursor: pointer;
}

.hap-filter-count {
	min-height: 20px;
	margin: 0 0 10px;
	color: var(--hap-muted);
	font-size: 12px;
}

.hap-species-grid [hidden] { display: none !important; }
.hap-species-fallback { display: grid; place-items: center; color: var(--hap-green); font-size: 10px; font-weight: 850; }
.hap-post-thumb { display: block; width: 100%; height: 180px; object-fit: cover; }

.hap-compare { margin: 28px 0 55px; }
.hap-compare-controls { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.hap-compare-note { padding: 12px 14px; border-left: 4px solid var(--hap-green); background: var(--hap-mint); font-size: 13px; }
.hap-compare-table { width: 100%; min-width: 720px; border-collapse: collapse; background: #fff; }
.hap-compare-table th,
.hap-compare-table td { padding: 12px; border: 1px solid var(--hap-line); text-align: left; vertical-align: top; }
.hap-compare-table thead th { background: #dfece4; }
.hap-compare-table tbody th { width: 120px; background: #f1f5f2; }

.hap-glossary-index {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
}

.hap-glossary-index article {
	padding: 18px 20px;
	border: 1px solid var(--hap-line);
	border-radius: 13px;
	background: #fff;
}

.hap-glossary-index h2 { margin: 0 0 7px !important; font-size: 19px !important; }
.hap-glossary-index p { margin: 0; color: var(--hap-muted); font-size: 14px; line-height: 1.65; }
.hap-glossary-index a { color: var(--hap-green-dark); }

.hap-term {
	position: relative;
	border-bottom: 1px dotted var(--hap-green);
	color: inherit;
	text-decoration: none;
}

.hap-term::after { content: "?"; margin-left: 2px; color: var(--hap-green); font-size: 9px; vertical-align: super; }
.hap-term-popup {
	position: absolute;
	left: 50%;
	bottom: calc(100% + 9px);
	z-index: 20;
	display: none;
	width: min(290px, 78vw);
	padding: 10px 12px;
	border-radius: 9px;
	background: #17221d;
	box-shadow: 0 8px 28px rgba(0, 0, 0, .22);
	color: #fff;
	font-size: 12px;
	font-style: normal;
	font-weight: 500;
	line-height: 1.55;
	transform: translateX(-50%);
}

.hap-term:hover .hap-term-popup,
.hap-term:focus .hap-term-popup { display: block; }

.hap-related-species {
	margin: 48px 0 28px;
	padding-top: 30px;
	border-top: 1px solid var(--hap-line);
}

.hap-related-species > div {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 10px;
}

.hap-related-species a {
	display: grid;
	grid-template-columns: 56px minmax(0, 1fr);
	align-items: center;
	gap: 12px;
	padding: 13px;
	border: 1px solid var(--hap-line);
	border-radius: 12px;
	background: #fff;
	color: var(--hap-ink);
	text-decoration: none;
}

.hap-related-species img { width: 56px !important; height: 56px !important; border-radius: 50%; object-fit: cover; }
.hap-related-species strong,
.hap-related-species small { display: block; }
.hap-related-species small { margin-top: 4px; color: var(--hap-muted); font-size: 11px; }

.hap-suggestion {
	margin: 34px 0 0;
	padding: 14px 16px;
	border: 1px solid var(--hap-line);
	border-radius: 12px;
	background: #fff;
}

.hap-suggestion summary { cursor: pointer; color: var(--hap-green-dark); font-weight: 800; }
.hap-suggestion form { display: grid; gap: 12px; margin-top: 15px; }
.hap-suggestion label { display: grid; gap: 5px; color: #425048; font-size: 13px; font-weight: 700; }
.hap-suggestion input,
.hap-suggestion textarea { box-sizing: border-box; width: 100%; padding: 10px; border: 1px solid #bdc9c1; border-radius: 8px; font: inherit; }
.hap-suggestion button { justify-self: start; }
.hap-honeypot { position: absolute !important; left: -9999px !important; }
.hap-form-success { padding: 10px 12px; border-radius: 8px; background: #e1f2e7; color: #20563d; }
.hap-print-action { text-align: right; }
.hap-review-disclosure { display: block; margin: 0 0 25px; padding: 15px 17px; border: 1px solid #d7cba8; border-radius: 10px; background: #fffaf0; color: #51482f; }
.hap-review-disclosure p { margin: 6px 0 0; font-size: 13px; line-height: 1.65; }

@media (max-width: 760px) {
	.hap-document-tabs { grid-template-columns: 1fr; }
	.hap-document-tabs a,
	.hap-document-tabs span { justify-content: flex-start; min-height: 38px; padding: 7px 10px; }
	.hap-species-filter,
	.hap-compare-controls { grid-template-columns: 1fr; }
	.hap-glossary-index,
	.hap-related-species > div { grid-template-columns: 1fr; }
	.hap-related-species a { min-height: 64px; }
	.hap-post-thumb { height: 150px; }
}


@media (max-width: 760px) {
	.hap-site-header .hap-shell {
		grid-template-columns: minmax(0, 1fr) auto;
		gap: 0 12px;
		min-height: 64px;
	}

	.hap-menu-toggle {
		display: inline-flex;
		grid-column: 2;
		grid-row: 1;
		align-items: center;
		justify-content: center;
		gap: 7px;
		min-width: 72px;
		min-height: 44px;
		padding: 8px 12px;
		border: 1px solid var(--hap-line);
		border-radius: 999px;
		background: #fff;
		color: var(--hap-ink);
		font: inherit;
		font-size: 14px;
		font-weight: 800;
		cursor: pointer;
	}

	.hap-menu-toggle span[aria-hidden="true"] {
		font-size: 18px;
		line-height: 1;
	}

	.hap-header-panel {
		display: grid;
		grid-column: 1 / -1;
		grid-row: 2;
		gap: 12px;
		width: 100%;
		padding: 0 0 14px;
	}

	.hap-site-header.hap-menu-ready:not(.is-menu-open) .hap-header-panel {
		display: none;
	}

	.hap-site-header nav {
		display: grid;
		grid-template-columns: 1fr;
		grid-column: auto;
		grid-row: auto;
		gap: 0;
		overflow: visible;
		padding: 0;
		border-top: 1px solid var(--hap-line);
	}

	.hap-site-header nav a {
		display: flex;
		align-items: center;
		min-height: 44px;
		padding: 0 4px;
		border-bottom: 1px solid var(--hap-line);
	}

	.hap-header-search {
		display: grid;
		grid-template-columns: minmax(0, 1fr) auto;
		grid-column: auto;
		grid-row: auto;
		gap: 8px;
	}

	.hap-header-search input {
		display: block;
		width: 100%;
		min-width: 0;
		min-height: 44px;
		box-sizing: border-box;
	}

	.hap-header-search button {
		min-height: 44px;
	}
}

@media print {
	.hap-site-header,
	.hap-site-footer,
	.hap-breadcrumbs,
	.hap-document-tabs,
	.hap-taxonomy-chips,
	.hap-wiki-toc,
	.hap-related-species,
	.hap-suggestion,
	.hap-print-action,
	.sharedaddy,
	.jp-relatedposts { display: none !important; }
	body.hap-site { background: #fff; color: #000; }
	.hap-site.hap-knowledge-document .wp-block-post-content { width: 100%; max-width: none; padding: 0; }
	.hap-wiki-article { font-size: 11pt; line-height: 1.5; }
	.hap-wiki-article a { color: #000; text-decoration: none; }
	.hap-wiki-article figure { break-inside: avoid; }
	.hap-table-scroll { overflow: visible; }
	.hap-wiki-article table { min-width: 0; font-size: 9pt; }
}


/* 2.1 bilingual species articles */
.hap-english-version{margin:2rem 0;padding:1rem 1.1rem;border:1px solid var(--wp--preset--color--theme-3,#bbb);border-radius:14px}.hap-english-version summary{cursor:pointer}.hap-english-version[open] summary{margin-bottom:1rem}.hap-english-version [lang="en"]{line-height:1.75}