How can I declare a file for inline css in typoscript?

I want to optimize a website for google page speed and for a 100/100 score I need to declare css inline. I know that I can declare css inline like this way:

working example

page.headerData {
  10 = TEXT
  10.wrap = <style>|</style>
  10.value (
      .example{color:#123}
  )
}

But I dont like this way and want to declare a file and load the content of this file instead for better maintenance like:

pseudocode

page.headerData {
  10 = TEXT
  10.wrap = <style>|</style>
  10.value < {$publicMedia}Css/inline.css
}

inline.css

* {
  margin:0;
  padding:0;
}
.example {
  color:#123;
}

desired output

<!DOCTYPE html>
<html lang="en">
<head>
...
  <style>
    * {
      margin:0;
      padding:0;
    }
    .example {
      color:#123;
    }
  </style>
</head>
...

Is there a way to do that? :)

Solution

I don´t think there is a way to inline an external css file in ts. But there are 2 workarounds.

Use external ts-file an include it to your default ts: <INCLUDE_TYPOSCRIPT:source="file:fileadmin/templates/ts/myinlinestyles.ts">
In your external ts-file you can work the normal way.
page.headerData { 10 = TEXT 10.wrap = <style>|</style> 10.value ( .example{color:#123} ) }
Use Fluid-Template.

Also you have misspelled your value declaration(= not <).
< means object copy. See TypoScript syntax.

Google say "only use for small Resources". And as you can see on the linked page is that the inline approuch have some Limitations e.g. cacheability. The important is that you should minimize/compress and concatenate your CSS-/JS-files. TYPO3 have a nice solution for this. Please have a look at the TYPO3-Documentation - section setup->config and search for compressCss and concatenateCss.