/* "Not screens. Decisions." — one order through eight screens, as a vertical timeline (mobile only) */
.m-jr{margin-top:22px}

/* sticky order tracker: status follows the step in view */
.m-jr-track{position:sticky;top:calc(var(--head-h) + 8px);z-index:5;display:flex;align-items:center;gap:10px;flex-wrap:wrap;
  padding:10px 14px;margin-bottom:18px;border:1px solid var(--line2);border-radius:999px;
  background:rgba(10,16,32,.86);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.m-jr-oid{font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;color:var(--fg3)}
.m-jr-oid b{color:var(--ink);font-weight:500}
.m-jr-st{font-family:var(--mono);font-size:.68rem;letter-spacing:.06em;text-transform:uppercase;color:var(--sc,var(--teal));transition:color .4s}
.m-jr-st::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;margin-right:7px;vertical-align:1px;
  background:currentColor;box-shadow:0 0 8px currentColor}
.m-jr-bar{flex:1 1 60px;height:3px;border-radius:3px;background:var(--line2);overflow:hidden}
.m-jr-bar i{display:block;height:100%;width:12.5%;border-radius:3px;background:var(--sc,var(--teal));box-shadow:0 0 8px var(--sc,var(--teal));transition:width .5s cubic-bezier(.2,.7,.2,1),background .4s}

/* timeline */
.m-jr-list{list-style:none;margin:0;padding:0;position:relative}
.m-jr-list::before{content:"";position:absolute;left:15px;top:8px;bottom:8px;width:1.5px;background:var(--line2)}
.m-jr-step{position:relative;display:grid;grid-template-columns:32px 1fr;gap:12px;align-items:start}
.m-jr-step + .m-jr-step{margin-top:12px}
.m-jr-node{position:relative;z-index:1;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;margin-top:12px;
  background:var(--bg);border:1.5px solid var(--line2);font-family:var(--mono);font-size:.66rem;color:var(--fg3);transition:.4s}
.m-jr-step.is-done .m-jr-node{border-color:var(--sc);color:var(--sc)}
.m-jr-step.is-on .m-jr-node{background:var(--sc);border-color:var(--sc);color:#04121A;box-shadow:0 0 16px -2px var(--sc)}

.m-jr-card{padding:16px 16px 18px;border:1px solid var(--line);border-radius:var(--rad-sm);background:var(--surface);transition:border-color .4s,background .4s,box-shadow .4s}
.m-jr-step.is-on .m-jr-card{border-color:color-mix(in srgb,var(--sc) 45%,transparent);background:var(--surface2);
  box-shadow:0 18px 40px -26px var(--sc)}
/* screen label is the primary heading of each card */
.m-jr-kick{display:inline-flex;align-items:center;gap:7px;font-family:var(--mono);font-size:.68rem;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
  color:var(--sc);padding:6px 11px;margin-bottom:12px;border-radius:8px;
  background:color-mix(in srgb,var(--sc) 12%,transparent);border:1px solid color-mix(in srgb,var(--sc) 35%,transparent);
  text-shadow:0 0 12px color-mix(in srgb,var(--sc) 55%,transparent)}
.m-jr-kick::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor;flex:none}
.m-jr-card h3{font-family:var(--serif);font-weight:400;font-size:1.28rem;line-height:1.22;letter-spacing:-.01em;color:var(--ink);margin:0 0 8px}
.m-jr-card p{font-family:var(--sans);font-weight:400;font-size:.9rem;line-height:1.62;color:var(--fg2);margin:0}
@media(prefers-reduced-motion:reduce){.m-jr-node,.m-jr-card,.m-jr-bar i{transition:none}}
