1@tailwind base;
  2@tailwind components;
  3@tailwind utilities;
  4
  5@layer base {
  6  :root {
  7    --background: 0 0% 100%;
  8    --foreground: 222.2 84% 4.9%;
  9
 10    --card: 0 0% 100%;
 11    --card-foreground: 222.2 84% 4.9%;
 12
 13    --popover: 0 0% 100%;
 14    --popover-foreground: 222.2 84% 4.9%;
 15
 16    --primary: 222.2 47.4% 11.2%;
 17    --primary-foreground: 210 40% 98%;
 18
 19    --secondary: 210 40% 96.1%;
 20    --secondary-foreground: 222.2 47.4% 11.2%;
 21
 22    --muted: 210 40% 96.1%;
 23    --muted-foreground: 215.4 16.3% 46.9%;
 24
 25    --accent: 210 40% 96.1%;
 26    --accent-foreground: 222.2 47.4% 11.2%;
 27
 28    --destructive: 0 84.2% 60.2%;
 29    --destructive-accent: 0 27% 100%;
 30    --destructive-foreground: 210 40% 98%;
 31
 32    --success: 147 100% 40%;
 33    --success-accent: 147 100% 80%;
 34    --success-foreground: 210 40% 98%;
 35
 36    --border: 214.3 31.8% 91.4%;
 37    --input: 214.3 31.8% 91.4%;
 38    --ring: 222.2 84% 4.9%;
 39
 40    --radius: 0.5rem;
 41  }
 42
 43  .dark {
 44    --background: 222.2 84% 4.9%;
 45    --foreground: 210 40% 98%;
 46
 47    --card: 222.2 84% 4.9%;
 48    --card-foreground: 210 40% 98%;
 49
 50    --popover: 222.2 84% 4.9%;
 51    --popover-foreground: 210 40% 98%;
 52
 53    --primary: 210 40% 98%;
 54    --primary-foreground: 222.2 47.4% 11.2%;
 55
 56    --secondary: 217.2 32.6% 17.5%;
 57    --secondary-foreground: 210 40% 98%;
 58
 59    --muted: 217.2 32.6% 17.5%;
 60    --muted-foreground: 215 20.2% 65.1%;
 61
 62    --accent: 217.2 32.6% 17.5%;
 63    --accent-foreground: 210 40% 98%;
 64
 65    --success: 147 100% 40%;
 66    --success-accent: 147 100% 80%;
 67    --success-foreground: 210 40% 98%;
 68
 69    --destructive: 0 55% 57%;
 70    --destructive-accent: 0 62.8% 30.6%;
 71    --destructive-foreground: 210 40% 98%;
 72
 73    --border: 217.2 32.6% 17.5%;
 74    --input: 217.2 32.6% 17.5%;
 75    --ring: 212.7 26.8% 83.9%;
 76  }
 77
 78
 79}
 80
 81
 82@layer base {
 83  .font-body {
 84    font-family: 'Lato';
 85  }
 86
 87  .font-header {
 88    font-family: 'Ubuntu';
 89  }
 90
 91  .vstack {
 92    @apply flex flex-col;
 93  }
 94
 95  .hstack {
 96    @apply flex flex-row;
 97  }
 98
 99  * {
100    @apply border-border font-body;
101  }
102
103  body {
104    @apply bg-background text-foreground;
105  }
106}