.tooltip{display:inline-flex;position:relative}.tooltip__bubble{z-index:20;color:#fff;text-align:left;white-space:normal;pointer-events:none;opacity:0;visibility:hidden;background-color:#161616;border-radius:4px;width:max-content;max-width:15rem;padding:.375rem .625rem;font-size:.75rem;font-weight:500;line-height:1rem;transition:opacity .15s ease-in-out,visibility .15s ease-in-out;position:absolute}.tooltip__bubble--top{bottom:calc(100% + .5rem)}.tooltip__bubble--bottom{top:calc(100% + .5rem)}.tooltip__bubble--start{left:0}.tooltip__bubble--end{right:0}.tooltip:hover .tooltip__bubble,.tooltip:focus-within .tooltip__bubble,.tooltip__bubble--open{opacity:1;visibility:visible}