/* 小説ページの文字サイズ切替（小・中・大）
   - 「中」＝これまでの表示サイズ
   - 各ページの本文サイズは --novel-fs-base で決まる（既定 1.04rem）
     ページ側で違うサイズを使っている場合は、そのページの article に
     --novel-fs-base を上書き指定すること */
:root{
  --novel-fs-base:1.04rem;
  --novel-fs-scale:1;
}
html[data-novel-fs="s"]{ --novel-fs-scale:.88; }
html[data-novel-fs="m"]{ --novel-fs-scale:1; }
html[data-novel-fs="l"]{ --novel-fs-scale:1.2; }

article p{ font-size:calc(var(--novel-fs-base) * var(--novel-fs-scale)); }

/* ── 切替ボタン ──
   上部バーの中（「常温保存」の右）に置く。バーは position:sticky なので
   ページのどこまで読んでも常に見える。 */
.novel-fs-ctrl{
  display:flex; align-items:center; gap:4px;
  padding:4px 6px;
  border:1px solid #4a4335;
  border-radius:999px;
  background:#16150f;
  font-family:inherit;
  flex:0 0 auto;
}

.novel-fs-ctrl .novel-fs-label{
  font-size:.66rem; letter-spacing:.12em; padding:0 .35em 0 .5em;
  color:var(--text-soft, #9a958d); white-space:nowrap;
}

.novel-fs-ctrl button{
  appearance:none; -webkit-appearance:none;
  min-width:36px; height:32px; padding:0 8px;
  background:transparent;
  border:1px solid #574f3e; border-radius:999px;
  color:#efe9dc;
  font-family:inherit; line-height:1; font-weight:500;
  cursor:pointer;
  transition:color .15s ease, border-color .15s ease, background-color .15s ease;
}
/* ボタン自体の大きさで「小・中・大」が伝わるようにする */
.novel-fs-ctrl button[data-fs="s"]{ font-size:.78rem; }
.novel-fs-ctrl button[data-fs="m"]{ font-size:.94rem; }
.novel-fs-ctrl button[data-fs="l"]{ font-size:1.1rem; }

.novel-fs-ctrl button:hover{ border-color:var(--accent, #cda86b); }

/* 選択中は金色で塗りつぶす（枠線の色違いだと暗い画面で見分けにくいため） */
.novel-fs-ctrl button[aria-pressed="true"]{
  background:var(--accent, #cda86b);
  border-color:var(--accent, #cda86b);
  color:#14120c;
  font-weight:700;
}
.novel-fs-ctrl button:focus-visible{
  outline:2px solid var(--accent, #cda86b); outline-offset:2px;
}

@media (max-width:560px){
  /* 狭い画面では「← 一覧へもどる」と場所を取り合うのでラベルを省略 */
  .novel-fs-ctrl .novel-fs-label{ display:none; }
  .novel-fs-ctrl{ gap:3px; padding:3px 4px; }
  .novel-fs-ctrl button{ min-width:34px; padding:0 6px; }
  /* サイト名は狭い画面では切替ボタンに場所を譲る
     （:has 非対応ブラウザではサイト名が残るだけで、崩れはしない） */
  .topbar .wrap:has(.novel-fs-ctrl) .sn{ display:none; }
}

/* 上部バーが無いページ向けの保険（右下に浮かせる） */
.novel-fs-ctrl.is-floating{
  position:fixed; right:12px; bottom:12px; z-index:50;
  background:rgba(8,8,8,.94);
  box-shadow:0 3px 16px rgba(0,0,0,.65);
  backdrop-filter:blur(8px);
}