.animated-diff.svelte-1y8oi6n{--source-height:450px;--result-height:200px;--travel:calc(100% + 96px);--retain-staging-shift:-115px;--retain-shift:-130px;--removed-green:#1d7a58;--duration:4s;border:1px solid var(--dx-line);background:#f3f5f6;border-radius:16px;overflow:hidden;box-shadow:0 25px 65px #061a331c;container-type:inline-size}.case-study-head.svelte-1y8oi6n{border-bottom:1px solid var(--dx-line);background:#fff;justify-content:space-between;align-items:center;gap:18px;min-height:49px;padding-inline:clamp(23px,4.5cqw,34px);display:flex}.case-study-head.svelte-1y8oi6n>div:where(.svelte-1y8oi6n){justify-content:space-between;align-items:center;gap:18px;width:100%;display:flex}.case-study-head.svelte-1y8oi6n span:where(.svelte-1y8oi6n),.case-study-head.svelte-1y8oi6n strong:where(.svelte-1y8oi6n),.count.svelte-1y8oi6n>span:where(.svelte-1y8oi6n){font-family:var(--dx-mono);letter-spacing:.055em;text-transform:uppercase;font-size:.5rem}.case-study-head.svelte-1y8oi6n span:where(.svelte-1y8oi6n),.count.svelte-1y8oi6n>span:where(.svelte-1y8oi6n){color:var(--dx-ink-muted)}.count.svelte-1y8oi6n>span:where(.svelte-1y8oi6n){font-size:.75rem}.case-study-head.svelte-1y8oi6n strong:where(.svelte-1y8oi6n){color:var(--dx-accent);font-weight:500}.comparison-head.svelte-1y8oi6n{border-bottom:1px solid var(--dx-line);background:#fff;grid-template-columns:minmax(0,1fr) 82px minmax(0,1fr);align-items:end;padding:clamp(22px,4.5cqw,33px);display:grid}.count.svelte-1y8oi6n{gap:7px;display:grid}.count.svelte-1y8oi6n>div:where(.svelte-1y8oi6n){align-items:baseline;gap:7px;display:flex}.count.svelte-1y8oi6n strong:where(.svelte-1y8oi6n){color:var(--dx-navy);font-family:var(--dx-display);letter-spacing:-.06em;font-size:clamp(2.6rem,9cqw,4.45rem);font-weight:560;line-height:.82}.after-count.svelte-1y8oi6n strong:where(.svelte-1y8oi6n){color:var(--dx-accent)}.count.svelte-1y8oi6n small:where(.svelte-1y8oi6n){color:var(--dx-ink-muted);font-size:.62rem}.comparison-head.svelte-1y8oi6n>i:where(.svelte-1y8oi6n){color:var(--dx-accent);text-align:center;align-self:center;font-size:1rem;font-style:normal}.motion-stage.svelte-1y8oi6n{height:var(--source-height);margin:clamp(25px,4.5cqw,34px);position:relative;overflow:visible}.file-shell.svelte-1y8oi6n{background:#fff;border:1px solid #061a3326;border-radius:10px;width:calc(50% - 41px);position:absolute;top:0;overflow:hidden;box-shadow:0 15px 32px #061a331f}.source-file.svelte-1y8oi6n{height:var(--source-height);left:0}.result-file.svelte-1y8oi6n{z-index:2;height:var(--result-height);opacity:0;border-color:#5c6cff59;right:0;transform:translateY(10px);box-shadow:0 15px 32px #061a331f,0 0 0 3px #5c6cff0d}.file-bar.svelte-1y8oi6n{border-bottom:1px solid var(--dx-line);background:#f8f9f9;align-items:center;gap:8px;height:29px;padding-inline:10px;display:flex}.file-bar.svelte-1y8oi6n span:where(.svelte-1y8oi6n){border:1px solid #81909e;border-radius:2px;width:6px;height:6px}.result-file.svelte-1y8oi6n .file-bar:where(.svelte-1y8oi6n) span:where(.svelte-1y8oi6n){border-color:var(--dx-accent);background:#5c6cff1f}.file-bar.svelte-1y8oi6n code:where(.svelte-1y8oi6n){color:#576b7d;font-family:var(--dx-mono);font-size:.5rem}.source-piece.svelte-1y8oi6n{z-index:4;opacity:0;transform-origin:50%;border-radius:5px;width:calc(50% - 55px);padding:6px;position:absolute;left:7px;overflow:hidden}.static-piece.svelte-1y8oi6n{z-index:1;border-radius:5px;flex-direction:column;padding:6px;display:flex;position:absolute;left:6px;right:6px;overflow:hidden}.static-red.svelte-1y8oi6n{background:#f6dadd;box-shadow:inset 3px 0 #cf6470}.static-one.svelte-1y8oi6n{height:120px;top:35px}.static-two.svelte-1y8oi6n{height:110px;top:161px}.static-retained.svelte-1y8oi6n{background:#e8ecef;height:47px;top:277px;box-shadow:inset 3px 0 #8898a7}.static-three.svelte-1y8oi6n{height:112px;top:330px}.red-piece.svelte-1y8oi6n{background:#f6dadd;box-shadow:inset 3px 0 #cf6470}.piece-one.svelte-1y8oi6n{--origin-y:35px;--pile-x:-4px;--pile-y:185px;--pile-rotation:-2deg;top:var(--origin-y);height:120px}.piece-two.svelte-1y8oi6n{--origin-y:161px;--pile-x:0px;--pile-y:60px;--pile-rotation:1deg;top:var(--origin-y);height:110px}.piece-three.svelte-1y8oi6n{--origin-y:330px;--pile-x:4px;--pile-y:-110px;--pile-rotation:-1deg;top:var(--origin-y);height:112px}.retained-piece.svelte-1y8oi6n{--origin-y:277px;top:var(--origin-y);background:#e8ecef;height:47px;box-shadow:inset 3px 0 #8898a7}.green-hunk.svelte-1y8oi6n{background:#dcf1e7;border-radius:5px;height:106px;padding:6px;position:absolute;top:35px;left:6px;right:6px;box-shadow:inset 3px 0 #42a77a}.code-line.svelte-1y8oi6n{grid-template-columns:10px minmax(0,1fr);align-items:center;height:100%;min-height:0;display:grid}.source-piece.svelte-1y8oi6n,.static-piece.svelte-1y8oi6n,.green-hunk.svelte-1y8oi6n{flex-direction:column;display:flex}.code-line.svelte-1y8oi6n{flex:1 1 0}.code-line.svelte-1y8oi6n>span:where(.svelte-1y8oi6n){color:#a94855;font-family:var(--dx-mono);text-align:center;font-size:.42rem}.green-hunk.svelte-1y8oi6n .code-line:where(.svelte-1y8oi6n)>span:where(.svelte-1y8oi6n){color:#1d7a58}.retained-piece.svelte-1y8oi6n .code-line:where(.svelte-1y8oi6n)>span:where(.svelte-1y8oi6n),.static-retained.svelte-1y8oi6n .code-line:where(.svelte-1y8oi6n)>span:where(.svelte-1y8oi6n){color:#6d7d8c}.code-line.svelte-1y8oi6n>div:where(.svelte-1y8oi6n){width:calc(100% - var(--indent));margin-left:var(--indent);align-items:center;gap:4px;display:flex}.code-line.svelte-1y8oi6n i:where(.svelte-1y8oi6n){width:var(--token-width);background:#667583;border-radius:2px;flex:0 auto;height:2px;display:block}.code-line.svelte-1y8oi6n i:where(.svelte-1y8oi6n):nth-child(3){background:#89949d}.code-line.svelte-1y8oi6n i.keyword:where(.svelte-1y8oi6n){background:#1d2b38}.green-hunk.svelte-1y8oi6n .code-line:where(.svelte-1y8oi6n) i.keyword:where(.svelte-1y8oi6n){background:#245b49}.diff-flow.svelte-1y8oi6n{z-index:3;width:82px;height:var(--source-height);opacity:0;clip-path:inset(0 100% 0 0);position:absolute;top:0;left:calc(50% - 41px)}.diff-flow.svelte-1y8oi6n svg:where(.svelte-1y8oi6n){width:100%;height:100%;display:block;overflow:visible}.diff-flow.svelte-1y8oi6n path:where(.svelte-1y8oi6n){fill:none;vector-effect:non-scaling-stroke}.merge-path.svelte-1y8oi6n{stroke:#5c6cff99;stroke-width:1.35px}.retain-path.svelte-1y8oi6n{stroke:#8393a2;stroke-dasharray:3 3;stroke-width:1px}#v7-merge-arrow.svelte-1y8oi6n path:where(.svelte-1y8oi6n){fill:var(--dx-accent)}#v7-retain-arrow.svelte-1y8oi6n path:where(.svelte-1y8oi6n){fill:#8393a2}.removed-space.svelte-1y8oi6n{bottom:0;right:0;top:var(--result-height);z-index:5;width:calc(50% - 41px);color:var(--removed-green);text-align:center;grid-template-rows:minmax(0,1fr) auto minmax(0,1fr);gap:10px;padding-block:16px;display:grid;position:absolute}.removed-line.svelte-1y8oi6n{background:var(--removed-green);opacity:0;justify-self:center;width:2px;height:100%;display:block;position:relative;transform:scaleY(0)}.removed-line-before.svelte-1y8oi6n{transform-origin:bottom}.removed-line-after.svelte-1y8oi6n{transform-origin:top}.removed-line-before.svelte-1y8oi6n:before,.removed-line-after.svelte-1y8oi6n:after{background:var(--removed-green);content:"";width:34px;height:2px;position:absolute;left:50%;transform:translate(-50%)}.removed-line-before.svelte-1y8oi6n:before{top:0}.removed-line-after.svelte-1y8oi6n:after{bottom:0}.removed-copy.svelte-1y8oi6n{opacity:0;justify-items:center;gap:3px;display:grid}.removed-space.svelte-1y8oi6n strong:where(.svelte-1y8oi6n){font-family:var(--dx-display);letter-spacing:-.045em;font-size:clamp(2.5rem,8cqw,3.25rem);font-weight:650;line-height:1}.removed-space.svelte-1y8oi6n span:where(.svelte-1y8oi6n){color:var(--removed-green);font-family:var(--dx-mono);letter-spacing:.035em;text-transform:uppercase;font-size:.75rem;font-weight:600;line-height:1}.started.svelte-1y8oi6n .red-piece:where(.svelte-1y8oi6n){animation:svelte-1y8oi6n-discard-piece var(--duration) cubic-bezier(.35, .15, .65, .85) both}.started.svelte-1y8oi6n .retained-piece:where(.svelte-1y8oi6n){animation:svelte-1y8oi6n-retain-piece var(--duration) cubic-bezier(.35, .15, .65, .85) both}.started.svelte-1y8oi6n .result-file:where(.svelte-1y8oi6n){animation:svelte-1y8oi6n-result-shell var(--duration) ease-out both}.started.svelte-1y8oi6n .diff-flow:where(.svelte-1y8oi6n){animation:svelte-1y8oi6n-flow-draw var(--duration) ease-out both}.started.svelte-1y8oi6n .removed-copy:where(.svelte-1y8oi6n){animation:svelte-1y8oi6n-removed-copy-appears var(--duration) ease-out both}.started.svelte-1y8oi6n .removed-line:where(.svelte-1y8oi6n){animation:svelte-1y8oi6n-removed-line-draws var(--duration) ease-out both}.outcome.svelte-1y8oi6n{border-top:1px solid var(--dx-line);background:#fff;grid-template-columns:minmax(0,1fr) 82px minmax(0,1fr);align-items:center;padding:19px clamp(25px,4.5cqw,34px);display:grid}.outcome.svelte-1y8oi6n>div:where(.svelte-1y8oi6n):first-child{align-items:baseline;gap:8px;display:flex}.outcome.svelte-1y8oi6n strong:where(.svelte-1y8oi6n){color:var(--dx-navy);font-family:var(--dx-display);letter-spacing:-.04em;font-size:1.6rem;font-weight:600}.outcome.svelte-1y8oi6n span:where(.svelte-1y8oi6n){color:var(--dx-ink-muted);font-size:.62rem}.outcome.svelte-1y8oi6n>i:where(.svelte-1y8oi6n){color:var(--dx-accent);text-align:center;font-style:normal}.result.svelte-1y8oi6n{justify-content:flex-end;align-items:baseline;gap:14px;display:flex}.result.svelte-1y8oi6n strong:where(.svelte-1y8oi6n){color:var(--dx-accent);margin-right:3px}@keyframes svelte-1y8oi6n-discard-piece{0%{opacity:0;transform:none}28%,31%{opacity:1;transform:translateX(var(--travel))}58%,62%{opacity:1;transform:translateX(var(--travel)) translate(var(--pile-x), var(--pile-y)) scale(.52) rotate(var(--pile-rotation))}86%,to{opacity:0;transform:translateX(var(--travel)) translate(var(--pile-x), calc(var(--pile-y) + 96px)) scale(.42) rotate(var(--pile-rotation))}}@keyframes svelte-1y8oi6n-retain-piece{0%{opacity:0;transform:none}28%,31%{opacity:1;transform:translateX(var(--travel))}58%,62%{opacity:1;transform:translateX(var(--travel)) translateY(var(--retain-staging-shift))}86%,to{opacity:1;transform:translateX(var(--travel)) translateY(var(--retain-shift))}}@keyframes svelte-1y8oi6n-result-shell{0%,62%{opacity:0;transform:translateY(12px)}86%,to{opacity:1;transform:none}}@keyframes svelte-1y8oi6n-flow-draw{0%,82%{opacity:0;clip-path:inset(0 100% 0 0)}84%{opacity:1}to{opacity:1;clip-path:inset(0)}}@keyframes svelte-1y8oi6n-removed-copy-appears{0%,82%{opacity:0;transform:translateY(3px)}92%,to{opacity:1;transform:none}}@keyframes svelte-1y8oi6n-removed-line-draws{0%,82%{opacity:0;transform:scaleY(0)}84%{opacity:1}to{opacity:1;transform:scaleY(1)}}@media (prefers-reduced-motion:reduce){.red-piece.svelte-1y8oi6n{display:none}.result-file.svelte-1y8oi6n,.diff-flow.svelte-1y8oi6n{opacity:1;animation:none;transform:none}.diff-flow.svelte-1y8oi6n{clip-path:inset(0)}.removed-copy.svelte-1y8oi6n,.removed-line.svelte-1y8oi6n{opacity:1;animation:none;transform:none}.retained-piece.svelte-1y8oi6n{opacity:1;transform:translateX(var(--travel)) translateY(var(--retain-shift));animation:none}}@container (width<=520px){.motion-stage.svelte-1y8oi6n{--source-height:390px;--result-height:181px;--travel:calc(100% + 56px);--retain-staging-shift:-89px;--retain-shift:-101px;height:var(--source-height);margin-inline:14px}.case-study-head.svelte-1y8oi6n>div:where(.svelte-1y8oi6n){flex-direction:column;align-items:flex-start;gap:4px}.case-study-head.svelte-1y8oi6n{padding-block:10px}.comparison-head.svelte-1y8oi6n,.outcome.svelte-1y8oi6n{grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr)}.comparison-head.svelte-1y8oi6n{padding-inline:14px}.count.svelte-1y8oi6n strong:where(.svelte-1y8oi6n){font-size:clamp(2.1rem,12cqw,2.8rem)}.count.svelte-1y8oi6n small:where(.svelte-1y8oi6n){display:none}.file-shell.svelte-1y8oi6n,.source-piece.svelte-1y8oi6n{width:calc(50% - 21px)}.source-piece.svelte-1y8oi6n{width:calc(50% - 35px)}.piece-one.svelte-1y8oi6n{--origin-y:31px;--pile-y:150px;height:100px}.piece-two.svelte-1y8oi6n{--origin-y:137px;--pile-y:48px;height:91px}.retained-piece.svelte-1y8oi6n{--origin-y:234px;height:42px}.piece-three.svelte-1y8oi6n{--origin-y:282px;--pile-y:-97px;height:100px}.static-one.svelte-1y8oi6n{height:100px;top:31px}.static-two.svelte-1y8oi6n{height:91px;top:137px}.static-retained.svelte-1y8oi6n{height:42px;top:234px}.static-three.svelte-1y8oi6n{height:100px;top:282px}.code-line.svelte-1y8oi6n{grid-template-columns:7px minmax(0,1fr)}.code-line.svelte-1y8oi6n>div:where(.svelte-1y8oi6n){gap:2px}.file-bar.svelte-1y8oi6n{height:25px;padding-inline:7px}.file-bar.svelte-1y8oi6n code:where(.svelte-1y8oi6n){font-size:.41rem}.green-hunk.svelte-1y8oi6n{height:96px;padding-inline:4px;top:31px}.diff-flow.svelte-1y8oi6n{width:42px;left:calc(50% - 21px)}.removed-space.svelte-1y8oi6n{width:calc(50% - 21px)}.removed-space.svelte-1y8oi6n strong:where(.svelte-1y8oi6n){font-size:2rem}.outcome.svelte-1y8oi6n{padding-inline:14px}.outcome.svelte-1y8oi6n>div:where(.svelte-1y8oi6n):first-child,.result.svelte-1y8oi6n{flex-direction:column;align-items:flex-start;gap:0}.result.svelte-1y8oi6n{align-items:flex-end}.outcome.svelte-1y8oi6n strong:where(.svelte-1y8oi6n){font-size:1.35rem}.outcome.svelte-1y8oi6n span:where(.svelte-1y8oi6n){font-size:.52rem}}