Feat v0.6.13 responsive spacing (#48)

Co-authored-by: Jeffrey Smith <jasafpro@gmail.com>
Co-committed-by: Jeffrey Smith <jasafpro@gmail.com>

src/css/variables.css

@@ -67,6 +67,23 @@
     --mono:         'JetBrains Mono', 'Söhne Mono', 'SF Mono', 'Fira Code', 'Consolas', monospace;
     --transition:   180ms ease;
 
+    /* -- Spacing (4px grid) ------------------- */
+    --sp-1:  0.25rem;   /*  4px */
+    --sp-2:  0.5rem;    /*  8px */
+    --sp-3:  0.75rem;   /* 12px */
+    --sp-4:  1rem;      /* 16px */
+    --sp-5:  1.25rem;   /* 20px */
+    --sp-6:  1.5rem;    /* 24px */
+    --sp-8:  2rem;      /* 32px */
+    --sp-10: 2.5rem;    /* 40px */
+    --sp-12: 3rem;      /* 48px */
+
+    /* -- Breakpoints --------------------------
+       Mobile:  max-width: 768px
+       Tablet:  max-width: 1024px
+       Desktop: default (no query)
+       ----------------------------------------- */
+
     /* Banner system — set by JS from /api/v1/admin/settings/banner */
     --banner-top-height: 0px;
     --banner-bottom-height: 0px;