/* ===== 演出 A/B/C/C+ ===== */
.fx-layer{position:absolute;inset:0;pointer-events:none;z-index:20;overflow:visible}
/* A：立ちのぼる光 */
.fxA-rise{position:absolute;left:-6%;right:-6%;bottom:0;height:140%;transform-origin:bottom;
  background:linear-gradient(to top, color-mix(in oklch,var(--aura) 85%, white) 0%, color-mix(in oklch,var(--aura) 55%, transparent) 30%, transparent 75%);
  filter:blur(14px);mix-blend-mode:screen;animation:fxA-rise 1.2s cubic-bezier(.2,.8,.3,1) forwards;border-radius:40%}
@keyframes fxA-rise{0%{opacity:0;transform:scaleY(.1)}25%{opacity:1}100%{opacity:0;transform:scaleY(1.05) translateY(-12%)}}
.fxA-edge{position:absolute;inset:-3px;border-radius:25px;box-shadow:0 0 0 2px var(--aura), 0 0 40px 6px var(--aura), inset 0 0 30px var(--aura);animation:fxA-edge 1.2s ease-out forwards}
@keyframes fxA-edge{0%{opacity:0}20%{opacity:1}100%{opacity:0}}
.fxA-p{position:absolute;bottom:0;width:var(--s);height:var(--s);border-radius:50%;background:#fff;box-shadow:0 0 8px 2px var(--aura),0 0 2px #fff;animation:fxA-p var(--d) cubic-bezier(.2,.7,.4,1) var(--dl) forwards;opacity:0}
@keyframes fxA-p{0%{opacity:0;transform:translate(0,0) scale(.4)}15%{opacity:1}100%{opacity:0;transform:translate(var(--x),var(--y)) scale(1)}}
/* B：光の輪 */
.fxB-ring{position:absolute;width:20px;height:20px;margin:-10px 0 0 -10px;border-radius:50%;border:3px solid #fff;box-shadow:0 0 20px 4px var(--aura), inset 0 0 14px var(--aura);animation:fxB-ring .5s cubic-bezier(.1,.7,.3,1) forwards}
.fxB-ring.r2{border-width:1.5px;animation-delay:.06s;opacity:0}
@keyframes fxB-ring{0%{transform:scale(.3);opacity:1}100%{transform:scale(16);opacity:0}}
.fxB-flash{position:absolute;inset:-2px;border-radius:24px;box-shadow:0 0 0 2px var(--aura),0 0 30px 4px var(--aura);animation:fxB-flash .5s ease-out forwards}
@keyframes fxB-flash{0%{opacity:.9}100%{opacity:0}}
/* C：覚醒 */
.fxC{position:absolute;inset:0;z-index:70;pointer-events:none;overflow:hidden}
.fxC-dim{position:absolute;inset:0;background:radial-gradient(circle at 50% 50%, transparent 0, rgba(5,10,8,.55) 70%);animation:fxC-dim var(--T) ease forwards}
@keyframes fxC-dim{0%{opacity:0}15%{opacity:1}40%{opacity:1}100%{opacity:0}}
.fxC-charge{position:absolute;left:50%;top:50%;width:60px;height:60px;margin:-30px;border-radius:50%;background:radial-gradient(circle,#fff 0,var(--aura) 40%,transparent 70%);animation:fxC-charge var(--T) cubic-bezier(.5,0,.2,1) forwards}
@keyframes fxC-charge{0%{transform:scale(.2);opacity:0}10%{opacity:1}34%{transform:scale(1.4)}38%{transform:scale(.6)}44%{transform:scale(30);opacity:1}70%{opacity:0;transform:scale(40)}100%{opacity:0}}
.fxC-in{position:absolute;left:50%;top:50%;width:160%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;
  background:repeating-conic-gradient(from 0deg, transparent 0 4deg, color-mix(in oklch,var(--aura) 60%, white) 4deg 4.6deg, transparent 4.6deg 9deg);
  -webkit-mask:radial-gradient(circle, transparent 18%, #000 50%);mask:radial-gradient(circle, transparent 18%, #000 50%);
  animation:fxC-in var(--T) linear forwards;opacity:0}
@keyframes fxC-in{0%{opacity:0;transform:translate(-50%,-50%) scale(1.4) rotate(0)}8%{opacity:.7}36%{opacity:.9;transform:translate(-50%,-50%) scale(.9) rotate(8deg)}40%{opacity:0}100%{opacity:0}}
.fxC-lines{position:absolute;left:50%;top:50%;width:220%;aspect-ratio:1;transform:translate(-50%,-50%);border-radius:50%;
  background:repeating-conic-gradient(from 3deg, transparent 0 2.2deg, rgba(255,255,255,.95) 2.2deg 2.7deg, transparent 2.7deg 5.5deg, var(--aura) 5.5deg 6.4deg, transparent 6.4deg 11deg);
  -webkit-mask:radial-gradient(circle, transparent 14%, #000 38%);mask:radial-gradient(circle, transparent 14%, #000 38%);
  animation:fxC-lines var(--T) cubic-bezier(.2,.8,.3,1) forwards;opacity:0}
@keyframes fxC-lines{0%,38%{opacity:0;transform:translate(-50%,-50%) scale(.5) rotate(0)}44%{opacity:1}75%{opacity:.6}100%{opacity:0;transform:translate(-50%,-50%) scale(1.2) rotate(-6deg)}}
.fxC-flood{position:absolute;left:50%;top:50%;width:40px;height:40px;margin:-20px;border-radius:50%;background:radial-gradient(circle, color-mix(in oklch,var(--aura) 40%, white) 0, var(--aura) 40%, color-mix(in oklch,var(--aura) 40%, transparent) 65%, transparent 72%);animation:fxC-flood var(--T) cubic-bezier(.2,.8,.2,1) forwards;opacity:0;mix-blend-mode:screen}
@keyframes fxC-flood{0%,40%{opacity:0;transform:scale(.5)}45%{opacity:1}100%{opacity:0;transform:scale(70)}}
.fxC-ring{position:absolute;left:50%;top:50%;width:80px;height:80px;margin:-40px;border-radius:50%;border:4px solid #fff;box-shadow:0 0 40px 10px var(--aura),inset 0 0 30px var(--aura);animation:fxC-ring var(--T) cubic-bezier(.1,.7,.2,1) forwards;opacity:0}
.fxC-ring.r2{animation-name:fxC-ring2}
@keyframes fxC-ring{0%,40%{opacity:0;transform:scale(.3)}42%{opacity:1}80%{opacity:0;transform:scale(14)}100%{opacity:0}}
@keyframes fxC-ring2{0%,46%{opacity:0;transform:scale(.3)}48%{opacity:.8}90%{opacity:0;transform:scale(20)}100%{opacity:0}}
.fxC-p{position:absolute;left:50%;top:50%;width:var(--s);height:var(--s);border-radius:50%;background:#fff;box-shadow:0 0 10px 3px var(--aura);opacity:0;animation:fxC-p var(--T) cubic-bezier(.1,.8,.3,1) forwards}
@keyframes fxC-p{0%,41%{opacity:0;transform:translate(0,0)}44%{opacity:1}100%{opacity:0;transform:translate(var(--x),var(--y))}}
.fxC-word{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);text-align:center;color:#fff;font-family:var(--en);font-weight:700;letter-spacing:.12em;
  text-shadow:0 0 30px var(--aura),0 0 4px var(--aura);animation:fxC-word var(--T) cubic-bezier(.2,1.4,.4,1) forwards;opacity:0}
.fxC-word small{display:block;font-family:var(--jp);font-weight:900;letter-spacing:.2em;font-size:.32em;margin-top:.6em}
@keyframes fxC-word{0%,42%{opacity:0;transform:translateY(-50%) scale(2.2)}50%{opacity:1;transform:translateY(-50%) scale(1)}82%{opacity:1}100%{opacity:0;transform:translateY(-50%) scale(1.03)}}
.fxC.plus .fxC-flood{background:radial-gradient(circle, #fff 0, var(--aura) 30%, var(--aura2) 55%, transparent 72%)}
.fxC.plus .fxC-lines{width:300%}
.fxC-shake{animation:fxC-shake .5s linear}
@keyframes fxC-shake{0%,100%{transform:none}20%{transform:translate(-4px,2px)}40%{transform:translate(4px,-3px)}60%{transform:translate(-3px,-2px)}80%{transform:translate(2px,3px)}}
/* reduced motion */
.fxR{position:absolute;inset:-3px;border-radius:25px;box-shadow:0 0 0 2px var(--aura),0 0 28px 2px var(--aura);animation:fxR .6s ease-out forwards;pointer-events:none;z-index:20}
@keyframes fxR{0%{opacity:0}30%{opacity:1}100%{opacity:0}}
.fxR-full{position:absolute;inset:0;z-index:70;pointer-events:none;background:radial-gradient(circle, color-mix(in oklch,var(--aura) 35%, transparent), transparent 70%);animation:fxR 1s ease-out forwards}

@keyframes growx{from{width:0}}
@keyframes pulseglow{0%,100%{box-shadow:0 0 0 2px #fff,0 0 14px oklch(0.7 0.19 35 / .5)}50%{box-shadow:0 0 0 2px #fff,0 0 28px oklch(0.7 0.19 35 / .95)}}
.step-thumb .thumb-x{opacity:0;transition:opacity .15s}
.step-thumb:hover .thumb-x{opacity:1}
/* slide transition (1種類) */
.slide-in-n{animation:slin-n .38s cubic-bezier(.2,.8,.2,1)}
.slide-in-p{animation:slin-p .38s cubic-bezier(.2,.8,.2,1)}
@keyframes slin-n{from{opacity:0;transform:translateX(5%) scale(.985)}}
@keyframes slin-p{from{opacity:0;transform:translateX(-5%) scale(.985)}}