/* ヘッドホン図鑑 — 銘板とラックパネル */
:root{
  --panel:#E4E6E8;      /* アルミの地 */
  --sheet:#F7F7F6;      /* 紙 */
  --stage:#FFFFFF;      /* 商品写真の台 */
  --ink:#23262B;        /* 黒鉛 */
  --engrave:#4A4F57;    /* 刻印 */
  --rule:#BFC3C8;       /* 罫 */
  --rule-2:#DDE0E3;
  --lamp:#F2A23A;       /* パイロットランプ */
  --lamp-ink:#8A5208;
  --seg-off:#3A3F46;
  --seg-ne:#8C96A1;
  --alu-1:#D7DADD; --alu-2:#C3C7CB; --alu-edge:#9EA3A9;
  --plate-1:#EDEFF0; --plate-2:#CBCFD3;
}
@media (prefers-color-scheme:dark){:root{
  --panel:#2A2D32; --sheet:#33373D; --stage:#F4F4F2; --ink:#ECEEF0; --engrave:#AEB4BB;
  --rule:#4A4F57; --rule-2:#3D4248; --lamp-ink:#F2A23A;
  --alu-1:#4B5057; --alu-2:#3A3E44; --alu-edge:#23262B;
  --plate-1:#55595F; --plate-2:#3E4248;
}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--panel);color:var(--ink);font:15px/1.75 -apple-system,BlinkMacSystemFont,"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;font-feature-settings:"palt";font-variant-numeric:tabular-nums}
a{color:inherit}
img{max-width:100%}
main{max-width:760px;margin:0 auto}
h1,h2{line-height:1.4;font-weight:900;letter-spacing:.01em}
h2{font-size:17px;margin:34px 0 8px;display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
h2 small{font-size:12px;font-weight:600;color:var(--engrave)}
section{padding:0 16px}
:focus-visible{outline:2px solid var(--lamp);outline-offset:2px}

/* 天板：ブラッシュド・アルミとビス */
.bar{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:10px;padding:10px 26px;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.16) 0 1px,rgba(0,0,0,.025) 1px 3px),linear-gradient(var(--alu-1),var(--alu-2));
  border-bottom:1px solid var(--alu-edge);box-shadow:inset 0 1px 0 rgba(255,255,255,.5)}
.bar::before,.bar::after{content:"";position:absolute;top:50%;width:8px;height:8px;margin-top:-4px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#F2F3F4,#8D939A 70%);box-shadow:inset 0 0 0 .5px #6E747B}
.bar::before{left:9px}.bar::after{right:9px}
.logo{display:flex;align-items:center;gap:8px;text-decoration:none;color:var(--ink)}
.mark{width:30px;height:30px;flex:none}
.wm{display:flex;flex-direction:column;line-height:1}
.wm small{align-self:flex-start;position:relative;font-size:9.5px;font-weight:800;letter-spacing:.1em;background:var(--lamp);color:#2A1700;padding:2px 7px;border-radius:999px;margin-bottom:5px}
.wm small::after{content:"";position:absolute;left:11px;bottom:-3px;border:3.5px solid transparent;border-top-color:var(--lamp);border-bottom:0}
.wm b{font-size:17px;font-weight:800;letter-spacing:.04em}
.bar nav{margin-left:auto;display:flex;gap:14px;font-size:13px;font-weight:700;color:var(--engrave)}
.bar nav a{text-decoration:none}
.bar nav a[aria-current]{color:var(--ink);text-decoration:underline;text-underline-offset:4px}
.lamp{width:9px;height:9px;flex:none;border-radius:50%;background:var(--lamp);box-shadow:0 0 0 2px var(--alu-edge),0 0 10px 2px rgba(242,162,58,.6)}

/* 商品写真の台と銘板 */
.hero{position:relative;display:block;text-decoration:none;color:var(--ink);margin-bottom:46px}
.hero-stage{display:grid;place-items:center;background:var(--stage);aspect-ratio:4/3.2;border-bottom:1px solid var(--rule)}
.hero-stage img{width:78%;height:82%;object-fit:contain}
.plate{position:absolute;left:12px;right:12px;bottom:-40px;padding:9px 14px 8px;border-radius:3px;
  background:repeating-linear-gradient(90deg,rgba(255,255,255,.2) 0 1px,rgba(0,0,0,.03) 1px 2px),linear-gradient(var(--plate-1),var(--plate-2));
  border:1px solid var(--alu-edge);box-shadow:inset 0 1px 0 rgba(255,255,255,.6),0 6px 16px rgba(0,0,0,.22)}
.plate::before,.plate::after{content:"";position:absolute;top:7px;width:6px;height:6px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#F2F3F4,#8D939A 70%)}
.plate::before{left:5px}.plate::after{right:5px}
.plate-mk{display:block;font-size:11px;font-weight:700;color:var(--engrave)}
.plate-mk a{text-decoration:none}
.plate-st{margin-left:.6em;padding:0 .4em;border:1px solid currentColor;border-radius:3px;font-style:normal;font-size:10px}
.plate-nm{display:block;margin:0;font-size:23px;font-weight:900;line-height:1.15;letter-spacing:.02em}
.plate-dl{display:flex;flex-wrap:wrap;gap:0 16px;margin-top:5px}
.plate-dl small{display:block;font-size:10.5px;color:var(--engrave);line-height:1.3}
.plate-dl b{font-size:14px;font-weight:800;line-height:1.3}

.intro h1{font-size:22px;margin:0 0 .3em}
.intro p{margin:0 0 16px;color:var(--engrave);font-size:14px}

/* ハードウェアのスイッチ */
.sel{border:1px solid var(--rule);background:var(--sheet);border-radius:4px}
.sel .row{display:grid;grid-template-columns:70px 1fr;align-items:center;border-top:1px solid var(--rule);min-height:46px}
.sel .row:first-child{border-top:0}
.sel .k{font-size:12px;font-weight:700;color:var(--engrave);padding-left:12px}
.sw{display:flex;flex-wrap:wrap;padding:6px 8px 6px 0;row-gap:4px}
.sw label{position:relative;margin-left:-1px}
.sw label:first-child{margin-left:0}
.sw input{position:absolute;opacity:0;pointer-events:none}
.sw b{display:block;padding:6px 11px;font-size:13px;font-weight:700;border:1px solid #A9AEB4;background:linear-gradient(#FCFCFC,#E3E5E8);color:#3A3E44;cursor:pointer}
.sw label:first-child b{border-radius:3px 0 0 3px}.sw label:last-child b{border-radius:0 3px 3px 0}
.sw input:checked+b{background:linear-gradient(#2E3238,#3F444B);color:#fff;border-color:#23262B;box-shadow:inset 0 2px 3px rgba(0,0,0,.4)}
.sw input:focus-visible+b{outline:2px solid var(--lamp)}
.sw.multi{gap:4px}.sw.multi label{margin-left:0}.sw.multi b{border-radius:3px}
.sw select{font:inherit;font-size:13px;font-weight:700;padding:5px 8px;border:1px solid #A9AEB4;border-radius:3px;background:linear-gradient(#FCFCFC,#E3E5E8);color:#3A3E44}

.q-note{font-size:12px;color:var(--engrave);margin:12px 0 6px}
.picks{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.picks li{display:flex;gap:6px}
.pick{flex:1;display:flex;align-items:center;gap:10px;min-width:0;padding:6px 10px 6px 6px;background:var(--sheet);border:1px solid var(--rule);border-radius:3px;text-decoration:none}
.pick img{width:54px;height:54px;object-fit:contain;background:var(--stage);border:1px solid var(--rule-2);flex:none}
.pk{display:flex;flex-direction:column;min-width:0;line-height:1.35}
.pk small{font-size:11px;color:var(--engrave);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.pk b{font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* 押しボタン */
.key{display:inline-grid;place-items:center;padding:10px 16px;border-radius:4px;border:0;font:900 14px/1.2 inherit;font-family:inherit;text-decoration:none;cursor:pointer;
  color:#2A1700;background:linear-gradient(#F7B657,#E3922A);box-shadow:inset 0 1px 0 #FFD08A,0 2px 0 #9C5E12}
.key:active{transform:translateY(2px);box-shadow:inset 0 1px 0 #FFD08A}
.key.g{color:#23262B;background:linear-gradient(#FCFCFC,#DDE0E3);box-shadow:inset 0 1px 0 #fff,0 2px 0 #8D939A}
.picks .key{padding:0 12px;font-size:12px}

/* 機種のタイル（台＋札） */
.tile{display:flex;flex-direction:column;text-decoration:none;color:var(--ink);background:var(--sheet);border:1px solid var(--rule);border-radius:3px;overflow:hidden}
.stage{display:grid;place-items:center;aspect-ratio:1;background:var(--stage);border-bottom:1px solid var(--rule-2)}
.stage img{width:82%;height:82%;object-fit:contain}
.tag{display:flex;flex-direction:column;padding:7px 9px 8px;line-height:1.3}
.tag small{font-size:11px;color:var(--engrave)}
.tag b{font-size:14.5px;font-weight:800}
.tag-f{display:flex;justify-content:space-between;align-items:center;margin-top:4px;font-size:11px;color:var(--engrave)}
.mini{display:inline-flex;gap:2px}
.mini i{width:5px;height:10px;background:var(--rule)}
.mini i.on{background:var(--lamp)}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.rail{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -16px;padding:0 16px 6px;scrollbar-width:none}
.rail::-webkit-scrollbar{display:none}
.rail .tile{flex:0 0 44%;max-width:200px;scroll-snap-align:start}

.call{margin-top:34px;padding:16px;background:var(--ink);color:#E9EBED;border-radius:4px;margin-left:16px;margin-right:16px}
.call h2{margin:0 0 6px;color:#fff}
.call p{font-size:13.5px;color:#C2C8CF;margin:0 0 12px}
.call-num b{font-size:26px;font-weight:900;color:var(--lamp);margin-right:4px}
@media (prefers-color-scheme:dark){.call{background:#1D2024}}

.types{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.types a{display:flex;flex-direction:column;gap:1px;padding:12px;background:var(--sheet);border:1px solid var(--rule);border-radius:3px;text-decoration:none}
.types img{width:34px;height:34px;margin-bottom:4px}
.types b{font-size:14px}.types small{font-size:11px;color:var(--engrave)}

/* 機種ページ */
.model .body{padding:0 16px 30px}
.lead{margin:0 0 4px;font-size:14.5px}
.keys{display:flex;gap:8px;margin:14px 0 0}
.rack{background:#23262B;color:#E9EBED;border-radius:4px;padding:12px 12px 8px;box-shadow:inset 0 0 0 1px #3A3F46}
.rack-hd{display:flex;justify-content:space-between;font-size:12px;color:#9CA3AB;margin-bottom:4px}
.rack-hd b{color:#fff;font-size:14px}
.lv{display:grid;grid-template-columns:5.6em 1fr 2.2em;align-items:center;gap:8px;padding:4px 0;font-size:12.5px}
.seg{display:grid;grid-template-columns:repeat(5,1fr);gap:3px}
.seg i{height:9px;background:var(--seg-off)}
.seg i.ne{background:var(--seg-ne)}
.seg i.on{background:var(--lamp);box-shadow:0 0 6px rgba(242,162,58,.55)}
.lv .n{text-align:right;font-weight:700;color:#fff}
.legend{display:flex;gap:14px;font-size:11px;color:#9CA3AB;margin-top:6px}
.legend i{display:inline-block;width:10px;height:8px;margin-right:4px}
.sw-v{background:var(--lamp)}.sw-e{background:var(--seg-ne)}
.rack:not(.has-v) .legend span:first-child{display:none}

.fd{padding:8px 0;border-bottom:1px solid var(--rule)}
.fd b{font-size:13px}
.scale{position:relative;height:18px;margin:2px 6px;background:repeating-linear-gradient(90deg,#A9AEB4 0 1px,transparent 1px 25%),linear-gradient(var(--rule),var(--rule)) 0 50%/100% 2px no-repeat}
.knob{position:absolute;top:1px;width:12px;height:16px;margin-left:-6px;border-radius:2px;background:linear-gradient(#5A6068,#23262B);box-shadow:0 1px 2px rgba(0,0,0,.4)}
.knob.v{display:none;background:linear-gradient(#F7B657,#E3922A)}
.knob.v.on{display:block}
.ends{display:flex;justify-content:space-between;font-size:11px;color:var(--engrave)}

.fit ul{margin:0;padding-left:1.2em}
@media (min-width:640px){.fit{display:grid;grid-template-columns:1fr 1fr;gap:0 20px}}
.rep{background:var(--sheet);border:1px solid var(--rule);border-left:4px solid var(--ink);padding:10px 12px;margin:0 0 8px}
.rep p{margin:0;font-size:13.5px}
.rep a{display:block;font-size:11.5px;color:var(--engrave);margin-top:4px}
.spec{width:100%;border-collapse:collapse;background:var(--sheet);border:1px solid var(--rule);font-size:13px}
.spec th{width:36%;text-align:left;font-weight:600;color:var(--engrave);font-size:12px;padding:7px 10px;border-bottom:1px solid var(--rule-2);vertical-align:top}
.spec td{font-weight:700;padding:7px 10px;border-bottom:1px solid var(--rule-2)}
.src-note{font-size:11.5px;color:var(--engrave)}

/* 投稿フォーム */
.vote-form{display:grid;gap:8px;background:var(--sheet);border:1px solid var(--rule);border-radius:4px;padding:12px}
.own{padding:0 0 4px}
.rate{display:flex;justify-content:space-between;align-items:center;padding:4px 0;border-bottom:1px solid var(--rule-2);font-size:13px;font-weight:700}
.rate em{font-style:normal;font-size:10px;margin-left:6px;padding:1px 5px;border-radius:2px;background:var(--lamp);color:#2A1700}
.pick5{display:flex}
.pick5 label{position:relative;margin-left:-1px}
.pick5 input{position:absolute;opacity:0}
.pick5 b{display:grid;place-items:center;width:32px;height:28px;font-size:12.5px;border:1px solid #A9AEB4;background:linear-gradient(#FCFCFC,#E3E5E8);color:#3A3E44;cursor:pointer}
.pick5 label:first-child b{border-radius:3px 0 0 3px}.pick5 label:last-child b{border-radius:0 3px 3px 0}
.pick5 input:checked+b{background:linear-gradient(#F7B657,#E3922A);border-color:#9C5E12;color:#2A1700}
.pick5 input:focus-visible+b{outline:2px solid var(--ink)}
details summary{cursor:pointer;font-size:13px;font-weight:700;color:var(--lamp-ink);padding:4px 0}
.trow{display:grid;gap:0;margin:8px 0;font-size:13px}
input[type=range]{width:100%;accent-color:var(--lamp)}
.txt{display:grid;gap:4px;font-size:12.5px;font-weight:700;color:var(--engrave)}
textarea,.txt input{font:inherit;font-weight:400;color:var(--ink);background:var(--stage);border:1px solid var(--rule);border-radius:3px;padding:7px 9px}
@media (prefers-color-scheme:dark){textarea,.txt input{background:#2A2D32}}
.hp{position:absolute;left:-9999px}
.msg{margin:0;font-size:13px}
.voices{list-style:none;padding:0;margin:12px 0 0;display:grid;gap:8px}
.voices li{background:var(--sheet);border:1px solid var(--rule);border-left:4px solid var(--lamp);padding:10px 12px;font-size:13.5px}
.voices p{margin:0}
.voices .who{font-size:11.5px;color:var(--engrave)}

.buy{position:sticky;bottom:0;z-index:9;display:flex;gap:10px;align-items:center;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:#23262B;color:#fff}
.buy span{flex:1;min-width:0;font-size:12px;line-height:1.3;color:#C2C8CF}
.buy span b{display:block;font-size:14px;color:#fff;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* 探す */
.find h1{font-size:22px;margin:22px 0 12px}
.count{margin:22px 0 8px}

/* 読み物 */
.prose{padding:6px 16px 30px}
.prose h1{font-size:22px;margin:22px 0 10px}
.prose h2{margin-top:26px}
.prose li{margin:.2em 0}

.foot{max-width:760px;margin:30px auto 0;padding:18px 16px 30px;border-top:1px solid var(--rule);font-size:12px;color:var(--engrave)}
.foot p{margin:0 0 6px}

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

/* リスト（表） */
.note{font-size:12px;color:var(--engrave);margin:0 0 8px}
.list{width:100%;border-collapse:collapse;background:var(--sheet);border:1px solid var(--rule);font-size:12.5px}
.list thead th{font-size:10.5px;font-weight:700;color:var(--engrave);text-align:right;padding:6px;border-bottom:2px solid var(--ink);white-space:nowrap}
.list thead th:nth-child(-n+2){text-align:left}
.list td{padding:7px 6px;border-bottom:1px solid var(--rule-2);text-align:right;vertical-align:middle;white-space:nowrap}
.list tbody tr{cursor:pointer}
.list tbody tr:hover{background:color-mix(in srgb,var(--lamp) 10%,var(--sheet))}
.list td.no{color:#8A9097;font-size:10.5px;text-align:left;width:28px}
.list td.m{text-align:left;white-space:normal;line-height:1.3;width:100%}
.list td.m a{display:block;text-decoration:none;overflow:hidden}
.list td.m img{float:left;width:40px;height:40px;object-fit:contain;margin-right:8px;background:var(--stage);border:1px solid var(--rule-2)}
.list td.m i{display:block;font-style:normal;font-size:10.5px;color:var(--engrave)}
.list td.m b{font-size:13.5px}
.list td.v{font-weight:700}
.list td.empty{text-align:left;white-space:normal;padding:14px 10px}
.list .mini i{height:12px}
.more{margin-top:10px;width:100%}

.list td.b{padding-left:2px;padding-right:6px}
.ak{display:inline-grid;place-items:center;height:30px;padding:0 7px;border-radius:3px;font-size:10.5px;font-weight:900;text-decoration:none;color:#2A1700;
  background:linear-gradient(#F7B657,#E3922A);box-shadow:inset 0 1px 0 #FFD08A,0 2px 0 #9C5E12}
.ak:active{transform:translateY(2px);box-shadow:inset 0 1px 0 #FFD08A}
.list td{padding-left:5px;padding-right:5px}
.list td.m img{width:36px;height:36px;margin-right:7px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.list td.m a{display:grid;grid-template-columns:32px 1fr;column-gap:7px;align-items:center}
.list td.m img{float:none;width:32px;height:32px;margin:0;grid-row:span 2}
.list td.m b{font-size:13px;word-break:keep-all;overflow-wrap:anywhere}
.ak{height:28px;padding:0 6px;font-size:10px}
@media (max-width:420px){
  .list th:first-child,.list td.no{display:none}
  .list td.m i{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:9.5em}
}

/* メーカー */
.brands h1{font-size:22px;margin:22px 0 6px}
.makers{list-style:none;margin:0;padding:0;display:grid;gap:6px}
.makers a{display:flex;align-items:center;gap:10px;padding:8px 12px 8px 8px;background:var(--sheet);border:1px solid var(--rule);border-radius:3px;text-decoration:none}
.mk-imgs{display:flex;flex:none}
.mk-imgs img{width:34px;height:34px;object-fit:contain;background:var(--stage);border:1px solid var(--rule-2);margin-left:-8px}
.mk-imgs img:first-child{margin-left:0}
.mk-nm{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.3}
.mk-nm b{font-size:15px}.mk-nm small{font-size:11px;color:var(--engrave)}
.mk-n{font-size:20px;font-weight:900;color:var(--engrave)}
.brand-head{position:relative;height:96px;margin-bottom:52px;background:var(--stage);border-bottom:1px solid var(--rule)}
.brand-head .plate{bottom:-44px}
.brand-more{margin:12px 0 0}
.chips-mk{display:flex;flex-wrap:wrap;gap:5px}
.chips-mk a{padding:5px 10px;font-size:12.5px;font-weight:700;text-decoration:none;border:1px solid #A9AEB4;border-radius:3px;background:linear-gradient(#FCFCFC,#E3E5E8);color:#3A3E44}
.bar nav{gap:12px}
/* ヘッダー：メニュー3つでも1行に収める */
.bar{padding:10px 22px 10px 24px;gap:8px}
.wm b{white-space:nowrap;font-size:16px}
.bar nav{gap:10px;font-size:12.5px}
.bar nav a{white-space:nowrap}
@media (max-width:380px){.mark{width:26px;height:26px}.wm b{font-size:15px}.bar nav{gap:8px;font-size:12px}}
/* メーカーページの銘板は台なしで置く */
.brand-head{height:auto;margin:16px 16px 6px;background:none;border:0}
.brand-head .plate{position:relative;left:auto;right:auto;bottom:auto}
.list td.p{font-size:11.5px;white-space:normal;min-width:4.2em;line-height:1.3}
.list td.p{white-space:nowrap;font-size:11.5px;min-width:0}
.list td.pop{font-size:12px;white-space:nowrap}

/* ===== PC（960px以上） ===== */
.list .dt{display:none}
@media (min-width:960px){
  body{font-size:16px}
  main{max-width:1240px;padding:0 32px}
  section{padding:0}
  h2{font-size:19px;margin-top:44px}
  .bar{padding:12px 40px}
  .bar nav{gap:24px;font-size:14px}
  .wm b{font-size:18px}
  .mark{width:34px;height:34px}

  /* リスト：PCでは列を増やす */
  .list .dt{display:table-cell}
  .list{font-size:13.5px}
  .list thead th{font-size:11.5px;padding:8px 10px}
  .list td{padding:9px 10px}
  .list td.f{font-size:12px;color:var(--engrave);text-align:left}
  .list td.m{min-width:260px}
  .list td.m a{grid-template-columns:48px 1fr;column-gap:12px}
  .list td.m img{width:48px;height:48px}
  .list td.m b{font-size:15px}
  .list td.m i{max-width:none}
  .list td.no{display:table-cell}
  .list th:first-child{display:table-cell}
  .list td.p,.list td.pop{font-size:13.5px}
  .ak{height:32px;padding:0 12px;font-size:12px}
  .list tbody tr:hover{background:color-mix(in srgb,var(--lamp) 12%,var(--sheet))}

  /* トップ：写真と絞り込みを横に並べる */
  body[data-page=top] main{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);column-gap:40px;padding-top:28px}
  body[data-page=top] main>*{grid-column:1/-1}
  body[data-page=top] .hero{grid-column:1;grid-row:1;margin-bottom:56px}
  body[data-page=top] .intro{grid-column:2;grid-row:1;align-self:start}
  .hero-stage{border:1px solid var(--rule);border-radius:4px}
  .intro h1{font-size:28px;margin-top:4px}
  .intro p{font-size:15px}
  .sel .row{grid-template-columns:90px 1fr;min-height:52px}
  .sw b{padding:7px 14px;font-size:14px}
  .rail{display:grid;grid-template-columns:repeat(6,1fr);overflow:visible;margin:0;padding:0}
  .rail .tile{max-width:none}
  .call{margin:44px 0 0;display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:24px;padding:22px 28px}
  .call h2,.call p{grid-column:1}
  .call .key{grid-column:2;grid-row:1/span 3}
  .types{grid-template-columns:repeat(4,1fr)}
  .chips-mk a{font-size:13.5px;padding:6px 12px}
  .more{width:auto;padding:10px 40px}

  /* 機種ページ：写真と銘板を左に固定、内容を右に */
  .model{display:grid;grid-template-columns:440px minmax(0,1fr);column-gap:44px;padding-top:28px;align-items:start}
  .model .hero{position:sticky;top:84px;margin-bottom:56px}
  .model .body{padding:0}
  .model .body>.lead:first-child{margin-top:0}
  .lead{font-size:16px}
  .rack{padding:16px 18px 12px}
  .lv{grid-template-columns:7em 1fr 2.6em;font-size:13.5px;padding:5px 0}
  .seg i{height:11px}
  .faders{display:grid;grid-template-columns:1fr 1fr;column-gap:28px}
  .fit{display:grid;grid-template-columns:1fr 1fr;gap:0 28px}
  .model .rail{grid-template-columns:repeat(4,1fr)}
  .vote-form{grid-template-columns:1fr 1fr;column-gap:28px;padding:18px}
  .vote-form .own,.vote-form details,.vote-form .txt,.vote-form .key,.vote-form .msg{grid-column:1/-1}
  .vote-form .key{justify-self:start;padding:12px 32px}
  .buy{display:none}

  /* リストのページ：絞り込みを左の柱に */
  .find{display:grid;grid-template-columns:300px minmax(0,1fr);column-gap:32px;align-items:start}
  .find h1{grid-column:1/-1}
  .find .filters{grid-column:1;grid-row:2/span 4;position:sticky;top:84px}
  .find .filters .row{grid-template-columns:1fr;padding:10px 12px 4px;min-height:0}
  .find .filters .k{padding:0 0 4px}
  .find .filters .sw{padding:0 0 6px}
  .find>h2,.find>.note,.find>.list{grid-column:2}
  .find>h2{margin-top:0}

  /* メーカー */
  .brands .makers{grid-template-columns:repeat(3,1fr);gap:10px}
  .brand-head{margin:28px 0 8px;max-width:640px}

  .prose{max-width:760px;padding:6px 0 30px}
  .foot{max-width:1240px;padding:22px 32px 40px}
}
@media (min-width:1280px){
  .rail{grid-template-columns:repeat(6,1fr)}
  .model{grid-template-columns:500px minmax(0,1fr)}
}
@media (min-width:960px){
  .list td.m .fm{display:none}
  .bar{padding-left:max(40px,calc((100% - 1240px)/2 + 32px));padding-right:max(40px,calc((100% - 1240px)/2 + 32px))}
  .bar::before{left:max(12px,calc((100% - 1240px)/2 + 10px))}.bar::after{right:max(12px,calc((100% - 1240px)/2 + 10px))}
}
.key{font-weight:900;font-size:14px;line-height:1.2}
@media (min-width:960px){
  .find .list td.m{min-width:0}
  .find .list td.m b{font-size:14px}

  .key{font-size:15px;padding:12px 22px}
}

/* 並び替えできる項目名 */
.list thead th button{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:2px;white-space:nowrap}
.list thead th button:focus-visible{outline:2px solid var(--lamp);outline-offset:2px}
.list thead th button::after{content:"";width:0;height:0;border:3.5px solid transparent;border-top-color:#A9AEB4;margin-top:4px;opacity:.7}
.list thead th[aria-sort=ascending] button::after{border-top-color:transparent;border-bottom-color:var(--lamp-ink);margin-top:-4px;opacity:1}
.list thead th[aria-sort=descending] button::after{border-top-color:var(--lamp-ink);opacity:1}
.list thead th[aria-sort]{color:var(--ink)}

/* マイ棚 */
.shelf-sw{display:flex;align-items:center;flex-wrap:wrap;gap:0;margin-top:12px;padding:0}
.shelf-sw input:checked+b{background:linear-gradient(#F7B657,#E3922A);border-color:#9C5E12;color:#2A1700;box-shadow:inset 0 2px 3px rgba(0,0,0,.2)}
.shelf-link{margin-left:12px;font-size:12.5px;font-weight:700;color:var(--engrave)}
.shelf-n{display:inline-grid;place-items:center;min-width:16px;height:16px;margin-left:3px;padding:0 4px;border-radius:8px;background:var(--lamp);color:#2A1700;font-size:10px;font-weight:900;vertical-align:1px}
.shelf h1{font-size:22px;margin:22px 0 6px}
.shelf-sum{position:relative;margin:14px 0 0}
.shelf-sum .plate{position:relative;left:auto;right:auto;bottom:auto}
.share-row{display:flex;gap:8px}
.share-url{flex:1;min-width:0;font:inherit;font-size:12px;padding:8px;border:1px solid var(--rule);border-radius:3px;background:var(--stage);color:#23262B}
.shelf-empty{margin-top:20px;font-size:14px}
/* 機種ページ：銘板を画像に被らない位置まで下げる */
.model .hero{margin-bottom:84px}
.model .hero .plate{bottom:-78px}
@media (min-width:960px){.model .hero{margin-bottom:96px}}
.shelf-n[hidden]{display:none}
/* 銘板が重なる下端ぶんは画像を置かない余白にする */
.model .hero-stage{padding-bottom:64px;box-sizing:border-box}
.model .hero-stage img{height:100%;max-height:none}
@media (min-width:960px){.model .hero-stage{padding-bottom:40px}.model .hero .plate{bottom:-60px}.model .hero{margin-bottom:80px}}
@media (min-width:960px){.model .hero-stage{padding-bottom:64px;padding-top:12px}}
.model .hero-stage{padding-top:12px}

/* ===== 機種ページ：開いてすぐ要点とできることが見える形（案A） ===== */
.model .hero{display:grid;grid-template-columns:38% 1fr;gap:12px;align-items:stretch;margin:14px 16px 0}
.model .hero-stage{aspect-ratio:1;padding:6px;border:1px solid var(--rule);border-radius:3px}
.model .hero-stage img{width:100%;height:100%}
.model .hero .plate{position:relative;left:auto;right:auto;bottom:auto;display:flex;flex-direction:column;justify-content:center;padding:10px 12px}
.model .hero .plate-nm{font-size:22px;word-break:keep-all;overflow-wrap:anywhere}
.model .hero .plate-dl{gap:2px 12px}
.model .hero .plate-dl b{font-size:13px}
.model .hero{margin-bottom:0}
.glance{margin:12px 16px 0;display:grid;gap:10px}
.tags{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px}
.tags li{padding:4px 10px;font-size:12.5px;font-weight:800;border-radius:3px;background:var(--ink);color:var(--paper,#fff)}
@media (prefers-color-scheme:dark){.tags li{background:#ECEEF0;color:#23262B}}
.stats{display:grid;grid-template-columns:repeat(3,1fr);margin:0;background:var(--sheet);border:1px solid var(--rule);border-radius:3px}
.stats>div{padding:8px 10px;border-left:1px solid var(--rule-2)}
.stats>div:first-child{border-left:0}
.stats dt{font-size:11px;color:var(--engrave)}
.stats dd{margin:0;display:flex;align-items:center;gap:6px}
.stats dd b{font-size:18px;font-weight:900}
.stats .mini i{height:13px;width:6px}
.acts{display:grid;gap:8px}
.acts>.key{width:100%;padding:13px 16px;font-size:15px}
.acts-row{display:flex;gap:8px;align-items:stretch}
.acts-row .shelf-sw{margin:0;flex:1;flex-wrap:nowrap}
.acts-row .shelf-sw label{flex:1}
.acts-row .shelf-sw b{text-align:center;height:100%;display:grid;place-items:center}
.acts-row .key.g{padding:8px 14px;white-space:nowrap}
.tabs{position:sticky;top:56px;z-index:8;display:flex;margin:14px 0 0;padding:0 8px;background:var(--panel);border-bottom:1px solid var(--rule);overflow-x:auto;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs a{flex:1;text-align:center;padding:10px 8px;font-size:13px;font-weight:800;text-decoration:none;color:var(--engrave);border-bottom:3px solid transparent;white-space:nowrap}
.tabs a:hover,.tabs a:focus-visible{color:var(--ink);border-bottom-color:var(--lamp)}
.model .body{padding-top:4px}
.model .body h2{scroll-margin-top:110px}
#vote{scroll-margin-top:110px}
@media (min-width:960px){
  .model{grid-template-columns:440px minmax(0,1fr);grid-template-rows:auto auto 1fr}
  .model .hero{grid-column:1;grid-row:1/span 3;display:block;margin:0;position:sticky;top:84px}
  .model .hero-stage{aspect-ratio:1;padding:24px}
  .model .hero .plate{margin-top:10px}
  .model .hero .plate-nm{font-size:26px}
  .glance{grid-column:2;grid-row:1;margin:0}
  .tabs{grid-column:2;grid-row:2;top:62px;margin-top:16px;padding:0}
  .model .body{grid-column:2;grid-row:3}
  .tags li{font-size:13.5px;padding:5px 12px}
  .stats dd b{font-size:22px}
  .acts{grid-template-columns:auto 1fr;align-items:stretch}
  .acts>.key{width:auto;padding:13px 28px}
}
@media (min-width:1280px){.model{grid-template-columns:500px minmax(0,1fr)}}

/* 「評価する」を目立たせる */
.acts-main{display:grid;grid-template-columns:1.25fr 1fr;gap:8px}
.acts-main .key{padding:13px 10px;font-size:15px}
.key.v{display:inline-flex;align-items:center;justify-content:center;gap:8px;color:#fff;
  background:linear-gradient(#3F444B,#23262B);box-shadow:inset 0 1px 0 #5A6068,0 2px 0 #0E1012}
.key.v:active{transform:translateY(2px);box-shadow:inset 0 1px 0 #5A6068}
.vu{display:inline-flex;align-items:flex-end;gap:2px;height:14px}
.vu i{width:3px;background:var(--lamp);box-shadow:0 0 4px rgba(242,162,58,.7)}
.vu i:nth-child(1){height:5px}.vu i:nth-child(2){height:8px}.vu i:nth-child(3){height:11px}.vu i:nth-child(4){height:14px}.vu i:nth-child(5){height:9px;opacity:.45}
.acts .shelf-sw{margin:0;flex-wrap:nowrap}
.acts .shelf-sw label{flex:1}
.acts .shelf-sw b{text-align:center}
@media (prefers-color-scheme:dark){.key.v{background:linear-gradient(#5A6068,#3F444B);box-shadow:inset 0 1px 0 #737980,0 2px 0 #1D2024}}
.rack-cta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:10px;padding:10px 12px;border:1px dashed #5A6068;border-radius:3px;
  font-size:12.5px;color:#C2C8CF;text-decoration:none}
.rack-cta b{flex:none;padding:6px 12px;border-radius:3px;background:linear-gradient(#F7B657,#E3922A);color:#2A1700;font-size:13px}
.rack.has-v .rack-cta{display:none}
@media (min-width:960px){
  .acts{grid-template-columns:1fr;}
  .acts-main{grid-template-columns:auto auto;justify-content:start}
  .acts-main .key{padding:13px 26px}
  .acts .shelf-sw{justify-self:start}
}

/* 投稿フォーム：音質と音の傾向を同じ形で */
.vote-h{grid-column:1/-1;margin:10px 0 2px;font-size:14px;display:flex;align-items:baseline;gap:8px}
.vote-h small{font-size:11px;font-weight:600;color:var(--engrave)}
.trate{flex-wrap:wrap;gap:4px}
.tpick{display:flex;align-items:center;gap:6px}
.tpick small{font-size:10.5px;color:var(--engrave);font-weight:600;white-space:nowrap}
@media (max-width:420px){.trate{flex-direction:column;align-items:flex-start}.tpick{width:100%;justify-content:space-between}}
.tpick small{flex:1 1 0;min-width:4.4em}.tpick small:last-child{text-align:right}.tpick .pick5{flex:none}
.trate>span:first-child{white-space:nowrap}

/* 音質ラックに音の傾向を統合 */
.rack-sep{margin:10px 0 2px;padding-top:8px;border-top:1px solid #3A3F46;font-size:11px;letter-spacing:.08em;color:#9CA3AB}
.rack .fd{border:0;padding:3px 0}
.rack .fd .tw{display:block}
.rack .scale{display:block;position:relative;height:16px;margin:0 6px;background:repeating-linear-gradient(90deg,#5A6068 0 1px,transparent 1px 25%),linear-gradient(#4A5058,#4A5058) 0 50%/100% 2px no-repeat}
.rack .scale::after{content:"";position:absolute;right:0;top:0;width:1px;height:100%;background:#5A6068}
.rack .knob{top:0;background:linear-gradient(#C9CDD2,#8A9098);box-shadow:0 1px 2px rgba(0,0,0,.6)}
.rack .knob.v{background:linear-gradient(#F7B657,#E3922A);box-shadow:0 0 6px rgba(242,162,58,.55)}
.rack .ends{display:flex;font-size:10.5px;color:#8A9098;margin:1px 2px 0}

/* 音質表で直接評価する */
.rate-form{display:block}
.stars{--v:0;--my:0;position:relative;display:inline-block;font-size:19px;line-height:1;letter-spacing:0;white-space:nowrap}
.stars::before{content:"★★★★★";color:#4A5058}
.stars::after{content:"★★★★★";position:absolute;left:0;top:0;overflow:hidden;width:calc(var(--v) / 5 * 100%);color:#A9AEB4}
.rack.has-v .stars::after{color:var(--lamp);text-shadow:0 0 6px rgba(242,162,58,.5)}
.stars.sm{font-size:14px;margin-right:4px}
.glance .stars::before{color:var(--seg-off)}
.glance .stars::after{color:var(--lamp)}
.rack-hd{align-items:center}
.rack-hd .stw{display:inline-block;margin:0 auto 0 12px}
.segw,.stw,.tw{position:relative}
.segw{display:block}
input.ed{position:absolute;left:0;top:0;width:100%;height:100%;margin:0;opacity:0;pointer-events:none}
.rack:not(.editing) input.ed{visibility:hidden}
.rack.editing .segw,.rack.editing .stw,.rack.editing .scale{cursor:pointer;touch-action:none}
.rack.editing .segw,.rack.editing .stw{padding:6px 0;margin-top:-6px;margin-bottom:-6px}
.rack.editing .stw{margin-left:12px}
.rack-guide{display:none;margin:0 0 8px;padding:7px 10px;border-radius:3px;background:#3A2A12;color:#F7C77A;font-size:12px}
.rack.editing .rack-guide{display:block}
.rack.editing{box-shadow:inset 0 0 0 1px #3A3F46,0 0 0 2px var(--lamp)}
.rack.editing .stars::after{width:calc(var(--my) / 5 * 100%);color:var(--lamp);text-shadow:0 0 6px rgba(242,162,58,.5)}
.rack.editing [data-v=overall]{display:none}
.mine-n{display:none}
.rack.editing .mine-n{display:inline}
.rack.editing .seg i.on{background:var(--seg-off);box-shadow:none}
.rack.editing .seg i.my{background:var(--lamp);box-shadow:0 0 6px rgba(242,162,58,.55)}
.rack.editing .lv .n{font-size:0}
.rack.editing .lv .n::after{content:attr(data-my);font-size:12.5px}
.rack .knob.my{display:none}
.rack.editing .knob.v{display:none}
.rack.editing .knob.my.on{display:block;background:linear-gradient(#F7B657,#E3922A);box-shadow:0 0 6px rgba(242,162,58,.55)}
.sw-my{background:var(--lamp)}
.lg-my{display:none}
.rack.editing .lg-my{display:inline}
.rack.editing .legend span:not(.lg-my){display:none}
.rack-cta{width:100%;font:inherit;color:inherit;background:none;cursor:pointer;text-align:left}
.rack.editing .rack-cta{display:none}
.rate-panel{display:none;gap:8px;margin-top:10px;background:var(--sheet);border:1px solid var(--rule);border-radius:4px;padding:12px}
.rate-form.editing .rate-panel{display:grid}
.rate-btns{display:flex;gap:8px}
.rate-btns .key{flex:1}
.rate-btns .key.g{flex:none;background:linear-gradient(#FCFCFC,#E3E5E8);color:#3A3E44;border-color:#A9AEB4}
.vote .js-rate{margin:4px 0 12px}
.rack.editing .knob:not(.my){opacity:.3}
.rack.editing .seg i.ne:not(.my){opacity:.35}

.rack-sep{display:flex;justify-content:space-between;align-items:baseline}
.rack-sep small{font-size:10px;letter-spacing:0;color:#6E757D}
.rack-hd+.rack-sep{margin-top:6px}
.rack .lv{grid-template-columns:6.6em 1fr 2.2em;gap:6px}@media (min-width:960px){.rack .lv{grid-template-columns:8em 1fr 2.6em}}
.seg.s10{grid-template-columns:repeat(10,1fr);gap:2px}

/* Xで共有 */
.xshare{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:6px 10px;border:1px solid #5A6068;border-radius:3px;color:#E9EBED;font-size:12px;text-decoration:none}
.xshare svg,.xkey svg{width:14px;height:14px}
.rack.editing .xshare{display:none}
.shared{margin-top:10px}
.shared .key{display:flex;gap:8px;width:100%;background:#0F1012;color:#fff;border:1px solid #3A3F46}

/* ===== トップ：入口・棚・写真の壁 ===== */
.entry{padding-top:18px}
.entry-k{margin:0;font-size:11.5px;font-weight:900;letter-spacing:.12em;color:var(--lamp-ink)}
.entry h1{font-size:19px;margin:0 0 12px;letter-spacing:0}
.entry h1 b{font-size:30px;margin:0 3px;font-variant-numeric:tabular-nums}
.search input{width:100%;font:inherit;font-size:16px;padding:10px 12px;border:1px solid var(--rule);border-radius:4px;background:var(--sheet);color:var(--ink);box-shadow:inset 0 1px 2px rgba(0,0,0,.08)}
.search input:focus{outline:2px solid var(--lamp);outline-offset:0}
.shelf{margin-top:22px}
.shelf-hd{display:flex;justify-content:space-between;align-items:baseline;gap:8px}
.shelf-hd h2{margin:0 0 8px}
.shelf-hd a{flex:none;font-size:12.5px;font-weight:700;color:var(--lamp-ink);text-decoration:none}
.shelf-row{display:flex;overflow-x:auto;scroll-snap-type:x proximity;margin:0 -16px;padding:0 10px 8px;scrollbar-width:none}
.shelf-row::-webkit-scrollbar{display:none}
.sh{flex:none;width:126px;padding:0 6px;color:inherit;text-decoration:none;scroll-snap-align:start}
.sh-img{position:relative;display:block;aspect-ratio:1;background:var(--stage);border-radius:4px 4px 0 0;overflow:hidden}
.sh-img img{display:block;width:100%;height:100%;object-fit:contain;padding:10px;transition:transform .25s}
.board{position:relative;display:block;height:9px;margin:0 -6px;background:linear-gradient(var(--alu-1),var(--alu-2) 50%,var(--alu-edge));box-shadow:0 3px 4px rgba(0,0,0,.18)}
.board::after{content:"";position:absolute;left:12%;right:12%;bottom:-3px;height:3px;border-radius:2px;background:var(--lamp);opacity:0;filter:blur(3px);transition:opacity .2s}
.sh:hover .board::after,.sh:focus-visible .board::after{opacity:1}
.sh-t{display:block;padding:7px 1px 0}
.sh-t small{display:block;font-size:10.5px;line-height:1.3;color:var(--engrave);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sh-t b{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13px;line-height:1.35;min-height:2.7em}
.sh-m{display:flex;justify-content:space-between;align-items:center;gap:4px;margin-top:3px;font-size:12px;font-weight:700}
.sh-m .stars.sm{font-size:10.5px;margin:0}
.sh-m .stars::before{color:var(--rule)}
.sh-m .stars::after{color:var(--lamp)}
.sh:hover .sh-img img,.wt:hover .sh-img img{transform:scale(1.06)}
.wall-hd{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:30px}
.wall-hd h2{margin:0}
.view{flex:none}
.view b{padding:4px 10px;font-size:12px}
.wall-q{margin:10px 0 14px}
.wall{display:grid;grid-template-columns:repeat(3,1fr);gap:16px 8px}
.wt{display:block;color:inherit;text-decoration:none}
.wt .sh-img{border-radius:4px;box-shadow:inset 0 0 0 1px var(--rule-2);transition:box-shadow .2s}
.wt:hover .sh-img,.wt:focus-visible .sh-img{box-shadow:inset 0 0 0 1px var(--rule-2),0 8px 18px -8px var(--lamp)}
.wall p{grid-column:1/-1}
.nexts .shelf{padding:0}
.nexts .shelf-row{margin:0 -16px}
@media (min-width:960px){
  .entry h1{font-size:24px}.entry h1 b{font-size:38px}
  .search{max-width:520px}
  .sh{width:164px;padding:0 8px}
  .board{margin:0 -8px}
  .wall{grid-template-columns:repeat(6,1fr);gap:24px 16px}
  .shelf-row{margin:0;padding:0 0 8px}
}

.entry h1{display:flex;flex-wrap:wrap;align-items:baseline;column-gap:12px;font-size:16px;line-height:1.3}
.entry h1 span{white-space:nowrap}
.entry h1 b{font-size:28px}
.entry h1 small{flex-basis:100%;font-size:13px;font-weight:700;color:var(--engrave)}
.sh{width:114px}
.shelf-nav{margin-left:auto;display:flex;gap:4px}
.shelf-nav button{width:28px;height:24px;border:1px solid var(--rule);border-radius:3px;background:linear-gradient(#FCFCFC,#E3E5E8);color:#3A3E44;font:900 16px/1 inherit;cursor:pointer}
.shelf-hd a{margin-left:8px}
@media (min-width:960px){.entry h1{font-size:20px}.entry h1 b{font-size:38px}.entry h1 small{font-size:14px}.sh{width:164px}}

/* ===== トップの装飾 ===== */
.entry{position:relative;overflow:hidden;padding-bottom:4px}
.entry::before{content:"";position:absolute;right:-28px;top:6px;width:150px;height:150px;opacity:.10;pointer-events:none;
  background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'%3E%3Cpath d='M7.5 19v-3a8.5 8.5 0 0 1 17 0v3' fill='none' stroke='%2323262B' stroke-width='2.2' stroke-linecap='round'/%3E%3Crect x='4' y='17' width='6.5' height='10.5' rx='3.2' fill='%2323262B'/%3E%3Crect x='21.5' y='17' width='6.5' height='10.5' rx='3.2' fill='%2323262B'/%3E%3C/svg%3E")}
@media (prefers-color-scheme:dark){.entry::before{filter:invert(1)}}
.entry>*{position:relative}
.i{width:1em;height:1em;flex:none}
.entry-chips{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 12px;padding:0;list-style:none}
.entry-chips li{display:inline-flex;align-items:center;gap:5px;padding:3px 9px 3px 7px;border:1px solid var(--rule);border-radius:999px;background:var(--sheet);font-size:12px;font-weight:700;color:var(--engrave)}
.entry-chips li[hidden]{display:none}
.entry-chips .i{font-size:14px;color:var(--lamp-ink)}
.entry-chips b{color:var(--ink);font-size:13px}
.search{position:relative}
.search .i{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-size:18px;color:var(--engrave);pointer-events:none}
.search input{padding-left:38px}
.ic{flex:none;display:inline-grid;place-items:center;width:30px;height:30px;border-radius:6px;background:linear-gradient(#34383E,#1E2125);color:var(--lamp);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 1px 2px rgba(0,0,0,.25)}
.ic .i{font-size:18px;filter:drop-shadow(0 0 3px rgba(242,162,58,.55))}
.shelf-hd{align-items:center}
.shelf-hd h2{display:flex;flex-direction:column;gap:0;margin:0;line-height:1.25}
.shelf-hd h2 small{font-size:11.5px;font-weight:700;color:var(--engrave)}
.shelf-hd{margin-bottom:10px}
.shelf-hd a{margin-left:auto;display:inline-flex;gap:3px;align-items:center}
.shelf-nav{margin-left:auto}.shelf-nav+a{margin-left:8px}
.wall-hd .ic{margin-right:-2px}
.wall-hd h2{margin-right:auto}
.sh-img .bd{position:absolute;right:5px;bottom:5px;padding:1px 6px;border-radius:3px;background:rgba(35,38,43,.82);color:#E9EBED;font-size:9.5px;font-weight:700;line-height:1.6;letter-spacing:.02em}
.rk{position:absolute;left:0;top:0;min-width:24px;height:24px;padding:0 6px;display:grid;place-items:center;border-radius:4px 0 6px 0;background:#3A3F46;color:#fff;font-size:13px;font-weight:900}
.rk.top{background:linear-gradient(#F7B657,#E3922A);color:#2A1700}
@media (min-width:960px){.entry::before{width:240px;height:240px;right:0}.ic{width:34px;height:34px}.ic .i{font-size:20px}.sh-img .bd{font-size:10.5px}}
.model .body h2{margin-top:20px}.model .body>h2:first-child,.model .body>.lead:first-child+h2{margin-top:10px}.model .nexts .shelf{margin-top:18px}@media (min-width:960px){.model .body h2{margin-top:24px}}

/* ===== 機種ページの銘板 ===== */
.model .hero .plate{justify-content:flex-start;gap:0;padding:12px 12px 10px}
.plate-top{display:flex;align-items:center;justify-content:space-between;gap:6px;margin-bottom:5px}
.plate-brand{display:inline-block;max-width:100%;padding:2px 8px 1px;border-radius:3px;background:linear-gradient(#34383E,#1E2125);color:#F4F5F6;font-size:13px;font-weight:900;letter-spacing:.06em;line-height:1.5;text-decoration:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:inset 0 1px 0 rgba(255,255,255,.1),0 1px 1px rgba(0,0,0,.25)}
.plate-brand:hover{color:var(--lamp)}
.plate-no{flex:none;font-size:10.5px;font-weight:800;color:var(--engrave);letter-spacing:.04em}
.model .hero .plate-nm{margin:0 0 8px}
.plate-st{align-self:flex-start;margin:-4px 0 8px}
.plate-sp{display:grid;grid-template-columns:1fr 1fr;gap:6px 8px;margin:0;padding-top:8px;border-top:1px solid rgba(0,0,0,.12)}
.plate-sp div{min-width:0}
.plate-sp dt{display:flex;align-items:center;gap:3px;font-size:10px;font-weight:700;color:var(--engrave);line-height:1.3;white-space:nowrap}
.plate-sp dt .i{font-size:12px;color:var(--lamp-ink)}
.plate-sp dd{margin:1px 0 0;font-size:13px;font-weight:800;line-height:1.25;overflow-wrap:anywhere}
.hero-tags{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:5px;margin:0;padding:0;list-style:none}
.hero-tags li{display:inline-flex;align-items:center;gap:4px;padding:2px 8px 2px 6px;border-radius:999px;font-size:11.5px;font-weight:700;line-height:1.6}
.hero-tags .i{font-size:13px}
.hero-tags .u{background:var(--sheet);border:1px solid var(--rule);color:var(--ink)}
.hero-tags .u .i{color:var(--lamp-ink)}
.hero-tags .f{background:#2A2D32;border:1px solid #2A2D32;color:#E9EBED}
.hero-tags .f .i{color:var(--lamp)}
@media (min-width:960px){
  .plate-brand{font-size:15px;padding:3px 10px 2px}
  .plate-sp{grid-template-columns:repeat(3,1fr);gap:8px 12px}
  .plate-sp dt{font-size:11px}.plate-sp dd{font-size:14px}
  .model .hero .hero-tags{margin-top:10px}
}
.model .hero{grid-template-columns:36% minmax(0,1fr)}.model .hero .plate{min-width:0}.plate-sp dt{overflow:hidden;text-overflow:ellipsis}.shelf-sw b{white-space:nowrap}
.model .hero-stage{align-self:center;width:100%;height:auto;min-width:0}

/* ===== メーカー・マイ棚の銘板 ===== */
.brand-head{display:grid;gap:10px}
.brand-head .plate{padding:12px 14px 12px}
.brand-head .plate-nm{font-size:28px;margin:0 0 8px}
.plate-brand{display:inline-flex;align-items:center;gap:4px}
.plate-brand .i{font-size:13px;color:var(--lamp)}
.plate-sp dd .stars.sm{font-size:11px;margin:0}
.plate-sp dd .stars::before{color:rgba(0,0,0,.18)}.plate-sp dd .stars::after{color:var(--lamp)}
.plate-top1{display:flex;align-items:center;gap:8px;margin-top:10px;padding:7px 10px;border-radius:4px;background:#24272C;color:#E9EBED;text-decoration:none}
.plate-top1 .i{font-size:20px;color:var(--lamp)}
.plate-top1 span:nth-child(2){flex:1;display:flex;flex-direction:column;line-height:1.3}
.plate-top1 small{font-size:10.5px;color:#9CA3AB}.plate-top1 b{font-size:14px}
.hero-tags li b{margin-left:3px;font-weight:900}
.brand-head .hero-tags .u{gap:0}
.makers a{align-items:center}
.mk-nm{gap:2px}
.mk-meta,.mk-cnt{display:flex;flex-wrap:wrap;gap:2px 10px;align-items:center}
.mk-meta span,.mk-cnt span{display:inline-flex;align-items:center;gap:3px}
.mk-meta .i,.mk-cnt .i{font-size:12px;color:var(--lamp-ink)}
.mk-cnt{font-weight:700;color:var(--ink)!important}
.mk-cnt .stars.sm{font-size:10.5px;margin:0}
.mk-cnt .stars::before{color:var(--rule)}.mk-cnt .stars::after{color:var(--lamp)}
.mk-n{display:flex;flex-direction:column;align-items:center;line-height:1;min-width:2.4em}
.mk-n small{font-size:9.5px;font-weight:700;margin-top:3px}
.shelf h2 .i{font-size:18px;color:var(--lamp-ink)}
.shelf-sum .plate{position:relative;left:auto;right:auto;bottom:auto}

/* ヘッダーのメニューにアイコン */
.bar nav a{display:inline-flex;align-items:center;gap:3px}
.bar nav a .i{font-size:15px;color:var(--engrave)}
.bar nav a[aria-current] .i,.bar nav a:hover .i{color:var(--lamp-ink)}
.shelf-title{display:flex;align-items:center;gap:6px}
.shelf-title .i{color:var(--lamp-ink)}
@media (max-width:374px){.bar nav a .i{display:none}}
@media (max-width:400px){.bar nav{gap:7px}.bar nav a{gap:2px}.bar nav a .i{font-size:13px}}
.mark{width:34px;height:34px;filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.3))}@media (max-width:380px){.mark{width:30px;height:30px}}@media (min-width:960px){.mark{width:38px;height:38px}}

/* ===== レビュー記事（横スクロール） ===== */
.revs{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -16px;padding:2px 16px 10px;scrollbar-width:none}
.revs::-webkit-scrollbar{display:none}
.rv{flex:0 0 82%;max-width:320px;scroll-snap-align:start;display:flex;flex-direction:column;background:var(--sheet);border:1px solid var(--rule);border-top:3px solid var(--lamp);border-radius:4px;padding:10px 12px 12px}
.rv:only-child{flex-basis:100%;max-width:none}
.rv-hd{display:flex;align-items:center;gap:6px;font-size:10.5px;font-weight:700;color:var(--engrave)}
.rv-k{padding:1px 7px;border-radius:999px;background:#2A2D32;color:#E9EBED}
.rv-reddit{background:#3A2A12;color:#F7C77A}
.rv-forum{background:#3A3F46}
.rv-l{padding:0 6px;border:1px solid var(--rule);border-radius:999px}
.rv-hd time{margin-left:auto;font-variant-numeric:tabular-nums}
.rv-site{margin:8px 0 0;font-size:11.5px;font-weight:700;color:var(--lamp-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rv-t{margin:2px 0 6px;font-size:14px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rv-s{flex:1;margin:0;font-size:13px;line-height:1.7}
.rv-go{align-self:flex-start;margin-top:10px;display:inline-flex;gap:4px;font-size:12.5px;font-weight:800;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--lamp)}
@media (min-width:960px){.revs{margin:0;padding:2px 0 10px}.rv{flex-basis:300px}}

/* Amazonで買えない機種（v0.5） */
.img-credit{margin:4px 0 0;font-size:10px;color:var(--engrave)}
.alt{margin:0 0 20px;padding:12px 14px;border:1px solid var(--lamp);border-radius:6px}
.alt h2{margin-top:0}
.alt-list{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.alt-list li{display:flex;align-items:center;gap:10px}
.alt-m{flex:1;min-width:0;display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none}
.alt-m img{width:52px;height:52px;object-fit:contain;flex:none;background:#fff;border-radius:4px}
.alt-m span{min-width:0;display:grid;line-height:1.3}
.alt-m small,.alt-m i{font-size:11px;font-style:normal;color:var(--engrave)}
.alt-m b{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ak.g{background:none;color:inherit;border:1px solid currentColor}
.ak-x{font-size:10px;color:var(--engrave);white-space:nowrap}

/* ===== 絞り込み（チップと引き出しパネル） ===== */
.chip{position:relative;display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 12px;border:1px solid var(--rule);border-radius:999px;background:var(--sheet);color:var(--ink);font:700 12.5px/1 inherit;font-family:inherit;white-space:nowrap;cursor:pointer;user-select:none;-webkit-tap-highlight-color:transparent}
.chip input{position:absolute;opacity:0;pointer-events:none}
.chip:hover{border-color:var(--engrave)}
.chip:has(input:checked),.chip[aria-pressed=true],.chip.on{background:#2A2D32;border-color:#2A2D32;color:#F4F5F6}
.chip:has(input:checked)::before,.chip[aria-pressed=true]::before,.chip.on::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--lamp);box-shadow:0 0 6px var(--lamp)}
.chip:has(input:focus-visible){outline:2px solid var(--lamp);outline-offset:1px}
.chip.x span{margin-left:2px;opacity:.7;font-size:14px}
.chip.clr{background:none;border-style:dashed;color:var(--engrave)}
.chip.clr::before{display:none}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.fbar{position:sticky;top:var(--bar-h,56px);z-index:20;display:flex;align-items:center;gap:6px;margin:10px -16px 0;padding:8px 16px;background:var(--panel);border-bottom:1px solid var(--rule-2)}
.fopen{flex:none;display:inline-flex;align-items:center;gap:5px;height:30px;padding:0 12px;border:0;border-radius:999px;background:linear-gradient(#34383E,#1E2125);color:#F4F5F6;font:800 12.5px/1 inherit;font-family:inherit;cursor:pointer}
.fopen .i{font-size:15px;color:var(--lamp)}
.fn{min-width:18px;height:18px;padding:0 5px;border-radius:9px;background:var(--lamp);color:#2A1700;font-size:11px;display:inline-grid;place-items:center}
.fn[hidden]{display:none}
.fquick{flex:1;min-width:0;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;mask-image:linear-gradient(90deg,#000 88%,transparent)}
.fquick::-webkit-scrollbar{display:none}
.fsort{flex:none;position:relative;display:inline-flex;align-items:center}
.fsort .i{position:absolute;left:8px;font-size:14px;color:var(--engrave);pointer-events:none}
.fsort select{appearance:none;-webkit-appearance:none;height:30px;padding:0 10px 0 26px;border:1px solid var(--rule);border-radius:999px;background:var(--sheet);color:var(--ink);font:700 12px/1 inherit;font-family:inherit}
.factive{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0 0}
.factive[hidden]{display:none}
.bmain .note{margin:10px 0}
.fpanel{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;flex-direction:column;max-height:84vh;background:var(--panel);border-radius:14px 14px 0 0;box-shadow:0 -8px 30px rgba(0,0,0,.25);transform:translateY(105%);transition:transform .25s ease;visibility:hidden}
.browse.fopen-on .fpanel{transform:none;visibility:visible}
.fback{position:fixed;inset:0;z-index:55;background:rgba(0,0,0,.35)}
.fback[hidden]{display:none}
html.noscroll{overflow:hidden}
.fp-hd{display:flex;align-items:center;justify-content:space-between;padding:12px 16px 8px;border-bottom:1px solid var(--rule-2)}
.fp-hd b{display:inline-flex;align-items:center;gap:6px;font-size:15px}
.fp-hd .i{color:var(--lamp-ink)}
.fclear{border:0;background:none;color:var(--lamp-ink);font:700 12.5px inherit;font-family:inherit;cursor:pointer}
.fp-body{overflow-y:auto;padding:4px 16px 12px;-webkit-overflow-scrolling:touch}
.fg{border:0;margin:0;padding:10px 0 4px}
.fg+.fg{border-top:1px solid var(--rule-2)}
.fg legend{float:left;width:100%;margin-bottom:7px;font-size:11.5px;font-weight:800;letter-spacing:.06em;color:var(--engrave)}
.fmore{width:100%}
.fmore summary{display:inline-block;margin:2px 0 6px;font-size:12px;font-weight:700;color:var(--lamp-ink);cursor:pointer;list-style:none}
.fmore summary::-webkit-details-marker{display:none}
.fmore[open] summary{margin-bottom:6px}
.fp-ft{padding:10px 16px calc(10px + env(safe-area-inset-bottom));border-top:1px solid var(--rule-2)}
.fshow{width:100%}
.wall-hd .view{margin-left:auto}
.wall .empty,.find-hd+.browse .empty{grid-column:1/-1;color:var(--engrave)}
.find-hd{padding-top:16px}.find-hd h1{margin:0}
@media (min-width:960px){
  .fbar{position:static;margin:12px 0 0;padding:0;background:none;border:0}
  .fopen,.fquick{display:none}
  .fsort{margin-left:auto}
  .bwrap{display:grid;grid-template-columns:232px minmax(0,1fr);gap:28px;align-items:start;margin-top:10px}
  .fpanel{position:sticky;top:84px;z-index:auto;transform:none;visibility:visible;max-height:calc(100vh - 100px);border-radius:6px;box-shadow:none;border:1px solid var(--rule);background:var(--sheet);transition:none}
  .fback{display:none!important}
  .fp-ft{display:none}
  .fp-body{padding:2px 14px 12px}
  .chip{height:28px;padding:0 10px;font-size:12px}
  .wall{grid-template-columns:repeat(5,1fr)}
}
.fg{display:block;min-width:0}.fg legend{float:none;display:block;width:auto;padding:0}.fg .chips,.fmore .chips{justify-content:flex-start}.fsort select{max-width:96px}@media (max-width:400px){.fsort select{max-width:40px;padding-right:0;color:transparent}.fsort .i{left:12px;color:var(--ink)}}
.fg-l{margin:0 0 7px;font-size:11.5px;font-weight:800;letter-spacing:.06em;color:var(--engrave)}.fg{padding:12px 0 10px}

.plate-no{margin-left:auto}
.plate-x{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:#0F1012;color:#fff;box-shadow:0 1px 2px rgba(0,0,0,.3)}
.plate-x svg{width:12px;height:12px}
.plate-x:hover{background:#2A2D32}
@media (min-width:960px){.plate-x{width:28px;height:28px}.plate-x svg{width:14px;height:14px}}
.why{display:inline-block;margin-bottom:3px;padding:0 6px;border-radius:3px;background:#2A2D32;color:var(--lamp);font-style:normal;font-size:10px;font-weight:800;line-height:1.7}
.shelf-hd{justify-content:flex-start}.shelf-hd h2{margin-right:auto;align-items:flex-start}.model .body .shelf-hd h2{margin-top:0}

/* about：ネットのレビューの集計 */
.rs{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin:14px 0 6px}
.rs div{background:var(--sheet);border-radius:8px;padding:10px 12px}
.rs dt{font-size:12px;color:var(--engrave)}
.rs dd{margin:2px 0 0;font:600 22px/1.2 ui-monospace,SFMono-Regular,Menlo,monospace;color:var(--ink)}
.rs dd small{font:400 12px/1 system-ui,sans-serif;margin-left:3px;color:var(--engrave)}
@media (min-width:760px){.rs{grid-template-columns:repeat(4,1fr)}}

/* 一覧ページの説明文・フッターの形式/用途リンク */
.list-intro{padding-bottom:6px}
.list-intro p{margin:.5em 0;line-height:1.8}
.foot-nav p{display:flex;flex-wrap:wrap;gap:4px 12px;margin:.4em 0;font-size:12.5px}
.foot-nav b{color:var(--engrave);font-weight:600;margin-right:2px}
