/* Phone-specific fit pass. The desktop composition and dotted visual language stay intact. */
@media (max-width: 700px) {
  html, body.custom-models-page { width: 100%; max-width: 100%; overflow-x: clip; }
  body.custom-models-page main { width: 100%; overflow-x: clip; }
  body.custom-models-page main :is(section, div, article, header, pre) { min-width: 0; }

  .cm-shell { width: calc(100% - 32px); }
  .cm-overview { padding: 116px 0 72px; }
  .cm-overview-head { margin-bottom: 48px; }
  .cm-overview-head h1 { max-width: 12ch; margin-inline: auto; font-size: clamp(38px, 10.8vw, 45px); line-height: .98; overflow-wrap: normal; }
  .cm-overview-head > p:not(.cm-eyebrow) { font-size: 17px; line-height: 1.45; }
  .cm-overview::before, .cm-overview::after { width: 360px; opacity: .18; background-size: 16px 16px; }

  .cm-engine { min-height: 0; padding: 14px; gap: 28px; border-radius: 16px; }
  .cm-engine-sources { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  .cm-engine-sources article { min-height: 150px; padding: 16px 14px; border-radius: 12px; }
  .cm-engine-sources strong { margin-top: 17px; font-size: 16px; line-height: 1.08; }
  .cm-engine-sources small { font-size: 10px; line-height: 1.25; }
  .cm-engine-model { min-height: 470px; padding-top: 26px; overflow: hidden; }
  .cm-engine-stats { gap: 22px; }
  .cm-engine-stats span { max-width: 120px; font-size: 9px; line-height: 1.25; }
  .cm-engine-stats b { font-size: 34px; }
  .cm-feature-field { inset: 82px -20px 22px; background-size: 16px 16px; opacity: .42; }
  .cm-model-flow { top: 112px; left: 12px; right: 12px; gap: 8px; }
  .cm-model-flow span, .cm-model-flow b { padding: 10px 12px; font-size: 11px; }
  .cm-model-flow i { height: 18px; }
  .cm-output-summary { right: 50%; bottom: 14px; width: min(216px, calc(100% - 24px)); }

  .cm-statement-inner { min-height: 430px; padding: 32px 22px; }
  .cm-statement blockquote { font-size: clamp(28px, 8.2vw, 34px); line-height: 1.06; }

  .cm-method, .cm-delivery-section { padding: 76px 0; }
  .cm-method { scroll-margin-top: 74px; }
  .cm-method::before, .cm-method::after { width: 380px; opacity: .22; background-size: 16px 16px; }
  .cm-method::before { top: -145px; right: -185px; }
  .cm-method::after { left: -190px; bottom: -180px; }
  .cm-method-head { gap: 24px; }
  .cm-method-head h2, .cm-delivery-heading h2 { max-width: 12ch; font-size: clamp(35px, 10vw, 42px); line-height: 1; overflow-wrap: normal; }
  .cm-method-head > p, .cm-delivery-heading > p { font-size: 15px; line-height: 1.5; }
  .cm-method-track { margin-top: 42px; padding: 10px; gap: 10px; border-radius: 14px; }
  .cm-method-track article { min-height: 188px; padding: 18px; }
  .cm-method-track h3 { margin: 42px 0 9px; font-size: 25px; }
  .cm-method-track p { font-size: 13px; line-height: 1.46; }
  .cm-method-note { margin-top: 12px; gap: 5px; font-size: 8px; }
  .cm-method-note i { height: 9px; }

  .cm-delivery-section::before { width: 380px; top: -130px; left: -190px; background-size: 16px 16px; }
  .cm-delivery-heading { margin-bottom: 40px; }
  .cm-delivery-heading h2 { margin-inline: auto; }
  .cm-delivery-heading > p { margin-top: 18px; }
  .cm-delivery-stage { width: calc(100% - 24px); padding: 20px; gap: 32px; border-radius: 15px; }
  .cm-delivery-copy h3 { font-size: 30px; }
  .cm-delivery-copy > div { gap: 12px; }
  .cm-delivery-copy b { font-size: 16px; }
  .cm-delivery-code { width: 100%; }
  .cm-delivery-codebar > span { display: none; }
  .cm-delivery-codebar b { margin-left: 0; }
  .cm-delivery-code pre { min-height: 250px; padding: 16px; font-size: 9px; }
  .cm-delivery-status { padding-inline: 12px; font-size: 8px; }

  .cm-final-inner { min-height: 450px; padding: 34px 22px; }
  .cm-final h2 { max-width: 10ch; font-size: clamp(38px, 11vw, 45px); overflow-wrap: normal; }
}

@media (max-width: 360px) {
  .cm-engine-sources { grid-template-columns: 1fr; }
  .cm-method-head h2, .cm-delivery-heading h2 { font-size: 34px; }
}