.compare{--pos:50%;--ratio:1.5;padding:var(--space-3);border-radius:var(--radius);background-color:var(--sheet);background-image:conic-gradient(var(--sheet-rule) 25%, transparent 0 50%, var(--sheet-rule) 0 75%, transparent 0);background-size:16px 16px;place-items:center;display:grid}.compare__frame{inline-size:min(100%, 60vh * var(--ratio), var(--natural,100%));min-inline-size:min(100%,12rem);aspect-ratio:var(--ratio);border-radius:var(--radius-sm);box-shadow:var(--shadow-sheet);touch-action:pan-y;position:relative;overflow:hidden}.compare__img{object-fit:contain;-webkit-user-select:none;user-select:none;pointer-events:none;block-size:100%;inline-size:100%;position:absolute;inset:0}.compare__after{clip-path:inset(0 0 0 var(--pos));position:absolute;inset:0}.compare__handle{background:var(--sheet);pointer-events:none;inline-size:2px;margin-inline-start:-1px;position:absolute;inset-block:0;inset-inline-start:var(--pos);box-shadow:0 0 0 1px #1c1b2e59}.compare__handle:after{content:"";border:2px solid var(--sheet);background-color:var(--accent);block-size:2.25rem;inline-size:2.25rem;box-shadow:var(--shadow-pop);transition:transform var(--duration-fast) var(--ease-out);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9 18-6-6 6-6'/%3E%3Cpath d='m15 6 6 6-6 6'/%3E%3C/svg%3E");background-position:50%;background-repeat:no-repeat;background-size:1.125rem;border-radius:50%;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%,-50%)}.compare__tag{padding:.125rem var(--space-2);border-radius:var(--radius-sm);color:#fff;font-size:var(--text-xs);letter-spacing:.04em;pointer-events:none;background:#13121c9e;font-weight:650;position:absolute;inset-block-start:var(--space-2)}.compare__tag--before{inset-inline-start:var(--space-2)}.compare__tag--after{inset-inline-end:var(--space-2)}.compare__range{opacity:0;cursor:ew-resize;appearance:none;block-size:100%;inline-size:100%;margin:0;position:absolute;inset:0}.compare__frame:has(.compare__range:focus-visible){outline:2px solid var(--focus);outline-offset:2px}.compare__frame:has(.compare__range:active) .compare__handle:after{transform:translate(-50%,-50%)scale(1.08)}.compare.is-busy .compare__after{opacity:.6;transition:opacity var(--duration) var(--ease-out)}@media (prefers-reduced-motion:reduce){.compare__handle:after{transition:none}}.imgx__main .sheet__body{flex:1;align-content:start}.imgx__choice{gap:var(--space-2);border:0;min-inline-size:0;margin:0;padding:0;display:grid}.imgx__choice legend{margin-block-end:var(--space-2);padding:0}.imgx__segmented{inline-size:100%;display:flex}@media (min-width:40rem){.imgx__segmented{inline-size:auto;max-inline-size:28rem}}.imgx__segmented label{text-align:center;white-space:nowrap;flex:1;place-items:center;min-block-size:2.25rem;display:grid}.imgx__preview{gap:var(--space-2);margin:0;display:grid}.imgx__caption{gap:var(--space-1) var(--space-3);color:var(--ink-2);font-size:var(--text-sm);flex-wrap:wrap;justify-content:space-between;display:flex}.imgx__caption-name{min-inline-size:0;max-inline-size:100%;color:var(--ink);text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.imgx__cards{border-block-start:1px solid var(--sheet-rule);display:grid}.imgx__card{gap:var(--space-2) var(--space-3);padding-block:var(--space-3);border-block-end:1px solid var(--sheet-rule);grid-template-columns:3.5rem minmax(0,1fr) auto;grid-template-areas:"thumb head actions""progress progress progress";align-items:center;display:grid}@media (min-width:40rem){.imgx__card{column-gap:var(--space-4)}}.imgx__thumb{aspect-ratio:1;border:1px solid var(--sheet-border);border-radius:var(--radius-sm);background-color:var(--paper);background-image:conic-gradient(var(--sheet-rule) 25%, transparent 0 50%, var(--sheet-rule) 0 75%, transparent 0);cursor:zoom-in;inline-size:3.5rem;transition:border-color var(--duration-fast) var(--ease-out);background-size:10px 10px;grid-area:thumb;padding:0;display:block;overflow:hidden}.imgx__thumb img{object-fit:cover;block-size:100%;inline-size:100%;display:block}.imgx__thumb img:not([src]){visibility:hidden}.imgx__thumb:disabled{cursor:default}.imgx__thumb:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.imgx__card.is-selected .imgx__thumb{border-color:var(--accent);box-shadow:0 0 0 2px var(--accent-soft)}.imgx__head{grid-area:head;gap:.125rem;min-inline-size:0;display:grid}.imgx__name{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.imgx__meta{color:var(--ink-3);font-size:var(--text-sm)}.imgx__gain{color:var(--accent);font-family:"Literata Variable", var(--font-display);white-space:nowrap;font-weight:600}.imgx__gain--up{color:var(--ink-2)}.imgx__gain--flat{color:var(--ink-3);font-family:inherit;font-weight:500}.imgx__note{color:var(--ink-2);font-size:var(--text-sm)}.imgx__actions{gap:var(--space-1);flex-direction:column-reverse;grid-area:actions;align-items:flex-end;display:flex}@media (min-width:40rem){.imgx__actions{gap:var(--space-2);flex-direction:row;align-items:center}}.imgx__progress{grid-area:progress}.imgx__settings{gap:var(--space-5);padding-block-start:var(--space-4)}.imgx__range-head{gap:var(--space-3);justify-content:space-between;align-items:baseline;display:flex}.imgx__value{color:var(--accent);font-family:"Literata Variable", var(--font-display);font-size:var(--text-lg);font-weight:600}.imgx__color{gap:var(--space-3);align-items:center;display:flex}.imgx__swatch{border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--sheet);cursor:pointer;flex:none;block-size:2.5rem;inline-size:2.5rem;padding:.1875rem}.imgx__swatch:focus-visible{outline:2px solid var(--focus);outline-offset:2px}.imgx__resize{gap:var(--space-3);display:grid}.imgx__limit{padding-inline-start:calc(1.125rem + var(--space-2))}.imgx__px{gap:var(--space-2);color:var(--ink-3);font-size:var(--text-sm);align-items:center;display:flex}.imgx__px .input{text-align:end;inline-size:6rem}.imgx__facts{gap:var(--space-2);border-block-start:1px solid var(--sheet-rule);color:var(--ink-2);font-size:var(--text-sm);padding-block-start:var(--space-4);display:grid}.imgx__facts li{gap:var(--space-2);grid-template-columns:1rem minmax(0,1fr);align-items:start;display:grid}.imgx__facts svg{block-size:1rem;inline-size:1rem;color:var(--accent);margin-block-start:.125rem}.imgx [hidden]{display:none}@media (prefers-reduced-motion:reduce){.imgx__thumb{transition:none}}