fix(#368): position section content with absolute coords to fix Safari icon placement

[MindFreeze]

Summary

• Drop the section-level <g transform="translate(…)"> in src/section.ts and fold section.offset into the cross-axis of colorRect, labelArea, and connector edges (nearEdge / midEdge / farEdge).
• v6.0.0 (fix!(#234): layout entities left-to-right in vertical mode #361) wrapped each section in <g transform> and rendered icons via <foreignObject> containing ha-icon. On WebKit (Safari, iOS), the nested <svg> inside ha-icon ignores ancestor SVG transforms, so icons paint at the chart's origin — clustered in a row at the top in vertical mode and a column on the left in horizontal mode. Plain HTML label content isn't affected by the same code path, which is why labels look correct in the screenshots while icons don't.
• After this change every drawable element has absolute x/y against the root SVG, so there's no ancestor transform for WebKit to mis-resolve. Visual output is unchanged on Chrome/Firefox.

Fixes #368. Likely also fixes #367.

Test plan

• npm run lint — clean (pre-existing warnings only)
• npm test — 95/95 pass after regenerating the two affected snapshots
• npm run build — succeeds
• Manual verification on iOS Safari / companion app in vertical mode (narrow viewport) — confirm icons sit on each node's color bar in every section, not bunched at the chart's top
• Manual verification on macOS Safari in horizontal mode — confirm icons sit to the left of each label in every section, not bunched in a column at x=0
• Quick regression check on Chrome/Firefox in both orientations — output should be visually identical to before this PR