@keyframes tickscroll { 0%{transform:translateX(0)} 100%{transform:translateX(-50%)} }

/* SHARE BUTTON — pulse glow */
@keyframes share-pulse {
  0%,100% { box-shadow: 0 0 0 0 var(--mode-color), 0 4px 20px rgba(0,0,0,.4); transform: scale(1); }
  50%      { box-shadow: 0 0 22px 6px var(--mode-color), 0 4px 20px rgba(0,0,0,.4); transform: scale(1.008); }
}

/* SHARE BUTTON — text fade-in on cycle */
@keyframes share-text-in {
  0%   { opacity:0; letter-spacing:4px; }
  100% { opacity:1; letter-spacing:1.5px; }
}
.share-btn-text-fade { animation: share-text-in .35s ease-out forwards; }

/* ANXIETY MODE flash */
@keyframes anxFlash {
  0%,100%{background:var(--bg)}
  50%{background:#1a0000}
}
body.anxiety-flash { animation: anxFlash 1s ease; }

/* SCROLL REVEAL */
.reveal { opacity:0;transform:translateY(20px);transition:opacity .5s,transform .5s; }
.reveal.in { opacity:1;transform:none; }

/* RAGE SHAKE */
@keyframes rageshake {
  0%,100%{transform:translateX(0) rotate(0)}
  10%{transform:translateX(-8px) rotate(-1deg)}
  20%{transform:translateX(8px) rotate(1deg)}
  30%{transform:translateX(-6px) rotate(-.5deg)}
  40%{transform:translateX(6px) rotate(.5deg)}
  50%{transform:translateX(-4px)}
  60%{transform:translateX(4px)}
  70%{transform:translateX(-2px)}
  80%{transform:translateX(2px)}
}
.raging { animation: rageshake .6s ease; }
@keyframes ragered {
  0%,100%{background:var(--bg)}
  30%{background:#1a0000}
  60%{background:#200505}
}
body.rage-flash { animation: ragered .6s ease; }

@keyframes popin { from{transform:scale(.8);opacity:0} to{transform:scale(1);opacity:1} }

/* CONFETTI (motivate mode only) */
.confetti-piece {
  position:fixed;
  width:8px;height:8px;
  border-radius:2px;
  pointer-events:none;
  z-index:999;
  animation: confettiFall 3s ease-in forwards;
}
@keyframes confettiFall {
  0%{transform:translateY(-10px) rotate(0deg);opacity:1}
  100%{transform:translateY(110vh) rotate(720deg);opacity:0}
}

/* FIRE / EMOJI RAIN */
.rain-emoji {
  position:fixed;
  font-size:1.8rem;
  pointer-events:none;
  z-index:1200;
  animation: rainFall linear forwards;
  user-select:none;
}
@keyframes rainFall {
  0%  { transform:translateY(-40px) rotate(0deg); opacity:1; }
  100%{ transform:translateY(110vh)  rotate(360deg); opacity:0; }
}

/* Wobble for modal icon */
@keyframes wobble {
  0%,100%{ transform:rotate(0deg) scale(1); }
  20%    { transform:rotate(-12deg) scale(1.15); }
  40%    { transform:rotate(10deg) scale(1.1); }
  60%    { transform:rotate(-8deg) scale(1.05); }
  80%    { transform:rotate(6deg) scale(1.02); }
}

/* KO-FI ESCALATION */
@keyframes kofi-pulse-y {
  0%,100%{ box-shadow:0 0 0 0 rgba(255,230,0,0); }
  50%    { box-shadow:0 0 7px 2px rgba(255,230,0,.3); }
}
@keyframes kofi-rumble {
  0%,100%{ transform:translateX(0) rotate(0); }
  20%    { transform:translateX(-1.5px) rotate(-.3deg); }
  40%    { transform:translateX(1.5px) rotate(.3deg); }
  60%    { transform:translateX(-1px); }
  80%    { transform:translateX(1px); }
}
@keyframes kofi-pulse-o {
  0%,100%{ box-shadow:0 0 0 0 rgba(255,119,0,0); }
  50%    { box-shadow:0 0 10px 3px rgba(255,119,0,.4); }
}
@keyframes kofi-rumble-hard {
  0%,100%{ transform:translateX(0) rotate(0); }
  15%    { transform:translateX(-2px) rotate(-.5deg); }
  30%    { transform:translateX(2px) rotate(.5deg); }
  45%    { transform:translateX(-2px) rotate(-.4deg); }
  60%    { transform:translateX(2px) rotate(.4deg); }
  80%    { transform:translateX(-1px) rotate(-.2deg); }
  90%    { transform:translateX(1px) rotate(.2deg); }
}
@keyframes kofi-pulse-r {
  0%,100%{ box-shadow:0 0 0 0 rgba(255,45,45,0); }
  50%    { box-shadow:0 0 14px 5px rgba(255,45,45,.5); }
}
/* LIGHT MODE — soften rage/crash flashes (dark ones are too extreme on light bg) */
body.light-mode.rage-flash    { animation: ragered-light .6s ease; }
body.light-mode.anxiety-flash { animation: anxFlash-light 1s ease; }

@keyframes ragered-light {
  0%,100%{ background:var(--bg) }
  30%    { background:rgba(196,16,16,.12) }
  60%    { background:rgba(196,16,16,.07) }
}
@keyframes anxFlash-light {
  0%,100%{ background:var(--bg) }
  50%    { background:rgba(196,16,16,.15) }
}

/* Cookie hint entrance */
@keyframes wsHintIn {
  from { opacity:0; transform:translateY(-10px); }
  to   { opacity:1; transform:translateY(0); }
}
/* Subtle border pulse — draws attention without screaming */
@keyframes wsHintPulse {
  0%,100% { border-color:var(--border); }
  50%     { border-color:rgba(255,230,0,.35); }
}

/* Share how-to box slide-in */
@keyframes shareHowtoIn {
  from { opacity:0; transform:translateY(-6px); }
  to   { opacity:1; transform:translateY(0); }
}

/* Share-now button success pulse */
@keyframes shareSuccessPulse {
  0%   { transform:scale(1); }
  30%  { transform:scale(1.03); }
  70%  { transform:scale(.98); }
  100% { transform:scale(1); }
}