/* ⚠️ 2026-10-10 本人「アルバム事に選べるようにして」→ この案は data-st="E2" の付いたアルバムにだけ効く（指定に :where([data-st="E2"]) を足した・index.html でいつも読む）。
   :where() で包むのは、指定の強さ（詳しさ）を前と同じにするため（強くすると、前は丸みの陰影などに負けて出ていなかった背表紙の地が出て、見た目が変わる＝コードレビュー） */
/* 依頼 45 E2: 帯を上下左右とも端まで（背表紙の面ぜんぶが帯の色）（デザイン担当）。top.css の後ろに足す。色は B1 の 9 色。
   右端の継ぎ目（--sp-seam）と底側の暗さ（--sp-shade）は残す。天地に見える背表紙の板の縁も帯の色にそろえる（最後の節。外せば地の色のまま） */
/* ⚠️ 2026-10-12 夜 いまは上品_01（黒革）の背表紙の文字（番号・名前・CARD ALBUM）だけを描く。背表紙の地・縁・天地の板・9 色の帯は binder-leather.css が上書きしていて効いていなかったので消した（コードレビュー担当の指摘・108 冊を撮って違う画素 0 を確かめた） */
.binder:where([data-st="E2"]){
  --bandtx: #fff;                   /* 番号・名前・CARD ALBUM の文字の色 */
}

.big:where([data-st="E2"]){ --seam-w: max(2.5px, .75cqw); }    /* 継ぎ目の幅（文字を背表紙の真ん中に置くため） */
.small:where([data-st="E2"]){ --seam-w: 1px; }

:where(.binder[data-st="E2"]) .b-spine::before, :where(.binder[data-st="E2"]) .b-spine::after, :where(.binder[data-st="E2"]) .b-spine > .spine-text{ z-index: 1; }

/* 大きいアルバム: 余白が無くなった分、全体を上へ寄せて名前の欄を広げる */
.big:where([data-st="E2"]) .b-spine::before{                      /* 番号: 6.5〜17cqw */
  content: attr(data-no); position: absolute; left: calc(50% - var(--seam-w) / 2); top: 6.5cqw; transform: translateX(-50%);
  font-size: 8.6cqw; font-weight: 600; line-height: 1; letter-spacing: .02em; color: var(--bandtx);
  padding-bottom: 2cqw; border-bottom: max(1px, .3cqw) solid rgba(255, 255, 255, .78);
}
.big:where([data-st="E2"]) .spine-text{                           /* 名前: 21.5〜65.5cqw（5.4cqw。全角でおよそ 7〜8 字まで） */
  left: calc(50% - var(--seam-w) / 2); top: 21.5cqw; transform: translateX(-50%);
  font-size: 5.4cqw; letter-spacing: .08em; color: var(--bandtx); max-height: 44cqw;
}
.big:where([data-st="E2"]) .b-spine::after{                       /* CARD ALBUM: 下から 8cqw、約 68.4〜96cqw */
  content: "CARD ALBUM"; position: absolute; left: calc(50% - var(--seam-w) / 2); bottom: 8cqw; transform: translateX(-50%);
  writing-mode: vertical-rl; -webkit-text-orientation: sideways; text-orientation: sideways; white-space: nowrap;
  font-size: 2.3cqw; font-weight: 600; letter-spacing: .2em; line-height: 1; color: var(--bandtx); opacity: .8;
}

/* 小さいアルバム */
.small:where([data-st="E2"]) .b-spine::before{
  content: attr(data-no); position: absolute; left: calc(50% - .5px); top: 6cqw; transform: translateX(-50%);
  font-size: 10.5cqw; font-weight: 700; line-height: 1; color: var(--bandtx);
}
.small:where([data-st="E2"]) .spine-text{
  left: calc(50% - .5px); top: 20cqw; transform: translateX(-50%);
  font-size: 6.8cqw; letter-spacing: .04em; color: var(--bandtx); max-height: 74cqw;
}