@layer components{.wfk-axis{--wfk-now:24%;--wfk-next:46%;--wfk-later:62%;--wfk-later-mid:81%;--wfk-line-y:56px;--wfk-stem:20px;--wfk-band-alpha:26%;height:88px;position:relative}.wfk-line{top:calc(var(--wfk-line-y) - 1px);background-color:var(--color-neutral-300);transform-origin:0;border-radius:1px;height:2px;position:absolute;left:0;right:0}.wfk-tick{top:calc(var(--wfk-line-y) + 14px);letter-spacing:.02em;white-space:nowrap;color:var(--color-text-muted);font-size:12px;font-weight:600;line-height:16px;position:absolute;transform:translate(-50%)}.wfk-tick[data-tick="0"]{left:0;transform:none}.wfk-tick[data-tick="1"]{left:var(--wfk-now);letter-spacing:.1em;color:var(--color-text);font-weight:800}.wfk-tick[data-tick="2"]{left:var(--wfk-next)}.wfk-tick[data-tick="3"]{left:var(--wfk-later-mid)}.wfk-band{top:calc(var(--wfk-line-y) - 13px);left:var(--wfk-later);background-image:linear-gradient(90deg, transparent, color-mix(in oklab, var(--color-brand-blue) var(--wfk-band-alpha), transparent) 22% 78%, transparent);filter:blur(7px);border-radius:13px;height:26px;position:absolute;right:1%}.wfk-mark{--wfk-dot:10px;bottom:calc(100% - var(--wfk-line-y));flex-direction:column;align-items:center;transition:opacity .2s;display:flex;position:absolute;transform:translate(-50%)}.wfk-mark[data-kind=detection]{left:var(--wfk-now)}.wfk-mark[data-kind=forecasting]{left:var(--wfk-later-mid);bottom:calc(100% - var(--wfk-line-y) + 14px);--wfk-stem:8px}.wfk-mark[data-kind=prediction]{--wfk-dot:14px;left:var(--wfk-next)}.wfk-mark-label{white-space:nowrap;text-align:center;color:var(--color-text-muted);padding-bottom:6px;font-size:13px;font-weight:600;line-height:18px;transition:color .2s}.wfk-mark-stem{width:1px;height:var(--wfk-stem);background-color:var(--color-neutral-300)}.wfk-mark-dot{width:var(--wfk-dot);height:var(--wfk-dot);margin-bottom:calc(var(--wfk-dot) / -2);background-color:var(--color-neutral-500);border-radius:50%;transition:background-color .2s,box-shadow .2s,transform .2s}.wfk-mark[data-kind=forecasting] .wfk-mark-dot{display:none}.wfk-mark[data-kind=prediction] .wfk-mark-label{color:var(--color-gold-on-light);font-weight:800}.wfk-mark[data-kind=prediction] .wfk-mark-stem{background-color:var(--color-gold-on-light);width:2px}.wfk-mark[data-kind=prediction] .wfk-mark-dot{border:2px solid var(--color-neutral-0);background-color:var(--color-viz-gold);box-shadow:0 0 0 1px var(--color-gold-on-light), 0 0 18px 4px color-mix(in oklab, var(--color-viz-gold) 45%, transparent)}@media not (min-width:640px){.wfk-axis{--wfk-now:21%;--wfk-next:49%;--wfk-line-y:74px;--wfk-stem:14px;height:106px}.wfk-mark-label{white-space:normal;text-wrap:balance;width:84px}}@media (hover:hover){:is(.wfk:has(.wfk-card:hover) .wfk-mark,.wfk:has(.wfk-card:hover) .wfk-band){opacity:.25}.wfk-band{transition:opacity .2s}:is(.wfk:has(.wfk-card[data-kind=detection]:hover) .wfk-axis [data-kind=detection],.wfk:has(.wfk-card[data-kind=forecasting]:hover) .wfk-axis [data-kind=forecasting],.wfk:has(.wfk-card[data-kind=prediction]:hover) .wfk-axis [data-kind=prediction]){opacity:1}:is(.wfk:has(.wfk-card[data-kind=detection]:hover) .wfk-mark[data-kind=detection] .wfk-mark-label,.wfk:has(.wfk-card[data-kind=forecasting]:hover) .wfk-mark[data-kind=forecasting] .wfk-mark-label){color:var(--color-text)}.wfk:has(.wfk-card[data-kind=detection]:hover) .wfk-mark[data-kind=detection] .wfk-mark-dot{background-color:var(--color-neutral-700);transform:scale(1.2)}.wfk:has(.wfk-card[data-kind=forecasting]:hover) .wfk-band{--wfk-band-alpha:40%}.wfk:has(.wfk-card[data-kind=prediction]:hover) .wfk-mark[data-kind=prediction] .wfk-mark-dot{box-shadow:0 0 0 1px var(--color-gold-on-light), 0 0 28px 8px color-mix(in oklab, var(--color-viz-gold) 60%, transparent);transform:scale(1.15)}}.motion[data-anim]:not([data-anim=reset]) .wfk-line{animation:motion-grow-x .6s var(--motion-ease) calc(var(--motion-delay) + 0s) backwards}.motion[data-anim]:not([data-anim=reset]) .wfk-tick{animation:.3s ease-out backwards motion-fade}.motion[data-anim]:not([data-anim=reset]) .wfk-tick[data-tick="0"]{animation-delay:calc(var(--motion-delay) + 0s)}.motion[data-anim]:not([data-anim=reset]) .wfk-tick[data-tick="1"]{animation-delay:calc(var(--motion-delay) + .12s)}.motion[data-anim]:not([data-anim=reset]) .wfk-tick[data-tick="2"]{animation-delay:calc(var(--motion-delay) + .24s)}.motion[data-anim]:not([data-anim=reset]) .wfk-tick[data-tick="3"]{animation-delay:calc(var(--motion-delay) + .42s)}.motion[data-anim]:not([data-anim=reset]) .wfk-mark{animation:wfk-mark-in .4s var(--motion-ease) backwards}.motion[data-anim]:not([data-anim=reset]) .wfk-mark[data-kind=detection]{animation-delay:calc(var(--motion-delay) + .6s)}.motion[data-anim]:not([data-anim=reset]) .wfk-band{animation:wfk-band-in .65s ease-out calc(var(--motion-delay) + .85s) backwards}.motion[data-anim]:not([data-anim=reset]) .wfk-mark[data-kind=forecasting]{animation-delay:calc(var(--motion-delay) + 1.05s)}.motion[data-anim]:not([data-anim=reset]) .wfk-mark[data-kind=prediction]{animation-delay:calc(var(--motion-delay) + 1.3s)}.motion[data-anim]:not([data-anim=reset]) .wfk-mark[data-kind=prediction] .wfk-mark-dot{animation:wfk-glow-in .9s var(--motion-ease) calc(var(--motion-delay) + 1.3s) backwards}.motion[data-anim]:not([data-anim=reset]) .wfk-closing{animation:wfk-closing-in .5s var(--motion-ease) calc(var(--motion-delay) + 1.75s) backwards}}@keyframes wfk-mark-in{0%{opacity:0;transform:translate(-50%,6px)}}@keyframes wfk-band-in{0%{opacity:0;transform:scaleX(.35)}}@keyframes wfk-glow-in{0%{transform:scale(0)}45%{box-shadow:0 0 0 1px var(--color-gold-on-light), 0 0 36px 14px color-mix(in oklab, var(--color-viz-gold) 70%, transparent);transform:scale(1.3)}}@keyframes wfk-closing-in{0%{opacity:0;transform:translateY(8px)}}