.os-axis{height:30rem;margin-inline-start:5.5rem;position:relative}.os-axis>*{position:absolute}.os-seg{inset-inline-start:0;top:calc(var(--from) * 100%);width:1px;height:calc(var(--len) * 100%);background-color:var(--border-strong)}.os-break{top:calc(var(--at) * 100%);border-block:1px solid var(--fg-subtle);width:13px;height:6px;margin-top:-3px;inset-inline-start:-6px;transform:skewY(-20deg)}.os-tick{top:calc(var(--at) * 100%);font-family:var(--font-mono);white-space:nowrap;color:var(--fg-subtle);font-size:.75rem;line-height:1;inset-inline-end:calc(100% + .75rem);transform:translateY(-50%)}.os-dot{background-color:var(--accent);border-radius:50%;width:10px;height:10px;display:block}.os-dot-ring{background-color:var(--bg);border:2px solid var(--accent)}.os-axis>.os-dot{top:calc(var(--at) * 100%);margin-top:-5px;inset-inline-start:calc(8px + var(--k) * 14px)}@media (min-width:640px){.os-axis{height:6.5rem;margin-inline-start:0}.os-seg{top:auto;bottom:2rem;width:calc(var(--len) * 100%);height:1px;inset-inline-start:calc(var(--from) * 100%)}.os-break{top:auto;bottom:calc(2rem - 6px);border-block:0;border-inline:1px solid var(--fg-subtle);width:6px;height:13px;margin:0 0 0 -3px;inset-inline-start:calc(var(--at) * 100%);transform:skew(-20deg)}.os-tick{top:auto;bottom:0;inset-inline:calc(var(--at) * 100%) auto;transform:none}.os-tick:before{content:"";inset-inline-start:0;background-color:var(--border-strong);width:1px;height:.375rem;position:absolute;bottom:calc(100% + .375rem)}.os-axis>.os-dot{top:auto;bottom:calc(2rem + 8px + var(--k) * 14px);margin:0 0 0 -5px;inset-inline-start:calc(var(--at) * 100%)}}@media screen and (prefers-reduced-motion:no-preference){html.js [data-reveal=dots]:not([data-revealed]) [data-dot]{opacity:0;transform:scale(0)}[data-reveal=dots] [data-dot]{transition:opacity var(--duration-base) var(--ease-out), transform var(--duration-base) var(--ease-out);transition-delay:calc(var(--i) * var(--stagger))}[data-revealed=instant] [data-dot]{transition:none}}