/*
Theme Name: KJ Theme
Description: 騎乗位特化レビューサイトのオリジナルクラシックテーマ。データ定義は一切持たず、kj-core プラグインが公開するメタ・関数を読んで表示するだけ。CSS はデザインモック（mock/index.html, mock/work.html）をそのまま移設したもの。
Author: kj-core
Version: 0.5.0
Text Domain: kj-theme
*/

/* ==========================================================================
   1. トークン（:root） — モックの値をそのまま。変更しない。
   ========================================================================== */

:root{
  --paper:#fff;
  --paper-2:#F1F3F8;
  --paper-3:#E3E7F0;
  --rule:#DCE0EA;
  --rule-2:#C3C9D8;
  --ink:#14161D;
  --ink-2:#565C6E;
  --ink-3:#8A90A2;
  --data:#1B3FA0;
  --data-bg:#EAEFFC;
  /* 微修正: モック原色 #FF1F63 は白文字との contrast ratio が約3.7:1で
     WCAG AA(4.5:1)未達だったため、同系色のまま #D6134F に変更（約5.1:1）。
     --cta-press はさらに一段階暗く調整。 */
  --cta:#D6134F;
  --cta-press:#A80D3D;
  --w-a:720px;
  --w-l:1040px;
  --g:16px;
}

/* ==========================================================================
   2. リセット・ベース
   ========================================================================== */

*{box-sizing:border-box;margin:0;padding:0}
html{-webkit-text-size-adjust:100%}
body{
  background:var(--paper);color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",Meiryo,sans-serif;
  font-size:15px;line-height:1.85;
}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

/* ==========================================================================
   3. 共通パーツ — .hd .bc .ft .num .wrap .bar
   ========================================================================== */

.num{font-family:"Barlow Condensed",-apple-system,sans-serif;font-variant-numeric:tabular-nums;font-weight:700;letter-spacing:.01em}
.wrap{max-width:var(--w-l);margin:0 auto;padding:0 var(--g)}
.narrow{max-width:var(--w-a)}

/* header */
.hd{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.94);backdrop-filter:saturate(1.4) blur(8px);border-bottom:1px solid var(--rule)}
.hd__in{display:flex;align-items:center;gap:12px;height:52px;max-width:var(--w-l);margin:0 auto;padding:0 var(--g)}
.logo{display:flex;align-items:baseline;gap:7px;font-weight:700;font-size:15px;letter-spacing:.02em}
.logo span{font-family:"Barlow Condensed",sans-serif;font-size:12px;font-weight:600;letter-spacing:.14em;color:var(--data)}
.hd__nav{margin-left:auto;display:flex;gap:14px;font-size:12.5px;color:var(--ink-2)}
.hd__nav a:hover{color:var(--data)}
@media(max-width:600px){.hd__nav a:nth-child(n+3){display:none}}

/* breadcrumb */
.bc{border-bottom:1px solid var(--rule);background:var(--paper-2)}
.bc ol{display:flex;overflow-x:auto;white-space:nowrap;list-style:none;font-size:11.5px;color:var(--ink-2);padding:9px var(--g);max-width:var(--w-a);margin:0 auto}
.bc li+li::before{content:"›";margin:0 .55em;color:var(--ink-3)}
.bc [aria-current]{color:var(--ink)}

/* scene bar（署名要素。トップページ・単品ページ共通） */
.bar{display:flex;gap:2px;height:22px;background:var(--paper-3);border-radius:3px;overflow:hidden}
.bar i{background:var(--data);min-width:6px;display:block}
.bar i.b2{background:#4B69C4}
.bar i.rest{background:transparent;flex:1;min-width:0}
.barlg{display:flex;gap:8px;flex-wrap:wrap;margin-top:6px;font-size:11px;color:var(--ink-2)}
.barlg em{font-style:normal;color:var(--ink)}
.barnote{font-size:10.5px;color:var(--ink-3);margin-top:6px;line-height:1.6}

/* footer */
.ft{background:var(--paper-2);border-top:1px solid var(--rule);padding:26px 0 34px;margin-top:8px;font-size:12px;color:var(--ink-2)}
.ft h3{font-size:12px;letter-spacing:.05em;color:var(--ink);margin-bottom:7px}
.ft__c{display:grid;grid-template-columns:1fr 1fr;gap:20px 16px}
@media(min-width:700px){.ft__c{grid-template-columns:repeat(4,1fr)}}
.ft li{list-style:none;line-height:2}
.ft__note{margin-top:22px;padding-top:16px;border-top:1px solid var(--rule);font-size:11px;color:var(--ink-3);line-height:1.8}

/* ==========================================================================
   4. トップページ — .hero .stats .method .rank .rail .plist .grid .chips
   ========================================================================== */

/* 注意: .hero は work.html 側（単品ページ、§5）でも別の意味で使われている。
   同じクラス名を2つのモックが別コンポーネントとして使っているため、
   body_class() が自動付与する .home / .single-work でスコープを分ける
   （class 名自体は変更していない）。 */
body.home .hero{background:var(--paper-2);border-bottom:1px solid var(--rule);padding:26px 0 0}
.eyebrow{font-family:"Barlow Condensed",sans-serif;font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--data)}
.hero h1{font-size:21px;line-height:1.5;font-weight:700;margin:8px 0 10px;letter-spacing:.005em}
.hero p{font-size:14px;color:var(--ink-2);line-height:1.85;max-width:34em}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule);border-top:1px solid var(--rule);margin-top:22px}
.stat{background:var(--paper-2);padding:12px 10px 14px;text-align:center}
.stat b{display:block;font-size:27px;line-height:1.1;color:var(--data)}
.stat b i{font-size:13px;font-style:normal;margin-left:2px;color:var(--ink-2)}
.stat span{font-size:11px;color:var(--ink-2);letter-spacing:.04em}

/* method strip */
.method{border-bottom:1px solid var(--rule);padding:16px 0}
.method__in{display:flex;gap:10px;align-items:flex-start;font-size:12.5px;color:var(--ink-2);line-height:1.7}
.method__in b{color:var(--ink)}
.method dl{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:2px}
.method dt{font-family:"Barlow Condensed",sans-serif;font-size:11px;letter-spacing:.12em;color:var(--data);font-weight:600}
.method dd{font-size:12px;color:var(--ink-2);line-height:1.65}
.method a{color:var(--data);border-bottom:1px solid currentColor}

/* section */
section{padding:30px 0}
section + section{border-top:1px solid var(--rule)}
.sh{display:flex;align-items:baseline;gap:10px;margin-bottom:4px}
.sh h2{font-size:17px;font-weight:700;letter-spacing:.01em}
.sh a{margin-left:auto;font-size:12px;color:var(--data);white-space:nowrap}
.sub{font-size:12.5px;color:var(--ink-2);margin-bottom:16px;line-height:1.7}

/* `/cast/` 導線: noindex ページへのリンクなので、まとめへのリンク（--data・
   14px 前後）より弱く見せる。3箇所（単品レビュー・女優まとめ×2）で共通。 */
.kj-cast-link{font-size:12px;color:var(--ink-2);margin-top:6px}
.kj-cast-link a{color:inherit}

/* 判定基準リンク（体位アーカイブ・/position/ ハブ） */
.kj-term-link{font-size:12px;color:var(--data);margin-top:8px}

/* ranking */
.rank{border-top:1px solid var(--rule)}
.rank__row{display:grid;grid-template-columns:34px 1fr;gap:12px;padding:16px 0;border-bottom:1px solid var(--rule);align-items:start}
.rank__n{font-size:30px;line-height:1;color:var(--data);text-align:center}
.rank__n small{display:block;font-size:9px;letter-spacing:.1em;color:var(--ink-3);font-weight:600;margin-top:2px}
.rank__t{font-size:14.5px;font-weight:700;line-height:1.55}
.rank__m{font-size:11.5px;color:var(--ink-2);margin:3px 0 9px}
.rank__big{display:flex;align-items:baseline;gap:6px;margin-bottom:7px}
.rank__big b{font-size:26px;line-height:1;color:var(--data)}
.rank__big i{font-style:normal;font-size:11px;color:var(--ink-2)}
.rank__big u{text-decoration:none;font-size:11px;color:var(--ink-2);margin-left:auto}

/* actress rail */
.rail{display:flex;gap:10px;overflow-x:auto;padding-bottom:6px;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
.acard{flex:0 0 148px;border:1px solid var(--rule);border-radius:6px;overflow:hidden;background:var(--paper)}
.acard__img{aspect-ratio:3/4;background:var(--paper-3) repeating-linear-gradient(135deg,rgba(255,255,255,.5) 0 6px,transparent 6px 12px)}
.acard__img img{width:100%;height:100%;object-fit:cover}
.acard__b{padding:9px 10px 11px}
.acard__n{font-size:13.5px;font-weight:700}
.acard__s{font-size:11px;color:var(--ink-2);margin-top:2px}
.acard__k{font-family:"Barlow Condensed",sans-serif;font-size:15px;font-weight:700;color:var(--data);margin-top:5px}
.acard__k i{font-style:normal;font-size:10px;color:var(--ink-2);margin-left:2px}

/* position list */
.plist{border-top:1px solid var(--rule)}
.prow{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:13px 0;border-bottom:1px solid var(--rule);align-items:center}
.prow__n{font-size:14.5px;font-weight:700}
.prow__d{grid-column:1/2;font-size:12px;color:var(--ink-2);line-height:1.65}
.prow__c{grid-row:1/3;align-self:center;font-family:"Barlow Condensed",sans-serif;font-size:19px;font-weight:700;color:var(--data)}
.prow__c i{font-style:normal;font-size:10px;color:var(--ink-3);margin-left:1px}

/* grid cards */
.grid{display:grid;grid-template-columns:1fr;gap:14px}
@media(min-width:560px){.grid{grid-template-columns:1fr 1fr}}
@media(min-width:900px){.grid{grid-template-columns:repeat(3,1fr)}}
.card{border:1px solid var(--rule);border-radius:6px;overflow:hidden;background:var(--paper)}
.card__img{aspect-ratio:16/10;background:var(--paper-3) repeating-linear-gradient(135deg,rgba(255,255,255,.5) 0 6px,transparent 6px 12px)}
.card__img img{width:100%;height:100%;object-fit:cover}
.card__b{padding:11px 12px 13px}
.card__t{font-size:13.5px;font-weight:700;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.card__a{font-size:11.5px;color:var(--ink-2);margin-top:3px}
.card__d{display:flex;align-items:baseline;gap:5px;margin-top:8px;padding-top:8px;border-top:1px solid var(--rule)}
.card__d b{font-family:"Barlow Condensed",sans-serif;font-size:19px;font-weight:700;color:var(--data)}
.card__d i{font-style:normal;font-size:10.5px;color:var(--ink-2)}
.card__d u{text-decoration:none;margin-left:auto;font-size:10.5px;color:var(--ink-2)}
.card__price{font-size:11.5px;color:var(--ink-2);margin-top:4px}

/* label chips */
.chips{display:flex;flex-wrap:wrap;gap:7px}
.chip{border:1px solid var(--rule-2);border-radius:100px;padding:5px 12px;font-size:12.5px;color:var(--ink-2)}
.chip b{font-family:"Barlow Condensed",sans-serif;color:var(--data);margin-left:5px;font-size:13px}

/* ==========================================================================
   5. 単品ページ — .kj-mv .spec .cta .mx .log .kj-hl .kj-score .kj-toc .kj-date .rel .note
   ========================================================================== */

.disc{font-size:11px;color:var(--ink-3);padding:12px 0 0}

h1{font-size:20px;line-height:1.55;font-weight:700;margin:6px 0 4px}
.meta{font-size:12.5px;color:var(--ink-2);margin-bottom:18px}
/* 単品レビューページのレイアウト最終構成 §4: 女優名だけリンクにする */
.meta__act{font-size:13.5px;font-weight:700;color:var(--data);text-decoration:underline}

/* メインビジュアル。h1・meta の後、hero(スペック表)の前 — ファーストビュー
   内なので loading="lazy" を付けない（LCP対策、§2）。 */
.kj-mv{margin:10px 0 14px;border-radius:8px;overflow:hidden;border:1px solid var(--rule);background:var(--paper-3) repeating-linear-gradient(135deg,rgba(255,255,255,.5) 0 6px,transparent 6px 12px)}
.kj-mv img{width:100%;height:auto;display:block}

/* headline figure（.hero__top + .bar + .spec をまとめて内包する）
   .hero の意味の使い分けについては §4 冒頭の注記を参照。 */
body.single-work .hero{background:var(--paper);border:1px solid var(--rule);border-radius:8px;overflow:hidden;margin-bottom:20px}
.hero__top{background:var(--data-bg);padding:16px 16px 14px;border-bottom:1px solid var(--rule)}
.hero__lab{font-family:"Barlow Condensed",sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--data);font-weight:600}
.hero__big{display:flex;align-items:baseline;gap:7px;margin-top:2px}
.hero__big b{font-size:46px;line-height:1;color:var(--data)}
.hero__big i{font-style:normal;font-size:15px;color:var(--ink-2)}
.hero__big u{text-decoration:none;margin-left:auto;font-size:11.5px;color:var(--ink-2);text-align:right;line-height:1.5}
.hero__top .bar{height:26px;margin-top:12px}
.measuring{padding:16px;color:var(--ink-2);font-size:13px}

/* spec grid */
.spec{display:grid;grid-template-columns:1fr auto;font-size:14px}
.spec dt,.spec dd{padding:9px 16px;border-bottom:1px solid var(--rule)}
.spec dt{color:var(--ink-2)}
.spec dd{text-align:right;font-weight:500}
.spec .hl{color:var(--data);font-family:"Barlow Condensed",sans-serif;font-size:17px;font-weight:700}
.spec dt:nth-last-of-type(1),.spec dd:nth-last-of-type(1){border-bottom:0}

/* セール価格（通常価格を打ち消し線、セール価格を強調）
   価格の取得と表示: --cta は CTA ボタンと .pricebadge 以外で使わない方針
   のため、強調色は他の数値強調と同じ --data を使う。 */
.spec del,.cta__sub del{color:var(--ink-3);text-decoration:line-through;font-weight:400;margin-right:.4em}
.spec ins,.cta__sub ins{color:var(--data);text-decoration:none;font-weight:700}

/* カードに付ける割引ラベル（この用途に限り --cta を使ってよい） */
.pricebadge{display:inline-block;margin-left:6px;padding:2px 7px;border-radius:4px;background:var(--cta);color:#fff;font-size:10.5px;font-weight:700;line-height:1.6;vertical-align:middle}

/* cta */
.cta{display:block;background:var(--cta);color:#fff;text-align:center;font-size:16px;font-weight:700;
  padding:16px 18px;border-radius:7px;letter-spacing:.02em}
.cta:active{background:var(--cta-press)}
.cta__sub{text-align:center;font-size:11.5px;color:var(--ink-2);margin-top:7px}
.ctabox{margin:20px 0 8px}

h2{font-size:17px;font-weight:700;line-height:1.5;margin:34px 0 12px;padding-left:11px;border-left:3px solid var(--data)}
h3{font-size:14.5px;font-weight:700;margin:20px 0 6px}
p{margin-bottom:14px;font-size:14.5px}

/* matrix */
table.mx{width:100%;border-collapse:collapse;font-size:13.5px}
.mx th,.mx td{border:1px solid var(--rule);padding:9px 8px;text-align:center}
.mx thead th{background:var(--paper-2);font-size:12px;font-weight:600;color:var(--ink-2)}
.mx tbody th{background:var(--paper-2);text-align:left;font-weight:600;font-size:13px;white-space:nowrap}
.mx .v{font-family:"Barlow Condensed",sans-serif;font-weight:700;color:var(--data);font-size:15px}
.mx .v small{display:block;font-size:9.5px;color:var(--ink-3);font-weight:500}
.mx .z{color:var(--ink-3)}

/* scene log（チャプター単位でグルーピング表示） */
.log{border-top:1px solid var(--rule);font-size:13.5px}
.log__ch{padding:10px 0 4px;font-size:12px;font-weight:700;color:var(--data);letter-spacing:.02em}
.log__ch:not(:first-child){margin-top:6px;border-top:1px solid var(--rule)}
.log__r{display:grid;grid-template-columns:26px 1fr auto;gap:10px;padding:10px 0;border-bottom:1px solid var(--rule);align-items:center}
.log__n{font-family:"Barlow Condensed",sans-serif;font-weight:700;color:var(--ink-3);text-align:center;font-size:14px}
.log__p b{font-weight:700}
.log__p span{color:var(--ink-2);font-size:12px;margin-left:6px}
.log__m{font-family:"Barlow Condensed",sans-serif;font-weight:700;color:var(--data);font-size:16px}
.log__m i{font-style:normal;font-size:10px;color:var(--ink-2);margin-left:1px}

/* 見どころ */
.kj-hl{border:1px solid var(--rule);border-radius:8px;padding:14px 16px 4px;margin:18px 0}
.kj-hl__lab{display:inline-block;background:var(--data);color:#fff;font-size:11px;font-weight:700;padding:3px 10px;border-radius:4px;letter-spacing:.04em;margin-bottom:8px}
.kj-hl ul{list-style:none}
.kj-hl li{position:relative;padding:10px 0 10px 16px;border-bottom:1px solid var(--rule);font-size:14px;line-height:1.7}
.kj-hl li:last-child{border-bottom:0}
.kj-hl li::before{content:"";position:absolute;left:0;top:19px;width:6px;height:6px;border-radius:50%;background:var(--data)}

/* オススメ度（星は unicode グリフをグレー/--data の2層に重ねてクリップ表示。
   画像・アイコンフォント・JS は使わない。--cta は使わない） */
.kj-score{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;margin:14px 0;color:var(--ink-2)}
.kj-score__stars{position:relative;display:inline-block;font-size:17px;line-height:1;letter-spacing:2px}
.kj-score__stars-bg{color:var(--paper-3)}
.kj-score__stars-fg{position:absolute;top:0;left:0;overflow:hidden;white-space:nowrap;color:var(--data)}
.kj-score__num{font-size:16px;color:var(--data)}
.kj-score a{color:var(--data);border-bottom:1px solid currentColor;font-size:11.5px}

/* 公開日・更新日 */
.kj-date{font-size:12px;color:var(--ink-3);text-align:center;margin:10px 0 20px}

/* 目次（page-summary.php と共通のクラス名。hero+CTA(1回目)の下、
   CTAより下・本文より上に置く） */
.kj-toc{border:1px solid var(--rule);border-radius:8px;padding:14px 16px;margin:20px 0;font-size:13px}
.kj-toc strong{display:block;margin-bottom:8px;font-size:13px}
.kj-toc ol{list-style:none;counter-reset:kj-toc}
.kj-toc li{counter-increment:kj-toc;padding:7px 0;border-top:1px solid var(--rule)}
.kj-toc li:first-child{border-top:0}
.kj-toc a{color:var(--data)}
.kj-toc a::before{content:counter(kj-toc) ". ";color:var(--ink-3)}

/* related */
.rel{display:grid;grid-template-columns:1fr;gap:11px}
@media(min-width:560px){.rel{grid-template-columns:1fr 1fr}}
.rc{display:grid;grid-template-columns:96px 1fr;gap:11px;border:1px solid var(--rule);border-radius:6px;overflow:hidden}
.rc__i{background:var(--paper-3) repeating-linear-gradient(135deg,rgba(255,255,255,.5) 0 6px,transparent 6px 12px)}
.rc__i img{width:100%;height:100%;object-fit:cover}
.rc__b{padding:9px 11px 10px 0}
.rc__t{font-size:13px;font-weight:700;line-height:1.5}
.rc__a{font-size:11px;color:var(--ink-2);margin-top:2px}
.rc__d{font-family:"Barlow Condensed",sans-serif;font-size:16px;font-weight:700;color:var(--data);margin-top:5px}
.rc__d i{font-style:normal;font-size:10px;color:var(--ink-2)}

.note{background:var(--paper-2);border-left:3px solid var(--rule-2);padding:12px 14px;font-size:12.5px;color:var(--ink-2);line-height:1.75;border-radius:0 4px 4px 0}
.note a{color:var(--data);border-bottom:1px solid currentColor}

/* ==========================================================================
   6. まとめ記事 — .kj-item .kj-astats .kj-related（page-summary.php）
   ========================================================================== */

/* [kj_item]: 各作品は h3。メダル・王冠等の装飾は使わない（既存方針） */
.kj-item{border:1px solid var(--rule);border-radius:8px;padding:16px;margin:20px 0}
.kj-item__h{display:flex;align-items:flex-start;gap:10px;margin:0 0 12px;font-size:16px;line-height:1.5;border:0;padding:0}
.kj-item__rank{flex:0 0 auto;font-family:"Barlow Condensed",sans-serif;font-size:30px;font-weight:700;line-height:1;color:var(--data)}
.kj-item__h a{color:inherit;text-decoration:underline;text-decoration-color:var(--rule-2)}
.kj-item__mv{margin:0 0 12px;border-radius:6px;overflow:hidden}
.kj-item__mv img{width:100%;height:auto;display:block}
.kj-item__why{margin:14px 0;padding:12px 14px;background:var(--paper-2);border-radius:6px}
.kj-item__lab{font-size:11px;font-weight:700;color:var(--data);letter-spacing:.04em;margin-bottom:6px}
.kj-item__why p:last-child{margin-bottom:0}
.kj-item__more{text-align:right;font-size:12.5px}
.kj-item__more a{color:var(--data);border-bottom:1px solid currentColor}

/* [kj_actress_stats]: .spec のスタイルを流用（dl/dt/dd/.hl は共通） */
.kj-astats{border:1px solid var(--rule);border-radius:8px;padding:14px 16px;margin:16px 0}
.kj-astats__lab{font-size:11px;font-weight:700;color:var(--data);letter-spacing:.04em;margin-bottom:8px}
.kj-astats__note{font-size:12.5px;color:var(--ink-2);margin-top:10px}
.kj-astats__note a{color:var(--data);border-bottom:1px solid currentColor}
.kj-astats__cast{font-size:12px;color:var(--ink-2);margin-top:8px}
.kj-astats__cast a{color:inherit}

/* [kj_criteria_stats]: .kj-astats と同じ見た目を流用 */
.kj-cstats{border:1px solid var(--rule);border-radius:8px;padding:14px 16px;margin:16px 0}
.kj-cstats__lab{font-size:11px;font-weight:700;color:var(--data);letter-spacing:.04em;margin-bottom:8px}
.kj-cstats__note{font-size:12.5px;color:var(--ink-2);margin-top:10px}
.kj-cstats__note a{color:var(--data);border-bottom:1px solid currentColor}
.kj-cstats-empty{background:var(--paper-2);border-left:3px solid var(--rule-2);padding:10px 14px;font-size:12.5px;color:var(--ink-2);border-radius:0 4px 4px 0}

/* 関連まとめ: .plist/.prow の誤流用（説明文前提のレイアウト）をやめ、
   専用の1行1リンクリストにする */
.kj-related{list-style:none;border-top:1px solid var(--rule)}
.kj-related li{border-bottom:1px solid var(--rule)}
.kj-related a{display:block;padding:11px 2px;color:var(--data);font-size:13.5px}

/* [kj_compare] / [kj_ranking] の比較表。モックに存在しないコンポーネント
   だったため CSS が抜けていた（実機で確認済みのバグ）。狭幅では
   data-label 属性を見出しにしたカード型に切り替える。 */
.kj-compare-table{width:100%;border-collapse:collapse;font-size:13px;margin:16px 0}
.kj-compare-table th,.kj-compare-table td{border:1px solid var(--rule);padding:8px 10px;text-align:center}
.kj-compare-table thead th{background:var(--paper-2);font-size:11.5px;font-weight:600;color:var(--ink-2)}
.kj-compare-table td[data-label="作品名"]{text-align:left;font-weight:700}
.kj-compare-table td[data-label="作品名"] a{color:inherit}
.kj-compare-table td:last-child a{color:var(--data)}
.kj-compare-table tbody tr:nth-child(even){background:var(--paper-2)}

@media(max-width:640px){
  .kj-compare-table thead{display:none}
  .kj-compare-table,.kj-compare-table tbody,.kj-compare-table tr,.kj-compare-table td{display:block;width:100%}
  .kj-compare-table tr{border:1px solid var(--rule);border-radius:8px;margin-bottom:10px;overflow:hidden}
  .kj-compare-table td{display:flex;justify-content:space-between;align-items:center;gap:10px;border:0;border-bottom:1px solid var(--rule);text-align:right;padding:8px 12px}
  .kj-compare-table td:last-child{border-bottom:0}
  .kj-compare-table td::before{content:attr(data-label);color:var(--ink-2);font-size:11.5px;text-align:left}
  .kj-compare-table td[data-label="作品名"]{flex-direction:column;align-items:flex-start;text-align:left}
  .kj-compare-table td[data-label="作品名"]::before{margin-bottom:2px}
}

/* ==========================================================================
   7. /actress/ 出演者ハブ — .kj-arank .kj-alist（page-hub-actress.php）
   ========================================================================== */

.kj-arank{list-style:none}
.kj-arank__row{display:grid;grid-template-columns:26px 44px 1fr auto;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid var(--rule)}
.kj-arank__n{font-family:"Barlow Condensed",sans-serif;font-size:19px;font-weight:700;color:var(--data);text-align:center}
.kj-arank__img{display:block;width:44px;height:44px;border-radius:50%;overflow:hidden;background:var(--paper-3) repeating-linear-gradient(135deg,rgba(255,255,255,.5) 0 4px,transparent 4px 8px)}
.kj-arank__img img{width:100%;height:100%;object-fit:cover;display:block}
.kj-arank__body{min-width:0}
.kj-arank__name{display:block;font-size:14.5px;font-weight:700;color:var(--ink)}
.kj-arank__sub{display:block;font-size:11.5px;color:var(--ink-2);margin-top:2px;line-height:1.6}
.kj-arank__val{font-size:22px;color:var(--data);white-space:nowrap}
.kj-arank__val i{font-style:normal;font-size:11px;color:var(--ink-2);margin-left:2px}

.kj-alist{list-style:none;border-top:1px solid var(--rule)}
.kj-alist li{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--rule);font-size:13.5px}
.kj-alist a{color:var(--data)}
.kj-alist span{font-size:11.5px;color:var(--ink-2);white-space:nowrap}

/* ==========================================================================
   8. /position/ 体勢ハブ・404 — .kj-poslist .kj-search-form
   ========================================================================== */

/* [ハブページ3種と404 §1] 体勢名を主役に。件数は右に小さく（旧 .prow の
   「件数が大きく左」を反省し、専用クラスで作り直した）。 */
.kj-poslist__row{padding:18px 0;border-bottom:1px solid var(--rule)}
.kj-poslist__head{display:flex;align-items:baseline;justify-content:space-between;gap:10px;color:inherit}
.kj-poslist__name{font-size:16px;font-weight:700;color:var(--ink)}
.kj-poslist__count{font-size:14px;font-weight:700;color:var(--data);white-space:nowrap}
.kj-poslist__count i{font-style:normal;font-size:11px;color:var(--ink-2);margin-left:2px}
.kj-poslist__desc{font-size:13px;color:var(--ink-2);margin-top:6px;line-height:1.65}
.kj-poslist__desc p{margin:0;font-size:inherit;color:inherit}
.kj-poslist__cards{margin-top:14px}

/* 404 検索フォーム */
.kj-search-form{display:flex;gap:8px;margin:18px 0}
.kj-search-form input[type="search"]{
  flex:1;
  padding:11px 12px;
  font-size:15px;
  font-family:inherit;
  color:var(--ink);
  background:var(--paper);
  border:1px solid var(--rule);
  border-radius:6px;
}
.kj-search-form input[type="search"]:focus{outline:none;border-color:var(--data);box-shadow:0 0 0 3px var(--data-bg)}
.kj-search-form button{
  padding:11px 20px;
  font-size:14px;
  font-weight:700;
  color:#fff;
  background:var(--cta);
  border:0;
  border-radius:6px;
  cursor:pointer;
}
.kj-search-form button:hover,.kj-search-form button:active{background:var(--cta-press)}

/* ==========================================================================
   9. 年齢認証（モックには含まれないが法的要件のため維持。新トークンで再配色）
   ========================================================================== */

#kj-age-gate{position:fixed;inset:0;background:var(--paper);color:var(--ink);z-index:999999;display:flex;align-items:center;justify-content:center;text-align:center;padding:24px}
#kj-age-gate.is-hidden{display:none}
#kj-age-gate .kj-age-gate-inner{max-width:28em}
#kj-age-gate .kj-age-gate-inner p{font-size:16px;color:var(--ink)}
#kj-age-gate .kj-age-gate-buttons{margin-top:20px;display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
#kj-age-gate button{min-height:44px;padding:0.7em 2em;font-size:15px;font-weight:700;font-family:inherit;border:1px solid var(--rule);border-radius:6px;cursor:pointer;background:var(--paper);color:var(--ink)}
#kj-age-gate-yes{background:var(--cta);color:#fff;border-color:var(--cta)}
#kj-age-gate-yes:active{background:var(--cta-press)}

/* ==========================================================================
   10. アクセシビリティ（モックに無いが安全のため維持）
   ========================================================================== */

a:focus-visible,button:focus-visible,input:focus-visible{outline:2px solid var(--data);outline-offset:2px}

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

/* ==========================================================================
   11. お問い合わせフォーム（Contact Form 7 想定） — /contact/ は page.php
   （汎用の <main class="wrap narrow"><article><h1>...</h1>the_content()）
   で表示されるため、専用テンプレートは無い。CF7 が自動で付ける
   .wpcf7-form-control / .wpcf7-submit を対象にしているので、フォーム
   テンプレートを初期状態のままにしても効く。
   ========================================================================== */

.wpcf7-form p{margin-bottom:18px}
.wpcf7-form label{display:block;font-size:13.5px;font-weight:700;margin-bottom:6px}

.wpcf7-form-control:not(.wpcf7-submit){
  width:100%;
  padding:11px 12px;
  font-size:15px;
  font-family:inherit;
  color:var(--ink);
  background:var(--paper);
  border:1px solid var(--rule);
  border-radius:6px;
  transition:border-color .15s,box-shadow .15s;
}
.wpcf7-form textarea.wpcf7-form-control{min-height:160px;resize:vertical}
.wpcf7-form-control:not(.wpcf7-submit):focus{
  outline:none;
  border-color:var(--data);
  box-shadow:0 0 0 3px var(--data-bg);
}
.wpcf7-form-control.wpcf7-not-valid{border-color:var(--cta)}
.wpcf7-not-valid-tip{display:block;margin-top:6px;font-size:12px;color:var(--cta)}

.wpcf7-submit{
  display:block;
  width:100%;
  background:var(--cta);
  color:#fff;
  font-size:16px;
  font-weight:700;
  padding:14px 18px;
  border:0;
  border-radius:7px;
  letter-spacing:.02em;
  cursor:pointer;
}
.wpcf7-submit:hover,.wpcf7-submit:active{background:var(--cta-press)}
.wpcf7-submit:disabled{opacity:.5;cursor:default}
.wpcf7-spinner{margin-left:10px;vertical-align:middle}

.wpcf7-response-output{
  margin-top:20px;
  padding:12px 14px;
  border-radius:6px;
  font-size:13.5px;
  border:1px solid var(--rule);
  background:var(--paper-2);
  color:var(--ink-2);
}
.wpcf7-form.sent .wpcf7-response-output{border-color:var(--data);background:var(--data-bg);color:var(--ink)}
.wpcf7-form.failed .wpcf7-response-output,
.wpcf7-form.aborted .wpcf7-response-output,
.wpcf7-form.spam .wpcf7-response-output{border-color:var(--cta);background:rgba(214,19,79,.08);color:var(--ink)}