Fix host CSS breaking toolbar icons (#58)

[stevysmith]

Summary

• Scope svg[fill="none"] fill protection rules under .toolbar, .markersLayer, .fixedMarkersLayer, and .popup container classes to prevent leaking into host page SVGs (fixes the regression reported by @msllrs)
• Replace inline <style> tags in animated icons with CSS module classes to prevent host CSS like svg * { opacity: 1 !important } from overriding icon state transitions

What was broken

1. Global SVG fill leak — svg[fill="none"] { fill: none !important } was unscoped, breaking host SVGs that use fill="none" with CSS-based fills (e.g. Tailwind's fill-current)
2. Icon state overlap — inline <style> tags used global class names (.copy-icon, .check-icon) and inline style={{ opacity }} which host CSS could override, causing both icon states to render simultaneously

Changes

File	Change
icon-transitions.module.scss	New CSS module with scoped transition classes (.visible, .hidden, .sending)
icons.tsx	Replace 5 inline <style> tags + style={{ opacity }} with CSS module classNames
page-toolbar-css/styles.module.scss	Scope fill protection under .toolbar, .markersLayer, .fixedMarkersLayer
annotation-popup-css/styles.module.scss	Scope fill protection under .popup

How it works

CSS module class names are hashed at build time (e.g. .hidden___ETykt), so they can't collide with host page styles. The !important on opacity gives specificity 0,1,0 which beats common host rules like svg * { opacity: 1 !important } at 0,0,1.

Closes #58

[vercel]

@stevysmith is attempting to deploy a commit to the Benji Taylor's Projects Team on Vercel.

A member of the Team first needs to authorize it.