From 00c84307aa08a5c1614b422c674a550fe55c573e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D0=90=D0=BD=D1=82=D0=BE=D0=BD=20=D0=A2=D1=80=D0=BE=D1=88?=
 =?UTF-8?q?=D0=B8=D0=BD?= <i@atroshin.ru>
Date: Fri, 11 Sep 2026 22:58:10 +0300
Subject: [PATCH] profiler: use tab-style buttons for Profiles / Card snapshots

Rectangular top-rounded tabs with a bottom border, matching the app's
top-level tab bar (incl. dark:bg-blue-500/dark:text-white active state,
toggled by profilerListSwitch). SW cache v82 -> v83.
---
 frontend/index.html | 8 +++++---
 frontend/sw.js      | 2 +-
 2 files changed, 6 insertions(+), 4 deletions(-)

diff --git a/frontend/index.html b/frontend/index.html
index 02f3471..de02668 100644
--- a/frontend/index.html
+++ b/frontend/index.html
@@ -813,9 +813,9 @@
 
 		<div id="pysim-sub-profiler" class="hidden">
 			<div id="profiler-list">
-				<div class="flex justify-center gap-2 mb-3">
-					<button class="profiler-list-tab px-4 py-1.5 text-sm rounded-full bg-blue-600 text-white" data-list-tab="profiles" onclick="profilerListSwitch('profiles')" data-l10n="Profiles">Profiles</button>
-					<button class="profiler-list-tab px-4 py-1.5 text-sm rounded-full bg-gray-200 dark:bg-slate-700 text-gray-700 dark:text-slate-300 hover:bg-gray-300 dark:hover:bg-slate-600" data-list-tab="snapshots" onclick="profilerListSwitch('snapshots')" data-l10n="Card snapshots">Card snapshots</button>
+				<div class="flex gap-1 mb-3 border-b border-gray-300 dark:border-slate-600">
+					<button class="profiler-list-tab px-4 py-1.5 text-sm rounded-t bg-blue-600 dark:bg-blue-500 text-white dark:text-white" data-list-tab="profiles" onclick="profilerListSwitch('profiles')" data-l10n="Profiles">Profiles</button>
+					<button class="profiler-list-tab px-4 py-1.5 text-sm rounded-t bg-gray-200 dark:bg-slate-700 hover:bg-gray-300 dark:hover:bg-slate-600 text-gray-700 dark:text-slate-300" data-list-tab="snapshots" onclick="profilerListSwitch('snapshots')" data-l10n="Card snapshots">Card snapshots</button>
 				</div>
 				<div id="profiler-list-profiles">
 					<div class="flex flex-wrap gap-2 mb-3">
@@ -7142,7 +7142,9 @@ function profilerListSwitch(name) {
 	document.querySelectorAll('.profiler-list-tab').forEach(btn => {
 		const active = btn.dataset.listTab === name;
 		btn.classList.toggle('bg-blue-600', active);
+		btn.classList.toggle('dark:bg-blue-500', active);
 		btn.classList.toggle('text-white', active);
+		btn.classList.toggle('dark:text-white', active);
 		btn.classList.toggle('bg-gray-200', !active);
 		btn.classList.toggle('dark:bg-slate-700', !active);
 		btn.classList.toggle('text-gray-700', !active);
diff --git a/frontend/sw.js b/frontend/sw.js
index 80cbf07..ee94e50 100644
--- a/frontend/sw.js
+++ b/frontend/sw.js
@@ -1,4 +1,4 @@
-const CACHE = 'otaman-v82';
+const CACHE = 'otaman-v83';
 const URLS = [
   'index.html',
   'help.html',