.tip{display:inline-grid;place-items:center;width:14px;height:14px;min-height:0;margin-left:5px;padding:0;border:1px solid var(--z-borderHi);border-radius:50%;background:transparent;box-shadow:none;color:rgb(var(--z-muted));font-size:9px;font-weight:600;line-height:1;letter-spacing:0;text-transform:none;vertical-align:middle;cursor:help;flex-shrink:0}
.tip:hover,.tip.tip-open{color:rgb(var(--z-text));border-color:rgb(var(--z-accent)/.6);background:var(--z-surface2)}
.tip:focus-visible{outline:2px solid rgb(var(--z-accent));outline-offset:2px}
@media(pointer:coarse){.tip{position:relative}.tip::after{content:'';position:absolute;inset:-10px}}
.tip-bubble{position:fixed;z-index:1000;max-width:min(260px,calc(100vw - 16px));padding:7px 9px;border:1px solid var(--z-borderHi);border-radius:6px;background:rgb(var(--z-surface));box-shadow:var(--z-panel-shadow);color:rgb(var(--z-textDim));font-size:.647059rem;font-weight:400;line-height:1.45;letter-spacing:0;text-transform:none;white-space:normal;pointer-events:none;animation:tip-in .12s ease-out}
@keyframes tip-in{from{opacity:0;transform:translateY(2px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.tip-bubble{animation:none}}
.demo-pill{display:inline-flex;align-items:center}