## PALETTE'S JOURNAL - CRITICAL LEARNINGS ONLY ## 2026-02-13 - [Brand Color Contrast Failure] **Learning:** The brand color `#667eea` fails WCAG AA contrast (3.4:1) against white backgrounds, affecting accessibility for text headers and primary buttons. **Action:** Replace `#667eea` with `#4f46e5` (Indigo 600) which passes WCAG AA (5.5:1) while maintaining brand identity. Update all instances including `manifest.json`. ## 2026-02-26 - [Copy to Clipboard Micro-Interaction] **Learning:** Users frequently need to copy system identifiers (like bot handles) to share or search. Adding a dedicated copy button with immediate visual feedback (icon change to checkmark) significantly reduces friction compared to manual selection. **Action:** Identify other read-only data fields (IDs, keys, paths) that users might need to copy and apply this pattern. Ensure the success state resets after a short delay (e.g., 2s) and updates the aria-label for accessibility. ## 2026-02-27 - [External Link Micro-Interaction] **Learning:** Static external links often surprise users by opening new tabs without warning. Adding a consistent "external link" icon that animates (moves up-right) on hover provides a subtle, non-intrusive cue about the link's behavior (opening a new context). **Action:** Use the `.btn` class with `inline-flex` and the specific SVG icon pattern for all primary actions that lead to external services (Telegram, Exness, etc.). Ensure the icon is `aria-hidden` if the text label (or aria-label) already explicitly states "opens in new tab".