/* HYPATIUS in-page motion · v1 · base layer. Every rule is scoped to html.mx-on, so without the
   script the page shows its finished state. Brand timing comes from --mx-ease, --mx-dur, --mx-y. */
.mx-on .mx-reveal{opacity:0;transform:translateY(var(--mx-y));transition:opacity var(--mx-dur) var(--mx-ease),transform var(--mx-dur) var(--mx-ease)}
.mx-on .mx-reveal.mx-in{opacity:1;transform:none}
.mx-fill{transform-origin:left center}
.mx-on [data-mx="bars"] .mx-fill{transform:scaleX(0);transition:transform calc(var(--mx-dur) * 2.4) var(--mx-ease);transition-delay:inherit}
.mx-on [data-mx="bars"].mx-in .mx-fill{transform:scaleX(1)}
.mx-on [data-mx="bars"] .mx-late{opacity:0;transition:opacity var(--mx-dur) var(--mx-ease);transition-delay:inherit}
.mx-on [data-mx="bars"].mx-in .mx-late{opacity:1;transition-delay:calc(var(--mx-dur) * 2)}
.mx-on [data-mx="rows"]>*{opacity:0;transform:translateY(var(--mx-y));transition:opacity var(--mx-dur) var(--mx-ease),transform var(--mx-dur) var(--mx-ease)}
.mx-on [data-mx="rows"].mx-in>*{opacity:1;transform:none}
[data-mx="steps"] [data-mx-step]{cursor:pointer}
[data-mx="steps"] [data-mx-step]:focus-visible{outline:2px solid currentColor;outline-offset:3px}
[data-mx-progress]{--p:0}
.mx-still *{transition:none!important;animation:none!important}

/* ── CRATON · walkthrough timeline. One settled colour (slate), one live colour (bronze, with the
   45° hatch and a word). Plays once, then holds. No bounce, no loop. */
.mx-walk{margin-top:8px}
.mx-tl{position:relative;margin:0 0 28px;padding-top:14px}
.mx-tl ol{list-style:none;display:flex;gap:4px;margin:0;padding:0}
.mx-tl__s{display:grid;gap:8px;min-width:0}
.mx-tl__bar{height:8px;background:repeating-linear-gradient(90deg,var(--surface-raised,#2C3744) 0 6px,transparent 6px 8px)}
.mx-tl__t{font:500 11px var(--t-mono,'IBM Plex Mono',monospace);letter-spacing:.2em;color:var(--cr-bed-bronze,#B08D57)}
.mx-tl__n{font:500 15px var(--font-interface,'Rajdhani',sans-serif);color:var(--cr-bed-muted,#9CA6B2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mx-tl__end{display:none}
.mx-tl__p{position:absolute;left:0;top:0;height:2px;width:calc(var(--p) * 100%);background:var(--cr-bed-bronze,#B08D57);opacity:0}
.mx-on .mx-walk.mx-in .mx-tl__p{opacity:1}
.mx-on .mx-walk.mx-in .mx-tl__s{opacity:.55;transition:opacity var(--mx-dur) var(--mx-ease)}
.mx-on .mx-walk[data-mx-cur="0"] .mx-tl__s:nth-child(-n+1),.mx-on .mx-walk[data-mx-cur="1"] .mx-tl__s:nth-child(-n+2),
.mx-on .mx-walk[data-mx-cur="2"] .mx-tl__s:nth-child(-n+3),.mx-on .mx-walk[data-mx-cur="3"] .mx-tl__s:nth-child(-n+4){opacity:1}
.mx-on .mx-walk[data-mx-cur="0"] .mx-tl__s:nth-child(1) .mx-tl__bar,.mx-on .mx-walk[data-mx-cur="1"] .mx-tl__s:nth-child(2) .mx-tl__bar,
.mx-on .mx-walk[data-mx-cur="2"] .mx-tl__s:nth-child(3) .mx-tl__bar,.mx-on .mx-walk[data-mx-cur="3"] .mx-tl__s:nth-child(4) .mx-tl__bar{background:repeating-linear-gradient(135deg,var(--cr-bed-bronze,#B08D57) 0 2px,transparent 2px 6px)}
.mx-on .mx-walk[data-mx-cur="1"] .mx-tl__s:nth-child(1) .mx-tl__bar,.mx-on .mx-walk[data-mx-cur="2"] .mx-tl__s:nth-child(-n+2) .mx-tl__bar,
.mx-on .mx-walk[data-mx-cur="3"] .mx-tl__s:nth-child(-n+3) .mx-tl__bar,.mx-on .mx-walk.mx-end .mx-tl__s .mx-tl__bar{background:var(--cr-bed-slate,#7FA6B5)}
.mx-on .mx-walk.mx-in:not(.mx-end) .cr-spec__c{opacity:.55;transition:opacity var(--mx-dur) var(--mx-ease),box-shadow var(--mx-dur) var(--mx-ease)}
.mx-on .mx-walk.mx-in .cr-spec__c.mx-cur{opacity:1;box-shadow:inset 0 2px 0 var(--cr-bed-bronze,#B08D57)}
.mx-on .mx-walk.mx-in .cr-spec__c.mx-cur .cr-spec__n::after{content:" · now";color:var(--cr-bed-bronze-lt,#D9B985)}
.mx-on .mx-walk.mx-end .cr-spec__c.mx-cur .cr-spec__n::after{content:""}
@media (max-width:760px){.mx-tl__n{display:none}.mx-tl__end{display:none}}