/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */
    
    body {
      background-color: black;
      color: LawnGreen;
      font-family: monospace;
      text-shadow: 0 0 4px
      
    }
    
    /* Base badge style */
.badge {
  font-weight: bold;
  margin-left: 8px;
}

/* Timeline Specific Colors */
.badge.uc { color: #00e5ff; text-shadow: 0 0 4px #00e5ff; } /* Universal Century - Bright Cyan */
.badge.fc { color: #ffea00; text-shadow: 0 0 4px #ffea00; } /* Future Century (G) - Yellow */
.badge.ac { color: #ff1744; text-shadow: 0 0 4px #ff1744; } /* After Colony (Wing) - Red */
.badge.aw { color: #e040fb; text-shadow: 0 0 4px #e040fb; } /* After War (X) - Purple */
.badge.cc { color: #00e676; text-shadow: 0 0 4px #00e676; } /* Correct Century (Turn A) - Bright Mint */
.badge.ce { color: #2979ff; text-shadow: 0 0 4px #2979ff; } /* Cosmic Era (SEED) - Deep Blue */
.badge.ad { color: #00b0ff; text-shadow: 0 0 4px #00b0ff; } /* Anno Domini (00) - Ice Blue */
.badge.ag { color: #ff9100; text-shadow: 0 0 4px #ff9100; } /* Advanced Generation (AGE) - Orange */
.badge.rg { color: #76ff03; text-shadow: 0 0 4px #76ff03; } /* Regild Century (G-Reco) - Lime */
.badge.pd { color: #ff3d00; text-shadow: 0 0 4px #ff3d00; } /* Post Disaster (IBO) - Orange/Red */
.badge.as { color: #f50057; text-shadow: 0 0 4px #f50057; } /* Ad Stella (Witch from Mercury) - Hot Pink */
.badge.gb { color: #1de9b6; text-shadow: 0 0 4px #1de9b6; } /* Build Series / Real World - Teal */