/* トップ「夜の棚」（site.css の上に重ねる。D案 2026-10-19）
   アイコンを方眼に合わせて並べる。カードの枠は付けず、アイコン・名前・一言・状態だけ。「台帳」に切り替えると同じ項目が表になる */
.home .wrap{max-width:1080px}
.home main{padding:32px 0 72px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* 最初の画面（品評会の案1「棚が主役」2026-10-19）：事実の見出し → 数字の1行 → 最新の記録の帯 → すぐ棚。キャッチコピーは置かない */
.hero{display:grid;gap:14px;margin-bottom:28px}
.hero h1{font-size:clamp(26px,4.4vw,40px);line-height:1.3;margin:0}
.nums{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:4px 22px;font-family:var(--f-mono);font-size:13px;color:var(--muted)}
.nums b{font-weight:500;color:var(--sand);font-size:15px;margin-left:2px;font-variant-numeric:tabular-nums}
.band{display:grid;grid-template-columns:auto auto 1fr auto;gap:4px 16px;align-items:baseline;margin-top:6px;padding:10px 14px;text-decoration:none;color:#172022;
  background-color:#f4f2ea;background-image:linear-gradient(#1720220f 1px,transparent 1px),linear-gradient(90deg,#1720220f 1px,transparent 1px);background-size:16px 16px}
.band:hover{background-color:#fbfaf5}
.band:focus-visible{outline:2px solid var(--sand);outline-offset:2px}
.band .k,.band .dt{font-family:var(--f-mono);font-size:12px;color:#56605f;white-space:nowrap}
.band .tt{font-family:var(--f-head);font-weight:700;font-size:15px;line-height:1.5;min-width:0}
@media (max-width:640px){.band{grid-template-columns:auto 1fr;gap:2px 10px}.band .tt{grid-column:1/-1}.band .dt{display:none}}

/* 絞り込みと表示の切り替え（スクリプトが動くときだけ出す） */
.shelf-head{display:none;justify-content:space-between;align-items:center;gap:10px 16px;flex-wrap:wrap;border-top:1.5px solid var(--text);padding:12px 0 6px}
.js .shelf-head{display:flex}
.shelf-wrap{border-top:1.5px solid var(--text)}
.js .shelf-wrap{border-top:0}
.chips,.view{display:flex;gap:6px;flex-wrap:wrap}
.chips button,.view button{font-family:var(--f-mono);font-size:12.5px;background:transparent;color:var(--muted);border:1px solid #ffffff2e;padding:4px 10px;min-height:34px;cursor:pointer}
.chips button span{opacity:.7;margin-left:2px}
.chips button:hover,.view button:hover{color:var(--ivory);border-color:#ffffff66}
.chips button.on{background:var(--text);color:var(--bg);border-color:var(--text)}
.view button[aria-pressed="true"]{border-color:var(--sand);color:var(--sand)}
.chips button:focus-visible,.view button:focus-visible{outline:2px solid var(--sand);outline-offset:2px}

/* 棚（アイコン表示） */
.shelf{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px 0}  /* PCは1段6個まで（本人決定 2026-10-19）。タブレット4個、スマホ3個 */
@media (max-width:900px){.shelf{grid-template-columns:repeat(4,minmax(0,1fr))}}
.item a{display:grid;justify-items:start;align-content:start;gap:3px;padding:14px 12px 12px;text-decoration:none;color:inherit;height:100%;outline:1px solid transparent;outline-offset:-1px;transition:outline-color .12s,background-color .12s}
.item a:hover{outline-color:var(--sand);background:#d9d3a80a}
.item a:focus-visible{outline:2px solid var(--sand)}
.ic{width:64px;height:64px;display:block;margin-bottom:8px;border-radius:14px;box-shadow:0 0 0 1px #ffffff1f}
.nm{font-family:var(--f-head);font-weight:700;font-size:14.5px;line-height:1.35;color:var(--ivory)}
.one{font-size:13px;line-height:1.5;color:var(--muted)}
.ds,.ct{display:none}
.st{font-family:var(--f-mono);font-size:11.5px;line-height:1.5;border:1px solid var(--sand);color:var(--sand);padding:0 6px;margin-top:6px;white-space:nowrap}
.st.beta{border-style:dashed}
.st.paid{background:var(--sand);color:var(--bg)}

/* 台帳表示 */
.shelf[data-view="list"]{grid-template-columns:1fr;gap:0;border-top:1.5px solid var(--text)}
.shelf[data-view="list"] .item a{grid-template-columns:44px minmax(9em,13em) 1fr auto;grid-template-areas:"ic nm ds st" "ic one ds st";column-gap:16px;row-gap:0;align-items:center;padding:12px 8px;border-bottom:1px solid var(--line)}
.shelf[data-view="list"] .ic{grid-area:ic;width:44px;height:44px;margin:0;border-radius:10px;align-self:center}
.shelf[data-view="list"] .nm{grid-area:nm;align-self:end}
.shelf[data-view="list"] .one{grid-area:one;align-self:start;font-size:12.5px}
.shelf[data-view="list"] .ds{grid-area:ds;display:block;font-size:14px;line-height:1.7;color:var(--text)}
.shelf[data-view="list"] .st{grid-area:st;margin:0;justify-self:end}
@media (max-width:640px){
  .shelf{grid-template-columns:repeat(3,minmax(0,1fr))}
  .item a{padding:12px 6px}
  .ic{width:56px;height:56px;border-radius:12px}
  .nm{font-size:13.5px}.one{font-size:12px}
  .shelf[data-view="list"] .item a{grid-template-columns:44px 1fr auto;grid-template-areas:"ic nm st" "ic one st" "ic ds ds"}
  .shelf[data-view="list"] .ds{font-size:13px;margin-top:4px}
}

/* 新しい記録：ここだけ昼のノートの紙。読みものの側への入口 */
.logs{margin-top:48px;background-color:#f4f2ea;color:#172022;padding:20px clamp(16px,3vw,28px) 16px;
  background-image:linear-gradient(#1720220f 1px,transparent 1px),linear-gradient(90deg,#1720220f 1px,transparent 1px);background-size:16px 16px}
.logs h2{font-family:var(--f-mono);font-weight:500;font-size:12.5px;letter-spacing:.06em;color:#56605f;margin:0 0 8px}
.logs .rows{display:grid;background:#fbfaf5;border-top:1.5px solid #172022;border-bottom:1.5px solid #172022}
.logs .rows a{display:grid;grid-template-columns:5.5em 1fr auto;gap:4px 16px;align-items:baseline;padding:12px 12px;text-decoration:none;color:#172022;border-bottom:1px solid #d5d0bf}
.logs .rows a:last-child{border-bottom:0}
.logs .rows a:hover{background:#efece2}
.logs .k,.logs .dt{font-family:var(--f-mono);font-size:12px;color:#56605f}
.logs .tt{font-family:var(--f-head);font-weight:700;font-size:16px;line-height:1.5}
.logs .more{display:flex;flex-wrap:wrap;gap:6px 20px;margin:12px 0 0;font-size:14px}
.logs .more a{color:#2e4747;text-underline-offset:3px}
@media (max-width:640px){.logs .rows a{grid-template-columns:1fr}.logs .dt{order:3}}