Accessibility: add screen-reader-text styles

[shail-mehta]

Description

Part of #44 - Screen reader text supported

What

Adds the required .screen-reader-text CSS so text can be hidden visually while remaining available to assistive technologies. Styles land in style.css (front end) and assets/css/editor-style.css (editor canvas).

Why

Accessibility-ready themes must ship a documented, properly styled screen-reader text class that authors can apply via Additional CSS Class(es) without writing custom CSS (guideline, required CSS). Ipsum patterns already use .screen-reader-text (e.g. the Posts heading on the index), but the theme did not define the class.

How

• Hide content with clip-path: inset(50%) and the standard 1px absolutely positioned box (no display: none / visibility: hidden).
• On :focus, reveal focusable screen-reader text (skip links) using palette tokens (theme-1 / theme-6) so the chip stays readable across color variations.
• Mirror the hide rules in the editor stylesheet so authors can verify the class in the Site/Post editor.

Screenshots
Content with the class should be visually hidden; optional: before/after of a heading with screen-reader-text applied.

Testing Instructions

1. Activate Ipsum.
2. Open a post or page in the editor, insert a Heading, add any text, and in Advanced → Additional CSS Class add screen-reader-text.
3. Confirm the heading is hidden (or clearly clipped) in the editor canvas.
4. View the post on the front end and confirm the heading is not visible.
5. In DevTools, inspect the heading and confirm it uses the screen-reader hide CSS (clip-path, 1px size, etc.), not display: none or visibility: hidden.

Use of AI Tools
Cursor

[github-actions]

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: shail-mehta <shailu25@git.wordpress.org>
Co-authored-by: carolinan <poena@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

[carolinan]

@shail-mehta WordPress core already outputs the CSS for the screen-reader-text class for block themes.
https://github.com/WordPress/WordPress/blob/master/wp-includes/css/dist/block-library/common.css

That is why the theme did not include it.
Are there any bugs with the core CSS? I do not see anywhere in the theme where the class is used where the text is showing when its not supposed to show.
Please motivate why the core version is not sufficient for passing the requirements.

[shail-mehta]

Thanks @carolinan - you're right. Core already provides .screen-reader-text for block themes via block-library/common.css, and I don't see a case in Ipsum where that CSS fails. I'll close this PR and rely on core for the accessibility-ready requirement.