/*
Theme Name: MUFTERIA
Description: MUFTERIA（成人向けまとめメディア）専用のクラシックテーマ。記事本文・広告・年齢確認の表示を担当し、データは MUFTERIA Core プラグインのテンプレート関数から受け取る。
Author: MUFTERIA
Version: 1.0.0
Requires at least: 6.5
Tested up to: 7.1
Requires PHP: 8.1
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: mufteria
Tags: two-columns, right-sidebar, custom-menu, featured-images
*/

/* =========================================================================
 * 1. 変数
 * ====================================================================== */
:root {
	--muf-font: -apple-system, BlinkMacSystemFont, "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic UI", "Yu Gothic", YuGothic, Meiryo, sans-serif;

	--muf-container: 1200px;
	--muf-sidebar: 320px;
	--muf-gap: 24px;
	--muf-gutter: 16px;

	--muf-color-text: #222;
	--muf-color-muted: #6a6f78;
	--muf-color-bg: #eef0f3;
	--muf-color-surface: #fff;
	--muf-color-border: #dadde3;
	--muf-color-title: #1a2540;
	--muf-color-link: #1b4d9b;
	--muf-color-accent: #c2185b;
	--muf-color-accent-dark: #8c1043;
	--muf-color-accent-soft: #fde8f0;
	--muf-color-heading-bg: #2a2e37;
	--muf-color-focus: #1a73e8;
	--muf-color-alert: #d32f2f;

	/* 広告は記事カードと見分けがつくよう、灰色の地・破線枠・PR ラベルで統一する */
	--muf-color-ad-bg: #f3f3ee;
	--muf-color-ad-border: #8f8f86;
	--muf-color-ad-label: #44443d;

	/* 商品ボックス（アフィリエイト）は、本文とも広告枠とも違う淡いピンクの地・実線枠・「PR」バッジにする */
	--muf-color-pr-bg: #fff7fa;
	--muf-color-pr-border: #e9b3c8;
	--muf-color-pr-label: var(--muf-color-accent-dark);

	/* 外部画像（切り抜かずに表示する）の余白部分 */
	--muf-color-letterbox: #e2e5ea;

	--muf-radius: 4px;
}

/* =========================================================================
 * 2. ベース
 * ====================================================================== */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

body {
	margin: 0;
	background: var(--muf-color-bg);
	color: var(--muf-color-text);
	font-family: var(--muf-font);
	font-size: 15px;
	line-height: 1.7;
	line-break: strict;
	overflow-wrap: anywhere;
}

img,
video,
iframe,
embed,
object {
	max-width: 100%;
}

img,
video {
	height: auto;
}

a {
	color: var(--muf-color-link);
	text-decoration: none;
}

a:hover {
	color: var(--muf-color-accent);
	text-decoration: underline;
}

:focus-visible {
	outline: 3px solid var(--muf-color-focus);
	outline-offset: 2px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	line-height: 1.4;
}

p {
	margin: 0 0 1em;
}

button,
input,
select,
textarea {
	font: inherit;
	color: inherit;
}

small {
	font-size: 100%;
}

.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip-path: inset(50%);
	border: 0;
	white-space: nowrap;
	word-wrap: normal !important;
}

.skip-link {
	position: absolute;
	top: -200px;
	left: 8px;
	z-index: 100001;
	padding: 10px 16px;
	background: #fff;
	color: #000;
	font-weight: 700;
	border: 3px solid var(--muf-color-focus);
	border-radius: var(--muf-radius);
}

.skip-link:focus {
	top: 8px;
}

/* =========================================================================
 * 3. レイアウト
 * ====================================================================== */
.l-container {
	width: 100%;
	max-width: var(--muf-container);
	margin-inline: auto;
	padding-inline: var(--muf-gutter);
}

.site-content {
	padding-block: 16px 32px;
}

.l-columns {
	display: grid;
	grid-template-columns: minmax(0, 1fr) var(--muf-sidebar);
	gap: var(--muf-gap);
	align-items: start;
}

.l-main,
.l-sidebar {
	min-width: 0;
}

/* =========================================================================
 * 4. ヘッダー
 * ====================================================================== */
.site-header {
	background: var(--muf-color-surface);
	border-top: 4px solid var(--muf-color-accent);
}

.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding-block: 14px;
}

.site-header__brand {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 0;
}

.site-logo {
	margin: 0;
	font-size: 32px;
	font-weight: 900;
	letter-spacing: 0.06em;
	line-height: 1;
}

.site-logo a {
	color: var(--muf-color-accent);
	text-decoration: none;
}

.site-logo a:hover {
	color: var(--muf-color-accent-dark);
}

.site-badge {
	display: inline-block;
	padding: 2px 6px;
	border: 2px solid var(--muf-color-alert);
	border-radius: 3px;
	color: var(--muf-color-alert);
	font-size: 12px;
	font-weight: 800;
	line-height: 1.2;
	white-space: nowrap;
}

.site-header__tools {
	display: flex;
	align-items: center;
	gap: 12px;
}

.site-header__latest {
	display: inline-flex;
	align-items: center;
	height: 36px;
	padding: 0 16px;
	border: 1px solid var(--muf-color-accent);
	border-radius: 999px;
	color: var(--muf-color-accent);
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
}

.site-header__latest:hover,
.site-header__latest[aria-current="page"] {
	background: var(--muf-color-accent);
	color: #fff;
	text-decoration: none;
}

/* 検索フォーム */
.search-form {
	display: flex;
	width: 100%;
	max-width: 340px;
}

.site-header .search-form {
	width: 300px;
}

.search-form__input {
	flex: 1;
	min-width: 0;
	height: 36px;
	padding: 0 10px;
	background: #f7f8fa;
	border: 1px solid #c3c8d0;
	border-right: 0;
	border-radius: var(--muf-radius) 0 0 var(--muf-radius);
	font-size: 14px;
}

.search-form__submit {
	flex: none;
	height: 36px;
	padding: 0 16px;
	background: var(--muf-color-heading-bg);
	color: #fff;
	border: 0;
	border-radius: 0 var(--muf-radius) var(--muf-radius) 0;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
}

.search-form__submit:hover {
	background: #000;
}

/* カテゴリナビゲーション */
.global-nav {
	background: var(--muf-color-accent);
}

.global-nav__list {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	list-style: none;
}

.global-nav__list li {
	margin: 0;
}

.global-nav__list a {
	display: block;
	padding: 9px 14px;
	color: #fff;
	font-size: 14px;
	font-weight: 700;
	white-space: nowrap;
}

.global-nav__list a:hover,
.global-nav__list .current-menu-item > a,
.global-nav__list .current-cat > a {
	background: var(--muf-color-accent-dark);
	color: #fff;
	text-decoration: none;
}

.global-nav :focus-visible {
	outline-color: #fff;
	outline-offset: -4px;
}

/* =========================================================================
 * 5. 見出し・パンくず・アーカイブ見出し
 * ====================================================================== */
.section-title {
	margin: 0 0 12px;
	padding: 8px 12px;
	background: var(--muf-color-heading-bg);
	border-left: 6px solid var(--muf-color-accent);
	color: #fff;
	font-size: 16px;
	font-weight: 700;
}

.paged-suffix {
	margin-left: 4px;
	font-size: 0.85em;
	font-weight: 400;
}

.breadcrumb {
	margin: 0 0 10px;
	color: var(--muf-color-muted);
	font-size: 12px;
}

.breadcrumb__list {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	list-style: none;
}

.breadcrumb__item + .breadcrumb__item::before {
	content: "\203A";
	margin: 0 6px;
	color: #9aa0aa;
}

.breadcrumb a {
	color: var(--muf-color-muted);
	text-decoration: underline;
}

.archive-header {
	margin: 0 0 12px;
	padding: 12px 16px;
	background: var(--muf-color-surface);
	border: 1px solid var(--muf-color-border);
	border-left: 6px solid var(--muf-color-accent);
}

.archive-header__label {
	margin: 0 0 2px;
	color: var(--muf-color-accent);
	font-size: 12px;
	font-weight: 700;
}

.archive-header__title {
	color: var(--muf-color-title);
	font-size: 22px;
	font-weight: 800;
}

.archive-header__desc,
.archive-header__count {
	margin: 6px 0 0;
	color: #555;
	font-size: 13px;
}

.archive-header__desc p:last-child {
	margin-bottom: 0;
}

.notice-box {
	padding: 20px;
	background: var(--muf-color-surface);
	border: 1px solid var(--muf-color-border);
}

/* =========================================================================
 * 6. 記事一覧（カード）
 * ====================================================================== */
.card__thumb {
	position: relative;
	display: block;
	aspect-ratio: 16 / 9;
	overflow: hidden;
	background: #e2e5ea;
	border-radius: 3px;
}

.card__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: opacity 0.15s;
}

.card__thumb:hover img {
	opacity: 0.85;
}

/*
 * 外部サムネイル（FANZA の作品画像など。contracts.md 8.1）：拡大・縮小だけで切り抜かない。
 * 枠との差は余白（レターボックス）で埋める。
 */
.card__thumb img.is-remote,
.mini-post__thumb img.is-remote,
.entry__thumb img.is-remote {
	object-fit: contain;
	background: var(--muf-color-letterbox);
}

.noimage {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background: repeating-linear-gradient(135deg, #e6e8ec 0 10px, #dde0e6 10px 20px);
	color: #8d939e;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.12em;
}

.card__title {
	font-size: 16px;
	font-weight: 700;
	line-height: 1.45;
}

.card__title a {
	color: var(--muf-color-title);
}

.card__title a:hover {
	color: var(--muf-color-accent);
}

.card__excerpt {
	display: -webkit-box;
	margin: 6px 0 0;
	overflow: hidden;
	color: #555;
	font-size: 13px;
	line-height: 1.6;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
}

.card__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 10px;
	margin-top: 6px;
	color: var(--muf-color-muted);
	font-size: 12px;
}

.card__cat,
.entry__cat {
	display: inline-block;
	padding: 0 8px;
	background: var(--muf-color-accent-soft);
	border-radius: 2px;
	color: var(--muf-color-accent-dark);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.9;
}

.card__cat:hover,
.entry__cat:hover {
	background: var(--muf-color-accent);
	color: #fff;
	text-decoration: none;
}

/* リスト表示：1枚の白いパネルに区切り線で並べる */
.post-list--list {
	background: var(--muf-color-surface);
	border: 1px solid var(--muf-color-border);
}

.card--list {
	display: grid;
	grid-template-columns: 176px minmax(0, 1fr);
	gap: 14px;
	padding: 12px;
	border-bottom: 1px solid var(--muf-color-border);
}

.card--list:last-child {
	border-bottom: 0;
}

.card--list .card__title {
	display: -webkit-box;
	overflow: hidden;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	line-clamp: 2;
}

/* ブロック表示：カード型グリッド */
.post-list--block {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 12px;
}

.card--block {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	background: var(--muf-color-surface);
	border: 1px solid var(--muf-color-border);
	border-radius: var(--muf-radius);
}

.card--block .card__thumb {
	border-radius: 0;
}

.card--block .card__body {
	display: flex;
	flex: 1;
	flex-direction: column;
	padding: 8px 10px 10px;
}

.card--block .card__title {
	display: -webkit-box;
	overflow: hidden;
	font-size: 14px;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-clamp: 3;
}

.card--block .card__meta {
	margin-top: auto;
	padding-top: 6px;
}

/* ページ送り */
.pagination {
	margin-top: 24px;
}

.nav-links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px;
}

.page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 40px;
	height: 40px;
	padding: 0 12px;
	background: var(--muf-color-surface);
	border: 1px solid var(--muf-color-border);
	border-radius: 3px;
	color: var(--muf-color-text);
	font-size: 14px;
	font-weight: 700;
}

a.page-numbers:hover {
	border-color: var(--muf-color-accent);
	color: var(--muf-color-accent);
	text-decoration: none;
}

.page-numbers.current {
	background: var(--muf-color-accent);
	border-color: var(--muf-color-accent);
	color: #fff;
}

.page-numbers.dots {
	background: transparent;
	border-color: transparent;
}

/* =========================================================================
 * 7. 記事詳細・固定ページ
 * ====================================================================== */
.entry {
	padding: 20px 24px 24px;
	background: var(--muf-color-surface);
	border: 1px solid var(--muf-color-border);
}

.entry__title {
	color: var(--muf-color-title);
	font-size: 24px;
	font-weight: 800;
	line-height: 1.45;
}

.entry__meta {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 12px;
	margin-top: 10px;
	color: var(--muf-color-muted);
	font-size: 13px;
}

.entry__cats {
	display: inline-flex;
	flex-wrap: wrap;
	gap: 4px;
}

.entry__tags {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	margin: 8px 0 0;
	padding: 0;
	list-style: none;
}

.entry__tags a {
	display: inline-block;
	padding: 0 10px;
	background: #f4f5f7;
	border: 1px solid #ccd0d8;
	border-radius: 999px;
	color: #3d4452;
	font-size: 12px;
	line-height: 1.9;
}

.entry__tags a::before {
	content: "#";
	margin-right: 2px;
	color: var(--muf-color-muted);
}

.entry__tags a:hover {
	border-color: var(--muf-color-accent);
	color: var(--muf-color-accent);
	text-decoration: none;
}

.entry__thumb {
	margin: 16px 0 0;
}

.entry__thumb img,
.entry__thumb .noimage {
	display: block;
	width: 100%;
}

.entry__thumb .noimage {
	aspect-ratio: 16 / 9;
}

.entry__content {
	margin-top: 20px;
	font-size: 16px;
	line-height: 1.9;
}

.entry__content > :last-child,
.entry__content .muf-article > :last-child {
	margin-bottom: 0;
}

/* the_content() で出る一般的な要素 */
.entry__content h2 {
	margin: 1.8em 0 0.8em;
	padding: 8px 12px;
	background: #f4f5f7;
	border-left: 5px solid var(--muf-color-accent);
	font-size: 20px;
}

.entry__content h3 {
	margin: 1.6em 0 0.6em;
	padding-bottom: 4px;
	border-bottom: 2px solid var(--muf-color-border);
	font-size: 18px;
}

.entry__content ul,
.entry__content ol {
	margin: 0 0 1em;
	padding-left: 1.5em;
}

.entry__content blockquote {
	margin: 0 0 1em;
	padding: 12px 16px;
	background: #f7f7f9;
	border-left: 4px solid #c3c8d0;
	color: #444;
}

.entry__content figure {
	margin: 0 0 1em;
}

.entry__content figcaption {
	color: var(--muf-color-muted);
	font-size: 12px;
}

.entry__content table {
	width: 100%;
	margin: 0 0 1em;
	border-collapse: collapse;
	font-size: 14px;
}

.entry__content th,
.entry__content td {
	padding: 6px 10px;
	border: 1px solid var(--muf-color-border);
}

.entry__content th {
	background: #f4f5f7;
}

.page-links {
	margin-top: 1em;
	font-weight: 700;
}

.entry__source {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 10px;
	margin: 24px 0 0;
	padding: 10px 12px;
	background: #f7f7f9;
	border: 1px solid var(--muf-color-border);
	font-size: 13px;
}

.entry__source-label {
	padding: 0 8px;
	background: var(--muf-color-heading-bg);
	border-radius: 2px;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	line-height: 1.9;
}

.entry__source a {
	text-decoration: underline;
}

.entry--404 .search-form {
	margin: 16px 0;
}

.button-link {
	display: inline-block;
	padding: 8px 20px;
	background: var(--muf-color-accent);
	border-radius: var(--muf-radius);
	color: #fff;
	font-weight: 700;
}

.button-link:hover {
	background: var(--muf-color-accent-dark);
	color: #fff;
	text-decoration: none;
}

/* 関連記事 */
.related {
	margin-top: 24px;
}

/* =========================================================================
 * 8. Core が出力する記事ブロック（contracts.md 5.1・8.5）
 * ====================================================================== */
.muf-article > * {
	margin-top: 0;
}

/* 導入文 */
.muf-block--intro {
	margin: 0 0 24px;
	font-size: 16px;
	line-height: 1.9;
}

/* 架空コメント：吹き出し。実在の投稿ID・日時・レス番号は付けない（spec.md 6.3） */
.muf-block--reaction {
	position: relative;
	max-width: 92%;
	margin: 0 0 22px;
	padding: 8px 14px 10px;
	background: #f0f3f9;
	border: 1px solid #cfd7e6;
	border-radius: 14px;
}

.muf-block--reaction::after {
	content: "";
	position: absolute;
	bottom: -8px;
	left: 24px;
	width: 14px;
	height: 14px;
	background: #f0f3f9;
	border-right: 1px solid #cfd7e6;
	border-bottom: 1px solid #cfd7e6;
	transform: rotate(45deg);
}

.muf-reaction__text {
	margin: 0;
	color: #1f2633;
	font-size: 15px;
	line-height: 1.75;
}

/* 画像・動画・埋め込み */
.muf-media {
	margin: 0 0 24px;
	text-align: center;
}

.muf-media img,
.muf-media video {
	display: block;
	max-width: 100%;
	height: auto;
	margin: 0 auto;
}

/* preload="none" でメタデータがない間も 16:9 の枠を確保する */
.muf-media video {
	width: 100%;
	aspect-ratio: auto 16 / 9;
	background: #000;
}

.muf-media iframe {
	display: block;
	width: 100%;
	max-width: 100%;
	margin: 0 auto;
	border: 0;
}

.muf-media--embed iframe {
	height: auto;
	aspect-ratio: 16 / 9;
}

.muf-media__credit {
	margin-top: 6px;
	color: var(--muf-color-muted);
	font-size: 11px;
	line-height: 1.5;
	text-align: right;
}

.muf-media__credit a {
	color: inherit;
	text-decoration: underline;
}

/* 見出し（特集・ランキングの作品ごとの区切り）。.entry__content h2 より優先する */
.muf-article .muf-block--heading {
	margin: 40px 0 16px;
	padding: 10px 14px;
	background: #f4f5f7;
	border-bottom: 1px solid var(--muf-color-border);
	border-left: 6px solid var(--muf-color-accent);
	color: var(--muf-color-title);
	font-size: 20px;
	font-weight: 800;
	line-height: 1.5;
}

.muf-article > .muf-block--heading:first-child {
	margin-top: 0;
}

/* 本文の段落 */
.muf-block--paragraph {
	margin: 0 0 24px;
	font-size: 16px;
	line-height: 1.9;
}

/*
 * 作品画像（FANZA の公式画像。contracts.md 8.1）
 * 拡大・縮小だけで切り抜かない（object-fit: contain・角丸なし）。縦長の画像は画面の高さに収め、左右を余白にする。
 */
.muf-article .muf-product-image {
	margin: 0 0 24px;
	background: #f4f5f7;
	text-align: center;
}

.muf-product-image img {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
	max-height: 85vh;
	margin: 0 auto;
	object-fit: contain;
}

/* 公式サンプル画像のギャラリー（contracts.md 9.5）。作品画像と同じく切り抜かない */
.muf-article .muf-product-gallery {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 8px;
	margin: 0 0 24px;
}

.muf-product-gallery__item {
	margin: 0;
	background: var(--muf-color-letterbox);
}

.muf-product-gallery__item img {
	display: block;
	width: 100%;
	height: auto;
	object-fit: contain;
}

@media (max-width: 480px) {
	.muf-article .muf-product-gallery {
		grid-template-columns: minmax(0, 1fr);
	}
}

/* 公式サンプル動画プレイヤー（720×480 の比率） */
.muf-product-movie {
	width: 100%;
	margin: 0 0 24px;
	aspect-ratio: 3 / 2;
	background: #000;
}

.muf-product-movie iframe {
	display: block;
	width: 100%;
	max-width: 100%;
	height: 100%;
	border: 0;
}

/*
 * 商品ボックス（affiliate。spec.md 8.4）
 *
 * 広告であることが分かるよう「PR」バッジを枠の上辺に常に出す。
 * 広告枠（.muf-ad：灰色・破線）とは別の見た目にし、本文とは枠で区切る。
 * 幅が足りないとき（SP・タブレットの2カラム）は画像と本文を縦に積む。
 */
.muf-product {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 14px 18px;
	margin: 32px 0 28px;
	padding: 22px 16px 16px;
	background: var(--muf-color-pr-bg);
	border: 2px solid var(--muf-color-pr-border);
	border-radius: 6px;
	font-size: 14px;
	line-height: 1.6;
}

.muf-product__label {
	position: absolute;
	top: -11px;
	left: 12px;
	padding: 0 10px;
	background: var(--muf-color-pr-label);
	border-radius: 3px;
	color: #fff;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.12em;
	line-height: 20px;
}

/* 横並びのときは 220px、縦に積んだときは最大 400px で中央に置く */
.muf-product__thumb {
	display: block;
	flex: 1 0 220px;
	max-width: 400px;
	margin-inline: auto;
	background: var(--muf-color-letterbox);
}

.muf-product__thumb img {
	display: block;
	width: 100%;
	height: auto;
	max-height: 320px;
	margin: 0 auto;
	object-fit: contain;
	transition: opacity 0.15s;
}

.muf-product__thumb:hover img {
	opacity: 0.85;
}

.muf-product__body {
	flex: 999 1 260px;
	min-width: 0;
}

.muf-product__title {
	margin: 0 0 8px;
	color: var(--muf-color-title);
	font-size: 16px;
	font-weight: 800;
	line-height: 1.5;
}

.muf-product__meta {
	display: grid;
	grid-template-columns: max-content minmax(0, 1fr);
	gap: 4px 10px;
	margin: 0;
	font-size: 13px;
	line-height: 1.6;
}

/* 値が複数行になってもラベルは1行の高さのまま */
.muf-product__meta dt {
	align-self: start;
	min-width: 4.5em;
	padding: 0 6px;
	background: #fff;
	border: 1px solid var(--muf-color-pr-border);
	border-radius: 2px;
	color: var(--muf-color-accent-dark);
	font-size: 11px;
	font-weight: 700;
	line-height: 1.9;
	text-align: center;
}

.muf-product__meta dd {
	margin: 0;
	color: var(--muf-color-text);
}

.muf-product__button {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	max-width: 360px;
	min-height: 48px;
	margin-top: 14px;
	padding: 10px 40px;
	background: var(--muf-color-accent);
	border-radius: 6px;
	box-shadow: 0 3px 0 var(--muf-color-accent-dark);
	color: #fff;
	font-size: 15px;
	font-weight: 800;
	line-height: 1.4;
	text-align: center;
}

/* 右端の「›」（装飾） */
.muf-product__button::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 18px;
	width: 8px;
	height: 8px;
	border-top: 2px solid currentColor;
	border-right: 2px solid currentColor;
	transform: translateY(-50%) rotate(45deg);
}

.muf-product__button:hover {
	background: var(--muf-color-accent-dark);
	color: #fff;
	text-decoration: none;
}

.muf-product__button:focus-visible {
	outline: 3px solid var(--muf-color-focus);
	outline-offset: 3px;
}

/* =========================================================================
 * 9. 広告（contracts.md 5.2・spec.md 8.4）
 *
 * 記事カードと誤認させないよう、灰色の地・破線枠・左上の「PR」ラベルで統一し、
 * 前後に余白を取って誤クリックを防ぐ。
 * ====================================================================== */
.muf-ad {
	clear: both;
	margin: 28px 0;
	padding: 0 8px 10px;
	background: var(--muf-color-ad-bg);
	border: 1px dashed var(--muf-color-ad-border);
	text-align: center;
}

.muf-ad__label {
	display: block;
	width: fit-content;
	margin: 0 auto 8px -8px;
	padding: 2px 10px;
	background: var(--muf-color-ad-label);
	color: #fff;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: 0.12em;
	line-height: 1.5;
}

.muf-ad__body {
	max-width: 100%;
	overflow-x: auto;
	line-height: 1;
	text-align: center;
}

.muf-ad__body img,
.muf-ad__body iframe {
	display: inline-block;
	vertical-align: middle;
}

/* 一覧内（インフィード）：カードの列からはみ出させ、行全体を使う */
.post-list--list > .muf-ad {
	margin: 12px;
}

.post-list--block > .muf-ad {
	grid-column: 1 / -1;
	margin: 8px 0;
}

.muf-ad--home_after_fv {
	margin: 0 0 16px;
}

/*
 * FV：提携ブログの新着と自サイトの記事（contracts.md 10.4、spec.md 5.3）
 * サムネイルは 4:3 で、はみ出した部分を切り取り、タイトルを画像に重ねる。
 * FANZA の商品画像（.muf-fv__item--uncropped）は規約により切り抜き・書き加えをしないため、
 * 画像はタイトルの帯より上に縮小して収め、タイトルとも重ねない（contracts.md 8.1）。
 */
.muf-fv {
	margin: 0 0 16px;
}

.muf-fv__list {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 8px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.muf-fv__link {
	position: relative;
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: #1c1e23;
	border-radius: var(--muf-radius);
	color: #fff;
	text-decoration: none;
}

.muf-fv__link:focus-visible {
	outline: 3px solid var(--muf-color-focus);
	outline-offset: 2px;
}

.muf-fv__thumb {
	position: absolute;
	inset: 0;
	display: block;
}

.muf-fv__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform 0.2s ease;
}

.muf-fv__link:hover .muf-fv__thumb img {
	transform: scale(1.04);
}

.muf-fv__thumb--placeholder {
	background: repeating-linear-gradient(135deg, #2a2d34 0 10px, #32363e 10px 20px);
}

.muf-fv__caption {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	display: flex;
	align-items: flex-end;
	gap: 4px;
	padding: 28px 8px 6px;
	background: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.82) 55%);
}

.muf-fv__title {
	display: -webkit-box;
	flex: 1 1 auto;
	min-width: 0;
	overflow: hidden;
	font-size: 13px;
	font-weight: 700;
	line-height: 1.45;
	text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}

.muf-fv__link:hover .muf-fv__title {
	text-decoration: underline;
}

.muf-fv__external {
	flex: none;
	width: 14px;
	height: 14px;
	margin-bottom: 2px;
	opacity: 0.9;
}

.muf-fv__new {
	display: inline-block;
	margin-right: 4px;
	padding: 0 4px;
	background: var(--muf-color-alert);
	border-radius: 2px;
	color: #fff;
	font-size: 10px;
	line-height: 1.6;
	text-shadow: none;
	vertical-align: 1px;
}

/* FANZA の商品画像：切り抜かず、タイトルの帯（2行分）より上に収める */
.muf-fv__item--uncropped .muf-fv__thumb {
	bottom: calc(13px * 1.45 * 2 + 12px);
}

.muf-fv__item--uncropped .muf-fv__thumb img {
	object-fit: contain;
}

.muf-fv__item--uncropped .muf-fv__link:hover .muf-fv__thumb img {
	transform: none;
}

.muf-fv__item--uncropped .muf-fv__caption {
	min-height: calc(13px * 1.45 * 2 + 12px);
	padding-top: 6px;
	background: #1c1e23;
}

@media (max-width: 960px) {
	.muf-fv__list {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
}

@media (max-width: 600px) {
	.muf-fv__list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 6px;
	}

	.muf-fv__title {
		font-size: 12px;
	}

	.muf-fv__item--uncropped .muf-fv__thumb {
		bottom: calc(12px * 1.45 * 2 + 12px);
	}

	.muf-fv__item--uncropped .muf-fv__caption {
		min-height: calc(12px * 1.45 * 2 + 12px);
	}
}

/*
 * 最新ニュース：提携ブログ・アンテナサイトの新着（contracts.md 10.5、spec.md 7.2）
 * サイドバー（.l-sidebar）と記事の下に、文字だけの一覧で出す。
 */
.muf-news {
	background: var(--muf-color-surface);
	border: 1px solid var(--muf-color-border);
}

.l-main .muf-news {
	margin-top: 24px;
}

.muf-news__heading {
	margin: 0;
	padding: 8px 12px;
	background: var(--muf-color-heading-bg);
	border-left: 5px solid var(--muf-color-accent);
	color: #fff;
	font-size: 14px;
	font-weight: 700;
}

.muf-news__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.muf-news__item + .muf-news__item {
	border-top: 1px dotted #c9cdd4;
}

.muf-news__link {
	display: flex;
	align-items: flex-start;
	gap: 6px;
	padding: 9px 12px;
	color: var(--muf-color-text);
	font-size: 14px;
	font-weight: 700;
	line-height: 1.55;
	text-decoration: none;
}

.muf-news__link:hover {
	background: var(--muf-color-accent-soft);
}

.muf-news__link:hover .muf-news__text {
	color: var(--muf-color-link);
	text-decoration: underline;
}

.muf-news__link:focus-visible {
	outline: 3px solid var(--muf-color-focus);
	outline-offset: -3px;
}

.muf-news__text {
	flex: 1 1 auto;
	min-width: 0;
	overflow-wrap: anywhere;
}

.muf-news__new {
	margin-left: 4px;
	color: var(--muf-color-alert);
	font-size: 11px;
	font-weight: 700;
	white-space: nowrap;
}

.muf-news__external {
	flex: none;
	width: 13px;
	height: 13px;
	margin-top: 4px;
	color: var(--muf-color-muted);
}

.l-sidebar .muf-news__link {
	padding: 8px 10px;
	font-size: 13px;
}

.site-footer-ad .muf-ad {
	margin: 0 0 24px;
}

/* =========================================================================
 * 10. サイドバー
 * ====================================================================== */
/* 広告・ウィジェットとも上下の余白はここで揃える */
.l-sidebar > * {
	margin-block: 0;
}

.l-sidebar > * + * {
	margin-top: 16px;
}

.widget {
	background: var(--muf-color-surface);
	border: 1px solid var(--muf-color-border);
}

.widget__title {
	margin: 0;
	padding: 8px 12px;
	background: var(--muf-color-heading-bg);
	border-left: 5px solid var(--muf-color-accent);
	color: #fff;
	font-size: 14px;
	font-weight: 700;
}

.widget__list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.cat-list li {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	padding: 7px 12px;
	border-bottom: 1px dotted #c9cdd4;
	font-size: 14px;
}

.cat-list li:last-child {
	border-bottom: 0;
}

.cat-list .children {
	display: none;
}

.cat-list a {
	color: var(--muf-color-text);
}

.cat-list a::before {
	content: "\203A";
	margin-right: 6px;
	color: var(--muf-color-accent);
	font-weight: 700;
}

.cat-list a:hover {
	color: var(--muf-color-accent);
}

.cat-count {
	flex: none;
	min-width: 28px;
	padding: 0 6px;
	background: #f0f1f4;
	border-radius: 999px;
	color: var(--muf-color-muted);
	font-size: 11px;
	line-height: 1.8;
	text-align: center;
}

.mini-post {
	display: grid;
	grid-template-columns: 88px minmax(0, 1fr);
	gap: 10px;
	padding: 8px 10px;
	border-bottom: 1px dotted #c9cdd4;
}

.mini-post:last-child {
	border-bottom: 0;
}

.mini-post__thumb {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: #e2e5ea;
	border-radius: 3px;
}

.mini-post__thumb img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.mini-post__body {
	min-width: 0;
}

.mini-post__title {
	display: -webkit-box;
	overflow: hidden;
	color: var(--muf-color-title);
	font-size: 13px;
	font-weight: 700;
	line-height: 1.5;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	line-clamp: 3;
}

.mini-post .post-date {
	display: block;
	margin-top: 2px;
	color: var(--muf-color-muted);
	font-size: 11px;
}

/*
 * お問い合わせフォーム（固定ページ「お問い合わせ」の [mufteria_contact_form]。Core が出力する）
 */
.muf-contact {
	margin: 16px 0 0;
}

.muf-contact__field {
	margin: 0 0 16px;
}

.muf-contact__field label {
	display: block;
	margin-bottom: 4px;
	font-size: 14px;
	font-weight: 700;
}

.muf-contact__required {
	margin-left: 6px;
	padding: 0 6px;
	background: var(--muf-color-alert);
	border-radius: 2px;
	color: #fff;
	font-size: 11px;
	vertical-align: 1px;
}

.muf-contact input[type="text"],
.muf-contact input[type="email"],
.muf-contact input[type="url"],
.muf-contact select,
.muf-contact textarea {
	box-sizing: border-box;
	width: 100%;
	max-width: 100%;
	padding: 8px 10px;
	background: #fff;
	border: 1px solid var(--muf-color-border);
	border-radius: var(--muf-radius);
	color: var(--muf-color-text);
	font: inherit;
	font-size: 16px;
}

.muf-contact input:focus-visible,
.muf-contact select:focus-visible,
.muf-contact textarea:focus-visible {
	outline: 3px solid var(--muf-color-focus);
	outline-offset: 1px;
}

/* 人には見えない欄（スパム対策） */
.muf-contact__trap {
	position: absolute !important;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}

.muf-contact__submit button {
	padding: 10px 32px;
	background: var(--muf-color-accent);
	border: 0;
	border-radius: 999px;
	color: #fff;
	font: inherit;
	font-weight: 700;
	cursor: pointer;
}

.muf-contact__submit button:hover {
	background: var(--muf-color-accent-dark);
}

.muf-contact__notice {
	padding: 10px 14px;
	border-radius: var(--muf-radius);
	font-weight: 700;
}

.muf-contact__notice--ok {
	background: #e8f5e9;
	color: #1b5e20;
}

.muf-contact__notice--error {
	background: #fdecea;
	color: #b71c1c;
}

/* =========================================================================
 * 11. フッター
 * ====================================================================== */
.site-footer {
	padding-block: 24px 28px;
	background: #1f2229;
	color: #c4c8d0;
	font-size: 13px;
}

.site-footer a {
	color: #fff;
}

.footer-nav__list {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: 6px 20px;
	margin: 0 0 16px;
	padding: 0;
	list-style: none;
}

.site-footer :focus-visible {
	outline-color: #8ab4f8;
}

.site-footer__notice {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 0 0 8px;
	color: #fff;
	font-weight: 700;
	text-align: center;
}

.site-badge--footer {
	border-color: #ff6b6b;
	color: #ff8a8a;
}

/* API のクレジット表記（contracts.md 8.1） */
.site-footer__credit {
	margin: 0 0 4px;
	color: #9ca1ab;
	font-size: 12px;
	text-align: center;
}

.site-footer__credit a {
	text-decoration: underline;
}

.site-footer__credit img {
	display: inline-block;
	vertical-align: middle;
}

.site-footer__copy {
	margin: 0;
	color: #9ca1ab;
	text-align: center;
}

/* =========================================================================
 * 12. 年齢確認（spec.md 13.3）
 *
 * 既定で表示し、Cookie muf_age_ok=1 があるとき <head> のスクリプトが
 * html.muf-age-ok を付けて隠す（ページキャッシュでも動く）。
 * ====================================================================== */
.age-gate {
	position: fixed;
	inset: 0;
	z-index: 100000;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 16px;
	overflow-y: auto;
	background: rgba(14, 14, 18, 0.96);
}

.muf-age-ok .age-gate {
	display: none;
}

html.muf-age-pending,
html.muf-age-pending body {
	overflow: hidden;
}

.age-gate__panel {
	width: 100%;
	max-width: 440px;
	margin: auto;
	padding: 28px 24px 24px;
	background: #fff;
	border-top: 6px solid var(--muf-color-accent);
	border-radius: 8px;
	box-shadow: 0 12px 40px rgba(0, 0, 0, 0.5);
	text-align: center;
}

.age-gate__brand {
	margin: 0 0 12px;
	color: var(--muf-color-accent);
	font-size: 20px;
	font-weight: 900;
	letter-spacing: 0.08em;
}

.age-gate__mark {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 64px;
	height: 64px;
	margin: 0 auto 12px;
	border: 4px solid var(--muf-color-alert);
	border-radius: 50%;
	color: var(--muf-color-alert);
	font-size: 20px;
	font-weight: 900;
}

.age-gate__title {
	margin: 0 0 10px;
	color: var(--muf-color-title);
	font-size: 22px;
	font-weight: 800;
}

.age-gate__text {
	margin: 0 0 20px;
	color: #555;
	font-size: 13px;
}

.age-gate__actions {
	display: grid;
	gap: 10px;
}

.age-gate__btn {
	display: block;
	width: 100%;
	padding: 13px 16px;
	border: 2px solid transparent;
	border-radius: 6px;
	font-size: 16px;
	font-weight: 800;
	line-height: 1.4;
	text-align: center;
	cursor: pointer;
}

.age-gate__btn--yes {
	background: var(--muf-color-accent);
	border-color: var(--muf-color-accent);
	color: #fff;
}

.age-gate__btn--yes:hover {
	background: var(--muf-color-accent-dark);
	border-color: var(--muf-color-accent-dark);
}

.age-gate__btn--no {
	background: #fff;
	border-color: #b9bec7;
	color: #333;
}

.age-gate__btn--no:hover {
	background: #f2f3f5;
	color: #000;
	text-decoration: none;
}

.age-gate :focus-visible {
	outline: 3px solid var(--muf-color-focus);
	outline-offset: 3px;
}

/* =========================================================================
 * 13. レスポンシブ
 * ====================================================================== */
@media (max-width: 1023.98px) {
	.post-list--block {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.site-header .search-form {
		width: 240px;
	}
}

/* SP（768px 未満）：1カラム。サイドバーはメインの下に並ぶ */
@media (max-width: 767.98px) {
	:root {
		--muf-gutter: 10px;
		--muf-gap: 20px;
	}

	body {
		font-size: 14px;
	}

	.l-columns {
		grid-template-columns: minmax(0, 1fr);
	}

	.site-content {
		padding-block: 10px 24px;
	}

	.site-header__inner {
		flex-wrap: wrap;
		gap: 8px 10px;
		padding-block: 10px;
	}

	.site-logo {
		font-size: 26px;
	}

	.site-header__tools {
		width: 100%;
		gap: 8px;
	}

	.site-header .search-form {
		flex: 1;
		width: auto;
		max-width: none;
	}

	/* iOS のフォーカス時ズームを防ぐため 16px */
	.search-form__input {
		font-size: 16px;
	}

	.site-header__latest {
		padding: 0 12px;
		font-size: 13px;
	}

	/* カテゴリは横スクロール */
	.global-nav .l-container {
		padding-inline: 0;
	}

	.global-nav__list {
		flex-wrap: nowrap;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: thin;
	}

	.global-nav__list a {
		padding: 9px 12px;
		font-size: 13px;
	}

	.section-title {
		font-size: 15px;
	}

	.archive-header__title {
		font-size: 18px;
	}

	.card--list {
		grid-template-columns: 120px minmax(0, 1fr);
		gap: 10px;
		padding: 10px;
	}

	.card--list .card__title {
		font-size: 14px;
		-webkit-line-clamp: 3;
		line-clamp: 3;
	}

	.card--list .card__excerpt {
		display: none;
	}

	.card__meta {
		margin-top: 4px;
		font-size: 11px;
	}

	.post-list--block {
		gap: 8px;
	}

	.card--block .card__body {
		padding: 6px 8px 8px;
	}

	.card--block .card__title {
		font-size: 13px;
	}

	.entry {
		padding: 14px 12px 18px;
	}

	.entry__title {
		font-size: 20px;
	}

	.entry__content {
		font-size: 15px;
	}

	.muf-block--intro {
		font-size: 15px;
	}

	.muf-block--reaction {
		max-width: 100%;
	}

	.muf-reaction__text {
		font-size: 14px;
	}

	.muf-article .muf-block--heading {
		margin-top: 32px;
		padding: 8px 10px;
		border-left-width: 5px;
		font-size: 17px;
	}

	.muf-block--paragraph {
		font-size: 15px;
	}

	.muf-product {
		padding: 20px 12px 14px;
	}

	.muf-product__title {
		font-size: 15px;
	}

	.muf-product__button {
		max-width: none;
	}

	.page-numbers {
		min-width: 36px;
		height: 36px;
		padding: 0 10px;
	}
}

@media (prefers-reduced-motion: reduce) {
	* {
		transition: none !important;
	}
}