/* Responsive refinements for phones and narrow desktop windows. */
@media (max-width: 760px) {
  .topbar {
    height: auto;
    min-height: 108px;
    grid-template-columns: 1fr;
    align-content: center;
    gap: 9px;
    padding: 10px 12px;
  }

  .brand {
    justify-self: start;
  }

  .top-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    justify-self: stretch;
    width: 100%;
    max-width: none;
    gap: 7px;
  }

  .top-actions .nav-button {
    justify-content: center;
    min-width: 0;
    min-height: 40px;
    padding: 8px 10px;
    font-size: 14px;
  }

  .toolbar-members,
  .toolbar-exit {
    display: flex !important;
  }

  .toolbar-members span,
  .toolbar-exit span {
    display: inline !important;
  }

  .workspace {
    min-height: calc(100vh - 108px);
  }

  .result-grid figure figcaption {
    gap: 10px;
    padding: 13px 12px;
  }

  .result-grid figure figcaption a[href*="download=1"] {
    font-size: 17px !important;
    padding: 8px 10px;
  }
}

@media (max-width: 430px) {
  .top-actions .nav-button {
    font-size: 13px;
    padding-inline: 8px;
  }

  .result-grid figure figcaption b {
    font-size: 13px;
  }

  .result-grid figure figcaption a[href*="download=1"] {
    font-size: 16px !important;
    padding: 8px 9px;
  }
}