@charset "UTF-8";
/* =========================================================
   FVアニメーション用（fv-anime.js とセット）
   ========================================================= */

/* 重なり順：背景 → 演出レイヤー → 文字・ボタン */
.fv__bg { position: absolute; inset: 0; z-index: 0; overflow: hidden; }
.fv__fx { position: absolute; inset: 0; z-index: 1; pointer-events: none; overflow: hidden; }
.fv__stage { z-index: 2; }

/* アニメ開始前は文字・ボタンを隠す（JSが無効・失敗時は fv-anime-init.js が解除） */
.fv-pending .fv__title,
.fv-pending .fv__lead,
.fv-pending .fv__cta,
.fv-pending .fv__bg img { opacity: 0; }

/* 読み上げ用の元テキスト（画面には表示しない） */
.fv-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* 1文字ずつ動かすための分割文字 */
.fv__lead .fv-char { display: inline-block; white-space: pre; will-change: transform, opacity; }


/* ---------- B：星屑（Stella＝星） ---------- */
.fv__star {
  position: absolute; border-radius: 50%; background: #fffbe0;
  box-shadow: 0 0 calc(6 * var(--u)) calc(1 * var(--u)) rgba(255, 246, 200, .8);
  will-change: transform, opacity;
}

/* ---------- C：マルチスクリーン ---------- */
.fv__tiles { position: absolute; inset: 0; display: grid; }
.fv__tile { background: #030710; outline: 1px solid rgba(0, 159, 185, .18); outline-offset: -1px; will-change: transform, opacity; }
.fv__scan {
  position: absolute; left: 0; right: 0; height: 2px; top: 0;
  background: linear-gradient(90deg, rgba(0,159,185,0), #3fd7ef 50%, rgba(0,159,185,0));
  box-shadow: 0 0 12px 2px rgba(63, 215, 239, .7); opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
  .fv__fx { display: none; }
}