.gist {
  filter: invert(100%) hue-rotate(180deg) brightness(110%) !important;
}

.gist .blob-code, 
.gist .blob-num {
  font-family: "IBM Plex Mono", "Fira Code", Consolas, "Lucida Console", monospace !important;
  font-size: 16px !important;
}

.gist .gist-meta {
  font-family: system-ui, "IBM Plex Sans", "Segoe UI", Monaco, "Bitstream Vera Sans Mono", "Lucida Console", Terminal, monospace !important;
}

.gist .gist-file {
  position: relative;
}

.gist-copy-btn {
  filter: invert(100%) hue-rotate(180deg);

  position: absolute;
  top: 10px;
  right: 10px;
  z-index: 20;

  font-size: 12px;
  line-height: 1;
  padding: 6px 10px;

  border: 1px solid var(--green);
  border-radius: 4px;

  background: rgba(0, 0, 0, 0.35);
  color: var(--text-light);

  cursor: pointer;
  opacity: 0.75;
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.gist-copy-btn:hover {
  opacity: 1;
  transform: translateY(-1px);
}

.gist-copy-btn:disabled {
  cursor: default;
  opacity: 0.6;
  transform: none;
}

.gist .gist-copy-btn {
  opacity: 0;
  pointer-events: none;
}

.gist:hover .gist-copy-btn {
  opacity: 1;
  pointer-events: auto;
}

@media (max-width: 600px) {
  .gist .blob-code,
  .gist .blob-num {
    font-size: 13px !important;
  }

  .gist-copy-btn {
    padding: 4px 8px;
    font-size: 11px;
    top: 6px;
    right: 6px;
  }
}

@media (max-width: 400px) {
  .gist .blob-code,
  .gist .blob-num {
    font-size: 12px !important;
  }
}
