CSS no longer works: 'missing opening `{`'

This used to work, what I want to achieve is:

Image Galleries:

- 100% solid white background

- Centred captions

- 80% Smaller captions

- Captions separated lines with 'shift/return'

Below I am posting all my custom CSS in case there's an error somewhere else causing the problem, thanks!

/* Hide Cart When Empty */
.cart-quantity-zero {
  display: none !important;
}

  .products.collection-content-wrapper .nested-category-children::after {
  
    all: unset;
    
    }

@media screen and { ( min-width: 576px ) }


/* Lightbox opacity */
.gallery-lightbox-background {
    opacity: 1.0;
}


p {
text-decoration: none !important
}

}
/* center gallery caption */
p.gallery-caption-content {
    text-align: center;
}

p.gallery-caption-content {
  font-size: 80% !important;
}
.gallery-grid-item .gallery-caption-content {
white-space:pre;
}