# Common Ground by MRHTML

A warm paper and cobalt neighborhood directory with six numbered fictional profiles, original architectural drawings, a schematic map, category and area filters, and temporary bookmarks.

## Local discovery and bookmarks

Filter by a literal phrase, category, area, or saved-only view. The count reports visible sample places out of the six existing entries. Save and remove bookmarks with each profile's button. Bookmarks exist only in memory for the current page load and are cleared on reload; there is no account or localStorage dependency. Reset filters keeps bookmarks, while Clear saved places removes the in-memory selection.

The map index links to the corresponding profile. If a profile is hidden, following its map link clears filters before focusing and scrolling to it. The map is an original schematic of fictional Northbank, Central, and Southbank areas, not a geocoded map or a real route. It makes no accessibility, opening-hours, review, booking, or verification claims.

Each profile includes a complete description and native expandable note explaining how to adapt that kind of entry. To use real places, confirm all descriptions and practical details with their operators, replace the sample map, and add accurate contact destinations. Directory submissions, real reviews, persistent bookmarks, and live maps are separate integrations.

## Open and publish

Extract the complete package and open `index.html` in a modern browser. Keep `styles.css` and `script.js` beside it. No installation, server, build, account, external font, CDN, or network connection is needed. All runtime data is authored in the HTML. No data is sent, stored in a browser database, or synchronized.

Edit content and data attributes in `index.html`, palette and responsive rules in `styles.css`, and local behavior in `script.js`. Theme variables are at the start of the design-specific CSS after the shared element defaults. Preserve unique IDs, matching local fragment links, accessible labels, and accurate example boundaries. Add or remove records in HTML and keep the described sample totals and chart values consistent with the revised dataset. JavaScript recomputes filter counts from existing DOM records.

Before publishing your customized site, replace fictional content and metadata, remove `<meta name="robots" content="noindex,follow" />`, and add an accurate canonical URL if appropriate. Upload the whole folder to a static host you control. Hosting and any real data integration are separate work. Test the published paths, content, mobile layouts, keyboard operation, and link destinations.

## Offline, script-free, and embedded behavior

The complete initial content and native disclosures remain readable without JavaScript. Enhancement-only filter, sort, bookmark, and preference controls stay hidden until their script loads. A noscript note explains the remaining reading behavior. The layouts support 320 CSS pixels; tables use their own scroll regions where needed, and article text wraps.

Enhanced fragment links scroll and focus local targets without changing browser history. The template works in an opaque iframe with `sandbox="allow-scripts"`, without forms, same-origin access, storage, popups, or top navigation. For `srcdoc`, inline the two local assets or supply deliberate resource paths. Script-free native fragment navigation is intended for the standalone file; a srcdoc document can inherit its parent's base URL.

Search input is capped at 120 characters and matched literally, ignoring case. Filter values come from local selects. Records are shown or hidden without inserting user HTML. No query is sent or retained. All interactive state resets when the page reloads. Browser-local storage is intentionally unused, so denied storage in an embedded preview does not break actions.

Keyboard focus styles, semantic landmarks, labels, status messages, and reduced-motion rules are included. Recheck after changing content and colors; this is not a claim of accessibility certification.

## Files and rights

- `index.html`: complete sample content and original artwork.
- `styles.css`: layout, theme, and responsive behavior.
- `script.js`: bounded local interactions, with no dependencies.
- `ASSETS.md`: original asset and typeface provenance.
- `LICENSE`: MIT license for original code, artwork, and documentation.

The visible `Designed by MRHTML` credit links to `https://mrhtml.com/` with `rel="nofollow"`. MIT requires retaining its copyright and permission notice in redistributed code; it does not require a website credit or followed link. The external credit is a navigation destination, not a runtime dependency.