/* Retain the compact supporting heading after correcting its semantic level. */
.dn-form-context > h2{font-size:26px;line-height:1.2;letter-spacing:-.02em}
@media(max-width:640px){.dn-form-context > h2{font-size:25px}}

/* Keep the retained setup photograph on the article grid, with complete source framing. */
body main#content .dn17-story .dn-reader-body :is(#trial-setup,#zengcheng-setup) > .dn32-photo-pair:has(>figure:only-child){max-width:none}
body main#content .dn17-story .dn-reader-body :is(#trial-setup,#zengcheng-setup) > .dn32-photo-pair > figure:only-child img{width:100%!important;height:auto!important;aspect-ratio:auto!important;max-height:none!important;object-fit:contain!important}
@media(min-width:761px){
 body main#content .dn17-story .dn-reader-body #trial-setup{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto min-content minmax(0,1fr) auto;column-gap:28px;align-items:start}
 body main#content .dn17-story .dn-reader-body #trial-setup > h2,
 body main#content .dn17-story .dn-reader-body #trial-setup > details{grid-column:1/-1}
 body main#content .dn17-story .dn-reader-body #trial-setup > p{grid-column:1;margin-top:0!important}
 body main#content .dn17-story .dn-reader-body #trial-setup > p:nth-of-type(1){grid-row:2}
 body main#content .dn17-story .dn-reader-body #trial-setup > p:nth-of-type(2){grid-row:3}
 body main#content .dn17-story .dn-reader-body #trial-setup > .dn32-photo-pair{grid-column:2;grid-row:2/span 2;margin:0 0 24px!important}
}

@media(min-width:761px){
 body main#content .dn17-story .dn-reader-body #zengcheng-setup > .dn32-photo-pair > figure:only-child{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(210px,1fr);align-items:stretch}
 body main#content .dn17-story .dn-reader-body #zengcheng-setup > .dn32-photo-pair > figure:only-child figcaption{display:flex!important;justify-content:center;flex-direction:column;padding:28px!important;font-size:15px!important;line-height:1.65!important}
}

/* V83: mobile comparison uses the existing product cards and parameter values.
   Merge after shortlist.css. Older engines keep the original stacked layout. */
.dn83-comparison-hint { display:none; }
@supports (grid-template-rows:subgrid) {
  @media (max-width:700px) {
    .dn55-short-dialog .dn55-short-body { padding:14px 12px; }
    .dn55-short-dialog .dn55-short-intro { margin-bottom:14px!important; }
    .dn55-short-dialog .dn83-comparison-hint {
      display:block;
      margin:0 0 10px;
      font-size:12px;
      line-height:1.5;
      color:#52646e;
    }
    .dn55-short-dialog .dn55-short-comparison[data-model-count]:not([data-model-count="0"]) {
      display:grid;
      grid-template-columns:repeat(var(--dn55-columns,1),minmax(0,1fr));
      grid-template-rows:repeat(14,auto);
      grid-auto-flow:column;
      gap:0 8px;
      width:100%;
      min-width:0;
      max-width:100%;
      max-height:none;
      overflow:auto;
      overscroll-behavior-x:contain;
      overscroll-behavior-y:auto;
      scrollbar-width:thin;
      scrollbar-color:#8ba0ab #edf1f3;
      border-radius:10px;
      -webkit-overflow-scrolling:touch;
    }
    .dn55-short-dialog .dn55-short-comparison[data-model-count="3"]:not([data-model-count="0"]) {
      /* Exactly two readable columns fit; the third stays inside this scroller. */
      grid-template-columns:repeat(3,minmax(calc(50% - 4px),1fr));
    }
    .dn55-short-dialog .dn55-short-comparison:focus-visible {
      outline:3px solid #af6b05;
      outline-offset:3px;
    }
    .dn55-short-dialog .dn55-short-card {
      display:grid;
      grid-template-columns:minmax(0,1fr);
      grid-template-rows:subgrid;
      grid-row:1 / span 14;
      gap:0;
      min-width:0;
      padding:0 10px 10px;
      align-items:start;
      overflow-wrap:anywhere;
    }
    .dn55-short-dialog .dn55-short-card-title {
      grid-column:1;
      grid-row:1;
      position:sticky;
      top:0;
      z-index:2;
      align-self:stretch;
      display:flex;
      flex-direction:column;
      align-items:flex-start;
      justify-content:center;
      gap:0;
      margin:0 -10px;
      padding:10px 10px 2px;
      border-bottom:1px solid #dce4e6;
      border-radius:9px 9px 0 0;
      background:#f5f7f8;
    }
    .dn55-short-dialog .dn55-short-card-title h3 {
      font-size:18px!important;
      line-height:1.3!important;
      white-space:nowrap;
    }
    .dn55-short-dialog .dn55-short-card-title button {
      min-height:44px;
      padding:8px 0;
      text-align:left;
    }
    .dn55-short-dialog .dn55-short-media {
      grid-column:1;
      grid-row:2;
      justify-self:center;
      align-self:start;
      width:100%;
      max-width:112px;
      margin:12px 0 4px;
    }
    .dn55-short-dialog .dn55-short-card dl {
      display:grid;
      grid-template-columns:minmax(0,1fr);
      grid-template-rows:subgrid;
      grid-column:1;
      grid-row:3 / span 10;
      gap:0;
      min-width:0;
      margin:0;
    }
    .dn55-short-dialog .dn55-short-card dt {
      align-self:end;
      margin:12px 0 4px;
      font-size:10px;
      line-height:1.4;
      letter-spacing:.015em;
    }
    .dn55-short-dialog .dn55-short-card dd {
      align-self:stretch;
      margin:0;
      padding-bottom:10px;
      border-bottom:1px solid #e1e7ea;
      font-size:13px;
      line-height:1.5;
    }
    .dn55-short-dialog .dn55-short-note {
      grid-column:1;
      grid-row:13;
      margin:10px 0 0!important;
      padding:8px;
    }
    .dn55-short-dialog .dn55-short-card > a {
      grid-column:1;
      grid-row:14;
      align-self:stretch;
      margin:0;
      padding:12px 0 2px;
      font-size:12px;
      line-height:1.5;
    }
    .dn55-short-dialog .dn55-short-scope { margin-top:18px; padding-top:16px; }
  }
}

/* The footer owns supply selection; do not reapply mobile comparison spacing here. */
.dn55-short-dialog .dn95-short-footer .dn55-short-scope{margin:0;padding:0}
