.diff-output { white-space: pre-wrap; overflow-wrap: anywhere; text-align: left; line-height: 1.8; }
/* 追加は下線、削除は取り消し線。色が見分けにくくても、線の違いで区別できるようにする。
   単語・文字単位では1文字ずつに記号を付けると読めなくなるため、線で表す。 */
.diff-output ins { background: #d8f3dc; color: #14532d; text-decoration: underline; text-decoration-thickness: 2px; }
.diff-output del { background: #fee2e2; color: #991b1b; text-decoration: line-through; }

/* 行単位のときは行頭に ＋／－ を出す。記号があるので線は外し、行全体を読みやすくする。 */
.diff-output.marked ins, .diff-output.marked del { text-decoration: none; }
.diff-output.marked ins::before { content: "＋"; font-weight: 700; opacity: .8; margin-right: 2px; }
.diff-output.marked del::before { content: "－"; font-weight: 700; opacity: .8; margin-right: 2px; }

@media (prefers-color-scheme: dark) {
  .diff-output ins { background: #123524; color: #7ee2a0; }
  .diff-output del { background: #3a1a1a; color: #f19a9a; }
}