/* アルバムの形の試し「丸みあり」（2026-10-03 夜 本人「albumの表紙は黒革のように背表紙と表紙の境目を丸く加工できる？」→「革バインダーのお試し→アルバムの形 丸みあり、丸みなし で切り替えできるようにして」）。
   ⚠️ 同日の経緯: ①黒革と同じ当て方 → ②参考画像（紫のバインダー）の当て方「背表紙くらく、境目ハイライト、表紙の左濃い影、表紙明るい」 → ③本人が調整ページ .playwright-mcp/round_adjust/ で作った値「丸みあるは本人調整版で」（いまの値）。
   ①は .playwright-mcp/round_binder/round_prev.css、②は round_ref.css に写してある（git の履歴にもある）。
   いまの値: 背表紙 全体の暗さ 20%・表紙側の暗さ 70%・境目の光 60%（広がり 0）・表紙の左の影（溝）幅 2.5cqw ぼかし 2cqw #000d1f＋広い影 #000d1f＋溝2 幅 8cqw ぼかし 4cqw #e5f1ff 45%・表紙の明るさ 0。
   形は直角のまま陰影だけで丸く見せる。黒革の冊には効かせない。背表紙の暗さは縁の色（--sp-seam）。表紙の影の色は本人が選んだ #000d1f（ほぼ黒の紺）。
   ~~try-binder.js が TOP にいる間だけ差し込む（web/try/binder/round.css）~~ ⚠️ 2026-10-04 本人「アルバムは丸みあり（いま）確定。まるみなしは候補として置いといて。※切り替えは削除」→ 本番にした（index.html で top.css のあとにいつも読む）。
   🔁 丸みなし（候補）に戻すとき: このファイルを読まなければよい（index.html の <link> を外す）。丸みなしは top.css の指定そのもの（本人の調整版）。調整版 2（round_v2.css）は消した（git の履歴にある）。
   見比べ .playwright-mcp/round_binder/ */

/* 背表紙: 縁の色でうすく暗く・表紙側の手前で濃く・表紙側の端で白い光（今までの境目の濃い線は光に置き換える） */
.binder:not(.leather) .b-spine {
  --sp-round: linear-gradient(to right, rgba(0, 0, 0, .05) 0, rgba(0, 0, 0, .03) 60%, rgba(0, 0, 0, .18) 86%, rgba(255, 255, 255, .32) 96%, rgba(255, 255, 255, .56) 100%);
  background: var(--sp-shade), var(--sp-round), var(--sp-back);
  --sp-shade: linear-gradient(to bottom, rgba(16, 32, 72, 0) 50%, rgba(16, 32, 72, .2) 100%); /* 底の暗さは丸みありを調整したときの値（縁の色 85%）のまま。2026-10-03 夜 丸みなしだけ 20% にしたので、ここで戻す */
}
@supports (color: color-mix(in srgb, red, blue)) {
  .binder:not(.leather) .b-spine {
    --sp-shade: linear-gradient(to bottom, transparent 50%, color-mix(in srgb, var(--sp-seam) 85%, transparent) 100%);
    --sp-round: linear-gradient(to right,
      color-mix(in srgb, var(--sp-seam) 25%, transparent) 0,
      color-mix(in srgb, var(--sp-seam) 15%, transparent) 60%,
      color-mix(in srgb, var(--sp-seam) 70%, transparent) 86%,
      rgba(255, 255, 255, .32) 96%,
      rgba(255, 255, 255, .56) 100%);
  }
}
.binder.big:not(.leather) .b-spine { background: var(--sp-shade), var(--sp-round), var(--sp-back); } /* 大きいアルバムも同じ塗りを、top.css の丸みなしの指定（.binder.big:not(.leather) .b-spine）より後ろで指定する（2026-10-03 夜 丸みなしの調整版を入れたとき、こちらの陰影が消えていた） */
.binder.small:not(.leather) .b-spine { background: var(--sp-shade), var(--sp-round), var(--sp-back); }

/* 表紙: 左の端に白い線 → 濃い溝（#000d1f）→ うすい青白の溝 2 → 広い影（#000d1f）。上・右・下の縁の線は top.css と同じ */
.binder.big:not(.leather) .b-front {
  box-shadow:
    inset max(1px, .5cqw) 0 0 rgba(255, 255, 255, .64),      /* 境目の光 */
    inset 0 var(--fw) 0 rgba(255, 255, 255, .35),
    inset calc(-1 * var(--fw)) 0 0 rgba(42, 49, 64, .25),
    inset 0 calc(-1 * var(--fw)) 0 rgba(42, 49, 64, .25),
    inset 2.5cqw 0 2cqw -.94cqw #000d1f,                     /* 表紙の左の影（溝） */
    inset 8cqw 0 4cqw -3cqw rgba(229, 241, 255, .45),        /* 溝 2（#e5f1ff 45%） */
    inset 4.38cqw 0 2.81cqw -1.88cqw #000d1f;                /* 広い影 */
}
.binder.small:not(.leather) .b-front::before {
  box-shadow:
    inset max(1px, .5cqw) 0 0 rgba(255, 255, 255, .64),
    inset 0 1px 0 rgba(255, 255, 255, .35),
    inset -1px 0 0 rgba(42, 49, 64, .25),
    inset 0 -1px 0 rgba(42, 49, 64, .25),
    inset 2.5cqw 0 2cqw -.94cqw #000d1f,
    inset 8cqw 0 4cqw -3cqw rgba(229, 241, 255, .45),
    inset 4.38cqw 0 2.81cqw -1.88cqw #000d1f;
}
