/* ============================================================
   Auguri! ─ 右レール：スクロールの度合い（本番・2026-09-16 高野様ご確定）
   ------------------------------------------------------------
   デモ 19 番の **1 数字** を採用。文字は「もう少し大きく」のご指示で 20px。

   置き場所は地図マークの下。ai の版面 1280 の中で、ピンの下端 1013 から
   **87px あけた** 1100。レールのまとまり（タグライン → Location → ピン）の
   一員なので、画面に貼り付いたまま動かず、濃い帯の上では白く反転する
   （白い写しは rail.js が作る）。

   ai には無い「足した部品」。ai の要素には 1px も触れていないので、
   突き合わせ（.compare）では出さない。
   JavaScript が動かない環境では出ない（数字が 0 のまま残らないように）。
   ============================================================ */
.railwrap .sp {
  position: absolute;
  left: calc(1860 * var(--s));
  top: calc(1100 * var(--s));
  width: 0; height: 0;
  font-family: var(--ff-en-label), serif;
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.06em;
  visibility: hidden;                 /* JS が動いたら出す */
}
.railwrap .sp.is-on { visibility: visible; }
.railwrap .rail--stack:not(.rail--inv) .sp { color: var(--c-ink); }
.railwrap .rail--inv .sp { color: var(--c-ink-w); }

.railwrap .sp__num {
  position: absolute; left: 0; top: 0; transform: translateX(-50%);
  margin: 0; line-height: 1; white-space: nowrap;
  font-size: calc(20 * var(--s));
}
.railwrap .sp__pct { font-size: 0.72em; margin-left: 0.15em; opacity: .7; }

/* ai 突き合わせ（.compare）では出さない */
.compare .railwrap .sp { display: none !important; }