.hover-video-preview{width:100%;position:relative;overflow:hidden}button.hover-video-preview{color:inherit;font:inherit;text-align:inherit;cursor:pointer;touch-action:manipulation;background:0 0;border:0;padding:0;display:block}.hover-video-preview>img{width:100%;height:auto;display:block}.hover-video-preview>video{opacity:0;pointer-events:none;z-index:1;width:100%;height:100%;position:absolute;inset:0}.hover-video-preview[data-playing=true]>video{opacity:1}.hover-video-preview-loading{z-index:2;pointer-events:none;place-items:center;animation:.2s .25s both hover-preview-loading-appear;display:grid;position:absolute;inset:0}.hover-video-preview-loading svg{box-sizing:content-box;color:#fff;background:#00000080;border-radius:50%;width:36px;height:36px;padding:7px;animation:1s linear infinite hover-preview-loading-spin}@keyframes hover-preview-loading-appear{0%{opacity:0}to{opacity:1}}@keyframes hover-preview-loading-spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){.hover-video-preview-loading svg{animation:none}}.hover-video-preview:focus-visible{outline:2px solid var(--lobby-accent,#f2b664);outline-offset:3px}.video-comparison{width:min(540px,100%);color:var(--cinema-white,#edf6f3);margin-inline:auto}.video-comparison-frame{background:#102e34;border:1px solid #bddbd838;border-radius:14px;position:relative;overflow:hidden}.video-comparison-slider{aspect-ratio:3;width:100%;position:relative;container-type:inline-size}.video-comparison-slider video,.video-comparison-poster,.video-comparison-reveal{width:100%;height:100%;display:block;position:absolute;inset:0}.video-comparison-slider video,.video-comparison-poster{object-fit:cover;object-position:center 60%;pointer-events:none}.video-comparison-reveal{clip-path:inset(0 50% 0 0);animation:comparison-reveal var(--comparison-duration,6s) ease-in-out var(--comparison-delay,0s) infinite var(--comparison-direction,alternate)}.video-comparison-divider{pointer-events:none;width:2px;animation:comparison-divider var(--comparison-duration,6s) ease-in-out var(--comparison-delay,0s) infinite var(--comparison-direction,alternate);background:#fff;position:absolute;inset:0 auto 0 0;transform:translate(50cqw);box-shadow:0 0 12px #ffffff50}@keyframes comparison-reveal{0%{clip-path:inset(0 80% 0 0)}to{clip-path:inset(0 20% 0 0)}}@keyframes comparison-divider{0%{transform:translate(20cqw)}to{transform:translate(80cqw)}}.video-comparison-change{z-index:3;color:#fff;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);touch-action:manipulation;background:#152a2ecc;border:1px solid #ffffff35;border-radius:8px;align-items:center;gap:6px;min-height:44px;padding:7px 11px;font-size:12px;display:inline-flex;position:absolute;top:10px;right:10px}.video-comparison-change:hover{background:#152a2ef0}.video-comparison-playback{z-index:4;color:#fff7fc;touch-action:manipulation;background:#172b4be6;border:1px solid #ffffff70;border-radius:8px;place-items:center;width:44px;height:44px;display:grid;position:absolute;bottom:10px;right:10px}.video-comparison-playback:hover{background:#172b4b}.video-comparison-playback:focus-visible,.video-comparison-change:focus-visible{outline:2px solid var(--moon-shell-accent,#f4accf);outline-offset:3px}.video-comparison[data-native-ratio]{width:100%}.video-comparison[data-native-ratio] .video-comparison-slider video{object-fit:contain;object-position:center}.video-comparison[data-playing=false] :is(.video-comparison-reveal,.video-comparison-divider){animation-play-state:paused}.video-comparison-error{z-index:2;text-align:center;background:#08282de6;padding:12px;font-size:12px;position:absolute;inset:auto 0 0}@media (prefers-reduced-motion:reduce){.video-comparison-playback{display:none}.video-comparison-reveal,.video-comparison-divider{animation:none}}@media (width<=720px){.video-comparison-frame{border-radius:10px}}.video-comparison[data-priority] .video-comparison-poster{opacity:1}.video-comparison[data-priority][data-video-started=false] video,.video-comparison[data-priority][data-video-started=true] .video-comparison-poster{opacity:0}
