/* OnlyShows 0.12.2: restore editorial mobile titles, bespoke line icons and full-history activity. */

:root { --onlyshows-brand: #e45d46; }
html[data-mode="dark"] { --onlyshows-brand: #ff7561; }

.app-line-icon {
  display: block;
  width: 1em;
  height: 1em;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.65;
  stroke-linecap: round;
  stroke-linejoin: round;
  overflow: visible;
}

.profile-activity-years {
  display: flex;
  gap: 18px;
  margin: 12px 0 10px;
  overflow-x: auto;
  scrollbar-width: none;
  overscroll-behavior-inline: contain;
}

.profile-activity-years::-webkit-scrollbar { display: none; }

.profile-activity-years button {
  flex: 0 0 auto;
  padding: 3px 0 6px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--on-surface-variant);
  font: 600 12px/1 var(--font-ui);
}

.profile-activity-years button[aria-selected="true"] {
  border-bottom-color: var(--onlyshows-brand);
  color: var(--on-surface);
}

.profile-activity-frame {
  width: 100%;
  overflow: hidden;
}

.profile-activity-scroll {
  width: 100%;
  overflow-x: auto;
  overflow-y: hidden;
  padding: 2px 0 7px;
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--outline) 55%, transparent) transparent;
  overscroll-behavior-inline: contain;
}

.profile-activity-grid {
  width: max-content;
  min-width: max-content;
  grid-template-rows: repeat(7, 9px);
  grid-auto-columns: 9px;
  gap: 3px;
}

.activity-cell,
.profile-activity-legend i {
  border-radius: 2px;
}

.activity-cell.is-outside { opacity: .16; }

@media (max-width: 719px) {
  body:not(.mobile-database-tab):not(.mobile-profile-tab) .topbar .brand,
  body.mobile-database-tab .mobile-workspace-heading > p,
  body.mobile-profile-tab .profile-dialog.mobile-tab-page .insights-head p,
  body:not(.mobile-database-tab):not(.mobile-profile-tab) .brand .logo-word,
  body:not(.mobile-database-tab):not(.mobile-profile-tab) .brand .logo-dot {
    color: var(--onlyshows-brand) !important;
  }

  body:not(.mobile-database-tab):not(.mobile-profile-tab) .hero h1,
  body.mobile-database-tab .mobile-workspace-heading h2,
  body.mobile-profile-tab .profile-dialog.mobile-tab-page .insights-head h2 {
    font-family: "Noto Serif SC", "Source Han Serif SC", "Songti SC", "STSong", serif !important;
    font-weight: 600 !important;
    letter-spacing: -.045em !important;
  }

  .mobile-tab-indicator .app-line-icon {
    width: 20px;
    height: 20px;
  }

  .mobile-filter-row > button .app-line-icon {
    width: 17px;
    height: 17px;
  }

  .profile-activity-heading {
    align-items: flex-end;
    gap: 10px;
  }

  .profile-activity-heading span {
    max-width: 66%;
    text-align: right;
    line-height: 1.35;
  }

  .profile-activity-frame { padding: 14px 12px 11px; }

  .profile-activity-grid {
    grid-template-rows: repeat(7, 7px);
    grid-auto-columns: 7px;
    gap: 2px;
  }

  .profile-activity-legend { margin-top: 7px; }
  .profile-activity-legend i { width: 9px; height: 9px; }
}