/* The cue stays on its action; feedback never takes over input or layout. */
.interaction-effects{position:fixed;inset:0;z-index:400;pointer-events:none;overflow:hidden;contain:layout style;isolation:isolate}
.interaction-effects *{pointer-events:none}
.fx-burst{position:absolute;width:0;height:0;color:#e9c279}
.fx-burst--earned{color:#9aefc7}
.fx-spark{position:absolute;left:0;top:0;display:block;font:700 16px ui-monospace,monospace;text-shadow:0 2px 8px #06111b;opacity:0;animation:fx-dollar-scatter .8s cubic-bezier(.16,.65,.27,1) var(--spark-delay,0ms) forwards;will-change:transform,opacity}
.fx-spark--coin{width:18px;height:18px;display:grid;place-items:center;border:1px solid currentColor;border-radius:50%;font-size:11px;background:#1c2331d9;box-shadow:0 0 9px #f3ca7633}
.fx-amount{position:absolute;left:0;top:-8px;white-space:nowrap;transform:translateX(-50%);font:700 15px ui-monospace,monospace;text-shadow:0 2px 3px #081019,0 0 12px #081019;animation:fx-money-rise .95s cubic-bezier(.15,.6,.25,1) forwards}
.fx-static-receipt{position:absolute;transform:translate(-50%,-50%);max-width:calc(100vw - 24px);padding:5px 8px;border:2px solid #e8cd8d;border-radius:5px;background:#1d2b3c;color:#f1d8a5;font:600 12px ui-monospace,monospace;white-space:nowrap}
.fx-attention{--cue-color:#8ecbff;--cue-halo:#65acff30;position:relative;isolation:isolate}
.fx-attention[data-fx-attention="amber"]{--cue-color:#f0c67c;--cue-halo:#f2ba4d30}
.fx-attention[data-fx-attention="green"]{--cue-color:#9aebc4;--cue-halo:#6cdbac30}
.fx-attention:not(:disabled){border-color:var(--cue-color);box-shadow:0 0 0 1px var(--cue-halo),0 0 18px var(--cue-halo);animation:fx-action-glow 2.5s ease-in-out infinite}
.fx-attention:not(:disabled)::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(110deg,transparent 25%,#ffffff14 45%,#ffffff32 50%,#ffffff14 55%,transparent 75%);background-size:240% 100%;background-position:170% 0;animation:fx-action-shine 3.8s ease-in-out infinite;pointer-events:none;z-index:-1}
.fx-approve-ready:not(:disabled){background:#518fde;border-color:#9fcaff;box-shadow:0 4px 0 #254c7b,0 0 20px #79b5ff30;transform-origin:center;animation:fx-approve-invitation 3.8s ease-in-out infinite}
.fx-approve-ready:not(:disabled)::before{z-index:0}
.fx-approve-ready>span,.fx-approve-ready>strong{position:relative;z-index:1}
#approve-button.fx-approve-bounce{animation:fx-approve-celebrate .6s cubic-bezier(.2,.7,.3,1)!important;transform-origin:center}
.fx-purchase-pop{animation:fx-purchase-confirm .5s ease-out!important}
.fx-complete-pop{animation:fx-work-complete .55s ease-out!important}
.fx-confirmed{outline:2px solid #e8cd8d!important;outline-offset:2px}
#brain-metric{position:relative;--brain-feedback:#c4b3ef}
.human-strip.needs-break #brain-metric{--brain-feedback:#f0b77e}
#brain-metric.fx-brain-used b{transform-origin:left center;animation:fx-brain-pulse .9s ease-out}
#brain-metric.fx-brain-used .meter{animation:fx-brain-meter 1.4s ease-out}
#brain-metric>.fx-brain-delta{position:absolute;top:-3px;right:0;display:block;margin:0;padding:3px 6px;border:1px solid currentColor;border-radius:4px;background:#202539;color:var(--brain-feedback);font:600 11px/1.2 ui-monospace,monospace;letter-spacing:0;white-space:nowrap;pointer-events:none;animation:fx-brain-delta 1.4s ease-out both}
@keyframes fx-brain-pulse{0%{transform:scale(1)}22%{transform:scale(1.12);text-shadow:0 0 20px var(--brain-feedback)}50%{transform:scale(.98)}72%{transform:scale(1.04)}100%{transform:scale(1);text-shadow:none}}
@keyframes fx-brain-meter{0%,100%{box-shadow:0 0 0 0 transparent}25%{box-shadow:0 0 0 3px #bba4ed33,0 0 18px #bba4ed55}}
@keyframes fx-brain-delta{0%{opacity:0;transform:translateY(8px) scale(.9)}18%{opacity:1;transform:translateY(0) scale(1)}75%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(-6px)}}
@keyframes fx-dollar-scatter{0%{opacity:0;transform:translate(-50%,-50%) scale(.35)}12%{opacity:1}70%{opacity:.95}100%{opacity:0;transform:translate(calc(-50% + var(--spark-x)),calc(-50% + var(--spark-y))) rotate(var(--spark-turn)) scale(.65)}}
@keyframes fx-money-rise{0%{opacity:0;transform:translate(-50%,6px) scale(.85)}15%{opacity:1;transform:translate(-50%,-10px) scale(1.08)}70%{opacity:1}100%{opacity:0;transform:translate(-50%,-62px) scale(1)}}
@keyframes fx-action-glow{0%,100%{box-shadow:0 0 0 1px var(--cue-halo),0 0 10px var(--cue-halo)}50%{box-shadow:0 0 0 2px var(--cue-halo),0 0 24px var(--cue-halo)}}
@keyframes fx-action-shine{0%,60%{background-position:170% 0}90%,100%{background-position:-70% 0}}
@keyframes fx-approve-invitation{0%,70%,100%{transform:translateY(0) scale(1);box-shadow:0 4px 0 #254c7b,0 0 14px #79b5ff30}78%{transform:translateY(-2px) scale(1.035);box-shadow:0 6px 0 #254c7b,0 0 28px #79b5ff55}86%{transform:translateY(1px) scale(.99)}93%{transform:translateY(-1px) scale(1.01)}}
@keyframes fx-approve-celebrate{0%{transform:scale(.92,.87) translateY(3px)}26%{transform:scale(1.09,1.12) translateY(-4px)}48%{transform:scale(.98,.94) translateY(1px)}68%{transform:scale(1.035,1.04) translateY(-2px)}100%{transform:scale(1) translateY(0)}}
@keyframes fx-purchase-confirm{0%{transform:scale(.94)}45%{transform:scale(1.045);box-shadow:0 0 18px #e4b96280}100%{transform:scale(1)}}
@keyframes fx-work-complete{0%{box-shadow:0 0 0 0 #84d9afaa}50%{box-shadow:0 0 0 5px #84d9af22;border-color:#a8e8c4}100%{box-shadow:0 0 0 9px #84d9af00}}
@media(prefers-reduced-motion:reduce){
  #brain-metric.fx-brain-used b,#brain-metric.fx-brain-used .meter,#brain-metric>.fx-brain-delta{animation:none;transform:none}
  #brain-metric.fx-brain-used .meter{outline:2px solid var(--brain-feedback);outline-offset:2px}
  .interaction-effects .fx-burst{display:none}
  .fx-attention:not(:disabled),.fx-approve-ready:not(:disabled),#approve-button.fx-approve-bounce,.fx-purchase-pop,.fx-complete-pop{animation:none!important;transform:none!important}
  .fx-attention:not(:disabled)::before{animation:none;background:none}
  .fx-attention:not(:disabled){box-shadow:0 0 0 2px var(--cue-halo);border-color:var(--cue-color)}
}