@font-face { font-family: "Inter"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(/brand/fonts/inter.woff2) format("woff2"); }
@font-face { font-family: "Outfit"; font-style: normal; font-weight: 100 900; font-display: swap; src: url(/brand/fonts/outfit.woff2) format("woff2"); }

html:root {
  --background: 0 0% 98%; --foreground: 0 0% 3.9%;
  --card: 0 0% 100%; --card-foreground: 0 0% 3.9%;
  --popover: 0 0% 100%; --popover-foreground: 0 0% 3.9%;
  --muted: 0 0% 96.1%; --muted-foreground: 0 0% 45.1%;
  --accent: 0 0% 96.1%; --accent-foreground: 0 0% 9%;
  --secondary: 0 0% 96.1%; --secondary-foreground: 0 0% 9%;
  --border: 0 0% 89.8%; --input: 0 0% 89.8%;
  --primary: 162 44% 21%; --primary-foreground: 0 0% 100%; --ring: 162 44% 21%;
  --radius: 0.75rem;
}
html.dark:root {
  --background: 0 0% 3.9%; --foreground: 0 0% 98%;
  --card: 0 0% 9%; --card-foreground: 0 0% 98%;
  --popover: 0 0% 9%; --popover-foreground: 0 0% 98%;
  --muted: 0 0% 14.9%; --muted-foreground: 0 0% 63.9%;
  --accent: 0 0% 14.9%; --accent-foreground: 0 0% 98%;
  --secondary: 0 0% 14.9%; --secondary-foreground: 0 0% 98%;
  --border: 0 0% 100% / 10%; --input: 0 0% 100% / 15%;
  --primary: 159 28% 67%; --primary-foreground: 165 46% 10%; --ring: 159 28% 67%;
}

#app .container.max-w-7xl { max-width: 72rem; padding-left: 1.5rem; padding-right: 1.5rem; }

#app header.border-b { border-bottom: 0; background: transparent; backdrop-filter: none; }
#app header .container { padding-top: 1.5rem; padding-bottom: 1.5rem; }
#app header a { gap: 0.175em; align-items: baseline; font-size: 1.75rem; }
#app header a > div:first-child {
  width: 1.026em; height: 0.5em; transform: translateY(0.01em); background: hsl(var(--primary));
  -webkit-mask: url(/brand/mark.svg) center / contain no-repeat; mask: url(/brand/mark.svg) center / contain no-repeat;
}
#app header a img { visibility: hidden; }
#app header h1 { font-family: "Outfit", system-ui, sans-serif; font-size: 1em; font-weight: 500; letter-spacing: -0.02em; line-height: 1; }

#app main h1 { font-family: "Outfit", system-ui, sans-serif; font-size: 2.25rem; font-weight: 600; letter-spacing: -0.025em; line-height: 1.05; }
@media (min-width: 640px) { #app main h1 { font-size: 3rem; } }
/* Gatus fills in an English subheading when none is set; neither page shows one. */
#app main h1 + p { display: none; }

#app .endpoint { border-radius: 1rem; box-shadow: 0 1px 2px rgb(0 0 0 / 0.04), 0 24px 48px -24px rgb(0 0 0 / 0.25); }
#app .endpoint:hover { transform: none; box-shadow: 0 1px 2px rgb(0 0 0 / 0.06), 0 24px 48px -20px rgb(0 0 0 / 0.3); }

/* Only "Powered by Gatus" and its GitHub link. */
#app footer { display: none; }