/* ============================================================
   COMPONENT · FLASH
   The notice/alert banner every layout renders above <main>.
   A slim, centred strip (constrained to the content width) in
   the Birren safety palette — green for notices, red for alerts.
   ============================================================ */

.flash {
  --flash-color: var(--color-info);

  width: 100%;
  max-width: var(--container-wide);
  margin: var(--space-4) auto 0;
  padding: var(--space-3) var(--space-4);
  font-family: var(--font-data);
  font-size: var(--fs-sm);
  color: var(--color-text);
  background: color-mix(in srgb, var(--flash-color) 10%, var(--color-surface));
  border-left: 4px solid var(--flash-color);
  border-radius: var(--radius-xs);
  box-shadow: var(--seam-embossed);
}

.flash--notice { --flash-color: var(--color-ok); }
.flash--alert  { --flash-color: var(--color-danger); }