Preview tooltip styles and positions with pure-CSS arrows.
.tooltip { position: relative; }
.tooltip:hover::after { content: "Helpful tip"; position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); background: #1f2937; color: #fff; padding: 4px 8px; border-radius: 4px; font-size: 12px; white-space: nowrap; }