.timeline{--node:56px;--pad:20px;padding-inline:var(--pad)}@media (max-width:575px){.timeline{--node:44px;--pad:16px}}.timeline-rail,.timeline-fill{top:calc(var(--node) / 2);bottom:0;left:calc(var(--pad) + var(--node) / 2 - 1px);background:linear-gradient(#38bdf8,#8b5cf6,#ec4899,#f97316);border-radius:9999px;width:2px;position:absolute}.timeline-rail{opacity:.25}@property --fill{syntax:"<number>";inherits:false;initial-value:2}.timeline-fill{-webkit-mask-image:linear-gradient(to bottom, #000 calc(var(--fill) * 100% - 160px), transparent calc(var(--fill) * 100%));-webkit-mask-image:linear-gradient(to bottom, #000 calc(var(--fill) * 100% - 160px), transparent calc(var(--fill) * 100%));mask-image:linear-gradient(to bottom, #000 calc(var(--fill) * 100% - 160px), transparent calc(var(--fill) * 100%));filter:drop-shadow(0 0 6px #8b5cf699)}@keyframes timeline-grow{0%{--fill:0}to{--fill:1.2}}@supports (animation-timeline:view()){@media (prefers-reduced-motion:no-preference){.timeline-fill{animation:linear both timeline-grow;animation-timeline:view();animation-range:cover 50vh cover calc(100% - 50vh)}}}