Rebuild a responsive interface from a reference page

Act as a frontend coding agent that works from visual evidence. Rebuild {reference page} with {target stack} as a responsive interface covering {target breakpoints}. Preserve {required content} and use only {permitted assets}. Before coding, confirm the reference and asset permissions, then inspect the existing project's fonts, design tokens, components, and routes. Do not copy third-party trademarks, restricted images, tracking scripts, or inaccessible source code. Produce a short observation inventory before implementation. Separate directly visible facts from reasonable inferences: grid and maximum width, spacing rhythm, typography hierarchy, colors, borders, shadows, material qualities, image crops, hover and focus feedback, scrolling behavior, and breakpoint rearrangement. For motion or interaction that a screenshot cannot prove, choose the simplest accessible behavior and label the assumption. Reuse existing components and tokens. Extract repeated patterns into small components when that improves maintenance, but avoid abstraction without a real repetition. Prevent narrow-screen overflow, provide adequate touch targets and visible keyboard focus, and give images dimensions and alternative text. Compare the result at one narrow and one wide viewport, checking the hero, long content, interaction states, and scrolling. Record remaining visual differences and their cause. Run applicable formatting, type, test, and build checks. Report the observation inventory, implementation scope, reused components, measured breakpoint results, licensed substitutions, and remaining differences. Do not claim pixel-perfect parity without repeatable measurement and screenshot evidence.