/* Techniques shown on a battlefield (src/panels/reveals_sheet.rs, docs/pvp/reveals.md): a stack of
   pops in the top right corner, the newest on top, each sliding in as it comes and away in its last
   moment (.leaving). It takes no clicks: the fight goes on under it. Whose it is reads in their
   side's ink: yours gold, your team's jade, theirs vermilion. */
#reveals {
  position: fixed; top: 18px; right: 18px; z-index: 3; display: flex; flex-direction: column; gap: 10px;
  width: min(340px, 42vw); pointer-events: none;
  &[hidden] { display: none; }
  .reveal { display: flex; flex-direction: column; gap: 8px; animation: pop-in 260ms ease-out both; --from: -10px;
    transition: opacity 400ms ease-in, translate 400ms ease-in; }
  .reveal.leaving { opacity: 0; translate: 24px 0; }
  .reveal-who { margin: 0; font-size: 11.5px; font-style: normal; }
  .reveal-who b { font-weight: 700; letter-spacing: 0.1em; }
  .you .reveal-who b { color: var(--gold-hi); }
  .ours .reveal-who b { color: var(--jade-hi); }
  .theirs .reveal-who b { color: var(--vermilion-hi); }
  .reveal-foot { padding-top: 6px; border-top: 1px solid var(--line); font-size: 13px; color: var(--paper-muted); }
}