:root {
  /* Colors */
  --color-primary: #A9C23F; /* Used in menu, header, and footer */
  --color-secondary: #00488C; /* Link colors */
  --color-light: #e8e8e8; /* Background */
  --color-dark: #333; /* Text color */
  --color-border: #b3b3b3; /* Common border color */
  --color-border-light: #cdcdcd; /* Light border color (Added for explorer title) */
  --color-border-lighter: #ebeaeb; /* Extra light border color (Added for explorer border) */
  --color-background-white: #fff;
  --color-gray-light: #dedede; /* Light gray for backgrounds */
  --color-warning: #FFD201;
  --color-error: #D00000;
  --color-success: #9ab552;
  --color-message-note: #fafcf0;
  --color-message-warning: #FFFEF8;
  --color-message-error: #FEF8F8;
  --color-message-blackbox-bg: #333333;
  --color-message-blackbox-text: #aaaaaa;

  /* Typography */
  --font-family: Verdana, Arial, Helvetica, sans-serif;
  --font-size-base: 8pt;
  --font-size-header: 1.5em;
  --font-size-subheader: 1.2em;
  --font-size-small: 9pt;

  /* Spacing & Layout */
  --spacing-small: 6px;
  --spacing-medium: 12px;
  --spacing-large: 16px;
  --radius-small: 6px;
  --radius-medium: 12px;
  --radius-large: 16px;
  --shadow-light: 0px 0px 4px 2px #bbbbbb;
  --shadow-heavy: 3px 3px 5px 0px #7a7a7a;
}