.tooltip{display:inline-flex;position:relative}.tooltiptext{z-index:9999;opacity:0;pointer-events:none;color:#fff;background:#383838;border-radius:6px;max-width:min(300px,100vw - 16px);padding:8px 10px;font-weight:600;transition:opacity .15s,transform .15s;position:absolute;transform:translateY(-4px)}.tooltiptext[style]{opacity:1;transform:translateY(0)}.tooltiptext .arrow{border:6px solid #0000;width:0;height:0;position:absolute}.tooltiptext[data-placement=top] .arrow{border-top-color:#383838;border-bottom-width:0;top:100%;left:50%;transform:translate(-50%)}.tooltiptext[data-placement=bottom] .arrow{border-top-width:0;border-bottom-color:#383838;bottom:100%;left:50%;transform:translate(-50%)}