body {
    max-width: 950px;
    margin: 40px auto;
    padding: 0 10px;
    font: 18px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    color: #444
}

h1,h2,h3 {
    line-height: 1.2
}

@media (prefers-color-scheme: dark) {
    body {
        color:#c9d1d9;
        background: #0d1117
    }

    a:link {
        color: #58a6ff
    }

    a:visited {
        color: #8e96f0
    }
}

.layout {
    width: 100%;
  
    display: grid;
    grid:
      "header" auto
      "main" 1fr
      "footer" auto
      / 1fr;
    gap: 8px;
  }
  
  .header { grid-area: header; }
  .main { grid-area: main; }
  .footer { grid-area: footer; }