:root {
  --gold: #D2B37C;
  --gold-2: #A6874E;
  --gold-bright: #EAD3A2;
  --gold-soft: rgba(210,179,124,0.06);
  --gold-line: rgba(210,179,124,0.24);
  --steel: #9FB4C7;
  --dark: #0A0B0E;
  --dark2: #111318;
  --dark3: #181B21;
  --fg-1: #F1EEE6;
  --fg-2: #B8B9B4;
  --fg-3: #8C8D88;
  --fg-4: #5B5C57;
  --line-1: #22252B;
  --line-2: #33363D;
  --serif: 'Shippori Mincho B1','YuMincho','游明朝',serif;
  --sans: system-ui,-apple-system,'Hiragino Sans','Hiragino Kaku Gothic ProN','Yu Gothic UI','Meiryo',sans-serif;
  --numeric: 'Cormorant Garamond','Shippori Mincho B1',serif;
  --ease: cubic-bezier(.22,.61,.28,1);
}
*,*::before,*::after { box-sizing:border-box; }
html { color-scheme:dark; -webkit-text-size-adjust:100%; scroll-padding-top:64px; }
body { margin:0; background:var(--dark); color:var(--fg-2); font-family:var(--sans); font-size:16px; line-height:1.8; letter-spacing:0.02em; overflow-wrap:anywhere; }
img,svg { max-width:none; }
a { color:var(--gold); text-underline-offset:3px; text-decoration-thickness:1px; }
a:hover { color:var(--gold-bright); }
:focus-visible { outline:2px solid var(--gold-bright); outline-offset:2px; border-radius:2px; }
h1,h2,h3 { color:var(--fg-1); font-family:var(--serif); font-weight:700; line-height:1.4; letter-spacing:0.04em; margin:0; }
h1 { font-size:clamp(24px,5.4vw,34px); word-break:auto-phrase; text-wrap:balance; }
h2 { font-size:clamp(20px,4vw,25px); margin-bottom:14px; }
h3 { font-size:18px; margin:24px 0 8px; }
p { margin:0 0 14px; text-wrap:pretty; }
.skip { position:absolute; left:-9999px; top:0; background:var(--gold); color:var(--dark); padding:10px 14px; z-index:300; }
.skip:focus { left:8px; top:8px; }
.num { font-family:var(--numeric); font-weight:600; font-variant-numeric:lining-nums tabular-nums; letter-spacing:0; }

/* ヘッダー */
.site-head { position:sticky; top:0; z-index:50; background:rgba(10,11,14,0.94); border-bottom:1px solid var(--line-1); }
.site-head .in { max-width:1120px; margin:0 auto; padding:0 16px; display:flex; align-items:center; gap:16px; min-height:52px; }
.logo { font-family:var(--numeric); font-weight:600; font-size:20px; color:var(--fg-1); text-decoration:none; letter-spacing:0.08em; white-space:nowrap; display:inline-flex; align-items:center; gap:8px; min-height:44px; }
.logo svg { width:20px; height:20px; }
.site-nav { display:flex; gap:2px; overflow-x:auto; scrollbar-width:none; margin-left:auto; }
.site-nav::-webkit-scrollbar { display:none; }
.site-nav a { color:var(--fg-2); text-decoration:none; font-size:13.5px; padding:0 10px; min-height:44px; min-width:44px; justify-content:center; display:inline-flex; align-items:center; white-space:nowrap; border-bottom:1px solid transparent; }
.site-nav a:hover, .site-nav a[aria-current="page"] { color:var(--gold-bright); border-bottom-color:var(--gold-line); }
@media (max-width:640px) { html { scroll-padding-top:100px; } .site-head .in { flex-wrap:wrap; gap:0; } .site-nav { margin-left:-6px; width:calc(100% + 12px); justify-content:space-between; gap:0; } .site-nav a { padding:0 6px; } }
@media (max-width:380px) { .site-nav a { font-size:12.5px; padding:0 4px; } }

.wrap { max-width:1120px; margin:0 auto; padding:0 16px; }
.narrow { max-width:760px; }
section { padding:40px 0; border-top:1px solid var(--line-1); }
section:first-of-type { border-top:none; }
.eyebrow { font-family:var(--numeric); font-weight:600; color:var(--gold); letter-spacing:0.18em; font-size:13px; text-transform:uppercase; margin:0 0 6px; }
.lede { color:var(--fg-2); font-size:15.5px; max-width:640px; }
.muted { color:var(--fg-3); font-size:14px; }
.crumb { font-size:13px; color:var(--fg-3); padding-top:16px; }
.crumb ol { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; align-items:center; gap:6px; }
.crumb li+li::before { content:"/"; margin-right:6px; color:var(--fg-4); }
.crumb a { color:var(--fg-2); display:inline-flex; align-items:center; min-height:44px; padding:0 7px; margin:0 -7px; }
.crumb { padding-top:4px; }

/* 計算機 */
.calc { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:32px; padding:24px 0 36px; align-items:start; }
.calc-main h1 { margin:4px 0 8px; }
@media (min-width:861px) { .calc-main h1 { font-size:28px; } }
.calc-viz { position:sticky; top:68px; }
@media (max-width:860px) { .calc { grid-template-columns:minmax(0,1fr); gap:20px; padding-top:16px; } .calc-viz { position:static; } }
.field { margin:16px 0 0; }
.field label, .field .lab { display:block; color:var(--fg-1); font-size:14.5px; font-weight:600; margin-bottom:6px; }
.stepper { display:flex; align-items:stretch; gap:8px; }
.stepper button { flex:none; width:48px; min-height:48px; border:1px solid var(--line-2); background:var(--dark3); color:var(--fg-1); font-size:22px; border-radius:2px; cursor:pointer; transition:border-color .2s var(--ease); }
.stepper button:hover { border-color:var(--gold-line); }
.stepper button:active { transform:translateY(1px); }
.inp { display:flex; align-items:center; gap:6px; flex:1; border:1px solid var(--line-2); background:var(--dark3); border-radius:2px; padding:0 12px; min-height:48px; }
.inp:focus-within { border-color:var(--gold); outline:2px solid var(--gold-bright); outline-offset:2px; }
.inp input { flex:1; min-width:0; width:100%; line-height:1.2; background:transparent; border:0; color:var(--fg-1); font-family:var(--numeric); font-weight:600; font-size:28px; padding:4px 0; min-height:46px; }
.inp input:focus { outline:none; }
.inp .u { flex:none; white-space:nowrap; color:var(--fg-3); font-size:14px; }
input[type=range] { width:100%; margin:4px 0 0; accent-color:var(--gold); height:44px; }
.hint { color:var(--fg-3); font-size:13.5px; margin:6px 0 0; }
.w-note { color:var(--fg-1); }
.w-note:empty { display:none; }
details.opt, details.fold { margin-top:14px; border:1px solid var(--line-1); border-radius:6px; background:var(--dark2); }
details.opt summary, details.fold summary { cursor:pointer; padding:0 14px; min-height:44px; display:flex; align-items:center; color:var(--fg-1); font-size:14.5px; }
details.opt > div, details.fold > div { padding:0 14px 14px; }
select { width:100%; min-height:44px; background:var(--dark3); color:var(--fg-1); border:1px solid var(--line-2); border-radius:2px; padding:0 10px; font-size:16px; font-family:var(--sans); }

.answers { margin:20px 0 0; display:grid; gap:10px; }
.ans { border:1px solid var(--line-1); background:var(--dark2); border-radius:6px; padding:14px 16px; }
.ans.main { border-color:var(--gold-line); background:linear-gradient(180deg,var(--gold-soft),transparent); }
.ans .k { color:var(--fg-3); font-size:13px; margin:0 0 2px; }
.ans .v { color:var(--fg-1); font-family:var(--numeric); font-weight:600; font-size:30px; line-height:1.25; }
.ans .v small { font-size:15px; color:var(--fg-2); font-family:var(--sans); font-weight:400; margin-left:4px; }
.ans .s { color:var(--fg-2); font-size:13.5px; margin:4px 0 0; }
.ans.main .v { font-size:34px; }
.ans .go { margin:2px 0 0; font-size:14px; }
.ans .go a { display:inline-flex; align-items:center; min-height:44px; }
.two { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
@media (max-width:420px) { .two { grid-template-columns:1fr; } }

/* 原寸描画 */
.fig { border:1px solid var(--line-1); background:var(--dark2); border-radius:6px; padding:12px; }
.fig-head { display:flex; justify-content:space-between; align-items:center; gap:8px; flex-wrap:wrap; margin-bottom:8px; }
.fig-title { color:var(--fg-1); font-size:14px; font-weight:600; }
.badge { font-size:12px; border:1px solid var(--line-2); color:var(--fg-2); padding:2px 8px; border-radius:20px; white-space:nowrap; }
.badge.ok { border-color:var(--gold-line); color:var(--gold-bright); }
.realsize { overflow-x:auto; overflow-y:hidden; }
.realsize svg { display:block; margin:0 auto; width:calc(var(--sw,90) * 1mm * var(--k,1)); height:auto; }
.legend { display:flex; flex-wrap:wrap; gap:6px 14px; font-size:13px; color:var(--fg-2); margin:8px 0 0; }
.legend i { display:inline-block; width:18px; height:0; border-top:2px solid var(--gold); vertical-align:middle; margin-right:6px; }
.legend i.b { border-top:2px dashed var(--steel); }
.legend i.w { border-top:1px dashed var(--fg-3); }
.pick { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:8px 10px; margin-top:10px; }
.pick label { font-size:12.5px; color:var(--fg-3); }
.sel { position:relative; }
.sel select { position:absolute; inset:0; height:100%; min-height:0; opacity:0; cursor:pointer; }
.sel-v { display:flex; align-items:center; min-height:44px; padding:6px 34px 6px 10px; background:var(--dark3); border:1px solid var(--line-2); border-radius:2px; color:var(--fg-1); font-size:15px; line-height:1.35; transition:border-color .2s var(--ease); }
.sel::after { content:""; position:absolute; right:14px; top:50%; width:7px; height:7px; border-right:2px solid var(--fg-2); border-bottom:2px solid var(--fg-2); transform:translateY(-70%) rotate(45deg); pointer-events:none; }
.sel:hover .sel-v { border-color:var(--gold-line); }
.sel:focus-within .sel-v { border-color:var(--gold); outline:2px solid var(--gold-bright); outline-offset:2px; }
.actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:44px; padding:0 16px; border-radius:2px; border:1px solid var(--line-2); background:transparent; color:var(--fg-1); font-size:14px; font-family:var(--sans); cursor:pointer; text-decoration:none; transition:border-color .2s var(--ease), background-color .2s var(--ease); }
.btn:hover { border-color:var(--gold-line); color:var(--fg-1); }
.btn.primary { background:var(--gold); border-color:var(--gold); color:var(--dark); font-weight:700; }
.btn.primary:hover { background:var(--gold-bright); color:var(--dark); }
.cal { margin-top:12px; border-top:1px solid var(--line-1); padding-top:12px; }
.cal[hidden] { display:none; }
.cal { overflow-x:auto; }
.cal .card-box { margin:8px auto; border:1.5px solid var(--gold); border-radius:3mm; background:var(--gold-soft); width:calc(85.6mm * var(--k,1)); height:calc(53.98mm * var(--k,1)); flex:none; display:flex; align-items:center; justify-content:center; color:var(--fg-2); font-size:13px; }
.cal .card-box .pt { display:none; }
@media (max-width:640px) {
  .cal .card-box { width:calc(53.98mm * var(--k,1)); height:calc(85.6mm * var(--k,1)); }
  .cal .card-box .ls { display:none; }
  .cal .card-box .pt { display:inline; }
  .cal { overflow-x:visible; }
  .cal .card-wrap { margin:0 -29px; overflow-x:auto; display:flex; }
}

/* 表 */
.tbl-wrap { overflow-x:auto; border:1px solid var(--line-1); border-radius:6px; }
table { border-collapse:collapse; width:100%; font-size:14px; }
.tbl-wrap table { overflow-wrap:normal; word-break:keep-all; }
.tbl-wrap td:not(.n), .tbl-wrap th:not(.n) { min-width:8.5em; }
.tbl-wrap table.fit td, .tbl-wrap table.fit th { min-width:0; }
.tbl-wrap table.fit thead th { white-space:normal; }
.tbl-wrap table.sortable td:first-child, .tbl-wrap table.sortable th:first-child { min-width:11em; }
.tbl-wrap table.sortable td:nth-child(2), .tbl-wrap table.sortable th:nth-child(2) { min-width:7em; }
th,td { padding:10px 12px; border-bottom:1px solid var(--line-1); text-align:left; vertical-align:top; }
thead th { background:var(--dark3); color:var(--fg-1); font-weight:600; font-size:13px; white-space:nowrap; position:sticky; top:0; }
tbody tr:last-child td { border-bottom:none; }
td.n, th.n { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
tr.hit td { background:var(--gold-soft); color:var(--fg-1); }
tr.hit td:first-child { box-shadow:inset 3px 0 0 var(--gold); }
thead th:has(> button.sort) { padding:0; }
th button.sort { background:none; border:0; color:inherit; font:inherit; cursor:pointer; padding:0 12px; min-height:44px; width:100%; text-align:inherit; white-space:nowrap; }
th button.sort::after { content:" ↕"; color:var(--fg-4); }
[hidden] { display:none !important; }
td.nmc { min-width:10.5em; }
.tbl-wrap.ovf:not(.end) { -webkit-mask-image:linear-gradient(to right, #000 calc(100% - 36px), rgba(0,0,0,.25)); mask-image:linear-gradient(to right, #000 calc(100% - 36px), rgba(0,0,0,.25)); }
td.nmc a[rel~=sponsored] { display:inline-flex; align-items:center; min-height:44px; }
th[aria-sort="ascending"] button.sort::after { content:" ↑"; color:var(--gold); }
th[aria-sort="descending"] button.sort::after { content:" ↓"; color:var(--gold); }

/* 機種リスト */
.mlist { list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.mrow { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:4px 12px; align-items:center; border:1px solid var(--line-1); border-radius:6px; padding:12px 14px; background:var(--dark2); }
.mrow .nm { color:var(--fg-1); font-weight:600; font-size:15px; line-height:1.5; }
.mrow .nm a { color:var(--fg-1); text-decoration:underline; text-decoration-color:var(--gold); text-underline-offset:4px; display:inline-flex; align-items:center; min-height:44px; }
.mrow .nm a:hover { color:var(--gold-bright); }
.mrow .sp { color:var(--fg-2); font-size:13.5px; grid-column:1; }
.mrow .mg { grid-row:1 / span 2; grid-column:2; text-align:right; }
.mrow .mg b { display:block; font-family:var(--numeric); font-weight:600; font-size:24px; color:var(--fg-1); line-height:1.1; }
.mrow .mg b.neg { color:var(--fg-2); }
.mrow .mg span { font-size:12px; color:var(--fg-3); }
.mrow .ln { grid-column:1 / -1; display:flex; flex-wrap:wrap; gap:6px 14px; font-size:13.5px; }
.mrow .ln a, .mrow .ln button { min-height:44px; display:inline-flex; align-items:center; }
.more-models { display:none; margin-top:10px; width:100%; }
@media (max-width:640px) { .js #mlist:not(.all) > li:nth-child(n+3) { display:none; } .js .more-models:not([hidden]) { display:flex; } }
.mrow .ln button { background:none; border:0; color:var(--gold); font:inherit; cursor:pointer; padding:0; text-decoration:underline; text-underline-offset:3px; }
main a[rel~="sponsored"], .tbl-wrap td a { display:inline-flex; align-items:center; min-height:44px; }
.tbl-wrap td a { min-width:44px; }
.tbl-wrap tr:target td { background:var(--dark3); }
.tbl-wrap tr:target td:first-child { box-shadow:inset 3px 0 0 var(--gold); }
.pr { display:inline-block; font-size:11px; border:1px solid var(--line-2); color:var(--fg-3); border-radius:2px; padding:0 4px; margin-right:4px; line-height:1.6; }
.affnote { font-size:12.5px; color:var(--fg-3); margin-top:10px; }

/* 分布図 */
.dist svg { width:100%; max-width:760px; height:auto; display:block; }
.dist svg .gl, .dist svg .mk { paint-order:stroke; stroke:var(--dark); stroke-width:5px; stroke-linejoin:round; }
.dist svg .glbg { fill:var(--dark); }
@media (max-width:640px) { .dist svg .tk, .dist svg .gl, .dist svg .mk { font-size:22px; } .dist svg .ax { font-size:20px; } }
.nw { white-space:nowrap; }
.buy-now { margin-top:14px; }
.buy-now p { margin:0; }
.vh { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.grid2 { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr)); gap:16px; }
.grid2 > * { min-width:0; }
.cardx { border:1px solid var(--line-1); border-radius:6px; padding:16px; background:var(--dark2); }
h2.h3 { font-size:18px; margin:24px 0 8px; }
.cardx h3, .cardx h2.h3 { margin-top:0; }
dl.spec { display:grid; grid-template-columns:auto 1fr; gap:6px 16px; margin:0; }
dl.spec dt { color:var(--fg-3); font-size:13.5px; }
dl.spec dd { margin:0; color:var(--fg-1); }

.faq details { border-bottom:1px solid var(--line-1); }
.faq summary { cursor:pointer; color:var(--fg-1); font-weight:600; padding:12px 0; min-height:44px; list-style-position:inside; }
.faq details > div { padding:0 0 14px; }
.src li { margin:6px 0; font-size:14px; }
.src li:has(> a[rel~="sponsored"]) { margin:0; }
.src.pages li { margin:0; }
.src.pages a, .go-links a { display:inline-flex; align-items:center; min-height:44px; }
.go-links { display:flex; flex-wrap:wrap; gap:0 20px; }
.links-row { display:flex; flex-wrap:wrap; gap:8px; }
.ad { margin:28px auto; min-height:100px; max-width:1120px; padding:0 16px; }
@media (max-width:640px) { .ad { margin:20px auto; min-height:280px; } section { padding:28px 0; } }

/* フッター */
.site-foot { border-top:1px solid var(--line-1); margin-top:48px; padding:32px 0 96px; font-size:13.5px; color:var(--fg-3); }
.site-foot nav { display:flex; flex-wrap:wrap; gap:0 16px; }
.site-foot nav a { color:var(--fg-2); min-height:44px; min-width:44px; justify-content:center; display:inline-flex; align-items:center; text-decoration:none; }
.site-foot nav a:hover { color:var(--gold-bright); }
.sister { margin-top:16px; }
.sister a { color:var(--fg-2); display:inline-flex; align-items:center; min-height:44px; }

/* Cookie */
#cookie { position:fixed; left:0; right:0; bottom:0; z-index:100; background:rgba(17,19,24,0.97); border-top:1px solid var(--line-2); }
#cookie .in { max-width:1120px; margin:0 auto; padding:6px 16px; display:flex; align-items:center; gap:10px; min-height:56px; max-height:56px; font-size:13px; color:var(--fg-2); }
#cookie p { margin:0; flex:1; line-height:1.4; }
#cookie .btn { min-height:44px; padding:0 14px; font-size:13px; }
#cookie[hidden] { display:none; }
html:has(#cookie:not([hidden])) { scroll-padding-bottom:72px; }

/* 原寸 SVG */
.rs .band { fill:rgba(210,179,124,0.07); }
.rs .edge { stroke:var(--fg-3); stroke-width:0.25; stroke-dasharray:1 1; }
.rs .lbl { fill:var(--fg-2); font-size:2.8px; font-family:var(--sans); }
.rs .case, .rs .lug, .rs .box, .rs .tick { fill:none; stroke-width:0.45; }
.rs .case.a { stroke:var(--gold); fill:rgba(210,179,124,0.10); }
.rs .lug.a { stroke:var(--gold); fill:rgba(210,179,124,0.05); }
.rs .box.a, .rs .tick.a { stroke:var(--gold); stroke-dasharray:1.2 0.8; }
.rs .case.b, .rs .lug.b, .rs .box.b, .rs .tick.b { stroke:var(--steel); stroke-dasharray:1.6 0.9; }
.rs .scale { stroke:var(--fg-2); stroke-width:0.35; }

.print-only { display:none; }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { transition:none !important; animation:none !important; scroll-behavior:auto !important; } }

@page { size:A4 landscape; margin:10mm; }
@media print {
  html { --k:1 !important; color-scheme:light; background:#fff; }
  .badge { display:none !important; }
  .sel-v { background:#fff !important; border-color:#888 !important; }
  .dist svg .gl, .dist svg .mk { stroke:#fff !important; }
  .dist svg .glbg { fill:#fff !important; }
  .tbl-wrap.ovf { -webkit-mask-image:none !important; mask-image:none !important; }
  body { background:#fff; color:#000; }
  h1, h2, h3, .ans .v, .ans .num, .mrow .nm a, .fig-title, .eyebrow, th, td, dt, dd, summary { color:#000 !important; background:transparent !important; }
  .rs .lbl { fill:#000; }
  main, main * { color:#000 !important; }
  main * { background-color:transparent !important; }
  input, select { background:#fff !important; border-color:#888 !important; }
  .dist svg text { fill:#000 !important; }
  .dist svg line { stroke:#888 !important; }
  #dist-mark line { stroke:#000 !important; }
  .rs .case, .rs .lug, .rs .box, .rs .tick, .rs .scale, .rs .edge { stroke:#000 !important; }
  .site-head, .site-foot, .ad, #cookie, .no-print, .actions, .cal { display:none !important; }
  body.printing section, body.printing .crumb, body.printing main > *:not(.print-only) { display:none !important; }
  body.printing .print-only { display:block !important; }
  .print-only * { color:#000 !important; }
  .print-only svg { width:calc(var(--sw,90) * 1mm) !important; height:auto; }
  .print-only .bar50 { width:50mm; height:0; border-top:3mm solid #000; margin:4mm 0 1mm; }
  .print-only .rs .band { fill:#f2f2f2; }
  .print-only .rs .case, .print-only .rs .lug, .print-only .rs .box, .print-only .rs .tick, .print-only .rs .scale, .print-only .rs .edge { stroke:#000 !important; fill:none !important; }
  .print-only .rs .lbl { fill:#000; }
  .print-only .sheet-grid { display:flex; gap:8mm; align-items:flex-start; flex-wrap:wrap; }
}
/* === ui-polish v1 === */
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
h1,h2,h3,h4{text-wrap:balance}
p,li,dd,figcaption{text-wrap:pretty}
/* === /ui-polish === */