/* 深淵書架 相関星図 ── 概略シート・出典アコーディオン(ISSUE-K05)
   デザイントークンは shinen-tokens.css を正とする(2026-07: 意匠刷新)。 */
/* バグ修正(2026-07-24 ユーザー報告、shinen-kinship-overlay.cssと同根): #commonHeader
   (z-index:9999)より確実に手前へ出るよう、オーバーレイ(10500)より上の値に引き上げる。 */
.shn-kinship-sheet-backdrop {
  position: fixed;
  inset: 0;
  z-index: 10600;
  background: rgba(4, 6, 10, .45);
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s;
}
.shn-kinship-sheet-backdrop.is-open { opacity: 1; pointer-events: auto; }

.shn-kinship-sheet {
  position: fixed;
  left: 50%;
  bottom: 0;
  transform: translate(-50%, 105%);
  z-index: 10700;
  width: min(560px, 100%);
  max-height: 72vh;
  overflow-y: auto;
  background-color: #181e2b;
  border: 1px solid var(--shn-hairline);
  border-bottom: none;
  border-radius: 10px 10px 0 0;
  padding: 20px 22px calc(24px + env(safe-area-inset-bottom));
  transition: transform .3s cubic-bezier(.2, .8, .2, 1);
  color: var(--shn-bone);
  font-family: var(--shn-font-body);
}
.shn-kinship-sheet * { box-sizing: border-box; }
.shn-kinship-sheet.is-open { transform: translate(-50%, 0); }

.shn-kinship-sheet-grip { width: 38px; height: 3px; border-radius: 2px; background: rgba(232, 227, 213, .25); margin: 0 auto 16px; }
.shn-kinship-sheet-head { display: flex; gap: 16px; align-items: center; margin-bottom: 14px; }
.shn-kinship-sheet-img { width: 72px; height: 72px; border-radius: 50%; object-fit: cover; border: 2px solid var(--shn-gold-dim); }
.shn-kinship-sheet-name { font-family: var(--shn-font-display); font-size: 21px; letter-spacing: .08em; }
.shn-kinship-sheet-en { font-family: var(--shn-font-mono); font-size: 11px; color: var(--shn-bone-dim); letter-spacing: .14em; }
.shn-kinship-sheet-cls { display: inline-block; margin-top: 5px; font-size: 10px; letter-spacing: .2em; border-radius: 2px; padding: 2px 8px; border: 1px solid; }
.shn-kinship-sheet-summary { font-size: 13.5px; color: #cfc9bb; margin-bottom: 14px; }

.shn-kinship-sheet-rels { border-top: 1px solid var(--shn-hairline); padding-top: 12px; margin-bottom: 18px; }
.shn-kinship-sheet-rels div { font-size: 12px; color: var(--shn-bone-dim); padding: 3px 0; }
.shn-kinship-apr-ly { font-family: var(--shn-font-mono); font-size: 9.5px; color: #6b665c; }
.shn-kinship-rel-link {
  background: none; border: none; color: var(--shn-bone); font: inherit; font-weight: 500;
  cursor: pointer; padding: 0; text-decoration: underline dotted rgba(201, 162, 39, .55); text-underline-offset: 3px;
}
.shn-kinship-rel-link:hover, .shn-kinship-rel-link:focus-visible { color: var(--shn-gold); outline: none; }

.shn-kinship-apr { border-top: 1px solid var(--shn-hairline); margin-bottom: 18px; }
.shn-kinship-apr summary {
  cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center;
  padding: 12px 0; font-family: var(--shn-font-display); font-size: 13px; letter-spacing: .12em; color: var(--shn-gold);
}
.shn-kinship-apr summary::-webkit-details-marker { display: none; }
.shn-kinship-apr-n { font-family: var(--shn-font-mono); font-size: 10px; color: var(--shn-bone-dim); letter-spacing: .06em; }
.shn-kinship-apr-chev { transition: transform .2s; color: var(--shn-bone-dim); font-size: 11px; margin-left: 8px; display: inline-block; }
.shn-kinship-apr[open] .shn-kinship-apr-chev { transform: rotate(90deg); }
.shn-kinship-apr-first { background: rgba(201, 162, 39, .08); border: 1px solid rgba(201, 162, 39, .3); border-radius: 3px; padding: 9px 12px; font-size: 12px; margin-bottom: 8px; color: #cfc9bb; }
.shn-kinship-apr-tag { display: block; font-family: var(--shn-font-mono); font-size: 9px; letter-spacing: .25em; color: var(--shn-gold); margin-bottom: 3px; }
.shn-kinship-apr-grp { font-family: var(--shn-font-mono); font-size: 9.5px; letter-spacing: .18em; color: var(--shn-phos); margin: 10px 0 3px; }
.shn-kinship-apr-wk { font-size: 12px; color: var(--shn-bone-dim); padding: 2.5px 0; line-height: 1.7; }
.shn-kinship-apr-wk b { color: var(--shn-bone); font-weight: 500; }
.shn-kinship-apr-yr { font-family: var(--shn-font-mono); font-size: 10px; color: #6b665c; margin-left: 6px; }

.shn-kinship-sheet-link {
  display: block; text-align: center; text-decoration: none;
  font-family: var(--shn-font-display); font-size: 14px; letter-spacing: .25em;
  color: var(--shn-abyss); background: var(--shn-gold); border-radius: 3px; padding: 13px 0;
  transition: filter .2s;
}
.shn-kinship-sheet-link:hover { filter: brightness(1.12); }
.shn-kinship-sheet-link.is-disabled { background: #3a3629; color: #8b8574; pointer-events: none; }

.shn-kinship-sheet-close { position: absolute; top: 14px; right: 16px; background: none; border: none; color: var(--shn-bone-dim); font-size: 20px; cursor: pointer; line-height: 1; }

@media (prefers-reduced-motion: reduce) {
  .shn-kinship-sheet, .shn-kinship-sheet-backdrop { transition: none !important; }
}