xRangerDEandClaude Opus 4.7
12fd2b7217
Audit turned up 20 raw `<input type="checkbox">` in Settings still rendering with OS-default gray-square look — and most `<select>` elements showing the OS-default dropdown arrow. With the rest of the UI now Twitch-themed (purple inputs, modal pops, animated everything), those felt jarringly out of place. Checkbox: 16px rounded square, dark base with 1.5px border, hovers to a purple-tinted border, fills purple + draws a CSS-only white check on the diagonal when checked, scales down briefly on click, focus shows the same 3px purple ring as the text inputs. No JS, just :checked + ::after. Select: appearance:none everywhere to kill the OS chevron, then an inline-SVG chevron in background-image at right:8px (gray default, purple on hover). padding-right boosted to 28px so option text never overlaps the arrow. The dropdown menu itself still uses the OS list, but the closed control matches the rest of the input family now. Cascades globally via input[type="checkbox"] / select selectors — no markup edits needed. The few selects/checkboxes that previously had inline accent-color overrides keep working because accent-color applies to native widgets, which we have now replaced. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>