.image-transition-page{--it-line:color-mix(in srgb,var(--text-color) 17%,transparent);--it-surface:color-mix(in srgb,var(--background-color) 94%,var(--text-color));--it-accent:#7bd7bd;color:var(--text-color);background:var(--background-color);min-height:calc(100svh - var(--navbar-current-height, var(--navbar-height)));padding:clamp(18px,3vw,44px)}.light-mode .image-transition-page{--it-accent:#12644f}.image-transition-page *{box-sizing:border-box}.it-heading{max-width:1600px;margin:0 auto 28px}.it-heading>a{color:var(--text-color-secondary);font-size:.85rem}.it-heading>div{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:18px}.it-heading h1{font-size:clamp(1.9rem,4vw,3rem);margin:0;letter-spacing:-.04em;line-height:1.15}.it-heading>p{margin:12px 0 0;max-width:760px;line-height:1.65;color:var(--text-color-secondary)}.it-badge{border:1px solid var(--it-line);border-radius:4px;padding:5px 9px;font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;color:var(--it-accent)}.it-workspace{max-width:1600px;margin:auto;display:grid;grid-template-columns:minmax(270px,330px) minmax(0,1fr);grid-gap:24px;gap:24px;align-items:start}.it-controls,.it-inspection{display:grid;grid-gap:16px;gap:16px;min-width:0}.it-inspection{scroll-margin-top:calc(var(--navbar-current-height, var(--navbar-height)) + 18px)}.it-panel{padding:18px;background:var(--it-surface);border:1px solid var(--it-line);border-radius:10px;min-width:0}.image-transition-page h2{font-size:.9rem;font-weight:700;margin:0;line-height:1.5}.it-controls h2{text-transform:uppercase;letter-spacing:.045em;font-size:.76rem}.it-footnote,.it-mapping-plot p,.it-panel p,.it-panel>small{font-size:.79rem;line-height:1.65;color:var(--text-color-secondary)}.it-panel p{margin:10px 0}.it-panel>small{display:block}.it-upload-pair{display:grid;grid-gap:10px;gap:10px;margin:16px 0 8px}.it-upload{position:relative;display:flex;align-items:center;gap:12px;min-height:86px;padding:14px;border:1px dashed var(--it-line);border-radius:7px;cursor:pointer;overflow:hidden}.it-upload:focus-within,.it-upload:hover{border-color:var(--it-accent)}.it-upload img{width:50px;height:56px;object-fit:cover;border-radius:3px}.it-upload>span{display:grid;grid-gap:6px;gap:6px;min-width:0}.it-upload strong{font-size:.85rem}.it-upload small{font-size:.74rem;color:var(--text-color-secondary);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.it-upload input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}.it-upload:has(input:disabled){opacity:.5;cursor:wait}.image-transition-page button,.it-download{font:inherit;font-size:.82rem;min-height:44px;border:1px solid var(--it-line);border-radius:6px;color:inherit;background:transparent;cursor:pointer;padding:10px 12px}.image-transition-page button:hover:not(:disabled),.it-download:hover{border-color:var(--it-accent)}.image-transition-page a:focus-visible,.image-transition-page button:focus-visible,.image-transition-page select:focus-visible,.image-transition-page summary:focus-visible{outline:2px solid var(--it-accent);outline-offset:3px}.image-transition-page button:disabled{cursor:not-allowed;opacity:.45}.image-transition-page .it-primary{display:block;width:100%;background:var(--it-accent);color:var(--background-color);border-color:transparent;font-weight:700;margin-top:14px}.image-transition-page .it-subtle{padding-left:0;border:0;font-size:.75rem;color:var(--it-accent)}.it-download{display:block;text-align:center;margin-top:10px;text-decoration:none;color:var(--it-accent)}.it-field{display:grid;grid-gap:7px;gap:7px;font-size:.78rem;min-width:0;margin-top:12px}.it-field select{-webkit-appearance:none;-moz-appearance:none;appearance:none;width:100%;min-width:0;min-height:44px;padding:8px 28px 8px 10px;border:1px solid var(--it-line);border-radius:5px;color:var(--text-color);background-color:var(--background-color);background-image:linear-gradient(45deg,transparent 50%,currentColor 0),linear-gradient(135deg,currentColor 50%,transparent 0);background-position:calc(100% - 15px) 50%,calc(100% - 10px) 50%;background-size:5px 5px;background-repeat:no-repeat;font:inherit}.it-checkbox{display:flex;align-items:center;gap:10px;min-height:44px;margin-top:10px;font-size:.78rem;line-height:1.5}.it-checkbox input{width:18px;height:18px;flex-shrink:0;accent-color:var(--it-accent)}.it-job{display:grid;grid-gap:10px;gap:10px;margin-top:12px;font-size:.8rem;line-height:1.5}.it-panel .it-error{color:#fca5a5}.light-mode .it-panel .it-error{color:#b91c1c}.it-limitations summary{font-size:.8rem;font-weight:700;cursor:pointer;min-height:26px}.it-view-toolbar{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:68px}.it-view-toolbar p{margin:3px 0;color:var(--text-color-secondary);font-size:.76rem}.it-view-toolbar .it-field{margin:0;min-width:130px}.it-image-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-gap:14px;gap:14px}.it-image-view{margin:0;min-width:0;border:1px solid var(--it-line);border-radius:8px;overflow:hidden;background:var(--it-surface)}.it-image-view figcaption{display:grid;grid-gap:4px;gap:4px;padding:12px 14px;border-bottom:1px solid var(--it-line)}.it-image-view figcaption strong{font-size:.85rem}.it-image-view figcaption span{font-size:.68rem;color:var(--text-color-secondary);line-height:1.5}.it-image-well{--it-well-height:clamp(190px,24vw,320px);--it-well-padding:10px;display:flex;align-items:center;justify-content:center;height:var(--it-well-height);padding:var(--it-well-padding);background:repeating-conic-gradient(#8585850b 0 25%,transparent 0 50%) 50% /16px 16px}.it-canvas-stack{position:relative;width:min(100%,calc((var(--it-well-height) - 2 * var(--it-well-padding)) * var(--it-image-ratio)));aspect-ratio:var(--it-image-ratio);min-width:0;overflow:hidden}.it-image-well canvas{display:block;width:100%;height:100%}.it-focus-overlay{position:absolute;inset:0;pointer-events:none;overflow:hidden}.it-focus-overlay.is-selecting{pointer-events:auto;touch-action:none;cursor:crosshair;-webkit-user-select:none;-moz-user-select:none;user-select:none;outline:2px solid var(--it-accent);outline-offset:-2px}.it-focus-overlay:focus-visible{outline:3px solid #facc15;outline-offset:-3px}.it-focus-box{position:absolute;border:2px solid #facc15;box-shadow:0 0 0 1000px #0006;pointer-events:none}.it-focus-box>span{position:absolute;left:0;top:0;padding:2px 4px;background:#facc15;color:#111827;font-size:.62rem;white-space:nowrap}.it-focus-actions{display:flex;gap:8px;flex-wrap:wrap}.it-focus-actions button[aria-pressed=true]{border-color:var(--it-accent);background:color-mix(in srgb,var(--it-accent) 12%,transparent)}.it-focus-fields{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-gap:10px;gap:10px;border:0;padding:0;margin:14px 0 0;min-width:0}.it-focus-fields legend{font-size:.75rem;margin-bottom:8px;color:var(--text-color-secondary)}.it-focus-fields label{display:grid;grid-gap:6px;gap:6px;font-size:.75rem;min-width:0}.it-focus-fields input{min-width:0;width:100%;min-height:44px;padding:8px;border:1px solid var(--it-line);border-radius:5px;background:var(--background-color);color:var(--text-color);font:inherit}.it-focus-fields input:focus-visible{outline:2px solid var(--it-accent);outline-offset:2px}.it-focus-result{display:grid;grid-gap:6px;gap:6px;border:1px solid var(--it-accent);border-radius:8px;padding:16px;font-size:.85rem}.it-focus-result span{font-size:.75rem;color:var(--text-color-secondary)}.it-placeholder{max-width:200px;text-align:center;padding:16px;font-size:.8rem;line-height:1.7;color:var(--text-color-secondary)}.it-empty-explainer{padding:26px;border:1px dashed var(--it-line);border-radius:8px;text-align:center}.it-empty-explainer>span{font-family:monospace;font-size:1.5rem;letter-spacing:.15em;color:var(--it-accent)}.it-empty-explainer p{margin:12px auto 0;max-width:550px;font-size:.83rem;line-height:1.7;color:var(--text-color-secondary)}.it-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid var(--it-line);border-radius:8px;overflow:hidden}.it-metrics>div{padding:16px;display:grid;grid-gap:8px;gap:8px;align-content:start}.it-metrics>div+div{border-left:1px solid var(--it-line)}.it-metrics span{font-size:.7rem;color:var(--text-color-secondary)}.it-metrics strong{font-size:1.05rem;line-height:1.4;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.it-metrics small{font-size:.68rem;line-height:1.5;color:var(--text-color-secondary)}.it-warning{padding:10px 16px;border-left:3px solid #ca9e54;background:#ca9e540d;font-size:.79rem;line-height:1.65}.it-warning p{margin:6px 0}.it-breakdowns{display:grid;grid-template-columns:1.15fr 1fr;grid-gap:16px;gap:16px}.it-section-head{display:flex;align-items:center;justify-content:space-between;gap:8px}.it-regions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-gap:6px;gap:6px;margin-top:14px}.it-regions button{padding:12px 5px;display:grid;grid-gap:8px;gap:8px;text-align:center}.it-regions button[aria-pressed=true]{border-color:var(--it-accent);background:color-mix(in srgb,var(--it-accent) 12%,transparent)}.it-regions span{font-size:.65rem}.it-regions strong{font-size:.75rem;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.it-panel table{width:100%;border-collapse:collapse;font-size:.79rem;margin:12px 0 16px;font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.it-panel caption{text-align:left;font-size:.7rem;color:var(--text-color-secondary);margin-bottom:6px}.it-panel td,.it-panel th{text-align:left;padding:8px 3px;border-bottom:1px solid var(--it-line)}.it-panel td{text-align:right}.it-mapping-plot svg{width:100%;max-height:160px}.it-plot-grid{fill:none;stroke:var(--it-line);stroke-width:1}.it-plot-identity{fill:none;stroke:var(--text-color-secondary);stroke-dasharray:4 4;stroke-width:1}.it-footnote{margin:0}@media (max-width:1100px){.it-breakdowns{grid-template-columns:minmax(0,1fr)}}@media (max-width:800px){.it-workspace{grid-template-columns:minmax(0,1fr);gap:24px}.it-controls{grid-template-columns:repeat(2,minmax(0,1fr))}.it-image-well{--it-well-height:260px}.it-breakdowns{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:540px){.image-transition-page{padding:18px max(16px,env(safe-area-inset-right)) 32px max(16px,env(safe-area-inset-left))}.it-heading{margin-bottom:20px}.it-breakdowns,.it-controls{grid-template-columns:minmax(0,1fr)}.it-panel{padding:15px}.it-image-grid{gap:8px}.it-image-view figcaption{padding:10px;min-height:78px}.it-image-view figcaption strong{font-size:.77rem}.it-image-well{--it-well-height:180px;--it-well-padding:6px}.it-focus-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.it-focus-fields input{font-size:16px}.it-metrics{grid-template-columns:minmax(0,1fr)}.it-metrics>div+div{border-left:0;border-top:1px solid var(--it-line)}.it-field select{font-size:16px}.it-view-toolbar{align-items:start}}