:root {
  --bg-main: #0B0D0C;
  --bg-card: #151A17;
  --bg-card-sub: #1F2622;

  --accent-main: #2E4A3F;
  --accent-sub: #6B8F7A;

  --danger-main: #7A1E1E;
  --danger-bg: rgba(122, 30, 30, 0.15);

  --text-main: #E6E8E5;
  --text-sub: #9FA6A1;
}

body,
.app-body,
.ui {
  background-color: var(--bg-main) !important;
  color: var(--text-main);
}

.column,
.drawer,
.navigation-panel {
  background-color: var(--bg-main) !important;
}

.status,
.status__wrapper,
.detailed-status {
  background-color: var(--bg-card) !important;
  border-left: 3px solid var(--accent-main);
  border-radius: 6px;
  margin-bottom: 8px;
}

.status:hover {
  background-color: var(--bg-card-sub) !important;
}

.status__display-name strong,
.display-name strong {
  color: var(--accent-sub) !important;
  font-weight: 600;
}

.status__display-name span {
  color: var(--text-sub) !important;
}

a {
  color: var(--accent-sub);
}

a:hover {
  color: var(--accent-main);
}

.button,
button,
.compose-form__publish-button {
  background-color: var(--accent-main) !important;
  color: var(--text-main) !important;
  border-radius: 6px;
}

.button:hover {
  background-color: var(--accent-sub) !important;
}

.compose-form {
  background-color: var(--bg-card);
  border: 1px solid var(--accent-main);
}

.compose-form textarea {
  background-color: var(--bg-main);
  color: var(--text-main);
}

.status__content__spoiler-link {
  background-color: var(--bg-card-sub) !important;
  color: var(--accent-sub) !important;
  border: 1px solid var(--accent-main);
  border-radius: 4px;
}

/* NSFW 미디어 가림 */
.media-gallery__item__overlay,
.sensitive {
  background-color: var(--danger-bg) !important;
  color: var(--text-main);
}

.media-gallery__item img,
.video-player {
  border-radius: 6px;
  filter: brightness(0.95);
}

.notification {
  background-color: var(--bg-card);
  border-left: 3px solid var(--accent-main);
}

.notification.unread {
  border-left-color: var(--danger-main);
}

.navigation-panel__link {
  color: var(--text-sub);
}

.navigation-panel__link:hover {
  background-color: var(--bg-card-sub);
  color: var(--accent-sub);
}

::-webkit-scrollbar {
  width: 8px;
}

::-webkit-scrollbar-track {
  background: var(--bg-main);
}

::-webkit-scrollbar-thumb {
  background: var(--accent-main);
  border-radius: 4px;
}