.fd {
	--fd-ink: #1f2933;
	--fd-muted: #5f6c7b;
	--fd-line: #dde3ea;
	--fd-bg: #f7f9fb;
	--fd-accent: #2f4a63;
	--fd-accent-ink: #fff;
	max-width: 1000px;
	margin: 0 auto;
	padding: 24px 16px 48px;
	color: var(--fd-ink);
	line-height: 1.55;
}

.fd h1 { font-size: clamp(1.6rem, 4vw, 2.2rem); line-height: 1.2; margin: 0 0 6px; }
.fd h2 { font-size: 1.25rem; margin: 0 0 12px; }
.fd .fd-h2 { margin: 28px 0 12px; }
.fd-sub { color: var(--fd-muted); margin: 0 0 16px; }

.fd-crumbs ol { display: flex; flex-wrap: wrap; gap: 4px 0; list-style: none; margin: 0 0 16px; padding: 0; font-size: .875rem; color: var(--fd-muted); }
.fd-crumbs li:not(:last-child)::after { content: "›"; margin: 0 8px; }
.fd-crumbs a { color: inherit; }

.fd-actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 0 0 20px; }
.fd-btn {
	display: inline-block; padding: 10px 16px; border: 1px solid var(--fd-accent); border-radius: 8px;
	color: var(--fd-accent); background: transparent; text-decoration: none; font-weight: 600; cursor: pointer; font-size: 1rem;
}
.fd-btn--primary { background: var(--fd-accent); color: var(--fd-accent-ink); }
.fd-btn:hover, .fd-btn:focus-visible { opacity: .88; }

.fd-box { background: var(--fd-bg); border: 1px solid var(--fd-line); border-radius: 12px; padding: 18px; margin: 0 0 18px; }
.fd-dl { display: grid; grid-template-columns: max-content 1fr; gap: 8px 18px; margin: 0; }
.fd-dl dt { font-weight: 600; color: var(--fd-muted); }
.fd-dl dd { margin: 0; overflow-wrap: anywhere; }
@media (max-width: 520px) { .fd-dl { grid-template-columns: 1fr; gap: 2px; } .fd-dl dd { margin-bottom: 10px; } }

.fd-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.fd-card { border: 1px solid var(--fd-line); border-radius: 12px; padding: 14px 16px; background: #fff; }
.fd-card__title { font-size: 1.05rem; margin: 0 0 4px; line-height: 1.3; }
.fd-card__title a { color: var(--fd-accent); text-decoration: none; }
.fd-card__title a:hover { text-decoration: underline; }
.fd-card p { margin: 4px 0; font-size: .92rem; }
.fd-card__tag { color: var(--fd-muted); }

.fd-grid-links { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px 18px; }
.fd-grid-links a { color: var(--fd-accent); }
.fd-grid-links span { color: var(--fd-muted); font-size: .85rem; }

.fd-search { display: flex; gap: 8px; margin: 0 0 20px; max-width: 520px; }
.fd-search input[type="search"] { flex: 1; padding: 10px 12px; border: 1px solid var(--fd-line); border-radius: 8px; font-size: 1rem; }
.fd-search button { padding: 10px 16px; border: 0; border-radius: 8px; background: var(--fd-accent); color: var(--fd-accent-ink); font-weight: 600; cursor: pointer; }

.fd-form label { display: block; font-weight: 600; }
.fd-form input, .fd-form textarea { display: block; width: 100%; max-width: 480px; margin-top: 4px; padding: 9px 11px; border: 1px solid var(--fd-line); border-radius: 8px; font: inherit; }
.fd-hp { position: absolute; left: -9999px; height: 0; overflow: hidden; }

.fd-notice { padding: 10px 14px; border-radius: 8px; background: #eef2f6; }
.fd-notice--ok { background: #e6f4ea; }
.fd-notice--err { background: #fde8e8; }

.fd-pagination { margin: 22px 0; display: flex; flex-wrap: wrap; gap: 6px; }
.fd-pagination .page-numbers { padding: 6px 12px; border: 1px solid var(--fd-line); border-radius: 6px; text-decoration: none; color: var(--fd-accent); }
.fd-pagination .current { background: var(--fd-accent); color: var(--fd-accent-ink); }

.fd-source { color: var(--fd-muted); font-size: .85rem; margin-top: 26px; }

@media (prefers-color-scheme: dark) {
	.fd { --fd-ink: #e6ebf0; --fd-muted: #9aa8b6; --fd-line: #34414e; --fd-bg: #1b2430; --fd-accent: #8fb4d9; --fd-accent-ink: #10202f; }
	.fd-card { background: #151d27; }
}