:root{--tooltip-text-color:white;--tooltip-background-color:#000000d9;--tooltip-margin:30px;--tooltip-arrow-size:6px;--tooltip-border-color:#fff3}.Tooltip-Wrapper{display:inline-block;position:relative}.Tooltip-Tip{color:var(--tooltip-text-color);background:var(--tooltip-background-color);z-index:9999;border:.1px solid var(--tooltip-border-color);opacity:0;visibility:hidden;border-radius:4px;min-width:160px;padding:1rem;font-family:sans-serif;font-size:14px;line-height:1;transition:opacity .15s ease-in-out,visibility .15s ease-in-out,transform .15s ease-in-out;display:inline-block;position:absolute;left:50%;transform:translate(-50%)}.Tooltip-Tip.visible{opacity:1;visibility:visible;transform:translate(-50%)translateY(0)}.Tooltip-Tip.top{top:calc(var(--tooltip-margin)*-1);transform:translate(-50%)translateY(5px)}.Tooltip-Tip.top.visible{transform:translate(-50%)translateY(0)}.Tooltip-Tip.right{left:calc(100% + var(--tooltip-margin));top:50%;transform:translate(-5px)translateY(-50%)}.Tooltip-Tip.right.visible{transform:translate(0)translateY(-50%)}.Tooltip-Tip.bottom{bottom:calc(var(--tooltip-margin)*-1);transform:translate(-50%)translateY(-5px)}.Tooltip-Tip.bottom.visible{transform:translate(-50%)translateY(0)}.Tooltip-Tip.left{left:auto;right:calc(100% + var(--tooltip-margin)*.5);top:50%;transform:translate(5px)translateY(-50%)}.Tooltip-Tip.left.visible{transform:translate(0)translateY(-50%)}