.demo-tip{position:absolute;z-index:20;max-width:260px;padding:0.65rem 2rem 0.7rem 0.85rem;background:#0b1220;color:#fafaf7;border-radius:12px;font-family:'Geist',system-ui,sans-serif;font-size:0.88rem;line-height:1.4;box-shadow:0 18px 38px -16px rgba(0,0,0,0.5);opacity:0;transform:translateY(4px);transition:opacity 0.22s ease,transform 0.22s ease;pointer-events:auto;cursor:pointer;}.demo-tip.is-shown{opacity:1;transform:translateY(0);}.demo-tip-step{display:inline-block;font-family:'Geist Mono',ui-monospace,monospace;font-size:0.65rem;letter-spacing:0.06em;text-transform:uppercase;color:#fde68a;margin-bottom:0.25rem;}.demo-tip-text{margin:0;color:#fafaf7;}.demo-tip-dismiss{position:absolute;top:4px;right:6px;background:transparent;border:0;color:#cbd5e1;font-size:1.05rem;width:22px;height:22px;cursor:pointer;border-radius:6px;}.demo-tip-dismiss:hover{background:rgba(255,255,255,0.08);color:white;}.demo-tip-arrow{position:absolute;width:12px;height:12px;background:#0b1220;left:var(--arrow-x,50%);transform:translateX(-50%) rotate(45deg);}.demo-tip[data-placement="top"] .demo-tip-arrow{bottom:-5px;}.demo-tip[data-placement="bottom"] .demo-tip-arrow{top:-5px;}@media (prefers-reduced-motion:reduce){.demo-tip{transition:opacity 0.1s linear,transform 0.1s linear;}}@media (max-width:600px){.demo-tip{max-width:240px;font-size:0.85rem;}}