/* photo — one full-bleed image, flush, screened by the tonality. */

/* The plate is always in the markup, so the PICTURE is the condition. */
.sk-component[data-sk="photo"]:has(> .sk-photo-media > .sk-art:not([src=""])) {
  margin-block-start: calc(-1 * var(--sk-chrome-clear, 0px));
  --sk-chrome-member-stage: var(--sk-chrome-row-stage);
  --sk-chrome-ground: media;
}

.sk-photo {
  padding-block: 0;
}
/* The crop WINDOW (.sk-crop: the shared tier owns cover and true focal inside). */
.sk-photo-media {
  width: 100%;
  /* svh, not vh: stable under the mobile URL bar. */
  height: calc(var(--sk-photo-h, 46) * 1svh);
}
/* Boundary rule: the plate stands square; a bounded row's clip owns the corner. */
.sk-photo .sk-photo-media {
  --sk-media-radius: 0;
}

/* A fixed crop instead of a viewport ratio: a letterbox plate holds its
 * proportions on every display. */
.sk-photo:not([data-aspect="none"], [data-aspect=""]) .sk-photo-media {
  height: auto;
}
/* "none" leaves the token invalid, so the declaration falls back. */
.sk-photo[data-aspect] .sk-photo-media {
  aspect-ratio: var(--sk-aspect);
}
