actually made the fallback color a fallback instead of just the color, imports need to be at the top oops

static/images/house.svg

@@ -47,8 +47,6 @@
             }
             }
 
-            @import url("/static/css/icon-colors.css") layer(import-color);
-            @import url("/static/css/icon-print.css") layer(print);
             @layer base{
                 .box {
                     fill: var(--background-color);
@@ -58,6 +56,10 @@
                 }
             }
          </style>
+         <style>
+            @import url("/static/css/icon-colors.css") layer(import-color);
+            @import url("/static/css/icon-print.css") layer(print);
+         </style>
   <a href="/" target="_top">
   <rect x="0" y="0" class="box" width="2048" height="1192"/>
   <path

static/images/rss.svg

@@ -12,8 +12,6 @@
             }
             }
 
-            @import url("/static/css/icon-colors.css") layer(import-color);
-            @import url("/static/css/icon-print.css") layer(print);
             @layer base{
             .box {
                 fill: var(--background-color);
@@ -26,6 +24,10 @@
             }
             }
          </style>
+         <style>
+            @import url("/static/css/icon-colors.css") layer(import-color);
+            @import url("/static/css/icon-print.css") layer(print);
+         </style>
          <a href="/index.xml" target="_top">
 <g>
 	<rect x="0" y="0" class="box" width="455.731" height="455.731"/>