diff --git a/app/Enums/CommentStateEnum.php b/app/Enums/CommentStateEnum.php
new file mode 100644
index 00000000..a4acfc11
--- /dev/null
+++ b/app/Enums/CommentStateEnum.php
@@ -0,0 +1,14 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\Enums;
+
+enum CommentStateEnum: string
+{
+    case Viewing = 'viewing';
+    case Editing = 'editing';
+    case Flagging = 'flagging';
+    case Replying = 'replying';
+    case Moderating = 'moderating';
+}
diff --git a/app/Enums/LivewireEventEnum.php b/app/Enums/LivewireEventEnum.php
index 2e09c662..6fff9212 100644
--- a/app/Enums/LivewireEventEnum.php
+++ b/app/Enums/LivewireEventEnum.php
@@ -7,10 +7,12 @@
 enum LivewireEventEnum: string
 {
     case CommentDeleted = 'comment-deleted';
+    case CommentFlagCancelled = 'comment-flag-cancelled';
     case CommentFlagDeleted = 'comment-flag-deleted';
     case CommentFlagged = 'comment-flagged';
     case CommentStored = 'comment-stored';
     case CommentUpdated = 'comment-updated';
+    case CommentFormStateChanged = 'comment-form-state-changed';
     case EditorUpdated = 'editor-updated';
     case EscapeKeyClicked = 'escape-key-clicked';
     case FavoriteDeleted = 'favorite-deleted';
@@ -19,6 +21,7 @@ enum LivewireEventEnum: string
     case FlagDeleted = 'flag-deleted';
     case HideFlagCommentForm = 'hide-flag-comment-form';
     case PostDeleted = 'post-deleted';
+    case PostFlagCancelled = 'post-flag-cancelled';
     case PostFlagDeleted = 'post-flag-deleted';
     case PostFlagged = 'post-flagged';
     case PostStored = 'post-stored';
diff --git a/app/Enums/ModerationTypeEnum.php b/app/Enums/ModerationTypeEnum.php
new file mode 100644
index 00000000..a4a66cf2
--- /dev/null
+++ b/app/Enums/ModerationTypeEnum.php
@@ -0,0 +1,27 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\Enums;
+
+enum ModerationTypeEnum: string
+{
+    case Blur = 'blur';
+    case Comment = 'comment';
+    case Edit = 'edit';
+    case Remove = 'remove';
+    case Replace = 'replace';
+    case Wrap = 'wrap';
+
+    public function label(): string
+    {
+        return match ($this) {
+            self::Blur => 'Blur',
+            self::Comment => 'Comment',
+            self::Edit => 'Edit',
+            self::Remove => 'Remove',
+            self::Replace => 'Replace',
+            self::Wrap => 'Wrap',
+        };
+    }
+}
diff --git a/app/Livewire/Comments/CommentBlur.php b/app/Livewire/Comments/CommentBlur.php
new file mode 100644
index 00000000..0ecaffd7
--- /dev/null
+++ b/app/Livewire/Comments/CommentBlur.php
@@ -0,0 +1,31 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\Livewire\Comments;
+
+use App\Enums\ModerationTypeEnum;
+use App\Traits\CommentComponentTrait;
+use App\Traits\CommentComponentStateTrait;
+use Illuminate\Contracts\View\View;
+use Livewire\Component;
+
+final class CommentBlur extends Component
+{
+    use CommentComponentStateTrait;
+    use CommentComponentTrait;
+
+    // State
+    public bool $isBlurred = true;
+
+    public function render(): View
+    {
+        $moderatorComment = $this->moderatorCommentsByType?->get(ModerationTypeEnum::Blur->value);
+
+        return view('livewire.comments.comment-blur', [
+            'comment' => $this->comment,
+            'childComments' => $this->childComments,
+            'blurMessage' => $moderatorComment?->body ?? '',
+        ]);
+    }
+}
diff --git a/app/Livewire/Comments/CommentComponent.php b/app/Livewire/Comments/CommentComponent.php
index cf65ed09..3f78da63 100644
--- a/app/Livewire/Comments/CommentComponent.php
+++ b/app/Livewire/Comments/CommentComponent.php
@@ -4,14 +4,14 @@
 
 namespace App\Livewire\Comments;
 
+use App\Enums\CommentStateEnum;
 use App\Enums\LivewireEventEnum;
+use App\Enums\ModerationTypeEnum;
 use App\Models\Comment;
-use App\Models\Flag;
-use App\Models\Post;
-use App\Models\User;
 use App\Traits\CommentComponentTrait;
 use Illuminate\Contracts\View\View;
-use Illuminate\Support\Facades\DB;
+use Illuminate\Support\Collection;
+use Livewire\Attributes\Computed;
 use Livewire\Attributes\On;
 use Livewire\Component;
 
@@ -19,106 +19,108 @@ final class CommentComponent extends Component
 {
     use CommentComponentTrait;
 
-    // Data
-    public ?int $authorizedUserId;
-    public string $body = '';
-    public ?int $parentId = null;
-    public int $flagCount = 0;
-    public string $flagIconFilename = 'flag';
-    public string $flagButtonText = '';
-    public bool $userFlagged = false;
-
     // State
-    public bool $isEditing = false;
-    public bool $isFlagging = false;
-    public bool $isReplying = false;
-
-    public Comment $comment;
-    public CommentForm $commentForm;
-    public Post $post;
-    public ?User $user;
+    public CommentStateEnum $state = CommentStateEnum::Viewing;
 
-    public function mount(Comment $comment, Post $post): void
+    #[Computed]
+    public function isInitiallyBlurred(): bool
     {
-        $this->authorizedUserId = auth()->id() ?? null;
-
-        $this->comment = $comment;
-        $this->commentForm->setComment($comment);
-
-        $this->post = $post;
-
-        $this->body = $comment->body;
-
-        $this->user = auth()->user() ?? null;
-
-        $this->updateFlagCount();
-        $this->hasUserFlagged();
-
-        $this->flagIconFilename = $this->getFlagIconFilename();
-        $this->flagButtonText = $this->getFlagTitleText();
-    }
-
-    public function render(): View
-    {
-        return view('livewire.comments.comment-component');
+        return $this->moderatorCommentsByType?->get(ModerationTypeEnum::Blur->value) !== null;
     }
 
-    private function getFlagIconFilename(): string
+    public function mount(int $commentId, ?Comment $comment, ?Collection $childComments): void
     {
-        return $this->userFlagged ? 'flag-fill' : 'flag';
+        // On mount we expect the comment list to provide the comment model
+        // and the moderator comments collection.
+        $this->commentId = $commentId;
+        $this->comment = $comment ?? Comment::find($commentId);
+        $this->childComments = $childComments;
+
+        // Decide whether to blur the component initially.
+        $this->isBlurred = $this->isInitiallyBlurred;
     }
 
-    private function getFlagTitleText(): string
+    public function render(): View
     {
-        return $this->userFlagged ? trans('Remove flag') : trans('Flag this comment');
+        // If the comment has been replaced, just render the moderation message.
+        // TODO: if it is possible to have a top-level comment be marked with a
+        // moderation type, we may want to render it via this view. But it may
+        // also just be about changing the border for a regular rendering.
+        $moderatorReplaceComment = $this->moderatorCommentsByType?->get(ModerationTypeEnum::Replace->value);
+        $moderatorWrapComment = $this->moderatorCommentsByType?->get(ModerationTypeEnum::Wrap->value);
+        $moderatorBlurComment = $this->moderatorCommentsByType?->get(ModerationTypeEnum::Blur->value);
+        $moderationType = null;
+
+        if ($moderatorReplaceComment !== null &&
+            ($moderatorWrapComment === null || $moderatorReplaceComment->created_at > $moderatorWrapComment->created_at)) {
+            $moderationType = ModerationTypeEnum::Replace;
+        } elseif ($moderatorWrapComment !== null) {
+            $moderationType = ModerationTypeEnum::Wrap;
+        }
+
+        // If there are no decorations to apply, just render the basic comment component.
+        return view('livewire.comments.comment-component', [
+            'comment' => $this->comment,
+            'childComments' => $this->childComments,
+            'moderationType' => $moderationType,
+            'isInitiallyBlurred' => $this->isInitiallyBlurred,
+            'replacedByCommentId' => $moderatorReplaceComment?->id,
+            'wrappedByCommentId' => $moderatorWrapComment?->id,
+            'blurredByCommentId' => $moderatorBlurComment?->id,
+            'isEditing' => $this->state === CommentStateEnum::Editing,
+            'isFlagging' => $this->state === CommentStateEnum::Flagging,
+            'isReplying' => $this->state === CommentStateEnum::Replying,
+            'isModerating' => $this->state === CommentStateEnum::Moderating,
+        ]);
     }
 
-    private function hasUserFlagged(): void
+    #[On([
+        LivewireEventEnum::EscapeKeyClicked->value,
+    ])]
+    public function closeForm(): void
     {
-        $userFlagCount = DB::table(table: 'markable_flags')
-            ->where(column: 'user_id', operator: '=', value: auth()->id())
-            ->where(column: 'markable_id', operator: '=', value: $this->comment->id)
-            ->where(column: 'markable_type', operator: 'LIKE', value: '%Comment%')
-            ->count();
-
-        $this->userFlagged = $userFlagCount > 0;
+        $this->state = CommentStateEnum::Viewing;
     }
 
     #[On([
         LivewireEventEnum::CommentStored->value,
-        LivewireEventEnum::CommentDeleted->value,
-        LivewireEventEnum::CommentFlagged->value,
         LivewireEventEnum::CommentUpdated->value,
-        LivewireEventEnum::EscapeKeyClicked->value,
     ])]
-    public function closeForm(): void
+    public function reloadChildComments(int $id, ?int $parentId): void
     {
-        $this->reset([
-            'body',
-        ]);
+        if ($parentId === $this->commentId) {
+            $this->childComments = $this->commentRepository->getCommentsByParentId($parentId);
+            unset($this->moderatorCommentsByType, $this->isInitiallyBlurred);
 
-        $this->stopEditing();
-        $this->stopFlagging();
-        $this->stopReplying();
+            // Re-evaluate whether the comment should be blurred.
+            $this->isBlurred = $this->isInitiallyBlurred;
+        }
     }
 
-    private function updateFlagCount(): void
+    public function setState(CommentStateEnum $state): void
     {
-        $this->flagCount = Flag::count($this->comment);
+        $this->state = $state;
     }
 
-    #[On('comment-flagged.{comment.id}')]
-    public function addUserFlag(): void
+    public function addUserFlag(int $id): void
     {
-        \Log::debug('CommentComponent::addUserFlag');
-        $this->userFlagged = true;
-        $this->flagCount++;
+        if ($id !== $this->comment->id) {
+            return;
+        }
+
+        unset($this->userFlagged, $this->flagCount);
+
+        $this->state = CommentStateEnum::Viewing;
     }
 
-    #[On('comment-flag-deleted.{comment.id}')]
-    public function removeUserFlag(): void
+    public function removeUserFlag(int $id): void
     {
-        $this->userFlagged = false;
-        $this->flagCount--;
+        if ($id !== $this->comment->id) {
+            return;
+        }
+
+        unset($this->userFlagged, $this->flagCount);
+
+        $this->state = CommentStateEnum::Viewing;
     }
 }
diff --git a/app/Livewire/Comments/CommentContent.php b/app/Livewire/Comments/CommentContent.php
new file mode 100644
index 00000000..f78bfb61
--- /dev/null
+++ b/app/Livewire/Comments/CommentContent.php
@@ -0,0 +1,35 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\Livewire\Comments;
+
+use App\Enums\CommentStateEnum;
+use App\Traits\CommentComponentTrait;
+use App\Traits\CommentComponentStateTrait;
+use Illuminate\Contracts\View\View;
+use Livewire\Component;
+
+final class CommentContent extends Component
+{
+    use CommentComponentStateTrait;
+    use CommentComponentTrait;
+
+    public function render(): View
+    {
+        $data = [
+            'authorizedUserId' => auth()->id() ?? null,
+            'comment' => $this->comment,
+            'body' => $this->comment->body,
+            'flagCount' => $this->flagCount,
+            'userFlagged' => $this->userFlagged,
+            'isEditing' => $this->state === CommentStateEnum::Editing,
+            'isFlagging' => $this->state === CommentStateEnum::Flagging,
+            'isReplying' => $this->state === CommentStateEnum::Replying,
+            'isModerating' => $this->state === CommentStateEnum::Moderating,
+        ];
+
+        // If there are no decorations to apply, just render the basic comment component.
+        return view('livewire.comments.comment-content', $data);
+    }
+}
diff --git a/app/Livewire/Comments/CommentFormComponent.php b/app/Livewire/Comments/CommentFormComponent.php
index f784619f..f8b315ca 100644
--- a/app/Livewire/Comments/CommentFormComponent.php
+++ b/app/Livewire/Comments/CommentFormComponent.php
@@ -5,55 +5,135 @@
 namespace App\Livewire\Comments;
 
 use App\Enums\LivewireEventEnum;
+use App\Enums\ModerationTypeEnum;
 use App\Http\Requests\Comment\StoreCommentRequest;
 use App\Models\Comment;
 use App\Traits\LoggingTrait;
 use Exception;
 use Illuminate\Contracts\View\View;
-use Livewire\Attributes\On;
+use Livewire\Attributes\Computed;
+use Livewire\Attributes\Locked;
 use Livewire\Component;
 
 final class CommentFormComponent extends Component
 {
     use LoggingTrait;
 
-    public ?int $authorizedUserId;
-    public string $buttonText = '';
-    public ?Comment $comment;
+    // Props
+    #[Locked]
+    public int $postId;
+
+    #[Locked]
+    public ?int $commentId;
+
+    #[Locked]
+    public ?int $parentId;
+
+    #[Locked]
+    public string $idSuffix;
+
+    // Form data
+    public string $body = '';
+    public ?ModerationTypeEnum $moderationType = null;
+    public string $message = '';
+
+    // State
     public bool $isEditing;
     public bool $isReplying;
-    public string $body = '';
-    public int $postId;
-    public ?int $parentId = null;
-    public ?string $message = null;
-    public string $editorId = '';
+    public bool $isModerating;
+
+    // Data not persisted in the client-side snapshot
+    protected ?Comment $comment;
+
+    #[Computed]
+    public function isAdding(): bool
+    {
+        return !$this->isEditing && !$this->isReplying && !$this->isModerating;
+    }
+
+    #[Computed]
+    public function isBodyEditable(): bool
+    {
+        return $this->isAdding || $this->isEditing ||
+            ($this->isModerating && $this->moderationType === ModerationTypeEnum::Edit);
+    }
+
+    #[Computed]
+    public function bodyEditorId(): string
+    {
+        return 'body-editor-' . ($this->commentId ?? 'new');
+    }
+
+    #[Computed]
+    public function messageEditorId(): string
+    {
+        return 'message-editor-' . ($this->commentId ?? 'new');
+    }
 
     public function mount(
-        int $postId,
-        ?Comment $comment,
+        ?int $postId = null,
+        ?int $commentId = null,
         ?int $parentId = null,
+        ?Comment $comment = null,
+        ?string $moderationType = null,
         bool $isEditing = false,
         bool $isReplying = false,
+        bool $isModerating = false,
     ): void {
-        $this->authorizedUserId = auth()->id() ?? null;
+        $this->idSuffix = uniqid();
 
+        // The implied alternative when not editing, replying or moderating is
+        // that we are adding a new comment.
         $this->isEditing = $isEditing;
         $this->isReplying = $isReplying;
+        $this->isModerating = $isModerating;
+
+        $postId ??= $comment?->post_id;
+        $commentId ??= $comment?->id;
+        $parentId ??= ($isReplying || $isModerating ? $commentId : $comment?->parent_id);
 
         $this->postId = $postId;
+        $this->commentId = $commentId;
         $this->parentId = $parentId;
+        $this->comment = $comment;
+        $this->moderationType = ModerationTypeEnum::tryFrom($moderationType ?? '');
 
-        $this->comment = $comment ?? null;
-        $this->body = $this->comment->body ?? '';
-
-        if ($this->editorId === '') {
-            $this->editorId = uniqid('comment-editor-' . ($this->comment->id ?? 'new') . '-');
-        }
+        $this->body = $comment?->body ?? '';
     }
 
     public function render(): View
     {
-        return view('livewire.comments.comment-form-component');
+        $isAdding = !$this->isEditing && !$this->isReplying && !$this->isModerating;
+        $isBodyEditable = $isAdding || $this->isEditing ||
+            ($this->isModerating && $this->moderationType === ModerationTypeEnum::Edit);
+        $data = [
+            'bodyLabel' => trans('Comment'),
+            'messageLabel' => trans('Moderation message'),
+            'buttonText' => trans('Add Comment'),
+            'isAdding' => $isAdding,
+            'isBodyEditable' => $isBodyEditable,
+            'bodyEditorId' => $this->bodyEditorId,
+            'messageEditorId' => $this->messageEditorId,
+        ];
+
+        if ($this->isModerating) {
+            $data['bodyLabel'] = trans('Original comment');
+            $data['buttonText'] = trans(match ($this->moderationType) {
+                ModerationTypeEnum::Edit => 'Edit comment',
+                ModerationTypeEnum::Remove => 'Remove comment',
+                ModerationTypeEnum::Replace => 'Replace comment',
+                ModerationTypeEnum::Wrap => 'Wrap comment',
+                ModerationTypeEnum::Blur => 'Blur comment',
+                default => 'Moderate',
+            });
+        } elseif ($this->isReplying) {
+            $data['bodyLabel'] = trans('Reply');
+            $data['buttonText'] = trans('Reply');
+        } elseif ($this->isEditing) {
+            $data['buttonText'] = trans('Edit comment');
+        }
+
+        return view('livewire.comments.comment-form-component', $data);
     }
 
     protected function rules(): array
@@ -61,27 +141,62 @@ protected function rules(): array
         return (new StoreCommentRequest())->rules();
     }
 
-    #[On(LivewireEventEnum::EditorUpdated->value)]
-    public function handleEditorUpdated($editorId, $content): void
-    {
-        if ($this->editorId !== $editorId) {
-            return;
-        }
-
-        $this->body = $content;
-    }
-
     public function submit(): void
     {
         $this->validate();
 
-        if ($this->isEditing === true) {
+        if ($this->isModerating) {
+            $this->moderate();
+        } elseif ($this->isEditing) {
             $this->update();
         } else {
             $this->store();
         }
     }
 
+    protected function clearEditors(): void
+    {
+        $this->reset('body');
+        $this->reset('message');
+        $this->dispatch('editor:clear', editorId: $this->bodyEditorId);
+        $this->dispatch('editor:clear', editorId: $this->messageEditorId);
+    }
+
+    public function moderate(): void
+    {
+        try {
+            // If moderator has edited the comment, save the new body.
+            if ($this->moderationType === ModerationTypeEnum::Edit) {
+                $comment = Comment::find($this->commentId ?? 0);
+
+                if ($comment->body !== $this->body) {
+                    $comment->body = $this->body;
+                    $comment->save();
+                    $this->dispatch(LivewireEventEnum::CommentUpdated->value, id: $comment->id, parentId: $comment->parent_id);
+                }
+            }
+
+            // Create the moderation comment as a child of the original comment.
+            $comment = new Comment(
+                [
+                    'post_id' => $this->postId,
+                    'parent_id' => $this->parentId,
+                    'user_id' => auth()->id() ?? null,
+                    'moderation_type' => $this->moderationType,
+                    'body' => $this->message,
+                ],
+            );
+
+            $comment->save();
+
+            $this->dispatch(LivewireEventEnum::CommentStored->value, id: $comment->id, parentId: $comment->parent_id);
+
+            $this->clearEditors();
+        } catch (Exception $exception) {
+            $this->logError($exception);
+        }
+    }
+
     public function store(): void
     {
         try {
@@ -89,32 +204,33 @@ public function store(): void
                 [
                     'body' => $this->body,
                     'post_id' => $this->postId,
-                    'user_id' => $this->authorizedUserId,
+                    'user_id' => auth()->id() ?? null,
                     'parent_id' => $this->parentId,
                 ],
             );
 
             $comment->save();
 
-            $this->dispatch(LivewireEventEnum::CommentStored->value);
+            $this->dispatch(LivewireEventEnum::CommentStored->value, id: $comment->id, parentId: $comment->parent_id);
+
+            $this->clearEditors();
 
             $this->message = trans('Comment created.');
         } catch (Exception $exception) {
             $this->logError($exception);
         }
-
-        $this->reset('body');
-        $this->dispatch('editor:clear', editorId: $this->editorId);
     }
 
     public function update(): void
     {
         try {
-            $comment = Comment::find($this->comment->id);
+            $comment = Comment::find($this->commentId ?? 0);
             $comment->body = $this->body;
             $comment->save();
 
-            $this->dispatch(LivewireEventEnum::CommentUpdated->value);
+            $this->dispatch(LivewireEventEnum::CommentUpdated->value, id: $comment->id, parentId: $comment->parent_id);
+
+            $this->clearEditors();
 
             $this->message = trans('Comment updated.');
         } catch (Exception $exception) {
diff --git a/app/Livewire/Comments/CommentListComponent.php b/app/Livewire/Comments/CommentListComponent.php
index 66fec685..9ee38c0f 100644
--- a/app/Livewire/Comments/CommentListComponent.php
+++ b/app/Livewire/Comments/CommentListComponent.php
@@ -5,12 +5,13 @@
 namespace App\Livewire\Comments;
 
 use App\Enums\LivewireEventEnum;
-use App\Models\Post;
 use App\Repositories\CommentRepositoryInterface;
 use App\Traits\AuthStatusTrait;
 use App\Traits\SubsiteTrait;
 use Illuminate\Contracts\View\View;
 use Illuminate\Support\Collection;
+use Livewire\Attributes\Computed;
+use Livewire\Attributes\Locked;
 use Livewire\Attributes\On;
 use Livewire\Component;
 
@@ -19,32 +20,36 @@ final class CommentListComponent extends Component
     use AuthStatusTrait;
     use SubsiteTrait;
 
-    public ?int $authorizedUserId;
-    public Post $post;
-    public Collection $comments;
+    #[Locked]
+    public int $postId = 0;
+
+    #[Locked]
     public string $recordsText = 'comments';
 
     protected CommentRepositoryInterface $commentRepository;
+
     public function boot(CommentRepositoryInterface $commentRepository): void
     {
         $this->commentRepository = $commentRepository;
     }
 
-    public function mount(Post $post): void
+    public function mount(int $postId): void
     {
-        $this->authorizedUserId = $this->getAuthorizedUserId();
+        $this->postId = $postId;
 
-        $this->post = $post;
-        $this->getComments();
         $this->setRecordsLabel();
     }
 
-    public function render(): View
+    #[Computed]
+    public function comments(): Collection
     {
-        $comments = $this->comments;
+        return $this->commentRepository->getCommentsByPostId($this->postId);
+    }
 
+    public function render(): View
+    {
         return view('livewire.comments.comment-list-component', [
-            'comments' => compact('comments'),
+            'comments' => $this->comments,
         ]);
     }
 
@@ -55,7 +60,7 @@ public function render(): View
     ])]
     public function getComments(): void
     {
-        $this->comments = $this->commentRepository->getCommentsByPostId($this->post->id);
+        unset($this->comments);
     }
 
     private function setRecordsLabel(): void
diff --git a/app/Livewire/Comments/CommentReplacement.php b/app/Livewire/Comments/CommentReplacement.php
new file mode 100644
index 00000000..c8f4c3d5
--- /dev/null
+++ b/app/Livewire/Comments/CommentReplacement.php
@@ -0,0 +1,30 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\Livewire\Comments;
+
+use App\Enums\CommentStateEnum;
+use App\Enums\ModerationTypeEnum;
+use App\Traits\CommentComponentTrait;
+use App\Traits\CommentComponentStateTrait;
+use Illuminate\Contracts\View\View;
+use Livewire\Component;
+
+final class CommentReplacement extends Component
+{
+    use CommentComponentStateTrait;
+    use CommentComponentTrait;
+
+    public function render(): View
+    {
+        $moderatorComment = $this->moderatorCommentsByType?->get(ModerationTypeEnum::Replace->value);
+
+        return view('livewire.comments.comment-replacement', [
+            'comment' => $this->comment,
+            'childComments' => $this->childComments,
+            'moderatorComment' => $moderatorComment,
+            'isModerating' => $this->state === CommentStateEnum::Moderating,
+        ]);
+    }
+}
diff --git a/app/Livewire/Comments/CommentWrapper.php b/app/Livewire/Comments/CommentWrapper.php
new file mode 100644
index 00000000..3f372fb7
--- /dev/null
+++ b/app/Livewire/Comments/CommentWrapper.php
@@ -0,0 +1,32 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\Livewire\Comments;
+
+use App\Enums\ModerationTypeEnum;
+use App\Traits\CommentComponentTrait;
+use App\Traits\CommentComponentStateTrait;
+use Illuminate\Contracts\View\View;
+use Livewire\Component;
+
+final class CommentWrapper extends Component
+{
+    use CommentComponentStateTrait;
+    use CommentComponentTrait;
+
+    // State
+    public bool $isOpen = false;
+
+    public function render(): View
+    {
+        $moderatorComment = $this->moderatorCommentsByType?->get(ModerationTypeEnum::Wrap->value);
+
+        return view('livewire.comments.comment-wrapper', [
+            'comment' => $this->comment,
+            'childComments' => $this->childComments,
+            'moderatorComment' => $moderatorComment,
+            'isInitiallyBlurred' => $this->isInitiallyBlurred,
+        ]);
+    }
+}
diff --git a/app/Livewire/Flags/FlagComponent.php b/app/Livewire/Flags/FlagComponent.php
index 2470d3a4..765b1b70 100644
--- a/app/Livewire/Flags/FlagComponent.php
+++ b/app/Livewire/Flags/FlagComponent.php
@@ -11,8 +11,8 @@
 use App\Traits\AuthStatusTrait;
 use App\Traits\LoggingTrait;
 use App\Traits\TypeTrait;
-use Exception;
 use Illuminate\Contracts\View\View;
+use Livewire\Attributes\Locked;
 use Livewire\Component;
 use Maize\Markable\Exceptions\InvalidMarkValueException;
 
@@ -26,25 +26,42 @@ final class FlagComponent extends Component
     private const string MODEL_PATH = 'app\\models\\';
 
     public Comment|Post $model;
+    public Flag|null $userFlag = null;
+
+    #[Locked]
+    public int $modelId;
+    #[Locked]
+    public string $type;
+    #[Locked]
     public int $flagCount = 0;
+    #[Locked]
     public string $iconFilename = 'flag';
-    public string $note = '';
+    #[Locked]
+    public string $titleText;
+    #[Locked]
     public array $flagReasons = [];
+
+    // Actual values we interact with
+    public string $note = '';
     public string $selectedReason = '';
-    public bool $showForm = false;
     public bool $showNoteField = false;
-    public string $titleText;
-    public string $type;
-    public bool $userFlagged = false;
+    public bool $formClosed = false;
 
     public function mount(
         Comment|Post $model,
     ): void {
         $configReasons = config('markable.allowed_values.flag', []);
-        $this->flagReasons = is_array($configReasons) ? $configReasons : [];
 
+        $this->flagReasons = is_array($configReasons) ? array_combine(
+            array_map(fn($reason) => mb_strtolower(preg_replace('/[^\w]+/', '-', $reason)), $configReasons),
+            $configReasons,
+        ) : [];
+
+        $this->formClosed = false;
         $this->model = $model;
+        $this->modelId = $model->id;
         $this->type = $this->getType();
+        $this->userFlag = $this->getUserFlag();
         $this->updateFlagData();
     }
 
@@ -53,77 +70,98 @@ public function render(): View
         return view('livewire.flags.flag-component');
     }
 
-    public function flagReasonSelected(string $selectedReason): void
+    public function isNoteVisibleForReason(string $reason): bool
     {
-        if ($selectedReason === self::FLAG_WITH_NOTE) {
-            $this->showNoteField = true;
-        } else {
-            $this->showNoteField = false;
-            $this->reset('note');
-        }
+        return $reason === self::FLAG_WITH_NOTE;
+    }
 
-        $this->selectedReason = $selectedReason;
+    public function getUserFlag(): Flag | null
+    {
+        return Flag::where([
+            'user_id' => auth()->id(),
+            'markable_id' => $this->model->getKey(),
+            'markable_type' => $this->model->getMorphClass(),
+        ])->first();
     }
 
-    public function updateFlagData(): void
+    protected function updateFlagData(): void
     {
+        $value = $this->userFlag?->value ?? '';
+        $this->selectedReason = in_array($value, $this->flagReasons) ? $value : '';
+        $this->note = $this->userFlag?->metadata['note'] ?? '';
+        $this->showNoteField = $this->isNoteVisibleForReason($this->selectedReason);
         $this->setTitleText();
     }
 
-    public function store(): void
+    protected function deleteUserFlag(): void
     {
-        //        $rules = (new StoreFlagRequest())->rules();
+        Flag::where([
+            'user_id' => auth()->id(),
+            'markable_id' => $this->model->getKey(),
+            'markable_type' => $this->model->getMorphClass(),
+        ])->get()->each->delete();
+    }
 
-        //        $this->validate($rules);
+    public function store(): void
+    {
         $metadata = [];
 
         $selectedReason = mb_trim($this->selectedReason);
+        $noteText = mb_trim($this->note);
 
-        try {
-            if ($selectedReason === self::FLAG_WITH_NOTE && mb_strlen($this->note) > 0) {
-                $metadata = ['note' => $this->note];
-            }
-
-            $event = $this->type === 'comment' ?
-                LivewireEventEnum::CommentFlagged->value :
-                LivewireEventEnum::PostFlagged->value;
-
-            $this->dispatchEvent($event);
+        if ($this->isNoteVisibleForReason($selectedReason) && mb_strlen($noteText) > 0) {
+            $metadata = ['note' => $noteText];
+        }
 
-            Flag::add($this->model, auth()->user(), $selectedReason, $metadata);
+        // Just cancel the change if the form is unmodified
+        if ($selectedReason === ($this->userFlag?->value ?? '') && $metadata === $this->userFlag?->metadata) {
+            $this->cancel();
+            return;
+        }
 
-            $this->showForm = false;
+        $event = $this->type === 'comment' ?
+            LivewireEventEnum::CommentFlagged :
+            LivewireEventEnum::PostFlagged;
 
-            $this->userFlagged = false;
+        // Stop rendering while we are modifying data
+        $this->formClosed = true;
 
-            $this->updateFlagData();
+        $this->deleteUserFlag();
+        try {
+            $this->userFlag = Flag::add($this->model, auth()->user(), $selectedReason, $metadata);
         } catch (InvalidMarkValueException $exception) {
             $this->logError($exception);
         }
+        $this->updateFlagData();
+
+        $this->dispatchEvent($event);
     }
 
     public function delete(): void
     {
-        try {
-            $event = $this->type === 'comment' ?
-                LivewireEventEnum::CommentFlagDeleted->value :
-                LivewireEventEnum::PostFlagDeleted->value;
-
-            $this->dispatchEvent($event);
 
-            Flag::remove($this->model, auth()->user());
+        // Stop rendering while we are modifying data
+        $this->formClosed = true;
+        $event = $this->type === 'comment' ?
+            LivewireEventEnum::CommentFlagDeleted :
+            LivewireEventEnum::PostFlagDeleted;
 
-            $this->userFlagged = false;
+        $this->deleteUserFlag();
+        $this->userFlag = null;
+        $this->updateFlagData();
 
-            $this->updateFlagData();
-        } catch (Exception $exception) {
-            $this->logError($exception);
-        }
+        $this->dispatchEvent($event);
     }
 
-    public function toggleForm(): void
+    public function cancel(): void
     {
-        $this->showForm = !$this->showForm;
+        $this->formClosed = true;
+
+        $event = $this->type === 'comment' ?
+            LivewireEventEnum::CommentFlagCancelled :
+            LivewireEventEnum::PostFlagCancelled;
+
+        $this->dispatchEvent($event);
     }
 
     private function getType(): string
@@ -137,11 +175,11 @@ private function setTitleText(): void
     {
         $flagText = 'Flag this ' . $this->type;
 
-        $this->titleText = $this->userFlagged ? trans('Remove flag') : trans($flagText);
+        $this->titleText = $this->userFlag ? trans('Remove or edit flag') : trans($flagText);
     }
 
-    private function dispatchEvent(string $event): void
+    private function dispatchEvent(LivewireEventEnum $event): void
     {
-        $this->dispatch($event, id: $this->model->id);
+        $this->dispatch($event->value, id: $this->model->id);
     }
 }
diff --git a/app/Livewire/Forms/CommentForm.php b/app/Livewire/Forms/CommentForm.php
index 9e6062e8..c1242f05 100644
--- a/app/Livewire/Forms/CommentForm.php
+++ b/app/Livewire/Forms/CommentForm.php
@@ -5,6 +5,7 @@
 namespace App\Livewire\Forms;
 
 use App\Enums\LivewireEventEnum;
+use App\Enums\ModerationTypeEnum;
 use App\Http\Requests\Comment\StoreCommentRequest;
 use App\Models\Comment;
 use App\Traits\AuthStatusTrait;
@@ -20,7 +21,9 @@ final class CommentForm extends Form
     public string $body = '';
     public int $postId = 0;
     public ?int $parentId = null;
+    public ?ModerationTypeEnum $moderationType = null;
     public ?object $parent = null;
+    public ?object $moderatedComment = null;
 
     public function mount(): void
     {
@@ -32,6 +35,8 @@ public function setComment(Comment $comment): void
         $this->body = $comment->body;
         $this->postId = $comment->post_id;
         $this->parentId = $comment->parent_id;
+        $this->moderationType = $comment->moderation_type;
+        $this->moderatedComment = $comment->moderated_comment;
     }
 
     protected function rules(): array
@@ -47,6 +52,7 @@ public function store(): void
             'body' => $this->body,
             'post_id' => $this->postId,
             'parent_id' => $this->parentId,
+            'moderation_type' => $this->moderationType,
             'user_id' => $this->authorizedUserId,
         ]);
 
@@ -65,6 +71,7 @@ public function update(): void
 
         $this->comment->update([
             'body' => $this->body,
+            'moderation_type' => $this->moderationType,
         ]);
 
         $this->parent->isEditing = false;
diff --git a/app/Models/Comment.php b/app/Models/Comment.php
index bfb8c4df..bc665668 100644
--- a/app/Models/Comment.php
+++ b/app/Models/Comment.php
@@ -4,6 +4,7 @@
 
 namespace App\Models;
 
+use App\Enums\ModerationTypeEnum;
 use Illuminate\Contracts\Database\Eloquent\Builder;
 use Illuminate\Database\Eloquent\Factories\HasFactory;
 use Illuminate\Database\Eloquent\Relations\BelongsTo;
@@ -20,6 +21,7 @@
 /**
  * @property int $id
  * @property string $body
+ * @property ModerationTypeEnum|null $moderation_type
  * @property int $parent_id
  * @property int $post_id
  * @property int $user_id
@@ -38,11 +40,16 @@ final class Comment extends BaseModel
 
     protected $fillable = [
         'body',
+        'moderation_type',
         'parent_id',
         'post_id',
         'user_id',
     ];
 
+    protected $casts = [
+        'moderation_type' => ModerationTypeEnum::class,
+    ];
+
     protected static array $marks = [
         Bookmark::class,
         Favorite::class,
@@ -97,7 +104,19 @@ public function favoriteCount(): int
 
     public function flagCount(): int
     {
-        return Flag::count($this);
+        return Flag::where([
+            'markable_id' => $this->getKey(),
+            'markable_type' => $this->getMorphClass(),
+        ])->count();
+    }
+
+    public function userFlagged(): bool
+    {
+        return Flag::where([
+            'user_id' => auth()->id(),
+            'markable_id' => $this->getKey(),
+            'markable_type' => $this->getMorphClass(),
+        ])->exists();
     }
 
     public function post(): BelongsTo
@@ -119,7 +138,6 @@ public function parent(): BelongsTo
         );
     }
 
-
     public function replies(): HasMany
     {
         return $this->hasMany(
diff --git a/app/Models/Post.php b/app/Models/Post.php
index f2eae3df..2f76bf97 100644
--- a/app/Models/Post.php
+++ b/app/Models/Post.php
@@ -155,7 +155,19 @@ public function favoriteCount(): int
 
     public function flagCount(): int
     {
-        return Flag::count($this);
+        return Flag::where([
+            'markable_id' => $this->getKey(),
+            'markable_type' => $this->getMorphClass(),
+        ])->count();
+    }
+
+    public function userFlagged(): bool
+    {
+        return Flag::where([
+            'user_id' => auth()->id(),
+            'markable_id' => $this->getKey(),
+            'markable_type' => $this->getMorphClass(),
+        ])->exists();
     }
 
     public function next(): Post|null
diff --git a/app/Repositories/CommentRepository.php b/app/Repositories/CommentRepository.php
index 3d291ab0..1691a491 100644
--- a/app/Repositories/CommentRepository.php
+++ b/app/Repositories/CommentRepository.php
@@ -13,6 +13,8 @@ final class CommentRepository extends BaseRepository implements CommentRepositor
         'comments.id',
         'comments.body',
         'comments.post_id',
+        'comments.parent_id',
+        'comments.moderation_type',
         'comments.user_id',
         'comments.created_at',
         'comments.deleted_at',
@@ -49,4 +51,19 @@ public function getCommentsByPostId(int $postId, ?Comment $latestComment = null)
 
         return $query->get();
     }
+
+    public function getCommentsByParentId(int $parentId): Collection
+    {
+        $query = $this->model->newQuery()
+            ->join('users', 'comments.user_id', '=', 'users.id')
+            ->select(self::COLUMNS)
+            ->with([
+                'user',
+            ])
+            ->where('comments.parent_id', '=', $parentId);
+
+        $query->orderBy('comments.created_at');
+
+        return $query->get();
+    }
 }
diff --git a/app/Repositories/CommentRepositoryInterface.php b/app/Repositories/CommentRepositoryInterface.php
index f6d69dde..d21a10db 100644
--- a/app/Repositories/CommentRepositoryInterface.php
+++ b/app/Repositories/CommentRepositoryInterface.php
@@ -11,4 +11,6 @@ interface CommentRepositoryInterface extends BaseRepositoryInterface
     public function getCommentByUserId(int $userId);
 
     public function getCommentsByPostId(int $postId, ?Comment $latestComment = null);
+
+    public function getCommentsByParentId(int $parentId);
 }
diff --git a/app/Traits/CommentComponentStateTrait.php b/app/Traits/CommentComponentStateTrait.php
new file mode 100644
index 00000000..f57f7c88
--- /dev/null
+++ b/app/Traits/CommentComponentStateTrait.php
@@ -0,0 +1,15 @@
+<?php
+
+declare(strict_types=1);
+
+namespace App\Traits;
+
+use App\Enums\CommentStateEnum;
+use Livewire\Attributes\Reactive;
+
+trait CommentComponentStateTrait
+{
+    // State
+    #[Reactive]
+    public CommentStateEnum $state = CommentStateEnum::Viewing;
+}
diff --git a/app/Traits/CommentComponentTrait.php b/app/Traits/CommentComponentTrait.php
index 9067c4f4..f8f50f1f 100644
--- a/app/Traits/CommentComponentTrait.php
+++ b/app/Traits/CommentComponentTrait.php
@@ -4,11 +4,81 @@
 
 namespace App\Traits;
 
+use App\Enums\CommentStateEnum;
+use App\Enums\LivewireEventEnum;
+use App\Enums\ModerationTypeEnum;
+use App\Models\Comment;
+use App\Repositories\CommentRepositoryInterface;
+use Illuminate\Support\Collection;
+use Livewire\Attributes\Computed;
+use Livewire\Attributes\Locked;
+use Livewire\Attributes\On;
+
 trait CommentComponentTrait
 {
+    // Data
+    #[Locked]
+    public int $commentId = 0;
+
+    // Provided via mount or fetched during hydration.
+    protected ?Comment $comment = null;
+    protected ?Collection $childComments = null;
+
+    #[Computed]
+    public function flagCount(): int
+    {
+        return $this->comment?->flagCount() ?? 0;
+    }
+
+    #[Computed]
+    public function userFlagged(): bool
+    {
+        return $this->comment?->userFlagged() ?? false;
+    }
+
+    #[Computed]
+    public function moderatorCommentsByType(): ?Collection
+    {
+        return $this->childComments?->filter(
+            fn($comment) =>
+            $comment->moderation_type !== null &&
+            $comment->moderation_type->value !== ModerationTypeEnum::Comment->value,
+        )->keyBy(fn($comment) => $comment->moderation_type->value ?? 'none');
+    }
+
+    #[Computed]
+    public function isInitiallyBlurred(): bool
+    {
+        return $this->moderatorCommentsByType?->get(ModerationTypeEnum::Blur->value) !== null;
+    }
+
+    protected CommentRepositoryInterface $commentRepository;
+
+    public function bootCommentComponentTrait(CommentRepositoryInterface $commentRepository): void
+    {
+        $this->commentRepository = $commentRepository;
+    }
+
+    public function mountCommentComponentTrait(int $commentId, ?Comment $comment, ?Collection $childComments): void
+    {
+        // On mount we expect the comment list to provide the comment model
+        // and the moderator comments collection.
+        $this->commentId = $commentId;
+        $this->comment = $comment ?? Comment::find($commentId);
+        $this->childComments = $childComments;
+    }
+
+    public function hydrateCommentComponentTrait(): void
+    {
+        // On subsequent requests, we need to re-fetch the comment and moderator comments.
+        $this->comment = $this->commentId ? Comment::find($this->commentId) : null;
+        $this->childComments = $this->commentRepository->getCommentsByParentId($this->commentId);
+    }
+
+
     public function toggleEditing(): void
     {
-        if ($this->isEditing === true) {
+        if ($this->state === CommentStateEnum::Editing) {
             $this->stopEditing();
         } else {
             $this->startEditing();
@@ -17,7 +87,7 @@ public function toggleEditing(): void
 
     public function toggleFlagging(): void
     {
-        if ($this->isFlagging === true) {
+        if ($this->state === CommentStateEnum::Flagging) {
             $this->stopFlagging();
         } else {
             $this->startFlagging();
@@ -26,46 +96,64 @@ public function toggleFlagging(): void
 
     public function toggleReplying(): void
     {
-        if ($this->isReplying === true) {
+        if ($this->state === CommentStateEnum::Replying) {
             $this->stopReplying();
         } else {
             $this->startReplying();
         }
     }
 
+    public function toggleModerating(): void
+    {
+        if ($this->state === CommentStateEnum::Moderating) {
+            $this->stopModerating();
+        } else {
+            $this->startModerating();
+        }
+    }
+
+    public function requestStateChange(CommentStateEnum $state): void
+    {
+        $this->dispatch(LivewireEventEnum::CommentFormStateChanged->value, id: $this->commentId, state: $state);
+    }
+
     public function startEditing(): void
     {
-        $this->isEditing = true;
-        $this->stopFlagging();
-        $this->stopReplying();
+        $this->requestStateChange(CommentStateEnum::Editing);
     }
 
     public function stopEditing(): void
     {
-        $this->isEditing = false;
+        $this->requestStateChange(CommentStateEnum::Viewing);
     }
 
     public function startFlagging(): void
     {
-        $this->isFlagging = true;
-        $this->stopEditing();
-        $this->stopReplying();
+        $this->requestStateChange(CommentStateEnum::Flagging);
     }
 
     public function stopFlagging(): void
     {
-        $this->isFlagging = false;
+        $this->requestStateChange(CommentStateEnum::Viewing);
     }
 
     public function startReplying(): void
     {
-        $this->isReplying = true;
-        $this->stopEditing();
-        $this->stopFlagging();
+        $this->requestStateChange(CommentStateEnum::Replying);
     }
 
     public function stopReplying(): void
     {
-        $this->isReplying = false;
+        $this->requestStateChange(CommentStateEnum::Viewing);
+    }
+
+    public function startModerating(): void
+    {
+        $this->requestStateChange(CommentStateEnum::Moderating);
+    }
+
+    public function stopModerating(): void
+    {
+        $this->requestStateChange(CommentStateEnum::Viewing);
     }
 }
diff --git a/database/migrations/2025_07_08_232421_add_comment_moderation_fields.php b/database/migrations/2025_07_08_232421_add_comment_moderation_fields.php
new file mode 100644
index 00000000..b45f372f
--- /dev/null
+++ b/database/migrations/2025_07_08_232421_add_comment_moderation_fields.php
@@ -0,0 +1,23 @@
+<?php
+
+declare(strict_types=1);
+
+use Illuminate\Database\Migrations\Migration;
+use Illuminate\Database\Schema\Blueprint;
+use Illuminate\Support\Facades\Schema;
+
+return new class extends Migration {
+    public function up(): void
+    {
+        Schema::table('comments', function (Blueprint $table) {
+            $table->enum('moderation_type', ['blur', 'comment', 'edit', 'remove', 'replace', 'wrap'])->nullable();
+        });
+    }
+
+    public function down(): void
+    {
+        Schema::table('comments', function (Blueprint $table) {
+            $table->dropColumn(['moderation_type']);
+        });
+    }
+};
diff --git a/public_html/images/icons/bars-rotate-fade.svg b/public_html/images/icons/bars-rotate-fade.svg
new file mode 100644
index 00000000..bdcd8fcf
--- /dev/null
+++ b/public_html/images/icons/bars-rotate-fade.svg
@@ -0,0 +1 @@
+<svg width="16" height="16" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><g><rect x="11" y="1" width="2" height="5" opacity=".14"/><rect x="11" y="1" width="2" height="5" transform="rotate(30 12 12)" opacity=".29"/><rect x="11" y="1" width="2" height="5" transform="rotate(60 12 12)" opacity=".43"/><rect x="11" y="1" width="2" height="5" transform="rotate(90 12 12)" opacity=".57"/><rect x="11" y="1" width="2" height="5" transform="rotate(120 12 12)" opacity=".71"/><rect x="11" y="1" width="2" height="5" transform="rotate(150 12 12)" opacity=".86"/><rect x="11" y="1" width="2" height="5" transform="rotate(180 12 12)"/><animateTransform attributeName="transform" type="rotate" calcMode="discrete" dur="0.75s" values="0 12 12;30 12 12;60 12 12;90 12 12;120 12 12;150 12 12;180 12 12;210 12 12;240 12 12;270 12 12;300 12 12;330 12 12;360 12 12" repeatCount="indefinite"/></g></svg>
\ No newline at end of file
diff --git a/public_html/images/icons/chevron-details.svg b/public_html/images/icons/chevron-details.svg
new file mode 100644
index 00000000..052a2c5e
--- /dev/null
+++ b/public_html/images/icons/chevron-details.svg
@@ -0,0 +1,5 @@
+<svg width="18" height="10" viewBox="0 0 18 10" version="1.1" xmlns="http://www.w3.org/2000/svg" style="fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:2;">
+    <g transform="matrix(-0.0247114,-3.02628e-18,2.90782e-18,-0.0237442,23.7506,13.5573)">
+        <path d="M254.6,477.479C259.711,473.272 561.717,170.223 561.717,170.223C561.717,170.223 576.205,153.951 597.839,153.983C621.181,154.019 636.425,170.096 636.425,170.096C636.425,170.096 939.167,475.94 940.854,477.463C967.2,501.255 956.012,536.939 942.827,551.356C928.606,566.906 896.33,575.498 868.319,549.101C865.351,546.304 604.846,285.516 604.846,285.516C604.846,285.516 601.137,280.823 597.481,280.661C594.25,280.517 589.683,285.449 589.683,285.449C589.683,285.449 332.794,543.858 326.478,549.801C312.614,562.847 276.463,576.895 252.279,552.019C218.24,517.006 250.72,480.673 254.6,477.479Z"/>
+    </g>
+</svg>
diff --git a/public_html/images/icons/stoplights-fill.svg b/public_html/images/icons/stoplights-fill.svg
new file mode 100644
index 00000000..f0b2d767
--- /dev/null
+++ b/public_html/images/icons/stoplights-fill.svg
@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-stoplights-fill" viewBox="0 0 16 16">
+  <path fill-rule="evenodd" d="M6 0a2 2 0 0 0-2 2H2c.167.5.8 1.6 2 2v2H2c.167.5.8 1.6 2 2v2H2c.167.5.8 1.6 2 2v1a2 2 0 0 0 2 2h4a2 2 0 0 0 2-2v-1c1.2-.4 1.833-1.5 2-2h-2V8c1.2-.4 1.833-1.5 2-2h-2V4c1.2-.4 1.833-1.5 2-2h-2a2 2 0 0 0-2-2zm3.5 3.5a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0m0 4a1.5 1.5 0 1 1-3 0 1.5 1.5 0 0 1 3 0M8 13a1.5 1.5 0 1 1 0-3 1.5 1.5 0 0 1 0 3"/>
+</svg>
\ No newline at end of file
diff --git a/resources/sass/app.scss b/resources/sass/app.scss
index dc3b37d5..6ea0cdd8 100644
--- a/resources/sass/app.scss
+++ b/resources/sass/app.scss
@@ -5,6 +5,7 @@
 
 @use 'modules/accessibility';
 @use 'modules/animation';
+@use 'modules/blurred-content';
 @use 'modules/buttons';
 @use 'modules/details';
 @use 'modules/dropdowns';
@@ -31,4 +32,4 @@
 @use 'modules/toast';
 @use 'modules/typography';
 @use 'modules/usability';
-@use 'modules/wysiwyg';
+@use 'modules/wysiwyg';
\ No newline at end of file
diff --git a/resources/sass/modules/_blurred-content.scss b/resources/sass/modules/_blurred-content.scss
new file mode 100644
index 00000000..60f71220
--- /dev/null
+++ b/resources/sass/modules/_blurred-content.scss
@@ -0,0 +1,49 @@
+.blur-container {
+  position: relative;
+  display: block;
+  border-radius: inherit;
+}
+
+.blur-container.blurred {
+  display: grid;
+  grid-template-columns: auto;
+  grid-template-rows: auto;
+
+  overflow: hidden;
+}
+
+.blur-container.blurred>* {
+  grid-area: 1 / 1;
+}
+
+.blur-container.blurred>.blur-content {
+  position: relative;
+
+  max-height: 8rem;
+  overflow: hidden;
+
+  border-radius: inherit;
+
+  mask:
+    linear-gradient(to top, transparent 1rem, white 2rem calc(100% - 2rem), transparent calc(100% - 1rem)),
+    linear-gradient(to left, transparent 1rem, white 2rem calc(100% - 2rem), transparent calc(100% - 1rem));
+  mask-position: center;
+  mask-repeat: no-repeat;
+  mask-composite: intersect;
+}
+
+.blur-container>.blur-overlay {
+  display: none;
+  border-radius: inherit;
+}
+
+.blur-container.blurred>.blur-overlay {
+  padding: 0.75rem;
+
+  display: flex;
+  align-items: center;
+  justify-content: center;
+
+  backdrop-filter: blur(0.5rem);
+  cursor: pointer;
+}
\ No newline at end of file
diff --git a/resources/sass/modules/_details.scss b/resources/sass/modules/_details.scss
index 61906dd1..0a5046b3 100644
--- a/resources/sass/modules/_details.scss
+++ b/resources/sass/modules/_details.scss
@@ -1,7 +1,5 @@
-
 summary {
     display: flex;
-    justify-content: space-between;
     cursor: pointer;
 }
 
@@ -9,23 +7,28 @@ summary::-webkit-details-marker {
     display: none;
 }
 
-summary {
+details>summary {
     list-style-type: '⬇ ';
 }
 
-details[open] > summary {
+details[open]>summary {
     list-style-type: '⬆ ';
 }
 
-summary::after {
-    content: '';
-    width: 18px;
-    height: 10px;
-    background: url('https://uploads.sitepoint.com/wp-content/uploads/2023/10/1697699669arrow.svg') no-repeat;
-    background-size: cover;
-    transition: 0.2s;
-}
+.main-sidebar {
+    details>summary {
+        justify-content: space-between;
+        color: light-dark(var(--base-color), var(--yellow-green))
+    }
 
-details[open] > summary::after {
-    transform: rotate(180deg);
-}
+    details>summary .icon.chevron-details {
+        width: auto;
+        height: auto;
+        bottom: 0;
+        margin: 0;
+    }
+
+    details[open]>summary .chevron-details {
+        transform: rotate(180deg);
+    }
+}
\ No newline at end of file
diff --git a/resources/sass/modules/_forms.scss b/resources/sass/modules/_forms.scss
index 9890da9d..06f8b489 100644
--- a/resources/sass/modules/_forms.scss
+++ b/resources/sass/modules/_forms.scss
@@ -19,7 +19,7 @@ main input[type='url'] {
 }
 
 textarea.comment-textarea {
-    resize: block;
+    resize: vertical;
 }
 
 input[type='radio'] {
@@ -60,6 +60,12 @@ input[type='radio']:focus {
     min-height: 10rem;
 }
 
+label.radio-button-label {
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+}
+
 .radio-button-label:focus-within {
     color: var(--dark-base-color);
 }
@@ -68,10 +74,22 @@ input[type='radio']:focus {
     margin: 0 0 1rem 0;
 }
 
-.fantastic {
+.flag-form fieldset legend {
     margin-bottom: 1rem;
 }
 
+.flag-form label:has(input[type='radio']) {
+    margin-bottom: 0.5rem;
+}
+
+.flag-form label:has(input[type='radio'].flag-reason-fantastic) {
+    margin-bottom: 1rem;
+}
+
+.flag-form textarea.flag-note {
+    resize: vertical;
+}
+
 .input-icon-wrap {
     display: flex;
     flex-direction: row;
diff --git a/resources/sass/modules/_posts.scss b/resources/sass/modules/_posts.scss
index 30e8f2b1..6c8be33a 100644
--- a/resources/sass/modules/_posts.scss
+++ b/resources/sass/modules/_posts.scss
@@ -1,7 +1,119 @@
-
-.comment,
 .post {
-    margin: 0 0 2rem 0;
+    position: relative;
+    padding: 0.75rem;
+    border-radius: 0.25rem;
+    margin-bottom: 2rem;
+}
+
+.comments {
+    display: flex;
+    flex-direction: column;
+    gap: 2rem;
+    margin-bottom: 2rem;
+}
+
+.comment {
+    position: relative;
+    border-radius: 0.25rem;
+}
+
+.comment>.moderator-replaced,
+.comment>.moderator-hidden>summary,
+.comment .comment-container {
     padding: 0.75rem;
     border-radius: 0.25rem;
 }
+
+.comment .blur-container {
+    border-radius: 0.25rem;
+}
+
+.comment-footer {
+    display: flex;
+    align-items: center;
+    flex-wrap: wrap;
+    gap: 1rem;
+}
+
+.comment-metadata {
+    display: flex;
+    align-items: center;
+    gap: 1rem;
+}
+
+.comment-metadata>time {
+    display: inline-flex;
+    gap: 1rem;
+}
+
+.moderator-message {
+    border: 1px solid light-dark(var(--base-color), var(--yellow-green));
+    color: light-dark(var(--base-color), var(--yellow-green));
+}
+
+details.moderator-hidden {
+    padding: 0;
+    border-radius: inherit;
+
+    &>summary {
+        flex-direction: column;
+        justify-content: flex-start;
+        align-items: flex-start;
+
+        border-radius: inherit;
+    }
+
+    &[open]>summary {
+        margin-bottom: 0.5rem;
+        border-bottom-left-radius: 0;
+        border-bottom-right-radius: 0;
+    }
+
+    &>summary>footer.comment-controls:before {
+        display: block;
+        content: '▶︎';
+        width: 1rem;
+        height: auto;
+    }
+
+    &[open]>summary>footer.comment-controls:before {
+        content: '▼';
+    }
+
+    &>summary>main+footer,
+    &>summary>footer+footer {
+        margin-top: 0.5rem;
+    }
+
+    &>summary>footer.comment-controls {
+        display: flex;
+        flex-direction: row;
+        gap: 0.25rem;
+    }
+
+    &>summary>footer.comment-controls>span.show-comment,
+    &[open]>summary>footer.comment-controls>span.hide-comment {
+        display: block;
+    }
+
+    &>summary>footer.comment-controls>span.hide-comment,
+    &[open]>summary>footer.comment-controls>span.show-comment {
+        display: none;
+    }
+}
+
+.button:not(.loading)>span.icon:not(.loading-icon) {
+    display: inline;
+}
+
+.button:not(.loading)>span.icon.loading-icon {
+    display: none;
+}
+
+.button.loading>span.icon:not(.loading-icon) {
+    display: none;
+}
+
+.button.loading>span.icon.loading-icon {
+    display: inline;
+}
\ No newline at end of file
diff --git a/resources/views/comments/partials/comment-footer.blade.php b/resources/views/comments/partials/comment-footer.blade.php
index b11b3230..ce7df77c 100644
--- a/resources/views/comments/partials/comment-footer.blade.php
+++ b/resources/views/comments/partials/comment-footer.blade.php
@@ -1,6 +1,6 @@
 <footer class="comment-footer">
     <div class="level">
-        <div>
+        <div class="comment-metadata">
             <address>
                 <x-members.profile-link-component :user="$comment->user" />
             </address>
diff --git a/resources/views/components/layout/sidebar-section-component.blade.php b/resources/views/components/layout/sidebar-section-component.blade.php
index 03035d2d..da445196 100644
--- a/resources/views/components/layout/sidebar-section-component.blade.php
+++ b/resources/views/components/layout/sidebar-section-component.blade.php
@@ -6,6 +6,7 @@
     @endif
         <summary>
             <h3>{{  trans($heading) }}</h3>
+            <x-icons.icon-component class="chevron-details" filename="chevron-details"/>
         </summary>
 
         {{ $slot }}
diff --git a/resources/views/components/popovers/popover-component.blade.php b/resources/views/components/popovers/popover-component.blade.php
index e8183575..d8d1370e 100644
--- a/resources/views/components/popovers/popover-component.blade.php
+++ b/resources/views/components/popovers/popover-component.blade.php
@@ -4,7 +4,7 @@
     </button>
 
     <div id="{{ $popoverId }}" popover>
-        <x-icons.icon-component filename="info-fill" />
+        <x-icons.icon-component filename="info-circle-fill" />
 
         @if (!is_null($routeName))
             <a href="{{ route($routeName) }}">
diff --git a/resources/views/livewire/comments/comment-blur.blade.php b/resources/views/livewire/comments/comment-blur.blade.php
new file mode 100644
index 00000000..e6f70bf3
--- /dev/null
+++ b/resources/views/livewire/comments/comment-blur.blade.php
@@ -0,0 +1,25 @@
+<div class="blur-container"
+    x-data="{ isBlurred: $wire.entangle('isBlurred') }"
+    :class="{ 'blurred': isBlurred }">
+    <div class="blur-content">
+        <livewire:comments.comment-content
+            :comment-id="$commentId"
+            :comment="$comment"
+            :child-comments="$childComments"
+            :$state
+        />
+    </div>
+    <div class="blur-overlay" x-show="isBlurred" @click="isBlurred = false">
+        @if (!empty($blurMessage))
+            {!! $blurMessage !!}
+        @endif
+    </div>
+</div>
+
+@script
+<script>
+    $js('toggleBlurred', () => {
+        $wire.isBlurred = !$wire.isBlurred;
+    });
+</script>
+@endscript
\ No newline at end of file
diff --git a/resources/views/livewire/comments/comment-component.blade.php b/resources/views/livewire/comments/comment-component.blade.php
index 32b548ec..7cdc1ad2 100644
--- a/resources/views/livewire/comments/comment-component.blade.php
+++ b/resources/views/livewire/comments/comment-component.blade.php
@@ -1,56 +1,97 @@
-<article class="comment">
-    {!! $comment->body !!}
+@php
+use App\Enums\ModerationTypeEnum;
+@endphp
 
-    <footer class="comment-footer">
-        <x-members.profile-link-component :user="$comment->user"/>
-
-        @include('comments.partials.comment-timestamp', [
-            'comment' => $comment,
-        ])
-
-        @auth
-            <livewire:bookmarks.bookmark-component :model="$comment"/>
-        @endauth
-
-        <livewire:favorites.favorite-component :model="$comment"/>
-
-        @auth
-            @if ($comment->user_id === auth()->id())
-                @include('livewire.comments.partials.toggle-editing-button')
-            @endif
-            @include('livewire.comments.partials.toggle-replying-button')
-        @endauth
+<article class="comment"
+    data-comment-id="{{ $commentId }}"
+    data-member-id="{{ $comment->user->id }}"
+>
+    @if ($moderationType === ModerationTypeEnum::Replace)
+        <livewire:comments.comment-replacement
+            wire:key="comment-replacement-{{ $replacedByCommentId ?? $commentId }}"
+            :comment-id="$commentId"
+            :comment="$comment"
+            :child-comments="$childComments"
+            :$state
+            @comment-form-state-changed="setState($event.detail.state)"
+        />
+    @elseif ($moderationType === ModerationTypeEnum::Wrap)
+        <livewire:comments.comment-wrapper
+            wire:key="comment-wrapper-{{ $wrappedByCommentId ?? $commentId }}"
+            :comment-id="$commentId"
+            :comment="$comment"
+            :child-comments="$childComments"
+            :$state
+            @comment-form-state-changed="setState($event.detail.state)"
+        />
+    @elseif ($isInitiallyBlurred)
+        <livewire:comments.comment-blur
+            wire:key="comment-blur-{{ $blurredByCommentId ?? $commentId }}"
+            :comment-id="$commentId"
+            :comment="$comment"
+            :child-comments="$childComments"
+            :$state
+            @comment-form-state-changed="setState($event.detail.state)"
+        />
+    @else
+        <livewire:comments.comment-content
+            :comment-id="$commentId"
+            :comment="$comment"
+            :child-comments="$childComments"
+            :$state
+            @comment-form-state-changed="setState($event.detail.state)"
+        />
+    @endif
 
-        @include('livewire.comments.partials.toggle-flagging-button')
-    </footer>
-    {{--
-        @include('comments.partials.comment-admin-footer')
-    --}}
     @if ($isEditing === true)
         <livewire:comments.comment-form-component
-            wire:key="'edit-comment-' . $comment->id"
-            :post-id="$comment->post_id"
+            wire:key="edit-comment-{{ $commentId }}"
             :comment="$comment"
-            :is-editing="$isEditing"
-            button-text="{{ trans('Update') }}"
+            is-editing="true"
+            @comment-updated="closeForm()"
+            @comment-stored="closeForm()"
         />
     @endif
 
     @if ($isFlagging === true)
         <livewire:flags.flag-component
-            wire:key="'flagging-comment-' . $comment->id"
+            wire:key="flagging-comment-{{ $commentId }}"
             :comment-id="$comment->id"
             :model="$comment"
+            @comment-flagged="addUserFlag($event.detail.id)"
+            @comment-flag-cancelled="closeForm()"
+            @comment-flag-deleted="removeUserFlag($event.detail.id)"
         />
     @endif
 
     @if ($isReplying === true)
         <livewire:comments.comment-form-component
-            wire:key="'reply-to-comment-' . $comment->id"
-            :post-id="$comment->post_id"
-            :parent-id="$comment->id"
-            :is-replying="$isReplying"
-            button-text="{{ trans('Reply') }}"
+            wire:key="reply-to-comment-{{ $commentId }}"
+            :comment="$comment"
+            is-replying="true"
+            @comment-updated="closeForm()"
+            @comment-stored="closeForm()"
+        />
+    @endif
+
+    @if ($isModerating === true)
+        <livewire:comments.comment-form-component
+            wire:key="moderate-comment-{{ $commentId }}"
+            :comment="$comment"
+            is-moderating="true"
+            @comment-updated="closeForm()"
+            @comment-stored="closeForm()"
         />
     @endif
 </article>
+
+@script
+<script>
+    $js('toggleBlurred', () => {
+        $wire.isBlurred = !$wire.isBlurred;
+    });
+    $js('toggleOpen', () => {
+        $wire.isOpen = !$wire.isOpen;
+    });
+</script>
+@endscript
\ No newline at end of file
diff --git a/resources/views/livewire/comments/comment-content.blade.php b/resources/views/livewire/comments/comment-content.blade.php
new file mode 100644
index 00000000..fcd7e034
--- /dev/null
+++ b/resources/views/livewire/comments/comment-content.blade.php
@@ -0,0 +1,37 @@
+<div class="comment-container">
+    <section class="comment-content">
+        {!! $body !!}
+    </section>
+
+    <footer class="comment-footer">
+        <div class="comment-metadata">
+            <x-members.profile-link-component :user="$comment->user"/>
+
+            @include('comments.partials.comment-timestamp', [
+                'comment' => $comment,
+            ])
+        </div>
+
+        @auth
+            <livewire:bookmarks.bookmark-component
+                wire:key="bookmark-component-{{ $comment->id }}"
+                :model="$comment"
+            />
+
+            <livewire:favorites.favorite-component
+                wire:key="favorite-component-{{ $comment->id }}"
+                :model="$comment"
+            />
+
+            @if ($comment->user_id === auth()->id())
+                @include('livewire.comments.partials.toggle-editing-button')
+            @endif
+
+            @include('livewire.comments.partials.toggle-replying-button')
+
+            @include('livewire.comments.partials.toggle-moderating-button')
+        @endauth
+
+        @include('livewire.comments.partials.toggle-flagging-button')
+    </footer>
+</div>
diff --git a/resources/views/livewire/comments/comment-form-component.blade.php b/resources/views/livewire/comments/comment-form-component.blade.php
index 6dafaecf..b2aafd31 100644
--- a/resources/views/livewire/comments/comment-form-component.blade.php
+++ b/resources/views/livewire/comments/comment-form-component.blade.php
@@ -1,9 +1,14 @@
 <form
     wire:submit.prevent="submit"
+    x-data="{
+        isBodyEditable: {{ json_encode($this->isBodyEditable) }},
+        isEditing: {{ json_encode($this->isEditing) }},
+        isModerating: {{ json_encode($this->isModerating) }},
+    }"
     @if ($isEditing === true)
-        id="edit-comment-form-{{ $comment->id }}"
+        id="edit-comment-form-{{ $commentId }}"
     @elseif ($isReplying === true)
-        id="reply-to-comment-form-{{ $comment->id }}"
+        id="reply-to-comment-form-{{ $commentId }}"
     @endif
 >
     @include('forms.partials.csrf-token')
@@ -11,36 +16,71 @@
     @include('livewire.common.partials.posting-as')
 
     <fieldset>
-        <div wire:ignore>
-            <label for="{{ $this->editorId }}" class="sr-only">
-                {{ trans('Comment') }}
+        @if ($isModerating)
+        <div class="form-group">
+            <label for="moderation-type-{{ $idSuffix }}" class="form-label">{{ trans('Moderation Type') }}</label>
+            <select 
+                wire:model.live="moderationType"
+                id="moderation-type-{{ $idSuffix }}" 
+                class="form-select">
+                <option value="">{{ trans('Select moderation action...') }}</option>
+                <option value="edit">{{ trans('Edit') }}</option>
+                <option value="remove">{{ trans('Remove') }}</option>
+                <option value="replace">{{ trans('Replace') }}</option>
+                <option value="wrap">{{ trans('Wrap') }}</option>
+                <option value="blur">{{ trans('Blur') }}</option>
+            </select>
+        </div>
+        @endif
+
+        <div class="form-group" x-show="isBodyEditable || (isModerating && $wire.moderationType === 'edit')">
+            <label for="{{ $this->bodyEditorId }}">
+                {{ trans($bodyLabel) }}
             </label>
 
+            @if ($isBodyEditable)
             <livewire:wysiwyg.wysiwyg-component
-                    editor-id="{{ $this->editorId }}"
-                    name="text"
-                    wire:model="body" />
+                wire:key="body-editor"
+                editor-id="{{ $this->bodyEditorId }}"
+                name="body"
+                wire:model="body" />
+            @else
+                <div class="loading-indicator">
+                    <x-icons.icon-component class="loading-icon" filename="bars-rotate-fade" />
+                </div>
+            @endif
+        </div>
+
+        @if ($isModerating)
+        <div class="form-group">
+            <label for="{{ $this->messageEditorId }}">
+                {{ $messageLabel }}
+            </label>
 
-            <div class="level">
-                @if($isEditing === true || $isReplying === true)
-                    <button
-                        type="button"
-                        class="button secondary-button"
-                        wire:click="$parent.closeForm({{ $comment->id }})">
-                        {{ trans('Cancel') }}
-                    </button>
-                @endif
+            <livewire:wysiwyg.wysiwyg-component
+                wire:key="message-editor"
+                editor-id="{{ $this->messageEditorId }}"
+                name="message"
+                wire:model="message" />
+        </div>
+        @endif
 
+        <div class="level">
+            @if($isEditing === true || $isReplying === true || $isModerating === true)
                 <button
-                    type="submit"
-                    class="button primary-button">
-                    @if (!empty($buttonText))
-                        {{ trans($buttonText) }}
-                    @else
-                        {{ trans('Add Comment') }}
-                    @endif
+                    type="button"
+                    class="button secondary-button"
+                    wire:click="$parent.closeForm({{ $commentId }})">
+                    {{ trans('Cancel') }}
                 </button>
-            </div>
+            @endif
+
+            <button
+                type="submit"
+                class="button primary-button"
+                :disabled="isModerating && !$wire.moderationType">
+                {{ $buttonText }}
+            </button>
         </div>
     </fieldset>
 </form>
diff --git a/resources/views/livewire/comments/comment-list-component.blade.php b/resources/views/livewire/comments/comment-list-component.blade.php
index 6288b556..7437565c 100644
--- a/resources/views/livewire/comments/comment-list-component.blade.php
+++ b/resources/views/livewire/comments/comment-list-component.blade.php
@@ -3,11 +3,24 @@
         {{ trans('Comments') }}
     </h2>
 
-    @forelse ($comments as $comment)
+    @php
+        // We will display moderator comments alongside the original comment,
+        // if it is present. We can split the collection of comments on the
+        // post into collections per moderated comment, with top-level comments
+        // grouped under an ID of 0.
+        $commentsByParentId = $comments->groupBy(fn ($comment) => $comment->parent_id ?? 0);
+        $rootComments = $commentsByParentId->get(0) ?? [];
+    @endphp
+    @forelse ($rootComments as $comment)
+        @php
+            $childComments = $commentsByParentId->get($comment->id);
+        @endphp
+
         <livewire:comments.comment-component
-            wire:key="{{ $comment->id }}"
+            :key="$comment->id"
+            :comment-id="$comment->id"
             :comment="$comment"
-            :post="$post"
+            :child-comments="$childComments"
         />
     @empty
         @include('notifications.none-listed', [
@@ -15,5 +28,5 @@
         ])
     @endforelse
 
-    <div wire:poll.30s="getComments"></div>
+    <!-- div wire:poll.5s="getComments"></div -->
 </section>
diff --git a/resources/views/livewire/comments/comment-replacement.blade.php b/resources/views/livewire/comments/comment-replacement.blade.php
new file mode 100644
index 00000000..6cd48db6
--- /dev/null
+++ b/resources/views/livewire/comments/comment-replacement.blade.php
@@ -0,0 +1,18 @@
+<div class="moderator-message moderator-replaced">
+    <section class="moderator-content">
+        {!! $moderatorComment->body !!}
+    </section>
+    <footer class="comment-footer">
+        <div class="comment-metadata">
+            <x-members.profile-link-component :user="$moderatorComment->user"/>
+
+            @include('comments.partials.comment-timestamp', [
+                'comment' => $moderatorComment,
+            ])
+        </div>
+
+        @auth
+            @include('livewire.comments.partials.toggle-moderating-button')
+        @endauth
+    </footer>
+</div>
\ No newline at end of file
diff --git a/resources/views/livewire/comments/comment-show-component.blade.php b/resources/views/livewire/comments/comment-show-component.blade.php
index da9368e1..7d460b4a 100644
--- a/resources/views/livewire/comments/comment-show-component.blade.php
+++ b/resources/views/livewire/comments/comment-show-component.blade.php
@@ -32,7 +32,7 @@ class="button footer-button"
             <livewire:favorites.favorite-component :model="$comment" />
 
             @auth
-                @if ($userFlagged === true)
+                @if ($userFlag !== null)
                     <button
                         class="button footer-button"
                         title="{{ trans('Remove flag') }}">
@@ -61,10 +61,7 @@ class="button footer-button"
         @if ($isEditing === true)
             <livewire:comments.comment-form-component
                 wire:key="'edit-comment-' . $comment->id"
-                :authorized-user-id="$authorizedUserId"
-                :post-id="$comment->post_id"
                 :comment="$comment"
-                button-text="{{ trans('Update') }}"
                 is-editing="true"
             />
         @endif
@@ -86,5 +83,6 @@ class="button footer-button"
                 :model="$comment"
                 is-flagging="true"
             />
-    @endif
+        @endif
+    </footer>
 </article>
diff --git a/resources/views/livewire/comments/comment-wrapper.blade.php b/resources/views/livewire/comments/comment-wrapper.blade.php
new file mode 100644
index 00000000..6211ac1a
--- /dev/null
+++ b/resources/views/livewire/comments/comment-wrapper.blade.php
@@ -0,0 +1,54 @@
+<details class="moderator-hidden" :open="$wire.isOpen">
+    <summary class="moderator-message" wire:click.stop.prevent="$js.toggleOpen">
+        <section class="moderator-content">
+            @if (!empty(trim($moderatorComment->body)))
+                {!! $moderatorComment->body !!}
+            @else
+                {{ trans('This comment has been hidden.') }}
+            @endif
+        </section>
+
+        <footer class="comment-footer">
+            <div class="comment-metadata">
+                <x-members.profile-link-component :user="$moderatorComment->user"/>
+
+                @include('comments.partials.comment-timestamp', [
+                    'comment' => $moderatorComment,
+                ])
+            </div>
+        </footer>
+        
+        <footer class="comment-controls">
+            <span class="show-comment">
+                {{ trans('Show comment')}}
+            </span>
+            <span class="hide-comment">
+                {{ trans('Hide comment')}}
+            </span>
+        </footer>
+    </summary>
+
+    @if ($isInitiallyBlurred)
+        <livewire:comments.comment-blur
+            :comment-id="$commentId"
+            :comment="$comment"
+            :child-comments="$childComments"
+            :$state
+        />
+    @else
+        <livewire:comments.comment-content
+            :comment-id="$commentId"
+            :comment="$comment"
+            :child-comments="$childComments"
+            :$state
+        />
+    @endif
+</details>
+
+@script
+<script>
+    $js('toggleOpen', () => {
+        $wire.isOpen = !$wire.isOpen;
+    });
+</script>
+@endscript
\ No newline at end of file
diff --git a/resources/views/livewire/comments/partials/comment-blurrable.blade.php b/resources/views/livewire/comments/partials/comment-blurrable.blade.php
new file mode 100644
index 00000000..6831422e
--- /dev/null
+++ b/resources/views/livewire/comments/partials/comment-blurrable.blade.php
@@ -0,0 +1,12 @@
+<div class="blur-container"
+    x-data="{ isBlurred: $wire.entangle('isBlurred') }"
+    :class="{ 'blurred': isBlurred }">
+    <div class="blur-content">
+        @include('livewire.comments.partials.comment-content')
+    </div>
+    <div class="blur-overlay" x-show="isBlurred" @click="isBlurred = false">
+        @if (!empty($blurMessage))
+            {!! $blurMessage !!}
+        @endif
+    </div>
+</div>
diff --git a/resources/views/livewire/comments/partials/comment-content.blade.php b/resources/views/livewire/comments/partials/comment-content.blade.php
new file mode 100644
index 00000000..611e4622
--- /dev/null
+++ b/resources/views/livewire/comments/partials/comment-content.blade.php
@@ -0,0 +1,38 @@
+<div class="comment-container"
+    wire:key="comment-content-{{ $commentId }}">
+    <section class="comment-content">
+        {!! $body !!}
+    </section>
+
+    <footer class="comment-footer">
+        <div class="comment-metadata">
+            <x-members.profile-link-component :user="$comment->user"/>
+
+            @include('comments.partials.comment-timestamp', [
+                'comment' => $comment,
+            ])
+        </div>
+
+        @auth
+            <livewire:bookmarks.bookmark-component
+                wire:key="bookmark-component-{{ $comment->id }}"
+                :model="$comment"
+            />
+
+            <livewire:favorites.favorite-component
+                wire:key="favorite-component-{{ $comment->id }}"
+                :model="$comment"
+            />
+
+            @if ($comment->user_id === auth()->id())
+                @include('livewire.comments.partials.toggle-editing-button')
+            @endif
+
+            @include('livewire.comments.partials.toggle-replying-button')
+
+            @include('livewire.comments.partials.toggle-moderating-button')
+        @endauth
+
+        @include('livewire.comments.partials.toggle-flagging-button')
+    </footer>
+</div>
diff --git a/resources/views/livewire/comments/partials/comment-forms.blade.php b/resources/views/livewire/comments/partials/comment-forms.blade.php
new file mode 100644
index 00000000..435d0e2e
--- /dev/null
+++ b/resources/views/livewire/comments/partials/comment-forms.blade.php
@@ -0,0 +1,35 @@
+@if ($isEditing === true)
+    <livewire:comments.comment-form-component
+        wire:key="edit-comment-{{ $comment->id }}"
+        :comment="$comment"
+        is-editing="true"
+        button-text="{{ trans('Update') }}"
+    />
+@endif
+
+@if ($isFlagging === true)
+    <livewire:flags.flag-component
+        wire:key="flagging-comment-{{ $comment->id }}"
+        :comment-id="$comment->id"
+        :model="$comment"
+        @comment-flagged="addUserFlag($event.detail.id)"
+        @comment-flag-cancelled="stopFlagging()"
+        @comment-flag-deleted="removeUserFlag($event.detail.id)"
+    />
+@endif
+
+@if ($isReplying === true)
+    <livewire:comments.comment-form-component
+        wire:key="reply-to-comment-{{ $comment->id }}"
+        :comment="$comment"
+        is-replying="true"
+    />
+@endif
+
+@if ($isModerating === true)
+    <livewire:comments.comment-form-component
+        wire:key="moderate-comment-{{ $comment->id }}"
+        :comment="$comment"
+        is-moderating="true"
+    />
+@endif
diff --git a/resources/views/livewire/comments/partials/toggle-editing-button.blade.php b/resources/views/livewire/comments/partials/toggle-editing-button.blade.php
index 364bb3ca..e00477e0 100644
--- a/resources/views/livewire/comments/partials/toggle-editing-button.blade.php
+++ b/resources/views/livewire/comments/partials/toggle-editing-button.blade.php
@@ -2,7 +2,7 @@
     class="button footer-button"
     wire:click.prevent="toggleEditing()"
     aria-controls="edit-comment-form-{{ $comment->id }}"
-    aria-expanded="{{ $this->isEditing ? 'true' : 'false' }}">
+    aria-expanded="{{ json_encode($isEditing) }}">
     <x-icons.icon-component filename="pencil-square" />
     {{ trans('Edit') }}
 </button>
diff --git a/resources/views/livewire/comments/partials/toggle-flagging-button.blade.php b/resources/views/livewire/comments/partials/toggle-flagging-button.blade.php
index 271be8cc..0c957a1d 100644
--- a/resources/views/livewire/comments/partials/toggle-flagging-button.blade.php
+++ b/resources/views/livewire/comments/partials/toggle-flagging-button.blade.php
@@ -1,22 +1,84 @@
 @auth
     <button
+        x-data="{ isFlagLoading: false }"
         class="button footer-button"
-        wire:click.prevent="toggleFlagging()"
+        :class="{'loading': isFlagLoading}"
+        :disabled="isFlagLoading"
+        wire:key="toggle-flagging-button-{{ $comment->id }}"
+        wire:click.prevent="$js.toggleFlagging"
         aria-controls="flag-comment-form-{{ $comment->id }}"
-        aria-expanded="{{ $this->isFlagging ? 'true' : 'false' }}"
-        title="{{ trans($flagButtonText) }}"
-        @if ($authorizedUserId === null)
-            disabled
-        @endif
+        aria-expanded="{{ json_encode($isFlagging) }}"
+        title="{{ $userFlagged ? trans('Remove flag') : trans('Flag this comment') }}"
     >
-        <x-icons.icon-component filename="{{ $flagIconFilename }}" />
+        <x-icons.icon-component filename="{{ $userFlagged ? 'flag-fill' : 'flag' }}" />
+        <x-icons.icon-component class="loading-icon" filename="bars-rotate-fade" />
         {{ $flagCount }}
     </button>
 @endauth
 
 @guest
-    <button class="button footer-button" disabled>
+    <button
+        x-data="{ isFlagLoading: false }"
+        class="button footer-button"
+        wire:key="toggle-flagging-button-{{ $comment->id }}"
+        disabled>
         <x-icons.icon-component filename="flag" />
         {{ $flagCount }}
     </button>
 @endguest
+
+@script
+<script>
+    (() => {
+        const commentId = $wire.commentId;
+        const flagButtonKey = `toggle-flagging-button-${commentId}`;
+
+        // Set the loading state of the flag button.
+        function setFlagLoading(isLoading) {
+            for (const button of $wire.el.querySelectorAll('button.button.footer-button')) {
+                if (button.getAttribute('wire:key') === flagButtonKey) {
+                    const $data = Alpine.$data(button);
+                    $data.isFlagLoading = isLoading;
+                    break;
+                }
+            }
+        }
+
+        // Define callback that invokes toggleFlagging via Livewire after
+        // setting the loading state.
+        $wire.$js('toggleFlagging', () => {
+            setFlagLoading(true);
+            $wire.toggleFlagging();
+        });
+
+        // We may be nested 1-3 levels deep in the comment component, hence
+        // we have to loop to find it.
+        let componentWire = $wire;
+        const commentComponentName = 'comments.comment-component';
+
+        while (componentWire && componentWire.__instance.name !== commentComponentName) {
+            try {
+                // Attempting to access $parent will throw an error if the parent is not found.
+                componentWire = componentWire.$parent;
+            } catch (error) {
+                componentWire = null;
+            }
+        }
+
+        // If we didn't find the comment component, we can't do anything.
+        if (!componentWire) return false;
+
+        componentWire.hook('morphed', () => {
+            // The flag button should stop spinning when the comment component has morphed.
+            setFlagLoading(false);
+        });
+
+        componentWire.on('flag-loading', () => {
+            // The flag button should start spinning when the flag loading event is dispatched.
+            setFlagLoading(true);
+        });
+
+        return true;
+    })();
+</script>
+@endscript
\ No newline at end of file
diff --git a/resources/views/livewire/comments/partials/toggle-moderating-button.blade.php b/resources/views/livewire/comments/partials/toggle-moderating-button.blade.php
new file mode 100644
index 00000000..cde77dcd
--- /dev/null
+++ b/resources/views/livewire/comments/partials/toggle-moderating-button.blade.php
@@ -0,0 +1,8 @@
+<button
+    class="button footer-button"
+    wire:click.prevent="toggleModerating()"
+    aria-controls="comment-moderation-form-{{ $comment->id }}"
+    aria-expanded="{{ json_encode($isModerating) }}">
+    <x-icons.icon-component filename="stoplights-fill" />
+    {{ trans('Moderate') }}
+</button>
diff --git a/resources/views/livewire/comments/partials/toggle-replying-button.blade.php b/resources/views/livewire/comments/partials/toggle-replying-button.blade.php
index cd82b3c5..2020254c 100644
--- a/resources/views/livewire/comments/partials/toggle-replying-button.blade.php
+++ b/resources/views/livewire/comments/partials/toggle-replying-button.blade.php
@@ -2,7 +2,7 @@
     class="button footer-button"
     wire:click.prevent="toggleReplying()"
     aria-controls="comment-reply-form-{{ $comment->id }}"
-    aria-expanded="{{ $this->isReplying ? 'true' : 'false' }}">
+    aria-expanded="{{ json_encode($isReplying) }}">
     <x-icons.icon-component filename="reply-fill" />
     {{ trans('Reply') }}
 </button>
diff --git a/resources/views/livewire/flags/flag-component.blade.php b/resources/views/livewire/flags/flag-component.blade.php
index 9d9e6c47..6f14a6ec 100644
--- a/resources/views/livewire/flags/flag-component.blade.php
+++ b/resources/views/livewire/flags/flag-component.blade.php
@@ -1,9 +1,10 @@
-<form wire:submit.prevent="store()">
+<form class="flag-form" wire:submit.prevent="$js.store" wire:show="!formClosed">
     <fieldset>
         <legend>
             {{ $titleText }}
         </legend>
 
+        @if ($userFlag === null)
         <small>
             <x-popovers.popover-component
                 button-text="{{ trans('What does it mean to flag a comment or post?') }}"
@@ -11,49 +12,82 @@
                 show-info-icon="true"
             />
         </small>
+        @endif
 
-        @foreach ($flagReasons as $reason)
-            <label class="block radio-button-label">
+        @foreach ($flagReasons as $key => $reason)
+            <label for="{{ $type }}-{{ $model->id }}-flag-reason-{{ $key }}" class="block radio-button-label">
                 <input
+                    id="{{ $type }}-{{ $model->id }}-flag-reason-{{ $key }}"
+                    class="flag-reason-{{ $key }}"
                     type="radio"
-                    name="flag_reason_id"
-                    @if ($reason === 'Fantastic')
-                        class="fantastic"
-                    @endif
+                    name="selectedReason"
                     wire:model="selectedReason"
-                    wire:change="flagReasonSelected('{{ $reason }}')"
+                    wire:click="showNoteField = {{ json_encode($this->isNoteVisibleForReason($reason)) }}"
                     value="{{ $reason }}">
                 {{ $reason }}
             </label>
         @endforeach
 
-        @if ($showNoteField === true)
-            <label for="note" class="optional">
+        <div wire:show="showNoteField">
+            <label for="{{ $type }}-{{ $model->id }}-flag-note" class="optional">
                 {{ trans('Note') }}
             </label>
 
             <textarea
-                wire:model="note"
+                id="{{ $type }}-{{ $model->id }}-flag-note"
+                class="flag-note resize"
                 name="note"
-                id="note"
                 wire:model="note"
                 placeholder="{{ trans('Additional details (optional)') }}">
             </textarea>
-        @endif
+        </div>
+    </fieldset>
 
-        <div class="level">
+    <div class="level">
+        @if ($userFlag !== null)
             <button
                 type="button"
                 class="button secondary-button"
-                wire:click="$parent.closeForm()">
-                {{ trans('Cancel') }}
+                wire:click="$js.delete">
+                {{ trans('Remove Flag') }}
             </button>
+        @endif
 
-            <button
-                type="submit"
-                class="button primary-button">
-                {{ trans('Add Flag') }}
-            </button>
-        </div>
-    </fieldset>
+        <button
+            type="button"
+            class="button secondary-button"
+            wire:click="$js.cancel">
+            {{ trans('Cancel') }}
+        </button>
+
+        <button
+            type="submit"
+            class="button primary-button">
+            {{ $userFlag ? trans('Update Flag') : trans('Add Flag') }}
+        </button>
+    </div>
 </form>
+
+@script
+<script>
+    $js('store', () => {
+        // Close form client-side and send a loading event so the flag button
+        // can show the loading state until the backend work is done.
+        $wire.formClosed = true;
+        $dispatch('flag-loading', {id: $wire.modelId, type: $wire.type});
+        $wire.store();
+    });
+
+    $js('delete', () => {
+        $wire.formClosed = true;
+        $dispatch('flag-loading', {id: $wire.modelId, type: $wire.type});
+        $wire.delete();
+    });
+
+    $js('cancel', () => {
+        $wire.formClosed = true;
+        $dispatch('flag-loading', {id: $wire.modelId, type: $wire.type});
+        $wire.cancel();
+    });
+</script>
+@endscript
\ No newline at end of file
diff --git a/resources/views/posts/show.blade.php b/resources/views/posts/show.blade.php
index 9ba8b775..52c81da7 100644
--- a/resources/views/posts/show.blade.php
+++ b/resources/views/posts/show.blade.php
@@ -48,7 +48,10 @@
     </article>
 
     <section class="comments" id="comments">
-        <livewire:comments.comment-list-component :post="$post" />
+        <livewire:comments.comment-list-component
+            wire:key="{{ $post->id }}"
+            :post-id="$post->id"
+        />
     </section>
 
     @if ($post->is_archived === false)
diff --git a/vite.config.js b/vite.config.js
index d64eca2b..a1b84b8a 100644
--- a/vite.config.js
+++ b/vite.config.js
@@ -35,7 +35,7 @@ export default defineConfig({
     server: {
         host: serverHost,
         allowedHosts,
-        hmr: { host: serverHost },
+        hmr: { host: appHost },
         cors: true,
         strictPort: true,
         port: serverPort,