diff --git a/deck-frontend/index.html b/deck-frontend/index.html
index ae18091..8881f20 100644
--- a/deck-frontend/index.html
+++ b/deck-frontend/index.html
@@ -17,9 +17,6 @@
-
-
-
@@ -60,11 +57,17 @@
+
+
+
+
+
+
diff --git a/deck-frontend/src/styles/main.css b/deck-frontend/src/styles/main.css
index 12fed62..84d3791 100644
--- a/deck-frontend/src/styles/main.css
+++ b/deck-frontend/src/styles/main.css
@@ -58,7 +58,6 @@ body {
.btn:hover { border-color: var(--accent); color: var(--text); }
.btn.active { background: var(--accent); border-color: var(--accent); color: #fff; }
.btn-sm { padding: 5px 10px; font-size: 0.75em; }
-.sel-count { font-size: 0.7em; margin-left: 4px; opacity: 0.8; }
.search-input {
width: 300px;
@@ -94,9 +93,38 @@ body {
border-bottom: 1px solid var(--border);
display: flex;
align-items: center;
- justify-content: center;
+ justify-content: space-between;
padding: 0 16px;
- gap: 8px;
+}
+.view-bar-spacer { width: 120px; }
+
+/* === SEL/GET GROUP === */
+.sel-group {
+ display: flex;
+ align-items: center;
+ gap: 2px;
+ background: var(--bg-card);
+ border-radius: 6px;
+ padding: 3px;
+}
+.sel-btn {
+ padding: 5px 12px;
+ background: transparent;
+ border: none;
+ border-radius: 4px;
+ color: var(--text-muted);
+ cursor: pointer;
+ font-size: 0.75em;
+ font-weight: 600;
+ transition: all 0.15s ease;
+}
+.sel-btn:hover { color: var(--text); background: rgba(255,255,255,0.05); }
+.sel-btn.active { background: var(--accent); color: #fff; }
+#sel-count {
+ font-size: 0.7em;
+ color: var(--accent);
+ margin-left: 6px;
+ font-weight: 600;
}
/* === GROUPS BAR === */