/* Reference-specific interaction timings; no continuous decorative movement added. */
.hero-index.motion-directory{--curve-start:14ch;position:relative;display:grid;grid-template-rows:repeat(var(--directory-rows),minmax(0,1fr));padding:4px;font:300 11px/15px var(--mono);isolation:isolate}.motion-directory .directory-curve{position:absolute;left:calc(4px + var(--curve-start));right:11px;top:4px;width:calc(100% - var(--curve-start) - 15px);height:calc(100% - 8px);overflow:visible;pointer-events:none;z-index:-1}.directory-curve path{stroke:#ffffff17;stroke-width:.6;fill:none}.hero-index.motion-directory a{position:relative;display:grid;grid-template-columns:minmax(max-content,var(--number-x)) minmax(0,1fr);align-items:center;height:100%;transition:grid-template-columns .18s cubic-bezier(.16,1,.3,1)}.hero-index.motion-directory a span{justify-self:start;position:relative;padding-right:8px;transform:none;z-index:1}.hero-index.motion-directory a small{justify-self:start;position:relative;padding-right:6px;z-index:1;transition:color .18s}.hero-index.motion-directory a::before,.hero-index.motion-directory a::after{content:'';position:absolute;top:50%;pointer-events:none;background:#ffffff4d;opacity:0}.hero-index.motion-directory a::before{left:0;width:var(--curve-x);height:1px;scale:1 .4;translate:0 -50%}.hero-index.motion-directory a:last-child::before{display:none}.hero-index.motion-directory a::after{left:var(--curve-x);width:1px;height:var(--guide-length);scale:.4 1;transform-origin:top;translate:-50% 0}.motion-directory .curve-point{position:absolute;left:var(--curve-x);top:50%;width:2px;height:2px;background:#ffffff99;opacity:0;translate:-50% -50%}.hero-index.motion-directory a:is(:hover,:focus-visible){grid-template-columns:minmax(max-content,0) minmax(0,1fr)}.hero-index.motion-directory a:is(:hover,:focus-visible) span{text-decoration:underline;text-underline-offset:3px;background:var(--blue);transform:none}.hero-index.motion-directory a:is(:hover,:focus-visible) small{color:white;background:var(--blue)}.hero-index.motion-directory a:is(:hover,:focus-visible)::before,.hero-index.motion-directory a:is(:hover,:focus-visible)::after,.hero-index.motion-directory a:is(:hover,:focus-visible) .curve-point{opacity:1}
/* Year labels are lit from three signal points, preserving their text semantics. */
h2.motion-signal{position:relative;color:transparent;-webkit-text-stroke:1px #ffffff66;isolation:isolate}h2.motion-signal::after{content:attr(data-signal);position:absolute;inset:0;color:white;-webkit-text-stroke:0;pointer-events:none;mask-image:radial-gradient(ellipse at center,#000 64%,transparent 65%),radial-gradient(ellipse at center,#000 64%,transparent 65%),radial-gradient(ellipse at center,#000 64%,transparent 65%);mask-position:19% 58%,48% 58%,79% 58%;mask-size:0 0,0 0,0 0;mask-repeat:no-repeat}h2.motion-signal.signal-revealed::after{animation:timeline-signal-fill .84s cubic-bezier(.16,1,.3,1) .16s both}.title-signal-nodes{position:absolute;inset:0;pointer-events:none}.title-signal-nodes i{position:absolute;left:var(--signal-x);top:58%;width:3px;height:3px;background:white;opacity:0;translate:-50% -50%}.title-signal-nodes i::before{content:'';position:absolute;right:0;top:1px;width:130px;height:1px;background:linear-gradient(90deg,transparent,#ffffffcc);transform-origin:right;scale:0 1}.signal-revealed .title-signal-nodes i{animation:timeline-signal-node .68s linear var(--signal-delay) both}.signal-revealed .title-signal-nodes i::before{animation:timeline-signal-wire .68s cubic-bezier(.16,1,.3,1) var(--signal-delay) both}@keyframes timeline-signal-fill{from{mask-size:0 0,0 0,0 0}to{mask-size:150% 360%,150% 360%,150% 360%}}@keyframes timeline-signal-node{0%{opacity:0}20%,55%{opacity:1}100%{opacity:0}}@keyframes timeline-signal-wire{0%{scale:0 1;opacity:0}30%{scale:1 1;opacity:1}100%{scale:1 1;opacity:0}}
/* The source uses an ink layer: quick arrival, slower departure. */
.open-event{position:relative;isolation:isolate;overflow:hidden}.open-event::before{content:'';position:absolute;inset:0;border-radius:inherit;background:#000;opacity:0;z-index:-1;transition:opacity .35s cubic-bezier(.215,.61,.355,1)}.open-event:is(:hover,:focus-visible,:active){background:#020819a0;color:white}.open-event:is(:hover,:focus-visible,:active)::before{opacity:1;transition-duration:.15s}.chronology-card{transition:border-color .35s cubic-bezier(.215,.61,.355,1),background-color .35s cubic-bezier(.215,.61,.355,1)}.chronology-card:is(:hover,:focus-within){border-color:#ffffff50;background-color:#ffffff0d;transition-duration:.15s}.chronology-card .event-dot{transition:background-color .15s,box-shadow .15s}.chronology-card:is(:hover,:focus-within) .event-dot{background:white;box-shadow:0 0 0 3px #ffffff16}.chronology-card .feature-media::after{transition:opacity .35s cubic-bezier(.215,.61,.355,1)}.chronology-card:is(:hover,:focus-within) .feature-media::after{transition-duration:.15s}.chronology-card .feature-media>img{transition:none}.chronology-card:hover .feature-media>img{transform:none}.type-tag span{display:inline-block;transition:translate .18s cubic-bezier(.16,1,.3,1)}.type-tag:is(:hover,:focus-visible) span{translate:2px -2px}
#reading-wires .wire-flow{stroke-dasharray:3 97;animation:timeline-wire-flow 4s linear infinite;stroke-width:1.25px}#reading-wires .wire-flow:nth-child(4n){animation-delay:-2s}@keyframes timeline-wire-flow{from{stroke-dashoffset:3;opacity:0}15%,75%{opacity:.8}to{stroke-dashoffset:-97;opacity:0}}
#search[open]{animation:timeline-search-in .2s cubic-bezier(0,0,.2,1) both}#event-detail[open]{animation:timeline-detail-in .24s cubic-bezier(.16,1,.3,1) both}#menu[open]{animation:timeline-panel-in .26s cubic-bezier(.16,1,.3,1) both}dialog[open]::backdrop{animation:timeline-backdrop-in .2s ease-out both}@keyframes timeline-search-in{from{translate:-12% 0;opacity:0;clip-path:inset(0 100% 0 0)}to{translate:0 0;opacity:1;clip-path:inset(0)}}@keyframes timeline-detail-in{from{opacity:0;translate:0 12px}to{opacity:1;translate:0 0}}@keyframes timeline-panel-in{from{opacity:0;clip-path:inset(0 0 100% 0)}to{opacity:1;clip-path:inset(0)}}@keyframes timeline-backdrop-in{from{opacity:0}to{opacity:1}}
#menu-links{position:relative;isolation:isolate}#menu-links a{position:relative;z-index:1}#menu-links a>span,#menu-links a>small{position:relative;z-index:2}#menu-links a>span{background:var(--surface)}#menu-links a>small{font-size:10px}.menu-wires{display:none;position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}.menu-wires path{fill:none;stroke:#ffffff5c;stroke-width:.75;stroke-dasharray:1 1;animation:timeline-menu-wire .3s cubic-bezier(.33,1,.68,1) var(--menu-delay,0s) both}.menu-wires rect{fill:#fff;animation:timeline-menu-dot .3s linear var(--menu-delay,0s) both}.menu-wires circle{fill:var(--surface);stroke:white;stroke-width:.75}@keyframes timeline-menu-wire{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}@keyframes timeline-menu-dot{from{opacity:0}to{opacity:1}}@keyframes timeline-menu-title{from{clip-path:inset(0 0 0 100%)}to{clip-path:inset(0)}}
@media(max-width:940px){#menu{inset:0;width:100%;height:100svh;max-height:none;max-width:none;margin:0;border:0;overflow:auto;background:var(--surface)}#menu[open]{display:flex;flex-direction:column}#menu .dialog-top{min-height:60px;flex-shrink:0;background:var(--surface)}#menu .menu-search{flex-shrink:0;margin-top:14px;margin-bottom:0}#menu-links{display:flex;flex-direction:column;align-items:flex-end;justify-content:center;flex:1;gap:0;margin:0;padding:24px 24px 24px 64px;min-height:360px;overflow:visible}#menu-links a{border:0;display:flex;flex-direction:column;align-items:flex-end;justify-content:center;padding:9px 0;min-height:52px;width:100%;font-size:31px;line-height:1.05;letter-spacing:-.04em}#menu-links a>span{padding-left:10px}#menu-links a>small{font-size:9px;line-height:1.8;background:var(--surface);padding-left:10px;opacity:.6}#menu[open] #menu-links a>span,#menu[open] #menu-links a>small{animation:timeline-menu-title .22s cubic-bezier(.33,1,.68,1) var(--menu-delay,.2s) both}#menu .menu-atlas{flex-shrink:0;margin:12px 24px 22px;font-size:10px;line-height:1.8}.menu-wires{display:block}#search[open]{animation-name:timeline-search-in}#event-detail[open]{animation-duration:.2s}}
/* Pause means immediately readable; it never strands text in an intermediate mask. */
.motion-disabled .motion-signal,.paused .motion-signal{color:white;-webkit-text-stroke:0}.motion-disabled .motion-signal::after,.paused .motion-signal::after{mask:none;animation:none}.motion-disabled .title-signal-nodes,.paused .title-signal-nodes{display:none}.motion-disabled .wire-flow,.paused .wire-flow{animation:none!important;opacity:0}.motion-disabled dialog[open],.paused dialog[open],.motion-disabled dialog[open]::backdrop,.paused dialog[open]::backdrop{animation:none;translate:none;clip-path:none;opacity:1}.motion-disabled #menu-links a>span,.motion-disabled #menu-links a>small,.paused #menu-links a>span,.paused #menu-links a>small{animation:none!important;clip-path:none}.motion-disabled .menu-wires path,.paused .menu-wires path{animation:none;stroke-dashoffset:0}.motion-disabled .menu-wires rect,.paused .menu-wires rect{animation:none;opacity:1}.motion-disabled .hero-index a,.motion-disabled .open-event::before,.paused .hero-index a,.paused .open-event::before{transition:none}
@media(prefers-reduced-motion:reduce){.motion-signal{color:white!important;-webkit-text-stroke:0!important}.motion-signal::after{mask:none!important;animation:none!important}.title-signal-nodes{display:none}.wire-flow{animation:none!important;opacity:0!important}dialog[open],dialog[open]::backdrop,#menu-links a>span,#menu-links a>small{animation:none!important;translate:none!important;clip-path:none!important;opacity:1!important}.menu-wires path{animation:none!important;stroke-dashoffset:0!important}.menu-wires rect{animation:none!important;opacity:1!important}.hero-index a,.open-event::before,.type-tag span{transition:none!important}}
