.paths { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px; margin-top: 28px; }
.trail-pack { border: 2px solid var(--line); border-radius: 26px; padding: 24px 18px; }
.trail-head { padding-inline: 6px; }
.trail-head > * + * { margin-top: 8px; }
.trail-head p { font-size: 18px; }
.trail { list-style: none; padding: 24px 0 0; }
.trail li { position: relative; padding-block: 12px 18px; }
.trail li:not(:last-child)::after { content: ""; position: absolute; width: 44px; height: 52px; left: 32px; bottom: -26px; border: 4px solid var(--line); border-top: 0; border-bottom: 0; border-left: 0; border-radius: 0 40px 40px 0; pointer-events: none; }
.trail .turn-b:not(:last-child)::after { left: 32px; transform: scaleX(-1); }
.step { position: relative; z-index: 1; display: grid; grid-template-columns: 68px minmax(0,1fr) 20px; align-items: center; gap: 12px; padding: 9px 6px; border-radius: 18px; min-height: 86px; text-decoration: none; }
.step:hover { background: var(--tile); }
.node { width: 64px; height: 64px; border-radius: 50%; background: var(--blue); border: 2px solid var(--ink); box-shadow: 0 5px 0 var(--ink); display: grid; place-items: center; }
.turn-b .node { transform: translateX(10px); }
.dot { width: 20px; height: 20px; background: var(--paper); border: 3px solid var(--ink); border-radius: 7px; transform: rotate(-15deg); }
.trail-pack:first-child .node { background: var(--green); }
.trail-pack:nth-child(2) .node { background: var(--blue); }
.trail-pack:nth-child(3) .node { background: var(--yellow); }
.trail-pack:nth-child(4) .node { background: var(--orange); }
.step-copy { display: flex; flex-direction: column; gap: 5px; font-size: 16px; line-height: 1.4; }
.step-copy strong { font-size: 19px; line-height: 1.25; }
.arr { font-size: 22px; font-weight: 700; }
.home .paths { width: 100%; }
@media (min-width: 920px) {
  .home .lesson { display: block; }
  .home .jump { position: static; max-width: 680px; margin-bottom: 24px; }
  .home .answer:not(:has(.paths)) { max-width: 720px; }
  .home .notes { max-width: 720px; }
}
@media (max-width: 760px) {
  .paths { grid-template-columns: minmax(0, 1fr); }
  .trail-pack { padding: 20px 14px; }
  .step { grid-template-columns: 64px minmax(0,1fr) 18px; gap: 10px; }
  .node { width: 60px; height: 60px; }
  .step-copy strong { font-size: 18px; }
}