/* r6（2026-10-09）：ダブルレインボーの渦巻き（app.mjs の dockCombo() の d.fusion）で新しく使う部品。
   位置・大きさ・動き（transform / opacity）は app.mjs が決める。どれも #fx の中で pointer-events: none（タップを妨げない）。
   常時動くアニメーションは無し（ダブルレインボーの間だけ）。 */
/* 中心で凝縮する光（白い芯 → 金 → 桃 → 薄紫） */
.dr-core { position: absolute; left: 0; top: 0; z-index: 13; border-radius: 50%; pointer-events: none; opacity: 0; will-change: transform, opacity;
  background: radial-gradient(circle, #ffffff 0 9%, #fff6d8f0 18%, #ffd9ecb3 32%, #d8c4ff66 48%, #b9e6ff26 60%, transparent 70%); }
/* 吸い込まれるキラキラ（4つの光の星） */
.dr-mote { position: absolute; left: 0; top: 0; z-index: 14; pointer-events: none; opacity: 0; will-change: transform, opacity;
  clip-path: polygon(50% 0, 60% 40%, 100% 50%, 60% 60%, 50% 100%, 40% 60%, 0 50%, 40% 40%); }
/* 弾けたときに外へ散るプリズムのかけら（細いひし形） */
.dr-shard { position: absolute; left: 0; top: 0; z-index: 14; pointer-events: none; opacity: 0; will-change: transform, opacity;
  clip-path: polygon(50% 0, 72% 50%, 50% 100%, 28% 50%); }
/* 渦の層：重ねる順（奥 → 手前） */
.dr-arcs.dr-deep { z-index: 10; }
.dr-arcs.dr-inner { z-index: 11; }
.dr-arcs.dr-trail { z-index: 11; }
.dr-arcs.dr-main { z-index: 12; }
@media (prefers-reduced-motion: reduce) {
  .dr-core, .dr-mote, .dr-shard { display: none; }
}