feat: add user profile page with editable physical info and lifestyle settings

frontend/src/index.css

@@ -285,4 +285,41 @@ a:hover {
 .btn:disabled {
   opacity: 0.6;
   cursor: not-allowed;
+}
+
+/* Radio groups */
+.radio-group {
+  display: flex;
+  gap: var(--space-lg);
+}
+
+.radio-label {
+  display: flex;
+  align-items: center;
+  gap: var(--space-xs);
+  cursor: pointer;
+  font-size: 14px;
+}
+
+.radio-label input[type="radio"] {
+  accent-color: var(--accent);
+}
+
+/* Success message */
+.success-message {
+  padding: var(--space-sm) var(--space-md);
+  background-color: color-mix(in srgb, var(--indicator-normal) 10%, transparent);
+  color: var(--indicator-normal);
+  border-radius: var(--radius-md);
+  font-size: 14px;
+  margin-bottom: var(--space-md);
+}
+
+/* Select styling */
+select.input {
+  appearance: none;
+  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%2371717a' d='M6 8L1 3h10z'/%3E%3C/svg%3E");
+  background-repeat: no-repeat;
+  background-position: right 12px center;
+  padding-right: 36px;
 }