[Obsidian review blockers] - Step 7: Remove CSS review violations

[logancyang]

Why

Obsidian's review flagged !important, relational :has() selectors, hard-coded colors, and other stylesheet patterns. This layer removes those blockers while preserving the existing UI precedence and mobile behavior.

Closes part of #285.

What changed

• Scope generated Tailwind utilities to body, allowing normal utilities to outrank Obsidian's generic component styles without !important.
• Remove component-level important modifiers and retain the one genuinely competing Miyo indent through explicit selector specificity.
• Replace the config-dialog parent :has() rule with an explicit modal host marker.
• Replace mobile navbar detection with navbar variables that intentionally have no fallback, so legacy mobile builds retain their original minimal spacing.
• Remove unused table :has() variants and normalize the source stylesheet to Obsidian theme tokens and review-compatible CSS.

Changed behavior

No intentional visual or interaction change. Existing compact inputs, modal edge-to-edge layout, component states, drag positioning, and mobile navbar clearance are retained through ordinary cascade specificity.

Non-goals

• This PR does not add the local review command or CI workflow; that is the final PR in the stack.
• This PR does not repair the pre-existing component-gallery esbuild configuration.

Screenshots

Not included. This is a stylesheet compliance pass intended to preserve rendering; scoped component tests, generated-CSS inspection, gallery CSS tests, Stylelint, and a production build provide the verification for this layer.

Verification

• npm run format
• changed-file ESLint with zero warnings
• Obsidian Stylelint config against src/styles/tailwind.css with zero warnings
• 13 focused suites / 119 tests passed
• gallery CSS and package-script suites: 4 tests passed
• npm run build
• generated styles.css contains neither !important nor :has(
• npm run gallery:build: story and CSS generation passed; the existing gallery esbuild step still fails on SVG loaders and browser-bundled Node modules

The repository-wide npm run lint still reports pre-existing test/tooling findings; the changed files are clean. The next PR introduces a source-scoped zero-warning review gate.

Risk

Risk	Mitigation
Raising Tailwind selector specificity changes cascade order	Utilities are scoped only by body, matching the precedence previously achieved with important modifiers; the production CSS build and focused component suites pass.
Legacy mobile builds gain navbar padding	Navbar declarations require Obsidian's --navbar-height and --navbar-bottom-offset; without them the declaration is invalid and the legacy padding rule remains active.
Config dialogs lose full-bleed bands	All three install-modal hosts add the explicit marker, and the shared shell test verifies it adds no padded wrapper.

Stack

• Previous: [Obsidian review blockers] - Step 2: Clear strict source errors #2788
• This PR: Step 7
• Next: local Obsidian review gate and CI enforcement

[chatgpt-codex-connector]

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: 90d840099b

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

• Open a pull request for review
• Mark a draft as ready
• Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

[chatgpt-codex-connector]

Preserve the full-bleed config-dialog gallery stories

When a ConfigDialogShell story is opened in the component gallery, GalleryStoryModal creates an ordinary ReactModal without copilot-config-modal; removing the shell marker therefore leaves the new CSS selectors unmatched, so the gallery renders Obsidian's title and padding around the shell, producing a duplicate heading and inset dividers instead of the production state. Add an explicit, reusable way for this story host to opt into the config-modal chrome rather than silently weakening the adjacent story.

AGENTS.md reference: AGENTS.md:L23-L23

Useful? React with 👍 / 👎.

[logancyang]

Valid for this abandoned CSS layer, but no longer applicable to the retained stack. PR #2789 was closed without merge; the current top stack at 3e257cb2 retains the copilot-config-dialog marker and the matching modal selectors, so production dialogs and gallery stories keep the full-bleed shell. I would not revive the warning-only CSS rewrite because avoiding that visual regression was the reason this layer was dropped.

[logancyang]

Conservative-scope risk note before merge:

The current CSS layer is too broad for a review-compliance-only issue. Global Tailwind body specificity, theme-token substitutions, and widespread utility changes can alter cascade, colors, stacking, mobile layout, and component appearance even if the intent is visual equivalence.

I am revising this PR to address only the review blockers that can be fixed locally and safely:

• remove the global Tailwind specificity change;
• preserve exact existing visual values instead of redesigning with theme tokens;
• replace relational selectors with explicit local host classes only where required;
• keep behavior-equivalent syntax normalization needed by error-level checks;
• leave warning-only CSS findings unresolved when removing them would risk UI behavior.

The revised branch will be verified on its own immediate base, without relying on a later PR to compensate for it.

[logancyang]

Closing this stack layer under the revised conservative priority.

Every finding addressed here is warning-level, while the proposed fixes alter global Tailwind specificity, component utility classes, colors, stacking, modal selectors, and mobile layout. That is disproportionate product risk for a review-only issue whose error-level findings can be cleared without changing UI.

The CSS warnings are intentionally deferred. The pre-submission gate will continue to report them, but they will not block until each can be removed with visual-equivalence evidence. No code from this PR should be merged.

[logancyang]

Conservative risk disposition

Risk: High — deferred and closed.

CSS warning cleanup can alter specificity, layout, interaction states, or theme compatibility even when the rules suggest mechanical replacements. The current CSS findings are warnings rather than approval-blocking errors.

Recommendation: leave this PR closed and address CSS warnings separately with targeted visual coverage. The CI gate will continue to report them without blocking this issue.