:root {
      /* Backgrounds */
      --bg-main: #f2f5f8;
      --bg-surface: #ffffff;
      --bg-muted: #e8edf2;

      /* Text */
      --text-primary: #2b2f33;
      --text-secondary: #5f6770;
      --text-muted: #8b949e;

      /* Borders */
      --border-subtle: #d6dde5;

      /* Accents */
      --accent-primary: #8fb6d8;
      --accent-secondary: #a9c7e2;

      /* Dark greys */
      --dark-surface: #2f343a;
      --dark-text: #e6e9ec;
    }

    /* Main body */

    body {
      margin: 0;
      font-family: "Inter", "Segoe UI", system-ui, sans-serif;
      background-color: var(--bg-main);
      color: var(--text-primary);
      line-height: 1.6;
      text-align: center;
      justify-content: center;
      align-items: center;
      padding-top: 60px;
    }

    /* Main centered "container" */

    article {
      max-width: 105ch;   
      margin: auto;
      padding: 2rem;
    }

    /* Table */

    table {
        width: 100%;
    }
    td {
        color: var(--text-secondary);
      text-align: left;
      position: static;
      padding-bottom: 0.9rem;
      margin-bottom: 1.2rem;
    }

    th {
        color: var(--text-primary);
      text-align: left;
      position: static;
      padding-bottom: 0.9rem;
      margin-bottom: 1.2rem;
      text-decoration: underline;
    }
    /* Paragraphs and a href */
    
    p {
      color: var(--text-secondary);
      text-align: center;
      position: static;
      padding-bottom: 0.9rem;
      margin-bottom: 1.2rem;
    }

    a {
      color: var(--text-secondary);
      text-align: left;
      position: static;
      padding-bottom: 0.9rem;
      margin-bottom: 1.2rem;  
    }

    /* Lists */

    ul {
        color: var(--text-secondary);
        display: inline-block;
        text-align: left;
        margin: 0 auto 1.5rem;
        padding-left: 1.4rem;
    }

    ol {
        color: var(--text-secondary);
        display: inline-block;
        text-align: left;
        margin: 0 auto 1.5rem;
        padding-left: 1.4rem;
    }

    img {
        display: block;
        margin: auto;
        width: 50%;
    }


    /* Back Button */

    .back-button {
        position: fixed;
        top: 2rem;
        left: 2rem;

        padding: 0.6rem 1.2rem;
        border-radius: 10px;
        border: 1px solid var(--border-subtle);
        background-color: var(--accent-primary);
        color: #ffffff;

        cursor: pointer;
        font-size: 0.9rem;
        box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
        z-index: 1000;
    }

    .back-button:hover {
        background-color: #5496cf;
    }