/* v11 FV：納棺の儀の絵巻（写真から起こした色面のイラストが、手順に沿って移る） */
.fv--emaki { background: #ffffff; height: clamp(500px, 56vw, 680px); color: var(--ink); } /* 2026-11-13 生成り #f6f3ee → 白（星野さん指示） */
.fv--emaki .fv__shade { display: none; }
.fv--emaki::after { border-color: rgba(168,139,92,.5); }
.emaki { position: absolute; inset: 0; }
.emaki__art { position: absolute; right: 2%; top: 5%; bottom: 4%; width: 58%; }
.emaki__sc {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: contain; object-position: 100% 60%;
  opacity: 0; transform: scale(1.025); filter: blur(6px);
  transition: opacity 1.6s ease, transform 7s ease-out, filter 1.6s ease;
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 16%);
          mask-image: linear-gradient(to right, transparent 0, #000 16%);
}
.emaki__sc.is-on { opacity: 1; transform: none; filter: none; }

.emaki__info { position: absolute; left: clamp(24px, 4.5vw, 72px); top: clamp(28px, 4vw, 56px); z-index: 3; }
.emaki__lb { font-family: var(--mincho); font-size: 12px; letter-spacing: .4em; color: #8a6f45; margin: 0 0 14px; }
.emaki__caps { position: relative; height: 2.4em; min-width: 14em; }
.emaki__cap { position: absolute; left: 0; top: 0; margin: 0; display: flex; align-items: baseline; gap: 14px; white-space: nowrap; opacity: 0; transform: translateY(6px); transition: opacity .9s ease, transform .9s ease; font-family: var(--mincho); color: var(--ink); }
.emaki__cap.is-on { opacity: 1; transform: none; }
.emaki__no { font-family: 'Yuji Syuku', var(--mincho); color: #a88b5c; font-size: clamp(22px, 2.2vw, 30px); line-height: 1; }
.emaki__t { font-size: clamp(16px, 1.5vw, 20px); letter-spacing: .2em; }
.emaki__dots { display: flex; gap: 6px; margin-top: 10px; }
.emaki__dot { width: 34px; height: 24px; padding: 0; border: 0; background: none; cursor: pointer; display: flex; align-items: center; }
.emaki__dot i { display: block; width: 100%; height: 1px; background: rgba(30,27,34,.18); position: relative; overflow: hidden; }
.emaki__dot i::after { content: ""; position: absolute; inset: 0; background: #a88b5c; transform: scaleX(0); transform-origin: left; }
.emaki__dot.is-done i::after { transform: scaleX(1); }
.emaki__dot.is-on i::after { animation: emakiBar var(--emaki-ms, 6500ms) linear var(--emaki-delay, 0s) forwards; }
.emaki.is-paused .emaki__dot.is-on i::after { animation-play-state: paused; }
@keyframes emakiBar { to { transform: scaleX(1); } }
.emaki__dot:focus-visible { outline: 1px solid #a88b5c; outline-offset: 2px; }

/* 明るい地に合わせて文字を墨色に */
.fv--emaki .fv__body { color: var(--ink); z-index: 3; }
.fv--emaki .fv__brand, .fv--emaki .fv__mark, .fv--emaki .fv__copy, .fv--emaki .fv__sub { color: var(--ink); text-shadow: none; }
.fv--emaki .fv__mark > span:last-child { color: #8a6f45; }
.fv--emaki .fv__copy { text-shadow: 0 0 18px rgba(255,255,255,.9), 0 0 2px rgba(255,255,255,.9); }
/* 線香の煙：明るい地では反転して淡い灰の煙にする */
.fv--emaki .fv__smoke { mix-blend-mode: multiply; filter: invert(1) blur(2px); opacity: .16; z-index: 2; }

@media (max-width: 760px) {
  .fv--emaki { height: 680px; }
  .emaki__art { left: 4%; right: 4%; width: auto; top: 100px; bottom: auto; height: 290px; }
  .emaki__sc { object-position: 50% 50%; -webkit-mask-image: none; mask-image: none; }
  .emaki__info { top: 24px; left: 24px; }
  .emaki__caps { min-width: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .emaki__sc, .emaki__cap { transition: none; transform: none; filter: none; }
  .emaki__dot.is-on i::after { animation: none; transform: scaleX(1); }
}

/* v12 動画版：5場面と線香の煙を1本の動画に。四辺をぼかして生成りの地へ溶かす */
.emaki__vid {
  opacity: 1; transform: none; filter: none; transition: none; background: transparent;
  -webkit-mask-image: linear-gradient(to right, transparent 0, #000 14%, #000 96%, transparent 100%),
                      linear-gradient(to bottom, transparent 0, #000 7%, #000 93%, transparent 100%);
  -webkit-mask-composite: source-in;
          mask-image: linear-gradient(to right, transparent 0, #000 14%, #000 96%, transparent 100%),
                      linear-gradient(to bottom, transparent 0, #000 7%, #000 93%, transparent 100%);
          mask-composite: intersect;
}
@media (max-width: 760px) {
  .emaki__vid {
    -webkit-mask-image: linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%),
                        linear-gradient(to bottom, transparent 0, #000 6%, #000 94%, transparent 100%);
            mask-image: linear-gradient(to right, transparent 0, #000 6%, #000 94%, transparent 100%),
                        linear-gradient(to bottom, transparent 0, #000 6%, #000 94%, transparent 100%);
  }
}

/* v12.2 電話のカード（.call）は FV に重ねず、FV の下に離して置く（2026-11-13。重ねると生成りの地がカードの脇からのぞくため） */
.fv--emaki + .call { margin-top: clamp(24px, 3vw, 40px); }
@media (max-width: 900px) {
  .fv--emaki + .call { margin-top: 20px; }
}