Sass Updates

sass/abstracts/_variables.sass

@@ -0,0 +1,80 @@
+// abstracts/_variables.sass (updated)
+
+@use 'sass:map'
+
+// Color palette (Sass map: HSL for modularity; all lightnesses darkened ~10-20%)
+$colors: (
+  'bg-dark': hsl(0, 0%, 2%),
+  'bg-darker': hsl(210, 7%, 5%),
+  'text-light': hsla(0, 0%, 100%, 1.00),
+  'text-lighter': hsl(120, 52%, 15%),
+  'text-muted': hsl(120, 40%, 45%),
+  'accent-light': hsl(120, 100%, 35%),
+  'accent-success': hsl(120, 80%, 45%),
+  'accent-warning': hsl(60, 100%, 35%),
+  'accent-error': hsl(0, 100%, 45%),
+  'border-light': hsla(120, 60%, 70%, 0.2)
+)
+
+// Helper functions to pull from map
+@function color($key)
+  @return map.get($colors, $key)
+
+// Direct vars for common use
+$bg-dark: color('bg-dark') !default
+$bg-darker: color('bg-darker') !default
+$text-light: color('text-light') !default
+$text-lighter: color('text-lighter') !default
+$text-muted: color('text-muted') !default
+$accent-light: color('accent-light') !default
+$accent-success: color('accent-success') !default
+$accent-warning: color('accent-warning') !default
+$accent-error: color('accent-error') !default
+$border-light: color('border-light') !default
+
+$font-stack: 'Courier New', 'SF Mono', monospace
+$mono-font: 'Courier New', 'SF Mono', 'Fira Code', Consolas, monospace
+
+$spacing: (
+  'xs': 0.25rem,
+  'sm': 0.5rem,
+  'md': 1rem,
+  'lg': 1.5rem,
+  'xl': 2.5rem,
+  '2xl': 4rem
+)
+
+@function space($key)
+  @return map.get($spacing, $key)
+
+$breakpoints: (
+  'sm': 640px,
+  'md': 768px,
+  'lg': 1024px,
+  'xl': 1280px,
+  '2xl': 1536px
+)
+
+$z-index: (
+  'dropdown': 1000,
+  'sticky': 50,
+  'modal': 2000
+)
+
+@function z($key)
+  @return map.get($z-index, $key)
+
+$dark-mode: true !default
+
+:root
+  --bg-dark: #{color('bg-dark')}
+  --bg-darker: #{color('bg-darker')}
+  --text-light: #{color('text-light')}
+  --text-lighter: #{color('text-lighter')}
+  --text-muted: #{color('text-muted')}
+  --accent-light: #{color('accent-light')}
+  --accent-success: #{color('accent-success')}
+  --accent-warning: #{color('accent-warning')}
+  --accent-error: #{color('accent-error')}
+  --border-light: #{color('border-light')}
+  --font-stack: #{$font-stack}

sass/abstracts/index.sass

@@ -0,0 +1 @@
+@forward 'variables';