:root{
  --ground:#f6f7f9; --panel:#fff; --line:#dfe3ea; --line-soft:#eceff4;
  --text:#1a1f28; --text-2:#4d5566; --text-3:#7b8394;
  --accent:#33538f; --accent-soft:#e6ebf5; --ok:#3f7f6c; --warn:#96702a; --mute:#7b8394;
}
@media (prefers-color-scheme:dark){:root{
  --ground:#10131a; --panel:#171b23; --line:#2b313d; --line-soft:#232935;
  --text:#e7eaf0; --text-2:#a7b0c0; --text-3:#7c8698;
  --accent:#8fabe0; --accent-soft:#1e2634; --ok:#77bda8; --warn:#d7ab5c; --mute:#7c8698;
}}
*{box-sizing:border-box}
body{margin:0;background:var(--ground);color:var(--text);line-height:1.85;
 font-family:"Hiragino Sans","Noto Sans JP",system-ui,sans-serif;font-feature-settings:"palt" 1}
main,header.site,footer.site,.crumbs{max-width:820px;margin:0 auto;padding:0 20px}
header.site{padding-top:20px;padding-bottom:12px}
.brand{font-weight:700;color:var(--text);text-decoration:none}
.crumbs{font-size:12.5px;color:var(--text-3);padding-bottom:12px}
.crumbs a{color:var(--text-3)}
h1{font-size:clamp(22px,4vw,30px);line-height:1.4;margin:16px 0}
h2{font-size:19px;margin:34px 0 10px}
section{margin-bottom:8px}
a{color:var(--accent)}
.pr-disclosure{font-size:12px;color:var(--text-3);background:var(--panel);
 border:1px solid var(--line);padding:8px 12px;margin:0 0 20px}
.price-notice{color:var(--text-3);margin-top:32px}
.note small,.facts{color:var(--text-2)}
.verdict{border:1px solid var(--line);border-left:3px solid var(--mute);background:var(--panel);padding:16px 18px;margin:20px 0}
.verdict--ok{border-left-color:var(--ok)} .verdict--warn{border-left-color:var(--warn)}
.verdict--mid{border-left-color:var(--accent)} .verdict--mute{border-left-color:var(--mute)}
.verdict__head{margin:0 0 6px;font-size:18px}
.verdict__head .score{font-size:12.5px;color:var(--text-3);margin-left:12px;
 font-variant-numeric:tabular-nums}
.verdict__reason{margin:0;color:var(--text-2);font-size:14px}
table{width:100%;border-collapse:collapse;font-size:14px;background:var(--panel);
 border:1px solid var(--line);margin:14px 0}
caption{text-align:left;font-size:12.5px;color:var(--text-3);padding:8px 0}
th,td{padding:9px 12px;border-bottom:1px solid var(--line-soft);text-align:left}
thead th{font-size:12px;color:var(--text-3);font-weight:500;background:var(--ground)}
tbody tr:last-child td{border-bottom:none}
.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.strong{font-weight:700}
tr.best td,tr.best th{background:var(--accent-soft)}
.callout{background:var(--panel);border:1px solid var(--line);border-left:3px solid var(--accent);padding:16px 18px;margin:20px 0}
.chart{margin:16px 0;background:var(--panel);border:1px solid var(--line);padding:14px}
.chart figcaption{font-size:12.5px;color:var(--text-3);margin-top:8px}
.chart--empty{color:var(--text-3);font-size:13.5px}
.offers{padding-left:1.2em}
footer.site{margin-top:48px;padding-top:20px;border-top:1px solid var(--line);color:var(--text-3)}

/* カテゴリ一覧 */
table.listing { width: 100%; border-collapse: collapse; margin: 1rem 0; }
table.listing th, table.listing td { padding: .5rem .4rem; border-bottom: 1px solid var(--line, #2a2a2a); text-align: left; }
table.listing th[scope="row"] { font-weight: 400; }
table.listing .num { text-align: right; white-space: nowrap; }
nav.pager { display: flex; gap: 1rem; align-items: center; margin: 1.5rem 0; }