.wks-tl__track { position: relative; }
.wks-tl__date { display: inline-block; font-weight: 700; color: var(--wks-accent); margin-bottom: 4px; }
.wks-tl__card img { width: 100%; height: auto; border-radius: calc(var(--wks-radius) * .7); margin: 6px 0; display: block; }
.wks-tl__title { margin: 4px 0; font-size: 1.1em; }
.wks-tl__text { margin: 0; opacity: .85; }
.wks-tl__dot { position: absolute; width: 16px; height: 16px; border-radius: 50%; background: var(--wks-accent); box-shadow: 0 0 0 4px var(--wks-soft); }
/* vertical */
.wks-tl--v .wks-tl__track::before { content: ""; position: absolute; left: 12px; top: 0; bottom: 0; width: 3px; background: var(--wks-line); }
.wks-tl--v .wks-tl__item { position: relative; padding: 0 0 22px 40px; }
.wks-tl--v .wks-tl__dot { left: 5px; top: 8px; }
.wks-tl--v .wks-tl__era { padding-left: 40px; }
@media (min-width: 768px) {
	.wks-tl--v.wks-tl--alt .wks-tl__track::before { left: 50%; margin-left: -1px; }
	.wks-tl--v.wks-tl--alt .wks-tl__item { width: 50%; padding: 0 36px 22px 0; }
	.wks-tl--v.wks-tl--alt .wks-tl__item .wks-tl__dot { left: auto; right: -8px; }
	.wks-tl--v.wks-tl--alt .wks-tl__group > .wks-tl__item:nth-of-type(even) { margin-left: 50%; padding: 0 0 22px 36px; }
	.wks-tl--v.wks-tl--alt .wks-tl__group > .wks-tl__item:nth-of-type(even) .wks-tl__dot { right: auto; left: -8px; }
	.wks-tl--v.wks-tl--alt .wks-tl__era { text-align: center; padding-left: 0; }
}
/* horizontal */
.wks-tl__nav { display: flex; justify-content: flex-end; gap: 8px; margin-bottom: 10px; }
.wks-tl--h .wks-tl__track { display: flex; gap: 0; overflow-x: auto; scroll-snap-type: x proximity; padding: 28px 4px 12px; }
.wks-tl--h .wks-tl__track::before { content: ""; position: absolute; left: 0; right: 0; top: 36px; height: 3px; background: var(--wks-line); }
.wks-tl--h .wks-tl__group { display: flex; flex: none; gap: 18px; padding-right: 18px; align-items: flex-start; flex-wrap: nowrap; position: relative; }
.wks-tl--h .wks-tl__era { position: absolute; top: -26px; left: 0; margin: 0; white-space: nowrap; }
.wks-tl--h .wks-tl__item { position: relative; flex: none; width: 260px; padding-top: 28px; scroll-snap-align: start; }
.wks-tl--h .wks-tl__dot { top: 0; left: 0; }
/* reveal */
.wks-tl.is-anim .wks-tl__item { opacity: 0; transform: translateY(24px); transition: opacity .6s ease, transform .6s ease; }
.wks-tl.is-anim .wks-tl__item.is-in { opacity: 1; transform: none; }
