/* Announcement Bar — design.md §14.1 */
.announcement-bar {
  height: 40px;
  background: var(--color-neutral-ink);
  color: var(--color-neutral-50);
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
}

.announcement-bar[hidden] { display: none; }

.announcement-bar__message {
  font-family: var(--font-label);
  font-size: var(--type-label-size);
  font-weight: 500;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  text-align: center;
  padding-inline: var(--space-12);
  opacity: 1;
  transition: opacity 300ms var(--easing-standard); /* 300ms crossfade per §14.1 */
}

.announcement-bar__message--fading { opacity: 0; }

.announcement-bar__close {
  position: absolute;
  right: var(--space-2);
  top: 50%;
  transform: translateY(-50%);
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  color: var(--color-neutral-50);
  border-radius: var(--radius-full);
}

.announcement-bar__close:hover { color: var(--accent-gold); }