Process 1 build 0203261953

frontend/app/globals.css

@@ -2369,6 +2369,31 @@ button span {
   font-size: 15px;
 }
 
+.changelog-groups {
+  display: grid;
+  gap: 18px;
+}
+
+.changelog-group {
+  display: grid;
+  gap: 10px;
+  padding-top: 14px;
+  border-top: 1px solid var(--border);
+}
+
+.changelog-group:first-child {
+  padding-top: 0;
+  border-top: 0;
+}
+
+.changelog-group h2 {
+  margin: 0;
+  font-size: 16px;
+  letter-spacing: 0.06em;
+  text-transform: uppercase;
+  color: var(--ink);
+}
+
 /* -------------------------------------------------------------------------- */
 /* Professional UI Refresh (graphite / silver / black + subtle blue accents) */
 /* -------------------------------------------------------------------------- */
@@ -3669,16 +3694,28 @@ button:disabled {
 .error-banner,
 .status-banner {
   border-radius: 12px;
+}
+
+.error-banner {
   border: 1px solid rgba(244, 114, 114, 0.2);
   background: rgba(244, 114, 114, 0.1);
   color: var(--error-ink);
 }
 
-[data-theme='dark'] .error-banner,
-[data-theme='dark'] .status-banner {
+.status-banner {
+  border: 1px solid rgba(74, 222, 128, 0.24);
+  background: rgba(74, 222, 128, 0.12);
+  color: #166534;
+}
+
+[data-theme='dark'] .error-banner {
   color: #ffd9d9;
 }
 
+[data-theme='dark'] .status-banner {
+  color: #dcfce7;
+}
+
 .auth-card {
   max-width: 520px;
   margin-inline: auto;
@@ -6332,7 +6369,7 @@ textarea {
   position: absolute;
   left: 0;
   bottom: 0;
-  width: 52px;
+  width: 100%;
   height: 2px;
   border-radius: 999px;
   background: linear-gradient(90deg, var(--accent-2), rgba(255, 255, 255, 0));
@@ -6409,3 +6446,62 @@ textarea {
     padding: 16px;
   }
 }
+
+/* Final header action layout */
+.header-actions {
+  display: grid;
+  grid-template-columns: 1fr auto 1fr;
+  align-items: center;
+  width: 100%;
+}
+
+.header-actions .header-cta--left {
+  grid-column: 1;
+  justify-self: start;
+  margin-right: 0;
+}
+
+.header-actions-center {
+  grid-column: 2;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.header-actions-right {
+  grid-column: 3;
+  display: inline-flex;
+  align-items: center;
+  justify-content: flex-end;
+  gap: 10px;
+  justify-self: end;
+}
+
+@media (max-width: 760px) {
+  .header-actions {
+    grid-template-columns: 1fr;
+    gap: 10px;
+  }
+
+  .header-actions .header-cta--left {
+    grid-column: 1;
+    width: 100%;
+  }
+
+  .header-actions-center,
+  .header-actions-right {
+    display: grid;
+    grid-template-columns: 1fr;
+    width: 100%;
+    justify-self: stretch;
+  }
+
+  .header-actions-center {
+    grid-column: 1;
+  }
+
+  .header-actions-right {
+    grid-column: 1;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+}