html, body{
  /*height: 100%;*/
  /*min-height: 100%;*/
}

body {
  background:
    linear-gradient(rgba(255,255,255,0.25), rgba(255,255,255,0.25)),
    url("/novels/images/text_bg.webp");
  background-size: 100% 100%;
  background-position: center top;	/* 画面いっぱいに拡大縮小して表示、上部中央に揃える */
  background-attachment: fixed;		/* スクロールしても背景を固定 */
  background-repeat: no-repeat;
}

@media (min-width: 800px){
  .overlay{ max-width: 80%;}
}

/* 小説タイトル */
.novel-title{
  text-align: center;
  font-size: clamp(1.6rem, 3.2vw, 1.8rem);
  font-weight: 600;
  color: #065243;
  margin-bottom: 0.2em;

}

/* 作中日付と現代暦 */
.novel-date{
  text-align: center;
  font-size: clamp(0.8rem, 3.2vw, 1.0rem);
  font-weight: 400;
  margin-bottom: 0.2em;
}


/* 小説本文 */
.novel-text{
  margin: 3.5em auto;
  white-space: pre-wrap;
  word-break: break-word;
  line-height: 1.8;
  font-family: inherit;
  overflow-wrap: anywhere;

  line-break: strict;
  max-width: 50em;
}


/* 小説本文　前後リンク（3つ並び対応） */
.novel-pager{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1px;          /* 3つの間隔 */
  margin: 48px 0 32px;
  flex-wrap: wrap;    /* 画面が狭いときは折り返し */
}

.novel-pager a{
  display: inline-block;
  text-decoration: none;
  white-space: nowrap; /* 「目次に戻る」などを途中で折らない */
  padding:6px 12px;
  border-radius:8px;

}


.talk-list {
  display: flex;
  flex-direction: column;
  gap: 5px;
  padding-bottom: 40px; /* 余白 */
}

.talk-title{
  margin: 0;
  font-weight: 600;
  color: #065243;
  font-size: clamp(1.2rem, 3.2vw, 1.5rem);
}

.talk-line {
  display: flex;
  align-items: center;
  gap: 12px;
}

.talk-icon {
  width: 64px;
  height: 64px;
  object-fit: cover;
  border-radius: 50%;
  flex-shrink: 0;
}

.talk-text {
  margin: 0;
  line-height: 1.6;
}