/* Each stage keeps its explanation and example together; subgrid aligns examples. */
.preview-polish .lens-page .lens-applied-cycle>.cycle-case-intro{font-family:inherit;font-size:17px;line-height:1.8;color:#334258;max-width:1000px;margin:0 0 28px}
.lens-applied-cycle ol.cycle-with-examples{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-template-rows:auto auto auto;gap:18px}
.lens-applied-cycle .cycle-with-examples>li{display:grid;grid-row:span 3;grid-template-rows:subgrid;gap:18px;align-items:start;padding:22px 18px 24px;min-width:0}
.lens-applied-cycle .cycle-with-examples>li>span{margin:0}
.lens-applied-cycle .cycle-with-examples .cycle-stage-copy{min-width:0}
.preview-polish .lens-applied-cycle .cycle-with-examples li h3{min-height:0}
.lens-applied-cycle .cycle-inline-case{align-self:stretch;border-top:1px solid #cbd6e3;border-radius:0 0 4px 4px;background:#ffffffa8;padding:16px 12px;min-width:0}
.preview-polish .lens-applied-cycle .cycle-inline-case h4{font-family:inherit;font-size:13px;line-height:1.5;font-weight:700;color:#243080;letter-spacing:.02em;margin:0 0 10px}
.preview-polish .lens-applied-cycle .cycle-inline-case p{font-family:inherit;font-size:14px;line-height:1.8;color:#53627a;margin:0}
.preview-polish .lens-page .lens-applied-cycle>.cycle-case-takeaway{font-family:inherit;font-size:16px;line-height:1.8;color:#53627a;max-width:1000px;margin:0 0 22px}
@media(max-width:1000px){.lens-applied-cycle ol.cycle-with-examples{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:600px){.lens-applied-cycle ol.cycle-with-examples{grid-template-columns:1fr;grid-template-rows:none;gap:24px}.lens-applied-cycle .cycle-with-examples>li{display:grid;grid-row:auto;grid-template-rows:auto auto auto;gap:18px}.preview-polish .lens-applied-cycle .cycle-inline-case p{font-size:16px}}
@supports not (grid-template-rows:subgrid){.lens-applied-cycle .cycle-with-examples>li{grid-template-rows:auto 1fr auto}}

/* Shared case introduction belongs between the general stages and their examples. */
.cycle-example-comparison{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:20px 18px;margin-bottom:28px}
.lens-applied-cycle .cycle-example-comparison ol.cycle-with-examples,.lens-applied-cycle .cycle-example-comparison .cycle-with-examples>li{display:contents}
.lens-applied-cycle .cycle-example-comparison .cycle-stage-copy{grid-column:var(--stage-column);grid-row:1;background:#f0f5f8;padding:22px 18px;border-radius:24px 5px 5px 5px}
.lens-applied-cycle .cycle-example-comparison .cycle-inline-case{grid-column:var(--stage-column);grid-row:3;background:#f1f4f9;padding:18px;border-top:0;border-radius:5px}
.lens-applied-cycle .cycle-example-comparison>.cycle-case-intro{grid-column:1/-1;grid-row:2;font-family:inherit;font-size:17px;line-height:1.8;color:#334258;margin:8px 0 0;max-width:none}
.cycle-stage-number{display:block;font-size:15px;font-weight:650;line-height:1.4;color:#24516e;margin:0 0 20px}
.lens-applied-cycle .cycle-example-comparison li:nth-child(2) .cycle-stage-copy{background:#fff5f0}.lens-applied-cycle .cycle-example-comparison li:nth-child(3) .cycle-stage-copy{background:#f3f7ee}.lens-applied-cycle .cycle-example-comparison li:nth-child(4) .cycle-stage-copy{background:#fffaec}.lens-applied-cycle .cycle-example-comparison li:nth-child(5) .cycle-stage-copy{background:#f8f3fa}
@media(max-width:1000px){.cycle-example-comparison{display:flex;flex-direction:column;gap:24px}.lens-applied-cycle .cycle-example-comparison>.cycle-case-intro{order:-1}.lens-applied-cycle .cycle-example-comparison ol.cycle-with-examples{display:grid;grid-template-columns:1fr;gap:24px;margin:0}.lens-applied-cycle .cycle-example-comparison .cycle-with-examples>li{display:block;padding:0;background:transparent}.lens-applied-cycle .cycle-example-comparison .cycle-stage-copy{border-radius:24px 5px 0 0}.lens-applied-cycle .cycle-example-comparison .cycle-inline-case{border-top:1px solid #cbd6e3}.preview-polish .lens-applied-cycle .cycle-inline-case p{font-size:16px}}