/* AEM feature 04 · aligned preview workflow + primary mobile experience.
   Recompose the existing ImageGen devices in CSS crop windows; labels remain
   native text. Preserve the original shared background and bottom shading. */
.adobe-aem__visual.aem-channels {
  position:relative;container:adobe-channels / inline-size;isolation:isolate;
  color:var(--wy-g700);font-family:var(--wy-font-cn);line-height:1.4;
  text-align:left;letter-spacing:normal;
}
.aem-channels::after {
  content:"";position:absolute;inset-inline:0;inset-block-end:0;block-size:14%;
  z-index:0;pointer-events:none;
  background:linear-gradient(0deg,rgba(22,22,27,.07),rgba(22,22,27,.025) 45%,transparent);
}
.aem-channels__scene { position:absolute;inset:0;z-index:1; }
.aem-channels__scene *,.aem-channels__scene *::before,.aem-channels__scene *::after { box-sizing:border-box; }
.aem-channels__responsive,.aem-channels__devices,.aem-channels__publish {
  position:absolute;border:1px solid color-mix(in srgb,var(--wy-blue-light) 32%,var(--wy-g100));
  border-radius:1.9231cqw;background:var(--wy-g0);
  box-shadow:0 .9615cqw 2.8846cqw -1.4423cqw color-mix(in srgb,var(--wy-blue-dark) 14%,transparent);
}
.aem-channels__responsive,.aem-channels__publish {
  display:flex;align-items:center;justify-content:center;gap:1.4423cqw;
  padding:.9615cqw 1.9231cqw;color:var(--wy-ink);font-size:2.1635cqw;white-space:nowrap;
}
.aem-channels__responsive { inset-inline-start:5.7692cqw;inset-block-start:7.6923cqw;inline-size:25cqw;block-size:6.7308cqw; }
.adobe-aem__visual .aem-channels__responsive > svg,.adobe-aem__visual .aem-channels__publish > svg {
  flex:none;inline-size:3.3654cqw;block-size:3.3654cqw;
  fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;
}
.aem-channels__devices { inset-inline-start:5.7692cqw;inset-block-start:18.2692cqw;inline-size:50.9615cqw;block-size:27.8846cqw;padding:1.9231cqw; }
.aem-channels__devices-title { display:block;margin-block-end:1.9231cqw;color:var(--wy-ink);font-size:2.1635cqw;font-weight:500;line-height:1.4;white-space:nowrap; }
/* Source crop: x96 y348 w790 h292 of the unmodified 1586 × 992 alpha PNG. */
.aem-channels__previews { position:relative;inline-size:100%;aspect-ratio:790/292;overflow:hidden; }
.aem-channels__previews > img {
  position:absolute;display:block;inline-size:200.7595%;block-size:auto;max-inline-size:none;
  left:-12.1519%;inset-block-start:-119.1781%;
  margin:0;padding:0;border:0;border-radius:0;
}
.aem-channels__publish { inset-inline-start:36.5385cqw;inset-block-start:49.0385cqw;inline-size:20.1923cqw;block-size:6.7308cqw; }
.aem-channels__cursor {
  position:absolute;z-index:3;inset-inline-start:50.9615cqw;inset-block-start:53.8462cqw;
  inline-size:5.0481cqw;block-size:6.0096cqw;filter:drop-shadow(0 .2404cqw .2404cqw rgba(22,22,27,.15));
}
.adobe-aem__visual .aem-channels__cursor svg { inline-size:100%;block-size:100%;overflow:visible; }
/* Source crop: x920 y0 w552 h992; the primary phone keeps its approved bleed. */
.aem-channels__phone { position:absolute;inset-inline-start:62.5cqw;inset-block-start:5.7692cqw;inline-size:31.7308cqw;block-size:56.7308cqw;overflow:hidden; }
.aem-channels__phone > img {
  position:absolute;display:block;inline-size:287.3188%;block-size:auto;max-inline-size:none;
  left:-166.6667%;inset-block-start:0;margin:0;padding:0;border:0;border-radius:0;
}
