/* Shared identity: SVG outlines, a separate wheel, and no layout motion. */
a.jr-logo { display: inline-flex; align-items: center; gap: 12px; width: fit-content; max-width: 100%; padding: 8px 0; flex-shrink: 0; text-decoration: none; }
a.jr-logo .jr-wheel { width: 34px; height: 34px; flex: none; transform-origin: center; }
a.jr-logo picture { display: block; min-width: 0; }
a.jr-logo .jr-wordmark { display: block; width: 184px; max-width: 100%; height: auto; }
a.jr-logo.is-rolling .jr-wheel { animation: jr-roll 560ms cubic-bezier(.2,0,0,1); }
@keyframes jr-roll { 0%,100% { transform: translateX(0) rotate(0); } 65% { transform: translateX(2.55px) rotate(8.6deg); } 85% { transform: translateX(-.54px) rotate(-1.8deg); } }
/* Arriving: once a visit, on a page without a ride, the wheel rolls in from the
   left and parks; 18 px of road turns a 34 px wheel 60.7 degrees. */
a.jr-logo.is-arriving .jr-wheel { animation: jr-arrive 700ms cubic-bezier(.2,.7,.25,1) both; }
@keyframes jr-arrive { 0% { transform: translateX(-18px) rotate(-60.7deg); opacity: 0; } 65% { transform: translateX(1.5px) rotate(5deg); opacity: 1; } 100% { transform: translateX(0) rotate(0); opacity: 1; } }
@media(prefers-reduced-motion: reduce) { a.jr-logo.is-rolling .jr-wheel, a.jr-logo.is-arriving .jr-wheel { animation: none; } }