@media screen {
  body.team-mode {
    --team-nav: 0px;
    --skills-deep: #245371;
    --skills-paper: #f4f6f5;
    --skills-line: #d4dedc;
    --skills-gold: #d8b84c;
    background: var(--skills-paper);
    font-family: "Montserrat", "Avenir Next", "Helvetica Neue", Arial, sans-serif;
  }

  body.team-mode #teamPanel {
    inset: 0;
    padding: 30px 4.5% 48px;
    background: var(--skills-paper);
    color: #173f43;
    font-family: inherit;
  }

  #teamPanel > header,
  #teamPanelBody {
    max-width: 1500px;
    margin-inline: auto;
  }

  #teamPanel > header {
    margin-bottom: 16px;
  }

  #teamPanelTitle {
    margin: 6px 0 0;
    color: var(--skills-deep);
    font-size: 24px;
    font-weight: 750;
  }

  #teamPanel > header .eyebrow {
    color: #288b92;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 1.7px;
  }

  #teamPanelBody {
    padding: clamp(14px, 2.1vw, 26px);
    background: white;
    border: 1px solid var(--skills-line);
    border-top: 4px solid var(--skills-deep);
  }

  #teamPanel .btn,
  #app #skillsInfraProjects {
    min-height: 40px;
    padding: 8px 14px;
    border: 1px solid var(--skills-line);
    border-radius: 2px;
    background: white;
    color: var(--skills-deep);
    font-family: inherit;
    font-weight: 750;
  }

  #teamPanel .btn.primary,
  .skills-infra-dialog .btn.primary {
    background: var(--skills-gold);
    color: var(--skills-deep);
    border-color: var(--skills-gold);
  }

  #teamPanel .team-actions {
    margin-bottom: 16px;
  }

  #teamPanel .team-actions input,
  #teamPanel .team-form input,
  #teamPanel #newProjectForm input:not([type="radio"]),
  #teamPanel #newProjectForm select {
    border-color: var(--skills-line);
    border-radius: 2px;
    font-family: inherit;
  }

  #teamPanel .team-record,
  #teamPanel #newProjectForm {
    border-color: var(--skills-line);
    border-radius: 0;
    box-shadow: none;
  }

  #teamPanel #newProjectForm h2 {
    color: var(--skills-deep);
  }

  .skills-project-empty {
    border-top: 1px solid var(--skills-line);
    padding: 18px 0 5px;
    color: var(--skills-deep);
  }

  .skills-project-empty p {
    color: #6e7e80;
    margin: 5px 0;
  }

  body.team-mode #app .clean-top {
    background: white;
    color: var(--skills-deep);
    border-bottom: 1px solid var(--skills-line);
  }

  #app .clean-top .project-heading,
  #app .clean-top #topProjectName,
  #app .clean-top #topClient,
  #app .clean-top .top-action {
    color: var(--skills-deep);
  }

  #app .clean-top .top-action:hover {
    background: #eef3f5;
  }

  #app .clean-cad-toolbar {
    background: #f7f9f8;
    border-bottom-color: var(--skills-line);
  }

  #app .status {
    background: var(--skills-deep);
  }
}