/* Phone layout; tablet and desktop retain their existing rules. */
@media (max-width:700px) {
  html:root body#top.design-master {
    --phone-frame-inset:18px;
    --phone-panel-inset:20px;
    --phone-image-gap:5mm;
  }
  /* Match the manufacturing page: one outer gutter, one text inset. */
  html:root body#top.design-master main :is(.legal-document,.article-detail-copy,.study-prose,.contact-info-card,.contact-original-copy,.team-copy-v4,.dictionary-entry,.dictionary-surface form,.newsletter-page-intro,.newsletter-item,.workshop-news-v6) {
    box-sizing:border-box!important;
    padding-left:var(--phone-panel-inset)!important;
    padding-right:var(--phone-panel-inset)!important;
    min-width:0;
  }
  html:root body#top.design-master main .article-detail-section {
    padding-left:var(--phone-frame-inset)!important;
    padding-right:var(--phone-frame-inset)!important;
  }
  html:root body#top.design-master main .article-detail-section>.article-detail-copy {
    width:100%!important;max-width:100%!important;
    margin-left:0!important;margin-right:0!important;
  }
  html:root body#top.design-master main :is(.study-prose,.article-detail-copy) figure,
  html:root body#top.design-master main .bow-flow-row .bow-photo {
    float:none!important;
    width:100%!important;max-width:100%!important;
    margin:var(--phone-image-gap) 0!important;
    padding-left:0!important;padding-right:0!important;
  }
  html:root body#top.design-master main :is(.study-prose,.article-detail-copy) figure:first-child {
    margin-top:0!important;
  }
  html:root body#top.design-master main :is(.study-prose,.article-detail-copy) figure img {
    display:block!important;width:100%!important;max-width:100%!important;
    height:auto!important;margin:0!important;
  }
  html:root body#top.design-master main .article-detail-copy img:not(figure img) {
    display:block!important;float:none!important;
    max-width:100%!important;height:auto!important;
    margin:var(--phone-image-gap) auto!important;
  }
  html:root body#top.design-master main :is(.study-prose,.article-detail-copy) figure figcaption {
    width:100%!important;max-width:100%!important;
    background:transparent!important;padding:0!important;
    border:0!important;box-shadow:none!important;
  }
  html:root body#top.design-master main .article-return-link {
    margin-top:1cm!important;
  }
  /* Reserve room for the rotated callout, including its visual bounds. */
  html:root body#top.design-master main .bow-intro>.bow-hero-calligraphy {
    width:45%!important;max-width:45%!important;
    justify-self:end;position:relative;aspect-ratio:1.1;
    margin-top:5mm!important;margin-bottom:5mm!important;
    margin-right:3%!important;
  }
  html:root body#top.design-master main .bow-intro>.bow-hero-calligraphy img {
    position:absolute;top:50%;left:0;
    width:100%!important;height:auto!important;
    transform:translateY(-50%) rotate(-32deg);
    transform-origin:center;
  }
}
@media (max-width:700px) {
  html:root body#top.design-master main .article-detail-copy :is(.master-image-inline,.master-figure) {
    display:block!important;width:100%!important;max-width:100%!important;
    margin:var(--phone-image-gap) 0!important;
  }
  html:root body#top.design-master main .article-detail-copy :is(.master-image-inline,.master-figure) img {
    width:100%!important;max-width:100%!important;margin:0!important;
  }
  html:root body#top.design-master main .spacing-section-v8>.spacing-inner-v8:has(>.article-return-link) {
    padding-top:1cm!important;
    margin-top:0!important;
  }
  html:root body#top.design-master main .spacing-section-v8>.spacing-inner-v8>.article-return-link:first-child {
    margin-top:0!important;
  }
}
@media (max-width:700px) {
  html:root body#top.design-master.info-current-page main :is(.newsletter-page-intro,.newsletter-item) {
    padding-left:var(--phone-panel-inset)!important;
    padding-right:var(--phone-panel-inset)!important;
  }
}
@media (max-width:700px) {
  html:root body#top.design-master.dictionary-page main>.content-section {
    padding-left:var(--phone-frame-inset)!important;
    padding-right:var(--phone-frame-inset)!important;
  }
  html:root body#top.design-master.dictionary-page main .dictionary-surface {
    width:100%!important;max-width:100%!important;margin-inline:0!important;
  }
}
