/* Scoped phone showcase; no changes to the workbench or other feature cards. */
.microscope-section.section-space{padding-bottom:64px}
.microscope-section+.workflow-section{padding-top:64px}
.microscope-section .section-heading{text-align:center;margin-bottom:36px}
.microscope-section .section-heading>p:last-child{color:var(--muted,#857b6c);line-height:1.8;margin-top:16px}
.microscope-section>.capability-invitation{margin:30px 0 0;text-align:center;font-size:clamp(20px,2vw,24px);font-weight:500;letter-spacing:.03em;line-height:1.8}
.medical-capabilities+.microscope-section{padding-top:76px}
.phone-reading-link{position:absolute;right:16px;bottom:8px;z-index:2;color:#5a4432;font-size:11px;text-decoration:none;border-bottom:1px solid #977b6166;line-height:1.8}
.phone-reading-link:focus-visible{outline:2px solid #8b5b3f;outline-offset:4px}
.microscope-showcase{max-width:920px;aspect-ratio:920/550;margin:auto;display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);grid-template-rows:minmax(0,1fr);min-width:0;border:1px solid #dfc8b4;border-radius:22px;overflow:hidden;background:#e4cbb5}
.microscope-capture{margin:0;position:relative;min-width:0;min-height:0;overflow:clip}
/* Display the photograph at its full width: never crop the phone's sides.
   Only the lower cable may leave the compact scene's viewport. */
.microscope-capture>img{display:block;width:100%;height:auto;max-width:none}
.microscope-screen{position:relative;isolation:isolate;display:flex;align-items:center;min-width:0;min-height:0;padding:0 12px;background:transparent}
/* Extend only the photo's empty rightmost 2% as a soft background texture.
   Its vertical scale matches the left photo (60% * 1338/1176 / (550/920)).
   A feathered overlap joins the two areas without recoloring the photograph. */
.microscope-screen::before{content:"";position:absolute;inset:-8px -8px -8px -16px;z-index:0;pointer-events:none;background-image:linear-gradient(120deg,#fff7ef1a,#f9eadc33),url('capture-blurred.png');background-size:100% 100%,5000% 114.2%;background-position:center,right top;background-repeat:no-repeat;filter:blur(20px);-webkit-mask-image:linear-gradient(to right,transparent,#000 28px);mask-image:linear-gradient(to right,transparent,#000 28px)}
.microscope-screen iframe{position:relative;z-index:1;border:0;display:block;width:100%;height:95%;background:transparent}
@media(max-width:760px){.microscope-screen{padding-inline:6px}.microscope-showcase{border-radius:18px}}
@media(max-width:620px){.microscope-section.section-space{padding-bottom:32px}.microscope-section+.workflow-section{padding-top:32px}}
@media(max-width:540px){.microscope-showcase{aspect-ratio:auto;grid-template-columns:1fr;grid-template-rows:auto 480px;max-width:410px}.microscope-capture{aspect-ratio:1}.microscope-screen{padding:0 12px}.microscope-screen::before{inset:-16px -8px -8px;mask-image:linear-gradient(to bottom,transparent,#000 28px);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 28px);background-position:center,right bottom}.microscope-screen iframe{height:100%}}

/* 批注：照片与手机面板之间平滑过渡。过渡只发生在右侧面板内，不遮挡照片里的手机。
   面板用照片最右侧的色带做底，无遮罩、无提亮，接缝处颜色与照片完全一致；再向右渐隐为面板底色。 */
.microscope-capture::after{content:none}
.microscope-screen::before{inset:-8px -8px -8px -120px;clip-path:inset(0 0 0 88px);background-image:url('capture-blurred.png');background-size:5000% 114.2%;background-position:right top;filter:blur(18px);-webkit-mask-image:linear-gradient(to right,transparent 88px,#000 118px,#000 55%,#e4cbb500 100%);mask-image:linear-gradient(to right,transparent 88px,#000 118px,#000 55%,transparent 100%)}
/* 接缝羽化：伪元素向左多铺 120px，使 blur 的边缘衰减远离接缝（否则接缝处底纹半透明、会透出更亮的容器底色而形成一条亮线）；
   再用 clip-path 与遮罩只保留接缝左侧 26px 的羽化带，由透明渐变到不透明，清晰照片与模糊底纹之间没有硬边。
   照片里的手机边缘距接缝约 35px 以上，不会被盖住。 */
@media(max-width:540px){.microscope-screen::before{inset:-120px -8px -8px;clip-path:inset(88px 0 0 0);background-position:right bottom;-webkit-mask-image:linear-gradient(to bottom,transparent 88px,#000 118px,#000 55%,transparent 100%);mask-image:linear-gradient(to bottom,transparent 88px,#000 118px,#000 55%,transparent 100%)}}
/* The unchanged background image is fetched only near this exhibit. */
.microscope-showcase:not([data-near-ready]) .microscope-screen::before{background-image:none}