/* Shared reading and action layouts. Loaded first so legacy !important page
   resets cannot override the explicit component contract. No navigation rules. */
@layer comemso-reading-layout-v196 {
  html body.cmo-design-system #main-content [data-design-card-layout="reading"] {
    display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:24px!important;align-items:stretch!important;
  }
  html body.cmo-design-system #main-content [data-design-card-layout="reading"] > * {
    min-width:0!important;height:auto!important;min-height:0!important;
  }
  html body.cmo-design-system #main-content [data-design-actions-layout="stacked"] {
    display:flex!important;flex-direction:column!important;flex-wrap:nowrap!important;
    align-items:stretch!important;gap:12px!important;width:fit-content!important;max-width:100%!important;
  }
  html body.cmo-design-system #main-content [data-design-actions-layout="stacked"] > :is(a,button) {
    display:flex!important;align-items:center!important;justify-content:center!important;
    box-sizing:border-box!important;flex:0 0 auto!important;align-self:stretch!important;
    width:100%!important;min-width:0!important;max-width:100%!important;
    margin-inline:0!important;white-space:normal!important;text-align:center!important;
  }
  /* Hero groups retain the copy column; the two actions have one common width. */
  html body.cmo-design-system #main-content [data-home-stage] [data-design-actions-layout="stacked"] {
    width:100%!important;max-width:32rem!important;margin-top:auto!important;
  }
  html body.cmo-design-system #main-content [data-field-photo] {
    display:block!important;position:relative!important;height:auto!important;min-height:0!important;
    max-height:none!important;aspect-ratio:auto!important;padding:0!important;
  }
  html body.cmo-design-system #main-content [data-field-photo] :is(picture,img) {
    display:block!important;position:static!important;inset:auto!important;
    width:100%!important;max-width:100%!important;height:auto!important;min-height:0!important;
    max-height:none!important;aspect-ratio:auto!important;object-fit:contain!important;
    object-position:center!important;padding:0!important;margin:0!important;transform:none!important;
  }
  html body.cmo-design-system #main-content [data-field-photo="portrait"] {
    width:100%!important;max-width:480px!important;margin:32px auto 0!important;
  }
  html body.cmo-design-system #main-content [data-field-photo] figcaption {
    position:static!important;display:block!important;margin-top:12px!important;
  }
  html body.cmo-design-system #main-content [data-design-media-width="full"] {
    display:block!important;width:100%!important;max-width:none!important;
  }
  html body.cmo-design-system #main-content [data-design-media-width="full"] img {
    display:block!important;width:100%!important;max-width:1120px!important;height:auto!important;
    object-fit:contain!important;margin-inline:auto!important;
  }
  @media(min-width:1100px) {
    html body.cmo-design-system #main-content [data-home-stage] [data-design-actions-layout="stacked"] {max-width:46%!important}
  }
  @media(max-width:760px) {
    html body.cmo-design-system #main-content [data-design-card-layout="reading"] {grid-template-columns:minmax(0,1fr)!important}
  }
  @media(max-width:600px) {
    html body.cmo-design-system #main-content :is([data-design-actions],.cmo-button-row,.hero-actions,.actions,.config-result__buttons):not(.cmo-home-carousel-navigation) {
      flex-direction:column!important;flex-wrap:nowrap!important;
      align-items:stretch!important;max-width:100%!important;
    }
    html body.cmo-design-system #main-content :is([data-design-actions],.cmo-button-row,.hero-actions,.actions,.config-result__buttons):not(.cmo-home-carousel-navigation) > :is(a,button) {
      box-sizing:border-box!important;flex:0 0 auto!important;align-self:stretch!important;
      width:100%!important;min-width:0!important;max-width:100%!important;margin-inline:0!important;
    }
  }
}