.demo-section{border:1px solid #ddd;border-radius:4px;margin:20px 0;padding:20px}button{background-color:#4caf50;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:14px;padding:8px 16px}.tooltip-trigger{display:inline-block;position:relative}.tooltip{background:var(--color-primitive-secondary-secondary-container,#f1f4f8);border-radius:4px;color:var(--color-primitive-surface-on-surface-variant,#747476);font-size:13px;line-height:1.4;max-height:350px;max-width:327px;min-height:250px;min-width:327px;opacity:0;overflow-y:auto;padding:16px 24px;pointer-events:none;position:absolute;transition:opacity .2s ease;visibility:hidden;white-space:normal;z-index:9999;word-wrap:break-word;box-shadow:0 2px 8px rgba(0,0,0,.2);box-sizing:border-box;display:inline-block}.tooltip.show{opacity:1;pointer-events:auto;visibility:visible}.tooltip.show *{pointer-events:auto;position:relative;z-index:10000}.tooltip.show:before{pointer-events:auto;z-index:9999}.tooltip.show a,.tooltip.show button,.tooltip.show input,.tooltip.show select,.tooltip.show textarea{pointer-events:auto;position:relative;z-index:10000}.tooltip::-webkit-scrollbar{width:4px}.tooltip::-webkit-scrollbar-track{background:hsla(0,0%,100%,.1);border-radius:2px}.tooltip::-webkit-scrollbar-thumb{background:hsla(0,0%,100%,.2);border-radius:2px}.tooltip::-webkit-scrollbar-thumb:hover{background:hsla(0,0%,100%,.3)}.tooltip:before{border:6px solid transparent;content:"";height:0;position:absolute;width:0;z-index:1}.tooltip[data-position=top]{bottom:100%;left:50%;transform:translateX(-50%)}.tooltip[data-position=top]:before{border-top-color:#1a1a1a;left:50%;top:100%;transform:translateX(-50%)}.tooltip[data-position=top].show{transform:translateX(-50%)}.tooltip[data-position=right]{left:100%;top:50%;transform:translateY(-50%)}.tooltip[data-position=right]:before{border-right-color:#1a1a1a;left:-12px;top:50%;transform:translateY(-50%)}.tooltip[data-position=right].show{transform:translateY(-50%)}.tooltip[data-position=bottom]{left:50%;top:100%;transform:translateX(-50%)}.tooltip[data-position=bottom]:before{border-bottom-color:#1a1a1a;bottom:100%;left:50%;transform:translateX(-50%)}.tooltip[data-position=bottom].show{transform:translateX(-50%)}.tooltip[data-position=left]{right:100%;top:50%;transform:translateY(-50%)}.tooltip[data-position=left]:before{border-left-color:#1a1a1a;right:-12px;top:50%;transform:translateY(-50%)}.tooltip[data-position=left].show{transform:translateY(-50%)}.tooltip h3,.tooltip h4{font-size:14px;font-weight:500;line-height:var(--typography-line-height-body-sm,24px);margin:0 0 6px}.tooltip h3,.tooltip h4,.tooltip p{color:var(--color-primitive-surface-on-surface-variant,#747476);font-weight:var(--typography-font-weight-body,400);text-align:left}.tooltip p{font-size:13px;line-height:1.4;line-height:var(--typography-line-height-body-sm,24px);margin:6px 0}.tooltip a{text-align:left;text-decoration:none;transition:color .2s ease}.tooltip a,.tooltip a:hover{color:var(--color-primitive-surface-on-surface-variant,#747476)}.tooltip a:hover{text-decoration:underline}.tooltip-edit-btn{background:hsla(0,0%,100%,.1);border:none;border-radius:3px;color:#fff;cursor:pointer;font-size:11px;padding:3px 6px;position:absolute;right:6px;top:6px;transition:background-color .2s ease}.tooltip-edit-btn:hover{background:hsla(0,0%,100%,.2)}.tooltip-edit-form{display:flex;flex-direction:column;gap:8px}.tooltip-edit-textarea{background:hsla(0,0%,100%,.1);border:1px solid hsla(0,0%,100%,.2);border-radius:3px;color:#fff;font-size:13px;min-height:60px;padding:6px;resize:vertical;width:100%}.tooltip-edit-textarea:focus{background:hsla(0,0%,100%,.15);border-color:hsla(0,0%,100%,.3);outline:none}.tooltip-edit-buttons{display:flex;gap:6px;justify-content:flex-end}.tooltip-edit-cancel,.tooltip-edit-save{border:none;border-radius:3px;cursor:pointer;font-size:11px;padding:4px 8px;transition:all .2s ease}.tooltip-edit-save{background-color:#4a9eff;color:#fff}.tooltip-edit-save:hover{background-color:#66b3ff}.tooltip-edit-cancel{background-color:#666;color:#fff}.tooltip-edit-cancel:hover{background-color:grey}.custom-style+.tooltip{background-color:#e91e63;box-shadow:0 2px 8px rgba(0,0,0,.2);font-weight:700}.custom-style+.tooltip:before{border-top-color:#e91e63}