.tooltip-wrap{position:relative;display:inline-flex}.tooltip{--tooltip-bg:var(--surface-inverse);--tooltip-text:var(--text-on-ink);position:absolute;bottom:calc(100% + var(--sp-2));left:50%;transform:translateX(-50%);background:var(--tooltip-bg);color:var(--tooltip-text);padding:6px 10px;border-radius:var(--radius-sm);font-size:var(--fs-sm);white-space:nowrap;pointer-events:none;box-shadow:var(--shadow-md);z-index:var(--z-tooltip);opacity:0;visibility:hidden;transition:opacity var(--duration-fast) var(--ease-out),visibility var(--duration-fast) var(--ease-out)}.tooltip.visible{opacity:1;visibility:visible}.tooltip:after{content:"";position:absolute;top:100%;left:50%;transform:translateX(-50%);border-top-color:transparent;border:var(--sp-1) solid transparent;border-top:var(--sp-1) solid var(--tooltip-bg)}.tooltip[data-placement=bottom]{top:calc(100% + var(--sp-2));bottom:auto}.tooltip[data-placement=bottom]:after{top:auto;bottom:100%;border-top-color:transparent;border-bottom-color:var(--tooltip-bg)}