Matrix view: zoom controls so small screens can see the whole pyramid

The team pyramid overflows on phones. Add -/+/Fit zoom controls to the matrix
(pyramid) view that scale it via CSS zoom, defaulting to auto-fit so the whole
structure fits the screen width on load. Controls show only in pyramid mode,
re-fit on resize and when the dashboard tab opens, and guard against measuring
while the tab is hidden.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

public/styles.css

@@ -135,6 +135,8 @@ a{color:inherit}.wrap{width:min(1160px,calc(100% - 32px));margin:auto}.nav{heigh
 
 /* Admin matrix pyramid view */
 .mtp{display:flex;flex-direction:column;gap:14px;overflow-x:auto;padding:6px 2px 10px}
+.mt-zoom{display:inline-flex;gap:4px;align-items:center;background:rgba(13,34,54,.6);border:1px solid #2a4a66;border-radius:9px;padding:3px 4px}
+.mt-zbtn{min-width:30px;padding-left:0;padding-right:0;font-weight:800;font-size:16px;line-height:1}
 .mtp-row{display:flex;justify-content:center;gap:8px;min-width:max-content;margin:0 auto}
 .mtp-card{appearance:none;font:inherit;cursor:pointer;text-align:center;background:#0d2236;border:1px solid #2a4a66;border-radius:12px;padding:9px 10px;min-width:104px;color:var(--text);display:flex;flex-direction:column;gap:2px;align-items:center;transition:.15s ease}
 .mtp-card:hover{border-color:var(--teal);transform:translateY(-1px)}