/* ============ viewer-v5 inline edit mode (last-mile WYSIWYG) ============
 * 編集モードの UI affordance のみ。スライド本体の見た目 (METAL 等) は不変。
 * 親 viewer (fullscreen toolbar) 側の style。iframe 内の affordance は
 * edit-mode.js が <style id="em-iframe-style"> を注入する (保存時に strip)。
 * ====================================================================== */

/* --- toolbar buttons (fullscreen controls) --- */
.fs-btn.em-toggle.active {
  background: #2f7d4f;
  color: #fff;
  border-color: #2f7d4f;
}
.fs-btn.em-save {
  display: none; /* 編集モード中のみ表示 (JS が .em-on で出す) */
}
#fs-view.em-on .fs-btn.em-save {
  display: inline-flex;
}
#fs-view.em-on .fs-btn.em-save.dirty {
  background: #c9803a;
  color: #fff;
  border-color: #c9803a;
  animation: em-pulse 1.6s ease-in-out infinite;
}
@keyframes em-pulse { 0%,100% { opacity: 1; } 50% { opacity: .65; } }

/* edit mode 中は iframe を編集可能に見せる枠 */
#fs-view.em-on .fs-stage {
  outline: 2px dashed rgba(47, 125, 79, .55);
  outline-offset: 2px;
}

/* 編集モードのヒントバー (stage 下部) */
.em-hint {
  position: absolute;
  left: 50%;
  bottom: 10px;
  transform: translateX(-50%);
  z-index: 40;
  display: none;
  gap: 14px;
  align-items: center;
  padding: 7px 16px;
  background: rgba(20, 24, 30, .9);
  color: #e8eef2;
  font-size: 12px;
  border-radius: 999px;
  font-family: 'Inter', system-ui, sans-serif;
  pointer-events: none;
  white-space: nowrap;
}
#fs-view.em-on .em-hint { display: inline-flex; }
.em-hint b { color: #8fd4a8; font-weight: 600; }