/* Meisjesnamen Tools - shared styles (tokens + name cards + heart button). Mobile first, scoped to .mnz */
.mnz {
	--mnz-pink: #b0285e;
	--mnz-pink-soft: #fde7ef;
	--mnz-teal: #2a8c9a;
	--mnz-teal-soft: #e2f4f6;
	--mnz-text: #2b2229;
	--mnz-muted: #6b5d67;
	--mnz-line: #f0d6df;
	color: var(--mnz-text);
	margin: 0 0 2em;
	font-size: 16px;
	line-height: 1.5;
}
.mnz *, .mnz *::before, .mnz *::after { box-sizing: border-box; }
/* Theme styles for content lists and links must not leak into the UI. */
.mnz li.mnz-card { list-style: none; }
.mnz .mnz-head a, .mnz .mnz-name { text-underline-offset: 3px; }
.mnz-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

.mnz p.mnz-summary { margin: 0 0 10px; color: var(--mnz-muted); font-weight: 600; min-height: 1.5em; }
.mnz.is-loading ul.mnz-results { opacity: .5; transition: opacity .15s; }

.mnz ul.mnz-results { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr; gap: 10px; }
.mnz li.mnz-card {
	background: #fff; border-radius: 12px; padding: 14px 16px; margin: 0;
	box-shadow: 0 1px 6px rgba(43, 34, 41, .06); display: flex; flex-direction: column; gap: 4px;
}
.mnz-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.mnz .mnz-name { font-size: 22px; font-weight: 700; color: var(--mnz-text); text-decoration: none; line-height: 1.2; }
.mnz a.mnz-name { color: var(--mnz-pink); }
.mnz a.mnz-name:hover { text-decoration: underline; }
.mnz-pill { font-size: 12px; font-weight: 700; padding: 3px 8px; border-radius: 999px; }
.mnz-pill-top10 { background: var(--mnz-pink); color: #fff; }
.mnz-pill-top100 { background: var(--mnz-pink-soft); color: var(--mnz-pink); }
.mnz p.mnz-meta { margin: 0; color: var(--mnz-muted); font-size: 14px; }
.mnz-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.mnz-trend { white-space: nowrap; font-size: 13px; font-weight: 700; padding: 3px 8px; border-radius: 6px; background: #f3eff2; color: var(--mnz-muted); }
.mnz-trend-sterk_stijgend, .mnz-trend-stijgend { background: var(--mnz-teal-soft); color: #1d6b76; }
.mnz-trend-dalend, .mnz-trend-sterk_dalend { background: #fbeee9; color: #9a4a2c; }
.mnz-spark { width: 90px; height: 26px; flex: 0 0 auto; }
.mnz-spark path { fill: none; stroke: var(--mnz-teal); stroke-width: 2; stroke-linejoin: round; stroke-linecap: round; }
.mnz .mnz-read { font-size: 14px; color: var(--mnz-pink); text-decoration: underline; align-self: flex-start; }

.mnz-btn, .mnz-more {
	font-family: inherit; cursor: pointer; border-radius: 10px; font-weight: 600; font-size: 15px;
}
.mnz-more {
	display: block; margin: 16px auto 0; padding: 12px 22px; border: 0; background: var(--mnz-pink); color: #fff;
}
.mnz-more[hidden] { display: none; }

@media (min-width: 600px) {
	.mnz ul.mnz-results { grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); }
}