| 1 | @import "tailwindcss"; |
| 2 | |
| 3 | /* ─── NORD Design System ─────────────────────────────────────────────────── */ |
| 4 | |
| 5 | @theme inline { |
| 6 | /* Scandi-Noir Palette */ |
| 7 | --color-nord-black: #050505; |
| 8 | --color-nord-white: #fafafa; |
| 9 | --color-nord-gray: #1a1a1a; |
| 10 | --color-nord-accent: #ffffff; |
| 11 | |
| 12 | /* Typography */ |
| 13 | --font-sans: "Inter", "SF Pro Display", ui-sans-serif, sans-serif; |
| 14 | |
| 15 | /* Brand letter-spacing */ |
| 16 | --tracking-brand: 0.5em; |
| 17 | --tracking-tightest: -0.05em; |
| 18 | } |
| 19 | |
| 20 | /* ─── Custom Utilities ───────────────────────────────────────────────────── */ |
| 21 | |
| 22 | @utility bg-nord-gradient { |
| 23 | background-image: linear-gradient( |
| 24 | to bottom, |
| 25 | rgba(0, 0, 0, 0) 0%, |
| 26 | rgba(0, 0, 0, 0.8) 100% |
| 27 | ); |
| 28 | } |
| 29 | |
| 30 | /* ─── Base Reset ─────────────────────────────────────────────────────────── */ |
| 31 | |
| 32 | *, |
| 33 | *::before, |
| 34 | *::after { |
| 35 | box-sizing: border-box; |
| 36 | } |
| 37 | |
| 38 | html { |
| 39 | /* Smooth momentum scrolling on iOS webview */ |
| 40 | -webkit-overflow-scrolling: touch; |
| 41 | } |
| 42 | |
| 43 | body { |
| 44 | background-color: #050505; |
| 45 | color: #fafafa; |
| 46 | font-family: "Inter", "SF Pro Display", ui-sans-serif, sans-serif; |
| 47 | -webkit-font-smoothing: antialiased; |
| 48 | -moz-osx-font-smoothing: grayscale; |
| 49 | } |