/* 画面はひとつ、という約束。
   内容が入れ替わるときは、消えるものが薄れてから現れるものが濃くなる。
   別ページへ渡すときも同じ。

   入るときの薄れは、本文を透明にするのではなく、地色の幕を被せて
   それを溶かす形にした。幕は CSS だけで勝手に消える。以前は class を
   script が外すまで本文が透明で、script が走らなければ地色だけの画面が
   残った。誰かが外してくれないと見えない、という作りをやめる。 */

body::after{
  content:'';
  position:fixed; inset:0;
  z-index:2147483647;
  pointer-events:none;
  background:var(--veil, #061629);
  animation:bc-veil .34s ease both;
}
@keyframes bc-veil{ from{opacity:1} to{opacity:0} }
/* ホーム画面などから直接開いたときは幕なし（theme.js が cold を付ける） */
html.cold body::after{animation:none;opacity:0}

/* 出ていくときは本文ごと薄れる。こちらは移動で捨てられるが、
   移動が起きなかったときのために transition.js が畳む。 */
body{transition:opacity .3s ease}
html.leaving body{opacity:0}

@media (prefers-reduced-motion:reduce){
  body{transition:none}
  body::after{animation:none;opacity:0}
  html.leaving body{opacity:1}
}

/* standalone Safari の履歴スナップショットは fixed 背景を欠くことがある。
   OS の横払いは止め、transition.js は面を動かさずジェスチャーだけを読む。 */
html,body{overscroll-behavior-x:none}
/* 引っぱり過ぎたときの跳ね返りも止める。iPhone では跳ね返りのあいだ、留めてある背景や帯まで
   一緒に動き、下に地色だけの面や、帯の後ろを通っていた言葉がのぞいていた。
   横にずれる余地も残さない（clip はスクロールの箱を作らない）。 */
html{overscroll-behavior:none;overflow-x:clip}

/* 送りの跡は見せない。画面はひとつ、という約束の続きで、
   紙の横に定規が立っているように見えるものを外す。
   縦スクロール一本という作りなので、目印が無くても迷わない。 */
*{scrollbar-width:none}
*::-webkit-scrollbar{width:0;height:0;display:none}