feat: MSC4260 Report User, Bug #6 mutual exclusion, TDS toast compliance

- Add ReportUserModal.tsx — category dropdown + reason input, calls
  POST /_matrix/client/v3/users/{userId}/report via mx.http.authedRequest,
  inline success/error feedback, auto-closes 1500ms after success
- Wire Report User button into UserRoomProfile.tsx between UserModeration
  and UserDeviceSessions (hidden for own profile)
- Bug #6: enforce mutual exclusion between chat backgrounds and seasonal
  themes — ChatBgGrid clears seasonal→'off' on non-'none' pick;
  SeasonalBgGrid clears chatBackground→'none' on real theme pick;
  SeasonalEffect guards against legacy persisted state at render time
- TDS: strip all hardcoded hex/rgba fallbacks from LotusToastContainer.tsx
  (var(--lt-bg-card), --lt-accent-orange, --lt-text-primary/secondary,
  --lt-accent-orange-dim/border, --lt-box-glow-orange)
- Mark Bug #6 FIXED, MSC4260 DONE, toast TDS FIXED in LOTUS_BUGS.md and
  LOTUS_TODO.md; note EventReaders + CallControls already compliant

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

src/app/features/toast/LotusToastContainer.tsx

@@ -53,13 +53,13 @@ function ToastCard({ toast }: ToastCardProps) {
 
   const cardStyle: CSSProperties = {
     position: 'relative',
-    background: 'var(--lt-bg-card, #1a1a2e)',
-    border: '1px solid var(--lt-border-color, rgba(255,255,255,0.1))',
+    background: 'var(--lt-bg-card)',
+    border: '1px solid var(--lt-border-color)',
     borderRadius: '12px',
     padding: '12px 14px',
     minWidth: '280px',
     maxWidth: '340px',
-    boxShadow: 'var(--lt-box-glow-orange, 0 4px 16px rgba(0,0,0,0.4))',
+    boxShadow: 'var(--lt-box-glow-orange)',
     cursor: 'pointer',
     animation: 'lotusToastIn 0.2s ease-out both',
     userSelect: 'none',
@@ -84,19 +84,19 @@ function ToastCard({ toast }: ToastCardProps) {
     width: '24px',
     height: '24px',
     borderRadius: '50%',
-    background: 'var(--lt-accent-orange-dim, rgba(255,107,0,0.15))',
-    border: '1px solid var(--lt-accent-orange-border, rgba(255,107,0,0.35))',
+    background: 'var(--lt-accent-orange-dim)',
+    border: '1px solid var(--lt-accent-orange-border)',
     display: 'flex',
     alignItems: 'center',
     justifyContent: 'center',
     fontSize: '10px',
     fontWeight: 700,
-    color: 'var(--lt-accent-orange, #ff6b00)',
+    color: 'var(--lt-accent-orange)',
     flexShrink: 0,
   };
 
   const nameStyle: CSSProperties = {
-    color: 'var(--lt-accent-orange, #ff6b00)',
+    color: 'var(--lt-accent-orange)',
     fontWeight: 600,
     fontSize: '0.85rem',
     overflow: 'hidden',
@@ -110,7 +110,7 @@ function ToastCard({ toast }: ToastCardProps) {
     right: '10px',
     background: 'none',
     border: 'none',
-    color: 'var(--lt-text-secondary, #7fa3bf)',
+    color: 'var(--lt-text-secondary)',
     cursor: 'pointer',
     fontSize: '14px',
     lineHeight: 1,
@@ -119,7 +119,7 @@ function ToastCard({ toast }: ToastCardProps) {
   };
 
   const bodyStyle: CSSProperties = {
-    color: 'var(--lt-text-primary, #c4d9ee)',
+    color: 'var(--lt-text-primary)',
     fontSize: '0.82rem',
     margin: '4px 0 2px',
     overflow: 'hidden',
@@ -128,7 +128,7 @@ function ToastCard({ toast }: ToastCardProps) {
   };
 
   const roomNameStyle: CSSProperties = {
-    color: 'var(--lt-text-secondary, #7fa3bf)',
+    color: 'var(--lt-text-secondary)',
     fontSize: '0.75rem',
     overflow: 'hidden',
     textOverflow: 'ellipsis',