fix: guide links and firefox/chrome styles

src/styles/components.scss

@@ -23,11 +23,7 @@
         place-content: center;
 
         font-size: 24px;
-        font-variation-settings:
-            'FILL' 0,
-            'wght' 300,
-            'GRAD' 0,
-            'opsz' 24;
+        font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
 
         max-width: 32px;
     }
@@ -616,12 +612,15 @@
         display: grid;
         grid-auto-flow: row;
 
+        width: 100%;
         max-width: 100%;
 
         gap: 2rem;
-        grid-template-columns: repeat(auto-fit, minmax(25rem, 1fr));
+        grid-template-columns: repeat(auto-fit, minmax(25rem, auto));
         grid-auto-rows: auto;
 
+        justify-content: center;
+
         & > .card {
             max-width: 25rem;
         }

src/styles/typography.scss

@@ -112,6 +112,19 @@
         //     margin-bottom: 1rem;
         // }
 
+        p[align='center'] {
+            margin: 1.5rem 0;
+
+            a {
+                // background: color-mix(in hsl, var(--card-base-internal, #ededed), #fff 20%);
+                background: hsl(from var(--card-base-internal, #ededed) h calc(s + 10) calc(l - 10));
+                padding: 0.5rem;
+                border-radius: 0.25rem;
+                box-shadow: 0.25rem 0.25rem 0 0 #333;
+                border: 2px solid #333;
+            }
+        }
+
         p:first-child {
             margin-top: 0;
         }