save "create sync group" table in database

internal/site/styles/index.css

@@ -13,10 +13,9 @@
     --text-lg--line-height: calc(1.75 / 1.125);
     --text-xl: 1.25rem;
     --text-xl--line-height: calc(1.75 / 1.25);
-    --text-2xl: 1.5rem;
     --text-3xl: 1.875rem;
-    --text-4xl: 2.25rem;
     --text-5xl: 3rem;
+    --text-8xl: 6rem;
     --font-weight-semibold: 600;
     --font-weight-bold: 700;
     --radius-lg: var(--radius);
@@ -196,6 +195,9 @@
   .flex {
     display: flex;
   }
+  .table {
+    display: table;
+  }
   .min-h-full {
     min-height: 100%;
   }
@@ -235,6 +237,9 @@
   .gap-y-\[2em\] {
     row-gap: 2em;
   }
+  .overflow-x-auto {
+    overflow-x: auto;
+  }
   .overflow-x-scroll {
     overflow-x: scroll;
   }
@@ -314,6 +319,21 @@
       }
     }
   }
+  .disabled\:cursor-not-allowed {
+    &:disabled {
+      cursor: not-allowed;
+    }
+  }
+  .disabled\:bg-accent-secondary {
+    &:disabled {
+      background-color: var(--accent-secondary);
+    }
+  }
+  .disabled\:no-underline {
+    &:disabled {
+      text-decoration-line: none;
+    }
+  }
 }
 @layer base {
   select {
@@ -376,6 +396,7 @@
   --muted: var(--base-100);
   --muted-foreground: var(--base-600);
   --accent: var(--base-100);
+  --accent-secondary: var(--base-300);
   --accent-foreground: var(--base-800);
   --destructive: oklch(0.577 0.245 27.325);
   --border: var(--base-200);
@@ -417,6 +438,7 @@
     --muted: var(--base-800);
     --muted-foreground: var(--base-300);
     --accent: var(--base-800);
+    --accent-secondary: var(--base-600);
     --accent-foreground: var(--base-200);
     --destructive: oklch(0.704 0.191 22.216);
     --border: var(--base-800);
@@ -462,6 +484,7 @@
   --muted: var(--base-800);
   --muted-foreground: var(--base-300);
   --accent: var(--base-800);
+  --accent-secondary: var(--base-600);
   --accent-foreground: var(--base-200);
   --destructive: oklch(0.704 0.191 22.216);
   --border: var(--base-800);
@@ -491,23 +514,23 @@
     font-weight: var(--display-weight);
   }
   h1 {
-    font-size: var(--text-5xl);
+    font-size: var(--text-8xl);
   }
   h2 {
-    font-size: var(--text-4xl);
+    font-size: var(--text-5xl);
   }
   h3 {
     font-size: var(--text-3xl);
   }
   h4 {
-    font-size: var(--text-2xl);
-  }
-  h5 {
     font-size: var(--text-xl);
   }
-  h6 {
+  h5 {
     font-size: var(--text-lg);
   }
+  h6 {
+    font-size: var(--text-md);
+  }
   ul, ol {
     list-style: none;
   }