/* Poke (assets/js/poke.js): the word a tapped thing says. The host box is
   positioned; the bubble sits above the thing, below it at the top edge. */
.rt-poke-bubble { position: absolute; z-index: 6; transform: translate(-50%, -100%); padding: 6px 11px; border-radius: 12px; background: #fff; color: #241a3a; font-weight: 800; font-size: .95rem; line-height: 1.2; white-space: nowrap; box-shadow: 0 6px 18px rgba(0, 0, 0, .28); pointer-events: none; animation: rt-poke-bubble 1.5s ease-out forwards; }
.rt-poke-bubble::after { content: ""; position: absolute; left: 50%; top: 100%; transform: translateX(-50%); border: 6px solid transparent; border-top-color: #fff; }
.rt-poke-bubble.is-left { transform: translate(-14%, -100%); }
.rt-poke-bubble.is-left::after { left: 14%; }
.rt-poke-bubble.is-right { transform: translate(-86%, -100%); }
.rt-poke-bubble.is-right::after { left: 86%; }
.rt-poke-bubble.is-below { transform: translate(-50%, 0); }
.rt-poke-bubble.is-below.is-left { transform: translate(-14%, 0); }
.rt-poke-bubble.is-below.is-right { transform: translate(-86%, 0); }
.rt-poke-bubble.is-below::after { top: auto; bottom: 100%; border-top-color: transparent; border-bottom-color: #fff; }
@keyframes rt-poke-bubble { 0% { opacity: 0; margin-top: 6px; } 12% { opacity: 1; margin-top: 0; } 75% { opacity: 1; } 100% { opacity: 0; margin-top: -10px; } }