diff --git a/rulesdocs/refector_rules_and_tracking.md b/rulesdocs/refector_rules_and_tracking.md
index e9f9a00a..af1dadd2 100644
--- a/rulesdocs/refector_rules_and_tracking.md
+++ b/rulesdocs/refector_rules_and_tracking.md
@@ -22,6 +22,9 @@
 - Every component must live in its own folder, even when it remains a single-file implementation.
 - Split large JSX/components and large backing JS files into folderized modules.
 - Keep modules clear and focused, with title comments.
+- Every component/module file should start with a descriptive comment header containing:
+- a title line naming the file/module
+- a longer purpose/scope description (not a one-liner)
 - Each component must live entirely inside its own folder; do not leave wrapper/compatibility component files outside that folder.
 - Remove stale compatibility/leftover code only after usage verification.
 
diff --git a/webui/src/components/AdminPanel/AdminIpLogPanel.jsx b/webui/src/components/AdminPanel/AdminIpLogPanel.jsx
index 0c800407..1adbe1a6 100644
--- a/webui/src/components/AdminPanel/AdminIpLogPanel.jsx
+++ b/webui/src/components/AdminPanel/AdminIpLogPanel.jsx
@@ -1,4 +1,6 @@
-// Admin-only IP log stream panel.
+// Admin Ip Log Panel
+// Purpose: Defines the Admin Ip Log Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export default function AdminIpLogPanel({ entries }) {
   const logs = entries || [];
   return (
diff --git a/webui/src/components/AdminPanel/AdminPanelContent.jsx b/webui/src/components/AdminPanel/AdminPanelContent.jsx
index 840b8ad1..aa784424 100644
--- a/webui/src/components/AdminPanel/AdminPanelContent.jsx
+++ b/webui/src/components/AdminPanel/AdminPanelContent.jsx
@@ -1,4 +1,6 @@
-// Admin control panel main composition and action handlers.
+// Admin Panel Content
+// Purpose: Defines the Admin Panel Content module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useMemo, useState } from 'react';
 import { useSession } from '../../context/SessionContext.jsx';
 import RoverRoster from '../RoverRoster/index.jsx';
diff --git a/webui/src/components/AdminPanel/LlmCommentaryPanel.jsx b/webui/src/components/AdminPanel/LlmCommentaryPanel.jsx
index 2aa4ccf6..2c95b708 100644
--- a/webui/src/components/AdminPanel/LlmCommentaryPanel.jsx
+++ b/webui/src/components/AdminPanel/LlmCommentaryPanel.jsx
@@ -1,4 +1,6 @@
-// Admin LLM commentary monitor panel.
+// Llm Commentary Panel
+// Purpose: Defines the Llm Commentary Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useState } from 'react';
 import ChatMessageRow from '../ChatMessageRow/index.jsx';
 import { buildLlmLargeIndicatorFromState, buildLlmConversationRowsFromMessages } from './llmHelpers.js';
diff --git a/webui/src/components/AdminPanel/ReplaySnapshotHealth.jsx b/webui/src/components/AdminPanel/ReplaySnapshotHealth.jsx
index e3e1a92a..28ee175a 100644
--- a/webui/src/components/AdminPanel/ReplaySnapshotHealth.jsx
+++ b/webui/src/components/AdminPanel/ReplaySnapshotHealth.jsx
@@ -1,4 +1,6 @@
-// Replay and snapshot health status panel.
+// Replay Snapshot Health
+// Purpose: Defines the Replay Snapshot Health module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { roverNameChromeStyle } from '../../lib/roverColor.js';
 
 export default function ReplaySnapshotHealth({ health, roster = [] }) {
diff --git a/webui/src/components/AdminPanel/index.jsx b/webui/src/components/AdminPanel/index.jsx
index 9dd7ae69..135d2d74 100644
--- a/webui/src/components/AdminPanel/index.jsx
+++ b/webui/src/components/AdminPanel/index.jsx
@@ -1,3 +1,6 @@
+// Admin Panel
+// Purpose: Defines the Admin Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import AdminPanelContent from './AdminPanelContent.jsx';
 
 export default AdminPanelContent;
diff --git a/webui/src/components/AdminPanel/llmHelpers.js b/webui/src/components/AdminPanel/llmHelpers.js
index 3cd0ca47..aa466295 100644
--- a/webui/src/components/AdminPanel/llmHelpers.js
+++ b/webui/src/components/AdminPanel/llmHelpers.js
@@ -1,4 +1,6 @@
-// LLM commentary monitor formatting helpers.
+// llm Helpers
+// Purpose: Defines the llm Helpers module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export function buildLlmLargeIndicatorFromState(state) {
   const runtime = state?.runtime || {};
   const output = state?.output || {};
diff --git a/webui/src/components/AlertFeed/index.jsx b/webui/src/components/AlertFeed/index.jsx
index 15eea377..63a17f5d 100644
--- a/webui/src/components/AlertFeed/index.jsx
+++ b/webui/src/components/AlertFeed/index.jsx
@@ -1,3 +1,6 @@
+// Alert Feed
+// Purpose: Defines the Alert Feed module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useMemo, useState } from 'react';
 import { useSessionActions, useSessionSelector } from '../../context/SessionContext.jsx';
 import { useSocket } from '../../context/SocketContext.jsx';
diff --git a/webui/src/components/AuthPanel/index.jsx b/webui/src/components/AuthPanel/index.jsx
index 02094a7f..98e5b93e 100644
--- a/webui/src/components/AuthPanel/index.jsx
+++ b/webui/src/components/AuthPanel/index.jsx
@@ -1,3 +1,6 @@
+// Auth Panel
+// Purpose: Defines the Auth Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useState } from 'react';
 import { useSessionActions } from '../../context/SessionContext.jsx';
 
diff --git a/webui/src/components/BatteryBar/index.jsx b/webui/src/components/BatteryBar/index.jsx
index 45bb2ea8..fd93e845 100644
--- a/webui/src/components/BatteryBar/index.jsx
+++ b/webui/src/components/BatteryBar/index.jsx
@@ -1,3 +1,6 @@
+// Battery Bar
+// Purpose: Defines the Battery Bar module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { WARN_DISPLAY_PERCENT } from '../../lib/battery.js';
 
 const WARN_FLASH_MS = 1600;
diff --git a/webui/src/components/ButtonBoxPanel/index.jsx b/webui/src/components/ButtonBoxPanel/index.jsx
index 0ba493e1..d4fa117b 100644
--- a/webui/src/components/ButtonBoxPanel/index.jsx
+++ b/webui/src/components/ButtonBoxPanel/index.jsx
@@ -1,3 +1,6 @@
+// Button Box Panel
+// Purpose: Defines the Button Box Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { useSession } from '../../context/SessionContext.jsx';
 import { useSocket } from '../../context/SocketContext.jsx';
diff --git a/webui/src/components/ButtonBoxTile/index.jsx b/webui/src/components/ButtonBoxTile/index.jsx
index 26a79585..e471f8e2 100644
--- a/webui/src/components/ButtonBoxTile/index.jsx
+++ b/webui/src/components/ButtonBoxTile/index.jsx
@@ -1,3 +1,6 @@
+// Button Box Tile
+// Purpose: Defines the Button Box Tile module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export default function ButtonBoxTile({
   buttonId,
   count,
diff --git a/webui/src/components/CameraTiltControl/index.jsx b/webui/src/components/CameraTiltControl/index.jsx
index f5c5498b..0e130545 100644
--- a/webui/src/components/CameraTiltControl/index.jsx
+++ b/webui/src/components/CameraTiltControl/index.jsx
@@ -1,3 +1,6 @@
+// Camera Tilt Control
+// Purpose: Defines the Camera Tilt Control module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useRef, useState } from 'react';
 
 function formatDegrees(value) {
diff --git a/webui/src/components/ChatMessageRow/index.jsx b/webui/src/components/ChatMessageRow/index.jsx
index c0e252f5..7cdbb03a 100644
--- a/webui/src/components/ChatMessageRow/index.jsx
+++ b/webui/src/components/ChatMessageRow/index.jsx
@@ -1,3 +1,6 @@
+// Chat Message Row
+// Purpose: Defines the Chat Message Row module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { FaDiscord } from 'react-icons/fa';
 import { roverBadgeStyle } from '../../lib/roverColor.js';
 
diff --git a/webui/src/components/ChatPanel/index.jsx b/webui/src/components/ChatPanel/index.jsx
index 3f599030..6f33c21a 100644
--- a/webui/src/components/ChatPanel/index.jsx
+++ b/webui/src/components/ChatPanel/index.jsx
@@ -1,3 +1,6 @@
+// Chat Panel
+// Purpose: Defines the Chat Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { useChat } from '../../context/ChatContext.jsx';
 import { useSessionSelector } from '../../context/SessionContext.jsx';
diff --git a/webui/src/components/ChatTypingRow/index.jsx b/webui/src/components/ChatTypingRow/index.jsx
index 6c5764a6..6a17022a 100644
--- a/webui/src/components/ChatTypingRow/index.jsx
+++ b/webui/src/components/ChatTypingRow/index.jsx
@@ -1,3 +1,6 @@
+// Chat Typing Row
+// Purpose: Defines the Chat Typing Row module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { ChatIdentity, chatRowClass } from '../ChatMessageRow/index.jsx';
 
 export default function ChatTypingRow({ message }) {
diff --git a/webui/src/components/CommunityGoalBanner/index.jsx b/webui/src/components/CommunityGoalBanner/index.jsx
index dd53fb08..85bf705e 100644
--- a/webui/src/components/CommunityGoalBanner/index.jsx
+++ b/webui/src/components/CommunityGoalBanner/index.jsx
@@ -1,3 +1,6 @@
+// Community Goal Banner
+// Purpose: Defines the Community Goal Banner module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { useSession } from '../../context/SessionContext.jsx';
 
diff --git a/webui/src/components/DeterrenceChaos/index.jsx b/webui/src/components/DeterrenceChaos/index.jsx
index c8ea5b41..c965e7ae 100644
--- a/webui/src/components/DeterrenceChaos/index.jsx
+++ b/webui/src/components/DeterrenceChaos/index.jsx
@@ -1,3 +1,6 @@
+// Deterrence Chaos
+// Purpose: Defines the Deterrence Chaos module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect } from 'react';
 import { useSessionSelector } from '../../context/SessionContext.jsx';
 
diff --git a/webui/src/components/DriveDockAction/index.jsx b/webui/src/components/DriveDockAction/index.jsx
index 52f896cc..d1df0df5 100644
--- a/webui/src/components/DriveDockAction/index.jsx
+++ b/webui/src/components/DriveDockAction/index.jsx
@@ -1,3 +1,6 @@
+// Drive Dock Action
+// Purpose: Defines the Drive Dock Action module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useMemo, useState } from 'react';
 import { useControlSystem } from '../../controls/index.js';
 import { useTelemetryFrame } from '../../context/TelemetryContext.jsx';
diff --git a/webui/src/components/DriverVideoPanel/index.jsx b/webui/src/components/DriverVideoPanel/index.jsx
index 2d2ae008..8b0da03b 100644
--- a/webui/src/components/DriverVideoPanel/index.jsx
+++ b/webui/src/components/DriverVideoPanel/index.jsx
@@ -1,3 +1,6 @@
+// Driver Video Panel
+// Purpose: Defines the Driver Video Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { useSessionSelector } from '../../context/SessionContext.jsx';
 import { useTelemetryFrame } from '../../context/TelemetryContext.jsx';
diff --git a/webui/src/components/FloatingFullscreenButton/index.jsx b/webui/src/components/FloatingFullscreenButton/index.jsx
index fd264bd6..7e504213 100644
--- a/webui/src/components/FloatingFullscreenButton/index.jsx
+++ b/webui/src/components/FloatingFullscreenButton/index.jsx
@@ -1,3 +1,6 @@
+// Floating Fullscreen Button
+// Purpose: Defines the Floating Fullscreen Button module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export default function FloatingFullscreenButton({ side = 'right', onClick }) {
   const sideClass = side === 'left' ? 'left-2' : 'right-2';
   return (
diff --git a/webui/src/components/FullscreenPrompt/index.jsx b/webui/src/components/FullscreenPrompt/index.jsx
index ca8071c7..99999e21 100644
--- a/webui/src/components/FullscreenPrompt/index.jsx
+++ b/webui/src/components/FullscreenPrompt/index.jsx
@@ -1,3 +1,6 @@
+// Fullscreen Prompt
+// Purpose: Defines the Fullscreen Prompt module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export default function FullscreenPrompt({ visible, mode, onEnterFullscreen, onDismiss }) {
   if (!visible) return null;
   const isIOSMode = mode === 'pwa-hint';
diff --git a/webui/src/components/GamepadMappingSettings/GamepadMappingSettingsContent.jsx b/webui/src/components/GamepadMappingSettings/GamepadMappingSettingsContent.jsx
index c7702b0a..4d3ee2c5 100644
--- a/webui/src/components/GamepadMappingSettings/GamepadMappingSettingsContent.jsx
+++ b/webui/src/components/GamepadMappingSettings/GamepadMappingSettingsContent.jsx
@@ -1,3 +1,6 @@
+// Gamepad Mapping Settings Content
+// Purpose: Defines the Gamepad Mapping Settings Content module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { useSettingsNamespace } from '../../settings/index.js';
 import { GAMEPAD_PROFILE_DEFAULT, GAMEPAD_SETTINGS_DEFAULTS } from '../../settings/namespaces.js';
diff --git a/webui/src/components/GamepadMappingSettings/SliderField.jsx b/webui/src/components/GamepadMappingSettings/SliderField.jsx
index f479451c..38ca56e7 100644
--- a/webui/src/components/GamepadMappingSettings/SliderField.jsx
+++ b/webui/src/components/GamepadMappingSettings/SliderField.jsx
@@ -1,4 +1,6 @@
-// Reusable slider field for gamepad calibration controls.
+// Slider Field
+// Purpose: Defines the Slider Field module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { NUMBER_FORMAT } from './constants.js';
 
 export default function SliderField({ label, description, min, max, step, value, onChange }) {
diff --git a/webui/src/components/GamepadMappingSettings/constants.js b/webui/src/components/GamepadMappingSettings/constants.js
index 4d3c9c45..ef3bcada 100644
--- a/webui/src/components/GamepadMappingSettings/constants.js
+++ b/webui/src/components/GamepadMappingSettings/constants.js
@@ -1,4 +1,6 @@
-// Gamepad mapping constants and action catalog.
+// constants
+// Purpose: Defines the constants module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export const NUMBER_FORMAT = new Intl.NumberFormat(undefined, { maximumFractionDigits: 2 });
 
 export const ACTIONS = [
diff --git a/webui/src/components/GamepadMappingSettings/helpers.js b/webui/src/components/GamepadMappingSettings/helpers.js
index 031e5663..4e162666 100644
--- a/webui/src/components/GamepadMappingSettings/helpers.js
+++ b/webui/src/components/GamepadMappingSettings/helpers.js
@@ -1,4 +1,6 @@
-// Gamepad mapping helper and capture functions.
+// helpers
+// Purpose: Defines the helpers module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { CAPTURE_AXIS_THRESHOLD, CAPTURE_BUTTON_THRESHOLD, NUMBER_FORMAT } from './constants.js';
 
 export function formatSource(source) {
diff --git a/webui/src/components/GamepadMappingSettings/index.jsx b/webui/src/components/GamepadMappingSettings/index.jsx
index 17d67c64..9d13118c 100644
--- a/webui/src/components/GamepadMappingSettings/index.jsx
+++ b/webui/src/components/GamepadMappingSettings/index.jsx
@@ -1,3 +1,6 @@
+// Gamepad Mapping Settings
+// Purpose: Defines the Gamepad Mapping Settings module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import GamepadMappingSettingsContent from './GamepadMappingSettingsContent.jsx';
 
 export default GamepadMappingSettingsContent;
diff --git a/webui/src/components/HelpContentView/index.jsx b/webui/src/components/HelpContentView/index.jsx
index f003dfff..4ebf62fa 100644
--- a/webui/src/components/HelpContentView/index.jsx
+++ b/webui/src/components/HelpContentView/index.jsx
@@ -1,3 +1,6 @@
+// Help Content View
+// Purpose: Defines the Help Content View module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useMemo } from 'react';
 import { formatKeyLabel } from '../../controls/keymapUtils.js';
 import { getHelpContent } from '../../help/content.js';
diff --git a/webui/src/components/HelpOverlay/index.jsx b/webui/src/components/HelpOverlay/index.jsx
index bb170a5d..693cd5ec 100644
--- a/webui/src/components/HelpOverlay/index.jsx
+++ b/webui/src/components/HelpOverlay/index.jsx
@@ -1,3 +1,6 @@
+// Help Overlay
+// Purpose: Defines the Help Overlay module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useControlSystem } from '../../controls/index.js';
 import HelpContentView from '../HelpContentView/index.jsx';
 
diff --git a/webui/src/components/HelpPanel/index.jsx b/webui/src/components/HelpPanel/index.jsx
index 1c47438c..5be08861 100644
--- a/webui/src/components/HelpPanel/index.jsx
+++ b/webui/src/components/HelpPanel/index.jsx
@@ -1,3 +1,6 @@
+// Help Panel
+// Purpose: Defines the Help Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useControlSystem } from '../../controls/index.js';
 import HelpContentView from '../HelpContentView/index.jsx';
 
diff --git a/webui/src/components/HomeAssistantControls/index.jsx b/webui/src/components/HomeAssistantControls/index.jsx
index 4f9f5219..26cfafed 100644
--- a/webui/src/components/HomeAssistantControls/index.jsx
+++ b/webui/src/components/HomeAssistantControls/index.jsx
@@ -1,3 +1,6 @@
+// Home Assistant Controls
+// Purpose: Defines the Home Assistant Controls module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useMemo, useRef, useState } from 'react';
 import { useSessionActions, useSessionSelector } from '../../context/SessionContext.jsx';
 import { useControlSystem } from '../../controls/index.js';
diff --git a/webui/src/components/HornControl/index.jsx b/webui/src/components/HornControl/index.jsx
index 68dc5588..67b1f4ff 100644
--- a/webui/src/components/HornControl/index.jsx
+++ b/webui/src/components/HornControl/index.jsx
@@ -1,3 +1,6 @@
+// Horn Control
+// Purpose: Defines the Horn Control module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useCallback, useEffect, useMemo, useState } from 'react';
 import { useSettingsNamespace } from '../../settings/index.js';
 import { HORN_SETTINGS_DEFAULTS } from '../../settings/namespaces.js';
diff --git a/webui/src/components/KeymapSettings/index.jsx b/webui/src/components/KeymapSettings/index.jsx
index 73d941d1..653506b9 100644
--- a/webui/src/components/KeymapSettings/index.jsx
+++ b/webui/src/components/KeymapSettings/index.jsx
@@ -1,3 +1,6 @@
+// Keymap Settings
+// Purpose: Defines the Keymap Settings module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useMemo, useState, useEffect, useCallback } from 'react';
 import { useControlSystem } from '../../controls/index.js';
 import { DEFAULT_KEYMAP } from '../../controls/constants.js';
diff --git a/webui/src/components/LogPanel/index.jsx b/webui/src/components/LogPanel/index.jsx
index 5a919f62..bb3ddc31 100644
--- a/webui/src/components/LogPanel/index.jsx
+++ b/webui/src/components/LogPanel/index.jsx
@@ -1,3 +1,6 @@
+// Log Panel
+// Purpose: Defines the Log Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useSessionSelector } from '../../context/SessionContext.jsx';
 
 export default function LogPanel() {
diff --git a/webui/src/components/MobileControls/FloatingJoystick.jsx b/webui/src/components/MobileControls/FloatingJoystick.jsx
index 0cc207d3..e7a4bf17 100644
--- a/webui/src/components/MobileControls/FloatingJoystick.jsx
+++ b/webui/src/components/MobileControls/FloatingJoystick.jsx
@@ -1,4 +1,6 @@
-// Floating on-screen joystick used for mobile driving.
+// Floating Joystick
+// Purpose: Defines the Floating Joystick module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useCallback, useEffect, useRef, useState } from 'react';
 import { clampUnit } from '../../controls/controlMath.js';
 
diff --git a/webui/src/components/MobileControls/MobileAuxButton.jsx b/webui/src/components/MobileControls/MobileAuxButton.jsx
index 9ca6528b..b1f42b30 100644
--- a/webui/src/components/MobileControls/MobileAuxButton.jsx
+++ b/webui/src/components/MobileControls/MobileAuxButton.jsx
@@ -1,4 +1,6 @@
-// Hold-to-run aux motor button for mobile controls.
+// Mobile Aux Button
+// Purpose: Defines the Mobile Aux Button module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export default function MobileAuxButton({ id, label, values, color, disabled, onPress, onRelease }) {
   return (
     <button
diff --git a/webui/src/components/MobileControls/MobileControlsContent.jsx b/webui/src/components/MobileControls/MobileControlsContent.jsx
index ec523a8e..7d90a2b9 100644
--- a/webui/src/components/MobileControls/MobileControlsContent.jsx
+++ b/webui/src/components/MobileControls/MobileControlsContent.jsx
@@ -1,4 +1,6 @@
-// Mobile controls layout and interaction wiring.
+// Mobile Controls Content
+// Purpose: Defines the Mobile Controls Content module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useCallback, useEffect, useRef } from 'react';
 import { useControlSystem } from '../../controls/index.js';
 import { clampUnit } from '../../controls/controlMath.js';
diff --git a/webui/src/components/MobileControls/constants.js b/webui/src/components/MobileControls/constants.js
index bffabaa3..acc72743 100644
--- a/webui/src/components/MobileControls/constants.js
+++ b/webui/src/components/MobileControls/constants.js
@@ -1,4 +1,6 @@
-// Mobile controls constants.
+// constants
+// Purpose: Defines the constants module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export const SOURCE = 'mobile-joystick';
 export const JOYSTICK_RADIUS = 80;
 export const JOYSTICK_SMOOTHING = 0.15;
diff --git a/webui/src/components/MobileControls/index.jsx b/webui/src/components/MobileControls/index.jsx
index 940cdc1c..2e2210cb 100644
--- a/webui/src/components/MobileControls/index.jsx
+++ b/webui/src/components/MobileControls/index.jsx
@@ -1,3 +1,6 @@
+// Mobile Controls
+// Purpose: Defines the Mobile Controls module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import MobilePortraitControls, { MobileActionsColumn, MobileDriveColumn } from './MobileControlsContent.jsx';
 
 export { MobileActionsColumn, MobileDriveColumn };
diff --git a/webui/src/components/ModeGateOverlay/index.jsx b/webui/src/components/ModeGateOverlay/index.jsx
index 47d662d3..24def640 100644
--- a/webui/src/components/ModeGateOverlay/index.jsx
+++ b/webui/src/components/ModeGateOverlay/index.jsx
@@ -1,3 +1,6 @@
+// Mode Gate Overlay
+// Purpose: Defines the Mode Gate Overlay module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useMemo, useState } from 'react';
 import AuthPanel from '../AuthPanel/index.jsx';
 import { useSessionSelector } from '../../context/SessionContext.jsx';
diff --git a/webui/src/components/NicknameForm/index.jsx b/webui/src/components/NicknameForm/index.jsx
index da29508e..be5b033d 100644
--- a/webui/src/components/NicknameForm/index.jsx
+++ b/webui/src/components/NicknameForm/index.jsx
@@ -1,3 +1,6 @@
+// Nickname Form
+// Purpose: Defines the Nickname Form module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useState } from 'react';
 import { useSession } from '../../context/SessionContext.jsx';
 import { useSettingsNamespace } from '../../settings/index.js';
diff --git a/webui/src/components/NightVisionControl/index.jsx b/webui/src/components/NightVisionControl/index.jsx
index fa4d2916..b3d3dc94 100644
--- a/webui/src/components/NightVisionControl/index.jsx
+++ b/webui/src/components/NightVisionControl/index.jsx
@@ -1,3 +1,6 @@
+// Night Vision Control
+// Purpose: Defines the Night Vision Control module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useMemo, useState } from 'react';
 
 function isBoolean(value) {
diff --git a/webui/src/components/OvercurrentLimiterPanel/index.jsx b/webui/src/components/OvercurrentLimiterPanel/index.jsx
index cfdb9f94..93b83409 100644
--- a/webui/src/components/OvercurrentLimiterPanel/index.jsx
+++ b/webui/src/components/OvercurrentLimiterPanel/index.jsx
@@ -1,3 +1,6 @@
+// Overcurrent Limiter Panel
+// Purpose: Defines the Overcurrent Limiter Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useMemo } from 'react';
 import { useControlSystem } from '../../controls/index.js';
 import { OVERCURRENT_GROUPS } from '../../controls/overcurrentLimiter.js';
diff --git a/webui/src/components/RawUserPilePanel/index.jsx b/webui/src/components/RawUserPilePanel/index.jsx
index 4f836c8f..1a9d790d 100644
--- a/webui/src/components/RawUserPilePanel/index.jsx
+++ b/webui/src/components/RawUserPilePanel/index.jsx
@@ -1,3 +1,6 @@
+// Raw User Pile Panel
+// Purpose: Defines the Raw User Pile Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useMemo } from 'react';
 import { useSession } from '../../context/SessionContext.jsx';
 import NicknameForm from '../NicknameForm/index.jsx';
diff --git a/webui/src/components/ReplaySourcesPanel/index.jsx b/webui/src/components/ReplaySourcesPanel/index.jsx
index f1f27678..0fe09416 100644
--- a/webui/src/components/ReplaySourcesPanel/index.jsx
+++ b/webui/src/components/ReplaySourcesPanel/index.jsx
@@ -1,3 +1,6 @@
+// Replay Sources Panel
+// Purpose: Defines the Replay Sources Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useMemo, useState } from 'react';
 import { useSession } from '../../context/SessionContext.jsx';
 import { useSettingsNamespace } from '../../settings/index.js';
diff --git a/webui/src/components/RewardRunOverlay/index.jsx b/webui/src/components/RewardRunOverlay/index.jsx
index f3aa46ba..7750b16d 100644
--- a/webui/src/components/RewardRunOverlay/index.jsx
+++ b/webui/src/components/RewardRunOverlay/index.jsx
@@ -1,3 +1,6 @@
+// Reward Run Overlay
+// Purpose: Defines the Reward Run Overlay module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useRef, useState } from 'react';
 import { useSocket } from '../../context/SocketContext.jsx';
 import { useSettingsNamespace } from '../../settings/index.js';
diff --git a/webui/src/components/RightPaneTabs/index.jsx b/webui/src/components/RightPaneTabs/index.jsx
index 1e567344..492ef0e9 100644
--- a/webui/src/components/RightPaneTabs/index.jsx
+++ b/webui/src/components/RightPaneTabs/index.jsx
@@ -1,3 +1,6 @@
+// Right Pane Tabs
+// Purpose: Defines the Right Pane Tabs module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import RoomCameraPanel from '../RoomCameraPanel/index.jsx';
 import HomeAssistantControls from '../HomeAssistantControls/index.jsx';
 import SettingsPanel from '../SettingsPanel/index.jsx';
diff --git a/webui/src/components/RoomCameraFeed/index.jsx b/webui/src/components/RoomCameraFeed/index.jsx
index 51296528..84e2871d 100644
--- a/webui/src/components/RoomCameraFeed/index.jsx
+++ b/webui/src/components/RoomCameraFeed/index.jsx
@@ -1,3 +1,6 @@
+// Room Camera Feed
+// Purpose: Defines the Room Camera Feed module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useMemo, useState } from 'react';
 
 export default function RoomCameraFeed({ feed, label }) {
diff --git a/webui/src/components/RoomCameraPanel/index.jsx b/webui/src/components/RoomCameraPanel/index.jsx
index f71ae610..25a4e353 100644
--- a/webui/src/components/RoomCameraPanel/index.jsx
+++ b/webui/src/components/RoomCameraPanel/index.jsx
@@ -1,3 +1,6 @@
+// Room Camera Panel
+// Purpose: Defines the Room Camera Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useState } from 'react';
 import { useSession } from '../../context/SessionContext.jsx';
 import { useSettingsNamespace } from '../../settings/index.js';
diff --git a/webui/src/components/RoverQueuesPanel/index.jsx b/webui/src/components/RoverQueuesPanel/index.jsx
index f00e1bb5..7f37aaf2 100644
--- a/webui/src/components/RoverQueuesPanel/index.jsx
+++ b/webui/src/components/RoverQueuesPanel/index.jsx
@@ -1,3 +1,6 @@
+// Rover Queues Panel
+// Purpose: Defines the Rover Queues Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useMemo, useState } from 'react';
 import { useSessionActions, useSessionSelector } from '../../context/SessionContext.jsx';
 import { roverNameChromeStyle } from '../../lib/roverColor.js';
diff --git a/webui/src/components/RoverRoster/index.jsx b/webui/src/components/RoverRoster/index.jsx
index 19cc521d..6ed8c541 100644
--- a/webui/src/components/RoverRoster/index.jsx
+++ b/webui/src/components/RoverRoster/index.jsx
@@ -1,3 +1,6 @@
+// Rover Roster
+// Purpose: Defines the Rover Roster module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { roverNameChromeStyle } from '../../lib/roverColor.js';
 
 function classNames(...values) {
diff --git a/webui/src/components/SessionSnapshot/index.jsx b/webui/src/components/SessionSnapshot/index.jsx
index b25409ba..0064566a 100644
--- a/webui/src/components/SessionSnapshot/index.jsx
+++ b/webui/src/components/SessionSnapshot/index.jsx
@@ -1,3 +1,6 @@
+// Session Snapshot
+// Purpose: Defines the Session Snapshot module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useMemo } from 'react';
 import { useSession } from '../../context/SessionContext.jsx';
 
diff --git a/webui/src/components/SettingsPanel/index.jsx b/webui/src/components/SettingsPanel/index.jsx
index 6c6fa7c4..ad811c0e 100644
--- a/webui/src/components/SettingsPanel/index.jsx
+++ b/webui/src/components/SettingsPanel/index.jsx
@@ -1,3 +1,6 @@
+// Settings Panel
+// Purpose: Defines the Settings Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useMemo } from 'react';
 import { useControlSystem } from '../../controls/index.js';
 import AuthPanel from '../AuthPanel/index.jsx';
diff --git a/webui/src/components/SocialButton/index.jsx b/webui/src/components/SocialButton/index.jsx
index dfd33e2c..4b5e7d91 100644
--- a/webui/src/components/SocialButton/index.jsx
+++ b/webui/src/components/SocialButton/index.jsx
@@ -1,3 +1,6 @@
+// Social Button
+// Purpose: Defines the Social Button module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect } from 'react';
 import { FaBook, FaCoffee, FaCrown, FaDiscord, FaLink } from 'react-icons/fa';
 
diff --git a/webui/src/components/SocialButtonsGrid/index.jsx b/webui/src/components/SocialButtonsGrid/index.jsx
index 1993aa27..8ef37010 100644
--- a/webui/src/components/SocialButtonsGrid/index.jsx
+++ b/webui/src/components/SocialButtonsGrid/index.jsx
@@ -1,3 +1,6 @@
+// Social Buttons Grid
+// Purpose: Defines the Social Buttons Grid module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useSession } from '../../context/SessionContext.jsx';
 import SocialButton from '../SocialButton/index.jsx';
 
diff --git a/webui/src/components/SocketLogPanel/index.jsx b/webui/src/components/SocketLogPanel/index.jsx
index b4d79c59..aa3910fc 100644
--- a/webui/src/components/SocketLogPanel/index.jsx
+++ b/webui/src/components/SocketLogPanel/index.jsx
@@ -1,3 +1,6 @@
+// Socket Log Panel
+// Purpose: Defines the Socket Log Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useMemo, useState } from 'react';
 import { useSocket } from '../../context/SocketContext.jsx';
 
diff --git a/webui/src/components/Tabs/index.jsx b/webui/src/components/Tabs/index.jsx
index 37463c13..28a67b10 100644
--- a/webui/src/components/Tabs/index.jsx
+++ b/webui/src/components/Tabs/index.jsx
@@ -1,3 +1,6 @@
+// Tabs
+// Purpose: Defines the Tabs module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { createContext, useCallback, useContext, useMemo, useState, useEffect } from 'react';
 
 const TabsContext = createContext(null);
diff --git a/webui/src/components/TelemetryPanel/index.jsx b/webui/src/components/TelemetryPanel/index.jsx
index 8a77551e..583c1308 100644
--- a/webui/src/components/TelemetryPanel/index.jsx
+++ b/webui/src/components/TelemetryPanel/index.jsx
@@ -1,3 +1,6 @@
+// Telemetry Panel
+// Purpose: Defines the Telemetry Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useMemo } from 'react';
 import { useSessionSelector } from '../../context/SessionContext.jsx';
 import { useTelemetryFrame } from '../../context/TelemetryContext.jsx';
diff --git a/webui/src/components/TopDownMap/TopDownMapContent.jsx b/webui/src/components/TopDownMap/TopDownMapContent.jsx
index 7c5862d2..2a442afe 100644
--- a/webui/src/components/TopDownMap/TopDownMapContent.jsx
+++ b/webui/src/components/TopDownMap/TopDownMapContent.jsx
@@ -1,4 +1,6 @@
-// Top-down rover telemetry visual map.
+// Top Down Map Content
+// Purpose: Defines the Top Down Map Content module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import React from 'react';
 import { buildSegments } from './helpers.js';
 import {
diff --git a/webui/src/components/TopDownMap/helpers.js b/webui/src/components/TopDownMap/helpers.js
index 27e5f7d6..ca294069 100644
--- a/webui/src/components/TopDownMap/helpers.js
+++ b/webui/src/components/TopDownMap/helpers.js
@@ -1,4 +1,6 @@
-// Geometry and color helpers for top-down rover sensor map.
+// helpers
+// Purpose: Defines the helpers module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export function clamp01(value) {
   return Math.max(0, Math.min(1, value));
 }
diff --git a/webui/src/components/TopDownMap/index.jsx b/webui/src/components/TopDownMap/index.jsx
index f9b5a9b4..c8e27a84 100644
--- a/webui/src/components/TopDownMap/index.jsx
+++ b/webui/src/components/TopDownMap/index.jsx
@@ -1,3 +1,6 @@
+// Top Down Map
+// Purpose: Defines the Top Down Map module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import TopDownMapContent from './TopDownMapContent.jsx';
 
 export default TopDownMapContent;
diff --git a/webui/src/components/TopDownMap/visuals.jsx b/webui/src/components/TopDownMap/visuals.jsx
index a8df5da4..d80bc727 100644
--- a/webui/src/components/TopDownMap/visuals.jsx
+++ b/webui/src/components/TopDownMap/visuals.jsx
@@ -1,4 +1,6 @@
-// SVG primitives for top-down rover map rendering.
+// visuals
+// Purpose: Defines the visuals module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import React from 'react';
 import { clamp01, currentColor, describeArc, lightBumpColor, cliffColor, polarToCartesian, toRad } from './helpers.js';
 
diff --git a/webui/src/components/TurnAlertListener/index.jsx b/webui/src/components/TurnAlertListener/index.jsx
index 4c9313f6..15fcb6e6 100644
--- a/webui/src/components/TurnAlertListener/index.jsx
+++ b/webui/src/components/TurnAlertListener/index.jsx
@@ -1,3 +1,6 @@
+// Turn Alert Listener
+// Purpose: Defines the Turn Alert Listener module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useMemo, useRef } from 'react';
 import turnSound from '../../assets/turn_alert.mp3';
 import { useSessionActions, useSessionSelector } from '../../context/SessionContext.jsx';
diff --git a/webui/src/components/UserListPanel/index.jsx b/webui/src/components/UserListPanel/index.jsx
index 62537631..9dcb4a63 100644
--- a/webui/src/components/UserListPanel/index.jsx
+++ b/webui/src/components/UserListPanel/index.jsx
@@ -1,3 +1,6 @@
+// User List Panel
+// Purpose: Defines the User List Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useMemo, useState, useCallback } from 'react';
 import { useSession } from '../../context/SessionContext.jsx';
 import NicknameForm from '../NicknameForm/index.jsx';
diff --git a/webui/src/components/VideoTile/HudChatInput.jsx b/webui/src/components/VideoTile/HudChatInput.jsx
index 8a7762fa..d685cc00 100644
--- a/webui/src/components/VideoTile/HudChatInput.jsx
+++ b/webui/src/components/VideoTile/HudChatInput.jsx
@@ -1,4 +1,6 @@
-// Inline HUD chat input for driver speech messages.
+// Hud Chat Input
+// Purpose: Defines the Hud Chat Input module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useMemo, useState } from 'react';
 import { useChat } from '../../context/ChatContext.jsx';
 import { useSessionSelector } from '../../context/SessionContext.jsx';
diff --git a/webui/src/components/VideoTile/HudOverlay.jsx b/webui/src/components/VideoTile/HudOverlay.jsx
index ce6f2856..07525b79 100644
--- a/webui/src/components/VideoTile/HudOverlay.jsx
+++ b/webui/src/components/VideoTile/HudOverlay.jsx
@@ -1,4 +1,6 @@
-// Telemetry HUD and map overlay for VideoTile.
+// Hud Overlay
+// Purpose: Defines the Hud Overlay module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import React from 'react';
 import TopDownMap from '../TopDownMap/index.jsx';
 import { roverNameChromeStyle } from '../../lib/roverColor.js';
diff --git a/webui/src/components/VideoTile/LightBumpBars.jsx b/webui/src/components/VideoTile/LightBumpBars.jsx
index 971abd39..af392405 100644
--- a/webui/src/components/VideoTile/LightBumpBars.jsx
+++ b/webui/src/components/VideoTile/LightBumpBars.jsx
@@ -1,4 +1,6 @@
-// Light bump signal bars used under the tile HUD.
+// Light Bump Bars
+// Purpose: Defines the Light Bump Bars module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import React from 'react';
 
 export default function LightBumpBars({ sensors }) {
diff --git a/webui/src/components/VideoTile/LowBatteryOverlay.jsx b/webui/src/components/VideoTile/LowBatteryOverlay.jsx
index ec90e7a2..d6c20f35 100644
--- a/webui/src/components/VideoTile/LowBatteryOverlay.jsx
+++ b/webui/src/components/VideoTile/LowBatteryOverlay.jsx
@@ -1,4 +1,6 @@
-// Low battery warning overlay.
+// Low Battery Overlay
+// Purpose: Defines the Low Battery Overlay module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import React from 'react';
 
 export default function LowBatteryOverlay({ battery, compact = false }) {
diff --git a/webui/src/components/VideoTile/OvercurrentOverlay.jsx b/webui/src/components/VideoTile/OvercurrentOverlay.jsx
index 9b4a918a..f7d11103 100644
--- a/webui/src/components/VideoTile/OvercurrentOverlay.jsx
+++ b/webui/src/components/VideoTile/OvercurrentOverlay.jsx
@@ -1,4 +1,6 @@
-// Overcurrent warning overlay.
+// Overcurrent Overlay
+// Purpose: Defines the Overcurrent Overlay module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import React from 'react';
 import { OVERCURRENT_LABELS } from './constants.js';
 
diff --git a/webui/src/components/VideoTile/TurnCueOverlay.jsx b/webui/src/components/VideoTile/TurnCueOverlay.jsx
index f7646083..6f948ad2 100644
--- a/webui/src/components/VideoTile/TurnCueOverlay.jsx
+++ b/webui/src/components/VideoTile/TurnCueOverlay.jsx
@@ -1,4 +1,6 @@
-// Turn cue overlay shown to active drivers.
+// Turn Cue Overlay
+// Purpose: Defines the Turn Cue Overlay module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import React from 'react';
 
 export default function TurnCueOverlay({
diff --git a/webui/src/components/VideoTile/constants.js b/webui/src/components/VideoTile/constants.js
index 1cacdd7b..94390b3b 100644
--- a/webui/src/components/VideoTile/constants.js
+++ b/webui/src/components/VideoTile/constants.js
@@ -1,4 +1,6 @@
-// VideoTile timing and threshold constants.
+// constants
+// Purpose: Defines the constants module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export const RESTART_DELAY_MS = 2000;
 export const UNMUTE_RETRY_MS = 3000;
 export const AUDIO_RETRY_MS = 3000;
diff --git a/webui/src/components/VideoTile/index.jsx b/webui/src/components/VideoTile/index.jsx
index 0a12d4ed..3fb705b2 100644
--- a/webui/src/components/VideoTile/index.jsx
+++ b/webui/src/components/VideoTile/index.jsx
@@ -1,3 +1,6 @@
+// Video Tile
+// Purpose: Defines the Video Tile module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { WhepPlayer } from '../../lib/whepPlayer.js';
 import { useHudMapSetting } from '../../hooks/useHudMapSetting.js';
diff --git a/webui/src/components/VipPanel/index.jsx b/webui/src/components/VipPanel/index.jsx
index d8890df9..ffb389ef 100644
--- a/webui/src/components/VipPanel/index.jsx
+++ b/webui/src/components/VipPanel/index.jsx
@@ -1,3 +1,6 @@
+// Vip Panel
+// Purpose: Defines the Vip Panel module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useMemo, useState } from 'react';
 import { useSession } from '../../context/SessionContext.jsx';
 import { useSettingsNamespace } from '../../settings/index.js';
diff --git a/webui/src/components/vip/VipAudioUploadCard/KeyPill.jsx b/webui/src/components/vip/VipAudioUploadCard/KeyPill.jsx
index 21602e4f..4f414252 100644
--- a/webui/src/components/vip/VipAudioUploadCard/KeyPill.jsx
+++ b/webui/src/components/vip/VipAudioUploadCard/KeyPill.jsx
@@ -1,4 +1,6 @@
-// Keybinding label pill for PTT hints.
+// Key Pill
+// Purpose: Defines the Key Pill module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export default function KeyPill({ label }) {
   if (!label) return null;
   return <span className="rounded border border-white/40 px-1 text-[0.7rem] text-white">{label}</span>;
diff --git a/webui/src/components/vip/VipAudioUploadCard/StatusIndicator.jsx b/webui/src/components/vip/VipAudioUploadCard/StatusIndicator.jsx
index ab0af8c0..80888df7 100644
--- a/webui/src/components/vip/VipAudioUploadCard/StatusIndicator.jsx
+++ b/webui/src/components/vip/VipAudioUploadCard/StatusIndicator.jsx
@@ -1,4 +1,6 @@
-// Compact status tile used throughout VIP audio card.
+// Status Indicator
+// Purpose: Defines the Status Indicator module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export default function StatusIndicator({ label, active, detail = '' }) {
   return (
     <div
diff --git a/webui/src/components/vip/VipAudioUploadCard/VipAudioUploadCardContent.jsx b/webui/src/components/vip/VipAudioUploadCard/VipAudioUploadCardContent.jsx
index fd58f85c..9a966dcd 100644
--- a/webui/src/components/vip/VipAudioUploadCard/VipAudioUploadCardContent.jsx
+++ b/webui/src/components/vip/VipAudioUploadCard/VipAudioUploadCardContent.jsx
@@ -1,3 +1,6 @@
+// Vip Audio Upload Card Content
+// Purpose: Defines the Vip Audio Upload Card Content module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { fieldClass } from '../constants.js';
 import { useControlSystem } from '../../../controls/index.js';
diff --git a/webui/src/components/vip/VipAudioUploadCard/audioCodec.js b/webui/src/components/vip/VipAudioUploadCard/audioCodec.js
index 72215d90..cdeffa51 100644
--- a/webui/src/components/vip/VipAudioUploadCard/audioCodec.js
+++ b/webui/src/components/vip/VipAudioUploadCard/audioCodec.js
@@ -1,4 +1,6 @@
-// PCM/WAV helpers for clip-mode recording payloads.
+// audio Codec
+// Purpose: Defines the audio Codec module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export function mergeFloatChunks(chunks) {
   const total = chunks.reduce((sum, chunk) => sum + chunk.length, 0);
   const merged = new Float32Array(total);
diff --git a/webui/src/components/vip/VipAudioUploadCard/base64.js b/webui/src/components/vip/VipAudioUploadCard/base64.js
index 65ea881e..cfe23c40 100644
--- a/webui/src/components/vip/VipAudioUploadCard/base64.js
+++ b/webui/src/components/vip/VipAudioUploadCard/base64.js
@@ -1,4 +1,6 @@
-// Base64 and auth helpers for upload and WHIP requests.
+// base64
+// Purpose: Defines the base64 module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export function bytesToBase64(bytes) {
   let binary = '';
   const chunkSize = 0x8000;
diff --git a/webui/src/components/vip/VipAudioUploadCard/constants.js b/webui/src/components/vip/VipAudioUploadCard/constants.js
index 8459c917..8e779c9e 100644
--- a/webui/src/components/vip/VipAudioUploadCard/constants.js
+++ b/webui/src/components/vip/VipAudioUploadCard/constants.js
@@ -1,4 +1,6 @@
-// VIP audio upload/mic forwarding constants.
+// constants
+// Purpose: Defines the constants module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export const MAX_UPLOAD_BYTES = 8 * 1024 * 1024;
 export const TARGET_SAMPLE_RATE = 16000;
 export const RTC_CONFIG = {
diff --git a/webui/src/components/vip/VipAudioUploadCard/index.jsx b/webui/src/components/vip/VipAudioUploadCard/index.jsx
index 54fe72e3..ed2ed288 100644
--- a/webui/src/components/vip/VipAudioUploadCard/index.jsx
+++ b/webui/src/components/vip/VipAudioUploadCard/index.jsx
@@ -1,3 +1,6 @@
+// Vip Audio Upload Card
+// Purpose: Defines the Vip Audio Upload Card module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import VipAudioUploadCardContent from './VipAudioUploadCardContent.jsx';
 
 export default VipAudioUploadCardContent;
diff --git a/webui/src/components/vip/VipAudioUploadCard/whipTransport.js b/webui/src/components/vip/VipAudioUploadCard/whipTransport.js
index 200ee99e..d9e2128c 100644
--- a/webui/src/components/vip/VipAudioUploadCard/whipTransport.js
+++ b/webui/src/components/vip/VipAudioUploadCard/whipTransport.js
@@ -1,4 +1,6 @@
-// WHIP/WebRTC transport helpers for microphone forwarding.
+// whip Transport
+// Purpose: Defines the whip Transport module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export function waitForIceGatheringComplete(pc, timeoutMs = 1500) {
   return new Promise((resolve) => {
     if (!pc || pc.iceGatheringState === 'complete') {
diff --git a/webui/src/components/vip/VipIdentityCard.jsx b/webui/src/components/vip/VipIdentityCard.jsx
index 173ab35c..7a96c2a3 100644
--- a/webui/src/components/vip/VipIdentityCard.jsx
+++ b/webui/src/components/vip/VipIdentityCard.jsx
@@ -1,3 +1,6 @@
+// Vip Identity Card
+// Purpose: Defines the Vip Identity Card module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useState } from 'react';
 import { fieldClass, flowWrapClass, innerFlowClass, maskKey } from './constants.js';
 
diff --git a/webui/src/components/vip/VipNeatoCard.jsx b/webui/src/components/vip/VipNeatoCard.jsx
index 64075f9e..54f24f8a 100644
--- a/webui/src/components/vip/VipNeatoCard.jsx
+++ b/webui/src/components/vip/VipNeatoCard.jsx
@@ -1,3 +1,6 @@
+// Vip Neato Card
+// Purpose: Defines the Vip Neato Card module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useMemo, useState } from 'react';
 
 function normalizeState(value) {
diff --git a/webui/src/components/vip/VipPrivateRoverAccessCard.jsx b/webui/src/components/vip/VipPrivateRoverAccessCard.jsx
index cb92e7aa..057577a5 100644
--- a/webui/src/components/vip/VipPrivateRoverAccessCard.jsx
+++ b/webui/src/components/vip/VipPrivateRoverAccessCard.jsx
@@ -1,3 +1,6 @@
+// Vip Private Rover Access Card
+// Purpose: Defines the Vip Private Rover Access Card module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useMemo, useState } from 'react';
 import { flowWrapClass, innerFlowClass } from './constants.js';
 
diff --git a/webui/src/components/vip/VipVerificationCard.jsx b/webui/src/components/vip/VipVerificationCard.jsx
index cb287850..f884cc34 100644
--- a/webui/src/components/vip/VipVerificationCard.jsx
+++ b/webui/src/components/vip/VipVerificationCard.jsx
@@ -1,3 +1,6 @@
+// Vip Verification Card
+// Purpose: Defines the Vip Verification Card module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useState } from 'react';
 import NicknameForm from '../NicknameForm/index.jsx';
 import { flowWrapClass, innerFlowClass, fieldClass } from './constants.js';
diff --git a/webui/src/components/vip/constants.js b/webui/src/components/vip/constants.js
index 53537606..3b30be39 100644
--- a/webui/src/components/vip/constants.js
+++ b/webui/src/components/vip/constants.js
@@ -1,3 +1,6 @@
+// constants
+// Purpose: Defines the constants module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export const COOKIE_KEY_REGEX = /^cu_[a-f0-9]{32}$/;
 
 export const fieldClass = 'field-input w-full max-w-sm text-left focus:ring-emerald-500';
diff --git a/webui/src/mini/MiniSummaryApp/MiniSummaryAppRoot.jsx b/webui/src/mini/MiniSummaryApp/MiniSummaryAppRoot.jsx
index 8e4e9ad5..381008b7 100644
--- a/webui/src/mini/MiniSummaryApp/MiniSummaryAppRoot.jsx
+++ b/webui/src/mini/MiniSummaryApp/MiniSummaryAppRoot.jsx
@@ -1,4 +1,6 @@
-// Top-level mini summary app shell with hard-refresh timer and alerts.
+// Mini Summary App Root
+// Purpose: Defines the Mini Summary App Root module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect } from 'react';
 import AlertFeed from '../../components/AlertFeed/index.jsx';
 import MiniSummaryContent from './MiniSummaryContent.jsx';
diff --git a/webui/src/mini/MiniSummaryApp/MiniSummaryContent.jsx b/webui/src/mini/MiniSummaryApp/MiniSummaryContent.jsx
index 74110aee..e8770b1e 100644
--- a/webui/src/mini/MiniSummaryApp/MiniSummaryContent.jsx
+++ b/webui/src/mini/MiniSummaryApp/MiniSummaryContent.jsx
@@ -1,4 +1,6 @@
-// Main mini summary screen composition and rotation logic.
+// Mini Summary Content
+// Purpose: Defines the Mini Summary Content module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useMemo, useState } from 'react';
 import { useSession } from '../../context/SessionContext.jsx';
 import { useTelemetryFrames } from '../../context/TelemetryContext.jsx';
diff --git a/webui/src/mini/MiniSummaryApp/components/AutoFitText.jsx b/webui/src/mini/MiniSummaryApp/components/AutoFitText.jsx
index 8435b02a..6d017dd0 100644
--- a/webui/src/mini/MiniSummaryApp/components/AutoFitText.jsx
+++ b/webui/src/mini/MiniSummaryApp/components/AutoFitText.jsx
@@ -1,4 +1,6 @@
-// Auto-fitting single-line text component for mini summary layout.
+// Auto Fit Text
+// Purpose: Defines the Auto Fit Text module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useLayoutEffect, useRef, useState } from 'react';
 
 export default function AutoFitText({ children, className = '', maxSize = 1000, minSize = 14, style = undefined }) {
diff --git a/webui/src/mini/MiniSummaryApp/components/FitViewportFrame.jsx b/webui/src/mini/MiniSummaryApp/components/FitViewportFrame.jsx
index 1903998f..d0b60a6f 100644
--- a/webui/src/mini/MiniSummaryApp/components/FitViewportFrame.jsx
+++ b/webui/src/mini/MiniSummaryApp/components/FitViewportFrame.jsx
@@ -1,4 +1,6 @@
-// 4:3 viewport fitting frame for active mini-summary video.
+// Fit Viewport Frame
+// Purpose: Defines the Fit Viewport Frame module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export default function FitViewportFrame({ children }) {
   return (
     <div className="flex h-full w-full items-center justify-start overflow-hidden bg-black">
diff --git a/webui/src/mini/MiniSummaryApp/components/InfoColumn.jsx b/webui/src/mini/MiniSummaryApp/components/InfoColumn.jsx
index de7bf420..5ef86664 100644
--- a/webui/src/mini/MiniSummaryApp/components/InfoColumn.jsx
+++ b/webui/src/mini/MiniSummaryApp/components/InfoColumn.jsx
@@ -1,4 +1,6 @@
-// Rover information and optional preview column for mini summary UI.
+// Info Column
+// Purpose: Defines the Info Column module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import VideoTile from '../../../components/VideoTile/index.jsx';
 import BatteryBar from '../../../components/BatteryBar/index.jsx';
 import { roverNameChromeStyle } from '../../../lib/roverColor.js';
diff --git a/webui/src/mini/MiniSummaryApp/constants.js b/webui/src/mini/MiniSummaryApp/constants.js
index b92bfc89..025cb185 100644
--- a/webui/src/mini/MiniSummaryApp/constants.js
+++ b/webui/src/mini/MiniSummaryApp/constants.js
@@ -1,3 +1,5 @@
-// Mini summary app timing constants.
+// constants
+// Purpose: Defines the constants module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export const ROTATE_MS = 20000;
 export const HARD_REFRESH_MS = 1 * 60 * 60 * 1000;
diff --git a/webui/src/mini/MiniSummaryApp/utils.js b/webui/src/mini/MiniSummaryApp/utils.js
index cb7df3cb..5fd162a9 100644
--- a/webui/src/mini/MiniSummaryApp/utils.js
+++ b/webui/src/mini/MiniSummaryApp/utils.js
@@ -1,4 +1,6 @@
-// Mini summary app session/telemetry formatting utilities.
+// utils
+// Purpose: Defines the utils module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { buildBatteryVisual } from '../../lib/battery.js';
 
 export function formatDriverLabel({ roverId, session }) {
diff --git a/webui/src/spectate/SpectatorApp/SpectatorAppRoot.jsx b/webui/src/spectate/SpectatorApp/SpectatorAppRoot.jsx
index 1a1ed8ec..5d507154 100644
--- a/webui/src/spectate/SpectatorApp/SpectatorAppRoot.jsx
+++ b/webui/src/spectate/SpectatorApp/SpectatorAppRoot.jsx
@@ -1,4 +1,6 @@
-// Spectator app compatibility root.
+// Spectator App Root
+// Purpose: Defines the Spectator App Root module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import SpectatorContent from './SpectatorContent.jsx';
 
 export default function SpectatorAppRoot() {
diff --git a/webui/src/spectate/SpectatorApp/SpectatorContent.jsx b/webui/src/spectate/SpectatorApp/SpectatorContent.jsx
index a5645860..3cacbda6 100644
--- a/webui/src/spectate/SpectatorApp/SpectatorContent.jsx
+++ b/webui/src/spectate/SpectatorApp/SpectatorContent.jsx
@@ -1,4 +1,6 @@
-// Main spectator screen layout and feed wiring.
+// Spectator Content
+// Purpose: Defines the Spectator Content module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useSession } from '../../context/SessionContext.jsx';
 import { useTelemetryFrames } from '../../context/TelemetryContext.jsx';
 import { useVideoRequests } from '../../hooks/useVideoRequests.js';
diff --git a/webui/src/spectate/SpectatorApp/components/LogsRow.jsx b/webui/src/spectate/SpectatorApp/components/LogsRow.jsx
index 93fbc1d8..6da58021 100644
--- a/webui/src/spectate/SpectatorApp/components/LogsRow.jsx
+++ b/webui/src/spectate/SpectatorApp/components/LogsRow.jsx
@@ -1,4 +1,6 @@
-// Log panel wrapper row for spectator layout.
+// Logs Row
+// Purpose: Defines the Logs Row module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import LogPanel from '../../../components/LogPanel/index.jsx';
 
 export default function LogsRow({ className = '' }) {
diff --git a/webui/src/spectate/SpectatorApp/components/RoverRow.jsx b/webui/src/spectate/SpectatorApp/components/RoverRow.jsx
index 7a7efe27..9f1ca098 100644
--- a/webui/src/spectate/SpectatorApp/components/RoverRow.jsx
+++ b/webui/src/spectate/SpectatorApp/components/RoverRow.jsx
@@ -1,4 +1,6 @@
-// Rover grid row for spectator view.
+// Rover Row
+// Purpose: Defines the Rover Row module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import RoverSpectatorCard from './RoverSpectatorCard.jsx';
 
 export default function RoverRow({ roster, frames, videoSources, snapshotFeeds, audioSources, session, canSpectateVideo }) {
diff --git a/webui/src/spectate/SpectatorApp/components/RoverSpectatorCard.jsx b/webui/src/spectate/SpectatorApp/components/RoverSpectatorCard.jsx
index ace08452..77c321fa 100644
--- a/webui/src/spectate/SpectatorApp/components/RoverSpectatorCard.jsx
+++ b/webui/src/spectate/SpectatorApp/components/RoverSpectatorCard.jsx
@@ -1,4 +1,6 @@
-// Single rover spectator card containing live/snapshot tile and HUD.
+// Rover Spectator Card
+// Purpose: Defines the Rover Spectator Card module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import VideoTile from '../../../components/VideoTile/index.jsx';
 import { formatDriverLabel } from '../utils.js';
 
diff --git a/webui/src/spectate/SpectatorApp/components/SecondaryRow.jsx b/webui/src/spectate/SpectatorApp/components/SecondaryRow.jsx
index 51c6ca37..51b67f3f 100644
--- a/webui/src/spectate/SpectatorApp/components/SecondaryRow.jsx
+++ b/webui/src/spectate/SpectatorApp/components/SecondaryRow.jsx
@@ -1,4 +1,6 @@
-// Secondary panel row showing room cameras.
+// Secondary Row
+// Purpose: Defines the Secondary Row module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import RoomCameraPanel from '../../../components/RoomCameraPanel/index.jsx';
 
 export default function SecondaryRow() {
diff --git a/webui/src/spectate/SpectatorApp/hooks/usePortraitLayout.js b/webui/src/spectate/SpectatorApp/hooks/usePortraitLayout.js
index c43d0115..5e82c3e7 100644
--- a/webui/src/spectate/SpectatorApp/hooks/usePortraitLayout.js
+++ b/webui/src/spectate/SpectatorApp/hooks/usePortraitLayout.js
@@ -1,4 +1,6 @@
-// Detect portrait-oriented viewport layout mode for spectator UI.
+// use Portrait Layout
+// Purpose: Defines the use Portrait Layout module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 import { useEffect, useState } from 'react';
 
 export default function usePortraitLayout() {
diff --git a/webui/src/spectate/SpectatorApp/utils.js b/webui/src/spectate/SpectatorApp/utils.js
index d1349f12..6f439e33 100644
--- a/webui/src/spectate/SpectatorApp/utils.js
+++ b/webui/src/spectate/SpectatorApp/utils.js
@@ -1,4 +1,6 @@
-// Spectator app display formatting helpers.
+// utils
+// Purpose: Defines the utils module and the local helpers/components used in this file.
+// Scope: Keeps behavior unchanged while isolating this concern into a clear, single-responsibility unit.
 export function formatDriverLabel({ roverId, session }) {
   const activeDriverId = session?.activeDrivers?.[roverId] || null;
   const user = (session?.users || []).find((entry) => entry.socketId === activeDriverId);