.tt{position:relative;display:inline-flex;vertical-align:middle}.tt,.tt-panel{--tt-bg-start-cur: var(--tt-bg-start);--tt-bg-end-cur: var(--tt-bg-end);--tt-border-cur: var(--tt-border);--tt-shadow-cur: var(--tt-shadow);--tt-title-cur: var(--tt-title);--tt-text-cur: var(--tt-text)}body.dark-theme .tt,body.dark-theme .tt-panel{--tt-bg-start-cur: var(--tt-bg-start-dark);--tt-bg-end-cur: var(--tt-bg-end-dark);--tt-border-cur: var(--tt-border-dark);--tt-shadow-cur: var(--tt-shadow-dark);--tt-title-cur: var(--tt-title-dark);--tt-text-cur: var(--tt-text-dark)}.tt-panel{position:fixed;min-width:0;width:max-content;max-width:min(280px,90vw);z-index:9500;padding:12px 14px;border-radius:14px;background:linear-gradient(145deg,var(--tt-bg-start-cur),var(--tt-bg-end-cur));border:1px solid var(--tt-border-cur);box-shadow:var(--tt-shadow-cur);color:var(--tt-text-cur);text-align:center;pointer-events:none;animation:tt-in .22s ease-out}.tt-panel.top{transform-origin:bottom center}.tt-panel.bottom{transform-origin:top center}.tt-panel.left{transform-origin:right center}.tt-panel.right{transform-origin:left center}.tt-head{font-weight:600;color:var(--tt-title-cur);margin-bottom:6px;font-size:.9rem}.tt-body{font-size:.85rem;color:var(--tt-text-cur);line-height:1.45}.tt-arrow{position:absolute;width:12px;height:12px;background:linear-gradient(145deg,var(--tt-bg-start-cur),var(--tt-bg-end-cur));border-right:1px solid var(--tt-border-cur);border-bottom:1px solid var(--tt-border-cur);rotate:45deg}.tt-arrow.top{top:100%;left:50%;translate:-50% -50%}.tt-arrow.bottom{bottom:100%;left:50%;translate:-50% 50%}.tt-arrow.left{left:100%;top:50%;translate:-50% -50%}.tt-arrow.right{right:100%;top:50%;translate:50% -50%}@keyframes tt-in{0%{opacity:0;scale:.9}to{opacity:1;scale:1}}.tooltip-info-icon{fill:var(--color-primary-dark);color:var(--color-primary-dark);display:inline-flex;align-items:center;vertical-align:middle;cursor:help;padding:2px}.tt .tooltip-info-icon svg,.tt svg.tooltip-info-icon{transition:rotate .5s ease,scale .5s ease}.tt:hover .tooltip-info-icon svg,.tt:hover svg.tooltip-info-icon,.tt:focus-within .tooltip-info-icon svg,.tt:focus-within svg.tooltip-info-icon{rotate:360deg;scale:1.1}@media (prefers-reduced-motion: reduce){.tt-panel{animation:none}.tt .tooltip-info-icon svg,.tt svg.tooltip-info-icon{transition:none}.tt:hover .tooltip-info-icon svg,.tt:hover svg.tooltip-info-icon,.tt:focus-within .tooltip-info-icon svg,.tt:focus-within svg.tooltip-info-icon{rotate:0deg;scale:1}}