css: move to new colorscheme

default.css

@@ -4,11 +4,56 @@
  * background: #03001C
  */
 
+
+/* colors
+@define-color fg    #504945;
+@define-color bg    #fbf1c7;
+@define-color imp   #d79921;
+
+@define-color fg            #3c3836;
+@define-color fg0           #282828;
+@define-color fg1           #3c3836;
+@define-color fg2           #504945;
+@define-color fg3           #665c54;
+@define-color fg4           #7c6f64;
+
+@define-color bg            #fbf1c7;
+@define-color bg0           #fbf1c7;
+@define-color bg0_h         #f9f5d7;
+@define-color bg0_s         #f2e5bc;
+@define-color bg1           #ebdbb2;
+@define-color bg2           #d5c4a1;
+@define-color bg3           #bdae93;
+@define-color bg4           #a89984;
+
+@define-color gray          #7c6f64;
+@define-color red           #cc241d;
+@define-color green         #98971a;
+@define-color yellow        #d79921;
+@define-color blue          #458588;
+@define-color purple        #b16286;
+@define-color aqua          #689d6a;
+@define-color orange        #d65d0e;
+@define-color peach         #fe640b;
+
+@define-color alt_gray      #928374;
+@define-color alt_red       #9d0006;
+@define-color alt_green     #79740e;
+@define-color alt_yellow    #b57614;
+@define-color alt_blue      #076678;
+@define-color alt_purple    #8f3f71;
+@define-color alt_aqua      #427b58;
+@define-color alt_orange    #af3a03;
+*/
+
+
+
 body {
-    font-family: Arial, sans-serif;
-    font-weight: 800;
-    color: #06CDFF;
-    background: #03001C;
+    font-family: "Noto Sans Symbols", sans-serif;
+    font-optical-sizing: auto;
+    font-weight: 400;
+    color: #504945;
+    background: #fbf1c7;
     line-height: 1.5;
     margin-inline: auto;
     margin: 0 auto;
@@ -51,11 +96,9 @@ nav ul {
 }
 
 .trianta {
-    border: none !important;
-    color: #06CDFF !important;
+    color: #d79921 !important;
     font-size: 2.5rem !important;
     min-width: 12rem;
-    margin: -1rem;
 }
 
 .canvas {
@@ -63,13 +106,12 @@ nav ul {
     display: inline-block;
     width: 60rem;
     vertical-align: bottom;
-    border: solid 4px #06CDFF;
+    border: solid 4px #d79921;
 }
 
 .stats {
     font-size: 18px;
     display: inline-block;
-    width: 12rem;
     vertical-align: middle;
 }
 
@@ -80,7 +122,7 @@ h1 {
 }
 
 h2 {
-    border: solid 2px #06CDFF;
+    border: solid 2px #d79921;
     margin: auto;
     padding: 8px;
     text-align: center;
@@ -94,14 +136,12 @@ h3 {
 }
 
 p {
-    margin: 0px;
+    margin: 1rem;
 }
 
 a {
-    background-color: #03001C;
-    border: solid 2px #06CDFF;
+    border: solid 2px #d79921;
     border-radius: 12px;
-    color: #06CDFF;
     display: inline-block;
     margin: 6px;
     margin-top: 0px;
@@ -126,8 +166,7 @@ a.button {
 }
 
 a:visited {
-    border: solid 2px #8200FF;
-    color: #8200FF;
+    border: solid 2px #d79921;
 }
 
 @keyframes hover {