/* luna-fk09.css — FK09「終わった恋の余韻便り」 視覚レイヤー（診断score＋手紙・オプトイン表示層）
 * 夕暮れの机＋色あせた封筒(閉→半→開)＋便箋展開。届くのは相手からの手紙ではなく
 * 「いまのあなた→いまのあなた」の便り。受信/配達/飛来の演出は使わない（机の上の手紙を自分で開く）。
 * 安全ゲート結果(data-fx-safe=1)は高揚演出を抑制。鎮火型(data-fx-type=chinka)はトーンを落とす。
 * 全selectorを .luna-fx-stage--fk09 / .luna-fx--fk09 配下に限定（他How/他FKへ漏らさない）。 */

.luna-fx-stage--fk09 {
  position: fixed; inset: 0; z-index: 1; overflow: hidden;
  container-type: size; pointer-events: none; isolation: isolate; background: #0b0708;
}
.luna-fx-stage--fk09 .layer { position: absolute; pointer-events: none; background-repeat: no-repeat; background-position: center; background-size: cover; }

/* ── 背景・空気 ── */
.luna-fx-stage--fk09 .l-bg-room { inset: 0; z-index: 0; }
.luna-fx-stage--fk09 .l-ember {
  inset: 0; z-index: 1; background-size: cover; mix-blend-mode: screen;
  opacity: .18; transition: opacity 1.1s ease, filter 1.1s ease;
}
/* 炎のあかり（ろうそく周り・通常結果で暖まる／安全では灯さない） */
.luna-fx-stage--fk09 .l-glow-flame {
  left: 72%; top: 62%; width: min(52cqw, 340px); height: min(52cqw, 340px);
  transform: translate(-50%, -50%); background-size: contain; mix-blend-mode: screen;
  z-index: 6; opacity: .28; transition: opacity 1s ease;
}

/* ── 前景の机・ろうそく ── */
.luna-fx-stage--fk09 .l-desk {
  left: 50%; bottom: -2%; width: 118cqw; height: min(52cqh, 460px);
  transform: translateX(-50%); background-position: center bottom; background-size: cover; z-index: 4;
}
.luna-fx-stage--fk09 .l-candle {
  left: 72%; top: 60%; width: min(16cqw, 110px); height: min(34cqw, 220px);
  transform: translate(-50%, -50%); background-size: contain; z-index: 7; opacity: .96;
}

/* ── 質問中の“書く紙” ── */
.luna-fx-stage--fk09 .l-paper-question {
  left: 50%; top: 52%; width: min(66cqw, 460px); height: min(80cqw, 560px);
  transform: translate(-50%, -50%) rotate(-1.5deg); background-size: contain;
  z-index: 8; opacity: 0; transition: opacity .7s ease;
}

/* ── 封筒（閉→半→開）: 同位置で重ねクロスフェード ── */
.luna-fx-stage--fk09 .l-env-closed,
.luna-fx-stage--fk09 .l-env-half,
.luna-fx-stage--fk09 .l-env-open {
  left: 50%; top: 56%; width: min(60cqw, 440px); height: min(60cqw, 440px);
  transform: translate(-50%, -50%) scale(1); background-size: contain;
  transition: top .9s cubic-bezier(.22,.61,.36,1), transform .9s cubic-bezier(.22,.61,.36,1), opacity .7s ease;
  z-index: 10;
}
.luna-fx-stage--fk09 .l-env-closed { opacity: 1; }
.luna-fx-stage--fk09 .l-env-half   { opacity: 0; }
.luna-fx-stage--fk09 .l-env-open   { opacity: 0; }

/* リボン・消印は封筒に添える（閉のとき見え、開くと外れる） */
.luna-fx-stage--fk09 .l-ribbon {
  left: 50%; top: 56%; width: min(60cqw, 440px); height: min(60cqw, 440px);
  transform: translate(-50%, -50%); background-size: contain; z-index: 12;
  transition: top .9s cubic-bezier(.22,.61,.36,1), transform .9s cubic-bezier(.22,.61,.36,1), opacity .7s ease; opacity: 1;
}
.luna-fx-stage--fk09 .l-postmark {
  left: 62%; top: 50%; width: min(20cqw, 132px); height: min(20cqw, 132px);
  transform: translate(-50%, -50%) rotate(-8deg); background-size: contain; z-index: 13;
  opacity: .32; transition: opacity .8s ease, top .9s ease, left .9s ease;
}

/* ── 便箋（畳→開）: 結果で開く ── */
.luna-fx-stage--fk09 .l-paper-folded {
  left: 50%; top: 54%; width: min(40cqw, 280px); height: min(52cqw, 360px);
  transform: translate(-50%, -50%); background-size: contain; z-index: 11; opacity: 0;
  transition: opacity .6s ease, top .8s ease, transform .8s ease;
}
.luna-fx-stage--fk09 .l-paper-open {
  left: 50%; top: 50%; width: min(58cqw, 400px); height: min(74cqw, 520px);
  transform: translate(-50%, -50%) rotate(-1deg); background-size: contain; z-index: 11; opacity: 0;
  transition: opacity .8s ease;
}

/* ===== KF 状態 ===== */
/* intro: 封筒は机の上に置かれたまま。 */
.luna-fx-stage--fk09[data-fx-state="intro"] .l-env-closed,
.luna-fx-stage--fk09[data-fx-state="intro"] .l-ribbon { top: 56%; transform: translate(-50%,-50%) scale(1); }

/* quiz: 質問と選択肢だけを主役にし、中央の手紙装飾はすべて退かせる。 */
.luna-fx-stage--fk09[data-fx-state="quiz"] .l-env-closed,
.luna-fx-stage--fk09[data-fx-state="quiz"] .l-ribbon,
.luna-fx-stage--fk09[data-fx-state="quiz"] .l-postmark,
.luna-fx-stage--fk09[data-fx-state="quiz"] .l-paper-question,
.luna-fx-stage--fk09[data-fx-state="quiz"] .l-paper-folded { opacity: 0; }

/* gathering: 封筒が半開き、余韻の靄が濃くなる。畳んだ便箋が覗く。 */
.luna-fx-stage--fk09[data-fx-state="gathering"] .l-env-closed { opacity: 0; }
.luna-fx-stage--fk09[data-fx-state="gathering"] .l-env-half { opacity: 1; top: 44%; transform: translate(-50%,-50%) scale(.9); }
.luna-fx-stage--fk09[data-fx-state="gathering"] .l-ribbon { top: 44%; transform: translate(-50%,-50%) scale(.9); opacity: .4; }
.luna-fx-stage--fk09[data-fx-state="gathering"] .l-paper-question { opacity: 0; }
.luna-fx-stage--fk09[data-fx-state="gathering"] .l-paper-folded { opacity: .9; top: 46%; }
.luna-fx-stage--fk09[data-fx-state="gathering"] .l-ember { opacity: .34; }
.luna-fx-stage--fk09[data-fx-state="gathering"] .l-glow-flame { opacity: .42; }

/* result: 画像の手紙装飾は退かせ、本文のテキストパネルだけを見せる。 */
.luna-fx-stage--fk09[data-fx-state="result"] .l-env-closed,
.luna-fx-stage--fk09[data-fx-state="result"] .l-env-half,
.luna-fx-stage--fk09[data-fx-state="result"] .l-env-open,
.luna-fx-stage--fk09[data-fx-state="result"] .l-ribbon,
.luna-fx-stage--fk09[data-fx-state="result"] .l-postmark,
.luna-fx-stage--fk09[data-fx-state="result"] .l-paper-question,
.luna-fx-stage--fk09[data-fx-state="result"] .l-paper-folded,
.luna-fx-stage--fk09[data-fx-state="result"] .l-paper-open { opacity: 0; visibility: hidden; animation: none; }
.luna-fx-stage--fk09[data-fx-state="result"] .l-ember { opacity: .3; }
/* 通常結果は炎のあかりを暖める（安全・鎮火では抑える＝別ルールで上書き） */
.luna-fx-stage--fk09[data-fx-state="result"][data-fx-safe="0"] .l-glow-flame { opacity: .5; animation: fk09-flame-flicker 5.5s ease-in-out infinite; }

/* 残り火＝火がまだ残る配置：あかりをやや強め、靄を暖色へ。 */
.luna-fx-stage--fk09[data-fx-state="result"][data-fx-type="nokoribi"] .l-glow-flame { opacity: .6; }
.luna-fx-stage--fk09[data-fx-state="result"][data-fx-type="nokoribi"] .l-ember { opacity: .38; }

/* 鎮火＝火が静まる配置：あかり・靄を落とし、静かな区切りのトーンへ（祝福感を出さない）。 */
.luna-fx-stage--fk09[data-fx-type="chinka"] .l-glow-flame { opacity: .16 !important; animation: none !important; }
.luna-fx-stage--fk09[data-fx-type="chinka"] .l-ember { opacity: .12 !important; filter: saturate(.7) brightness(.9); }
.luna-fx-stage--fk09[data-fx-type="chinka"] .l-candle { opacity: .8; }

/* ===== 安全ゲート結果: 高揚演出を鎮め、保護のトーンへ（炎・光・暖色を出さない） ===== */
.luna-fx-stage--fk09[data-fx-safe="1"] .l-bg-room { filter: saturate(.55) brightness(.82) hue-rotate(-10deg); }
.luna-fx-stage--fk09[data-fx-safe="1"] .l-glow-flame { opacity: 0 !important; animation: none !important; }
.luna-fx-stage--fk09[data-fx-safe="1"] .l-ember { opacity: .1 !important; filter: saturate(.5) brightness(.85); }
.luna-fx-stage--fk09[data-fx-safe="1"] .l-candle { opacity: .7; }
.luna-fx-stage--fk09[data-fx-safe="1"] .l-paper-open { animation: none; }

/* ===== 既存モーダル/手紙UIを机の場に載せる（fk09のみ・可読性優先） ===== */
.luna-fx--fk09 .luna-diagnosis__veil { background: none; }
.luna-fx--fk09 .luna-modal, .luna-fx--fk09 .luna-imm .luna-modal { background: rgba(14,8,7,.5); backdrop-filter: blur(12px); }
.luna-fx--fk09 .luna-gather { background: transparent; }
.luna-fx--fk09 .luna-result {
  background: linear-gradient(180deg, rgba(28,18,14,.95), rgba(18,12,10,.98));
  border: 1px solid rgba(206,168,120,.38); border-radius: 20px;
  padding: clamp(20px,4vh,40px) clamp(18px,5vw,44px); backdrop-filter: blur(6px);
  box-shadow: 0 22px 64px rgba(0,0,0,.5);
}
/* 便り本文は画像ではなく、不透明な古紙トーンのテキストパネルとして見せる。 */
.luna-fx--fk09 .luna-letter {
  border-color: rgba(111,75,45,.5);
  background: linear-gradient(145deg, #f2e4c5, #d8bc8e);
  border-radius: 14px; padding: clamp(24px,4vh,42px) clamp(20px,5vw,46px);
  box-shadow: 0 20px 52px rgba(0,0,0,.42);
}
/* 安全結果の本文パネルは保護トーン（暖色の高揚を抑える）。 */
.luna-fx--fk09 .luna-result.is-safe { border-color: rgba(143,182,168,.42); background: linear-gradient(180deg, rgba(18,30,30,.96), rgba(12,22,22,.98)); }
.luna-fx--fk09 .luna-result.is-safe .luna-letter { background: linear-gradient(145deg, #e7e3d1, #c8c9b4); }

/* ===== keyframes（fk09接頭辞・衝突回避） ===== */
@keyframes fk09-letter-open { from { opacity: 0; transform: translate(-50%,-46%) rotate(-1deg) scale(.94); } to { opacity: 1; transform: translate(-50%,-50%) rotate(-1deg) scale(1); } }
@keyframes fk09-letter-open-calm { from { opacity: 0; } to { opacity: 1; } }
@keyframes fk09-flame-flicker { 0%,100% { opacity: .42; } 45% { opacity: .58; } 70% { opacity: .48; } }

/* ===== reduced-motion ===== */
@media (prefers-reduced-motion: reduce) {
  .luna-fx-stage--fk09 .l-env-closed,
  .luna-fx-stage--fk09 .l-env-half,
  .luna-fx-stage--fk09 .l-env-open,
  .luna-fx-stage--fk09 .l-ribbon,
  .luna-fx-stage--fk09 .l-postmark,
  .luna-fx-stage--fk09 .l-paper-question,
  .luna-fx-stage--fk09 .l-paper-folded { transition: none !important; }
  .luna-fx-stage--fk09 .l-paper-open,
  .luna-fx-stage--fk09 .l-glow-flame { animation: none !important; transition: none !important; }
}

/* 設問モーダル中は背景ステージをぼかして手前のパネルを強調（2026-07-19 人間指示）。result では解除 */
.luna-fx-stage--fk09 { transition: filter .5s ease; }
.luna-fx-stage--fk09[data-fx-quizmode="1"] { filter: blur(18px) brightness(.58); }