/* ═══ Post action bar: icons with live counts, one smart action, Save on the right ═══ */
.fpost .fpost-actions.fpa {
  display: flex; align-items: center; gap: 2px;
  margin: 6px 0 0; padding: 2px 10px 4px;
  border-top: 1px solid var(--border, rgba(255,255,255,.08));
}
.fpa .fpost-react-wrap { position: relative; flex: 0 0 auto; width: auto; }
.fpost .fpa .fpost-btn,
.fpost .fpa .fpost-react-wrap > .fpost-btn {
  flex: 0 0 auto; width: auto; min-width: 44px; height: 44px;
  padding: 0 10px; gap: 6px; border-radius: 22px;
  font-size: .9rem; font-weight: 650; color: var(--muted, #9a9a9a);
  font-variant-numeric: tabular-nums;
  -webkit-tap-highlight-color: transparent; touch-action: manipulation;
  user-select: none; -webkit-user-select: none; -webkit-touch-callout: none;
  transition: background 140ms, color 140ms, transform 120ms;
}
.fpost .fpa .fpost-btn:hover { background: rgba(255,255,255,.06); color: var(--text, #fff); }
.fpost .fpa .fpost-btn:active { transform: scale(.92); }
.fpost .fpa .fpost-btn-label { display: none; }
.fpost .fpa .fpost-btn svg { flex: 0 0 auto; }
.fpost .fpa .fpost-like.liked { color: #f43f5e; }
.fpost .fpa .fpost-like.liked svg { fill: currentColor; }
.fpost .fpa .fpost-save.saved { color: #f59e0b; }
.fpost .fpa .fpost-save.saved svg { fill: currentColor; }
.fpa .fpost-react-emoji { font-size: 1.2rem; }
.fpa-spacer { flex: 1 1 auto; }

/* pop when you react, tick when a count changes */
.fpa-pop .fpost-react-emoji, .fpa-pop svg { animation: fpaPop 420ms cubic-bezier(.3,1.7,.5,1); }
@keyframes fpaPop { 0% { transform: scale(.55); } 55% { transform: scale(1.35); } 100% { transform: scale(1); } }
.fpost-btn-count.fpa-tick { display: inline-block; animation: fpaTick 300ms ease-out; }
@keyframes fpaTick { from { transform: translateY(-7px); opacity: 0; } to { transform: none; opacity: 1; } }

/* the picker opens above the heart on hold or hover */
.fpa .fpost-react-picker { left: 0; bottom: calc(100% + 4px); padding: 6px 8px; gap: 4px; }
.fpa .fpost-react-opt { width: 42px; height: 42px; font-size: 1.5rem; }
.fpa .fpost-react-picker.open .fpost-react-opt { animation: fpaOpt 260ms cubic-bezier(.3,1.6,.5,1) both; }
.fpa .fpost-react-picker.open .fpost-react-opt:nth-child(2) { animation-delay: 30ms; }
.fpa .fpost-react-picker.open .fpost-react-opt:nth-child(3) { animation-delay: 60ms; }
.fpa .fpost-react-picker.open .fpost-react-opt:nth-child(4) { animation-delay: 90ms; }
.fpa .fpost-react-picker.open .fpost-react-opt:nth-child(5) { animation-delay: 120ms; }
@keyframes fpaOpt { from { transform: translateY(10px) scale(.5); opacity: 0; } to { transform: none; opacity: 1; } }

/* share menu */
.fpa .fpost-share-dropdown { min-width: 200px; }
.fpa .fpa-repost { font-weight: 700; }

/* the one action that fits the post */
.fpa-smart {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  height: 36px; min-width: 44px; padding: 0 14px; margin: 4px 4px 4px 0;
  border-radius: 999px; border: 1px solid rgba(255,255,255,.14);
  background: rgba(255,255,255,.05); color: var(--text, #fff);
  font: inherit; font-size: .82rem; font-weight: 700; white-space: nowrap; cursor: pointer;
  -webkit-tap-highlight-color: transparent; touch-action: manipulation;
  transition: background 140ms, border-color 140ms, transform 120ms;
}
.fpa-smart:hover { background: rgba(255,255,255,.1); border-color: rgba(255,255,255,.24); }
.fpa-smart:active { transform: scale(.95); }
.fpa-smart:disabled { opacity: .6; }
.fpa-smart.on { background: rgba(16,185,129,.14); border-color: rgba(16,185,129,.4); color: #34d399; }

/* who reacted */
.fpost .fpost-react-bar.fpa-proof {
  display: flex; align-items: center; gap: 8px; flex-wrap: nowrap;
  margin: 8px 14px 0; padding: 4px 6px; border-radius: 10px;
  font-size: .82rem; color: var(--muted, #9a9a9a); cursor: pointer; min-height: 28px;
}
.fpa-emo { display: inline-flex; flex: 0 0 auto; }
.fpa-emo i {
  font-style: normal; font-size: .82rem; line-height: 1;
  width: 21px; height: 21px; border-radius: 50%;
  display: inline-flex; align-items: center; justify-content: center;
  background: var(--card, #1b1b1b); box-shadow: 0 0 0 2px var(--card, #1b1b1b);
}
.fpa-emo i + i { margin-left: -5px; }
.fpa-who { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fpa-proof:hover .fpa-who { text-decoration: underline; }

/* double-tap heart */
.fpa-burst {
  position: fixed; z-index: 9999; pointer-events: none;
  font-size: 84px; line-height: 1; transform: translate(-50%, -50%) scale(0);
  filter: drop-shadow(0 6px 18px rgba(0,0,0,.35));
  animation: fpaBurst 760ms cubic-bezier(.2,1.4,.4,1) forwards;
}
@keyframes fpaBurst {
  0% { transform: translate(-50%,-50%) scale(0); opacity: 0; }
  20% { transform: translate(-50%,-50%) scale(1.15); opacity: 1; }
  40% { transform: translate(-50%,-50%) scale(.95); }
  75% { transform: translate(-50%,-50%) scale(1); opacity: 1; }
  100% { transform: translate(-50%,-80%) scale(.9); opacity: 0; }
}

/* a repost: the original post as a card */
.fpa-shared {
  display: block; width: calc(100% - 32px); margin: 10px 16px 4px; padding: 12px 14px;
  text-align: left; font: inherit; color: inherit; cursor: pointer;
  border: 1px solid rgba(255,255,255,.12); border-radius: 14px; background: rgba(255,255,255,.03);
  transition: background 140ms, border-color 140ms;
}
.fpa-shared:hover { background: rgba(255,255,255,.06); border-color: rgba(255,255,255,.2); }
.fpa-shared-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.fpa-shared-head img, .fpa-shared-head > span {
  width: 26px; height: 26px; border-radius: 50%; object-fit: cover; flex: 0 0 auto;
  display: inline-flex; align-items: center; justify-content: center; font-size: .72rem; font-weight: 700; color: #fff;
}
.fpa-shared-head b { font-size: .86rem; }
.fpa-shared-head small { color: var(--muted, #9a9a9a); font-size: .76rem; }
.fpa-shared-ev { display: block; font-size: .78rem; font-weight: 700; color: var(--red, #C8102E); margin-bottom: 4px; }
.fpa-shared-txt { display: block; font-size: .88rem; line-height: 1.45; white-space: pre-line; overflow-wrap: anywhere; }
.fpa-shared-img { display: block; width: 100%; max-height: 260px; object-fit: cover; border-radius: 10px; margin-top: 8px; }
.fpa-shared-gone { cursor: default; color: var(--muted, #9a9a9a); font-size: .85rem; }

/* share-to-feed sheet */
.fpa-sheet-bg {
  position: fixed; inset: 0; z-index: 10050; background: rgba(0,0,0,.55);
  display: flex; align-items: center; justify-content: center; padding: 16px;
  animation: fpaFade 160ms ease;
}
@keyframes fpaFade { from { opacity: 0; } }
.fpa-sheet {
  width: 100%; max-width: 520px; max-height: calc(100vh - 32px); overflow: auto;
  background: var(--card, #161616); color: var(--text, #fff);
  border: 1px solid rgba(255,255,255,.1); border-radius: 18px; padding: 18px;
  box-shadow: 0 24px 60px rgba(0,0,0,.5); animation: fpaUp 220ms cubic-bezier(.2,1.2,.4,1);
}
@keyframes fpaUp { from { transform: translateY(24px); opacity: 0; } }
.fpa-sheet h3 { margin: 0 0 12px; font-size: 1.05rem; }
.fpa-sheet textarea {
  width: 100%; box-sizing: border-box; min-height: 84px; resize: vertical;
  border-radius: 12px; border: 1px solid rgba(255,255,255,.14); background: rgba(255,255,255,.04);
  color: inherit; font: inherit; font-size: .95rem; padding: 12px;
}
.fpa-sheet textarea:focus { outline: none; border-color: var(--red, #C8102E); }
.fpa-sheet .fpa-shared { width: 100%; margin: 12px 0 0; cursor: default; }
.fpa-sheet-row { display: flex; justify-content: flex-end; gap: 8px; margin-top: 14px; }
.fpa-sheet-row button {
  height: 44px; padding: 0 18px; border-radius: 999px; font: inherit; font-weight: 700; cursor: pointer;
  border: 1px solid rgba(255,255,255,.16); background: transparent; color: inherit;
}
.fpa-sheet-row .fpa-go { background: var(--red, #C8102E); border-color: transparent; color: #fff; }
.fpa-sheet-row .fpa-go:disabled { opacity: .6; }
@media (max-width: 600px) {
  .fpa-sheet-bg { align-items: flex-end; padding: 0; }
  .fpa-sheet { border-radius: 18px 18px 0 0; max-width: none; padding-bottom: calc(18px + env(safe-area-inset-bottom)); }
}

/* a post opened from a link glows briefly */
.fpost.fpa-flash { animation: fpaFlash 1.8s ease; }
@keyframes fpaFlash { 0%, 40% { box-shadow: 0 0 0 2px var(--red, #C8102E); } 100% { box-shadow: 0 0 0 0 transparent; } }
.fpost-poll.fpa-flash { animation: fpaFlash 1.4s ease; border-radius: 12px; }

/* phones: icons only, tighter */
@media (max-width: 600px) {
  .fpost .fpost-actions.fpa { padding: 2px 6px 4px; }
  .fpost .fpa .fpost-btn, .fpost .fpa .fpost-react-wrap > .fpost-btn { padding: 0 8px; font-size: .86rem; }
  .fpa-smart { padding: 0 12px; }
  .fpost .fpost-react-bar.fpa-proof { margin: 8px 10px 0; }
}

/* light mode */
[data-theme="light"] .fpost .fpa .fpost-btn:hover { background: rgba(0,0,0,.05); }
[data-theme="light"] .fpost .fpost-actions.fpa { border-top-color: rgba(0,0,0,.08); }
[data-theme="light"] .fpa-smart { border-color: rgba(0,0,0,.14); background: rgba(0,0,0,.03); }
[data-theme="light"] .fpa-smart:hover { background: rgba(0,0,0,.06); border-color: rgba(0,0,0,.24); }
[data-theme="light"] .fpa-smart.on { background: rgba(16,185,129,.12); border-color: rgba(16,185,129,.45); color: #047857; }
[data-theme="light"] .fpa-shared { border-color: rgba(0,0,0,.12); background: rgba(0,0,0,.02); }
[data-theme="light"] .fpa-shared:hover { background: rgba(0,0,0,.04); }
[data-theme="light"] .fpa-sheet { background: #fff; color: #111; border-color: rgba(0,0,0,.08); }
[data-theme="light"] .fpa-sheet textarea { border-color: rgba(0,0,0,.15); background: #fafafa; }
[data-theme="light"] .fpa-sheet-row button { border-color: rgba(0,0,0,.15); }
[data-theme="light"] .fpost .fpa .fpost-react-picker { background: #fff; border-color: rgba(0,0,0,.08); box-shadow: 0 8px 28px rgba(0,0,0,.18); }
[data-theme="light"] .fpa .fpost-react-opt:hover { background: rgba(0,0,0,.06); }

@media (prefers-reduced-motion: reduce) {
  .fpa-pop .fpost-react-emoji, .fpa-pop svg, .fpost-btn-count.fpa-tick, .fpa-burst,
  .fpa .fpost-react-picker.open .fpost-react-opt { animation: none; }
}
