Responsive CSS: mobile and desktop support for browser2 JS renderer

[Copilot]

The browser2 renderer had a fixed margin: 20px body, hardcoded 233px input widths, and no media queries — unusable on narrow viewports.

style.css

• Body: fluid layout (margin: 0; padding: 16px; margin-left/right: auto) centred at max-width: 1000px
• Inputs (text, password, email, select, textarea): replace hardcoded width: 233px with width: 100%; max-width: 400px; box-sizing: border-box
• .breadcrumb: display: flex; flex-wrap: wrap; gap: 4px
• .table-scroll-wrapper: overflow-x: auto; -webkit-overflow-scrolling: touch
• Mobile breakpoint ≤600px: tighter padding, slightly larger base font, stacked .form-table td, full-width buttons/inputs, reduced .lingo-container border, full-width .popup-content
• Tablet breakpoint 601–900px: medium padding, max-width: 300px on all form inputs
• Added breakpoint comment block at file top

markup.js

Wrap both <table> return paths in createValueElement (struct and table-format list) with <div class="table-scroll-wrapper">:

const wrapper = document.createElement('div');
wrapper.className = 'table-scroll-wrapper';
wrapper.appendChild(table);
return wrapper;

index.html

No change — viewport meta tag already present.

TODO.MD

Marked responsive CSS item as done.