/* 灯明・神風。参道に光と空気を重ね、比較操作はプレビューだけで表示する。 */
.fx-lantern-glow {
  position: absolute;
  inset: 9% 6% 7%;
  background: radial-gradient(ellipse 44% 46% at 50% 50%, rgba(255, 218, 151, .28), rgba(219, 143, 57, .13) 43%, transparent 76%);
  mix-blend-mode: screen;
  pointer-events: none;
}
.fx-lantern-motes { position: absolute; inset: 0; }
.fx-lantern-motes i {
  position: absolute; width: 3px; height: 3px; border-radius: 50%;
  background: #ffdb94; box-shadow: 0 0 10px 2px rgba(255, 198, 104, .45);
}
.fx-wind-mist {
  position: absolute; width: 145%; left: -30%; height: 42%; top: 19%;
  background: radial-gradient(ellipse at 45% 50%, rgba(189, 197, 206, .32), rgba(119, 136, 160, .12) 44%, transparent 70%);
  filter: blur(22px); transform: rotate(-8deg); pointer-events: none;
}
.fx-wind-mist-1 { top: 40%; left: -48%; height: 36%; transform: rotate(5deg); }
.fx-wind-mist-2 { top: 61%; height: 27%; background: radial-gradient(ellipse, rgba(204, 209, 213, .32), transparent 65%); }
.fx-wind-papers { position: absolute; left: 13%; right: 13%; top: 15%; display: none; justify-content: space-between; }
.no-webgl .fx-wind-papers { display: flex; }
.fx-wind-papers::before { content: ""; position: absolute; left: -16%; right: -16%; top: -14px; height: 28px; border-top: 3px solid rgba(178,164,134,.7); border-radius: 50%; }
.fx-wind-papers svg { width: clamp(22px, 3.5vw, 48px); height: clamp(50px, 9vh, 96px); fill: #ece5d4; transform-origin: 50% 0; filter: drop-shadow(0 4px 12px rgba(0,0,0,.4)); }
.variant-lantern .reveal-fx, .variant-wind .reveal-fx { z-index: 2; }
.variant-lantern .oracle-topic { text-shadow: 0 0 50px rgba(255, 205, 128, .44), 0 6px 40px rgba(0,0,0,.7); }
.effect-preview-controls {
  position: fixed; z-index: 200; bottom: 44px; left: 50%; transform: translateX(-50%);
  display: flex; align-items: center; gap: 6px; width: max-content; max-width: calc(100% - 20px);
  padding: 9px 12px; background: rgba(14,13,18,.94); border: 1px solid var(--kin-line);
  box-shadow: 0 8px 40px rgba(0,0,0,.3); font-size: 12px; backdrop-filter: blur(12px);
}
.effect-preview-controls > span { margin-right: 6px; color: var(--washi-faint); }
.effect-preview-controls a, .effect-preview-controls button {
  font: inherit; color: var(--washi-dim); text-decoration: none; background: transparent;
  border: 1px solid transparent; padding: 8px 10px; cursor: pointer; white-space: nowrap;
}
.effect-preview-controls a[aria-current] { border-color: var(--kin); color: var(--kin-bright); background: rgba(217,177,92,.09); }
.effect-preview-controls a:hover, .effect-preview-controls button:hover { color: var(--washi); border-color: var(--kin-line); }
.effect-preview-controls :focus-visible { outline: 2px solid var(--kin); outline-offset: 2px; }
.experimental-preview .reveal-actions { padding-bottom: 120px; }
@media (max-width: 600px) {
  .effect-preview-controls { font-size: 11px; padding: 6px; gap: 2px; }
  .effect-preview-controls > span { display: none; }
  .effect-preview-controls a, .effect-preview-controls button { padding: 10px 9px; }
  .fx-lantern-glow { inset: 14% -30% 12%; }
  .fx-wind-papers { left: 12%; right: 12%; top: 19%; }
  .experimental-preview .reveal-actions { padding-bottom: 114px; }
}