.comparison.svelte-ws84ss{--control-bg:#eeece8;--control-fg:#161616;aspect-ratio:1200/750;isolation:isolate;-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.theme-layer.svelte-ws84ss,.theme-layer.svelte-ws84ss img:where(.svelte-ws84ss){pointer-events:none;width:100%;height:100%;position:absolute;inset:0}.theme-layer.svelte-ws84ss img:where(.svelte-ws84ss){object-fit:contain;filter:none;transition:none}.top-left.svelte-ws84ss{clip-path:inset(0 calc(100% - var(--split-x)) calc(100% - var(--split-y)) 0)}.top-right.svelte-ws84ss{clip-path:inset(0 0 calc(100% - var(--split-y)) var(--split-x))}.bottom-left.svelte-ws84ss{clip-path:inset(var(--split-y) calc(100% - var(--split-x)) 0 0)}.bottom-right.svelte-ws84ss{clip-path:inset(var(--split-y) 0 0 var(--split-x))}.theme-label.svelte-ws84ss{border:1px solid var(--control-fg);background:var(--control-bg);color:var(--control-fg);white-space:nowrap;border-radius:2px;padding:.2rem .4rem;font-size:.7rem;font-weight:600;line-height:1.4;position:absolute}.top-left.svelte-ws84ss .theme-label:where(.svelte-ws84ss),.top-right.svelte-ws84ss .theme-label:where(.svelte-ws84ss){top:.5rem}.bottom-left.svelte-ws84ss .theme-label:where(.svelte-ws84ss),.bottom-right.svelte-ws84ss .theme-label:where(.svelte-ws84ss){bottom:.5rem}.top-left.svelte-ws84ss .theme-label:where(.svelte-ws84ss),.bottom-left.svelte-ws84ss .theme-label:where(.svelte-ws84ss){left:.5rem}.top-right.svelte-ws84ss .theme-label:where(.svelte-ws84ss),.bottom-right.svelte-ws84ss .theme-label:where(.svelte-ws84ss){right:.5rem}.rule.svelte-ws84ss{z-index:1;background:var(--control-bg);mix-blend-mode:difference;pointer-events:none;position:absolute}.vertical.svelte-ws84ss{left:var(--split-x);width:1px;height:100%;top:0;transform:translate(-50%)}.horizontal.svelte-ws84ss{top:var(--split-y);width:100%;height:1px;left:0;transform:translateY(-50%)}.axis-hit.svelte-ws84ss,.center-handle.svelte-ws84ss{z-index:2;touch-action:none;position:absolute}.x-axis.svelte-ws84ss{left:clamp(22px, var(--split-x), calc(100% - 22px));cursor:ew-resize;width:44px;height:100%;top:0;transform:translate(-50%)}.y-axis.svelte-ws84ss{top:clamp(22px, var(--split-y), calc(100% - 22px));cursor:ns-resize;width:100%;height:44px;left:0;transform:translateY(-50%)}.axis-hit.svelte-ws84ss:focus-visible{outline:2px solid var(--accent-ink);outline-offset:-3px}.center-handle.svelte-ws84ss{left:clamp(22px, var(--split-x), calc(100% - 22px));top:clamp(22px, var(--split-y), calc(100% - 22px));z-index:3;width:44px;height:44px;color:var(--accent-ink);cursor:grab;background:0 0;border:0;border-radius:2px;place-items:center;padding:0;display:grid;transform:translate(-50%,-50%)}.center-handle.svelte-ws84ss:before{content:"";border:1px solid var(--fg-3);background:var(--bg);border-radius:2px;transition:background-color .15s,border-color .15s;position:absolute;inset:10px}.center-handle.svelte-ws84ss:after{content:"";background:currentColor;width:7px;height:7px;position:relative}.center-handle.svelte-ws84ss:hover:before,.center-handle.svelte-ws84ss:focus-visible:before,.demonstrating.svelte-ws84ss .center-handle:where(.svelte-ws84ss):before,.dragging.svelte-ws84ss .center-handle:where(.svelte-ws84ss):before{border-color:currentColor}.center-handle.svelte-ws84ss:active:before,.demonstrating.svelte-ws84ss .center-handle:where(.svelte-ws84ss):before,.dragging.svelte-ws84ss .center-handle:where(.svelte-ws84ss):before{background:var(--bg-2)}.dragging.svelte-ws84ss .center-handle:where(.svelte-ws84ss){cursor:grabbing}.center-handle.svelte-ws84ss:focus-visible{outline-offset:-2px}.comparison-hint.svelte-ws84ss{border-top:1px solid var(--line);color:var(--fg-2);margin:0;padding:.65rem 1rem;font-size:.875rem;line-height:1.4}@media (prefers-reduced-motion:reduce){.center-handle.svelte-ws84ss:before{transition:none}}.frame-cap.svelte-1hexxrd{display:block}.comparison-frame.svelte-1hexxrd a:where(.svelte-1hexxrd){color:inherit;text-decoration:none}.comparison-frame.svelte-1hexxrd .frame-bar:where(.svelte-1hexxrd){color:var(--fg-3)}.comparison-frame.svelte-1hexxrd a:where(.svelte-1hexxrd):hover{color:var(--accent-ink)}.comparison-frame.svelte-1hexxrd a:where(.svelte-1hexxrd):focus-visible{outline-offset:-3px}
