/* demo steps (05.11, chosen from ?steps tests): story segments, one track per step above the words; past ones stay filled */
html .feat .steps .step span{opacity:1;text-shadow:none}
html .feat .steps{border-bottom:0;padding:0}
html .feat .steps .step{position:relative;flex-direction:row;align-items:baseline;justify-content:flex-start;text-align:left;gap:8px;padding:16px 10px 0 0;color:var(--t3,#6f6f6c);background:none}
html .feat .steps .step::before{content:"";position:absolute;left:0;right:10px;top:0;height:3px;border-radius:2px;background:#ffffff1c}
html .feat .steps .step:has(~ .step.on)::before{background:#e6e6e4}
html .feat .steps .step span{color:inherit;background:none}
html .feat .steps .step.on{color:var(--t1,#f4f4f2)}
html .feat .steps::before{top:0;bottom:auto;height:3px;border-radius:2px;box-shadow:none;background:linear-gradient(90deg,#f4f4f2 calc(100% - 10px),#0000 0)}
@media (max-width:900px){html .feat .steps .step{justify-content:center;text-align:center;flex-direction:column;align-items:center;gap:4px;padding:16px 5px 0}html .feat .steps .step::before{left:5px;right:5px}html .feat .steps::before{background:linear-gradient(90deg,#0000 5px,#f4f4f2 5px calc(100% - 5px),#0000 0)}}
html .feat .notes{margin-top:24px}