/* Local monochrome OLED override. Images and videos are left unfiltered. */
:root {
  --bg: #000;
  --bg-card: #000;
  --border: #242424;
  --border-strong: #525252;
  --text-1: #fff;
  --text-2: #d0d0d0;
  --text-3: #8d8d8d;
  --accent: #fff;
  --accent-8: rgba(255, 255, 255, .08);
  --accent-15: rgba(255, 255, 255, .18);
}

body,
.profile-page,
.sidebar,
.main,
.card,
.repo-tree,
.repo-tree-header,
.repo-tree-loading,
.repo-langs-box,
.cert,
.avatar-img,
.card-image,
.card-video,
.rack-gallery-item {
  background: #000;
}

.defcon-sticker,
.yc-sticker,
.heart-sticker,
.party-sticker {
  display: none !important;
}

.avatar-frame {
  border-color: var(--border-strong);
}

.avatar-bar {
  background: #000;
  border-top: 1px solid var(--border);
  display: grid;
  grid-template-columns: minmax(0, 1.35fr) 1px minmax(0, 1fr) 1px minmax(0, .72fr);
  align-items: stretch;
  overflow: hidden;
  padding: 0;
}

.bar-item,
.bar-item svg {
  color: #fff;
}

.bar-item {
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 6px 5px;
  text-align: center;
  font-size: clamp(.55rem, 1.55vw, .66rem);
  letter-spacing: .7px;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.bar-item svg {
  display: none;
}

.bar-sep {
  background: #ffffff33;
  width: 1px;
  height: auto;
  align-self: stretch;
}

.tag-accent {
  background: #fff;
  color: #000;
}

.repo-langs-segment,
.repo-langs-dot {
  background: #8d8d8d !important;
}

.repo-tree-row:nth-child(2n),
.repo-tree-row:active,
.repo-tree-row:hover,
.cert:hover {
  background: #050505;
}

a,
.role-accent,
.handle,
.sidebar-label,
.section-title svg,
.card-tech svg,
.card-links a,
.card-status,
.repo-tree-title,
.commit-sha,
.repo-tree-folder,
.repo-langs-title {
  color: #fff;
}

.detail-row a {
  color: var(--text-2);
  overflow-wrap: anywhere;
}

.commit-sha {
  background: #000;
  border-color: var(--border-strong);
}

svg:not(.yc-sticker-bg) {
  color: currentColor;
}

@media (max-width: 480px) {
  .avatar-bar {
    grid-template-columns: minmax(0, 1.4fr) 1px minmax(0, 1fr) 1px minmax(0, .62fr);
  }

  .bar-item {
    min-height: 34px;
    padding-inline: 4px;
    font-size: clamp(.5rem, 2.25vw, .6rem);
    letter-spacing: .55px;
  }
}

@media (max-width: 360px) {
  .avatar-bar {
    grid-template-columns: minmax(0, 1fr) 1px minmax(0, .85fr) 1px minmax(0, .45fr);
  }

  .bar-item {
    min-height: 36px;
    padding-inline: 3px;
    font-size: .5rem;
    letter-spacing: .45px;
  }

  .bar-sep {
    display: block;
  }
}