.route-nav{position:relative;max-width:62rem;margin:0 auto;padding:2rem clamp(1rem,5vw,3.5rem) 2.5rem;pointer-events:none;z-index:100}.route-hud{position:absolute;width:1.3rem;height:1.3rem;border:2px solid rgba(200,30,74,.6);pointer-events:none}.route-hud-tl{top:1rem;left:1rem;border-right:0;border-bottom:0}.route-hud-tr{top:1rem;right:1rem;border-left:0;border-bottom:0}.route-hud-bl{bottom:1rem;left:1rem;border-right:0;border-top:0}.route-hud-br{bottom:1rem;right:1rem;border-left:0;border-top:0}.route-sec{position:relative;display:flex;flex-direction:column;gap:1.1rem;pointer-events:none}.route-kicker{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.22em;text-transform:lowercase;color:var(--maroon-bright)}.route-track{position:relative;height:2.2rem;pointer-events:auto}.route-base{position:absolute;top:50%;left:0;right:0;height:1px;background:#ffffff24;transform:translateY(-50%)}.route-progress{position:absolute;top:50%;left:0;width:0;height:1px;background:linear-gradient(90deg,rgba(200,30,74,.35),var(--maroon-bright));transform:translateY(-50%);transition:width 1.1s var(--ease)}.route-light{position:absolute;top:50%;width:.5rem;height:.5rem;border-radius:50%;background:var(--maroon-bright);box-shadow:0 0 .7rem #c81e4acc,0 0 1.4rem #c81e4a73;transform:translate(-50%,-50%);opacity:0;transition:left 1.1s var(--ease),opacity .45s var(--ease);will-change:left;pointer-events:none}.route-track{display:flex;align-items:center;justify-content:space-between}.route-node{position:relative;display:inline-flex;align-items:center;gap:.55rem;text-decoration:none;color:#e8e8e880;font-family:var(--font-display);font-weight:500;font-size:clamp(.75rem,1.4vw,.95rem);letter-spacing:.04em;white-space:nowrap;transition:color .3s var(--ease);pointer-events:auto;z-index:2}.route-tick{width:clamp(.55rem,1.2vw,.7rem);height:clamp(.55rem,1.2vw,.7rem);border-radius:50%;border:1px solid rgba(255,255,255,.22);background:var(--black);box-shadow:inset 0 0 0 1px #ffffff14;transition:background .35s var(--ease),border-color .35s var(--ease),box-shadow .35s var(--ease),transform .35s var(--ease)}.route-node:hover .route-tick,.route-node:focus-visible .route-tick{border-color:var(--maroon-bright);transform:scale(1.2)}.route-node:hover .route-label,.route-node:focus-visible .route-label{color:var(--white);text-shadow:0 0 1.2rem rgba(200,30,74,.3)}.route-node:hover>.route-label,.route-node:focus-visible>.route-label{color:var(--white)}.route-node:focus-visible{outline:2px solid var(--cyan);outline-offset:3px;border-radius:5px}.route-node.is-current .route-tick{background:var(--maroon-bright);border-color:var(--maroon-bright);box-shadow:0 0 .7rem var(--maroon-bright),0 0 1.4rem #c81e4a99}.route-node.is-current .route-label{color:var(--white);text-shadow:0 0 1rem rgba(200,30,74,.4)}.route-node.is-visited .route-tick{background:#c81e4a59;border-color:#c81e4a8c;box-shadow:inset 0 0 0 1px #c81e4a33}.route-meta{position:absolute;right:0;bottom:.2rem;font-family:var(--font-mono);font-size:.72rem;letter-spacing:.14em;color:#e8e8e859;pointer-events:none}.route-nav{opacity:0;transform:translateY(.8rem);transition:opacity 1s var(--ease),transform 1s var(--ease)}.route-nav.is-visible{opacity:1;transform:translateY(0)}.route-nav.is-complete .route-base{background:linear-gradient(90deg,#c81e4a8c,#ffffff2e)}.route-nav.is-complete .route-node.is-visited .route-tick{background:#c81e4a80;border-color:#c81e4ab3;box-shadow:0 0 .45rem #c81e4a66}@media(prefers-reduced-motion:reduce){.route-nav{opacity:1;transform:none;transition:none!important}.route-light,.route-progress{transition:none!important}.route-light{opacity:0!important}.route-progress{display:none!important}}@media print{.route-nav{display:none}}@media(max-width:360px){.route-nav{padding-top:1.6rem;padding-bottom:2rem}.route-node{font-size:.68rem;gap:.4rem}.route-tick{width:.5rem;height:.5rem}}@media(max-width:480px){.route-node{font-size:.74rem;gap:.45rem}.route-tick{width:.55rem;height:.55rem}.route-track{gap:.6rem}}@media(min-width:481px)and (max-width:640px){.route-node{font-size:.8rem}.route-track{gap:.8rem}}@media(min-width:641px)and (max-width:768px){.route-node{font-size:.86rem}.route-track{gap:1rem}}@media(min-width:769px)and (max-width:1024px){.route-node{font-size:.9rem}.route-track{gap:1.2rem}}@media(min-width:1281px){.route-nav{max-width:70rem}}@media(min-width:1921px){.route-nav{max-width:80rem;padding:2.5rem 4rem 3rem}.route-node{font-size:1.05rem}.route-kicker{font-size:.8rem}.route-meta{font-size:.85rem}.route-tick{width:.85rem;height:.85rem}}