refactor: rename status color tokens to --sf-color-{status}-subtle/muted/strong

[jackgranatowski]

Replaces --sf-status-{status}-{bg|border|text} with the new
--sf-color-{status}-{subtle|muted|strong} convention so all color
tokens share a consistent --sf-color-* prefix.

Tokens remain in core/tokens.css — available without loading
optional/tokens.palette.css.

https://claude.ai/code/session_0115m6d38tanzv2hPVm2Pqju

Summary by CodeRabbit

• Style
  • Refactored design tokens for validation and feedback states to improve consistency across the design system.

[coderabbitai]

📝 Walkthrough

Walkthrough

This PR refactors the status color token system in the SLASHED CSS framework, replacing the old --sf-status-{status}-{bg,text,border} naming with a new --sf-color-{status}-{subtle,strong,muted} scheme. All consuming code is updated accordingly.

Changes

Status Token Refactor

Layer / File(s)	Summary
Core status token definitions core/tokens.css	--sf-status-*-{bg,text,border} variables are replaced with --sf-color-*-{subtle,strong,muted} for success, warning, error, info, and danger; subtle/muted use fixed-alpha derivations, strong uses light-dark mode-specific luminance-adjusted calculations.
Validation state classes consume new tokens core/states.css	.is-valid, .is-invalid, .is-warning, .is-success, .is-error, .is-info, .is-danger are updated to use --sf-color-*-strong tokens for text color instead of removed --sf-status-*-text tokens.
Demo and documentation updated docs/demo.html, optional/tokens.palette.css	Demo reduced-motion warning and status triplets preview use new --sf-color-*-subtle/strong/muted token names; palette documentation comment reflects the new token scheme.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~12 minutes

Possibly related PRs

• codeslash-dev/SLASHED#22: Design doc specifying the --sf-color-*-{subtle,muted,strong} status mini-palette naming approach that this PR implements.
• codeslash-dev/SLASHED#7: Prior modification to status color token definitions in core/tokens.css that this refactor builds upon.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The PR title accurately reflects the primary change: refactoring status color tokens from --sf-status-{status}-{bg|text|border} to --sf-color-{status}-{subtle|muted|strong} naming convention. This is the main focus across all modified files.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

_{✏️ Tip: You can configure your own custom pre-merge checks in the settings.}

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch claude/review-color-aliases-design-ttFXj

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint skipped: no ESLint configuration detected in root package.json. To enable, add eslint to devDependencies.

---

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@core/tokens.css`:
- Around line 237-270: The change removes public `--sf-status-*` properties and
breaks downstream themes; add temporary deprecated aliases that map each removed
`--sf-status-*` name to the new `--sf-color-*` triplet tokens (e.g. map the old
status variants for success, warning, error, info, danger to the new
--sf-color-*-subtle / --sf-color-*-strong / --sf-color-*-muted tokens used in
core/tokens.css such as --sf-color-success-subtle, --sf-color-success-strong,
--sf-color-success-muted), mark them as deprecated in comments, and keep these
aliases for at least one release before removal so consumers retain backward
compatibility.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro Plus

Run ID: 0c3785bd-9074-4abc-9d46-c56e86b0b0ab

📥 Commits

Reviewing files that changed from the base of the PR and between e109112 and e43e75f.

⛔ Files ignored due to path filters (1)

• dist/slashed.essential.css is excluded by !**/dist/**

📒 Files selected for processing (4)

• core/states.css
• core/tokens.css
• docs/demo.html
• optional/tokens.palette.css