body { 
      font-family: Arial, sans-serif; 
      margin: 0; 
      padding: 0; 
      background: #f9f9f9; 
      color: #222;
    }
    header {
      background: #2d3e50;
      color: #fff;
      padding: 1.5em 1em 1em 1em;
      text-align: center;
      position: relative;
    }
    .navbar {
      background: #1c2836;
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 0.8em;
      padding: 0.8em 0;
      position: sticky;
      top: 0;
      z-index: 100;
      flex-wrap: wrap;
    }
    .navbar a, .navbar button {
      color: #fff;
      background: none;
      border: none;
      font: inherit;
      padding: 0.4em 1.1em;
      border-radius: 3px;
      text-decoration: none;
      cursor: pointer;
      transition: background 0.15s;
      font-size: 1em;
      outline: none;
    }
    .navbar a:hover, .navbar button:hover, .navbar .active {
      background: #466b94;
      text-decoration: underline;
    }
    .navbar .github-btn {
      background: #238636;
      color: #fff;
      margin-left: 1em;
      font-weight: bold;
      border: none;
      transition: background 0.15s;
    }
    .navbar .github-btn:hover {
      background: #2ea043;
    }
    .navbar .dropdown {
      position: relative;
      display: inline-block;
    }
    .navbar .dropbtn {
      background: #2d3e50;
      color: #fff;
      padding: 0.4em 1.1em;
      font-size: 1em;
      border: none;
      border-radius: 3px;
      cursor: pointer;
      transition: background 0.15s;
    }
    .navbar .dropbtn:hover, .navbar .dropbtn:focus {
      background: #466b94;
    }
    .navbar .dropdown-content {
      display: none;
      position: absolute;
      background: #2d3e50;
      min-width: 160px;
      box-shadow: 0 2px 8px rgba(0,0,0,0.15);
      z-index: 1;
      border-radius: 0 0 6px 6px;
      overflow: hidden;
    }
    .navbar .dropdown-content a {
      color: #fff;
      padding: 0.7em 1.1em;
      text-decoration: none;
      display: block;
      border-bottom: 1px solid #233043;
      background: #2d3e50;
      transition: background 0.15s;
    }
    .navbar .dropdown-content a:hover {
      background: #466b94;
    }
    .navbar .dropdown:hover .dropdown-content,
    .navbar .dropdown:focus-within .dropdown-content {
      display: block;
    }
    header h1 {
      margin: 0 0 0.3em 0;
      font-size: 2em;
      letter-spacing: 1px;
    }
    header p {
      margin: 0;
      font-size: 1.1em;
      font-weight: 300;
    }
    main {
      max-width: 780px;
      margin: 2em auto;
      background: #fff;
      border-radius: 6px;
      box-shadow: 0 2px 10px #e0e0e0;
      padding: 2em 1.5em 1.5em 1.5em;
    }
    section {
      margin-bottom: 2.5em;
    }
    h2 {
      margin-top: 0;
      color: #2d3e50;
      border-bottom: 1px solid #eee;
      padding-bottom: 0.3em;
      font-size: 1.3em;
    }
    ul, ol {
      margin: 0.5em 0 0.5em 1.5em;
    }
    .downloads {
      margin-bottom: 0.4em;
    }
    .downloads a, .downloads button {
      display: inline-block;
      margin: 0.3em 0.6em 0.3em 0;
      padding: 0.4em 1.2em;
      background: #2d3e50;
      color: #fff;
      border-radius: 3px;
      border: none;
      text-decoration: none;
      font-size: 1em;
      cursor: pointer;
      transition: background 0.15s;
    }
    .downloads a:hover, .downloads button:hover {
      background: #466b94;
    }
    .downloads select {
      padding: 0.35em 1em;
      margin-right: 0.7em;
      font-size: 1em;
      border-radius: 3px;
      border: 1px solid #bbb;
      background: #f4f4f4;
      color: #222;
    }
    table {
      border-collapse: collapse;
      width: 100%;
      margin-top: 0.5em;
    }
    th, td {
      border: 1px solid #eaeaea;
      padding: 0.5em 0.7em;
      text-align: left;
    }
    th {
      background: #f3f3f3;
    }
    .quick-links {
      margin: 1.2em 0 1.2em 0;
      display: flex;
      flex-wrap: wrap;
      gap: 0.8em;
    }
    .quick-links a {
      color: #fff;
      background: #466b94;
      border-radius: 3px;
      text-decoration: none;
      padding: 0.4em 1.1em;
      font-size: 1em;
      transition: background 0.15s;
    }
    .quick-links a:hover {
      background: #2d3e50;
    }
    .step-card {
      background: #f6f8fa;
      border-radius: 4px;
      padding: 0.8em 1em;
      margin-bottom: 0.6em;
      border-left: 4px solid #2d3e50;
    }
    .external-links {
      margin-top: 1.2em;
    }
    .external-links a {
      color: #238636;
      text-decoration: underline;
      margin-right: 1.2em;
      font-size: 1em;
    }
    @media (max-width: 600px) {
      main { padding: 1em 0.5em; }
      table, th, td { font-size: 0.97em; }
      .navbar { flex-direction: column; gap: 0.2em; }
      .quick-links { flex-direction: column; }
    }
    footer {
      background: #2d3e50;
      color: #eee;
      text-align: center;
      font-size: 1em;
      padding: 2em 1em 1em 1em;
      border-top: 3px solid #466b94;
      margin-top: 4em;
    }
    .footer-links {
      margin: 0.5em 0 1em 0;
      font-size: 0.98em;
    }
    .footer-links a {
      color: #fff;
      margin: 0 0.7em;
      text-decoration: underline;
      transition: color 0.15s;
    }
    .footer-links a:hover {
      color: #9cdcfe;
    }
    .footer-credit {
      font-size: 0.95em;
      margin-top: 1em;
      color: #ccc;
    }
    .footer-social {
      margin-top: 1em;
    }
    .footer-social a {
      margin: 0 0.4em;
      color: #fff;
      font-size: 1.2em;
    }