diff --git a/ErsatzTV.Core/Api/Logs/LogEntryResponseModel.cs b/ErsatzTV.Core/Api/Logs/LogEntryResponseModel.cs
new file mode 100644
index 000000000..d49ec46b1
--- /dev/null
+++ b/ErsatzTV.Core/Api/Logs/LogEntryResponseModel.cs
@@ -0,0 +1,7 @@
+#nullable enable
+namespace ErsatzTV.Core.Api.Logs;
+
+public record LogEntryResponseModel(
+    DateTimeOffset Timestamp,
+    string Level,
+    string Message);
diff --git a/ErsatzTV.Core/Api/Logs/PagedLogEntriesResponseModel.cs b/ErsatzTV.Core/Api/Logs/PagedLogEntriesResponseModel.cs
new file mode 100644
index 000000000..578940078
--- /dev/null
+++ b/ErsatzTV.Core/Api/Logs/PagedLogEntriesResponseModel.cs
@@ -0,0 +1,6 @@
+#nullable enable
+namespace ErsatzTV.Core.Api.Logs;
+
+public record PagedLogEntriesResponseModel(
+    int TotalCount,
+    List<LogEntryResponseModel> Page);
diff --git a/ErsatzTV.Core/Api/Troubleshooting/TroubleshootingInfoResponseModel.cs b/ErsatzTV.Core/Api/Troubleshooting/TroubleshootingInfoResponseModel.cs
new file mode 100644
index 000000000..2feb5fc45
--- /dev/null
+++ b/ErsatzTV.Core/Api/Troubleshooting/TroubleshootingInfoResponseModel.cs
@@ -0,0 +1,14 @@
+#nullable enable
+namespace ErsatzTV.Core.Api.Troubleshooting;
+
+// GeneralJson mirrors the JSON blob rendered on the "General" tab of the legacy Blazor
+// Troubleshooting page (version, environment, cpus, video controllers, health, ffmpeg settings,
+// AviSynth flags, channels, ffmpeg profiles) - kept pre-serialized so the SPA can render/copy it
+// verbatim without re-deriving the same shape. The remaining fields mirror the per-platform
+// capability dump tabs (only the ones relevant to the current OS/GPU are non-empty).
+public record TroubleshootingInfoResponseModel(
+    string GeneralJson,
+    string? NvidiaCapabilities,
+    string? QsvCapabilities,
+    string? VaapiCapabilities,
+    string? VideoToolboxCapabilities);
diff --git a/ErsatzTV.Tests/Controllers/ApiControllerSecurityTests.cs b/ErsatzTV.Tests/Controllers/ApiControllerSecurityTests.cs
index a0142cc13..4acfe3ca8 100644
--- a/ErsatzTV.Tests/Controllers/ApiControllerSecurityTests.cs
+++ b/ErsatzTV.Tests/Controllers/ApiControllerSecurityTests.cs
@@ -29,6 +29,7 @@ public class ApiControllerSecurityTests
             typeof(CollectionController),
             typeof(FFmpegProfileController),
             typeof(LibrariesController),
+            typeof(LogsController),
             typeof(MaintenanceController),
             typeof(PlayoutController),
             typeof(ResolutionController),
@@ -37,7 +38,8 @@ public class ApiControllerSecurityTests
             typeof(ScriptedScheduleController),
             typeof(SessionController),
             typeof(SettingsController),
-            typeof(SmartCollectionController)
+            typeof(SmartCollectionController),
+            typeof(TroubleshootController)
         ];
 
         foreach (Type controllerType in apiControllers)
diff --git a/ErsatzTV.Tests/Controllers/LogsControllerTests.cs b/ErsatzTV.Tests/Controllers/LogsControllerTests.cs
new file mode 100644
index 000000000..467b82f30
--- /dev/null
+++ b/ErsatzTV.Tests/Controllers/LogsControllerTests.cs
@@ -0,0 +1,89 @@
+using System.Reflection;
+using ErsatzTV.Application.Logs;
+using ErsatzTV.Controllers.Api;
+using ErsatzTV.Core.Api.Logs;
+using MediatR;
+using Microsoft.AspNetCore.Mvc.Routing;
+using NSubstitute;
+using NUnit.Framework;
+using Serilog.Events;
+using Shouldly;
+
+namespace ErsatzTV.Tests.Controllers;
+
+[TestFixture]
+public class LogsControllerTests
+{
+    private LogsController _controller = null!;
+    private IMediator _mediator = null!;
+
+    [SetUp]
+    public void SetUp()
+    {
+        _mediator = Substitute.For<IMediator>();
+        _controller = new LogsController(_mediator);
+    }
+
+    [Test]
+    public void Controller_Should_Expose_Idiomatic_Rest_Route()
+    {
+        MethodInfo action = typeof(LogsController).GetMethod(nameof(LogsController.GetLogs))
+            ?? throw new AssertionException("Missing action GetLogs");
+
+        HttpMethodAttribute attribute = action.GetCustomAttributes<HttpMethodAttribute>(inherit: true).Single();
+        attribute.HttpMethods.ShouldContain("GET");
+        attribute.Template.ShouldBe("/api/logs");
+        attribute.Name.ShouldBe("GetLogs");
+    }
+
+    [Test]
+    public async Task GetLogs_Should_Clamp_Paging_And_Send_Query()
+    {
+        _mediator.Send(Arg.Any<GetRecentLogEntries>(), Arg.Any<CancellationToken>())
+            .Returns(new PagedLogEntriesViewModel(0, []));
+
+        await _controller.GetLogs(-1, 500, "boom", CancellationToken.None);
+
+        await _mediator.Received(1).Send(
+            Arg.Is<GetRecentLogEntries>(q =>
+                q.PageNum == 0 &&
+                q.PageSize == 100 &&
+                q.Filter == "boom"),
+            Arg.Any<CancellationToken>());
+    }
+
+    [Test]
+    public async Task GetLogs_Should_Map_Entries_To_Response_Model()
+    {
+        var entries = new List<LogEntryViewModel>
+        {
+            new(DateTimeOffset.UnixEpoch, LogEventLevel.Warning, "uh oh"),
+            new(DateTimeOffset.UnixEpoch.AddMinutes(1), LogEventLevel.Information, "all good")
+        };
+        _mediator.Send(Arg.Any<GetRecentLogEntries>(), Arg.Any<CancellationToken>())
+            .Returns(new PagedLogEntriesViewModel(2, entries));
+
+        PagedLogEntriesResponseModel result = await _controller.GetLogs(
+            cancellationToken: CancellationToken.None);
+
+        result.TotalCount.ShouldBe(2);
+        result.Page.ShouldBe(
+        [
+            new LogEntryResponseModel(DateTimeOffset.UnixEpoch, "Warning", "uh oh"),
+            new LogEntryResponseModel(DateTimeOffset.UnixEpoch.AddMinutes(1), "Information", "all good")
+        ]);
+    }
+
+    [Test]
+    public async Task GetLogs_Should_Return_Empty_Page_When_None_Exist()
+    {
+        _mediator.Send(Arg.Any<GetRecentLogEntries>(), Arg.Any<CancellationToken>())
+            .Returns(new PagedLogEntriesViewModel(0, []));
+
+        PagedLogEntriesResponseModel result = await _controller.GetLogs(
+            cancellationToken: CancellationToken.None);
+
+        result.TotalCount.ShouldBe(0);
+        result.Page.ShouldBeEmpty();
+    }
+}
diff --git a/ErsatzTV.Tests/Controllers/TroubleshootControllerTests.cs b/ErsatzTV.Tests/Controllers/TroubleshootControllerTests.cs
new file mode 100644
index 000000000..b9f51a6c3
--- /dev/null
+++ b/ErsatzTV.Tests/Controllers/TroubleshootControllerTests.cs
@@ -0,0 +1,84 @@
+using System.IO.Abstractions;
+using System.Reflection;
+using System.Text.Json;
+using System.Threading.Channels;
+using ErsatzTV.Application;
+using ErsatzTV.Application.Troubleshooting;
+using ErsatzTV.Application.Troubleshooting.Queries;
+using ErsatzTV.Controllers.Api;
+using ErsatzTV.Core.Api.Troubleshooting;
+using ErsatzTV.Core.Interfaces.Repositories;
+using ErsatzTV.Core.Interfaces.Troubleshooting;
+using MediatR;
+using Microsoft.AspNetCore.Mvc;
+using NSubstitute;
+using NUnit.Framework;
+using Shouldly;
+
+namespace ErsatzTV.Tests.Controllers;
+
+[TestFixture]
+public class TroubleshootControllerTests
+{
+    private TroubleshootController _controller = null!;
+    private IMediator _mediator = null!;
+
+    [SetUp]
+    public void SetUp()
+    {
+        _mediator = Substitute.For<IMediator>();
+        _controller = new TroubleshootController(
+            Channel.CreateUnbounded<IFFmpegWorkerRequest>().Writer,
+            Substitute.For<IFileSystem>(),
+            Substitute.For<IConfigElementRepository>(),
+            Substitute.For<ITroubleshootingNotifier>(),
+            _mediator);
+    }
+
+    [Test]
+    public void Controller_Should_Expose_Idiomatic_Rest_Route_For_Info()
+    {
+        MethodInfo action = typeof(TroubleshootController).GetMethod(nameof(TroubleshootController.GetInfo))
+            ?? throw new AssertionException("Missing action GetInfo");
+
+        var attribute = action.GetCustomAttributes<HttpGetAttribute>().Single();
+        attribute.Template.ShouldBe("api/troubleshoot/info");
+        attribute.Name.ShouldBe("GetTroubleshootingInfo");
+    }
+
+    [Test]
+    public async Task GetInfo_Should_Serialize_General_Section_And_Carry_Platform_Capabilities()
+    {
+        var info = new TroubleshootingInfo(
+            "1.2.3",
+            new Dictionary<string, string> { ["ETV_FOO"] = "bar" },
+            [],
+            [],
+            [],
+            new ErsatzTV.Application.FFmpegProfiles.FFmpegSettingsViewModel(),
+            [],
+            [],
+            [],
+            false,
+            false,
+            "nvidia output",
+            "qsv output",
+            "vaapi output",
+            "videotoolbox output");
+
+        _mediator.Send(Arg.Any<GetTroubleshootingInfo>(), Arg.Any<CancellationToken>())
+            .Returns(info);
+
+        TroubleshootingInfoResponseModel result = await _controller.GetInfo(CancellationToken.None);
+
+        result.NvidiaCapabilities.ShouldBe("nvidia output");
+        result.QsvCapabilities.ShouldBe("qsv output");
+        result.VaapiCapabilities.ShouldBe("vaapi output");
+        result.VideoToolboxCapabilities.ShouldBe("videotoolbox output");
+
+        using JsonDocument document = JsonDocument.Parse(result.GeneralJson);
+        document.RootElement.GetProperty("Version").GetString().ShouldBe("1.2.3");
+        document.RootElement.GetProperty("Environment").GetProperty("ETV_FOO").GetString().ShouldBe("bar");
+        document.RootElement.GetProperty("AviSynth").GetProperty("Demuxer").GetBoolean().ShouldBeFalse();
+    }
+}
diff --git a/ErsatzTV/Controllers/Api/LogsController.cs b/ErsatzTV/Controllers/Api/LogsController.cs
new file mode 100644
index 000000000..46c6a1620
--- /dev/null
+++ b/ErsatzTV/Controllers/Api/LogsController.cs
@@ -0,0 +1,39 @@
+using ErsatzTV.Application.Logs;
+using ErsatzTV.Core.Api.Logs;
+using MediatR;
+using Microsoft.AspNetCore.Http;
+using Microsoft.AspNetCore.Mvc;
+
+namespace ErsatzTV.Controllers.Api;
+
+[ApiController]
+public class LogsController(IMediator mediator) : ControllerBase
+{
+    private const int MaxPageSize = 100;
+
+    [HttpGet("/api/logs", Name = "GetLogs")]
+    [Tags("Logs")]
+    [EndpointSummary("Get recent log entries")]
+    [EndpointGroupName("general")]
+    [ProducesResponseType(typeof(PagedLogEntriesResponseModel), StatusCodes.Status200OK)]
+    public async Task<PagedLogEntriesResponseModel> GetLogs(
+        [FromQuery] int pageNum = 0,
+        [FromQuery] int pageSize = 100,
+        [FromQuery] string filter = "",
+        CancellationToken cancellationToken = default)
+    {
+        int clampedPageNum = Math.Max(0, pageNum);
+        int clampedPageSize = Math.Clamp(pageSize, 1, MaxPageSize);
+
+        PagedLogEntriesViewModel result = await mediator.Send(
+            new GetRecentLogEntries(clampedPageNum, clampedPageSize, filter ?? string.Empty),
+            cancellationToken);
+
+        return new PagedLogEntriesResponseModel(
+            result.TotalCount,
+            result.Page.Map(ProjectToResponseModel).ToList());
+    }
+
+    private static LogEntryResponseModel ProjectToResponseModel(LogEntryViewModel viewModel) =>
+        new(viewModel.Timestamp, viewModel.Level.ToString(), viewModel.Message);
+}
diff --git a/ErsatzTV/Controllers/Api/TroubleshootController.cs b/ErsatzTV/Controllers/Api/TroubleshootController.cs
index 8eabe6a0b..dc8daee88 100644
--- a/ErsatzTV/Controllers/Api/TroubleshootController.cs
+++ b/ErsatzTV/Controllers/Api/TroubleshootController.cs
@@ -1,15 +1,19 @@
 using System.IO.Abstractions;
+using System.Text.Json;
+using System.Text.Json.Serialization;
 using System.Threading.Channels;
 using ErsatzTV.Application;
 using ErsatzTV.Application.MediaItems;
 using ErsatzTV.Application.Troubleshooting;
 using ErsatzTV.Application.Troubleshooting.Queries;
 using ErsatzTV.Core;
+using ErsatzTV.Core.Api.Troubleshooting;
 using ErsatzTV.Core.Domain;
 using ErsatzTV.Core.Interfaces.FFmpeg;
 using ErsatzTV.Core.Interfaces.Repositories;
 using ErsatzTV.Core.Interfaces.Troubleshooting;
 using MediatR;
+using Microsoft.AspNetCore.Http;
 using Microsoft.AspNetCore.Mvc;
 using Serilog.Context;
 
@@ -23,8 +27,55 @@ public class TroubleshootController(
     ITroubleshootingNotifier notifier,
     IMediator mediator) : ControllerBase
 {
+    private static readonly JsonSerializerOptions GeneralJsonOptions = new()
+    {
+        Converters = { new JsonStringEnumConverter() },
+        DefaultIgnoreCondition = JsonIgnoreCondition.WhenWritingNull,
+        WriteIndented = true
+    };
+
+    [HttpGet("api/troubleshoot/info", Name = "GetTroubleshootingInfo")]
+    [Tags("Troubleshooting")]
+    [EndpointSummary("Get troubleshooting diagnostic info")]
+    [EndpointGroupName("general")]
+    [ProducesResponseType(typeof(TroubleshootingInfoResponseModel), StatusCodes.Status200OK)]
+    public async Task<TroubleshootingInfoResponseModel> GetInfo(CancellationToken cancellationToken)
+    {
+        TroubleshootingInfo info = await mediator.Send(new GetTroubleshootingInfo(), cancellationToken);
+
+        // mirrors the "General" tab JSON blob built by Pages/Troubleshooting/Troubleshooting.razor
+        string generalJson = JsonSerializer.Serialize(
+            new
+            {
+                info.Version,
+                Environment = info.Environment.OrderBy(x => x.Key).ToDictionary(x => x.Key, x => x.Value),
+                info.Cpus,
+                info.VideoControllers,
+                info.Health,
+                info.FFmpegSettings,
+                AviSynth = new
+                {
+                    Demuxer = info.AviSynthDemuxer,
+                    Installed = info.AviSynthInstalled
+                },
+                info.Channels,
+                info.FFmpegProfiles
+            },
+            GeneralJsonOptions);
+
+        return new TroubleshootingInfoResponseModel(
+            generalJson,
+            info.NvidiaCapabilities,
+            info.QsvCapabilities,
+            info.VaapiCapabilities,
+            info.VideoToolboxCapabilities);
+    }
+
     [HttpHead("api/troubleshoot/playback.m3u8")]
     [HttpGet("api/troubleshoot/playback.m3u8")]
+    [Tags("Troubleshooting")]
+    [EndpointSummary("Start a troubleshooting playback session")]
+    [EndpointGroupName("general")]
     public async Task<IActionResult> TroubleshootPlayback(
         [FromQuery]
         int mediaItem,
@@ -159,6 +210,9 @@ public class TroubleshootController(
 
     [HttpHead("api/troubleshoot/playback/archive")]
     [HttpGet("api/troubleshoot/playback/archive")]
+    [Tags("Troubleshooting")]
+    [EndpointSummary("Download the last troubleshooting playback session archive")]
+    [EndpointGroupName("general")]
     public async Task<IActionResult> TroubleshootPlaybackArchive(CancellationToken cancellationToken)
     {
         Option<string> maybeArchivePath = await mediator.Send(new ArchiveTroubleshootingResults(), cancellationToken);
@@ -182,6 +236,9 @@ public class TroubleshootController(
 
     [HttpHead("api/troubleshoot/playback/sample/{mediaItemId:int}")]
     [HttpGet("api/troubleshoot/playback/sample/{mediaItemId:int}")]
+    [Tags("Troubleshooting")]
+    [EndpointSummary("Download a media sample archive for troubleshooting")]
+    [EndpointGroupName("general")]
     public async Task<IActionResult> TroubleshootPlaybackSample(int mediaItemId, CancellationToken cancellationToken)
     {
         Option<string> maybeArchivePath = await mediator.Send(new ArchiveMediaSample(mediaItemId), cancellationToken);
diff --git a/ErsatzTV/wwwroot/openapi/v1.json b/ErsatzTV/wwwroot/openapi/v1.json
index ad7d52319..d637af549 100644
--- a/ErsatzTV/wwwroot/openapi/v1.json
+++ b/ErsatzTV/wwwroot/openapi/v1.json
@@ -3088,6 +3088,65 @@
         }
       }
     },
+    "/api/logs": {
+      "get": {
+        "tags": [
+          "Logs"
+        ],
+        "summary": "Get recent log entries",
+        "operationId": "GetLogs",
+        "parameters": [
+          {
+            "name": "pageNum",
+            "in": "query",
+            "schema": {
+              "type": "integer",
+              "format": "int32",
+              "default": 0
+            }
+          },
+          {
+            "name": "pageSize",
+            "in": "query",
+            "schema": {
+              "type": "integer",
+              "format": "int32",
+              "default": 100
+            }
+          },
+          {
+            "name": "filter",
+            "in": "query",
+            "schema": {
+              "type": "string",
+              "default": ""
+            }
+          }
+        ],
+        "responses": {
+          "200": {
+            "description": "OK",
+            "content": {
+              "text/plain": {
+                "schema": {
+                  "$ref": "#/components/schemas/PagedLogEntriesResponseModel"
+                }
+              },
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/PagedLogEntriesResponseModel"
+                }
+              },
+              "text/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/PagedLogEntriesResponseModel"
+                }
+              }
+            }
+          }
+        }
+      }
+    },
     "/api/maintenance/gc": {
       "get": {
         "tags": [
@@ -5857,6 +5916,303 @@
         }
       }
     },
+    "/api/troubleshoot/info": {
+      "get": {
+        "tags": [
+          "Troubleshooting"
+        ],
+        "summary": "Get troubleshooting diagnostic info",
+        "operationId": "GetTroubleshootingInfo",
+        "responses": {
+          "200": {
+            "description": "OK",
+            "content": {
+              "text/plain": {
+                "schema": {
+                  "$ref": "#/components/schemas/TroubleshootingInfoResponseModel"
+                }
+              },
+              "application/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/TroubleshootingInfoResponseModel"
+                }
+              },
+              "text/json": {
+                "schema": {
+                  "$ref": "#/components/schemas/TroubleshootingInfoResponseModel"
+                }
+              }
+            }
+          }
+        }
+      }
+    },
+    "/api/troubleshoot/playback.m3u8": {
+      "head": {
+        "tags": [
+          "Troubleshooting"
+        ],
+        "summary": "Start a troubleshooting playback session",
+        "parameters": [
+          {
+            "name": "mediaItem",
+            "in": "query",
+            "schema": {
+              "type": "integer",
+              "format": "int32"
+            }
+          },
+          {
+            "name": "channel",
+            "in": "query",
+            "schema": {
+              "type": "integer",
+              "format": "int32"
+            }
+          },
+          {
+            "name": "ffmpegProfile",
+            "in": "query",
+            "schema": {
+              "type": "integer",
+              "format": "int32"
+            }
+          },
+          {
+            "name": "streamingMode",
+            "in": "query",
+            "schema": {
+              "$ref": "#/components/schemas/StreamingMode"
+            }
+          },
+          {
+            "name": "watermark",
+            "in": "query",
+            "schema": {
+              "type": "array",
+              "items": {
+                "type": "integer",
+                "format": "int32"
+              }
+            }
+          },
+          {
+            "name": "graphicsElement",
+            "in": "query",
+            "schema": {
+              "type": "array",
+              "items": {
+                "type": "integer",
+                "format": "int32"
+              }
+            }
+          },
+          {
+            "name": "streamSelector",
+            "in": "query",
+            "schema": {
+              "type": "string"
+            }
+          },
+          {
+            "name": "subtitleId",
+            "in": "query",
+            "schema": {
+              "type": "integer",
+              "format": "int32"
+            }
+          },
+          {
+            "name": "seekSeconds",
+            "in": "query",
+            "schema": {
+              "type": "integer",
+              "format": "int32"
+            }
+          },
+          {
+            "name": "start",
+            "in": "query",
+            "schema": {
+              "type": "string",
+              "format": "date-time"
+            }
+          }
+        ],
+        "responses": {
+          "200": {
+            "description": "OK"
+          }
+        }
+      },
+      "get": {
+        "tags": [
+          "Troubleshooting"
+        ],
+        "summary": "Start a troubleshooting playback session",
+        "parameters": [
+          {
+            "name": "mediaItem",
+            "in": "query",
+            "schema": {
+              "type": "integer",
+              "format": "int32"
+            }
+          },
+          {
+            "name": "channel",
+            "in": "query",
+            "schema": {
+              "type": "integer",
+              "format": "int32"
+            }
+          },
+          {
+            "name": "ffmpegProfile",
+            "in": "query",
+            "schema": {
+              "type": "integer",
+              "format": "int32"
+            }
+          },
+          {
+            "name": "streamingMode",
+            "in": "query",
+            "schema": {
+              "$ref": "#/components/schemas/StreamingMode"
+            }
+          },
+          {
+            "name": "watermark",
+            "in": "query",
+            "schema": {
+              "type": "array",
+              "items": {
+                "type": "integer",
+                "format": "int32"
+              }
+            }
+          },
+          {
+            "name": "graphicsElement",
+            "in": "query",
+            "schema": {
+              "type": "array",
+              "items": {
+                "type": "integer",
+                "format": "int32"
+              }
+            }
+          },
+          {
+            "name": "streamSelector",
+            "in": "query",
+            "schema": {
+              "type": "string"
+            }
+          },
+          {
+            "name": "subtitleId",
+            "in": "query",
+            "schema": {
+              "type": "integer",
+              "format": "int32"
+            }
+          },
+          {
+            "name": "seekSeconds",
+            "in": "query",
+            "schema": {
+              "type": "integer",
+              "format": "int32"
+            }
+          },
+          {
+            "name": "start",
+            "in": "query",
+            "schema": {
+              "type": "string",
+              "format": "date-time"
+            }
+          }
+        ],
+        "responses": {
+          "200": {
+            "description": "OK"
+          }
+        }
+      }
+    },
+    "/api/troubleshoot/playback/archive": {
+      "head": {
+        "tags": [
+          "Troubleshooting"
+        ],
+        "summary": "Download the last troubleshooting playback session archive",
+        "responses": {
+          "200": {
+            "description": "OK"
+          }
+        }
+      },
+      "get": {
+        "tags": [
+          "Troubleshooting"
+        ],
+        "summary": "Download the last troubleshooting playback session archive",
+        "responses": {
+          "200": {
+            "description": "OK"
+          }
+        }
+      }
+    },
+    "/api/troubleshoot/playback/sample/{mediaItemId}": {
+      "head": {
+        "tags": [
+          "Troubleshooting"
+        ],
+        "summary": "Download a media sample archive for troubleshooting",
+        "parameters": [
+          {
+            "name": "mediaItemId",
+            "in": "path",
+            "required": true,
+            "schema": {
+              "type": "integer",
+              "format": "int32"
+            }
+          }
+        ],
+        "responses": {
+          "200": {
+            "description": "OK"
+          }
+        }
+      },
+      "get": {
+        "tags": [
+          "Troubleshooting"
+        ],
+        "summary": "Download a media sample archive for troubleshooting",
+        "parameters": [
+          {
+            "name": "mediaItemId",
+            "in": "path",
+            "required": true,
+            "schema": {
+              "type": "integer",
+              "format": "int32"
+            }
+          }
+        ],
+        "responses": {
+          "200": {
+            "description": "OK"
+          }
+        }
+      }
+    },
     "/api/version": {
       "get": {
         "tags": [
@@ -9140,6 +9496,26 @@
           }
         }
       },
+      "LogEntryResponseModel": {
+        "required": [
+          "timestamp",
+          "level",
+          "message"
+        ],
+        "type": "object",
+        "properties": {
+          "timestamp": {
+            "type": "string",
+            "format": "date-time"
+          },
+          "level": {
+            "type": "string"
+          },
+          "message": {
+            "type": "string"
+          }
+        }
+      },
       "LogEventLevel": {
         "enum": [
           "Verbose",
@@ -9484,6 +9860,25 @@
           }
         }
       },
+      "PagedLogEntriesResponseModel": {
+        "required": [
+          "totalCount",
+          "page"
+        ],
+        "type": "object",
+        "properties": {
+          "totalCount": {
+            "type": "integer",
+            "format": "int32"
+          },
+          "page": {
+            "type": "array",
+            "items": {
+              "$ref": "#/components/schemas/LogEntryResponseModel"
+            }
+          }
+        }
+      },
       "PagedPlayoutItemsResponseModel": {
         "required": [
           "totalCount",
@@ -10569,6 +10964,45 @@
         ],
         "type": "string"
       },
+      "TroubleshootingInfoResponseModel": {
+        "required": [
+          "generalJson",
+          "nvidiaCapabilities",
+          "qsvCapabilities",
+          "vaapiCapabilities",
+          "videoToolboxCapabilities"
+        ],
+        "type": "object",
+        "properties": {
+          "generalJson": {
+            "type": "string"
+          },
+          "nvidiaCapabilities": {
+            "type": [
+              "null",
+              "string"
+            ]
+          },
+          "qsvCapabilities": {
+            "type": [
+              "null",
+              "string"
+            ]
+          },
+          "vaapiCapabilities": {
+            "type": [
+              "null",
+              "string"
+            ]
+          },
+          "videoToolboxCapabilities": {
+            "type": [
+              "null",
+              "string"
+            ]
+          }
+        }
+      },
       "UiSettingsResponseModel": {
         "required": [
           "isDarkMode",
@@ -11812,6 +12246,9 @@
     {
       "name": "Libraries"
     },
+    {
+      "name": "Logs"
+    },
     {
       "name": "Maintenance"
     },
@@ -11836,6 +12273,9 @@
     {
       "name": "Smart Collections"
     },
+    {
+      "name": "Troubleshooting"
+    },
     {
       "name": "Version"
     },
diff --git a/web/src/App.tsx b/web/src/App.tsx
index 8f2dc601e..fbce3ee0b 100644
--- a/web/src/App.tsx
+++ b/web/src/App.tsx
@@ -41,6 +41,7 @@ import {
   Play,
   Radio,
   RefreshCw,
+  ScrollText,
   Search,
   Server,
   Settings,
@@ -60,7 +61,9 @@ import { ChannelEditScreen } from './screens/ChannelEditScreen';
 import { CollectionsScreen } from './screens/CollectionsScreen';
 import { FFmpegProfilesScreen } from './screens/FFmpegProfilesScreen';
 import { FillerPresetsScreen } from './screens/FillerPresetsScreen';
+import { LogsScreen } from './screens/LogsScreen';
 import { SettingsScreen } from './screens/SettingsScreen';
+import { TroubleshootingScreen } from './screens/TroubleshootingScreen';
 import { WatermarksScreen } from './screens/WatermarksScreen';
 import { navigateToPath } from './routing';
 import {
@@ -140,7 +143,9 @@ type ScreenId =
   | 'libraries'
   | 'ffmpegProfiles'
   | 'watermarks'
-  | 'settings';
+  | 'settings'
+  | 'logs'
+  | 'troubleshooting';
 
 interface ScreenRoute {
   id: ScreenId;
@@ -310,6 +315,28 @@ const routes: ScreenRoute[] = [
     primaryAction: 'Save Changes',
     placeholder: 'Settings workspace',
     allowSubPaths: true
+  },
+  {
+    id: 'logs',
+    path: '/app/logs',
+    label: 'Logs',
+    title: 'Logs',
+    kicker: 'System',
+    description: 'Recent server log entries with level and free-text filtering.',
+    icon: <ScrollText aria-hidden="true" size={16} />,
+    primaryAction: 'Refresh',
+    placeholder: 'Logs workspace'
+  },
+  {
+    id: 'troubleshooting',
+    path: '/app/troubleshooting',
+    label: 'Troubleshooting',
+    title: 'Troubleshooting',
+    kicker: 'System',
+    description: 'Version, environment, hardware and FFmpeg capability diagnostics.',
+    icon: <Stethoscope aria-hidden="true" size={16} />,
+    primaryAction: 'Refresh',
+    placeholder: 'Troubleshooting workspace'
   }
 ];
 
@@ -324,7 +351,13 @@ const primaryNavIds: ScreenId[] = [
   'playouts'
 ];
 const mediaNavIds: ScreenId[] = ['collections', 'fillerPresets', 'libraries'];
-const systemNavIds: ScreenId[] = ['ffmpegProfiles', 'watermarks', 'settings'];
+const systemNavIds: ScreenId[] = [
+  'settings',
+  'logs',
+  'troubleshooting',
+  'ffmpegProfiles',
+  'watermarks'
+];
 
 function normalizePath(pathname: string): string {
   return pathname.replace(/\/+$/, '') || '/app';
@@ -2943,6 +2976,14 @@ function ScreenContent({
     return <WatermarksScreen />;
   }
 
+  if (route.id === 'logs') {
+    return <LogsScreen />;
+  }
+
+  if (route.id === 'troubleshooting') {
+    return <TroubleshootingScreen />;
+  }
+
   return <PlaceholderScreen route={route} />;
 }
 
diff --git a/web/src/api/generated/v1.d.ts b/web/src/api/generated/v1.d.ts
index e98832424..d9ff74f04 100644
--- a/web/src/api/generated/v1.d.ts
+++ b/web/src/api/generated/v1.d.ts
@@ -510,6 +510,11 @@ export interface components {
     "LibraryScanStatusResponseModel": {
     "libraryId": number;
     "percent": number;
+  };
+    "LogEntryResponseModel": {
+    "timestamp": string;
+    "level": string;
+    "message": string;
   };
     "LogEventLevel": "Verbose" | "Debug" | "Information" | "Warning" | "Error" | "Fatal";
     "LoggingSettingsResponseModel": {
@@ -577,6 +582,10 @@ export interface components {
     "PagedLibraryBrowseItemsResponseModel": {
     "totalCount": number;
     "page": Array<components["schemas"]["LibraryBrowseItemResponseModel"]>;
+  };
+    "PagedLogEntriesResponseModel": {
+    "totalCount": number;
+    "page": Array<components["schemas"]["LogEntryResponseModel"]>;
   };
     "PagedPlayoutItemsResponseModel": {
     "totalCount": number;
@@ -779,6 +788,13 @@ export interface components {
     "StartType": "Dynamic" | "Fixed";
     "StreamingMode": "TransportStream" | "HttpLiveStreamingDirect" | "HttpLiveStreamingSegmenter" | "TransportStreamHybrid";
     "TailMode": "None" | "Offline" | "Slate" | "Filler";
+    "TroubleshootingInfoResponseModel": {
+    "generalJson": string;
+    "nvidiaCapabilities": null | string;
+    "qsvCapabilities": null | string;
+    "vaapiCapabilities": null | string;
+    "videoToolboxCapabilities": null | string;
+  };
     "UiSettingsResponseModel": {
     "isDarkMode": boolean;
     "language": string;
diff --git a/web/src/api/index.ts b/web/src/api/index.ts
index f7a0a8484..a63b46776 100644
--- a/web/src/api/index.ts
+++ b/web/src/api/index.ts
@@ -10,9 +10,11 @@ export * from './fillerPresets';
 export * from './guide';
 export * from './libraries';
 export * from './libraryBrowse';
+export * from './logs';
 export * from './pickers';
 export * from './playouts';
 export * from './schedules';
 export * from './settings';
+export * from './troubleshoot';
 export * from './useChannelsQuery';
 export * from './watermarks';
diff --git a/web/src/api/logs.test.ts b/web/src/api/logs.test.ts
new file mode 100644
index 000000000..c8cf43e09
--- /dev/null
+++ b/web/src/api/logs.test.ts
@@ -0,0 +1,57 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { getLogs } from './logs';
+
+const samplePage = {
+  totalCount: 2,
+  page: [
+    { timestamp: '2026-07-07T00:00:00Z', level: 'Warning', message: 'uh oh' },
+    { timestamp: '2026-07-07T00:01:00Z', level: 'Information', message: 'all good' }
+  ]
+};
+
+describe('getLogs', () => {
+  beforeEach(() => {
+    window.localStorage.clear();
+    vi.restoreAllMocks();
+  });
+
+  it('GETs /api/logs with no query string when called without params', async () => {
+    const fetchSpy = vi.spyOn(window, 'fetch').mockResolvedValue(
+      new Response(JSON.stringify(samplePage), {
+        headers: { 'Content-Type': 'application/json' },
+        status: 200
+      })
+    );
+
+    await expect(getLogs()).resolves.toMatchObject({ totalCount: 2 });
+
+    const [url, init] = fetchSpy.mock.calls[0];
+    expect(url).toBe('/api/logs');
+    expect((init?.method ?? 'GET').toUpperCase()).toBe('GET');
+  });
+
+  it('builds the query string from filter, pageNum and pageSize', async () => {
+    const fetchSpy = vi.spyOn(window, 'fetch').mockResolvedValue(
+      new Response(JSON.stringify(samplePage), {
+        headers: { 'Content-Type': 'application/json' },
+        status: 200
+      })
+    );
+
+    await getLogs({ filter: 'boom', pageNum: 2, pageSize: 50 });
+
+    const [url] = fetchSpy.mock.calls[0];
+    expect(url).toBe('/api/logs?filter=boom&pageNum=2&pageSize=50');
+  });
+
+  it('rejects with the ApiError status on failure', async () => {
+    vi.spyOn(window, 'fetch').mockResolvedValue(
+      new Response(JSON.stringify({ status: 500, title: 'Server Error' }), {
+        headers: { 'Content-Type': 'application/json' },
+        status: 500
+      })
+    );
+
+    await expect(getLogs()).rejects.toMatchObject({ status: 500 });
+  });
+});
diff --git a/web/src/api/logs.ts b/web/src/api/logs.ts
new file mode 100644
index 000000000..5d2269800
--- /dev/null
+++ b/web/src/api/logs.ts
@@ -0,0 +1,43 @@
+import { ApiError, request } from './client';
+import type { components } from './generated/v1';
+
+export type LogEntry = components['schemas']['LogEntryResponseModel'];
+export type PagedLogEntries = components['schemas']['PagedLogEntriesResponseModel'];
+
+export interface GetLogsParams {
+  filter?: string;
+  pageNum?: number;
+  pageSize?: number;
+}
+
+export function getLogs(params: GetLogsParams = {}): Promise<PagedLogEntries> {
+  const searchParams = new URLSearchParams();
+
+  if (params.filter) {
+    searchParams.set('filter', params.filter);
+  }
+
+  if (params.pageNum != null) {
+    searchParams.set('pageNum', String(params.pageNum));
+  }
+
+  if (params.pageSize != null) {
+    searchParams.set('pageSize', String(params.pageSize));
+  }
+
+  const queryString = searchParams.toString();
+
+  return request<PagedLogEntries>(`/api/logs${queryString ? `?${queryString}` : ''}`);
+}
+
+export function messageFromLogsError(error: unknown, fallback = 'Unable to load logs'): string {
+  if (error instanceof ApiError) {
+    return error.detail ?? error.message;
+  }
+
+  if (error instanceof Error) {
+    return error.message;
+  }
+
+  return fallback;
+}
diff --git a/web/src/api/troubleshoot.test.ts b/web/src/api/troubleshoot.test.ts
new file mode 100644
index 000000000..fa54e4b8c
--- /dev/null
+++ b/web/src/api/troubleshoot.test.ts
@@ -0,0 +1,43 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { getTroubleshootingInfo } from './troubleshoot';
+
+const sampleInfo = {
+  generalJson: '{"Version":"1.2.3"}',
+  nvidiaCapabilities: 'nvidia output',
+  qsvCapabilities: null,
+  vaapiCapabilities: null,
+  videoToolboxCapabilities: null
+};
+
+describe('getTroubleshootingInfo', () => {
+  beforeEach(() => {
+    window.localStorage.clear();
+    vi.restoreAllMocks();
+  });
+
+  it('GETs /api/troubleshoot/info and returns the info payload', async () => {
+    const fetchSpy = vi.spyOn(window, 'fetch').mockResolvedValue(
+      new Response(JSON.stringify(sampleInfo), {
+        headers: { 'Content-Type': 'application/json' },
+        status: 200
+      })
+    );
+
+    await expect(getTroubleshootingInfo()).resolves.toMatchObject({ nvidiaCapabilities: 'nvidia output' });
+
+    const [url, init] = fetchSpy.mock.calls[0];
+    expect(url).toBe('/api/troubleshoot/info');
+    expect((init?.method ?? 'GET').toUpperCase()).toBe('GET');
+  });
+
+  it('rejects with the ApiError status on failure', async () => {
+    vi.spyOn(window, 'fetch').mockResolvedValue(
+      new Response(JSON.stringify({ status: 500, title: 'Server Error' }), {
+        headers: { 'Content-Type': 'application/json' },
+        status: 500
+      })
+    );
+
+    await expect(getTroubleshootingInfo()).rejects.toMatchObject({ status: 500 });
+  });
+});
diff --git a/web/src/api/troubleshoot.ts b/web/src/api/troubleshoot.ts
new file mode 100644
index 000000000..b8a316d4c
--- /dev/null
+++ b/web/src/api/troubleshoot.ts
@@ -0,0 +1,20 @@
+import { ApiError, request } from './client';
+import type { components } from './generated/v1';
+
+export type TroubleshootingInfo = components['schemas']['TroubleshootingInfoResponseModel'];
+
+export function getTroubleshootingInfo(): Promise<TroubleshootingInfo> {
+  return request<TroubleshootingInfo>('/api/troubleshoot/info');
+}
+
+export function messageFromTroubleshootError(error: unknown, fallback = 'Unable to load troubleshooting info'): string {
+  if (error instanceof ApiError) {
+    return error.detail ?? error.message;
+  }
+
+  if (error instanceof Error) {
+    return error.message;
+  }
+
+  return fallback;
+}
diff --git a/web/src/screens/LogsScreen.tsx b/web/src/screens/LogsScreen.tsx
new file mode 100644
index 000000000..e1f96a25f
--- /dev/null
+++ b/web/src/screens/LogsScreen.tsx
@@ -0,0 +1,198 @@
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { ChevronLeft, ChevronRight, Info, RefreshCw, Search, TriangleAlert } from 'lucide-react';
+import { Badge, Button, Card, IconButton, Input, Select, Spinner } from '../components';
+import { getLogs, messageFromLogsError, type LogEntry } from '../api';
+
+const PAGE_SIZE_OPTIONS = ['25', '50', '100'];
+
+const LEVEL_TONE: Record<string, 'neutral' | 'accent' | 'ok' | 'warn' | 'error'> = {
+  Debug: 'neutral',
+  Error: 'error',
+  Fatal: 'error',
+  Information: 'accent',
+  Verbose: 'neutral',
+  Warning: 'warn'
+};
+
+type LogsState =
+  | { entries: LogEntry[]; error: null; status: 'success'; totalCount: number }
+  | { entries: []; error: string; status: 'error'; totalCount: 0 }
+  | { entries: []; error: null; status: 'loading'; totalCount: 0 };
+
+function formatTimestamp(value: string): string {
+  const date = new Date(value);
+  return Number.isNaN(date.getTime()) ? value : date.toLocaleString();
+}
+
+export function LogsScreen() {
+  const [filterInput, setFilterInput] = useState('');
+  const [filter, setFilter] = useState('');
+  const [pageNum, setPageNum] = useState(0);
+  const [pageSize, setPageSize] = useState(50);
+  const [state, setState] = useState<LogsState>({ entries: [], error: null, status: 'loading', totalCount: 0 });
+  const activeRef = useRef(true);
+  const seqRef = useRef(0);
+
+  useEffect(() => {
+    activeRef.current = true;
+    return () => {
+      activeRef.current = false;
+    };
+  }, []);
+
+  // Debounce free-text filtering: the filter is applied server-side (GetRecentLogEntries scans
+  // the newest log file per request), so we wait for the user to pause typing before refetching.
+  useEffect(() => {
+    const handle = window.setTimeout(() => {
+      setPageNum(0);
+      setFilter(filterInput.trim());
+    }, 300);
+
+    return () => window.clearTimeout(handle);
+  }, [filterInput]);
+
+  // Fetch only; state updates happen in the async callbacks (never synchronously in the
+  // effect body) so a stale table stays visible during refetches instead of flashing to
+  // a loading spinner on every filter keystroke or page change.
+  const load = useCallback(() => {
+    const id = ++seqRef.current;
+    getLogs({ filter, pageNum, pageSize })
+      .then((paged) => {
+        if (activeRef.current && id === seqRef.current) {
+          setState({ entries: paged.page ?? [], error: null, status: 'success', totalCount: paged.totalCount ?? 0 });
+        }
+      })
+      .catch((error: unknown) => {
+        if (activeRef.current && id === seqRef.current) {
+          setState({ entries: [], error: messageFromLogsError(error), status: 'error', totalCount: 0 });
+        }
+      });
+  }, [filter, pageNum, pageSize]);
+
+  useEffect(() => {
+    load();
+  }, [load]);
+
+  const refresh = () => {
+    setState({ entries: [], error: null, status: 'loading', totalCount: 0 });
+    load();
+  };
+
+  const totalPages = state.status === 'success' ? Math.max(1, Math.ceil(state.totalCount / pageSize)) : 1;
+
+  return (
+    <div className="ctv-collections">
+      <div className="ctv-channels-actionbar">
+        <Input
+          leadingIcon={<Search aria-hidden="true" size={14} />}
+          onChange={(event) => setFilterInput(event.target.value)}
+          placeholder="Filter by level or message…"
+          value={filterInput}
+        />
+        <span className="ctv-channels-spacer" />
+        <Select
+          onChange={(event) => {
+            setPageNum(0);
+            setPageSize(Number(event.target.value));
+          }}
+          options={PAGE_SIZE_OPTIONS}
+          style={{ width: 96 }}
+          value={String(pageSize)}
+        />
+        <Button
+          onClick={refresh}
+          size="sm"
+          startIcon={<RefreshCw aria-hidden="true" size={14} />}
+          variant="secondary"
+        >
+          Refresh
+        </Button>
+      </div>
+
+      {state.status === 'error' && (
+        <div className="ctv-channels-error" role="alert">
+          <TriangleAlert aria-hidden="true" size={15} />
+          <span>{state.error}</span>
+          <span className="ctv-channels-spacer" />
+          <Button onClick={refresh} size="sm" variant="secondary">
+            Retry
+          </Button>
+        </div>
+      )}
+
+      <Card padded={false}>
+        {state.status === 'loading' ? (
+          <div className="ctv-collections-loading" role="status">
+            <Spinner size={18} />
+            <span>Loading logs…</span>
+          </div>
+        ) : state.entries.length === 0 ? (
+          <div className="ctv-collections-empty">
+            {filter ? 'No log entries match this filter.' : 'No log entries found.'}
+          </div>
+        ) : (
+          <div className="ctv-channels-table-frame">
+            <div className="ctv-channels-table-scroll">
+              <table aria-label="Recent log entries" className="ctv-channels-table">
+                <thead>
+                  <tr>
+                    <th>Timestamp</th>
+                    <th>Level</th>
+                    <th>Message</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  {state.entries.map((entry, index) => (
+                    <tr key={`${entry.timestamp}-${index}`}>
+                      <td style={{ fontFamily: 'var(--font-mono)', whiteSpace: 'nowrap' }}>
+                        {formatTimestamp(entry.timestamp)}
+                      </td>
+                      <td>
+                        <Badge tone={LEVEL_TONE[entry.level] ?? 'neutral'}>{entry.level}</Badge>
+                      </td>
+                      <td style={{ fontFamily: 'var(--font-mono)' }}>{entry.message}</td>
+                    </tr>
+                  ))}
+                </tbody>
+              </table>
+            </div>
+            <div className="ctv-channels-footer">
+              <span>
+                {state.totalCount} entr{state.totalCount === 1 ? 'y' : 'ies'}
+                {filter ? ` matching "${filter}"` : ''}
+              </span>
+              <span className="ctv-channels-spacer" />
+              <IconButton
+                disabled={pageNum === 0}
+                onClick={() => setPageNum((current) => Math.max(0, current - 1))}
+                size="sm"
+                title="Previous page"
+              >
+                <ChevronLeft aria-hidden="true" size={15} />
+              </IconButton>
+              <span>
+                Page <code>{pageNum + 1}</code> of <code>{totalPages}</code>
+              </span>
+              <IconButton
+                disabled={pageNum + 1 >= totalPages}
+                onClick={() => setPageNum((current) => current + 1)}
+                size="sm"
+                title="Next page"
+              >
+                <ChevronRight aria-hidden="true" size={15} />
+              </IconButton>
+            </div>
+          </div>
+        )}
+      </Card>
+
+      <div className="ctv-settings-callout">
+        <Info aria-hidden="true" size={14} />
+        <span>
+          Logs are read from the current server log file. Older, rotated log files aren't available here — check the
+          config folder's <code>logs</code> directory for history.
+        </span>
+      </div>
+    </div>
+  );
+}
diff --git a/web/src/screens/SettingsScreen.tsx b/web/src/screens/SettingsScreen.tsx
index 38c1d1524..fb940631c 100644
--- a/web/src/screens/SettingsScreen.tsx
+++ b/web/src/screens/SettingsScreen.tsx
@@ -861,12 +861,22 @@ function SystemPane({
             Open Dashboard
           </Button>
         </Row>
-        <Row control={220} help="Media browse/search, trakt, blocks/decos/templates, playout editors, logs and troubleshooting still live here." label="Classic UI">
+        <Row control={220} help="Media browse/search, trakt, blocks/decos/templates and playout editors still live here." label="Classic UI">
           <a className="ctv-button ctv-button-secondary ctv-button-sm" href="/system/health">
             <span>Open Classic UI</span>
             <ExternalLink aria-hidden="true" size={13} />
           </a>
         </Row>
+        <Row control={220} help="Recent server log entries with level and free-text filtering." label="Logs">
+          <Button endIcon={<ArrowRight aria-hidden="true" size={13} />} onClick={() => navigateToPath('/app/logs')} size="sm" variant="secondary">
+            Open Logs
+          </Button>
+        </Row>
+        <Row control={220} help="Version, environment, hardware and FFmpeg capability diagnostics." label="Troubleshooting">
+          <Button endIcon={<ArrowRight aria-hidden="true" size={13} />} onClick={() => navigateToPath('/app/troubleshooting')} size="sm" variant="secondary">
+            Open Troubleshooting
+          </Button>
+        </Row>
       </Card>
     </Pane>
   );
diff --git a/web/src/screens/TroubleshootingScreen.tsx b/web/src/screens/TroubleshootingScreen.tsx
new file mode 100644
index 000000000..9036d0822
--- /dev/null
+++ b/web/src/screens/TroubleshootingScreen.tsx
@@ -0,0 +1,160 @@
+import { useCallback, useEffect, useRef, useState } from 'react';
+import { Check, Copy, RefreshCw, TriangleAlert } from 'lucide-react';
+import { Button, Card, Spinner, Tabs } from '../components';
+import { getTroubleshootingInfo, messageFromTroubleshootError, type TroubleshootingInfo } from '../api';
+
+interface CapabilitySection {
+  content: string;
+  label: string;
+  value: string;
+}
+
+type TroubleshootingState =
+  | { error: null; info: TroubleshootingInfo; status: 'success' }
+  | { error: string; info: null; status: 'error' }
+  | { error: null; info: null; status: 'loading' };
+
+function prettyPrint(json: string): string {
+  try {
+    return JSON.stringify(JSON.parse(json), null, 2);
+  } catch {
+    return json;
+  }
+}
+
+function capabilitySections(info: TroubleshootingInfo): CapabilitySection[] {
+  const candidates: Array<[string, string, null | string | undefined]> = [
+    ['nvidia', 'NVIDIA', info.nvidiaCapabilities],
+    ['qsv', 'QSV', info.qsvCapabilities],
+    ['vaapi', 'VAAPI', info.vaapiCapabilities],
+    ['videoToolbox', 'VideoToolbox', info.videoToolboxCapabilities]
+  ];
+
+  return candidates
+    .filter((entry): entry is [string, string, string] => Boolean(entry[2] && entry[2].trim().length > 0))
+    .map(([value, label, content]) => ({ content, label, value }));
+}
+
+function CopyButton({ text }: { text: string }) {
+  const [copied, setCopied] = useState(false);
+
+  const copy = () => {
+    void navigator.clipboard?.writeText(text).then(() => {
+      setCopied(true);
+      window.setTimeout(() => setCopied(false), 1500);
+    });
+  };
+
+  return (
+    <Button
+      onClick={copy}
+      size="sm"
+      startIcon={copied ? <Check aria-hidden="true" size={14} /> : <Copy aria-hidden="true" size={14} />}
+      variant="secondary"
+    >
+      {copied ? 'Copied' : 'Copy'}
+    </Button>
+  );
+}
+
+export function TroubleshootingScreen() {
+  const [state, setState] = useState<TroubleshootingState>({ error: null, info: null, status: 'loading' });
+  const [tab, setTab] = useState('general');
+  const activeRef = useRef(true);
+
+  useEffect(() => {
+    activeRef.current = true;
+    return () => {
+      activeRef.current = false;
+    };
+  }, []);
+
+  // Fetch only; state updates happen in the async callbacks (never synchronously in the
+  // effect body) so the initial 'loading' default stands until data resolves.
+  const load = useCallback(() => {
+    getTroubleshootingInfo()
+      .then((info) => {
+        if (activeRef.current) {
+          setState({ error: null, info, status: 'success' });
+        }
+      })
+      .catch((error: unknown) => {
+        if (activeRef.current) {
+          setState({ error: messageFromTroubleshootError(error), info: null, status: 'error' });
+        }
+      });
+  }, []);
+
+  useEffect(() => {
+    load();
+  }, [load]);
+
+  const refresh = () => {
+    setState({ error: null, info: null, status: 'loading' });
+    load();
+  };
+
+  if (state.status === 'loading') {
+    return (
+      <div className="ctv-collections-loading" role="status">
+        <Spinner size={18} />
+        <span>Loading troubleshooting info…</span>
+      </div>
+    );
+  }
+
+  if (state.status === 'error') {
+    return (
+      <div className="ctv-collections">
+        <div className="ctv-channels-error" role="alert">
+          <TriangleAlert aria-hidden="true" size={15} />
+          <span>{state.error}</span>
+          <span className="ctv-channels-spacer" />
+          <Button onClick={refresh} size="sm" variant="secondary">
+            Retry
+          </Button>
+        </div>
+      </div>
+    );
+  }
+
+  const generalJson = prettyPrint(state.info.generalJson);
+  const platforms = capabilitySections(state.info);
+  const tabs = [{ label: 'General', value: 'general' }, ...platforms.map((section) => ({ label: section.label, value: section.value }))];
+  const active = tabs.find((candidate) => candidate.value === tab) ?? tabs[0];
+
+  return (
+    <div className="ctv-collections">
+      <div className="ctv-channels-actionbar">
+        <Tabs onChange={setTab} tabs={tabs} value={active.value} />
+        <span className="ctv-channels-spacer" />
+        <Button onClick={refresh} size="sm" startIcon={<RefreshCw aria-hidden="true" size={14} />} variant="secondary">
+          Refresh
+        </Button>
+      </div>
+
+      {active.value === 'general' ? (
+        <Card actions={<CopyButton text={generalJson} />} subtitle="Version, environment, hardware and FFmpeg settings" title="General">
+          <pre className="ctv-troubleshoot-pre">
+            <code>{generalJson}</code>
+          </pre>
+        </Card>
+      ) : (
+        platforms
+          .filter((section) => section.value === active.value)
+          .map((section) => (
+            <Card
+              actions={<CopyButton text={section.content} />}
+              key={section.value}
+              subtitle="Raw capability probe output"
+              title={section.label}
+            >
+              <pre className="ctv-troubleshoot-pre">
+                <code>{section.content}</code>
+              </pre>
+            </Card>
+          ))
+      )}
+    </div>
+  );
+}
diff --git a/web/src/shell.css b/web/src/shell.css
index 2fdf82614..04045e2e0 100644
--- a/web/src/shell.css
+++ b/web/src/shell.css
@@ -3316,6 +3316,20 @@
   color: var(--text-secondary);
 }
 
+.ctv-troubleshoot-pre {
+  max-height: 60vh;
+  overflow: auto;
+  margin: 0;
+  padding: 12px;
+  border-radius: var(--radius-sm);
+  background: var(--ctv-surface-2);
+  border: 1px solid var(--border-hairline);
+  font: var(--text-xs) / 1.5 var(--font-mono);
+  color: var(--text-secondary);
+  white-space: pre-wrap;
+  word-break: break-word;
+}
+
 .ctv-settings-flush-row {
   display: flex;
   align-items: center;