.effect-panel { display:grid; gap:.6rem; margin:0; padding:.75rem; border:1px solid #a8b4e44a; border-radius:.85rem; background:#171f37; }
.effect-panel legend { padding:0 .4rem; color:#dfd7ff; }
.effect-panel [data-effect-parameters] { display:grid; gap:.55rem; }
.effect-panel input[type=checkbox] { width:auto; accent-color:#a980e3; }
.effect-row { display:flex; align-items:center; flex-wrap:wrap; justify-content:space-between; gap:.45rem; }
.effect-row .wbs-diff-copy { width:auto; min-height:2rem; margin:0; padding:.4rem .55rem; }
.effect-row code { overflow-wrap:anywhere; }
[data-effect-set],.effect-output { display:grid; gap:.45rem; }
[data-effect-set] .effect-row { padding:.4rem 0; border-bottom:1px solid #a8b4e438; }
[data-effect-warning] { margin:0; color:#ffc5ab; }
[data-effect-warning]:empty { display:none; }
.effect-scene { position:relative; min-height:11rem; display:grid; place-items:center; overflow:hidden; border:1px solid #a8b4e460; border-radius:.75rem; background:linear-gradient(#14193850,#0c142bcc),url('effect-hero.webp') 75% center/cover; }
.effect-scene span { z-index:1; padding:.45rem .7rem; border-radius:.5rem; background:#131931d9; }
[data-effect-particles] { position:absolute; inset:0; pointer-events:none; --tone:#8df7c8; }
[data-effect-particles][data-tone=harm] { --tone:#fc86b3; }
[data-effect-particles] i { position:absolute; left:calc(15% + var(--n)*10%); bottom:20%; width:.45rem; height:.45rem; background:var(--tone); box-shadow:0 0 .8rem var(--tone); animation:effect-rise 1.8s ease-out infinite; animation-delay:calc(var(--n)*-.19s); }
@keyframes effect-rise { to { transform:translateY(-5.5rem) rotate(55deg); opacity:0; } }
@media(prefers-reduced-motion:reduce) { [data-effect-particles] i { animation:none; } }