browser/openspec/changes/redesign-platform-web-themes-menu/proposal.md

Redesign platform web themes and menu

Summary

Redesign the platform web console shell so the default visual theme becomes a black mecha operations style, while the magical-girl theme remains available as a selectable theme with stronger magic-circle and sparkle effects.

Motivation

The previous shell used one magical-girl-leaning visual direction for all palettes. The requested direction requires two clearly distinct theme families:

• A default black mecha console for day-to-day game server operations.
• A selectable magical-girl theme matching the reference style: semi-transparent frosted-glass sidebar states, bold title treatment, brighter star borders, and more visible magic circles.

Theme differences must affect more than colors. Navigation surfaces, cards, panels, particle effects, frame materials, and theme documentation need to describe and enforce the new split.

Scope

• Change the default theme palette/background to a black mecha style.
• Keep magical-girl as an optional first-party theme.
• Rework the shell navigation into an expanded text sidebar and collapsed icon rail inspired by the provided references.
• Add a sidebar collapse / expand toggle.
• Strengthen theme-aware global effects in MagicalParticleLayer without canvas or expensive particle loops.
• Make shared framed surfaces visually differ between mecha and magical themes.
• Update theme documentation and tests.

Out of Scope

• Billing, cloud host sales, agent-provider marketplace workflows, or unrelated SaaS marketplace features.
• Third-party character art or bundled recognizable copyrighted assets.
• Replacing first-party console pages or changing backend behavior.

Verification

• Run theme unit tests.
• Run frontend typecheck/build where practical.
• Run scripts/check-structure.sh.
• Run openspec validate redesign-platform-web-themes-menu --strict.
• Perform a browser walkthrough for the changed shell/menu UI before claiming visual acceptance.