/* ============================================================
   棚の前で — 共通スタイル
   色は必ずトークン経由で。ライト／ダーク両方で読めるようにしてあります。
   ============================================================ */
:root{
  --paper:#F2F1EC; --card:#FBFAF7; --ink:#171C22; --ink-2:#5C636C;
  --ai:#1B4965; --ai-soft:#E6EDF2;
  --shu:#A93526; --shu-soft:#F6E8E5;
  --deep:#1B4965; --deep-fg:#F1EFE9;
  --rule:#DDDAD2; --rule-2:#C6C2B8;
  --shadow-1:rgba(20,24,30,.18); --shadow-2:rgba(20,24,30,.30); --edge:rgba(0,0,0,.30);
  --ok:#2C6E49; --ok-soft:#E6F0E9; --warn:#8A6216; --warn-soft:#F5EEDF;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --paper:#10141A; --card:#19202A; --ink:#E9E7E1; --ink-2:#98A1AC;
    --ai:#86B9D6; --ai-soft:#1B2A36;
    --shu:#E2796A; --shu-soft:#32211E;
    --deep:#22405A; --deep-fg:#DDE9F1;
    --rule:#272F3A; --rule-2:#3B4653;
    --shadow-1:rgba(0,0,0,.50); --shadow-2:rgba(0,0,0,.66); --edge:rgba(0,0,0,.55);
    --ok:#6FBF8E; --ok-soft:#16261D; --warn:#D9AF62; --warn-soft:#2A2315;
  }
}
:root[data-theme="dark"]{
  --paper:#10141A; --card:#19202A; --ink:#E9E7E1; --ink-2:#98A1AC;
  --ai:#86B9D6; --ai-soft:#1B2A36;
  --shu:#E2796A; --shu-soft:#32211E;
  --deep:#22405A; --deep-fg:#DDE9F1;
  --rule:#272F3A; --rule-2:#3B4653;
  --shadow-1:rgba(0,0,0,.50); --shadow-2:rgba(0,0,0,.66); --edge:rgba(0,0,0,.55);
  --ok:#6FBF8E; --ok-soft:#16261D; --warn:#D9AF62; --warn-soft:#2A2315;
}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  background:var(--paper); color:var(--ink);
  font-family:"Zen Kaku Gothic New","Hiragino Sans","Yu Gothic UI",system-ui,sans-serif;
  font-size:15px; line-height:1.85; margin:0;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%}
.wrap{max-width:860px; margin-inline:auto; padding-inline:20px}
.wrap--narrow{max-width:720px}
a{color:var(--ai)}
:focus-visible{outline:2px solid var(--shu); outline-offset:2px; border-radius:2px}
.mono{font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace; font-variant-numeric:tabular-nums}
.eyebrow{
  font-family:"JetBrains Mono",ui-monospace,monospace;
  font-size:11px; letter-spacing:.18em; color:var(--ink-2);
  text-transform:uppercase; margin:0 0 10px;
}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}

/* ---- 設定うながし（アフィリエイトID未設定のあいだだけ） ---- */
#setup{background:var(--shu-soft); border-bottom:1px solid var(--shu); font-size:13px; line-height:1.7}
#setup .wrap{padding-block:10px}
#setup b{color:var(--shu)}
#setup code{font-family:"JetBrains Mono",monospace; font-size:12px; background:var(--card); padding:1px 5px; border-radius:2px}

/* ---- 共通ヘッダ ---- */
.masthead{border-bottom:2px solid var(--ink); padding-block:34px 20px}
.masthead--compact{padding-block:22px 14px; border-bottom-width:1px}
.masthead .kicker{display:flex; justify-content:space-between; align-items:baseline; gap:16px; flex-wrap:wrap}
.masthead--full .kicker{margin-bottom:24px}
.brand{font-family:"Shippori Mincho",serif; font-weight:700; font-size:20px; letter-spacing:.16em; margin:0}
.brand a{color:inherit; text-decoration:none}
.dateline{font-size:12px; letter-spacing:.12em; color:var(--ink-2); margin:0}
.lede{
  font-family:"Shippori Mincho",serif; font-weight:500;
  font-size:clamp(27px,6.4vw,42px); line-height:1.42; letter-spacing:.02em;
  margin:0 0 16px; text-wrap:balance;
}
.standfirst{margin:0; max-width:34em; color:var(--ink-2); font-size:14.5px}

/* ---- PR表示（ステマ規制・景表法） ---- */
.pr{
  display:flex; gap:12px; align-items:flex-start;
  border:1px solid var(--rule-2); border-left:4px solid var(--shu);
  background:var(--card); padding:13px 16px; margin-block:26px;
  font-size:13px; line-height:1.75; color:var(--ink-2);
}
.pr .tag{
  flex:none; font-family:"JetBrains Mono",monospace; font-size:11px; letter-spacing:.1em;
  color:var(--shu); border:1px solid var(--shu); padding:1px 6px; border-radius:2px; margin-top:4px;
}

/* ---- 書影 ---- */
.jacket{position:relative; display:block; align-self:start; line-height:0; border-radius:2px}
.jacket img{
  display:block; width:100%; height:auto;
  border-radius:1px 3px 3px 1px; background:var(--card);
  box-shadow:0 1px 2px var(--shadow-1), 0 10px 20px -10px var(--shadow-2);
}
.jacket::before{
  content:""; position:absolute; top:0; bottom:0; left:0; width:6px;
  background:linear-gradient(90deg, var(--edge), rgba(0,0,0,.06) 55%, transparent);
  border-radius:1px 0 0 1px; pointer-events:none;
}
.jacket:hover img{box-shadow:0 2px 4px var(--shadow-1), 0 14px 26px -10px var(--shadow-2)}
.jacket__src{
  display:block; line-height:1.5; margin-top:9px;
  font-family:"JetBrains Mono",monospace; font-size:9.5px; letter-spacing:.06em;
  color:var(--ink-2); text-align:center;
}

/* ---- 一覧（トップ） ---- */
.shelf{display:flex; flex-direction:column}
.book{display:grid; grid-template-columns:120px 1fr; gap:26px; padding-block:34px; border-top:1px solid var(--rule)}
.book:first-child{border-top:none}
.book__body{min-width:0}
.badge{
  display:inline-block; font-family:"JetBrains Mono",monospace;
  font-size:10.5px; letter-spacing:.14em; color:var(--shu);
  border:1px solid var(--shu); border-radius:2px; padding:2px 7px; margin:0 0 10px;
}
.title{
  font-family:"Shippori Mincho",serif; font-weight:700;
  font-size:clamp(21px,4.6vw,27px); line-height:1.4; letter-spacing:.02em;
  margin:0 0 6px; text-wrap:balance;
}
.title a{color:inherit; text-decoration:none; border-bottom:1px solid var(--rule-2)}
.title a:hover{border-bottom-color:var(--ai); color:var(--ai)}
.byline{margin:0 0 14px; font-size:13.5px; color:var(--ink-2)}
.summary{margin:0 0 16px; font-size:14.5px}
.more{
  display:inline-block; font-size:13.5px; text-decoration:none;
  border-bottom:1px solid currentColor; padding-bottom:1px;
}

/* ---- ジャンル・分量のチップ ---- */
.tags{display:flex; gap:6px; flex-wrap:wrap; margin:0 0 14px; padding:0; list-style:none}
.tags li{margin:0}
.chip-tag{
  display:inline-block; font-size:11.5px; line-height:1.6; letter-spacing:.06em;
  padding:2px 11px; border-radius:99px;
  border:1px solid var(--rule-2); color:var(--ink-2);
}
.chip-tag--genre{background:var(--ai-soft); border-color:transparent; color:var(--ai); font-weight:500}

/* ---- 4軸の星 ---- */
.meters{
  display:grid; grid-template-columns:auto 1fr; gap:7px 16px; align-items:center;
  margin:0 0 18px; padding:14px 16px;
  background:var(--card); border:1px solid var(--rule); border-radius:2px;
}
.meters{margin-bottom:8px}
.meters__note{
  margin:0 0 18px; padding:0 2px;
  font-size:11.5px; line-height:1.7; color:var(--ink-2);
}
.meters dt{font-size:12px; color:var(--ink-2); letter-spacing:.08em}
/* おすすめ度は総評。いちばん上に置き、線で区切って大きく出す */
.meters dt.rec, .meters dd.rec{
  margin-bottom:6px; padding-bottom:9px; border-bottom:1px solid var(--rule);
}
.meters dt.rec{color:var(--ink); font-weight:700; letter-spacing:.1em; align-self:center}
.meters dd.rec .stars{font-size:20px; letter-spacing:.1em}
.meters dd .stars b{color:var(--ink)}
.meters dd .stars i{color:var(--rule-2)}
.meters dd.rec .stars b{color:var(--shu)}
.meters dd{margin:0; line-height:1}
.stars{font-size:14px; letter-spacing:.16em; white-space:nowrap}
.stars b{color:var(--shu); font-weight:400}
.stars i{color:var(--rule-2); font-style:normal}

/* 奥付ふうの書誌 */
.colophon{
  display:grid; grid-template-columns:auto 1fr; gap:3px 16px;
  font-size:12.5px; margin:0 0 18px; padding:12px 14px;
  background:var(--card); border:1px solid var(--rule); border-radius:2px;
}
.colophon dt{color:var(--ink-2); letter-spacing:.08em}
.colophon dd{margin:0}

/* ---- ボタン ---- */
.actions{display:flex; flex-direction:column; gap:14px}
.actions__row{display:flex; gap:8px; align-items:center; flex-wrap:wrap}
.rowlabel{font-family:"JetBrains Mono",monospace; font-size:10.5px; letter-spacing:.12em; color:var(--ink-2); flex:none; width:100%; margin-bottom:-6px}
.btn{
  display:inline-block; text-decoration:none; font-size:13px; line-height:1.4;
  font-family:inherit; cursor:pointer;
  padding:9px 14px; border:1px solid var(--rule-2); border-radius:2px;
  background:var(--card); color:var(--ink); transition:border-color .15s, filter .15s;
}
.btn:hover{border-color:var(--ink-2)}
.btn--buy{background:var(--deep); color:var(--deep-fg); border-color:transparent}
.btn--buy:hover{filter:brightness(1.15); border-color:transparent}
.btn--store{border-left:3px solid var(--shu)}
.btn--ghost{background:transparent; border-style:dashed; color:var(--ink-2)}

/* ============================================================
   個別ページ
   ============================================================ */
.crumbs{font-size:12.5px; color:var(--ink-2); padding-block:18px 0; margin:0}
.crumbs a{text-decoration:none; border-bottom:1px solid var(--rule-2)}
.crumbs span{margin-inline:7px; color:var(--rule-2)}

.hero{display:grid; grid-template-columns:200px 1fr; gap:34px; padding-block:26px 34px; align-items:start}
.hero .title{font-size:clamp(26px,5.6vw,36px); margin-bottom:10px}
.hero__lede{
  font-family:"Shippori Mincho",serif; font-size:clamp(15px,3.4vw,17px);
  line-height:1.85; margin:0 0 20px; color:var(--ink);
}

.prose{padding-block:6px}
.prose h2{
  font-family:"Shippori Mincho",serif; font-weight:700;
  font-size:19px; letter-spacing:.04em; margin:34px 0 12px;
  padding-bottom:8px; border-bottom:1px solid var(--rule);
}
.prose h2:first-child{margin-top:0}
.prose h3{font-size:15px; font-weight:700; margin:20px 0 6px}
.prose h3 a{color:inherit}
.prose p{margin:0 0 16px; font-size:15px}
.prose em{font-style:normal; font-weight:500; background:linear-gradient(transparent 62%, var(--ai-soft) 62%)}

.pull{
  border-left:2px solid var(--rule-2); padding-left:14px;
  margin:0 0 18px; font-size:14px; color:var(--ink-2);
}
.pull b{color:var(--ink); font-weight:500}

/* ---- 個別ページ：店頭で買う／借りる のタブ ---- */
.tabs{display:flex; gap:2px; border-bottom:1px solid var(--rule); margin:0 0 18px}
.tab{
  font-family:inherit; font-size:14.5px; line-height:1.6;
  padding:9px 20px; cursor:pointer; white-space:nowrap;
  background:none; border:none; border-bottom:2px solid transparent;
  color:var(--ink-2); margin-bottom:-1px;
}
.tab:hover{color:var(--ink)}
.tab[aria-selected="true"]{color:var(--ink); border-bottom-color:var(--shu); font-weight:500}

/* ---- 住所入力 ---- */
.addr{display:flex; gap:8px; flex-wrap:wrap; align-items:stretch; margin:0 0 6px}
.addr input{
  flex:1 1 240px; min-width:0; font-family:inherit; font-size:14px;
  padding:10px 13px; border:1px solid var(--rule-2); border-radius:2px;
  background:var(--card); color:var(--ink);
}
.addr button{
  font-family:inherit; font-size:13.5px; padding:10px 18px; cursor:pointer;
  border:1px solid var(--rule-2); border-radius:2px;
  background:var(--card); color:var(--ink);
}
.addr button:hover{border-color:var(--ink-2)}
.addr__hint{margin:0 0 20px; font-size:12px; color:var(--ink-2); line-height:1.7}

/* ---- 図書館の貸出状況（カーリルAPI） ---- */
.lib{list-style:none; margin:18px 0 0; padding:0}
.lib li{
  display:grid; grid-template-columns:1fr auto; gap:3px 14px; align-items:center;
  padding:12px 0; border-bottom:1px solid var(--rule);
}
.lib__name{margin:0; font-size:14.5px; font-weight:500}
.lib__sub{margin:0; grid-column:1; grid-row:2; font-size:12px; color:var(--ink-2)}
.lib__right{grid-column:2; grid-row:1 / span 2; display:flex; gap:8px; align-items:center; flex-wrap:wrap; justify-content:flex-end}
.status{
  font-size:12.5px; line-height:1.6; padding:2px 11px; border-radius:99px;
  white-space:nowrap; border:1px solid var(--rule-2); color:var(--ink-2);
}
.status--ok{color:var(--ok); border-color:var(--ok); background:var(--ok-soft); font-weight:500}
.status--busy{color:var(--shu); border-color:var(--shu)}
.status--warn{color:var(--warn); border-color:var(--warn); background:var(--warn-soft)}
.libnote{margin:14px 0 0; font-size:12px; color:var(--ink-2); line-height:1.8}
.libnote code{font-family:"JetBrains Mono",monospace; font-size:11.5px; background:var(--card); padding:1px 5px; border-radius:2px}
.loading{margin:18px 0 0; font-size:13.5px; color:var(--ink-2)}
.loading::after{content:"…"; animation:dots 1.2s steps(4,end) infinite}
@keyframes dots{0%{opacity:.3}50%{opacity:1}100%{opacity:.3}}

.online{border-top:1px solid var(--rule); margin-top:30px; padding-top:4px}
.online .group{margin-top:22px}
.bibnote{margin:18px 0 0; font-size:12px; color:var(--ink-2)}

/* 個別ページの在庫一覧（静的） */
.stores{list-style:none; margin:0; padding:0}
.stores li{display:grid; grid-template-columns:1fr auto; gap:4px 16px; align-items:center; padding:14px 0; border-bottom:1px solid var(--rule)}
.store__name{font-size:14.5px; font-weight:500; margin:0}
.store__what{font-size:12.5px; color:var(--ink-2); margin:0; grid-column:1; grid-row:2; line-height:1.7}
.stores .btn{white-space:nowrap; grid-column:2; grid-row:1 / span 2; align-self:center}
.group{font-family:"JetBrains Mono",monospace; font-size:11px; letter-spacing:.16em; color:var(--shu); margin:28px 0 0}
.group--online{color:var(--ai)}
.group--lib{color:var(--ink-2)}

/* 他の本へ */
.related{border-top:1px solid var(--rule); padding-block:30px 10px}
.related__grid{
  display:grid; grid-template-columns:repeat(auto-fill,minmax(112px,1fr));
  gap:22px 18px; margin-top:18px; padding:0; list-style:none;
}
.related__grid li{margin:0}
.related__note{margin:10px 0 0; font-size:14px; color:var(--ink-2)}
.related__title{
  display:block; font-family:"Shippori Mincho",serif; font-size:13px; line-height:1.5;
  margin-top:10px; text-decoration:none; color:var(--ink);
}
.related__title:hover{color:var(--ai)}
.related__meta{display:block; font-size:11px; color:var(--ink-2); margin-top:2px}

/* ============================================================
   在庫チェッカー（トップのみ）
   ============================================================ */
.checker{border-top:2px solid var(--ink); margin-top:20px; padding-block:34px 44px}
.h2{font-family:"Shippori Mincho",serif; font-weight:700; font-size:clamp(23px,5vw,31px); line-height:1.45; margin:0 0 12px; letter-spacing:.02em}
.intro{margin:0 0 22px; color:var(--ink-2); font-size:14px; max-width:36em}
.field{display:flex; gap:8px; flex-wrap:wrap; align-items:stretch; margin-bottom:12px}
.field input{
  flex:1 1 220px; min-width:0;
  font-family:"JetBrains Mono",monospace; font-size:15px; letter-spacing:.06em;
  padding:11px 13px; border:1px solid var(--rule-2); border-radius:2px;
  background:var(--card); color:var(--ink);
}
.field button{
  font-family:inherit; font-size:14px; padding:11px 22px; cursor:pointer;
  border:1px solid transparent; border-radius:2px;
  background:var(--deep); color:var(--deep-fg);
}
.field button:hover{filter:brightness(1.15)}
.chips{display:flex; gap:7px; flex-wrap:wrap; margin-bottom:26px}
.chip{
  font-family:inherit; font-size:12.5px; cursor:pointer;
  padding:6px 12px; border-radius:99px;
  border:1px solid var(--rule-2); background:transparent; color:var(--ink-2);
}
.chip:hover{border-color:var(--ai); color:var(--ai)}
.chip[aria-pressed="true"]{background:var(--ai-soft); border-color:var(--ai); color:var(--ai)}

.result__head{display:flex; gap:15px; align-items:center; padding-bottom:14px; border-bottom:1px solid var(--rule)}
.result__thumb{
  width:56px; flex:none; height:auto; border-radius:1px 2px 2px 1px;
  box-shadow:0 1px 2px var(--shadow-1), 0 6px 14px -8px var(--shadow-2);
}
.result__isbn{display:block; font-size:17px; letter-spacing:.08em}
.result__note{display:block; font-size:12.5px; color:var(--ink-2)}
.result__err{color:var(--shu); font-size:13.5px; margin:0}

/* ---- フッタ ---- */
.foot{border-top:1px solid var(--rule); padding-block:26px 44px; font-size:12.5px; color:var(--ink-2); line-height:1.9}
.foot p{margin:0 0 8px; max-width:42em}

@media (max-width:640px){
  .hero{grid-template-columns:132px 1fr; gap:22px}
}
@media (max-width:520px){
  .book{grid-template-columns:96px 1fr; gap:18px}
  .hero{grid-template-columns:110px 1fr; gap:18px}
  .jacket__src{font-size:9px}
  .stores li{grid-template-columns:1fr}
  .store__what{grid-row:auto}
  .stores .btn{grid-row:auto; grid-column:1; justify-self:start; margin-top:8px}
  .related__grid{grid-template-columns:repeat(auto-fill,minmax(92px,1fr)); gap:18px 14px}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none !important; animation:none !important; scroll-behavior:auto !important}
}

/* 貸出可のときの冊数（3/29冊 など） */
.lib__copies{font-size:11px; color:var(--ink-2); font-variant-numeric:tabular-nums; white-space:nowrap}

/* ---- 耳で聴く・読み放題（Audible / Kindle Unlimited） ---- */
.subs{margin-top:26px}
.group--subs{color:var(--ink-2)}
.subs__list{
  list-style:none; margin:14px 0 0; padding:0;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:12px;
}
.subs__list li{
  margin:0; padding:14px 16px;
  background:var(--card); border:1px solid var(--rule); border-radius:2px;
  border-left:3px solid var(--deep);
}
.subs__name{margin:0 0 4px; font-size:14.5px; font-weight:500}
.subs__what{margin:0 0 12px; font-size:12.5px; color:var(--ink-2); line-height:1.7}

/* ============================================================
   作家ページ・読みもの（2026-09-26）
   ============================================================ */
.cast{margin:0 0 16px; display:grid; grid-template-columns:auto 1fr; gap:6px 16px; font-size:14.5px}
.cast dt{font-weight:500; white-space:nowrap}
.cast dd{margin:0; color:var(--ink-2)}
.morelink{margin:18px 0 0; font-size:14px}
.artlist{margin:14px 0 0; padding-left:1.2em; font-size:14.5px}
.pick{display:grid; grid-template-columns:110px 1fr; gap:20px; padding:22px 0; border-bottom:1px solid var(--rule)}
.pick:first-child{padding-top:6px}
.pick .jacket img{width:110px; height:auto}
.pick__title{font-family:"Shippori Mincho",serif; font-size:18px; margin:0 0 4px; line-height:1.5}
.pick__title a{color:var(--ink); text-decoration:none}
.pick__title a:hover{color:var(--ai)}
.pick__n{display:inline-block; min-width:1.6em; color:var(--shu); font-size:14px}
.pick__meta{margin:0 0 10px !important; font-size:12.5px !important; color:var(--ink-2)}
.pick__links{display:flex; flex-wrap:wrap; gap:6px 16px; font-size:13px !important; margin:0 !important}
.order{margin:0 0 12px; padding-left:1.4em; font-size:15px}
.order li{padding:3px 0}
.order span{margin-left:10px; font-size:12px; color:var(--ink-2)}
.booklist{list-style:none; margin:0 0 16px; padding:0}
.booklist li{padding:12px 0; border-bottom:1px solid var(--rule)}
.booklist a{font-family:"Shippori Mincho",serif; font-size:16px}
.booklist__meta{margin-left:10px; font-size:12px; color:var(--ink-2)}
.booklist__lede{display:block; font-size:13.5px; color:var(--ink-2); margin-top:2px; line-height:1.7}
.toc{background:var(--card); border:1px solid var(--rule); padding:14px 18px; margin:0 0 20px}
.toc ol{margin:0; padding-left:1.4em; font-size:14px}
@media (max-width:520px){
  .pick{grid-template-columns:84px 1fr; gap:14px}
  .pick .jacket img{width:84px}
  .cast{grid-template-columns:1fr; gap:0 0}
  .cast dd{margin-bottom:8px}
}