chore(demos): update outdated CSS variable names after token breaking changes (#8333)

## Summary

Rename outdated CSS Variables that we missed during the token renames. I
used my handy, new
[`@ben-elan/calcite-codemod`](https://www.npmjs.com/package/@ben-elan/calcite-codemod)
package 🚀

Author: benelan

packages/calcite-components/src/demos/_assets/demos.css

@@ -24,18 +24,18 @@ main {
 .example-container h3,
 .example-container h4,
 .example-container h5 {
-  font-weight: var(--calcite-app-font-weight-demi);
+  font-weight: var(--calcite-font-weight-semibold);
   /* margin: var(--calcite-app-cap-spacing) 0 0; */
 }
 .example-container h1 {
-  font-size: var(--calcite-app-font-size-2);
+  font-size: var(--calcite-font-size);
 }
 .example-container h2 {
-  font-size: var(--calcite-app-font-size-1);
+  font-size: var(--calcite-font-size-sm);
 }
 .example-container h3 {
   font-weight: var(--calcite-app-font-weight);
-  font-size: var(--calcite-app-font-size-1);
+  font-size: var(--calcite-font-size-sm);
 }
 
 /*

packages/calcite-components/src/demos/list.html

@@ -788,7 +788,11 @@ <h1 style="margin: 0 auto; text-align: center">List</h1>
               ></calcite-icon>
             </calcite-list-item>
             <calcite-list-item drag-disabled label="test5" value="test5" description="hello world 5">
-              <calcite-icon icon="compass" slot="content-start" style="color: var(--calcite-ui-success)"></calcite-icon>
+              <calcite-icon
+                icon="compass"
+                slot="content-start"
+                style="color: var(--calcite-color-status-success)"
+              ></calcite-icon>
             </calcite-list-item>
           </calcite-list>
         </div>