/* FANZAまとめノート - 共通スタイル（ダーク基調・モバイル優先） */
:root{
  --bg:#14161c; --bg2:#1c1f28; --card:#222634; --line:#333949;
  --text:#eef0f5; --sub:#a7adbd; --accent:#e8536b; --accent2:#f5a623;
  --radius:12px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--text);
  font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP",sans-serif;
  font-size:16px; line-height:1.75;
}
a{color:inherit}
img{max-width:100%; display:block}

/* ヘッダー */
.site-header{
  position:sticky; top:0; z-index:10;
  background:rgba(20,22,28,.95); border-bottom:1px solid var(--line);
  padding:10px 16px; display:flex; align-items:center; gap:12px;
}
.logo{font-size:20px; font-weight:800; letter-spacing:.02em; text-decoration:none}
.logo span{color:var(--accent)}
.site-nav{margin-left:auto; display:flex; gap:14px; font-size:13px}
.site-nav a{color:var(--sub); text-decoration:none; white-space:nowrap}
.site-nav a:hover{color:var(--text)}

/* 年齢注意 */
.age-note{
  background:#3a1420; color:#ffb9c5; border-bottom:1px solid #5c2233;
  text-align:center; font-size:13px; font-weight:700; padding:8px 12px;
}

/* レイアウト */
.wrap{max-width:960px; margin:0 auto; padding:16px}
.hero{padding:24px 0 8px}
.hero h1{font-size:26px; margin:0 0 8px}
.hero p{color:var(--sub); margin:0}

/* カテゴリ導線 */
.cat-nav{display:flex; flex-wrap:wrap; gap:8px; margin:20px 0}
.cat-chip{
  background:var(--bg2); border:1px solid var(--line); border-radius:999px;
  padding:6px 14px; font-size:14px; text-decoration:none;
}
.cat-chip.on{background:var(--accent); border-color:var(--accent); color:#fff; font-weight:700}

/* 記事カード一覧 */
.cards{display:grid; grid-template-columns:repeat(2,1fr); gap:14px}
@media(min-width:720px){.cards{grid-template-columns:repeat(3,1fr)}}
.card{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  overflow:hidden; text-decoration:none; display:flex; flex-direction:column;
}
.card img{aspect-ratio:2/3; object-fit:cover; width:100%}
.card-body{padding:10px 12px 14px; display:flex; flex-direction:column; gap:6px}
.card-title{font-size:14px; font-weight:700; line-height:1.5}
.card-actress{font-size:13px; color:var(--accent2)}
.card-meta{font-size:12px; color:var(--sub)}
.label{
  display:inline-block; align-self:flex-start; font-size:11px; font-weight:700;
  background:var(--accent); color:#fff; border-radius:4px; padding:2px 8px;
}
.label.sub{background:#3d4356; color:var(--sub)}

/* 月額バナー */
.monthly-banner{
  margin:26px 0; display:block; text-decoration:none; text-align:center;
  background:linear-gradient(135deg,#7a1430,#e8536b);
  border-radius:var(--radius); padding:22px 16px; color:#fff;
}
.monthly-banner .big{font-size:20px; font-weight:800; display:block}
.monthly-banner .small{font-size:13px; opacity:.9}

/* 広告プレースホルダ */
.ad-slot{
  border:1px dashed #4a5064; border-radius:8px; color:#6d7488;
  text-align:center; font-size:12px; padding:18px 8px; margin:18px 0;
  background:var(--bg2);
}

/* 記事ページ */
.article-head h1{font-size:21px; line-height:1.55; margin:10px 0}
.article-hero{border-radius:var(--radius); overflow:hidden; margin:14px 0}
.article-hero img{width:100%}
.spec{
  background:var(--bg2); border:1px solid var(--line); border-radius:var(--radius);
  padding:6px 16px; margin:16px 0;
}
.spec dl{display:grid; grid-template-columns:96px 1fr; row-gap:4px; font-size:14px}
.spec dt{color:var(--sub)}
.spec dd{margin:0}
.points{margin:18px 0}
.points h2,.related h2,.sec-title{font-size:18px; border-left:4px solid var(--accent); padding-left:10px; margin:24px 0 12px}
.point{background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:12px 14px; margin:10px 0}
.point h3{margin:0 0 4px; font-size:15px}
.point h3 .no{color:var(--accent); margin-right:8px}
.point p{margin:0; color:var(--sub); font-size:14px}
.audience{white-space:pre-line; color:var(--sub); font-size:14px}

/* CTA */
.cta{
  display:block; text-align:center; text-decoration:none;
  background:var(--accent); color:#fff; font-weight:800; font-size:17px;
  border-radius:999px; padding:14px 20px; margin:22px 0;
}
.cta-note{text-align:center; font-size:12px; color:var(--sub); margin-top:-12px}

/* 関連記事 */
.related .cards{grid-template-columns:repeat(2,1fr)}
@media(min-width:720px){.related .cards{grid-template-columns:repeat(4,1fr)}}

/* フッター */
.site-footer{
  border-top:1px solid var(--line); margin-top:36px; padding:22px 16px 30px;
  text-align:center; color:var(--sub); font-size:12px; line-height:1.9;
}
.site-footer .name{color:var(--text); font-weight:700; font-size:13px}
.empty-note{color:var(--sub); background:var(--bg2); border:1px solid var(--line); border-radius:var(--radius); padding:20px; text-align:center}