.percentile-bar{display:flex;flex-direction:column;gap:10px;width:100%;max-width:480px}.percentile-bar__track{position:relative;height:10px;border-radius:5px;overflow:visible;box-shadow:inset 0 0 0 1px rgba(148,163,184,.08)}.percentile-bar__gradient{position:absolute;inset:0;border-radius:5px;background:linear-gradient(90deg,rgba(248,113,113,.28) 0,rgba(251,191,36,.22) 20%,rgba(56,189,248,.22) 40%,rgba(56,189,248,.22) 60%,rgba(251,191,36,.22) 80%,rgba(248,113,113,.28))}.percentile-bar__tick--mid{position:absolute;top:-2px;left:50%;width:1px;height:14px;background:rgba(148,163,184,.25);transform:translateX(-.5px)}.percentile-bar__dot{position:absolute;top:50%;left:var(--dot-position,50%);width:18px;height:18px;border-radius:50%;transform:translate(-50%,-50%);background:currentColor;box-shadow:0 0 0 2px #0f0f17,0 0 0 4px currentColor,0 0 12px color-mix(in srgb,currentColor 45%,transparent)}.percentile-bar__dot--extreme-low{color:#f87171}.percentile-bar__dot--low{color:#fbbf24}.percentile-bar__dot--neutral{color:#38bdf8}.percentile-bar__dot--high{color:#fbbf24}.percentile-bar__dot--extreme-high{color:#f87171}.percentile-bar--adoption .percentile-bar__gradient{background:linear-gradient(90deg,rgba(248,113,113,.28) 0,rgba(251,191,36,.22) 20%,rgba(56,189,248,.22) 45%,rgba(56,189,248,.22) 55%,rgba(74,222,128,.22) 80%,rgba(74,222,128,.32))}.percentile-bar--adoption .percentile-bar__dot--extreme-high,.percentile-bar--adoption .percentile-bar__dot--high{color:#4ade80}.percentile-bar__labels{display:flex;justify-content:space-between;font-family:IBM Plex Mono,monospace;font-size:12px;color:#94a3b8}.percentile-bar__label{white-space:nowrap}@media (max-width:640px){.percentile-bar__labels{font-size:11px}}