/*
Theme Name: Pochimae Lab
Theme URI: https://carstudiochannel.com/
Author: ポチ前ラボ編集部
Description: 楽天アフィリエイト向けの軽量テーマ。日本の検証系ムック誌の誌面を下敷きにした、罫線と余白で組む設計。PR表記の自動挿入、目次の自動生成、アフィリエイトリンクへの rel 自動付与を内蔵しています。
Version: 3.2.0
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: pochimae
Tags: blog, two-columns, right-sidebar, custom-menu, translation-ready
*/

/* ==========================================================================
   1. Design tokens

   紙・墨・朱の三色。構造は罫線で作り、面（カード）は使いません。
   朱は価格と判定記号にだけ使います。ここを守ることが誌面らしさの条件です。
   ========================================================================== */
:root{
  --paper:#FCFBF9;          /* 紙 */
  --paper-2:#F4F1EC;        /* 敷き色（表のヘッダなど） */
  --surface:#FFFFFF;
  --ink:#14120F;            /* 墨 */
  --ink-2:#443E36;
  --ink-3:#8A8175;          /* 添え字 */
  --rule:#DFD9CF;           /* 細罫 */
  --rule-2:#B9B1A4;         /* 中罫 */
  --red:#C1272D;            /* 朱：価格・判定・セール */
  --red-soft:#F7ECEA;
  --indigo:#1F3A5F;         /* 藍：リンク・柱 */
  --on-ink:#FCFBF9;
  /* Webフォントが落ちても明朝のままでいるよう、OS標準の明朝を必ず後ろに置きます。
     ここをserifだけで終わらせると、環境によってゴシックに化けて誌面が崩れます。 */
  --sans:"Zen Kaku Gothic New","Hiragino Kaku Gothic ProN","Yu Gothic","Noto Sans JP","Noto Sans CJK JP",system-ui,sans-serif;
  --serif:"Shippori Mincho B1","Hiragino Mincho ProN","Yu Mincho","Noto Serif JP","Noto Serif CJK JP","MS PMincho",serif;
  --wrap:1080px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#131210;
    --paper-2:#1E1B17;
    --surface:#191714;
    --ink:#EFEAE1;
    --ink-2:#C3BCB1;
    --ink-3:#8D8579;
    --rule:#302B25;
    --rule-2:#4A433A;
    --red:#E5705F;
    --red-soft:#2A1C1A;
    --indigo:#8FB0DA;
    --on-ink:#131210;
  }
}
:root[data-theme="dark"]{
  --paper:#131210;
  --paper-2:#1E1B17;
  --surface:#191714;
  --ink:#EFEAE1;
  --ink-2:#C3BCB1;
  --ink-3:#8D8579;
  --rule:#302B25;
  --rule-2:#4A433A;
  --red:#E5705F;
  --red-soft:#2A1C1A;
  --indigo:#8FB0DA;
  --on-ink:#131210;
}

/* ==========================================================================
   2. Base
   ========================================================================== */
*,*::before,*::after{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{
  margin:0;
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:15.5px;
  line-height:1.9;
  -webkit-font-smoothing:antialiased;
  overflow-wrap:break-word;
  overflow-x:clip;
}
a{color:inherit;}
h1,h2,h3,h4,h5,h6{margin:0;line-height:1.45;}
p{margin:0;}
ul,ol{margin:0;padding:0;}
img,iframe,video{max-width:100%;height:auto;}
figure{margin:0;}
table{border-collapse:collapse;}
:focus-visible{outline:2px solid var(--indigo);outline-offset:2px;}
.screen-reader-text{
  position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;
  overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;
}
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:200;
  background:var(--ink);color:var(--on-ink);padding:10px 18px;
}
.skip-link:focus{left:8px;top:8px;}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;}}

/* 見出し・大きな数字だけに詰め（palt）をかけます。本文にかけると、
   行間の広い和文が逆に読みにくくなります。 */
.logo-mark,.band-title,.entry-title,.card-title,.cat b,.sec-head h2,
.page-head h1,.entry-content h2,.verdict h3,.buy-info b,.related b,
.metric b,.spec-item b,.buy-price{font-feature-settings:"palt" 1;}

/* 小見出しラベル：等幅英字はやめ、和文ゴシックの小サイズで組みます */
.label{
  font-size:11.5px;font-weight:700;letter-spacing:.1em;
  color:var(--ink-3);line-height:1.6;
}
.num{font-variant-numeric:tabular-nums;font-feature-settings:"palt" 0;}

/* ==========================================================================
   3. Masthead
   ========================================================================== */
.site-head{background:var(--paper);border-bottom:2px solid var(--ink);}
.head-in{
  max-width:var(--wrap);margin:0 auto;padding:22px 20px 16px;
  display:flex;align-items:flex-end;gap:20px;
}
.logo{display:flex;align-items:baseline;gap:12px;text-decoration:none;}
.logo-mark{
  font-family:var(--serif);font-weight:800;font-size:27px;
  letter-spacing:.06em;color:var(--ink);line-height:1;
}
.logo-mark em{font-style:normal;color:var(--red);}
.logo-sub{
  font-size:10px;letter-spacing:.18em;color:var(--ink-3);
  text-transform:uppercase;padding-bottom:2px;
}
.head-search{margin-left:auto;}
.searchform{
  display:flex;align-items:center;gap:8px;
  border:0;border-bottom:1px solid var(--rule-2);
  padding:3px 2px;background:transparent;
}
.searchform svg{flex:none;color:var(--ink-3);}
.searchform input[type="search"]{
  border:0;background:transparent;color:var(--ink);
  font-family:var(--sans);font-size:13px;width:150px;min-width:0;padding:2px 0;
}
.searchform input[type="search"]::placeholder{color:var(--ink-3);}
.searchform input[type="search"]:focus{outline:none;}
.searchform button{
  border:0;background:transparent;color:var(--ink-2);cursor:pointer;
  font-family:var(--sans);font-size:12px;font-weight:700;padding:0;letter-spacing:.08em;
}

@media (max-width:640px){
  .head-in{flex-wrap:wrap;align-items:center;gap:10px;padding:16px 16px 12px;}
  .logo{flex:1 1 auto;min-width:0;}
  .logo-mark{font-size:22px;}
  .logo-sub{display:none;}
  .head-search{margin-left:0;flex:1 1 100%;}
  .searchform{width:100%;}
  .searchform input[type="search"]{flex:1 1 auto;width:auto;}
}

.nav{background:var(--paper);border-bottom:1px solid var(--rule);}
.nav-in{max-width:var(--wrap);margin:0 auto;padding:0 20px;}
@media (max-width:640px){.nav-in{padding:0 16px;}}
.nav ul{display:flex;list-style:none;overflow-x:auto;scrollbar-width:none;}
.nav ul::-webkit-scrollbar{display:none;}
.nav li{flex:none;}
.nav a{
  display:block;text-decoration:none;font-size:13.5px;font-weight:500;
  padding:12px 20px 11px;color:var(--ink-2);white-space:nowrap;
  border-bottom:2px solid transparent;margin-bottom:-1px;
}
.nav li + li a{border-left:1px solid var(--rule);}
.nav a:hover{color:var(--ink);}
.nav .current-menu-item > a,
.nav .current-menu-parent > a,
.nav .current-post-ancestor > a{
  color:var(--ink);border-bottom-color:var(--ink);font-weight:700;
}

/* ==========================================================================
   4. Layout
   ========================================================================== */
.wrap{max-width:var(--wrap);margin:0 auto;padding:34px 20px 72px;}
@media (max-width:640px){.wrap{padding:24px 16px 52px;}}
.cols{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:0;align-items:stretch;}
.cols > *{min-width:0;}
.cols > .side{
  padding-left:30px;margin-left:30px;
  border-left:1px solid var(--rule);
}
/* minmax(0,1fr), never plain 1fr: an auto minimum lets the comparison table's
   min-width push the whole column wider than the phone viewport. */
@media (max-width:900px){
  .cols{grid-template-columns:minmax(0,1fr);}
  .cols > .side{padding-left:0;margin-left:0;border-left:0;border-top:2px solid var(--ink);margin-top:44px;padding-top:24px;}
}
.stack{display:flex;flex-direction:column;gap:44px;min-width:0;}
.stack-sm{display:flex;flex-direction:column;}
.stack-xs{display:flex;flex-direction:column;gap:6px;}

/* 見出し罫：短い太罫を上に置く、雑誌の見出しの作り方 */
.sec-head{
  display:flex;align-items:baseline;gap:14px;
  border-top:2px solid var(--ink);padding-top:10px;margin-bottom:6px;
}
.sec-head h2{
  font-family:var(--serif);font-weight:700;font-size:19px;letter-spacing:.04em;
}
.sec-head .more{
  margin-left:auto;font-size:12px;color:var(--ink-3);text-decoration:none;
  letter-spacing:.04em;
}
.sec-head .more:hover{color:var(--ink);}

/* ==========================================================================
   5. 特集ブロック（トップ最上部）
   数字が主役。カードにはしません。
   ========================================================================== */
.band{
  display:block;text-decoration:none;color:inherit;
  border-top:4px solid var(--ink);border-bottom:1px solid var(--rule);
  padding:18px 0 20px;
}
.band-tag{
  display:inline-block;font-size:11.5px;font-weight:700;letter-spacing:.12em;
  color:var(--red);
}
.band-title{
  display:block;font-family:var(--serif);font-weight:700;
  font-size:clamp(22px,3vw,31px);line-height:1.4;letter-spacing:.02em;
  margin-top:6px;
}
a.band:hover .band-title{text-decoration:underline;text-underline-offset:5px;}
.band-meta{display:flex;margin-top:18px;flex-wrap:wrap;}
.metric{
  display:flex;flex-direction:column;line-height:1.2;
  padding:0 26px;border-left:1px solid var(--rule);
}
.metric:first-child{padding-left:0;border-left:0;}
.metric b{
  font-size:31px;font-weight:700;color:var(--ink);
  font-variant-numeric:tabular-nums;font-feature-settings:"palt" 0;
  letter-spacing:-.01em;
}
.metric span{font-size:11px;color:var(--ink-3);letter-spacing:.08em;margin-top:3px;}
@media (max-width:560px){
  .metric{padding:0 16px;}
  .metric b{font-size:24px;}
}

/* ==========================================================================
   6. カテゴリ（罫で区切った一列）
   ========================================================================== */
.cat-grid{
  display:grid;grid-template-columns:repeat(5,1fr);
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
}
@media (max-width:860px){.cat-grid{grid-template-columns:repeat(2,1fr);}}
.cat{
  display:flex;flex-direction:column;gap:2px;text-decoration:none;
  padding:14px 18px;border-left:1px solid var(--rule);
  transition:background .15s;
}
.cat:first-child{border-left:0;}
@media (max-width:860px){
  .cat:nth-child(odd){border-left:0;}
  .cat:nth-child(n+3){border-top:1px solid var(--rule);}
}
.cat:hover{background:var(--paper-2);}
.cat b{font-family:var(--serif);font-size:16px;font-weight:700;letter-spacing:.03em;}
.cat span{font-size:11.5px;color:var(--ink-3);line-height:1.7;}
.cat .n{
  font-size:11px;color:var(--ink-3);margin-top:auto;padding-top:8px;
  font-variant-numeric:tabular-nums;
}

/* ==========================================================================
   7. 記事一覧（誌面の目次のように、罫で区切る）
   ========================================================================== */
.card{
  display:grid;grid-template-columns:168px minmax(0,1fr);gap:22px;
  padding:22px 0;border-bottom:1px solid var(--rule);
  text-decoration:none;align-items:start;
}
.card:first-child{border-top:1px solid var(--rule);}
.card:hover .card-title{text-decoration:underline;text-underline-offset:4px;}
.card:hover .thumb img{transform:scale(1.03);}
@media (max-width:560px){.card{grid-template-columns:104px minmax(0,1fr);gap:14px;padding:18px 0;}}
.thumb{
  aspect-ratio:4/3;position:relative;overflow:hidden;
  background:var(--paper-2);border:1px solid var(--rule);
  display:grid;place-items:center;padding:8px;
}
.thumb img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  transition:transform .3s ease;
}
.thumb b{
  font-family:var(--serif);font-size:12px;font-weight:700;
  color:var(--ink-3);line-height:1.5;text-align:center;letter-spacing:.02em;
  position:relative;
}
/* 画像がないときの受け皿。空の灰色ではなく、方眼紙に見えるようにします */
.thumb.is-placeholder::before{
  content:"";position:absolute;inset:0;
  background-image:linear-gradient(var(--rule) 1px,transparent 1px),
                   linear-gradient(90deg,var(--rule) 1px,transparent 1px);
  background-size:13px 13px;opacity:.5;
}
.card-title{
  font-family:var(--serif);font-size:18px;font-weight:700;
  line-height:1.55;letter-spacing:.02em;margin:5px 0 6px;
}
@media (max-width:560px){.card-title{font-size:16px;}}
.card-ex{font-size:12.5px;color:var(--ink-3);line-height:1.85;}
.card-meta{
  display:flex;gap:12px;align-items:center;flex-wrap:wrap;
  font-size:11px;color:var(--ink-3);letter-spacing:.04em;
  font-variant-numeric:tabular-nums;
}

/* ラベル：ピルではなく、罫で囲った小さな箱 */
.chip{
  font-size:10.5px;font-weight:700;letter-spacing:.08em;
  padding:1px 7px;border:1px solid var(--rule-2);color:var(--ink-2);
}
.chip.sale{border-color:var(--red);color:var(--red);}
.chip.photo{background:var(--ink);border-color:var(--ink);color:var(--on-ink);}

/* ==========================================================================
   7b. トップの主役記事（ヒーロー）と、2段組の記事グリッド
   画像を大きく出す場所をここに集約します。
   ========================================================================== */
.hero{
  display:block;text-decoration:none;color:inherit;
  border-top:4px solid var(--ink);
}
.hero-media{
  position:relative;overflow:hidden;aspect-ratio:16/9;
  background:var(--paper-2);border-bottom:1px solid var(--rule);
}
.hero-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .4s ease;}
.hero:hover .hero-media img{transform:scale(1.02);}
.hero-media.is-placeholder::before{
  content:"";position:absolute;inset:0;
  background-image:linear-gradient(var(--rule) 1px,transparent 1px),
                   linear-gradient(90deg,var(--rule) 1px,transparent 1px);
  background-size:22px 22px;opacity:.5;
}
.hero-media .ph-label{
  position:absolute;inset:0;display:grid;place-items:center;
  font-family:var(--serif);font-size:17px;font-weight:700;color:var(--ink-3);
  letter-spacing:.06em;
}
.hero-body{padding:18px 0 8px;}
.hero-meta{
  display:flex;gap:12px;align-items:center;flex-wrap:wrap;
  font-size:11px;color:var(--ink-3);letter-spacing:.04em;
  font-variant-numeric:tabular-nums;margin-bottom:9px;
}
.hero-title{
  font-family:var(--serif);font-weight:700;font-feature-settings:"palt" 1;
  font-size:clamp(22px,3.1vw,33px);line-height:1.45;letter-spacing:.02em;
}
.hero:hover .hero-title{text-decoration:underline;text-underline-offset:6px;}
.hero-ex{
  font-size:13.5px;color:var(--ink-3);line-height:1.95;
  margin-top:11px;max-width:44em;
}

.grid2{
  display:grid;grid-template-columns:repeat(2,1fr);
  border-top:1px solid var(--rule);
}
@media (max-width:640px){.grid2{grid-template-columns:1fr;}}
.gcard{
  display:block;text-decoration:none;color:inherit;
  padding:20px 0 22px;border-bottom:1px solid var(--rule);
}
.grid2 > .gcard:nth-child(odd){padding-right:22px;border-right:1px solid var(--rule);}
.grid2 > .gcard:nth-child(even){padding-left:22px;}
@media (max-width:640px){
  .grid2 > .gcard:nth-child(odd){padding-right:0;border-right:0;}
  .grid2 > .gcard:nth-child(even){padding-left:0;}
}
.gcard-media{
  position:relative;overflow:hidden;aspect-ratio:16/10;
  background:var(--paper-2);border:1px solid var(--rule);margin-bottom:13px;
}
.gcard-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s ease;}
.gcard:hover .gcard-media img{transform:scale(1.03);}
.gcard-media.is-placeholder::before{
  content:"";position:absolute;inset:0;
  background-image:linear-gradient(var(--rule) 1px,transparent 1px),
                   linear-gradient(90deg,var(--rule) 1px,transparent 1px);
  background-size:16px 16px;opacity:.5;
}
.gcard-media .ph-label{
  position:absolute;inset:0;display:grid;place-items:center;padding:10px;
  font-family:var(--serif);font-size:13px;font-weight:700;color:var(--ink-3);
  text-align:center;line-height:1.6;
}
.gcard-title{
  font-family:var(--serif);font-size:17px;font-weight:700;
  font-feature-settings:"palt" 1;line-height:1.55;letter-spacing:.02em;margin:6px 0 7px;
}
.gcard:hover .gcard-title{text-decoration:underline;text-underline-offset:4px;}
.gcard-ex{font-size:12.5px;color:var(--ink-3);line-height:1.85;}

/* ==========================================================================
   8. サイドバー（囲みをやめ、見出し罫で区切る）
   ========================================================================== */
.side{display:flex;flex-direction:column;gap:32px;}
.card-box,
.side .widget{background:transparent;border:0;padding:0;}
.card-box > h3,
.side .widget .widget-title{
  font-family:var(--serif);font-size:14px;font-weight:700;letter-spacing:.06em;
  color:var(--ink);margin:0 0 12px;padding-top:8px;
  border-top:1px solid var(--ink);
}
.who{font-size:12.5px;color:var(--ink-2);line-height:1.95;}
.who p{margin:0 0 .9em;}
.who p:last-child{margin-bottom:0;}
.rank{display:flex;flex-direction:column;}
.rank a{
  display:flex;gap:11px;text-decoration:none;font-size:12.5px;line-height:1.75;
  align-items:baseline;padding:9px 0;border-bottom:1px solid var(--rule);
}
.rank a:last-child{border-bottom:0;}
.rank a:hover .t{text-decoration:underline;text-underline-offset:3px;}
.rank .no{
  font-family:var(--serif);font-size:13px;font-weight:700;color:var(--red);
  flex:none;font-variant-numeric:tabular-nums;min-width:12px;
}
.side .widget ul{list-style:none;display:flex;flex-direction:column;}
.side .widget li{border-bottom:1px solid var(--rule);}
.side .widget li:last-child{border-bottom:0;}
.side .widget li a{display:block;text-decoration:none;font-size:12.5px;line-height:1.75;padding:9px 0;}
.side .widget li a:hover{text-decoration:underline;text-underline-offset:3px;}

/* ==========================================================================
   9. 目次
   ========================================================================== */
.toc ol{list-style:none;counter-reset:toc;padding:0;margin:0;}
.toc li{counter-increment:toc;border-bottom:1px solid var(--rule);}
.toc li:last-child{border-bottom:0;}
.toc li.lv3{counter-increment:none;}
.toc a{
  display:flex;gap:10px;text-decoration:none;font-size:12.5px;line-height:1.7;
  align-items:baseline;padding:9px 0;
}
.toc li.lv2 > a::before{
  content:counter(toc);
  font-family:var(--serif);font-size:12.5px;font-weight:700;color:var(--red);
  flex:none;min-width:11px;font-variant-numeric:tabular-nums;
}
.toc li.lv3 > a{padding-left:21px;color:var(--ink-3);font-size:12px;}
.toc li.lv3 > a::before{
  content:"";flex:none;width:9px;height:1px;background:var(--rule-2);
  align-self:center;margin-left:-19px;margin-right:9px;
}
.toc a:hover{text-decoration:underline;text-underline-offset:3px;}

/* ==========================================================================
   10. 記事本文
   ========================================================================== */
.crumb{font-size:11.5px;color:var(--ink-3);margin-bottom:20px;letter-spacing:.04em;}
.crumb a{text-decoration:none;}
.crumb a:hover{text-decoration:underline;text-underline-offset:3px;}
.pr-notice{
  font-size:11.5px;color:var(--ink-3);line-height:1.8;
  border-left:2px solid var(--rule-2);padding:2px 0 2px 12px;margin-bottom:22px;
}
.entry-title{
  font-family:var(--serif);font-weight:700;
  font-size:clamp(25px,3.4vw,36px);line-height:1.5;letter-spacing:.015em;
}
.entry-meta{
  display:flex;gap:16px;font-size:11.5px;color:var(--ink-3);
  margin-top:16px;padding-bottom:14px;border-bottom:2px solid var(--ink);
  align-items:center;flex-wrap:wrap;letter-spacing:.04em;
  font-variant-numeric:tabular-nums;
}

/* 誌面の組み方：図版・表・データ帯は段いっぱいに、本文だけ34emに絞ります。
   本文と同じ幅に表を押し込めると、読み幅も表も両方が窮屈になります。 */
.entry-content{margin-top:30px;}
.entry-content > *{margin:0 0 1.6em;}
.entry-content > p,
.entry-content > ul,
.entry-content > ol,
.entry-content > blockquote,
.entry-content > h3{max-width:34em;}
.entry-content p{font-size:15.5px;line-height:2.1;color:var(--ink-2);}
.entry-content h2{
  font-family:var(--serif);font-size:23px;font-weight:700;letter-spacing:.03em;
  margin:2.6em 0 1em;padding-top:12px;border-top:2px solid var(--ink);
  scroll-margin-top:20px;color:var(--ink);
}
.entry-content h3{
  font-size:16.5px;font-weight:700;margin:2.2em 0 .8em;color:var(--ink);
  scroll-margin-top:20px;padding-left:11px;border-left:3px solid var(--rule-2);
}
.entry-content strong{color:var(--ink);font-weight:700;}
.entry-content a{color:var(--indigo);text-underline-offset:3px;}
.entry-content ul,
.entry-content ol{padding-left:1.4em;color:var(--ink-2);}
.entry-content ul{list-style:disc;}
.entry-content ol{list-style:decimal;}
.entry-content li{margin-bottom:.55em;line-height:1.95;}
.entry-content blockquote{
  border-left:3px solid var(--rule-2);padding:2px 0 2px 18px;color:var(--ink-3);
}
/* --- 図版 ---
   本文より広く取ります。キャプションは図の一部なので、必ず添えてください。 */
.entry-content figure,
.fig{margin:30px 0 34px;}
.entry-content figure img,
.fig img{display:block;width:100%;border:1px solid var(--rule);background:var(--paper-2);}
.entry-content figcaption,
.fig figcaption{
  font-size:11.5px;color:var(--ink-3);margin-top:10px;line-height:1.8;
  padding-left:12px;border-left:2px solid var(--rule-2);max-width:38em;
}
/* 2枚並び */
.figs{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:30px 0 34px;}
@media (max-width:560px){.figs{grid-template-columns:1fr;gap:22px;}}
.figs figure{margin:0;}
.figs figcaption{margin-top:8px;}

/* 図解（線画SVG）は暗いテーマで反転させます。写真には掛けません。 */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .fig-diagram img,
  :root:not([data-theme="light"]) .entry-media img[src*="svg"],
  :root:not([data-theme="light"]) .hero-media img[src*="svg"],
  :root:not([data-theme="light"]) .gcard-media img[src*="svg"],
  :root:not([data-theme="light"]) .thumb img[src*="svg"],
  :root:not([data-theme="light"]) .buy-media img[src*="svg"]{filter:invert(1) hue-rotate(180deg);}
}
:root[data-theme="dark"] .fig-diagram img,
:root[data-theme="dark"] .entry-media img[src*="svg"],
:root[data-theme="dark"] .hero-media img[src*="svg"],
:root[data-theme="dark"] .gcard-media img[src*="svg"],
:root[data-theme="dark"] .thumb img[src*="svg"],
:root[data-theme="dark"] .buy-media img[src*="svg"]{filter:invert(1) hue-rotate(180deg);}
.fig-diagram img{border-color:var(--rule);}

/* 図解は切り抜きません。写真は16:9で切り抜き、図解は全体を見せます。
   縦横比の決まった枠に図解を流し込むと、見出しや軸ラベルが落ちます。 */
.hero-media:has(img[src*="svg"]){aspect-ratio:auto;background:var(--paper);}
.hero-media img[src*="svg"]{height:auto;object-fit:contain;background:var(--paper);}
/* 一覧の枠は高さを揃えたいので、比率は保ったまま図解を letterbox します */
.gcard-media img[src*="svg"]{object-fit:contain;background:var(--paper);padding:8px;}
.thumb img[src*="svg"]{object-fit:contain;background:var(--paper);padding:5px;}

/* 記事冒頭のアイキャッチ */
.entry-media{margin:26px 0 0;position:relative;}
.entry-media img{display:block;width:100%;border:1px solid var(--rule);background:var(--paper-2);}
.entry-media figcaption{
  font-size:11.5px;color:var(--ink-3);margin-top:10px;line-height:1.8;
  padding-left:12px;border-left:2px solid var(--rule-2);
}

/* --- 検証データ帯 [spec] : 実測値を大きく見せる。この誌面の主役 --- */
/* 値が数字だけとは限らないので、折り返しても行が揃うグリッドで組みます。
   flex の1行並びだと、長い値が入った瞬間に帯のリズムが崩れます。 */
.spec{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));
  border-top:2px solid var(--ink);border-bottom:1px solid var(--rule);
  padding:16px 0 17px;margin:26px 0 32px;row-gap:16px;
}
.spec-item{
  display:flex;flex-direction:column-reverse;justify-content:flex-end;line-height:1.25;
  padding:0 20px;border-left:1px solid var(--rule);
}
.spec-item:first-child{padding-left:0;border-left:0;}
.spec-item b{
  font-size:22px;font-weight:700;color:var(--ink);letter-spacing:-.005em;
  font-variant-numeric:tabular-nums;margin-top:5px;
}
.spec-item span{font-size:11px;color:var(--ink-3);letter-spacing:.06em;}
@media (max-width:560px){
  .spec{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));row-gap:14px;}
  .spec-item{padding:0 14px;}
  .spec-item b{font-size:18px;}
}

/* --- 結論（二重罫の囲み記事） --- */
.verdict{
  border-top:4px double var(--ink);border-bottom:4px double var(--ink);
  padding:20px 0 22px;margin:28px 0 36px;background:transparent;max-width:38em;
}
.verdict h3{
  font-family:var(--serif);font-size:14px;font-weight:700;letter-spacing:.12em;
  color:var(--red);margin:0 0 14px;padding:0;border:0;
}
.verdict ul{display:flex;flex-direction:column;gap:12px;list-style:none;padding:0;}
.verdict li{
  display:flex;gap:14px;font-size:14.5px;line-height:1.85;color:var(--ink);margin:0;
}
.verdict .k{
  font-family:var(--serif);font-size:13px;font-weight:700;color:var(--ink);
  flex:none;width:5.5em;padding-top:2px;letter-spacing:.04em;
  border-right:1px solid var(--rule-2);
}
@media (max-width:560px){
  .verdict li{flex-direction:column;gap:3px;}
  .verdict .k{width:auto;border-right:0;border-bottom:1px solid var(--rule-2);padding-bottom:3px;display:inline-block;align-self:flex-start;}
}

/* --- 比較表（印刷物のスペック表） --- */
.tablewrap,
.entry-content figure.wp-block-table{
  overflow-x:auto;margin:26px 0 32px;border:0;
}
.tablewrap table,
.entry-content table{width:100%;min-width:520px;background:transparent;border-collapse:collapse;}
.entry-content th,
.entry-content td{
  padding:11px 14px 11px 0;text-align:left;font-size:13px;
  border-bottom:1px solid var(--rule);line-height:1.7;
}
.entry-content thead th{
  font-size:11px;letter-spacing:.08em;color:var(--ink-3);font-weight:700;
  border-bottom:1.5px solid var(--ink);padding-bottom:8px;background:transparent;
}
.entry-content tbody tr:last-child td{border-bottom:1.5px solid var(--ink);}
.entry-content td.num,
.entry-content .num{font-variant-numeric:tabular-nums;font-feature-settings:"palt" 0;}
.entry-content td.price,
.entry-content .price{
  font-variant-numeric:tabular-nums;font-feature-settings:"palt" 0;
  color:var(--red);font-weight:700;
}
.mark{font-family:var(--serif);font-size:18px;font-weight:700;line-height:1;}
.mark.a{color:var(--red);}
.mark.b{color:var(--ink-2);}
.mark.c{color:var(--ink-3);}

/* --- 商品ブロック --- */
.buy{
  border-top:2px solid var(--ink);border-bottom:2px solid var(--ink);
  padding:20px 0;margin:30px 0 34px;
  display:flex;gap:24px;align-items:center;flex-wrap:wrap;
  background:transparent;box-shadow:none;
}
.buy-media{
  width:112px;flex:none;aspect-ratio:1;overflow:hidden;
  border:1px solid var(--rule);background:var(--paper-2);
}
.buy-media img{width:100%;height:100%;object-fit:contain;display:block;}
@media (max-width:560px){.buy-media{width:88px;}}
.buy-info{flex:1;min-width:180px;}
.buy-info b{
  display:block;font-family:var(--serif);font-size:16px;font-weight:700;
  margin-bottom:5px;color:var(--ink);letter-spacing:.02em;line-height:1.5;
}
.buy-info span{font-size:11.5px;color:var(--ink-3);line-height:1.75;}
.buy-price{
  font-size:29px;font-weight:700;color:var(--red);
  font-variant-numeric:tabular-nums;font-feature-settings:"palt" 0;
  letter-spacing:-.01em;line-height:1;
}
.btn{
  display:inline-flex;align-items:center;gap:10px;text-decoration:none;
  background:var(--ink);color:var(--on-ink);font-weight:700;font-size:13.5px;
  padding:13px 24px;border-radius:0;transition:opacity .15s;border:0;cursor:pointer;
  letter-spacing:.06em;
}
.btn:hover{opacity:.82;}

/* --- 関連記事 --- */
.related{
  display:block;text-decoration:none;background:transparent;
  border:0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
  padding:14px 0;margin:10px 0 30px;border-radius:0;
}
.related span{font-size:10.5px;letter-spacing:.12em;color:var(--red);font-weight:700;}
.related b{
  display:block;font-family:var(--serif);font-size:15px;font-weight:700;
  margin-top:6px;line-height:1.6;color:var(--ink);letter-spacing:.02em;
}
.related:hover b{text-decoration:underline;text-underline-offset:4px;}

.note-box{
  font-size:11.5px;color:var(--ink-3);line-height:1.95;
  border-top:1px solid var(--rule);padding-top:16px;margin-top:38px;
}

/* ==========================================================================
   11. ページ送り・フッター
   ========================================================================== */
.pager{display:flex;gap:0;flex-wrap:wrap;justify-content:center;margin-top:30px;}
.pager .page-numbers{
  display:grid;place-items:center;min-width:38px;height:38px;padding:0 12px;
  border:1px solid var(--rule);border-left-width:0;background:transparent;
  text-decoration:none;font-size:13px;color:var(--ink-2);
  font-variant-numeric:tabular-nums;
}
.pager .page-numbers:first-child{border-left-width:1px;}
.pager .page-numbers:hover{background:var(--paper-2);color:var(--ink);}
.pager .page-numbers.current{background:var(--ink);color:var(--on-ink);border-color:var(--ink);}

.site-foot{border-top:2px solid var(--ink);background:var(--paper);margin-top:56px;}
.foot-in{
  max-width:var(--wrap);margin:0 auto;padding:26px 20px 34px;
  display:flex;gap:24px;flex-wrap:wrap;align-items:center;
  font-size:12px;color:var(--ink-3);
}
.foot-in ul{display:flex;gap:24px;flex-wrap:wrap;list-style:none;}
.foot-in a{text-decoration:none;}
.foot-in a:hover{color:var(--ink);text-decoration:underline;text-underline-offset:3px;}
.foot-in .copy{margin-left:auto;font-size:11px;letter-spacing:.1em;}
@media (max-width:640px){
  .foot-in{padding:22px 16px 30px;gap:16px;}
  .foot-in .copy{margin-left:0;flex:1 1 100%;}
}

/* ==========================================================================
   12. アーカイブ・検索・404
   ========================================================================== */
.page-head{border-top:4px solid var(--ink);padding-top:14px;margin-bottom:22px;}
.page-head h1{
  font-family:var(--serif);font-size:26px;font-weight:700;letter-spacing:.04em;
}
.page-head p{font-size:13px;color:var(--ink-3);margin-top:8px;line-height:1.85;}
.empty{
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
  padding:30px 0;font-size:14px;color:var(--ink-2);line-height:1.9;
}