@media screen {
  :root,
  html[data-theme] {
    --bg: #f3f4f6;
    --panel: #fff;
    --panel2: #f7f8fa;
    --text: #17191d;
    --muted: #606873;
    --dim: #606873;
    --line: #dce0e5;
    --line2: #bbc2cb;
    --accent: #ffba26;
    --gold: #ffba26;
    --gold-t: #805300;
    --sans: Arial, sans-serif;
    --mono: Consolas, monospace;
  }
  html {
    font-size: 16px;
  }
  body {
    padding: 0;
    margin: 0;
    background: #f3f4f6;
    color: #17191d;
    font:
      16px/1.45 Arial,
      sans-serif;
  }
  body .blacknav {
    max-width: none;
    margin: 0;
    padding: 16px 24px;
    min-height: 56px;
    gap: 24px;
    align-items: center;
    background: #111;
    color: white;
    font:
      14px/1.5 Arial,
      sans-serif;
  }
  body .blacknav a {
    color: #fff;
    text-decoration: none;
  }
  body .blacknav a[aria-current="page"] {
    color: #ffba26;
  }
  body main,
  body .wrap {
    max-width: 1280px;
    margin: 0 auto;
    padding: 28px 24px;
    width: 100%;
    box-sizing: border-box;
  }
  body > header {
    position: static;
    max-width: 1232px;
    margin: 28px auto 0;
    padding: 0 0 20px;
    background: transparent;
    border-bottom: 1px solid #dce0e5;
    flex-wrap: wrap;
    gap: 14px;
  }
  body .wrap > header {
    padding: 0 0 20px;
    margin: 0 0 20px;
  }
  body h1,
  body header h1 {
    font:
      700 28px/1.2 Arial,
      sans-serif;
    letter-spacing: normal;
    color: #17191d;
    margin: 0 0 8px;
  }
  body h2,
  body .card > h2 {
    font:
      600 18px/1.3 Arial,
      sans-serif;
    text-transform: none;
    letter-spacing: normal;
  }
  body .card,
  body .panel {
    background: white;
    border: 1px solid #dce0e5;
    border-radius: 12px;
    padding: 20px;
    color: #17191d;
  }
  body label,
  body .ctl,
  body .hint,
  body .info,
  body .sub {
    font-size: 14px;
  }
  body input:not([type="checkbox"]):not([type="radio"]):not([type="file"]),
  body select,
  body textarea {
    font:
      16px Arial,
      sans-serif;
    padding: 10px 12px;
    border: 1px solid #bbc2cb;
    border-radius: 7px;
    background: white;
    color: #17191d;
    box-sizing: border-box;
    min-height: 42px;
  }
  body button,
  body .btn {
    font:
      600 14px/1.3 Arial,
      sans-serif;
    padding: 10px 14px;
    border: 1px solid #bbc2cb;
    border-radius: 7px;
    background: #fff;
    color: #17191d;
    min-height: 40px;
  }
  body button.primary,
  body .btn.primary,
  body #printBtn {
    background: #17191d;
    color: white;
    border-color: #17191d;
  }
  body .brand-button {
    min-height: 88px;
    padding: 18px;
    text-align: left;
  }
  body .brand-button[aria-pressed="true"] {
    background: #17191d;
    color: white;
  }
  body .brand-button[aria-pressed="true"] span {
    color: #e8d29e;
  }
  body .brand-button strong {
    font-size: 17px;
  }
  body .shared-hint {
    font:
      14px/1.5 Arial,
      sans-serif;
    color: #606873;
    margin: 8px 0;
  }
  body .cartel {
    background: #fff;
    color: #17191d;
  }
  body .modal {
    background: white;
    color: #17191d;
  }
  @media (max-width: 700px) {
    body main,
    body .wrap {
      padding: 20px 12px;
    }
    body > header {
      margin: 20px 12px 0;
    }
    body h1,
    body header h1 {
      font-size: 23px;
    }
    body .blacknav {
      padding: 14px 12px;
      gap: 12px;
    }
    body .card,
    body .panel {
      padding: 14px;
    }
    body .brand-button {
      padding: 13px;
    }
    body .brand-button strong {
      font-size: 15px;
    }
  }
}
