Add channels page

src/main/resources/static/css/styles.css

@@ -188,6 +188,50 @@ body {
     box-shadow: inset 0 1px 0 rgba(255,255,255,0.02);
 }
 
+.search-panel {
+    display: flex;
+    flex-direction: column;
+    gap: 12px;
+}
+
+.text-input {
+    width: 100%;
+    padding: 12px;
+    border-radius: 10px;
+    border: 1px solid #1f2937;
+    background: #0f172a;
+    color: #e2e8f0;
+    font-size: 15px;
+    transition: border-color 0.2s ease, box-shadow 0.2s ease;
+}
+
+.text-input:focus {
+    outline: none;
+    border-color: #7c3aed;
+    box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.25);
+}
+
+.search-form {
+    display: flex;
+    flex-direction: column;
+    gap: 10px;
+}
+
+.search-row {
+    display: flex;
+    gap: 10px;
+    align-items: stretch;
+}
+
+.search-row .text-input {
+    flex: 1;
+}
+
+.search-row .button {
+    padding: 0 16px;
+    height: 46px;
+}
+
 .badge {
     display: inline-flex;
     align-items: center;
@@ -1133,6 +1177,10 @@ body {
     font-size: 0.9em;
 }
 
+.tiny {
+    font-size: 13px;
+}
+
 .range-value {
     color: #a5b4fc;
     font-size: 12px;