.tip{display:inline-flex;position:relative}.tip-bubble{transform:translate(calc(-50% + var(--tip-shift,0px)),4px);background:var(--ink);color:var(--room);font:500 .8125rem/1.2 var(--sans);white-space:normal;box-sizing:border-box;opacity:0;z-index:5;border-radius:10px;width:max-content;max-width:min(300px,100vw - 16px);padding:8px 12px;transition:none;display:none;bottom:calc(100% + 10px);left:50%}.tip-bubble,.tip-bubble:after{pointer-events:none;position:absolute}.tip-bubble:after{content:"";top:100%;left:calc(50% - var(--tip-shift,0px));border:6px solid #0000;border-top-color:var(--ink);transform:translate(-50%)}.tip-bubble.is-busy{text-align:center}.tip-dots.dot-loader--bar{height:6px;margin-top:7px}:is(.tip.is-armed:has(:focus-visible) .tip-bubble,.tip.is-on .tip-bubble){opacity:1;transform:translate(calc(-50% + var(--tip-shift,0px)));transition:opacity .16s 60ms,transform .16s 60ms;display:block}@starting-style{:is(.tip.is-armed:has(:focus-visible) .tip-bubble,.tip.is-on .tip-bubble){opacity:0;transform:translate(calc(-50% + var(--tip-shift,0px)),4px)}}@media (hover:hover) and (pointer:fine){.tip.is-armed:hover .tip-bubble{opacity:1;transform:translate(calc(-50% + var(--tip-shift,0px)));transition:opacity .16s 60ms,transform .16s 60ms;display:block}@starting-style{.tip.is-armed:hover .tip-bubble{opacity:0;transform:translate(calc(-50% + var(--tip-shift,0px)),4px)}}}