.nearby-routes-mobile{margin-block:var(--spacing-xl);padding-inline:var(--spacing-md)}.nearby-routes-mobile__label{font-weight:var(--font-weight-semibold);margin-bottom:var(--spacing-sm);font-size:var(--font-size-md);color:var(--color-text-primary)}.heading-md{font-size:var(--font-size-xl);margin-bottom:var(--space-md);color:var(--gray-900);font-weight:var(--font-weight-bold)}.nearby-routes-mobile__map-wrapper{position:relative;border-radius:var(--radius-md);overflow:hidden;height:300px;cursor:pointer;background-color:var(--color-surface-subtle)}.nearby-routes-mobile__map-wrapper.locked .mapboxgl-canvas{pointer-events:none;filter:grayscale(.6)}.nearby-routes-mobile__map-canvas{width:100%;height:100%}.nearby-routes-mobile__button{position:absolute;bottom:var(--spacing-sm);right:var(--spacing-sm);border:none;padding:var(--spacing-xs) var(--spacing-sm);z-index:10;cursor:pointer}.nearby-routes-mobile__button,.popup-content{background:var(--color-surface-default);color:var(--color-text-primary);border-radius:var(--radius-sm);font-size:var(--font-size-sm);box-shadow:var(--shadow-sm)}.popup-content{font-family:var(--font-family-sans);padding:var(--spacing-sm);line-height:1.4;max-width:200px}.popup-subtext{color:var(--color-text-secondary);font-size:var(--font-size-xs);margin-top:4px}.mobile-save-bar{position:fixed;bottom:0;left:0;width:100%;padding:var(--space-md);background-color:var(--white);box-shadow:var(--shadow-md);display:flex;justify-content:space-between;z-index:1000;gap:var(--space-sm)}@media (min-width:768px){.mobile-save-bar{display:none}}.join-btn{flex:1 1;height:var(--height-sm);font-size:var(--font-size-md);font-weight:var(--font-weight-bold);color:var(--white);background-color:var(--primary-800);border:none;border-radius:var(--radius-md);cursor:pointer;transition:opacity .2s ease}.join-btn:hover{opacity:var(--opacity-80)}.group-client-skeleton{display:flex;flex-wrap:wrap;max-width:1400;margin:0 auto}.skeleton-card{background-color:var(--gray-100);border-radius:var(--radius-md);display:flex;flex-direction:column;gap:var(--space-lg)}.skeleton-labels,.skeleton-section{display:flex;gap:var(--space-sm)}.skeleton-section{flex-direction:column}@media (max-width:768px){.group-client-skeleton{flex-direction:column}}