/* Native evidence uses the same reading scale and image frame as Paramotif. */
.tool-process-features { container-type:inline-size; container-name:tool-features; }
.tool-process-features .tool-reader-section-heading p { max-width:760px; margin:var(--tool-heading-gap) 0 0; font-size:16px; line-height:25px; }
.tool-process-row { min-width:0; margin-top:32px; }
.tool-process-row + .tool-process-row { margin-top:64px; padding-top:64px; border-top:1px solid var(--line); }
.tool-process-tabs { display:flex; flex-wrap:wrap; gap:8px; margin:0 0 16px; }
.tool-process-body { display:grid; grid-template-columns:minmax(0,11fr) minmax(0,9fr); gap:40px; align-items:stretch; }
.tool-process-media { margin:0; min-width:0; align-self:start; }
.tool-process-panel { min-width:0; aspect-ratio:16 / 10; display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:minmax(0,1fr); background:#fff; }
.tool-process-panel > button { box-sizing:border-box; display:grid; place-items:center; min-width:0; min-height:0; width:100%; height:100%; padding:24px; border:1px solid #e5e5e5; border-radius:0; background:#fff; cursor:zoom-in; overflow:hidden; }
.tool-process-panel img { display:block; min-width:0; min-height:0; width:100%; height:100%; object-fit:contain; object-position:center; transform-origin:center; user-select:none; -webkit-user-drag:none; }
.tool-process-comparison { position:relative; box-sizing:border-box; border:1px solid #e5e5e5; overflow:hidden; isolation:isolate; }
.tool-process-comparison > img,.tool-process-before,.tool-process-before img { position:absolute; inset:0; width:100%; height:100%; }
.tool-process-before { clip-path:inset(0 calc(100% - var(--process-split)) 0 0); background:#fff; }
.tool-process-compare-label { position:absolute; z-index:2; bottom:14px; padding:4px 10px; border-radius:999px; background:rgba(245,245,245,.94); color:#4d4d4d; font-size:12px; line-height:20px; pointer-events:none; }
.tool-process-label-before { left:14px; }
.tool-process-label-after { right:14px; }
.tool-process-divider { position:absolute; z-index:2; top:0; bottom:0; left:var(--process-split); width:1px; background:rgba(255,255,255,.9); box-shadow:0 0 0 1px rgba(0,0,0,.13); pointer-events:none; }
.tool-process-divider > span { position:absolute; top:50%; left:50%; display:grid; place-items:center; width:32px; height:32px; transform:translate(-50%,-50%); border-radius:50%; background:#f5f5f5; color:#555; font-size:17px; line-height:1; letter-spacing:2px; }
/* Keep the pointer surface above the shared 20px parameter-range rule. */
.tool-reader .tool-process-comparison > input[data-process-split] { position:absolute; z-index:3; inset:0; box-sizing:border-box; width:100%; height:100%; margin:0; padding:0; opacity:0; cursor:ew-resize; touch-action:pan-y; appearance:none; }
.tool-process-comparison > input::-webkit-slider-thumb { width:1px; height:44px; appearance:none; }
.tool-process-comparison > input::-moz-range-thumb { width:1px; height:44px; border:0; }
.tool-process-comparison:has(> input:focus-visible) { outline:2px solid #707070; outline-offset:4px; }
.tool-process-panel [data-pm-image-zoomed="true"] { cursor:grab; touch-action:none; }
.tool-process-panel [data-pm-image-dragging="true"] { cursor:grabbing; }
.tool-process-panel:is(:focus-visible,:has(> button:focus-visible)) { outline:1px solid var(--muted); outline-offset:4px; }
.tool-process-source { margin-top:auto; padding-top:24px; }
.tool-process-source summary { width:fit-content; }
.tool-process-source p { margin:12px 0 0; color:var(--muted); font-size:13px; line-height:20px; }
.tool-process-copy { display:flex; flex-direction:column; min-width:0; max-width:600px; }
.tool-process-copy h3 { margin:0 0 var(--tool-heading-gap); color:var(--tool-heading-ink); font-size:22px; line-height:30px; font-weight:var(--tool-heading-weight); letter-spacing:0; text-wrap:balance; }
.tool-process-copy > p { max-width:38em; margin:0; font-size:16px; line-height:25px; color:var(--theme-body-ink); }
.tool-process-copy dl { display:grid; grid-template-columns:repeat(var(--tool-parameter-count,3),minmax(0,1fr)); gap:16px; margin:40px 0 0; padding:0; }
.tool-process-copy dl > div { min-width:0; }
.tool-process-copy dt { margin:0; color:var(--muted); font-size:13px; line-height:20px; }
.tool-process-copy dd { margin:4px 0 0; font-size:18px; line-height:26px; font-weight:500; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
@media(max-width:1280px) { .tool-process-body { gap:32px; } }
@container tool-features (max-width:831px) { .tool-process-body { grid-template-columns:minmax(0,1fr); gap:24px; } .tool-process-copy { display:block; max-width:760px; } .tool-process-source { margin-top:24px; padding-top:0; } }
@media(max-width:650px) { .tool-process-panel > button { padding:16px; } .tool-process-source summary { min-height:44px; } .tool-process-copy dl { grid-template-columns:1fr; gap:16px; } .tool-process-row + .tool-process-row { margin-top:40px; padding-top:40px; } }