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

.sk-photo {
  padding-block: 0;
}
/* The media BOX (.sk-media — base.css owns cover + true-focal inside). */
.sk-photo-media {
  width: 100%;
  /* The `height` prop stamps --sk-photo-h inline on the section root
   * (a bare vh count): the band is a RATIO of the viewport, never a pixel
   * value, so the breathing room scales with every display. svh, not vh —
   * stable under the mobile URL bar (the kit height axis's own posture).
   * Absent (a sidecar omitting the prop), the band rests at 46. */
  height: calc(var(--sk-photo-h, 46) * 1svh);
}
/* Boundary rule: flush = full-bleed, unbounded → square. */
.sk-photo:not([data-inset="page"]) .sk-photo-media {
  --sk-media-radius: 0;
}

/* The ASPECT axis — a fixed crop instead of a viewport ratio. A letterbox
 * plate must hold its proportions (a 21:9 photograph is 21:9 on every
 * display); only a full-bleed statement band wants to be a share of the
 * viewport. Set, the ratio wins: height goes auto so the aspect governs. */
.sk-photo:not([data-aspect="none"], [data-aspect=""]) .sk-photo-media {
  height: auto;
}
/* The ratio itself comes from base.css's ASPECT TOKEN TABLE (--sk-aspect,
 * resolved on the root the attribute rides); "none"/"" leave the token
 * auto/invalid, so the declaration falls back to auto exactly as the old
 * unmatched arms did. */
.sk-photo[data-aspect] .sk-photo-media {
  aspect-ratio: var(--sk-aspect);
}