/* Dark theme page-level overrides.
   Keep classic as the baseline; add future themes under their own data-theme blocks. */

:root[data-theme="midnight"] {
  color-scheme: dark;

  --bg-main: #172b3d;
  --panel: #1b3144;
  --border: #43657f;
  --primary: #79b8e0;
  --primary-dark: #d7edf9;
  --accent: #f4c950;
  --text: #e9f1f8;
  --muted-text: #b9cad8;
  --form-control-accent: #79b8e0;
  --form-control-accent-strong: #9fd0ff;
  --form-control-bg: #101d2a;
  --form-control-border: #5f86a3;

  --button-bg: linear-gradient(#26384a, #1b2b3a);
  --button-hover-bg: linear-gradient(#31516a, #254259);
  --button-active-bg: linear-gradient(#20374b, #172838);
  --button-border: #456176;
  --button-hover-border: #79b8e0;
  --button-text: #d8ecf8;
  --button-hover-text: #ffffff;
  --button-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 2px 5px rgba(0,0,0,0.34);
  --button-hover-shadow: inset 0 1px 0 rgba(255,255,255,0.1), 0 3px 8px rgba(0,0,0,0.38);
  --button-active-shadow: inset 0 1px 2px rgba(0,0,0,0.42), 0 1px 3px rgba(0,0,0,0.34);
}

:root[data-theme="midnight"] input[type="checkbox"],
:root[data-theme="midnight"] input[type="radio"] {
  -webkit-appearance: none;
  appearance: none;
  box-sizing: border-box;
  display: inline-grid;
  place-content: center;
  flex: 0 0 auto;
  width: 18px;
  height: 18px;
  margin: 0;
  /* Generic form-input padding rules (e.g. filter modal inputs) would otherwise
     inflate the custom control beyond its 18px box. */
  padding: 0 !important;
  background: var(--form-control-bg);
  border: 2px solid var(--form-control-border);
  accent-color: var(--form-control-accent);
  box-shadow:
    inset 0 1px 1px rgba(0,0,0,0.45),
    0 1px 0 rgba(255,255,255,0.08);
}

:root[data-theme="midnight"] input[type="radio"] {
  border-radius: 50%;
}

:root[data-theme="midnight"] input[type="checkbox"] {
  border-radius: 4px;
}

:root[data-theme="midnight"] input[type="checkbox"]::before,
:root[data-theme="midnight"] input[type="radio"]::before {
  content: "";
  transform: scale(0);
  transition: transform 0.08s ease;
}

:root[data-theme="midnight"] input[type="radio"]::before {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--form-control-accent-strong);
  box-shadow: 0 0 8px rgba(121, 184, 224, 0.55);
}

:root[data-theme="midnight"] input[type="checkbox"]::before {
  width: 10px;
  height: 6px;
  margin-top: -2px;
  border-left: 3px solid var(--form-control-accent-strong);
  border-bottom: 3px solid var(--form-control-accent-strong);
  transform: rotate(-45deg) scale(0);
  transform-origin: center;
}

:root[data-theme="midnight"] input[type="checkbox"]:checked,
:root[data-theme="midnight"] input[type="radio"]:checked {
  background: #152a3b;
  border-color: var(--form-control-accent);
  box-shadow:
    inset 0 0 0 2px rgba(121, 184, 224, 0.12),
    0 0 0 1px rgba(159, 208, 255, 0.26),
    0 0 10px rgba(121, 184, 224, 0.24);
}

:root[data-theme="midnight"] input[type="checkbox"]:checked {
  background-color: var(--form-control-accent) !important;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2018%2018'%3E%3Cpath%20d='M4%209.4l3.1%203.1L14.2%205.4'%20fill='none'%20stroke='%23ffffff'%20stroke-width='3.2'%20stroke-linecap='round'%20stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
  background-size: 16px 16px !important;
  border-color: #9fd0ff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.16);
}

:root[data-theme="midnight"] input[type="checkbox"]:checked::before,
:root[data-theme="midnight"] input[type="radio"]:checked::before {
  transform: scale(1);
}

:root[data-theme="midnight"] input[type="checkbox"]:checked::before {
  content: none;
  border-color: #081724;
  transform: none;
}

:root[data-theme="midnight"] input[type="checkbox"]:focus-visible,
:root[data-theme="midnight"] input[type="radio"]:focus-visible {
  outline: 2px solid var(--form-control-accent-strong);
  outline-offset: 3px;
}

:root[data-theme="midnight"] input[type="checkbox"]:disabled,
:root[data-theme="midnight"] input[type="radio"]:disabled {
  opacity: 0.45;
}

:root[data-theme="midnight"],
:root[data-theme="midnight"] body {
  background: #0b1118;
}

:root[data-theme="midnight"] body {
  background-image: linear-gradient(135deg, #0f1720, #1d3142);
  color: var(--text);
}

:root[data-theme="midnight"] .header,
:root[data-theme="midnight"] .nav-wrapper {
  background: linear-gradient(#243446, #172432) !important;
  border-color: var(--border) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 2px 8px rgba(0,0,0,0.38) !important;
}

:root[data-theme="midnight"] .logo-text,
:root[data-theme="midnight"] .header-nav a,
:root[data-theme="midnight"] .edit-profile-title,
:root[data-theme="midnight"] .edit-subtitle,
:root[data-theme="midnight"] .text h1,
:root[data-theme="midnight"] .text h2 {
  color: var(--primary-dark) !important;
  text-shadow: none;
}

:root[data-theme="midnight"] .logo-circle {
  border-color: #5d7890 !important;
  background-color: #172432 !important;
}

:root[data-theme="midnight"] .nav-icon,
:root[data-theme="midnight"] .dropdown-icon,
:root[data-theme="midnight"] .notification-bell-icon,
:root[data-theme="midnight"] img[src$=".svg"] {
  filter: brightness(0) saturate(100%) invert(91%) sepia(13%) saturate(745%) hue-rotate(166deg) brightness(100%) contrast(93%);
  opacity: 0.95;
}

:root[data-theme="midnight"] .notification-bell {
  color: #eef7ff !important;
}

:root[data-theme="midnight"] .page-wrapper,
:root[data-theme="midnight"] .auth-wrapper {
  background: #172b3d !important;
  border-color: var(--border) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 8px 24px rgba(0,0,0,0.34) !important;
}

:root[data-theme="midnight"] .box,
:root[data-theme="midnight"] .edit-panel {
  background: linear-gradient(#1c2b3b, #152231) !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 4px 13px rgba(0,0,0,0.34) !important;
}

:root[data-theme="midnight"] .box::before,
:root[data-theme="midnight"] .footer::before {
  background: linear-gradient(to right, #79b8e0, #405f78) !important;
}

:root[data-theme="midnight"] .edit-tabs {
  border-bottom-color: rgba(185, 202, 216, 0.28) !important;
}

:root[data-theme="midnight"] .edit-tab {
  color: var(--muted-text) !important;
}

:root[data-theme="midnight"] .edit-tab:hover,
:root[data-theme="midnight"] .edit-tab.active {
  color: #eef7ff !important;
}

:root[data-theme="midnight"] .edit-tab.active::after {
  background: var(--primary) !important;
}

:root[data-theme="midnight"] .footer,
:root[data-theme="midnight"] .footer-section,
:root[data-theme="midnight"] .footer-bottom {
  background: #0b1118 !important;
  color: #f2f8fc !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .footer {
  background: #172432 !important;
}

:root[data-theme="midnight"] .footer-bottom {
  background: #0b1118 !important;
  box-shadow: 0 100vh 0 100vh #0b1118 !important;
}

:root[data-theme="midnight"] .footer a,
:root[data-theme="midnight"] .footer strong {
  color: #f2f8fc !important;
}

:root[data-theme="midnight"] .subnav a,
:root[data-theme="midnight"] .main-btn,
:root[data-theme="midnight"] .control-btn,
:root[data-theme="midnight"] .edit-save-btn,
:root[data-theme="midnight"] .staff-button,
:root[data-theme="midnight"] .levels-button,
:root[data-theme="midnight"] .level-action,
:root[data-theme="midnight"] .level-form button,
:root[data-theme="midnight"] .copy-code-btn,
:root[data-theme="midnight"] .notification-btn,
:root[data-theme="midnight"] .play-btn,
:root[data-theme="midnight"] .version-btn,
:root[data-theme="midnight"] .pagination button,
:root[data-theme="midnight"] .levels-pagination button,
:root[data-theme="midnight"] .staff-pagination .page-button,
:root[data-theme="midnight"] .not-found-actions a {
  background: var(--button-bg) !important;
  border-color: var(--button-border) !important;
  color: var(--button-text) !important;
  box-shadow: var(--button-shadow) !important;
}

:root[data-theme="midnight"] .subnav a:hover,
:root[data-theme="midnight"] .main-btn:not(:disabled):hover,
:root[data-theme="midnight"] .control-btn:not(:disabled):hover,
:root[data-theme="midnight"] .edit-save-btn:not(:disabled):hover,
:root[data-theme="midnight"] .staff-button:not(:disabled):hover,
:root[data-theme="midnight"] .levels-button:not(:disabled):hover,
:root[data-theme="midnight"] .level-action:not(:disabled):hover,
:root[data-theme="midnight"] .not-found-actions a:hover,
:root[data-theme="midnight"] .not-found-actions a:focus-visible {
  background: var(--button-hover-bg) !important;
  border-color: var(--button-hover-border) !important;
  color: var(--button-hover-text) !important;
  box-shadow: var(--button-hover-shadow) !important;
}

:root[data-theme="midnight"] .dropdown {
  background: linear-gradient(#1d2d3d, #152331) !important;
  border-color: var(--border) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 8px 20px rgba(0,0,0,0.42) !important;
}

:root[data-theme="midnight"] .dropdown a {
  background: transparent !important;
  color: var(--primary-dark) !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .dropdown a:hover,
:root[data-theme="midnight"] .user-trigger:hover,
:root[data-theme="midnight"] .user-menu.open .user-trigger {
  background: rgba(121, 184, 224, 0.13) !important;
  color: #ffffff !important;
}

:root[data-theme="midnight"] .dropdown a + a,
:root[data-theme="midnight"] .dropdown-divider {
  border-color: rgba(196, 222, 240, 0.12) !important;
}

:root[data-theme="midnight"] .settings-input,
:root[data-theme="midnight"] .settings-row,
:root[data-theme="midnight"] .settings-copy,
:root[data-theme="midnight"] .settings-radio-group,
:root[data-theme="midnight"] .settings-preview,
:root[data-theme="midnight"] .settings-theme-card,
:root[data-theme="midnight"] .auth-card,
:root[data-theme="midnight"] .auth-panel,
:root[data-theme="midnight"] .announcement-card,
:root[data-theme="midnight"] .announcement-form,
:root[data-theme="midnight"] .game-card,
:root[data-theme="midnight"] .game-info-card,
:root[data-theme="midnight"] .games-filter-panel,
:root[data-theme="midnight"] .profile-panel,
:root[data-theme="midnight"] .profile-section,
:root[data-theme="midnight"] .profile-comment,
:root[data-theme="midnight"] .comment-card,
:root[data-theme="midnight"] .reply-card,
:root[data-theme="midnight"] .member-card,
:root[data-theme="midnight"] .members-filter-panel,
:root[data-theme="midnight"] .staff-card,
:root[data-theme="midnight"] .staff-panel,
:root[data-theme="midnight"] .legacy-card,
:root[data-theme="midnight"] .level-card,
:root[data-theme="midnight"] .level-panel,
:root[data-theme="midnight"] .level-form-section,
:root[data-theme="midnight"] .level-detail-card,
:root[data-theme="midnight"] .level-comment,
:root[data-theme="midnight"] .rate-entry,
:root[data-theme="midnight"] .feature-entry,
:root[data-theme="midnight"] .bbcode-help,
:root[data-theme="midnight"] .bbcode-panel {
  background: linear-gradient(#1c2b3b, #152231);
  border-color: var(--border);
  color: var(--text);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 3px 10px rgba(0,0,0,0.28);
}

:root[data-theme="midnight"] .settings-row-copy strong,
:root[data-theme="midnight"] .settings-field label,
:root[data-theme="midnight"] .settings-radio-group legend,
:root[data-theme="midnight"] .settings-preview span,
:root[data-theme="midnight"] .settings-theme-copy strong {
  color: var(--primary-dark) !important;
}

:root[data-theme="midnight"] .settings-theme-card-shell,
:root[data-theme="midnight"] .settings-theme-panel,
:root[data-theme="midnight"] .settings-theme-side {
  box-shadow: none;
}

:root[data-theme="midnight"] .settings-row-copy span,
:root[data-theme="midnight"] .settings-meta,
:root[data-theme="midnight"] .announcement-meta,
:root[data-theme="midnight"] .game-meta,
:root[data-theme="midnight"] .profile-meta,
:root[data-theme="midnight"] .profile-muted,
:root[data-theme="midnight"] .comment-meta,
:root[data-theme="midnight"] .reply-meta,
:root[data-theme="midnight"] .member-meta,
:root[data-theme="midnight"] .staff-meta,
:root[data-theme="midnight"] .legacy-meta,
:root[data-theme="midnight"] .level-meta,
:root[data-theme="midnight"] .level-card-meta,
:root[data-theme="midnight"] .level-list-meta,
:root[data-theme="midnight"] .level-detail-meta,
:root[data-theme="midnight"] .rate-entry-meta,
:root[data-theme="midnight"] .feature-entry-date {
  color: var(--muted-text) !important;
}

:root[data-theme="midnight"] input,
:root[data-theme="midnight"] textarea,
:root[data-theme="midnight"] select,
:root[data-theme="midnight"] [contenteditable="true"],
:root[data-theme="midnight"] .auth input,
:root[data-theme="midnight"] .auth textarea,
:root[data-theme="midnight"] .settings-input,
:root[data-theme="midnight"] .announcement-form input,
:root[data-theme="midnight"] .announcement-form textarea,
:root[data-theme="midnight"] .profile-form input,
:root[data-theme="midnight"] .profile-form textarea,
:root[data-theme="midnight"] .profile-form select,
:root[data-theme="midnight"] .level-form input,
:root[data-theme="midnight"] .level-form textarea,
:root[data-theme="midnight"] .level-form select,
:root[data-theme="midnight"] .levels-search-input,
:root[data-theme="midnight"] .levels-filter-input,
:root[data-theme="midnight"] .members-search-input,
:root[data-theme="midnight"] .staff-input,
:root[data-theme="midnight"] .staff-select {
  background: #101924 !important;
  border-color: var(--border) !important;
  color: var(--text) !important;
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.3);
}

:root[data-theme="midnight"] input::placeholder,
:root[data-theme="midnight"] textarea::placeholder {
  color: #9fb2c2 !important;
}

:root[data-theme="midnight"] .levels-table,
:root[data-theme="midnight"] .levels-list,
:root[data-theme="midnight"] .members-list,
:root[data-theme="midnight"] .staff-table,
:root[data-theme="midnight"] .legacy-table {
  color: var(--text);
}

:root[data-theme="midnight"] .levels-table th,
:root[data-theme="midnight"] .levels-list-header,
:root[data-theme="midnight"] .members-list-header,
:root[data-theme="midnight"] .staff-table th,
:root[data-theme="midnight"] .legacy-table th {
  background: linear-gradient(#223549, #182838);
  border-color: var(--border);
  color: var(--primary-dark);
}

:root[data-theme="midnight"] .levels-table td,
:root[data-theme="midnight"] .levels-list-row,
:root[data-theme="midnight"] .members-list-row,
:root[data-theme="midnight"] .staff-table td,
:root[data-theme="midnight"] .legacy-table td {
  border-color: rgba(196, 222, 240, 0.14);
}

:root[data-theme="midnight"] .bbcode-quote,
:root[data-theme="midnight"] blockquote {
  background: linear-gradient(#172637, #121f2d);
  border-color: #456176;
  color: var(--text);
}

:root[data-theme="midnight"] .bbcode-code,
:root[data-theme="midnight"] pre,
:root[data-theme="midnight"] code {
  background: #090f15;
  color: #eef7ff;
}

:root[data-theme="midnight"] .help-modal-content,
:root[data-theme="midnight"] .level-modal-content,
:root[data-theme="midnight"] .moderation-modal-content,
:root[data-theme="midnight"] .image-modal-content,
:root[data-theme="midnight"] .profile-rates-modal-scope .help-modal-content {
  background: linear-gradient(#1c2b3b, #152231);
  border-color: var(--border);
  color: var(--text);
}

:root[data-theme="midnight"] .help-header,
:root[data-theme="midnight"] .level-rates-modal-header,
:root[data-theme="midnight"] .moderation-modal-header {
  background: linear-gradient(#34556e, #213a50);
  color: #ffffff;
}

:root[data-theme="midnight"] .danger,
:root[data-theme="midnight"] .error,
:root[data-theme="midnight"] .settings-error {
  color: #ff9d9d;
}

:root[data-theme="midnight"] .success,
:root[data-theme="midnight"] .settings-success {
  color: #9ee6aa;
}

/* Dark theme role contrast. Many role colors are emitted inline, so these
   targeted overrides keep names and avatar borders readable without changing
   the classic theme. */
:root[data-theme="midnight"] [style*="#414141"],
:root[data-theme="midnight"] [style*="#111"],
:root[data-theme="midnight"] [style*="rgb(65, 65, 65)"] {
  color: #f2f8fc !important;
  border-color: #f2f8fc !important;
  --role-color: #f2f8fc !important;
}

:root[data-theme="midnight"] [style*="--role-color:#414141"],
:root[data-theme="midnight"] [style*="--role-color: #414141"],
:root[data-theme="midnight"] [style*="--role-color:#fff"],
:root[data-theme="midnight"] [style*="--role-color: #fff"] {
  --role-color: #f2f8fc !important;
}

:root[data-theme="midnight"] [style*="#555f68"],
:root[data-theme="midnight"] [style*="#9aa3ad"] {
  color: #b9c8d6 !important;
  --role-color: #b9c8d6 !important;
}

:root[data-theme="midnight"] [style*="#555f68"] {
  color: #9eafbf !important;
  --role-color: #9eafbf !important;
}

:root[data-theme="midnight"] [style*="#4f7180"] {
  color: #7fa6c1 !important;
  --role-color: #7fa6c1 !important;
}

:root[data-theme="midnight"] [style*="#861717"] {
  color: #ff9898 !important;
  --role-color: #ff9898 !important;
}

:root[data-theme="midnight"] [style*="#008000"] {
  color: #8cf59d !important;
  --role-color: #8cf59d !important;
}

:root[data-theme="midnight"] [style*="#0066FF"],
:root[data-theme="midnight"] [style*="#0066ff"] {
  color: #42cfff !important;
  --role-color: #42cfff !important;
}

:root[data-theme="midnight"] [style*="#990099"] {
  color: #f18cff !important;
  --role-color: #f18cff !important;
}

:root[data-theme="midnight"] [style*="#c2185b"] {
  color: #ff8db6 !important;
  --role-color: #ff8db6 !important;
}

:root[data-theme="midnight"] [style*="#FF9900"],
:root[data-theme="midnight"] [style*="#ff9900"] {
  color: #ffd47f !important;
  --role-color: #ffd47f !important;
}

/* Wider page-specific dark coverage for legacy light panels. */
:root[data-theme="midnight"] .notification-toolbar,
:root[data-theme="midnight"] .notification-item,
:root[data-theme="midnight"] .notification-item.unread,
:root[data-theme="midnight"] .member-row,
:root[data-theme="midnight"] .members-list-columns,
:root[data-theme="midnight"] .member-dashboard .member-panel,
:root[data-theme="midnight"] .online-members-list,
:root[data-theme="midnight"] .tip-item,
:root[data-theme="midnight"] .dashboard-list-item,
:root[data-theme="midnight"] .profile-summary,
:root[data-theme="midnight"] .profile-about,
:root[data-theme="midnight"] .profile-info-card,
:root[data-theme="midnight"] .profile-stats-card,
:root[data-theme="midnight"] .profile-connected-accounts,
:root[data-theme="midnight"] .profile-music-card,
:root[data-theme="midnight"] .comment-form,
:root[data-theme="midnight"] .comment-composer,
:root[data-theme="midnight"] .comments-form,
:root[data-theme="midnight"] .profile-comment-box,
:root[data-theme="midnight"] .description-preview,
:root[data-theme="midnight"] .description-preview-body,
:root[data-theme="midnight"] .bbcode-guide,
:root[data-theme="midnight"] .bbcode-option,
:root[data-theme="midnight"] .music-input-panel,
:root[data-theme="midnight"] .music-preview,
:root[data-theme="midnight"] .music-source-note,
:root[data-theme="midnight"] .level-source-picker,
:root[data-theme="midnight"] .level-source-columns,
:root[data-theme="midnight"] .level-source-card,
:root[data-theme="midnight"] .level-source-row,
:root[data-theme="midnight"] .level-list-card,
:root[data-theme="midnight"] .level-list-row,
:root[data-theme="midnight"] .level-detail-page .level-column-panel,
:root[data-theme="midnight"] .level-detail-page .level-code-section,
:root[data-theme="midnight"] .level-detail-page .level-author-section,
:root[data-theme="midnight"] .level-detail-page .level-rate-section,
:root[data-theme="midnight"] .level-detail-page .level-info-section,
:root[data-theme="midnight"] .level-detail-page .level-description-section,
:root[data-theme="midnight"] .level-detail-page .level-description,
:root[data-theme="midnight"] .level-detail-page .level-comment-form,
:root[data-theme="midnight"] .level-detail-page .level-comment-composer,
:root[data-theme="midnight"] .level-detail-page .level-comment,
:root[data-theme="midnight"] .level-detail-page .reply,
:root[data-theme="midnight"] .level-section,
:root[data-theme="midnight"] .level-stat,
:root[data-theme="midnight"] .comment-card,
:root[data-theme="midnight"] .reply,
:root[data-theme="midnight"] .thread-reply-form,
:root[data-theme="midnight"] .level-modal-content,
:root[data-theme="midnight"] .rates-list,
:root[data-theme="midnight"] .rate-entry {
  background: linear-gradient(#1b2a39, #142231) !important;
  border-color: #385269 !important;
  color: var(--text) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    0 3px 10px rgba(0,0,0,0.24) !important;
}

:root[data-theme="midnight"] .notification-item:hover,
:root[data-theme="midnight"] .member-row:hover,
:root[data-theme="midnight"] .level-list-row:hover,
:root[data-theme="midnight"] .level-list-card:hover,
:root[data-theme="midnight"] .bbcode-option:hover,
:root[data-theme="midnight"] .tip-item:hover,
:root[data-theme="midnight"] .dashboard-list-item:hover {
  background: linear-gradient(#22364a, #192a3b) !important;
  border-color: #4e7391 !important;
}

:root[data-theme="midnight"] .notification-toolbar,
:root[data-theme="midnight"] .members-list-columns,
:root[data-theme="midnight"] .level-source-columns {
  background: rgba(121, 184, 224, 0.08) !important;
}

:root[data-theme="midnight"] .notification-message,
:root[data-theme="midnight"] .custom-notification-text,
:root[data-theme="midnight"] .notification-static,
:root[data-theme="midnight"] .notification-link,
:root[data-theme="midnight"] .member-name,
:root[data-theme="midnight"] .member-role,
:root[data-theme="midnight"] .member-stat-value,
:root[data-theme="midnight"] .profile-description,
:root[data-theme="midnight"] .profile-description *,
:root[data-theme="midnight"] .profile-info-card,
:root[data-theme="midnight"] .profile-info-card *,
:root[data-theme="midnight"] .profile-stats-card,
:root[data-theme="midnight"] .profile-stats-card *,
:root[data-theme="midnight"] .profile-connected-accounts,
:root[data-theme="midnight"] .profile-connected-accounts *,
:root[data-theme="midnight"] .profile-comment,
:root[data-theme="midnight"] .profile-comment *,
:root[data-theme="midnight"] .level-detail-page,
:root[data-theme="midnight"] .level-detail-page p,
:root[data-theme="midnight"] .level-detail-page li,
:root[data-theme="midnight"] .level-detail-page span,
:root[data-theme="midnight"] .level-description,
:root[data-theme="midnight"] .level-description *,
:root[data-theme="midnight"] .reply-body,
:root[data-theme="midnight"] .bbcode-guide,
:root[data-theme="midnight"] .bbcode-guide *,
:root[data-theme="midnight"] .dashboard-list-item,
:root[data-theme="midnight"] .dashboard-list-item *,
:root[data-theme="midnight"] .tip-item,
:root[data-theme="midnight"] .tip-item * {
  color: var(--text) !important;
}

:root[data-theme="midnight"] .notification-date,
:root[data-theme="midnight"] .notification-count span,
:root[data-theme="midnight"] .notification-field-label,
:root[data-theme="midnight"] .member-date,
:root[data-theme="midnight"] .member-user-id,
:root[data-theme="midnight"] .member-name-aliases,
:root[data-theme="midnight"] .members-list-columns,
:root[data-theme="midnight"] .profile-meta-row,
:root[data-theme="midnight"] .profile-stat-label,
:root[data-theme="midnight"] .profile-stat-value,
:root[data-theme="midnight"] .level-source-card p,
:root[data-theme="midnight"] .level-list-meta,
:root[data-theme="midnight"] .level-card-meta,
:root[data-theme="midnight"] .level-stat span,
:root[data-theme="midnight"] .level-info-line,
:root[data-theme="midnight"] .level-info-line *,
:root[data-theme="midnight"] .reply-footer,
:root[data-theme="midnight"] .comment-footer,
:root[data-theme="midnight"] .comment-date,
:root[data-theme="midnight"] .rate-entry span {
  color: var(--muted-text) !important;
}

:root[data-theme="midnight"] .notification-count strong,
:root[data-theme="midnight"] .notification-target-name,
:root[data-theme="midnight"] .notification-sender,
:root[data-theme="midnight"] .level-source-card h2,
:root[data-theme="midnight"] .level-source-card strong,
:root[data-theme="midnight"] .level-section h2,
:root[data-theme="midnight"] .level-section-heading h2,
:root[data-theme="midnight"] .level-stat strong,
:root[data-theme="midnight"] .level-detail-title,
:root[data-theme="midnight"] .level-section-title,
:root[data-theme="midnight"] .level-card-title,
:root[data-theme="midnight"] .level-row-title,
:root[data-theme="midnight"] .profile-card h1,
:root[data-theme="midnight"] .profile-card h2,
:root[data-theme="midnight"] .profile-card h3,
:root[data-theme="midnight"] .member-panel-heading h2,
:root[data-theme="midnight"] .notifications-header h1 {
  color: #f3f9ff !important;
}

:root[data-theme="midnight"] .level-code,
:root[data-theme="midnight"] #profile-description,
:root[data-theme="midnight"] .description-workspace #profile-description,
:root[data-theme="midnight"] .level-form textarea,
:root[data-theme="midnight"] .level-form select,
:root[data-theme="midnight"] .thread-reply-form textarea,
:root[data-theme="midnight"] .edit-textarea,
:root[data-theme="midnight"] .music-url-input,
:root[data-theme="midnight"] .background-select-input {
  background: #0d1722 !important;
  border-color: #385269 !important;
  color: #f4f9ff !important;
}

:root[data-theme="midnight"] .bbcode-source,
:root[data-theme="midnight"] .level-code,
:root[data-theme="midnight"] pre,
:root[data-theme="midnight"] code {
  background: #071019 !important;
  color: #f6fbff !important;
}

:root[data-theme="midnight"] .level-info-line,
:root[data-theme="midnight"] .profile-info-card li,
:root[data-theme="midnight"] .profile-meta-row,
:root[data-theme="midnight"] .notification-item + .notification-item,
:root[data-theme="midnight"] .member-row,
:root[data-theme="midnight"] .level-list-row,
:root[data-theme="midnight"] .comment-thread {
  border-color: rgba(196, 222, 240, 0.16) !important;
}

:root[data-theme="midnight"] .level-visibility-badge,
:root[data-theme="midnight"] .level-state-badge,
:root[data-theme="midnight"] .status-pill,
:root[data-theme="midnight"] .role-pill {
  background: rgba(49, 75, 95, 0.56) !important;
  border-color: rgba(127, 166, 193, 0.44) !important;
  color: #d4e8f5 !important;
}

:root[data-theme="midnight"] .level-visibility-badge.private {
  background: rgba(244, 201, 80, 0.16) !important;
  border-color: rgba(244, 201, 80, 0.46) !important;
  color: #ffe29a !important;
}

:root[data-theme="midnight"] .level-visibility-badge.deleted,
:root[data-theme="midnight"] .level-state-badge.deleted,
:root[data-theme="midnight"] .deleted-comment {
  background: rgba(255, 120, 120, 0.12) !important;
  border-color: rgba(255, 120, 120, 0.36) !important;
  color: #ffb7b7 !important;
}

:root[data-theme="midnight"] .level-row-featured,
:root[data-theme="midnight"] .featured-level,
:root[data-theme="midnight"] .pinned-comment {
  background: rgba(244, 201, 80, 0.1) !important;
  border-color: rgba(244, 201, 80, 0.36) !important;
}

:root[data-theme="midnight"] .profile-user-block,
:root[data-theme="midnight"] .profile-banner-controls,
:root[data-theme="midnight"] .profile-legacy-actions {
  background: rgba(13, 23, 34, 0.78) !important;
  border-color: rgba(196, 222, 240, 0.18) !important;
  color: #ffffff !important;
}

:root[data-theme="midnight"] .profile-banner,
:root[data-theme="midnight"] .profile-banner-inner,
:root[data-theme="midnight"] .level-thumbnail-placeholder,
:root[data-theme="midnight"] .level-detail-thumb,
:root[data-theme="midnight"] .level-thumbnail {
  border-color: #385269 !important;
}

/* Final role-color pass. Keep after broad text normalization. */
:root[data-theme="midnight"] [style*="color: #414141"],
:root[data-theme="midnight"] [style*="color:#414141"],
:root[data-theme="midnight"] [style*="color: rgb(65, 65, 65)"],
:root[data-theme="midnight"] [style*="--role-color:#414141"],
:root[data-theme="midnight"] [style*="--role-color: #414141"] {
  color: #f2f8fc !important;
  --role-color: #f2f8fc !important;
}

:root[data-theme="midnight"] [style*="color: #990099"],
:root[data-theme="midnight"] [style*="color:#990099"],
:root[data-theme="midnight"] [style*="--role-color:#990099"],
:root[data-theme="midnight"] [style*="--role-color: #990099"] {
  color: #f18cff !important;
  --role-color: #f18cff !important;
}

:root[data-theme="midnight"] [style*="color: #FF9900"],
:root[data-theme="midnight"] [style*="color:#FF9900"],
:root[data-theme="midnight"] [style*="color: #ff9900"],
:root[data-theme="midnight"] [style*="color:#ff9900"],
:root[data-theme="midnight"] [style*="--role-color:#FF9900"],
:root[data-theme="midnight"] [style*="--role-color: #FF9900"],
:root[data-theme="midnight"] [style*="--role-color:#ff9900"],
:root[data-theme="midnight"] [style*="--role-color: #ff9900"] {
  color: #ffd47f !important;
  --role-color: #ffd47f !important;
}

:root[data-theme="midnight"] [style*="color: #008000"],
:root[data-theme="midnight"] [style*="color:#008000"],
:root[data-theme="midnight"] [style*="--role-color:#008000"],
:root[data-theme="midnight"] [style*="--role-color: #008000"] {
  color: #8cf59d !important;
  --role-color: #8cf59d !important;
}

:root[data-theme="midnight"] [style*="color: #0066FF"],
:root[data-theme="midnight"] [style*="color:#0066FF"],
:root[data-theme="midnight"] [style*="color: #0066ff"],
:root[data-theme="midnight"] [style*="color:#0066ff"],
:root[data-theme="midnight"] [style*="--role-color:#0066FF"],
:root[data-theme="midnight"] [style*="--role-color: #0066FF"],
:root[data-theme="midnight"] [style*="--role-color:#0066ff"],
:root[data-theme="midnight"] [style*="--role-color: #0066ff"] {
  color: #42cfff !important;
  --role-color: #42cfff !important;
}

:root[data-theme="midnight"] [style*="color: #c2185b"],
:root[data-theme="midnight"] [style*="color:#c2185b"],
:root[data-theme="midnight"] [style*="--role-color:#c2185b"],
:root[data-theme="midnight"] [style*="--role-color: #c2185b"] {
  color: #ff8db6 !important;
  --role-color: #ff8db6 !important;
}

/* Contrast and placeholder pass. Keep this late so it wins over page CSS. */
:root[data-theme="midnight"] {
  --muted-text: #d2e2ee;
  --soft-text: #c4d8e6;
  --subtle-text: #a9c0d1;
  --surface-0: #0d1722;
  --surface-1: #142231;
  --surface-2: #1b2d3e;
  --surface-3: #23394d;
  --surface-hover: #27445b;
  --placeholder-surface: linear-gradient(135deg, #172838, #27465d 58%, #132232);
}

:root[data-theme="midnight"] .page-loading-wrapper,
:root[data-theme="midnight"] .home-loading-wrapper,
:root[data-theme="midnight"] .level-page-loading-wrapper,
:root[data-theme="midnight"] .profile-page-loading-wrapper,
:root[data-theme="midnight"] .page-loading-message,
:root[data-theme="midnight"] .announcements-loading,
:root[data-theme="midnight"] .games-empty-message,
:root[data-theme="midnight"] #tab-content .games-empty-message,
:root[data-theme="midnight"] .members-empty,
:root[data-theme="midnight"] .staff-loading-message,
:root[data-theme="midnight"] .staff-empty,
:root[data-theme="midnight"] .legacy-empty-message,
:root[data-theme="midnight"] .levels-empty,
:root[data-theme="midnight"] .levels-loading,
:root[data-theme="midnight"] .level-portal-loading,
:root[data-theme="midnight"] .level-portal-loading-list,
:root[data-theme="midnight"] .level-form-loading,
:root[data-theme="midnight"] .game-info-loading,
:root[data-theme="midnight"] .game-base-combobox-empty,
:root[data-theme="midnight"] .reply-loading-box,
:root[data-theme="midnight"] .report-missing-message,
:root[data-theme="midnight"] .profile-missing-message,
:root[data-theme="midnight"] .level-missing-message,
:root[data-theme="midnight"] .notification-empty,
:root[data-theme="midnight"] .credits-loading,
:root[data-theme="midnight"] .credits-empty {
  background: linear-gradient(#1d3042, #122232) !important;
  border: 1px solid #42627c !important;
  color: #edf7ff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.07),
    0 4px 14px rgba(0,0,0,0.32) !important;
}

:root[data-theme="midnight"] .page-loading-panel *,
:root[data-theme="midnight"] .page-loading-message *,
:root[data-theme="midnight"] .announcements-loading *,
:root[data-theme="midnight"] .levels-loading *,
:root[data-theme="midnight"] .level-portal-loading *,
:root[data-theme="midnight"] .level-form-loading *,
:root[data-theme="midnight"] .game-info-loading *,
:root[data-theme="midnight"] .profile-missing-message *,
:root[data-theme="midnight"] .level-missing-message *,
:root[data-theme="midnight"] .notification-empty * {
  color: #edf7ff !important;
}

:root[data-theme="midnight"] .announcement-editor,
:root[data-theme="midnight"] .announcement-form,
:root[data-theme="midnight"] .announcement-content-preview,
:root[data-theme="midnight"] .announcement-card,
:root[data-theme="midnight"] .announcement-thread,
:root[data-theme="midnight"] .announcement-reply-form,
:root[data-theme="midnight"] .contact-actions,
:root[data-theme="midnight"] .content-page .box,
:root[data-theme="midnight"] .content-page .text,
:root[data-theme="midnight"] .game-card,
:root[data-theme="midnight"] .game-info,
:root[data-theme="midnight"] .games-filter-panel,
:root[data-theme="midnight"] .level-source-card,
:root[data-theme="midnight"] .level-source-columns,
:root[data-theme="midnight"] .level-list-table,
:root[data-theme="midnight"] .level-list-row,
:root[data-theme="midnight"] .level-detail-page .level-column-panel,
:root[data-theme="midnight"] .level-detail-page .level-info-section,
:root[data-theme="midnight"] .level-detail-page .level-description-section,
:root[data-theme="midnight"] .level-detail-page .level-description,
:root[data-theme="midnight"] .level-detail-page .level-comment-form,
:root[data-theme="midnight"] .profile-info-card,
:root[data-theme="midnight"] .profile-stats-card,
:root[data-theme="midnight"] .profile-description,
:root[data-theme="midnight"] .profile-about {
  background: linear-gradient(#1b2d3e, #142231) !important;
  border-color: #3e5d76 !important;
  color: #eef7ff !important;
}

/* The sidebar is only a layout wrapper (transparent in classic); the rounded
   .profile-stats box inside it carries the surface. Giving the sidebar its own
   background made dark corners peek out behind the stats box's rounded corners. */
:root[data-theme="midnight"] .profile-page .profile-sidebar,
:root[data-theme="midnight"] .legacy-profile-page .profile-sidebar,
:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-sidebar {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .announcement-heading,
:root[data-theme="midnight"] .announcement-heading *,
:root[data-theme="midnight"] .announcement-editor h2,
:root[data-theme="midnight"] .announcement-title,
:root[data-theme="midnight"] .announcement-title *,
:root[data-theme="midnight"] .announcement-preview-title,
:root[data-theme="midnight"] .contact-page h1,
:root[data-theme="midnight"] .content-page h1,
:root[data-theme="midnight"] .content-page h2,
:root[data-theme="midnight"] .games-page h1,
:root[data-theme="midnight"] .games-page h2,
:root[data-theme="midnight"] .game-card h2,
:root[data-theme="midnight"] .game-card h3,
:root[data-theme="midnight"] .level-source-card h2,
:root[data-theme="midnight"] .level-source-card h3,
:root[data-theme="midnight"] .level-source-card .level-count,
:root[data-theme="midnight"] .level-source-card .level-count strong,
:root[data-theme="midnight"] .levels-page h1,
:root[data-theme="midnight"] .levels-page h2,
:root[data-theme="midnight"] .levels-page .level-row-title,
:root[data-theme="midnight"] .level-detail-page h1,
:root[data-theme="midnight"] .level-detail-page h2,
:root[data-theme="midnight"] .profile-page h1,
:root[data-theme="midnight"] .profile-page h2,
:root[data-theme="midnight"] .profile-info-card strong,
:root[data-theme="midnight"] .profile-stats-card strong,
:root[data-theme="midnight"] .footer h2,
:root[data-theme="midnight"] .footer h3 {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .announcement-heading p,
:root[data-theme="midnight"] .announcement-byline,
:root[data-theme="midnight"] .announcement-date,
:root[data-theme="midnight"] .announcement-content-preview,
:root[data-theme="midnight"] .announcement-preview-content,
:root[data-theme="midnight"] .contact-page p,
:root[data-theme="midnight"] .contact-page li,
:root[data-theme="midnight"] .content-page p,
:root[data-theme="midnight"] .content-page li,
:root[data-theme="midnight"] .content-page small,
:root[data-theme="midnight"] .footer p,
:root[data-theme="midnight"] .footer li,
:root[data-theme="midnight"] .footer-disclaimer,
:root[data-theme="midnight"] .footer-center p,
:root[data-theme="midnight"] .games-tabs a,
:root[data-theme="midnight"] .game-card p,
:root[data-theme="midnight"] .game-card .game-author,
:root[data-theme="midnight"] .game-card .game-version,
:root[data-theme="midnight"] .game-meta,
:root[data-theme="midnight"] #search-count,
:root[data-theme="midnight"] .level-source-card p,
:root[data-theme="midnight"] .level-source-description,
:root[data-theme="midnight"] .levels-page .levels-tab,
:root[data-theme="midnight"] .levels-list-columns,
:root[data-theme="midnight"] .levels-page th,
:root[data-theme="midnight"] .levels-page td,
:root[data-theme="midnight"] .level-row-game,
:root[data-theme="midnight"] .level-row-difficulty,
:root[data-theme="midnight"] .level-row-stat,
:root[data-theme="midnight"] .level-detail-page .level-info-line,
:root[data-theme="midnight"] .level-detail-page .level-posted-date,
:root[data-theme="midnight"] .level-detail-page .level-meta,
:root[data-theme="midnight"] .level-detail-page .level-description p,
:root[data-theme="midnight"] .profile-info-card li,
:root[data-theme="midnight"] .profile-info-card span,
:root[data-theme="midnight"] .profile-description p,
:root[data-theme="midnight"] .profile-description li {
  color: var(--soft-text) !important;
}

:root[data-theme="midnight"] .level-row-game::before,
:root[data-theme="midnight"] .level-row-difficulty::before,
:root[data-theme="midnight"] .level-row-stat::before {
  color: var(--soft-text) !important;
}

:root[data-theme="midnight"] .games-tabs a.active,
:root[data-theme="midnight"] .levels-page .levels-tab.active,
:root[data-theme="midnight"] .level-row-title a,
:root[data-theme="midnight"] .game-card a,
:root[data-theme="midnight"] .footer a,
:root[data-theme="midnight"] .contact-page a,
:root[data-theme="midnight"] .content-page a,
:root[data-theme="midnight"] .profile-info-card a,
:root[data-theme="midnight"] .profile-description a,
:root[data-theme="midnight"] .level-detail-page a {
  color: #e5f7ff !important;
}

:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section .level-detail-thumb,
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section .level-thumbnail-fallback,
:root[data-theme="midnight"] .level-detail-thumb,
:root[data-theme="midnight"] .level-thumbnail,
:root[data-theme="midnight"] .level-thumbnail-placeholder,
:root[data-theme="midnight"] .level-thumbnail-fallback,
:root[data-theme="midnight"] .level-browse-thumb,
:root[data-theme="midnight"] .levels-card-grid .level-thumb-placeholder,
:root[data-theme="midnight"] .levels-card-grid .level-browse-thumb,
:root[data-theme="midnight"] .level-form-page .level-thumbnail-section .level-thumbnail-preview,
:root[data-theme="midnight"] .level-thumbnail-preview,
:root[data-theme="midnight"] .thumbnail-preview,
:root[data-theme="midnight"] .default-thumbnail,
:root[data-theme="midnight"] .smf-thumbnail {
  background: var(--placeholder-surface) !important;
  border-color: #6da9cf !important;
  color: #e9f7ff !important;
  box-shadow:
    inset 0 0 0 2px rgba(233,247,255,0.08),
    0 3px 10px rgba(0,0,0,0.34) !important;
}

:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section .level-detail-thumb *,
:root[data-theme="midnight"] .level-thumbnail-placeholder *,
:root[data-theme="midnight"] .level-thumbnail-fallback *,
:root[data-theme="midnight"] .level-thumbnail-preview *,
:root[data-theme="midnight"] .thumbnail-preview *,
:root[data-theme="midnight"] .default-thumbnail *,
:root[data-theme="midnight"] .smf-thumbnail * {
  color: #f6fbff !important;
  text-shadow: 0 2px 4px rgba(0,0,0,0.55) !important;
}

:root[data-theme="midnight"] .profile-banner,
:root[data-theme="midnight"] .profile-banner-inner,
:root[data-theme="midnight"] .banner-preview,
:root[data-theme="midnight"] .banner-preview-inner,
:root[data-theme="midnight"] .default-banner,
:root[data-theme="midnight"] .smf-banner {
  background: var(--placeholder-surface) !important;
  border-color: #4d7390 !important;
  color: #f4fbff !important;
}

:root[data-theme="midnight"] .profile-user-block,
:root[data-theme="midnight"] .banner-preview-user-block,
:root[data-theme="midnight"] .profile-banner-name,
:root[data-theme="midnight"] .banner-preview-name {
  background: rgba(10, 18, 27, 0.84) !important;
  border: 1px solid rgba(202, 231, 250, 0.18) !important;
  color: #ffffff !important;
}

:root[data-theme="midnight"] .profile-banner-controls,
:root[data-theme="midnight"] .profile-banner-controls *,
:root[data-theme="midnight"] .banner-preview-controls,
:root[data-theme="midnight"] .banner-preview-controls * {
  color: #eef9ff !important;
}

:root[data-theme="midnight"] .profile-info-card,
:root[data-theme="midnight"] .profile-stats-card {
  background: linear-gradient(#1b2d3e, #132130) !important;
}

:root[data-theme="midnight"] .profile-info-card li,
:root[data-theme="midnight"] .profile-stats-card li,
:root[data-theme="midnight"] .profile-info-card .profile-stat-row,
:root[data-theme="midnight"] .profile-stats-card .profile-stat-row {
  border-color: rgba(210, 226, 238, 0.18) !important;
}

:root[data-theme="midnight"] .level-detail-page .level-info-section .success-row,
:root[data-theme="midnight"] .level-detail-page .success-row,
:root[data-theme="midnight"] .level-detail-page .stat-success,
:root[data-theme="midnight"] .level-stat.success {
  background: rgba(70, 164, 111, 0.22) !important;
  color: #dcffe7 !important;
}

:root[data-theme="midnight"] .levels-page .level-list-row:hover,
:root[data-theme="midnight"] .levels-page tbody tr:hover,
:root[data-theme="midnight"] .game-card:hover,
:root[data-theme="midnight"] .level-source-card:hover {
  background: linear-gradient(#244057, #192c3d) !important;
  color: #ffffff !important;
}

/* Final coverage pass for toasts, members filters, thumbnail view, and dashboards. */
:root[data-theme="midnight"] .toast {
  color: #ffffff !important;
  border-color: rgba(0,0,0,0.22) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.18),
    0 5px 14px rgba(0,0,0,0.22) !important;
}

:root[data-theme="midnight"] .toast.success {
  background: linear-gradient(#63b978, #4f9c63) !important;
}

:root[data-theme="midnight"] .toast.info {
  background: linear-gradient(#6ca8d6, #4f8fbe) !important;
}

:root[data-theme="midnight"] .toast.warning {
  background: linear-gradient(#e1c15a, #cfa63d) !important;
  color: #ffffff !important;
}

:root[data-theme="midnight"] .toast.delete {
  background: linear-gradient(#df6666, #c84e4e) !important;
}

:root[data-theme="midnight"] .toast.obliterate {
  background: linear-gradient(#a32626, #7f1616) !important;
}

:root[data-theme="midnight"] .toast.error {
  background: linear-gradient(#d85d5d, #bb4444) !important;
}

:root[data-theme="midnight"] .toast-icon {
  filter: brightness(0) invert(1) !important;
}

:root[data-theme="midnight"] .members-controls {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .members-control {
  color: #dff1fb !important;
}

:root[data-theme="midnight"] .members-control input,
:root[data-theme="midnight"] .members-control select {
  background: #0d1722 !important;
  border-color: #3e5d76 !important;
  color: #f4fbff !important;
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.36) !important;
}

:root[data-theme="midnight"] .members-count,
:root[data-theme="midnight"] .members-tab {
  color: var(--soft-text) !important;
}

:root[data-theme="midnight"] .members-count strong,
:root[data-theme="midnight"] .members-tab.active,
:root[data-theme="midnight"] .members-tab:hover,
:root[data-theme="midnight"] .members-archive-mark {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .members-tabs,
:root[data-theme="midnight"] .levels-tabs,
:root[data-theme="midnight"] .levels-source-tabs,
:root[data-theme="midnight"] .staff-tabs,
:root[data-theme="midnight"] .staff-subtabs,
:root[data-theme="midnight"] .legacy-log-tabs {
  border-bottom-color: rgba(210, 226, 238, 0.42) !important;
}

:root[data-theme="midnight"] .levels-source-tabs {
  gap: 24px !important;
  width: calc(100% - 4px) !important;
  max-width: 1240px !important;
}

:root[data-theme="midnight"] .levels-source-tab {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #c4d8e8 !important;
  font-size: 17px !important;
  padding: 7px 4px !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .levels-source-tab.active,
:root[data-theme="midnight"] .levels-source-tab:hover {
  color: #ffffff !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-browse-card,
:root[data-theme="midnight"] .levels-grid-boxes .level-browse-card {
  background: linear-gradient(#1b2d3e, #132130) !important;
  border-color: #3e5d76 !important;
  color: #eef7ff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.07),
    0 3px 10px rgba(0,0,0,0.3) !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-browse-card:has(.level-status-private) {
  background: linear-gradient(#1b2a37, #111f2d) !important;
  border-color: rgba(180, 198, 211, 0.62) !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-browse-card:has(.level-status-featured) {
  border-color: rgba(255, 210, 94, 0.7) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 3px 10px rgba(0,0,0,0.32),
    0 0 10px rgba(255,190,32,0.18) !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-browse-card:has(.level-status-deleted),
:root[data-theme="midnight"] .levels-card-grid .level-browse-card:has(.level-status-blacklisted) {
  background: linear-gradient(#241f27, #171d27) !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-browse-title,
:root[data-theme="midnight"] .level-browse-title,
:root[data-theme="midnight"] .level-list-card h2 {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-card-game-line,
:root[data-theme="midnight"] .levels-card-grid .level-card-game-line span,
:root[data-theme="midnight"] .level-browse-game,
:root[data-theme="midnight"] .level-browse-description,
:root[data-theme="midnight"] .levels-card-grid .level-browse-stats .level-box-stat,
:root[data-theme="midnight"] .levels-card-grid .level-browse-stats b,
:root[data-theme="midnight"] .level-card-quick span,
:root[data-theme="midnight"] .level-card-quick span b {
  color: var(--soft-text) !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-browse-stats strong,
:root[data-theme="midnight"] .levels-card-grid .level-card-game-line b,
:root[data-theme="midnight"] .level-browse-stats b,
:root[data-theme="midnight"] .level-browse-stats strong {
  color: #eef7ff !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-card-author,
:root[data-theme="midnight"] .levels-card-grid .level-browse-stats,
:root[data-theme="midnight"] .level-card-author,
:root[data-theme="midnight"] .level-card-quick span {
  border-color: rgba(210, 226, 238, 0.22) !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-thumb-stats {
  background: linear-gradient(#20384d, #142637) !important;
  border-color: #5a829e !important;
  color: #eef7ff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 4px 12px rgba(0,0,0,0.36) !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-thumb-stats .level-box-stat {
  border-bottom-color: rgba(210, 226, 238, 0.22) !important;
  color: #e8f5ff !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-thumb-stats b,
:root[data-theme="midnight"] .levels-card-grid .level-thumb-stats strong {
  color: #f6fbff !important;
}

:root[data-theme="midnight"] .levels-view-controls {
  background: linear-gradient(#22384c, #172838) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08), 0 2px 6px rgba(0,0,0,0.25) !important;
}

:root[data-theme="midnight"] .levels-view-controls::after {
  border-color: #456176 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08) !important;
}

:root[data-theme="midnight"] .levels-view-controls .levels-icon-button {
  background: #172838 !important;
}

:root[data-theme="midnight"] .levels-view-controls .levels-icon-button.active,
:root[data-theme="midnight"] .levels-toolbar .levels-view-controls .levels-icon-button.active:hover {
  background: linear-gradient(#79b8e0, #456f8c) !important;
}

:root[data-theme="midnight"] .staff-card,
:root[data-theme="midnight"] .report-card,
:root[data-theme="midnight"] .user-result,
:root[data-theme="midnight"] .admin-tool-card,
:root[data-theme="midnight"] .legacy-request-card,
:root[data-theme="midnight"] .legacy-account-user-card {
  background: linear-gradient(#1b2d3e, #142231) !important;
  border-color: #3e5d76 !important;
  color: #eef7ff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.07),
    0 3px 10px rgba(0,0,0,0.28) !important;
}

:root[data-theme="midnight"] .user-result.own-account {
  border-color: #d49a1f !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.07),
    0 0 0 2px rgba(212, 154, 31, 0.24),
    0 3px 10px rgba(0,0,0,0.28) !important;
}

:root[data-theme="midnight"] .staff-card h3,
:root[data-theme="midnight"] .report-card h3,
:root[data-theme="midnight"] .user-result h3,
:root[data-theme="midnight"] .admin-tool-header h3,
:root[data-theme="midnight"] .report-title-link,
:root[data-theme="midnight"] .legacy-request-title-link,
:root[data-theme="midnight"] .legacy-account-user-header h3,
:root[data-theme="midnight"] .legacy-account-management-title,
:root[data-theme="midnight"] .staff-user-link,
:root[data-theme="midnight"] .staff-context-link,
:root[data-theme="midnight"] .staff-level-link,
:root[data-theme="midnight"] .text-button {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .staff-intro,
:root[data-theme="midnight"] .staff-muted,
:root[data-theme="midnight"] .staff-filter-note,
:root[data-theme="midnight"] .staff-search-field span,
:root[data-theme="midnight"] .report-meta,
:root[data-theme="midnight"] .log-meta,
:root[data-theme="midnight"] .empty-log,
:root[data-theme="midnight"] .legacy-request-meta,
:root[data-theme="midnight"] .legacy-request-submission time,
:root[data-theme="midnight"] .legacy-account-user-count,
:root[data-theme="midnight"] .legacy-account-management-row span,
:root[data-theme="midnight"] .profile-log-side > span,
:root[data-theme="midnight"] .profile-log-background-settings,
:root[data-theme="midnight"] .profile-log-background-color-value,
:root[data-theme="midnight"] .profile-log-url,
:root[data-theme="midnight"] .profile-log-empty {
  color: var(--soft-text) !important;
}

:root[data-theme="midnight"] .staff-list li,
:root[data-theme="midnight"] .legacy-account-management-row,
:root[data-theme="midnight"] .legacy-account-user-header {
  border-color: rgba(210, 226, 238, 0.2) !important;
}

:root[data-theme="midnight"] .report-reason,
:root[data-theme="midnight"] .legacy-request-reason,
:root[data-theme="midnight"] .profile-log-side,
:root[data-theme="midnight"] .profile-log-background-image,
:root[data-theme="midnight"] .profile-log-background-color,
:root[data-theme="midnight"] .legacy-change-table,
:root[data-theme="midnight"] .legacy-change-row > *,
:root[data-theme="midnight"] .legacy-account-modal-content,
:root[data-theme="midnight"] .legacy-account-modal-body {
  background: linear-gradient(#162637, #101c29) !important;
  border-color: #3e5d76 !important;
  color: #eef7ff !important;
}

:root[data-theme="midnight"] .legacy-change-head,
:root[data-theme="midnight"] .legacy-account-user-header,
:root[data-theme="midnight"] .legacy-account-modal-header {
  background: linear-gradient(#223a50, #182a3a) !important;
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .legacy-change-row strong,
:root[data-theme="midnight"] .legacy-change-row pre,
:root[data-theme="midnight"] .legacy-request-level-info,
:root[data-theme="midnight"] .legacy-request-level-info *,
:root[data-theme="midnight"] .profile-log-background-heading,
:root[data-theme="midnight"] .profile-log-music-title,
:root[data-theme="midnight"] .profile-log-background-color-label {
  color: #eef7ff !important;
}

:root[data-theme="midnight"] .level-game-tool-row {
  background: linear-gradient(#1b2d3e, #132130) !important;
  border-color: #3e5d76 !important;
  color: #eef7ff !important;
}

:root[data-theme="midnight"] .level-game-tool-row.pending {
  background: linear-gradient(#243f55, #183048) !important;
  border-color: #79b8e0 !important;
}

:root[data-theme="midnight"] .level-game-title-line strong,
:root[data-theme="midnight"] .level-game-title-line small,
:root[data-theme="midnight"] .level-game-type {
  color: #eef7ff !important;
}

:root[data-theme="midnight"] .staff-subtab {
  background: var(--button-bg) !important;
  border-color: var(--button-border) !important;
  color: var(--button-text) !important;
  box-shadow: var(--button-shadow) !important;
}

:root[data-theme="midnight"] .staff-subtab:hover,
:root[data-theme="midnight"] .staff-subtab.active {
  background: var(--button-hover-bg) !important;
  border-color: var(--button-hover-border) !important;
  color: #ffffff !important;
}

:root[data-theme="midnight"] .moderation-loading-box {
  background: linear-gradient(#1d3042, #122232) !important;
  border-color: #42627c !important;
  color: #edf7ff !important;
}

/* Midnight consistency pass: contrast, comments, profile panes, and role colors. */
:root[data-theme="midnight"] .level-source-card p,
:root[data-theme="midnight"] .source-card p,
:root[data-theme="midnight"] .level-source-description {
  color: #e5f4ff !important;
}

:root[data-theme="midnight"] .level-source-meta,
:root[data-theme="midnight"] .level-source-meta span,
:root[data-theme="midnight"] .portal-stat span {
  color: #c3d7e7 !important;
}

:root[data-theme="midnight"] .level-source-meta b,
:root[data-theme="midnight"] .level-source-meta strong,
:root[data-theme="midnight"] .portal-stat strong,
:root[data-theme="midnight"] .level-source-card .level-count,
:root[data-theme="midnight"] .level-source-card .level-count strong,
:root[data-theme="midnight"] .source-card .level-count,
:root[data-theme="midnight"] .source-card .level-count strong {
  color: #bfe9ff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.35) !important;
}

:root[data-theme="midnight"] .members-list-columns {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #c4d8e8 !important;
}

:root[data-theme="midnight"] .members-list-columns > * {
  color: #c4d8e8 !important;
}

:root[data-theme="midnight"] .member-row .member-role {
  color: inherit !important;
}

:root[data-theme="midnight"] .profile-banner,
:root[data-theme="midnight"] .banner-preview,
:root[data-theme="midnight"] .profile-banner-inner,
:root[data-theme="midnight"] .banner-preview-inner {
  background: linear-gradient(135deg, #203f55, #162b3d 55%, #102131) !important;
  border-color: #5a83a0 !important;
}

:root[data-theme="midnight"] .profile-user-block,
:root[data-theme="midnight"] .banner-preview-user-block {
  background: rgba(7, 15, 23, 0.9) !important;
  border-color: rgba(210,226,238,0.5) !important;
  box-shadow: 0 3px 10px rgba(0,0,0,0.35) !important;
  text-shadow: none !important;
}

:root[data-theme="midnight"] .profile-name,
:root[data-theme="midnight"] .banner-preview-name {
  text-shadow: none !important;
}

:root[data-theme="midnight"] .profile-description,
:root[data-theme="midnight"] .profile-stats,
:root[data-theme="midnight"] .profile-legacy-accounts,
:root[data-theme="midnight"] .profile-music-bar,
:root[data-theme="midnight"] .profile-comment-form,
:root[data-theme="midnight"] .thread-reply-form,
:root[data-theme="midnight"] .content-preview,
:root[data-theme="midnight"] .announcement-content-preview,
:root[data-theme="midnight"] .description-preview-body,
:root[data-theme="midnight"] .comment,
:root[data-theme="midnight"] .reply,
:root[data-theme="midnight"] .comment-history-list .comment.history-entry,
:root[data-theme="midnight"] .comment-history-list .reply.history-entry,
:root[data-theme="midnight"] .review-entry,
:root[data-theme="midnight"] .no-comments,
:root[data-theme="midnight"] .profile-loading-box,
:root[data-theme="midnight"] .reply-loading-box,
:root[data-theme="midnight"] .comment-history-loading,
:root[data-theme="midnight"] .notification-empty {
  background: linear-gradient(#1a2c3d, #122130) !important;
  border-color: #3e5d76 !important;
  color: #f4fbff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06), 0 2px 8px rgba(0,0,0,0.2) !important;
}

:root[data-theme="midnight"] .description-preview-body {
  border-color: #3e5d76 !important;
}

:root[data-theme="midnight"] .profile-description *,
:root[data-theme="midnight"] .profile-legacy-accounts *,
:root[data-theme="midnight"] .profile-music-bar *,
:root[data-theme="midnight"] .content-preview *,
:root[data-theme="midnight"] .announcement-content-preview *,
:root[data-theme="midnight"] .description-preview-body *,
:root[data-theme="midnight"] .comment-body,
:root[data-theme="midnight"] .reply-body,
:root[data-theme="midnight"] .comment-body *,
:root[data-theme="midnight"] .reply-body *,
:root[data-theme="midnight"] .history-entry-body,
:root[data-theme="midnight"] .history-entry-body *,
:root[data-theme="midnight"] .review-entry-body,
:root[data-theme="midnight"] .review-entry-body * {
  color: #f4fbff !important;
}

:root[data-theme="midnight"] .profile-stats,
:root[data-theme="midnight"] .profile-stats div,
:root[data-theme="midnight"] .profile-stats span,
:root[data-theme="midnight"] .profile-stats a,
:root[data-theme="midnight"] .profile-stats strong {
  color: #e7f5ff !important;
  border-color: rgba(210,226,238,0.2) !important;
}

:root[data-theme="midnight"] .profile-stats strong,
:root[data-theme="midnight"] .profile-legacy-accounts h2,
:root[data-theme="midnight"] .profile-legacy-account-group h3,
:root[data-theme="midnight"] .profile-music-title,
:root[data-theme="midnight"] .profile-music-heading,
:root[data-theme="midnight"] .profile-levels-link,
:root[data-theme="midnight"] .profile-plays-link,
:root[data-theme="midnight"] .profile-rates-link,
:root[data-theme="midnight"] .profile-reviews-link {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .profile-music-controls button,
:root[data-theme="midnight"] #music-youtube-btn,
:root[data-theme="midnight"] #music-play,
:root[data-theme="midnight"] #music-mute,
:root[data-theme="midnight"] #music-loop {
  background: var(--button-bg) !important;
  border-color: var(--button-border) !important;
  color: #f5fbff !important;
  box-shadow: var(--button-shadow) !important;
}

:root[data-theme="midnight"] #music-time,
:root[data-theme="midnight"] .profile-music-time,
:root[data-theme="midnight"] .comment-date,
:root[data-theme="midnight"] .reply-date,
:root[data-theme="midnight"] .announcement-date,
:root[data-theme="midnight"] .notification-meta,
:root[data-theme="midnight"] .history-entry .comment-date,
:root[data-theme="midnight"] .review-entry .comment-date {
  color: #c6d9e8 !important;
}

:root[data-theme="midnight"] #music-progress {
  background: #0b1620 !important;
  border-color: #486b86 !important;
}

:root[data-theme="midnight"] .profile-actions-btn,
:root[data-theme="midnight"] .banner-actions-btn,
:root[data-theme="midnight"] .profile-actions .profile-actions-btn {
  background: rgba(11,22,32,0.92) !important;
  border-color: #5b819c !important;
  color: #e8f5ff !important;
}

:root[data-theme="midnight"] .action-dropdown {
  background: linear-gradient(#172839, #101d2a) !important;
  border-color: #547993 !important;
  box-shadow: 0 10px 22px rgba(0,0,0,0.38) !important;
}

:root[data-theme="midnight"] .action-dropdown a,
:root[data-theme="midnight"] .action-dropdown button {
  color: #eaf7ff !important;
  border-top-color: rgba(210,226,238,0.16) !important;
}

:root[data-theme="midnight"] .action-dropdown a:hover,
:root[data-theme="midnight"] .action-dropdown button:hover {
  background: rgba(121,184,224,0.16) !important;
  color: #ffffff !important;
}

:root[data-theme="midnight"] .comment-btn img,
:root[data-theme="midnight"] .reply-actions .comment-btn img,
:root[data-theme="midnight"] .profile-actions-btn img {
  filter: brightness(0) saturate(100%) invert(88%) sepia(22%) saturate(565%) hue-rotate(171deg) brightness(105%) contrast(101%) !important;
  opacity: 0.95 !important;
}

:root[data-theme="midnight"] .comment.deleted-comment,
:root[data-theme="midnight"] .reply.deleted-comment,
:root[data-theme="midnight"] .announcement-card.announcement-deleted,
:root[data-theme="midnight"] .announcement-thread .announcement-deleted-reply,
:root[data-theme="midnight"] .level-comment.deleted-comment,
:root[data-theme="midnight"] .level-detail-page .reply.deleted-comment {
  background: linear-gradient(#2a2430, #171f2a) !important;
  border-color: #d06a74 !important;
  box-shadow: inset 3px 0 0 #d84f5a, 0 2px 8px rgba(0,0,0,0.25) !important;
}

:root[data-theme="midnight"] .deleted-comment::before,
:root[data-theme="midnight"] .announcement-deleted-badge {
  color: #ff9ca4 !important;
}

:root[data-theme="midnight"] .comment.pinned-comment,
:root[data-theme="midnight"] .level-comment.pinned-comment {
  border-color: #e0bd4f !important;
  box-shadow: inset 3px 0 0 #e0bd4f, 0 2px 8px rgba(0,0,0,0.25) !important;
}

:root[data-theme="midnight"] .pinned-badge {
  color: #ffd766 !important;
}

:root[data-theme="midnight"] .comment.private-comment,
:root[data-theme="midnight"] .reply.private-comment,
:root[data-theme="midnight"] .comment.locked-comment,
:root[data-theme="midnight"] .reply.locked-comment {
  border-color: #7aaed0 !important;
}

:root[data-theme="midnight"] .notification-toolbar,
:root[data-theme="midnight"] .notification-item,
:root[data-theme="midnight"] .notification-item.unread {
  background: linear-gradient(#1b2d3e, #132231) !important;
  border-color: #3e5d76 !important;
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .notification-message,
:root[data-theme="midnight"] .custom-notification-text {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .notification-state,
:root[data-theme="midnight"] .notification-state.new,
:root[data-theme="midnight"] .status-pill,
:root[data-theme="midnight"] .role-pill {
  background: rgba(121,184,224,0.18) !important;
  border-color: #79b8e0 !important;
  color: #eaf7ff !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .status-pill.open {
  border-color: #8fc8ff !important;
  color: #dff1ff !important;
}

:root[data-theme="midnight"] .status-pill.resolved {
  border-color: #79d990 !important;
  color: #d8ffe0 !important;
}

:root[data-theme="midnight"] .status-pill.dismissed {
  border-color: #ff9b9b !important;
  color: #ffe1e1 !important;
}

:root[data-theme="midnight"] .edit-tab,
:root[data-theme="midnight"] .history-tab,
:root[data-theme="midnight"] .profile-source-tab,
:root[data-theme="midnight"] .music-source-tab,
:root[data-theme="midnight"] .staff-tab,
:root[data-theme="midnight"] .staff-subtab,
:root[data-theme="midnight"] .report-tab,
:root[data-theme="midnight"] .legacy-log-tab,
:root[data-theme="midnight"] .levels-tab,
:root[data-theme="midnight"] .members-tab,
:root[data-theme="midnight"] .notification-status-tab {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: #c4d8e8 !important;
}

:root[data-theme="midnight"] .edit-tab.active,
:root[data-theme="midnight"] .edit-tab:hover,
:root[data-theme="midnight"] .history-tab.active,
:root[data-theme="midnight"] .history-tab:hover,
:root[data-theme="midnight"] .profile-source-tab.active,
:root[data-theme="midnight"] .profile-source-tab:hover,
:root[data-theme="midnight"] .music-source-tab.active,
:root[data-theme="midnight"] .music-source-tab:hover,
:root[data-theme="midnight"] .staff-tab.active,
:root[data-theme="midnight"] .staff-tab:hover,
:root[data-theme="midnight"] .staff-subtab.active,
:root[data-theme="midnight"] .staff-subtab:hover,
:root[data-theme="midnight"] .report-tab.active,
:root[data-theme="midnight"] .report-tab:hover,
:root[data-theme="midnight"] .legacy-log-tab.active,
:root[data-theme="midnight"] .legacy-log-tab:hover,
:root[data-theme="midnight"] .levels-tab.active,
:root[data-theme="midnight"] .levels-tab:hover,
:root[data-theme="midnight"] .members-tab.active,
:root[data-theme="midnight"] .members-tab:hover,
:root[data-theme="midnight"] .notification-status-tab.active,
:root[data-theme="midnight"] .notification-status-tab:hover {
  color: #ffffff !important;
}

:root[data-theme="midnight"] body.edit-profile-background-preview {
  background-color: var(--edit-profile-background-color) !important;
  background-image: var(--edit-profile-background-image) !important;
  background-size: var(--edit-profile-background-size) !important;
  background-repeat: var(--edit-profile-background-repeat) !important;
  background-position: var(--edit-profile-background-position) !important;
  background-attachment: var(--edit-profile-background-attachment) !important;
}

:root[data-theme="midnight"] .member-role[style*="#414141"],
:root[data-theme="midnight"] .member-role[style*="rgb(65, 65, 65)"],
:root[data-theme="midnight"] .comment-username[style*="#414141"],
:root[data-theme="midnight"] .reply-username[style*="#414141"],
:root[data-theme="midnight"] .notification-sender[style*="#414141"],
:root[data-theme="midnight"] .mention[style*="#414141"],
:root[data-theme="midnight"] .profile-name[style*="#414141"],
:root[data-theme="midnight"] .banner-preview-name[style*="#414141"] {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] [style*="--role-color:#414141"],
:root[data-theme="midnight"] [style*="--role-color: #414141"] {
  --role-color: #f5fbff !important;
}

:root[data-theme="midnight"] .member-role[style*="#9aa3ad"],
:root[data-theme="midnight"] .member-role[style*="#555f68"],
:root[data-theme="midnight"] .comment-username[style*="#9aa3ad"],
:root[data-theme="midnight"] .reply-username[style*="#9aa3ad"],
:root[data-theme="midnight"] .notification-sender[style*="#9aa3ad"],
:root[data-theme="midnight"] .mention[style*="#9aa3ad"] {
  color: #b9c8d6 !important;
}

:root[data-theme="midnight"] :is(.member-name, .member-role, .comment-username, .reply-username, .notification-sender, .mention, .profile-name, .banner-preview-name, .staff-user-link)[style*="#990099"],
:root[data-theme="midnight"] :is(.member-name, .member-role, .comment-username, .reply-username, .notification-sender, .mention, .profile-name, .banner-preview-name, .staff-user-link)[style*="#c2185b"] {
  color: #ff7cff !important;
}

:root[data-theme="midnight"] :is(.member-name, .member-role, .comment-username, .reply-username, .notification-sender, .mention, .profile-name, .banner-preview-name, .staff-user-link)[style*="#FF9900"],
:root[data-theme="midnight"] :is(.member-name, .member-role, .comment-username, .reply-username, .notification-sender, .mention, .profile-name, .banner-preview-name, .staff-user-link)[style*="#ff9900"] {
  color: #ffc46b !important;
}

:root[data-theme="midnight"] :is(.member-name, .member-role, .comment-username, .reply-username, .notification-sender, .mention, .profile-name, .banner-preview-name, .staff-user-link)[style*="#008000"] {
  color: #7de28c !important;
}

:root[data-theme="midnight"] :is(.member-name, .member-role, .comment-username, .reply-username, .notification-sender, .mention, .profile-name, .banner-preview-name, .staff-user-link)[style*="#0066FF"],
:root[data-theme="midnight"] :is(.member-name, .member-role, .comment-username, .reply-username, .notification-sender, .mention, .profile-name, .banner-preview-name, .staff-user-link)[style*="#0066ff"] {
  color: #42cfff !important;
}

:root[data-theme="midnight"] :is(.member-name, .member-role, .comment-username, .reply-username, .notification-sender, .mention, .profile-name, .banner-preview-name, .staff-user-link)[style*="#861717"] {
  color: #ff8f96 !important;
}

:root[data-theme="midnight"] :is(.member-name, .member-role, .comment-username, .reply-username, .notification-sender, .mention, .profile-name, .banner-preview-name, .staff-user-link)[style*="#4f7180"] {
  color: #7fa6c1 !important;
}

/* Midnight polish pass: keep the theme close to the classic blue/gray look. */
:root[data-theme="midnight"] {
  --panel: #182a3b;
  --panel-strong: #20384d;
  --panel-soft: #233d54;
  --field-bg: #0d1823;
  --field-border: #496f8b;
  --accent-blue: #79b8e0;
  --accent-blue-soft: #9bd2f0;
}

:root[data-theme="midnight"] .box-inner,
:root[data-theme="midnight"] .content-box,
:root[data-theme="midnight"] .panel,
:root[data-theme="midnight"] .settings-card,
:root[data-theme="midnight"] .level-editor-form,
:root[data-theme="midnight"] .level-form-page .level-form-card,
:root[data-theme="midnight"] .level-form-page .level-form-section,
:root[data-theme="midnight"] .level-form-page .level-game-picker-panel,
:root[data-theme="midnight"] .level-form-page .level-difficulty-section,
:root[data-theme="midnight"] .level-form-page .level-thumbnail-section,
:root[data-theme="midnight"] .level-form-page .level-palace-date-section {
  background: linear-gradient(#1e3448, #162738) !important;
  border-color: #466a85 !important;
  color: #f1f9ff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 3px 10px rgba(0,0,0,0.22) !important;
}

:root[data-theme="midnight"] .level-form-page .level-form-section {
  border-bottom-color: rgba(155,210,240,0.2) !important;
}

:root[data-theme="midnight"] .level-form-page .text,
:root[data-theme="midnight"] .level-form-page .main-content,
:root[data-theme="midnight"] .level-form-page .level-field,
:root[data-theme="midnight"] .level-form-page .level-form-section > .level-field,
:root[data-theme="midnight"] .level-form-page .level-thumbnail-section .level-field,
:root[data-theme="midnight"] .level-form-page .level-description-editor-section > .level-field,
:root[data-theme="midnight"] .level-form-page .level-thumbnail-help,
:root[data-theme="midnight"] .level-form-page .level-game-help,
:root[data-theme="midnight"] .level-form-page .level-palace-thumbnail-note,
:root[data-theme="midnight"] .level-form-page .legacy-reason-only-option,
:root[data-theme="midnight"] .level-form-page .level-visual-filters-field {
  background: transparent !important;
  color: #d8ecfa !important;
  border-color: rgba(155,210,240,0.18) !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .level-form-page .level-form-section h2,
:root[data-theme="midnight"] .level-form-page .level-form-section label,
:root[data-theme="midnight"] .level-form-page .level-field-label,
:root[data-theme="midnight"] .level-form-page .level-form-header h1,
:root[data-theme="midnight"] .level-form-page .level-game-picker-panel h2 {
  color: #f6fbff !important;
}

:root[data-theme="midnight"] .level-form-page input,
:root[data-theme="midnight"] .level-form-page select,
:root[data-theme="midnight"] .level-form-page textarea,
:root[data-theme="midnight"] .level-form-section input,
:root[data-theme="midnight"] .level-form-section select,
:root[data-theme="midnight"] .level-form-section textarea,
:root[data-theme="midnight"] .game-info-editor input,
:root[data-theme="midnight"] .game-info-editor select,
:root[data-theme="midnight"] .game-info-editor textarea {
  background: linear-gradient(#0d1823, #101d2a) !important;
  border-color: var(--field-border) !important;
  color: #f7fbff !important;
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.45) !important;
}

:root[data-theme="midnight"] .level-form-page input::placeholder,
:root[data-theme="midnight"] .level-form-page textarea::placeholder,
:root[data-theme="midnight"] .game-info-editor input::placeholder,
:root[data-theme="midnight"] .game-info-editor textarea::placeholder {
  color: #9eb9cb !important;
}

:root[data-theme="midnight"] .game-card {
  background: linear-gradient(#20384d, #172a3c) !important;
  border-color: #4c7593 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 4px 12px rgba(0,0,0,0.28) !important;
}

:root[data-theme="midnight"] .game-card h3,
:root[data-theme="midnight"] .game-card h3 a,
:root[data-theme="midnight"] .game-card .game-title,
:root[data-theme="midnight"] .game-card .game-title a {
  color: #f7fbff !important;
}

:root[data-theme="midnight"] .game-author,
:root[data-theme="midnight"] .game-card .game-author,
:root[data-theme="midnight"] .game-card .game-version,
:root[data-theme="midnight"] .game-card label,
:root[data-theme="midnight"] .series-title + p,
:root[data-theme="midnight"] .games-result-summary,
:root[data-theme="midnight"] .games-empty-message {
  color: #cfe4f4 !important;
}

:root[data-theme="midnight"] .game-card .game-author a.game-author-link,
:root[data-theme="midnight"] .game-card .game-author-link b {
  color: #9bd2f0 !important;
}

:root[data-theme="midnight"] .games-tabs,
:root[data-theme="midnight"] .tab-row,
:root[data-theme="midnight"] .full-divider {
  border-color: rgba(155,210,240,0.42) !important;
}

:root[data-theme="midnight"] .games-tabs a,
:root[data-theme="midnight"] .game-tab {
  color: #b6ccdc !important;
}

:root[data-theme="midnight"] .games-tabs a.active,
:root[data-theme="midnight"] .games-tabs a:hover,
:root[data-theme="midnight"] .game-tab.active,
:root[data-theme="midnight"] .game-tab:hover {
  color: #ffffff !important;
}

:root[data-theme="midnight"] .game-info {
  background: linear-gradient(#20384d, #172a3c) !important;
  border-color: #5a83a0 !important;
  color: #f2faff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 4px 14px rgba(0,0,0,0.28) !important;
}

:root[data-theme="midnight"] .game-info::before,
:root[data-theme="midnight"] .game-info::after {
  border-color: transparent !important;
  background: transparent !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .game-info h3,
:root[data-theme="midnight"] .game-info-heading,
:root[data-theme="midnight"] .game-info-description b {
  color: #f8fcff !important;
}

:root[data-theme="midnight"] .game-info p,
:root[data-theme="midnight"] .game-info-description,
:root[data-theme="midnight"] .game-info-description p {
  color: #e3f3ff !important;
}

:root[data-theme="midnight"] .game-info .game-author-link,
:root[data-theme="midnight"] .game-info .game-base-link,
:root[data-theme="midnight"] .game-info .game-author-link b,
:root[data-theme="midnight"] .game-info .game-base-link b {
  color: #8fd0ff !important;
}

:root[data-theme="midnight"] .level-browse-thumb,
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section .level-detail-thumb,
:root[data-theme="midnight"] .level-thumbnail-preview,
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-modal-content .level-thumbnail-preview {
  background:
    radial-gradient(circle at 50% 42%, rgba(121,184,224,0.18), transparent 42%),
    linear-gradient(135deg, #244961, #1a3449 52%, #122636) !important;
  border-color: #88c7eb !important;
  outline-color: rgba(219,242,255,0.78) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.18),
    inset 0 0 0 1px rgba(15,30,43,0.55),
    0 3px 8px rgba(0,0,0,0.32) !important;
}

:root[data-theme="midnight"] .level-browse-thumb.no-thumbnail,
:root[data-theme="midnight"] .level-browse-thumb:not(.has-thumbnail),
:root[data-theme="midnight"] .level-detail-thumb.no-thumbnail,
:root[data-theme="midnight"] .level-thumbnail-preview:not(.has-thumbnail) {
  background:
    radial-gradient(circle at 50% 42%, rgba(155,210,240,0.22), transparent 44%),
    linear-gradient(135deg, #294e67, #1d3a51 54%, #14293a) !important;
}

:root[data-theme="midnight"] .level-browse-thumb img,
:root[data-theme="midnight"] .levels-card-grid .level-browse-thumb img,
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section .level-detail-thumb-image,
:root[data-theme="midnight"] .level-thumbnail-preview img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center center !important;
  background: #14293a !important;
}

:root[data-theme="midnight"] .level-thumb-placeholder,
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section .level-detail-thumb > span:not(.level-thumbnail-fallback),
:root[data-theme="midnight"] .level-thumbnail-preview span {
  color: #ffffff !important;
  text-shadow:
    0 2px 2px rgba(0,0,0,0.48),
    0 0 12px rgba(121,184,224,0.35) !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-browse-card {
  background: linear-gradient(#20384d, #172a3c) !important;
  border-color: #466a85 !important;
}

:root[data-theme="midnight"] .level-status-pill,
:root[data-theme="midnight"] .level-visibility-badge,
:root[data-theme="midnight"] .level-state-badge,
:root[data-theme="midnight"] .level-status-row-badge,
:root[data-theme="midnight"] .level-status-card-badge,
:root[data-theme="midnight"] .notification-state,
:root[data-theme="midnight"] .status-pill,
:root[data-theme="midnight"] .role-pill {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .level-status-pill.private,
:root[data-theme="midnight"] .level-visibility-badge.private,
:root[data-theme="midnight"] .level-status-private,
:root[data-theme="midnight"] .status-pill.open {
  background: rgba(255,203,84,0.18) !important;
  border-color: #ffd06a !important;
  color: #ffe7aa !important;
}

:root[data-theme="midnight"] .level-status-pill.deleted,
:root[data-theme="midnight"] .level-visibility-badge.deleted,
:root[data-theme="midnight"] .level-state-badge.deleted,
:root[data-theme="midnight"] .level-status-deleted,
:root[data-theme="midnight"] .status-pill.dismissed {
  background: rgba(255,105,118,0.16) !important;
  border-color: #ff8f99 !important;
  color: #ffd6da !important;
}

:root[data-theme="midnight"] .level-status-duplicate,
:root[data-theme="midnight"] .level-status-blacklisted {
  background: rgba(169,128,255,0.16) !important;
  border-color: #b99cff !important;
  color: #e4d9ff !important;
}

:root[data-theme="midnight"] .status-pill.resolved,
:root[data-theme="midnight"] .level-viewer-check,
:root[data-theme="midnight"] .has-viewer-action,
:root[data-theme="midnight"] .has-viewer-action-value {
  background: rgba(93,211,122,0.16) !important;
  border-color: #71db87 !important;
  color: #d7ffdf !important;
}

:root[data-theme="midnight"] .role-pill {
  background: color-mix(in srgb, var(--role-color, #79b8e0) 24%, #142638) !important;
  border-color: color-mix(in srgb, var(--role-color, #79b8e0) 68%, #dff4ff) !important;
  color: color-mix(in srgb, var(--role-color, #79b8e0) 48%, #ffffff) !important;
}

:root[data-theme="midnight"] .profile-actions-btn,
:root[data-theme="midnight"] .banner-actions-btn,
:root[data-theme="midnight"] .profile-actions .profile-actions-btn {
  background: linear-gradient(#21394e, #142638) !important;
  border-color: #7ab8df !important;
  color: #eaf8ff !important;
}

:root[data-theme="midnight"] .profile-actions-btn i,
:root[data-theme="midnight"] .profile-actions-btn svg,
:root[data-theme="midnight"] .banner-actions-btn i,
:root[data-theme="midnight"] .banner-actions-btn svg {
  color: #bfe8ff !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .legacy-comment-marker i,
:root[data-theme="midnight"] .legacy-comment-marker svg {
  color: #f2c94c !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment i,
:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment svg,
:root[data-theme="midnight"] .censor-history-comment i,
:root[data-theme="midnight"] .censor-history-comment svg {
  color: #bfe8ff !important;
  opacity: 0.95 !important;
  filter: none !important;
}

:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment.active-censor i,
:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment.active-censor svg,
:root[data-theme="midnight"] .censor-history-comment.active-censor i,
:root[data-theme="midnight"] .censor-history-comment.active-censor svg,
:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment:hover i,
:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment:hover svg,
:root[data-theme="midnight"] .censor-history-comment:hover i,
:root[data-theme="midnight"] .censor-history-comment:hover svg {
  color: #ff8f99 !important;
}

:root[data-theme="midnight"] .levels-hero p,
:root[data-theme="midnight"] .level-portal-page .levels-hero p,
:root[data-theme="midnight"] .level-portal-page .page-subtitle,
:root[data-theme="midnight"] .level-portal-page .text > p,
:root[data-theme="midnight"] .level-source-intro {
  color: #cfe4f4 !important;
}

:root[data-theme="midnight"] .member-name[style*="#9aa3ad"],
:root[data-theme="midnight"] .member-role[style*="#9aa3ad"],
:root[data-theme="midnight"] .comment-username[style*="#9aa3ad"],
:root[data-theme="midnight"] .reply-username[style*="#9aa3ad"],
:root[data-theme="midnight"] .notification-sender[style*="#9aa3ad"],
:root[data-theme="midnight"] .staff-user-link[style*="#9aa3ad"],
:root[data-theme="midnight"] .staff-inline-user[style*="#9aa3ad"],
:root[data-theme="midnight"] .staff-context-link [style*="#9aa3ad"],
:root[data-theme="midnight"] .online-member[style*="#9aa3ad"],
:root[data-theme="midnight"] .mention[style*="#9aa3ad"] {
  color: #b9c8d6 !important;
}

:root[data-theme="midnight"] [style*="--role-color:#9aa3ad"],
:root[data-theme="midnight"] [style*="--role-color: #9aa3ad"] {
  --role-color: #b9c8d6 !important;
}

:root[data-theme="midnight"] .member-name[style*="#555f68"],
:root[data-theme="midnight"] .member-role[style*="#555f68"],
:root[data-theme="midnight"] .comment-username[style*="#555f68"],
:root[data-theme="midnight"] .reply-username[style*="#555f68"],
:root[data-theme="midnight"] .notification-sender[style*="#555f68"],
:root[data-theme="midnight"] .staff-user-link[style*="#555f68"],
:root[data-theme="midnight"] .staff-inline-user[style*="#555f68"],
:root[data-theme="midnight"] .staff-context-link [style*="#555f68"],
:root[data-theme="midnight"] .online-member[style*="#555f68"],
:root[data-theme="midnight"] .mention[style*="#555f68"] {
  color: #9eafbf !important;
}

:root[data-theme="midnight"] [style*="--role-color:#555f68"],
:root[data-theme="midnight"] [style*="--role-color: #555f68"] {
  --role-color: #9eafbf !important;
}

:root[data-theme="midnight"] .member-name[style*="#4f7180"],
:root[data-theme="midnight"] .member-role[style*="#4f7180"],
:root[data-theme="midnight"] .comment-username[style*="#4f7180"],
:root[data-theme="midnight"] .reply-username[style*="#4f7180"],
:root[data-theme="midnight"] .notification-sender[style*="#4f7180"],
:root[data-theme="midnight"] .staff-user-link[style*="#4f7180"],
:root[data-theme="midnight"] .staff-inline-user[style*="#4f7180"],
:root[data-theme="midnight"] .staff-context-link [style*="#4f7180"],
:root[data-theme="midnight"] .online-member[style*="#4f7180"],
:root[data-theme="midnight"] .mention[style*="#4f7180"] {
  color: #7fa6c1 !important;
}

:root[data-theme="midnight"] [style*="--role-color:#4f7180"],
:root[data-theme="midnight"] [style*="--role-color: #4f7180"] {
  --role-color: #7fa6c1 !important;
}

/* Midnight normalization pass: keep dark theme structure close to the classic layout. */
:root[data-theme="midnight"] .content-page .single-column .text,
:root[data-theme="midnight"] .content-page .box-inner.single-column > .text,
:root[data-theme="midnight"] .info-page .single-column .text,
:root[data-theme="midnight"] .members-page .single-column .text,
:root[data-theme="midnight"] .members-page .box-inner.single-column > .text,
:root[data-theme="midnight"] .profile-page .box-inner.single-column > .text,
:root[data-theme="midnight"] .profile-page .box-inner.full-width > .text,
:root[data-theme="midnight"] .levels-page .box-inner.single-column > .text,
:root[data-theme="midnight"] .level-portal-page .box-inner.single-column > .text,
:root[data-theme="midnight"] .notifications-page .box-inner.single-column > .text {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .content-page .single-column,
:root[data-theme="midnight"] .content-page .box-inner.single-column {
  background: #1a2f42 !important;
  border-color: #4a6f8a !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 3px 12px rgba(0,0,0,0.28) !important;
}

:root[data-theme="midnight"] .content-page .text,
:root[data-theme="midnight"] .content-page .text p,
:root[data-theme="midnight"] .content-page .text li,
:root[data-theme="midnight"] .content-page .text small,
:root[data-theme="midnight"] .content-page .text span:not([style]),
:root[data-theme="midnight"] .content-page .text strong,
:root[data-theme="midnight"] .content-page .text b,
:root[data-theme="midnight"] .contact-page .text,
:root[data-theme="midnight"] .contact-page .text p,
:root[data-theme="midnight"] .contact-page .text strong {
  color: #e8f6ff !important;
}

:root[data-theme="midnight"] .content-page .text a,
:root[data-theme="midnight"] .contact-page .text a,
:root[data-theme="midnight"] .faq-item a {
  color: #8fd0ff !important;
}

:root[data-theme="midnight"] .contact-actions,
:root[data-theme="midnight"] .align-left .contact-actions {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .contact-actions a {
  background: linear-gradient(#243f56, #172b3e) !important;
  border-color: #5d88a6 !important;
  color: #f5fbff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.12),
    0 2px 6px rgba(0,0,0,0.28) !important;
}

:root[data-theme="midnight"] .contact-actions a:hover,
:root[data-theme="midnight"] .contact-actions a:focus-visible {
  background: linear-gradient(#2c536e, #1c354b) !important;
  border-color: #8fd0ff !important;
  color: #ffffff !important;
}

:root[data-theme="midnight"] .credits-group,
:root[data-theme="midnight"] .special-thanks-list li {
  background: linear-gradient(#243b50, #1a2d40) !important;
  border-color: color-mix(in srgb, var(--role-accent, #79b8e0) 62%, #406179) !important;
  border-left-color: var(--role-accent, #79b8e0) !important;
  color: #eaf7ff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 2px 6px rgba(0,0,0,0.22) !important;
}

:root[data-theme="midnight"] .credits-group.role-founder {
  --role-accent: #f18cff !important;
}

:root[data-theme="midnight"] .credits-group.role-admin {
  --role-accent: #ffd47f !important;
}

:root[data-theme="midnight"] .credits-group.role-moderator {
  --role-accent: #8cf59d !important;
}

:root[data-theme="midnight"] .credits-group.role-contributor {
  --role-accent: #42cfff !important;
}

:root[data-theme="midnight"] .info-page .single-column .text .credits-group h3 {
  color: var(--role-accent, #79b8e0) !important;
}

:root[data-theme="midnight"] .credits-list a {
  background: linear-gradient(#1c3246, #122435) !important;
  border-color: color-mix(in srgb, var(--role-accent, #79b8e0) 70%, #dff4ff) !important;
  color: var(--role-accent, #79b8e0) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.1) !important;
}

:root[data-theme="midnight"] .credits-list a:hover,
:root[data-theme="midnight"] .credits-list a:focus-visible {
  background: linear-gradient(#274861, #193047) !important;
  color: color-mix(in srgb, var(--role-accent, #79b8e0) 70%, #ffffff) !important;
}

:root[data-theme="midnight"] .credits-empty,
:root[data-theme="midnight"] .credits-loading {
  color: #cfe4f4 !important;
}

:root[data-theme="midnight"] .special-thanks-list li strong,
:root[data-theme="midnight"] .special-thanks-list li a {
  color: inherit !important;
}

:root[data-theme="midnight"] .faq-list,
:root[data-theme="midnight"] .bbcode-spoiler {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .faq-item,
:root[data-theme="midnight"] .bbcode-spoiler summary {
  background: linear-gradient(#22394f, #172b3e) !important;
  border: 1px solid #466a85 !important;
  color: #f2faff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08) !important;
}

:root[data-theme="midnight"] .faq-item:hover,
:root[data-theme="midnight"] .bbcode-spoiler summary:hover {
  background: linear-gradient(#294c66, #1b344a) !important;
  border-color: #79b8e0 !important;
}

:root[data-theme="midnight"] .faq-item .bbcode-spoiler-content,
:root[data-theme="midnight"] .bbcode-spoiler-content {
  background: #122333 !important;
  border: 1px solid #466a85 !important;
  border-top: 0 !important;
  color: #e8f6ff !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .faq-item .bbcode-spoiler-content p,
:root[data-theme="midnight"] .bbcode-spoiler-content p {
  color: #e8f6ff !important;
}

:root[data-theme="midnight"] .members-controls,
:root[data-theme="midnight"] .members-tabs,
:root[data-theme="midnight"] .members-grid,
:root[data-theme="midnight"] .legacy-members-panel {
  background: transparent !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .members-list-columns {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #a9c4d8 !important;
}

:root[data-theme="midnight"] .member-row {
  background: linear-gradient(#1b2f43, #152739) !important;
  border: 1px solid #385872 !important;
  color: #f4fbff !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .member-row:hover,
:root[data-theme="midnight"] .member-row:focus-within {
  border-color: #79b8e0 !important;
  box-shadow: 0 0 0 1px rgba(121,184,224,0.22) !important;
}

:root[data-theme="midnight"] .member-role,
:root[data-theme="midnight"] .member-row span {
  color: inherit;
}

:root[data-theme="midnight"] .member-role[style*="#000"],
:root[data-theme="midnight"] .member-role[style*="black"],
:root[data-theme="midnight"] .member-name[style*="#000"],
:root[data-theme="midnight"] .member-name[style*="black"] {
  color: #ffffff !important;
}

:root[data-theme="midnight"] .member-role[style*="#666"],
:root[data-theme="midnight"] .member-role[style*="#555"],
:root[data-theme="midnight"] .member-name[style*="#666"],
:root[data-theme="midnight"] .member-name[style*="#555"] {
  color: #b9c9d8 !important;
}

:root[data-theme="midnight"] .profile-actions {
  background: rgba(18,34,49,0.92) !important;
  border-color: #5d88a6 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.1),
    0 2px 8px rgba(0,0,0,0.28) !important;
}

:root[data-theme="midnight"] .profile-actions-btn,
:root[data-theme="midnight"] .banner-actions-btn,
:root[data-theme="midnight"] .action-btn,
:root[data-theme="midnight"] .profile-actions button {
  background: transparent !important;
  border-color: transparent !important;
  color: #bfe8ff !important;
}

:root[data-theme="midnight"] .profile-actions-btn:hover,
:root[data-theme="midnight"] .banner-actions-btn:hover,
:root[data-theme="midnight"] .action-btn:hover,
:root[data-theme="midnight"] .profile-actions button:hover {
  background: rgba(121,184,224,0.18) !important;
  color: #ffffff !important;
}

:root[data-theme="midnight"] .profile-actions img,
:root[data-theme="midnight"] .profile-actions svg,
:root[data-theme="midnight"] .profile-actions i,
:root[data-theme="midnight"] .profile-actions-btn img,
:root[data-theme="midnight"] .banner-actions-btn img,
:root[data-theme="midnight"] .action-btn img,
:root[data-theme="midnight"] .action-btn svg,
:root[data-theme="midnight"] .action-btn i {
  opacity: 1 !important;
  color: #bfe8ff !important;
  filter: brightness(0) saturate(100%) invert(84%) sepia(28%) saturate(651%) hue-rotate(168deg) brightness(103%) contrast(101%) !important;
}

:root[data-theme="midnight"] .action-dropdown,
:root[data-theme="midnight"] .profile-dropdown {
  background: linear-gradient(#21394e, #142638) !important;
  border-color: #5d88a6 !important;
  box-shadow: 0 8px 22px rgba(0,0,0,0.4) !important;
}

:root[data-theme="midnight"] .action-dropdown a,
:root[data-theme="midnight"] .action-dropdown button,
:root[data-theme="midnight"] .profile-dropdown a {
  color: #eaf8ff !important;
  border-bottom-color: rgba(143,208,255,0.18) !important;
}

:root[data-theme="midnight"] .action-dropdown a:hover,
:root[data-theme="midnight"] .action-dropdown button:hover,
:root[data-theme="midnight"] .profile-dropdown a:hover {
  background: rgba(121,184,224,0.18) !important;
  box-shadow: inset 3px 0 0 #79b8e0 !important;
}

:root[data-theme="midnight"] .comment.pinned-comment,
:root[data-theme="midnight"] .reply.pinned-comment,
:root[data-theme="midnight"] .level-comment.pinned-comment,
:root[data-theme="midnight"] .history-entry.pinned-comment {
  background: linear-gradient(#1b2f43, #152739) !important;
  border-color: #e0bd4f !important;
  box-shadow:
    0 0 0 1px rgba(224,189,79,0.28),
    0 3px 10px rgba(0,0,0,0.24) !important;
}

:root[data-theme="midnight"] .comment.deleted-comment,
:root[data-theme="midnight"] .reply.deleted-comment,
:root[data-theme="midnight"] .level-comment.deleted-comment,
:root[data-theme="midnight"] .history-entry.deleted-comment {
  background: linear-gradient(#282638, #1a2332) !important;
  border-color: #d96a74 !important;
  box-shadow:
    0 0 0 1px rgba(217,106,116,0.22),
    0 3px 10px rgba(0,0,0,0.24) !important;
}

:root[data-theme="midnight"] .comment.private-comment,
:root[data-theme="midnight"] .reply.private-comment,
:root[data-theme="midnight"] .level-comment.private-comment,
:root[data-theme="midnight"] .history-entry.private-comment,
:root[data-theme="midnight"] .comment.locked-comment,
:root[data-theme="midnight"] .reply.locked-comment,
:root[data-theme="midnight"] .level-comment.locked-comment,
:root[data-theme="midnight"] .announcement-card.locked {
  background: linear-gradient(#1d3448, #142638) !important;
  border-color: #79b8e0 !important;
  box-shadow:
    0 0 0 1px rgba(121,184,224,0.18),
    0 3px 10px rgba(0,0,0,0.2) !important;
}

:root[data-theme="midnight"] .deleted-comment::before,
:root[data-theme="midnight"] .pinned-comment::before,
:root[data-theme="midnight"] .private-comment::before,
:root[data-theme="midnight"] .locked-comment::before,
:root[data-theme="midnight"] .comment-status,
:root[data-theme="midnight"] .comment-visibility-label,
:root[data-theme="midnight"] .visibility-label {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .deleted-comment::before,
:root[data-theme="midnight"] .deleted-label,
:root[data-theme="midnight"] .announcement-deleted-badge {
  color: #ff9aa4 !important;
}

:root[data-theme="midnight"] .pinned-comment::before,
:root[data-theme="midnight"] .pinned-label,
:root[data-theme="midnight"] .pinned-badge {
  color: #ffd95f !important;
}

:root[data-theme="midnight"] .private-comment::before,
:root[data-theme="midnight"] .locked-comment::before,
:root[data-theme="midnight"] .private-label,
:root[data-theme="midnight"] .locked-label,
:root[data-theme="midnight"] .locked-badge,
:root[data-theme="midnight"] .private-locked-badge,
:root[data-theme="midnight"] .announcement-locked-badge {
  color: #9bdcff !important;
}

:root[data-theme="midnight"] .pagination button:not(.active):not(:disabled):hover,
:root[data-theme="midnight"] .levels-pagination button:not(.active):not(:disabled):hover,
:root[data-theme="midnight"] .staff-pagination .page-button:not(.active):not(.disabled):hover,
:root[data-theme="midnight"] .thread-pagination button:not(.active):not(:disabled):hover,
:root[data-theme="midnight"] .pagination-jump button:not(:disabled):hover {
  background: linear-gradient(#2c536e, #1c354b) !important;
  border-color: #8fd0ff !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.16),
    0 3px 8px rgba(0,0,0,0.28) !important;
  transform: none !important;
}

:root[data-theme="midnight"] .level-status-row-badge,
:root[data-theme="midnight"] .level-status-card-badge {
  background: rgba(18,34,49,0.92) !important;
  border: 1px solid #5d88a6 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.1),
    0 1px 5px rgba(0,0,0,0.3) !important;
}

:root[data-theme="midnight"] .level-status-row-badge img,
:root[data-theme="midnight"] .level-status-card-badge img {
  opacity: 1 !important;
}

:root[data-theme="midnight"] .level-status-featured img,
:root[data-theme="midnight"] .favorite-level.active img,
:root[data-theme="midnight"] .feature-level.active img {
  filter: brightness(0) saturate(100%) invert(91%) sepia(85%) saturate(982%) hue-rotate(356deg) brightness(108%) contrast(105%) !important;
}

:root[data-theme="midnight"] .level-status-deleted img {
  filter: brightness(0) saturate(100%) invert(65%) sepia(49%) saturate(1024%) hue-rotate(309deg) brightness(101%) contrast(101%) drop-shadow(0 0 3px rgba(255,143,153,0.45)) !important;
}

:root[data-theme="midnight"] .level-status-private img,
:root[data-theme="midnight"] .level-status-locked img {
  filter: brightness(0) saturate(100%) invert(85%) sepia(20%) saturate(1018%) hue-rotate(168deg) brightness(103%) contrast(101%) drop-shadow(0 0 3px rgba(155,220,255,0.45)) !important;
}

:root[data-theme="midnight"] .level-status-duplicate img {
  filter: brightness(0) saturate(100%) invert(78%) sepia(31%) saturate(1087%) hue-rotate(206deg) brightness(103%) contrast(101%) drop-shadow(0 0 3px rgba(198,177,255,0.4)) !important;
}

:root[data-theme="midnight"] .level-status-blacklisted img {
  filter: brightness(0) saturate(100%) invert(67%) sepia(71%) saturate(683%) hue-rotate(344deg) brightness(102%) contrast(101%) drop-shadow(0 0 3px rgba(255,188,100,0.38)) !important;
}

:root[data-theme="midnight"] .level-browse-thumb,
:root[data-theme="midnight"] .levels-card-grid .level-browse-thumb,
:root[data-theme="midnight"] .level-thumbnail-preview,
:root[data-theme="midnight"] .level-detail-thumb {
  overflow: hidden !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-browse-thumb.has-thumbnail img,
:root[data-theme="midnight"] .levels-card-grid .level-browse-thumb img[src],
:root[data-theme="midnight"] .level-browse-thumb.has-thumbnail img,
:root[data-theme="midnight"] .level-thumbnail-preview.has-thumbnail img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  max-height: none !important;
  object-fit: cover !important;
  object-position: center !important;
}

/* Remove accidental side-band panels on dark pages. The classic theme uses one uninterrupted card surface. */
:root[data-theme="midnight"] .box-inner.single-column,
:root[data-theme="midnight"] .content-page .single-column,
:root[data-theme="midnight"] .content-page .box-inner.single-column,
:root[data-theme="midnight"] .members-page .box-inner.single-column,
:root[data-theme="midnight"] .notifications-page .box-inner.single-column,
:root[data-theme="midnight"] .levels-page .box-inner.single-column,
:root[data-theme="midnight"] .level-portal-page .box-inner.single-column {
  background: #1a2f42 !important;
  background-image: none !important;
}

:root[data-theme="midnight"] .box-inner.single-column::before,
:root[data-theme="midnight"] .box-inner.single-column::after,
:root[data-theme="midnight"] .content-page .single-column::before,
:root[data-theme="midnight"] .content-page .single-column::after {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Single-column pages should render as one continuous panel, matching the classic theme. */
:root[data-theme="midnight"] .box-inner.single-column,
:root[data-theme="midnight"] .box-inner.single-column > .text,
:root[data-theme="midnight"] .single-column .text,
:root[data-theme="midnight"] .content-page .single-column,
:root[data-theme="midnight"] .content-page .box-inner.single-column,
:root[data-theme="midnight"] .content-page .box-inner.single-column > .text,
:root[data-theme="midnight"] .content-page .single-column .text,
:root[data-theme="midnight"] .members-page .box-inner.single-column,
:root[data-theme="midnight"] .members-page .box-inner.single-column > .text,
:root[data-theme="midnight"] .members-page .single-column .text,
:root[data-theme="midnight"] .notifications-page .box-inner.single-column,
:root[data-theme="midnight"] .notifications-page .box-inner.single-column > .text,
:root[data-theme="midnight"] .levels-page .box-inner.single-column,
:root[data-theme="midnight"] .levels-page .box-inner.single-column > .text,
:root[data-theme="midnight"] .level-portal-page .box-inner.single-column,
:root[data-theme="midnight"] .level-portal-page .box-inner.single-column > .text {
  background: #1b3144 !important;
  background-color: #1b3144 !important;
  background-image: none !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .box-inner.single-column > .text,
:root[data-theme="midnight"] .single-column .text,
:root[data-theme="midnight"] .content-page .single-column .text,
:root[data-theme="midnight"] .members-page .single-column .text,
:root[data-theme="midnight"] .notifications-page .single-column .text,
:root[data-theme="midnight"] .levels-page .single-column .text,
:root[data-theme="midnight"] .level-portal-page .single-column .text {
  max-width: none !important;
  width: 100% !important;
}

/* Global structural panel surface. Keep .box and direct layout wrappers identical so no side strips leak through. */
:root[data-theme="midnight"] {
  --midnight-box-surface: #1b3144;
}

:root[data-theme="midnight"] .box,
:root[data-theme="midnight"] .content-page .box,
:root[data-theme="midnight"] .members-page .box,
:root[data-theme="midnight"] .profile-page .box,
:root[data-theme="midnight"] .staff-dashboard-page .box,
:root[data-theme="midnight"] .legacy-dashboard-page .box,
:root[data-theme="midnight"] .announcements-page .box,
:root[data-theme="midnight"] .notifications-page .box,
:root[data-theme="midnight"] .levels-page .box,
:root[data-theme="midnight"] .level-detail-page .box,
:root[data-theme="midnight"] .level-portal-page .box,
:root[data-theme="midnight"] .games-page .box {
  background: var(--midnight-box-surface) !important;
  background-color: var(--midnight-box-surface) !important;
  background-image: none !important;
}

:root[data-theme="midnight"] .box > .box-inner,
:root[data-theme="midnight"] .box > .box-inner.single-column,
:root[data-theme="midnight"] .box > .box-inner.full-width,
:root[data-theme="midnight"] .box > .box-inner > .text,
:root[data-theme="midnight"] .box > .box-inner.single-column > .text,
:root[data-theme="midnight"] .box > .box-inner.full-width > .text,
:root[data-theme="midnight"] .box > .box-inner > .align-left,
:root[data-theme="midnight"] .box > .box-inner.single-column > .align-left {
  background: var(--midnight-box-surface) !important;
  background-color: var(--midnight-box-surface) !important;
  background-image: none !important;
}

/* Hover keeps the same surface as classic — only the shadow deepens
   (see :root[data-theme="midnight"] .box:hover above). */

/* Final shared surface scale. */
:root[data-theme="midnight"] {
  --midnight-page-bg: #132636;
  --midnight-wrapper-surface: #172b3d;
  --midnight-box-surface: #1b3144;
  --midnight-footer-surface: #172432;
  --midnight-footer-bottom: #0b1118;
}

:root[data-theme="midnight"],
:root[data-theme="midnight"] html,
:root[data-theme="midnight"] body,
:root[data-theme="midnight"] .main-content {
  background: var(--midnight-page-bg) !important;
  background-color: var(--midnight-page-bg) !important;
  background-image: none !important;
}

:root[data-theme="midnight"] body {
  background: var(--midnight-page-bg) !important;
  background-color: var(--midnight-page-bg) !important;
  background-image: none !important;
}

:root[data-theme="midnight"] .page-wrapper,
:root[data-theme="midnight"] .auth-wrapper,
:root[data-theme="midnight"] .nav-wrapper.jump-bar {
  background: var(--midnight-wrapper-surface) !important;
  background-color: var(--midnight-wrapper-surface) !important;
  background-image: none !important;
  border-color: #3f6078 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.07),
    0 8px 22px rgba(0,0,0,0.32) !important;
}

:root[data-theme="midnight"] .nav-wrapper.jump-bar .subnav {
  background: transparent !important;
  background-color: transparent !important;
}

:root[data-theme="midnight"] .footer,
:root[data-theme="midnight"] .footer-section {
  background: var(--midnight-footer-surface) !important;
  background-color: var(--midnight-footer-surface) !important;
  background-image: none !important;
}

:root[data-theme="midnight"] .footer-bottom {
  background: var(--midnight-footer-bottom) !important;
  background-color: var(--midnight-footer-bottom) !important;
  background-image: none !important;
  box-shadow: 0 100vh 0 100vh var(--midnight-footer-bottom) !important;
}

/* Classic-layout alignment for Midnight Castle.
   Keep this theme as a darker recolor of the default theme, not a behavioral redesign. */
:root[data-theme="midnight"] {
  --midnight-page-bg: #13293a;
  --midnight-wrapper-surface: #1a3043;
  --midnight-box-surface: #1f3a50;
  --midnight-panel-surface: #1f3a50;
  --midnight-control-surface: #0d1a25;
  --midnight-control-hover: #234860;
  --midnight-border: #5f86a3;
  --midnight-rule: #8ab4cf;
  --midnight-text: #f5fbff;
  --midnight-muted: #9fb9ca;
}

:root[data-theme="midnight"],
:root[data-theme="midnight"] body,
:root[data-theme="midnight"] .main-content {
  background: var(--midnight-page-bg) !important;
  background-color: var(--midnight-page-bg) !important;
  background-image: none !important;
}

:root[data-theme="midnight"] .page-wrapper,
:root[data-theme="midnight"] .auth-wrapper,
:root[data-theme="midnight"] .nav-wrapper.jump-bar {
  background: var(--midnight-wrapper-surface) !important;
  background-color: var(--midnight-wrapper-surface) !important;
  background-image: none !important;
  border-color: #50748c !important;
}

:root[data-theme="midnight"] .box,
:root[data-theme="midnight"] .box > .box-inner,
:root[data-theme="midnight"] .box > .box-inner.single-column,
:root[data-theme="midnight"] .box > .box-inner.full-width,
:root[data-theme="midnight"] .box > .box-inner > .text,
:root[data-theme="midnight"] .box > .box-inner.single-column > .text,
:root[data-theme="midnight"] .box > .box-inner.full-width > .text,
:root[data-theme="midnight"] .box > .box-inner > .align-left,
:root[data-theme="midnight"] .content-page .box-inner.single-column,
:root[data-theme="midnight"] .content-page .box-inner.single-column > .text,
:root[data-theme="midnight"] .members-page .box-inner.single-column,
:root[data-theme="midnight"] .members-page .box-inner.single-column > .text,
:root[data-theme="midnight"] .profile-page .box-inner.full-width,
:root[data-theme="midnight"] .profile-page .box-inner.full-width > .text,
:root[data-theme="midnight"] .staff-dashboard-page .box-inner,
:root[data-theme="midnight"] .legacy-dashboard-page .box-inner,
:root[data-theme="midnight"] .announcements-page .box-inner,
:root[data-theme="midnight"] .notifications-page .box-inner,
:root[data-theme="midnight"] .levels-page .box-inner,
:root[data-theme="midnight"] .level-portal-page .box-inner,
:root[data-theme="midnight"] .games-page .box-inner {
  background: var(--midnight-box-surface) !important;
  background-color: var(--midnight-box-surface) !important;
  background-image: none !important;
}

:root[data-theme="midnight"] button,
:root[data-theme="midnight"] button:hover,
:root[data-theme="midnight"] button:active,
:root[data-theme="midnight"] a.main-btn,
:root[data-theme="midnight"] a.main-btn:hover,
:root[data-theme="midnight"] .main-btn,
:root[data-theme="midnight"] .main-btn:hover,
:root[data-theme="midnight"] .control-btn,
:root[data-theme="midnight"] .control-btn:hover,
:root[data-theme="midnight"] .level-action,
:root[data-theme="midnight"] .level-action:hover,
:root[data-theme="midnight"] .levels-button,
:root[data-theme="midnight"] .levels-button:hover,
:root[data-theme="midnight"] .staff-button,
:root[data-theme="midnight"] .staff-button:hover,
:root[data-theme="midnight"] .play-btn,
:root[data-theme="midnight"] .play-btn:hover,
:root[data-theme="midnight"] .pagination button,
:root[data-theme="midnight"] .pagination button:hover,
:root[data-theme="midnight"] .levels-pagination button,
:root[data-theme="midnight"] .levels-pagination button:hover,
:root[data-theme="midnight"] .staff-pagination .page-button,
:root[data-theme="midnight"] .staff-pagination .page-button:hover,
:root[data-theme="midnight"] .thread-pagination button,
:root[data-theme="midnight"] .thread-pagination button:hover,
:root[data-theme="midnight"] .pagination-jump button,
:root[data-theme="midnight"] .pagination-jump button:hover {
  transform: none !important;
}

:root[data-theme="midnight"] .tab-btn,
:root[data-theme="midnight"] .tab-btn:hover,
:root[data-theme="midnight"] .tabs a,
:root[data-theme="midnight"] .tabs a:hover,
:root[data-theme="midnight"] .tabs button,
:root[data-theme="midnight"] .tabs button:hover,
:root[data-theme="midnight"] .sub-tabs a,
:root[data-theme="midnight"] .sub-tabs a:hover,
:root[data-theme="midnight"] .sub-tabs button,
:root[data-theme="midnight"] .sub-tabs button:hover,
:root[data-theme="midnight"] .profile-tabs a,
:root[data-theme="midnight"] .profile-tabs a:hover,
:root[data-theme="midnight"] .edit-profile-tabs a,
:root[data-theme="midnight"] .edit-profile-tabs a:hover,
:root[data-theme="midnight"] .settings-tabs a,
:root[data-theme="midnight"] .settings-tabs a:hover {
  background: transparent !important;
  background-color: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: #8faabc !important;
  opacity: 1 !important;
  transform: none !important;
}

:root[data-theme="midnight"] .tabs,
:root[data-theme="midnight"] .sub-tabs,
:root[data-theme="midnight"] .profile-tabs,
:root[data-theme="midnight"] .edit-profile-tabs,
:root[data-theme="midnight"] .settings-tabs {
  border-bottom-color: var(--midnight-rule) !important;
}

:root[data-theme="midnight"] .tab-btn:hover,
:root[data-theme="midnight"] .tabs a:hover,
:root[data-theme="midnight"] .tabs button:hover,
:root[data-theme="midnight"] .sub-tabs a:hover,
:root[data-theme="midnight"] .sub-tabs button:hover,
:root[data-theme="midnight"] .profile-tabs a:hover,
:root[data-theme="midnight"] .edit-profile-tabs a:hover,
:root[data-theme="midnight"] .settings-tabs a:hover {
  color: #d7edf9 !important;
}

:root[data-theme="midnight"] .tab-btn.active,
:root[data-theme="midnight"] .tabs a.active,
:root[data-theme="midnight"] .tabs button.active,
:root[data-theme="midnight"] .sub-tabs a.active,
:root[data-theme="midnight"] .sub-tabs button.active,
:root[data-theme="midnight"] .profile-tabs a.active,
:root[data-theme="midnight"] .edit-profile-tabs a.active,
:root[data-theme="midnight"] .settings-tabs a.active {
  color: #ffffff !important;
}

:root[data-theme="midnight"] .tab-btn.active::after,
:root[data-theme="midnight"] .tabs a.active::after,
:root[data-theme="midnight"] .tabs button.active::after,
:root[data-theme="midnight"] .sub-tabs a.active::after,
:root[data-theme="midnight"] .sub-tabs button.active::after,
:root[data-theme="midnight"] .profile-tabs a.active::after,
:root[data-theme="midnight"] .edit-profile-tabs a.active::after,
:root[data-theme="midnight"] .settings-tabs a.active::after {
  background: var(--primary) !important;
}

:root[data-theme="midnight"] .notification-bell,
:root[data-theme="midnight"] .mobile-notification-bell {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .profile-page .profile-banner,
:root[data-theme="midnight"] .profile-page .profile-banner-inner,
:root[data-theme="midnight"] .profile-page .profile-summary,
:root[data-theme="midnight"] .profile-page .profile-description,
:root[data-theme="midnight"] .profile-page .profile-info-card,
:root[data-theme="midnight"] .profile-page .profile-music-card,
:root[data-theme="midnight"] .profile-page .connected-accounts-card,
:root[data-theme="midnight"] .profile-page .legacy-profile-card,
:root[data-theme="midnight"] .profile-page .profile-comment,
:root[data-theme="midnight"] .profile-page .comment-card,
:root[data-theme="midnight"] .comment-card,
:root[data-theme="midnight"] .reply-card {
  background: var(--midnight-box-surface) !important;
  background-color: var(--midnight-box-surface) !important;
  background-image: none !important;
  border-color: #50748c !important;
  color: var(--midnight-text) !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .profile-page .profile-music-card,
:root[data-theme="midnight"] .profile-page .profile-audio-player,
:root[data-theme="midnight"] .profile-page .music-player,
:root[data-theme="midnight"] .profile-page .audio-player {
  background: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .profile-banner-controls,
:root[data-theme="midnight"] .profile-banner-controls button,
:root[data-theme="midnight"] .profile-banner-controls a,
:root[data-theme="midnight"] .profile-actions,
:root[data-theme="midnight"] .profile-actions button,
:root[data-theme="midnight"] .profile-actions a,
:root[data-theme="midnight"] .comment-actions,
:root[data-theme="midnight"] .comment-actions button,
:root[data-theme="midnight"] .comment-actions a {
  background: transparent !important;
  background-color: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .profile-banner-controls img,
:root[data-theme="midnight"] .profile-actions img,
:root[data-theme="midnight"] .comment-actions img,
:root[data-theme="midnight"] .censor-toggle img,
:root[data-theme="midnight"] .legacy-censor-toggle img {
  filter: brightness(0) saturate(100%) invert(86%) sepia(19%) saturate(880%) hue-rotate(169deg) brightness(101%) contrast(95%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .bbcode-spoiler {
  background: var(--midnight-box-surface) !important;
  background-image: none !important;
  border: 1px solid #50748c !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .bbcode-spoiler summary {
  background: var(--button-bg) !important;
  border: 0 !important;
  border-bottom: 1px solid #50748c !important;
  box-shadow: var(--button-shadow) !important;
  color: var(--button-text) !important;
}

:root[data-theme="midnight"] .bbcode-spoiler summary:hover {
  background: var(--button-hover-bg) !important;
  color: var(--button-hover-text) !important;
}

:root[data-theme="midnight"] .bbcode-spoiler-content {
  background: var(--midnight-box-surface) !important;
  background-image: none !important;
  border: 0 !important;
  color: var(--midnight-text) !important;
}

:root[data-theme="midnight"] .profile-comment.pinned,
:root[data-theme="midnight"] .comment-card.pinned {
  border-color: #f4c950 !important;
}

:root[data-theme="midnight"] .profile-comment.deleted,
:root[data-theme="midnight"] .comment-card.deleted {
  background: #2a2b3a !important;
  border-color: #cf6472 !important;
}

:root[data-theme="midnight"] .profile-comment.private,
:root[data-theme="midnight"] .comment-card.private {
  border-color: #79b8e0 !important;
}

:root[data-theme="midnight"] .profile-comment.locked,
:root[data-theme="midnight"] .comment-card.locked {
  border-color: #9fb9ca !important;
}

:root[data-theme="midnight"] .profile-page .box,
:root[data-theme="midnight"] .profile-page .box > .box-inner,
:root[data-theme="midnight"] .profile-page .box > .box-inner.full-width,
:root[data-theme="midnight"] .legacy-profile-page .box,
:root[data-theme="midnight"] .legacy-profile-page .box > .box-inner,
:root[data-theme="midnight"] .legacy-profile-page .box > .box-inner.full-width {
  background: var(--midnight-box-surface) !important;
  background-color: var(--midnight-box-surface) !important;
  background-image: none !important;
}

:root[data-theme="midnight"] .profile-page .profile-card,
:root[data-theme="midnight"] .legacy-profile-page .profile-card {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] #tipsModal .navigation-tips-modal-content,
:root[data-theme="midnight"] #tipsModal .help-body,
:root[data-theme="midnight"] #tipsModal .tips-modal-body,
:root[data-theme="midnight"] #tipsModal .rates-list,
:root[data-theme="midnight"] #tipsModal .tips-modal-list,
:root[data-theme="midnight"] #tipsModal .tips-modal-editor {
  background: var(--midnight-box-surface) !important;
  background-color: var(--midnight-box-surface) !important;
  background-image: none !important;
  color: var(--midnight-text) !important;
}

:root[data-theme="midnight"] #tipsModal .dashboard-tip-form,
:root[data-theme="midnight"] #tipsModal .dashboard-tip-form.level-form-section {
  background: var(--midnight-box-surface) !important;
  background-color: var(--midnight-box-surface) !important;
  background-image: none !important;
  border: 1px solid #50748c !important;
  border-radius: 8px !important;
  box-shadow: none !important;
  color: var(--midnight-text) !important;
}

:root[data-theme="midnight"] #tipsModal .dashboard-tip-form .level-field,
:root[data-theme="midnight"] #tipsModal .dashboard-tip-form label,
:root[data-theme="midnight"] #tipsModal .dashboard-tip-char-count {
  background: transparent !important;
  background-image: none !important;
  color: var(--midnight-text) !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] #tipsModal .dashboard-tip-form input,
:root[data-theme="midnight"] #tipsModal .dashboard-tip-form textarea {
  background: var(--midnight-control-surface) !important;
  background-color: var(--midnight-control-surface) !important;
  background-image: none !important;
  border-color: #5f86a3 !important;
  color: var(--midnight-text) !important;
  box-shadow: inset 0 1px 2px rgba(0,0,0,0.3) !important;
}

:root[data-theme="midnight"] #tipsModal .dashboard-tip-form input::placeholder,
:root[data-theme="midnight"] #tipsModal .dashboard-tip-form textarea::placeholder {
  color: var(--midnight-muted) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] #tipsModal .tip-item,
:root[data-theme="midnight"] #tipsModal .dashboard-list-item,
:root[data-theme="midnight"] #tipsModal .tips-modal-item,
:root[data-theme="midnight"] #tipsModal .tips-modal-message {
  background: var(--midnight-box-surface) !important;
  background-color: var(--midnight-box-surface) !important;
  background-image: none !important;
  border-color: #50748c !important;
  border-left-color: #7fb5d6 !important;
  color: var(--midnight-text) !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] #tipsModal .tip-item strong,
:root[data-theme="midnight"] #tipsModal .dashboard-list-item strong,
:root[data-theme="midnight"] #tipsModal .tips-modal-item h3,
:root[data-theme="midnight"] #tipsModal .tip-item span,
:root[data-theme="midnight"] #tipsModal .dashboard-list-item span,
:root[data-theme="midnight"] #tipsModal .tips-modal-item p {
  color: var(--midnight-text) !important;
}

/* Dark theme cleanup: match the classic layout instead of adding extra dark-only boxes. */
:root[data-theme="midnight"] #tipsModal .dashboard-tip-form,
:root[data-theme="midnight"] #tipsModal .dashboard-tip-form.level-form-section {
  margin-top: 12px !important;
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] #tipsModal .dashboard-tip-form .level-field,
:root[data-theme="midnight"] #tipsModal .dashboard-tip-form .dashboard-tip-form-actions {
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .page-loading-panel,
:root[data-theme="midnight"] .page-loading-message,
:root[data-theme="midnight"] .home-loading-wrapper .page-loading-panel,
:root[data-theme="midnight"] .level-page-loading-wrapper .page-loading-panel,
:root[data-theme="midnight"] .profile-page-loading-wrapper .page-loading-panel {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .page-loading-panel {
  padding: 0 !important;
}

:root[data-theme="midnight"] .page-loading-message {
  padding: 18px !important;
  color: var(--midnight-text) !important;
}

/* Profile dark theme: keep profile.css in charge of the layout and only map
   the normal light surfaces to midnight colors. */
:root[data-theme="midnight"] {
  --midnight-profile-surface: #1f3a50;
  --midnight-profile-field: #142a3c;
}

:root[data-theme="midnight"] .page-wrapper:has(.profile-card) {
  background: var(--midnight-page) !important;
  background-color: var(--midnight-page) !important;
  background-image: none !important;
}

:root[data-theme="midnight"] .page-wrapper:has(.profile-card) .box,
:root[data-theme="midnight"] .page-wrapper:has(.profile-card) .box > .box-inner,
:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card),
:root[data-theme="midnight"] .profile-page .box > .box-inner.full-width:has(> .profile-card),
:root[data-theme="midnight"] .legacy-profile-page .box > .box-inner.full-width:has(> .profile-card) {
  background: var(--midnight-profile-surface) !important;
  background-color: var(--midnight-profile-surface) !important;
  background-image: none !important;
}

:root[data-theme="midnight"] .page-wrapper:has(.profile-card) .container,
:root[data-theme="midnight"] .page-wrapper:has(.profile-card) .profile-page-wrapper {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: var(--midnight-border) !important;
}

:root[data-theme="midnight"] .page-wrapper:has(.profile-card) .box-inner.full-width {
  align-items: stretch !important;
}

:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) > .profile-card,
:root[data-theme="midnight"] .profile-page .box-inner.full-width:has(> .profile-card) > .profile-card,
:root[data-theme="midnight"] .legacy-profile-page .box-inner.full-width:has(> .profile-card) > .profile-card {
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: none !important;
  padding: 0 30px 10px 30px !important;
  margin-left: -38px !important;
  margin-right: -38px !important;
  background: var(--midnight-profile-surface) !important;
  background-color: var(--midnight-profile-surface) !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-card > *,
:root[data-theme="midnight"] .profile-page .box-inner.full-width:has(> .profile-card) .profile-card > *,
:root[data-theme="midnight"] .legacy-profile-page .box-inner.full-width:has(> .profile-card) .profile-card > * {
  box-sizing: border-box !important;
  max-width: none !important;
}

:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-content,
:root[data-theme="midnight"] .profile-page .profile-content,
:root[data-theme="midnight"] .legacy-profile-page .profile-content {
  width: 100% !important;
  max-width: none !important;
  background: var(--midnight-profile-surface) !important;
  background-color: var(--midnight-profile-surface) !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-body,
:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) #profile-music,
:root[data-theme="midnight"] .profile-page .profile-body,
:root[data-theme="midnight"] .profile-page #profile-music,
:root[data-theme="midnight"] .legacy-profile-page .profile-body,
:root[data-theme="midnight"] .legacy-profile-page #profile-music {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-body,
:root[data-theme="midnight"] .profile-page .profile-body,
:root[data-theme="midnight"] .legacy-profile-page .profile-body {
  display: flex !important;
  gap: 20px !important;
  align-items: flex-start !important;
  width: 100% !important;
  max-width: none !important;
}

:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-main,
:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-sidebar,
:root[data-theme="midnight"] .profile-page .profile-main,
:root[data-theme="midnight"] .profile-page .profile-sidebar,
:root[data-theme="midnight"] .legacy-profile-page .profile-main,
:root[data-theme="midnight"] .legacy-profile-page .profile-sidebar {
  display: flex !important;
  height: var(--profile-summary-height) !important;
}

:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-main,
:root[data-theme="midnight"] .profile-page .profile-main,
:root[data-theme="midnight"] .legacy-profile-page .profile-main {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  position: relative !important;
}

:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-sidebar,
:root[data-theme="midnight"] .profile-page .profile-sidebar,
:root[data-theme="midnight"] .legacy-profile-page .profile-sidebar {
  flex: 0 0 320px !important;
  width: 320px !important;
}

:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-description,
:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-stats,
:root[data-theme="midnight"] .profile-page .profile-description,
:root[data-theme="midnight"] .profile-page .profile-stats,
:root[data-theme="midnight"] .legacy-profile-page .profile-description,
:root[data-theme="midnight"] .legacy-profile-page .profile-stats {
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100% !important;
}

:root[data-theme="midnight"] .profile-page .profile-main.description-expanded {
  height: auto !important;
}

:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-main.description-expanded {
  height: auto !important;
}

:root[data-theme="midnight"] .profile-page .profile-main.description-expanded .profile-description {
  height: auto !important;
  min-height: var(--profile-summary-height) !important;
  max-height: none !important;
  overflow: visible !important;
}

:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-main.description-expanded .profile-description {
  height: auto !important;
  min-height: var(--profile-summary-height) !important;
  max-height: none !important;
  overflow: visible !important;
}

:root[data-theme="midnight"] .profile-banner,
:root[data-theme="midnight"] .profile-description,
:root[data-theme="midnight"] .profile-stats,
:root[data-theme="midnight"] .profile-legacy-accounts,
:root[data-theme="midnight"] .profile-comment-form,
:root[data-theme="midnight"] .content-preview,
:root[data-theme="midnight"] .comment,
:root[data-theme="midnight"] .reply {
  background: var(--midnight-profile-field) !important;
  background-color: var(--midnight-profile-field) !important;
  background-image: none !important;
  border: 1px solid var(--midnight-border) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.07) !important;
}

:root[data-theme="midnight"] .profile-banner-inner {
  background-color: transparent !important;
}

:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-music-bar,
:root[data-theme="midnight"] .profile-page .profile-music-bar,
:root[data-theme="midnight"] .legacy-profile-page .profile-music-bar {
  display: grid !important;
  grid-template-columns: minmax(360px, 0.9fr) minmax(420px, 1fr) !important;
  align-items: center !important;
  gap: 14px !important;
  min-width: 0 !important;
  padding: 10px 14px !important;
  border: 1px solid #5f86a3 !important;
  border-radius: 6px !important;
  background: var(--midnight-profile-field) !important;
  background-color: var(--midnight-profile-field) !important;
  background-image: none !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.07) !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .profile-audio-player,
:root[data-theme="midnight"] .profile-music-controls {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .profile-audio-player {
  display: grid !important;
  grid-template-columns: repeat(3, 26px) minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 7px !important;
  padding: 0 !important;
}

:root[data-theme="midnight"] .profile-audio-player button,
:root[data-theme="midnight"] .profile-audio-player .music-icon-btn {
  width: 26px !important;
  height: 26px !important;
}

:root[data-theme="midnight"] .page-loading-message,
:root[data-theme="midnight"] .profile-loading-box {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

@media (max-width: 1100px) {
  :root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-music-bar,
  :root[data-theme="midnight"] .profile-page .profile-music-bar,
  :root[data-theme="midnight"] .legacy-profile-page .profile-music-bar {
    grid-template-columns: 1fr !important;
    gap: 8px !important;
  }
}

@media (max-width: 900px) {
  :root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) > .profile-card,
  :root[data-theme="midnight"] .profile-page .box-inner.full-width:has(> .profile-card) > .profile-card,
  :root[data-theme="midnight"] .legacy-profile-page .box-inner.full-width:has(> .profile-card) > .profile-card {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  :root[data-theme="midnight"] .profile-audio-player {
    grid-template-columns: repeat(3, 30px) minmax(0, 1fr) auto !important;
  }
}

/* Final profile/editor corrections: keep the classic layout, only recolor it. */
:root[data-theme="midnight"] body.profile-custom-background {
  background-color: var(--profile-page-background-color, #7fa6c1) !important;
  background-image: var(--profile-page-background-image) !important;
  background-size: var(--profile-page-background-size, auto) !important;
  background-repeat: var(--profile-page-background-repeat, repeat) !important;
  background-position: var(--profile-page-background-position, center center) !important;
  background-attachment: var(--profile-page-background-attachment, fixed) !important;
}

:root[data-theme="midnight"] body.edit-profile-background-preview {
  background-color: var(--edit-profile-background-color, #7fa6c1) !important;
  background-image: var(--edit-profile-background-image) !important;
  background-size: var(--edit-profile-background-size, auto) !important;
  background-repeat: var(--edit-profile-background-repeat, repeat) !important;
  background-position: var(--edit-profile-background-position, center center) !important;
  background-attachment: var(--edit-profile-background-attachment, fixed) !important;
}

:root[data-theme="midnight"] body.profile-custom-background .main-content,
:root[data-theme="midnight"] body.edit-profile-background-preview .main-content {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

:root[data-theme="midnight"] .page-wrapper:has(.profile-card),
:root[data-theme="midnight"] body.edit-profile-background-preview .page-wrapper {
  background: var(--midnight-wrapper-surface) !important;
  background-color: var(--midnight-wrapper-surface) !important;
  background-image: none !important;
  border-color: #50748c !important;
}

:root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) > .profile-card,
:root[data-theme="midnight"] .profile-page .box-inner.full-width:has(> .profile-card) > .profile-card,
:root[data-theme="midnight"] .legacy-profile-page .box-inner.full-width:has(> .profile-card) > .profile-card {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

:root[data-theme="midnight"] .background-panel,
:root[data-theme="midnight"] .background-controls,
:root[data-theme="midnight"] .background-image-controls {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .background-color-control input[type="color"] {
  background: #102536 !important;
  border: 1px solid var(--midnight-border) !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .background-color-control input[type="color"]::-webkit-color-swatch-wrapper {
  padding: 3px !important;
}

:root[data-theme="midnight"] .background-color-control input[type="color"]::-webkit-color-swatch {
  border: 0 !important;
  border-radius: 4px !important;
}

:root[data-theme="midnight"] .profile-user-block,
:root[data-theme="midnight"] .banner-preview-user-block,
:root[data-theme="midnight"] .profile-actions {
  background: rgba(7, 15, 23, 0.9) !important;
  border: 1px solid rgba(210,226,238,0.5) !important;
  box-shadow: 0 3px 10px rgba(0,0,0,0.35) !important;
  backdrop-filter: blur(3px);
}

:root[data-theme="midnight"] .profile-actions button,
:root[data-theme="midnight"] .profile-actions a {
  border: 0 !important;
  box-shadow: none !important;
}

/* Final dark-theme loading/music pass. Keep loading messages boxed and keep
   the profile music scrubber's played segment red. */
:root[data-theme="midnight"] .page-loading-panel,
:root[data-theme="midnight"] .home-loading-wrapper .page-loading-panel,
:root[data-theme="midnight"] .level-page-loading-wrapper .page-loading-panel,
:root[data-theme="midnight"] .profile-page-loading-wrapper .page-loading-panel {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  padding: 4px 0 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .page-loading-message,
:root[data-theme="midnight"] .home-loading-wrapper .page-loading-message,
:root[data-theme="midnight"] .level-page-loading-wrapper .page-loading-message,
:root[data-theme="midnight"] .profile-page-loading-wrapper .page-loading-message {
  box-sizing: border-box !important;
  width: 100% !important;
  padding: 18px !important;
  border: 1px solid var(--midnight-border) !important;
  border-radius: 8px !important;
  background: var(--midnight-profile-field) !important;
  color: var(--midnight-text) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.07) !important;
}

:root[data-theme="midnight"] #music-progress {
  background:
    linear-gradient(
      to right,
      #d60000 0%,
      #d60000 var(--progress, 0%),
      #08131d var(--progress, 0%),
      #08131d 100%
    ) !important;
  border: 1px solid #456980 !important;
}

/* Final levels dark-theme polish: icon badges stay icon-only, thumbnails match
   the classic shape, and level/detail/form panels avoid redundant inner boxes. */
:root[data-theme="midnight"] .level-status-row-badge,
:root[data-theme="midnight"] .level-status-card-badge,
:root[data-theme="midnight"] .levels-card-grid .level-status-card-badge,
:root[data-theme="midnight"] .level-status-row-badge:hover,
:root[data-theme="midnight"] .level-status-card-badge:hover {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

:root[data-theme="midnight"] .level-status-row-badge img,
:root[data-theme="midnight"] .level-status-card-badge img,
:root[data-theme="midnight"] .levels-card-grid .level-status-card-badge img {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .level-row:has(.level-status-duplicate),
:root[data-theme="midnight"] .level-row:has(.level-status-duplicate):not(:has(.level-status-blacklisted)) {
  background: rgba(157, 132, 216, 0.14) !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-browse-card:has(.level-status-duplicate) {
  background: linear-gradient(#281f2f, #201927) !important;
  border-color: rgba(207, 159, 255, 0.48) !important;
}

:root[data-theme="midnight"] .level-browse-thumb,
:root[data-theme="midnight"] .levels-card-grid .level-browse-thumb,
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section .level-detail-thumb,
:root[data-theme="midnight"] .level-thumbnail-preview,
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-modal-content .level-thumbnail-preview {
  background:
    linear-gradient(rgba(255,255,255,0.1), rgba(255,255,255,0)),
    linear-gradient(135deg, #28475b, #163044) !important;
  border-color: #78aeca !important;
  outline: 3px solid rgba(214,235,248,0.58) !important;
  outline-offset: -6px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.18), 0 2px 4px rgba(0,0,0,0.22) !important;
}

:root[data-theme="midnight"] .level-browse-thumb.no-thumbnail,
:root[data-theme="midnight"] .level-browse-thumb:not(.has-thumbnail),
:root[data-theme="midnight"] .level-detail-thumb.no-thumbnail,
:root[data-theme="midnight"] .level-thumbnail-preview:not(.has-thumbnail) {
  background:
    linear-gradient(rgba(255,255,255,0.1), rgba(255,255,255,0)),
    linear-gradient(135deg, #28475b, #163044) !important;
}

:root[data-theme="midnight"] .level-thumb-placeholder,
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section .level-detail-thumb > span:not(.level-thumbnail-fallback),
:root[data-theme="midnight"] .level-thumbnail-preview span {
  color: #f5fbff !important;
  text-shadow: 0 1px 2px rgba(0,0,0,0.38) !important;
}

:root[data-theme="midnight"] .level-browse-thumb img,
:root[data-theme="midnight"] .levels-card-grid .level-browse-thumb img,
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section .level-detail-thumb-image,
:root[data-theme="midnight"] .level-thumbnail-preview img,
:root[data-theme="midnight"] .levels-card-grid .level-browse-thumb.has-thumbnail img,
:root[data-theme="midnight"] .levels-card-grid .level-browse-thumb img[src],
:root[data-theme="midnight"] .level-browse-thumb.has-thumbnail img,
:root[data-theme="midnight"] .level-thumbnail-preview.has-thumbnail img {
  object-fit: contain !important;
  background: transparent !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-browse-title {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 4px !important;
}

:root[data-theme="midnight"] .level-duplicate-banner,
:root[data-theme="midnight"] .legacy-duplicate-original-preview {
  background: linear-gradient(#1b2d3e, #132536) !important;
  border-color: #5f86a3 !important;
  color: #d9ecf8 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.06) !important;
}

:root[data-theme="midnight"] .level-duplicate-banner strong,
:root[data-theme="midnight"] .legacy-duplicate-original-preview strong {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .level-duplicate-banner a,
:root[data-theme="midnight"] .legacy-duplicate-original-preview a {
  color: #bfe8ff !important;
}

:root[data-theme="midnight"] .level-detail-page .level-author-section,
:root[data-theme="midnight"] .level-detail-page .level-info-section,
:root[data-theme="midnight"] .level-detail-page .level-info-author,
:root[data-theme="midnight"] .level-detail-page .level-info-line,
:root[data-theme="midnight"] .level-detail-page .level-description-panel .level-description.profile-description,
:root[data-theme="midnight"] .level-detail-page .level-description-panel .level-description.profile-description.is-scrollable {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-top: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-description-panel .level-description.profile-description {
  border: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  color: var(--midnight-text) !important;
}

:root[data-theme="midnight"] .level-detail-page .level-info-line {
  border-bottom-color: rgba(138, 180, 207, 0.22) !important;
}

:root[data-theme="midnight"] .level-detail-page .level-thumbnail-edit-control {
  z-index: 20 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-thumbnail-edit-control .tooltip {
  z-index: 30 !important;
}

:root[data-theme="midnight"] .level-detail-page .comment-btn.censor-level-comment i,
:root[data-theme="midnight"] .level-detail-page .comment-btn.censor-level-comment svg {
  color: #bfe8ff !important;
  opacity: 1 !important;
  filter: none !important;
}

:root[data-theme="midnight"] .level-detail-page .comment-btn.censor-level-comment.active-censor i,
:root[data-theme="midnight"] .level-detail-page .comment-btn.censor-level-comment.active-censor svg,
:root[data-theme="midnight"] .level-detail-page .comment-btn.censor-level-comment:hover i,
:root[data-theme="midnight"] .level-detail-page .comment-btn.censor-level-comment:hover svg {
  color: #ff6666 !important;
}

:root[data-theme="midnight"] .level-form-page .level-form-section > .level-field,
:root[data-theme="midnight"] .level-form-page .level-thumbnail-section .level-field,
:root[data-theme="midnight"] .level-form-page .level-description-editor-section > .level-field,
:root[data-theme="midnight"] .legacy-duplicate-modal-body .level-field,
:root[data-theme="midnight"] .level-form-page #legacy-background-music-request-modal .legacy-background-music-request-body .level-field {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

/* Final requested cleanup: keep dark add/edit level forms divided by lines,
   not stacked field boxes; keep placeholder text plain; and match the user
   menu separators inside banner action menus. */
:root[data-theme="midnight"] .level-form-page .level-form-section,
:root[data-theme="midnight"] .level-form-page .level-game-picker-panel,
:root[data-theme="midnight"] .level-form-page .level-difficulty-section,
:root[data-theme="midnight"] .level-form-page .level-thumbnail-section,
:root[data-theme="midnight"] .level-form-page .level-palace-date-section,
:root[data-theme="midnight"] .level-form-page .legacy-duplicate-section,
:root[data-theme="midnight"] .level-form-page .level-description-editor-section {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .level-form-page .level-form-section,
:root[data-theme="midnight"] .level-form-page .level-difficulty-section,
:root[data-theme="midnight"] .level-form-page .level-thumbnail-section,
:root[data-theme="midnight"] .level-form-page .level-palace-date-section,
:root[data-theme="midnight"] .level-form-page .legacy-duplicate-section,
:root[data-theme="midnight"] .level-form-page .level-description-editor-section {
  border-top: 1px solid rgba(138, 180, 207, 0.36) !important;
  padding-top: 14px !important;
}

:root[data-theme="midnight"] .level-form-page .level-form-section:first-of-type {
  border-top: 0 !important;
  padding-top: 0 !important;
}

:root[data-theme="midnight"] .level-form-page .level-game-picker-panel > h2,
:root[data-theme="midnight"] .level-form-page .level-game-picker-panel > .level-game-select-grid,
:root[data-theme="midnight"] .level-form-page .level-game-picker-panel > .level-game-help,
:root[data-theme="midnight"] .level-form-page .level-game-picker-panel > .level-visual-filters-field,
:root[data-theme="midnight"] .level-form-page .level-difficulty-field,
:root[data-theme="midnight"] .level-form-page .level-thumbnail-preview-panel {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .level-thumb-placeholder,
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section .level-detail-thumb > span:not(.level-thumbnail-fallback),
:root[data-theme="midnight"] .level-thumbnail-preview span {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  color: #f5fbff !important;
  text-shadow: none !important;
}

:root[data-theme="midnight"] .profile-actions .action-dropdown a,
:root[data-theme="midnight"] .profile-actions .action-dropdown button {
  border-bottom: 1px solid rgba(138, 180, 207, 0.28) !important;
}

:root[data-theme="midnight"] .profile-actions .action-dropdown a:last-child,
:root[data-theme="midnight"] .profile-actions .action-dropdown button:last-child {
  border-bottom: 0 !important;
}

:root[data-theme="midnight"] .reaction-btn.like-reaction.active,
:root[data-theme="midnight"] .reaction-btn.like-profile-comment.active,
:root[data-theme="midnight"] .reaction-btn.like-level-comment.active {
  border-color: #73d292 !important;
  background: linear-gradient(#2d5b42, #214935) !important;
  color: var(--midnight-text) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.11),
    0 2px 6px rgba(37, 171, 91, 0.24) !important;
}

:root[data-theme="midnight"] .reaction-btn.dislike-reaction.active,
:root[data-theme="midnight"] .reaction-btn.dislike-profile-comment.active,
:root[data-theme="midnight"] .reaction-btn.dislike-level-comment.active {
  border-color: #ec8181 !important;
  background: linear-gradient(#633438, #4b292d) !important;
  color: var(--midnight-text) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.11),
    0 2px 6px rgba(224, 73, 73, 0.24) !important;
}

:root[data-theme="midnight"] .reaction-btn.like-reaction.active img,
:root[data-theme="midnight"] .reaction-btn.like-profile-comment.active img,
:root[data-theme="midnight"] .reaction-btn.like-level-comment.active img,
:root[data-theme="midnight"] .reaction-btn.dislike-reaction.active img,
:root[data-theme="midnight"] .reaction-btn.dislike-profile-comment.active img,
:root[data-theme="midnight"] .reaction-btn.dislike-level-comment.active img {
  opacity: 1 !important;
  filter: brightness(0) saturate(100%) invert(94%) sepia(18%) saturate(514%) hue-rotate(164deg) brightness(103%) contrast(96%) !important;
}

/* Global dark-theme icon action hover states. Most action icons are SVG images,
   while newer controls use inline Font Awesome SVG/i elements. */
:root[data-theme="midnight"] .comment-btn,
:root[data-theme="midnight"] .action-btn,
:root[data-theme="midnight"] .levels-icon-button,
:root[data-theme="midnight"] .level-thumbnail-edit-button,
:root[data-theme="midnight"] .music-icon-btn,
:root[data-theme="midnight"] .notification-btn {
  color: #bfe8ff !important;
}

:root[data-theme="midnight"] .comment-btn img,
:root[data-theme="midnight"] .action-btn img,
:root[data-theme="midnight"] .levels-icon-button img,
:root[data-theme="midnight"] .level-thumbnail-edit-button img,
:root[data-theme="midnight"] .music-icon-btn img,
:root[data-theme="midnight"] .notification-btn img {
  transition: filter 0.15s ease, opacity 0.15s ease, transform 0.15s ease !important;
}

:root[data-theme="midnight"] .comment-btn i,
:root[data-theme="midnight"] .comment-btn svg,
:root[data-theme="midnight"] .action-btn i,
:root[data-theme="midnight"] .action-btn svg,
:root[data-theme="midnight"] .levels-icon-button i,
:root[data-theme="midnight"] .levels-icon-button svg,
:root[data-theme="midnight"] .level-thumbnail-edit-button i,
:root[data-theme="midnight"] .level-thumbnail-edit-button svg,
:root[data-theme="midnight"] .music-icon-btn i,
:root[data-theme="midnight"] .music-icon-btn svg,
:root[data-theme="midnight"] .notification-btn i,
:root[data-theme="midnight"] .notification-btn svg {
  transition: color 0.15s ease, fill 0.15s ease, stroke 0.15s ease, opacity 0.15s ease, transform 0.15s ease !important;
}

:root[data-theme="midnight"] .comment-btn:not(:disabled):hover,
:root[data-theme="midnight"] .action-btn:not(:disabled):hover,
:root[data-theme="midnight"] .levels-icon-button:not(:disabled):hover,
:root[data-theme="midnight"] .level-thumbnail-edit-button:not(:disabled):hover,
:root[data-theme="midnight"] .music-icon-btn:not(:disabled):hover,
:root[data-theme="midnight"] .notification-btn:not(:disabled):hover {
  color: #ffffff !important;
}

:root[data-theme="midnight"] .comment-btn:not(:disabled):hover img,
:root[data-theme="midnight"] .action-btn:not(:disabled):hover img,
:root[data-theme="midnight"] .levels-icon-button:not(:disabled):hover img,
:root[data-theme="midnight"] .level-thumbnail-edit-button:not(:disabled):hover img,
:root[data-theme="midnight"] .music-icon-btn:not(:disabled):hover img,
:root[data-theme="midnight"] .notification-btn:not(:disabled):hover img {
  filter: brightness(0) saturate(100%) invert(100%) sepia(4%) saturate(723%) hue-rotate(177deg) brightness(104%) contrast(104%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .comment-btn:not(:disabled):hover i,
:root[data-theme="midnight"] .comment-btn:not(:disabled):hover svg,
:root[data-theme="midnight"] .action-btn:not(:disabled):hover i,
:root[data-theme="midnight"] .action-btn:not(:disabled):hover svg,
:root[data-theme="midnight"] .levels-icon-button:not(:disabled):hover i,
:root[data-theme="midnight"] .levels-icon-button:not(:disabled):hover svg,
:root[data-theme="midnight"] .level-thumbnail-edit-button:not(:disabled):hover i,
:root[data-theme="midnight"] .level-thumbnail-edit-button:not(:disabled):hover svg,
:root[data-theme="midnight"] .music-icon-btn:not(:disabled):hover i,
:root[data-theme="midnight"] .music-icon-btn:not(:disabled):hover svg,
:root[data-theme="midnight"] .notification-btn:not(:disabled):hover i,
:root[data-theme="midnight"] .notification-btn:not(:disabled):hover svg {
  color: #ffffff !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .comment-btn.danger:not(:disabled):hover,
:root[data-theme="midnight"] .comment-btn.obliterate:not(:disabled):hover,
:root[data-theme="midnight"] .comment-btn.delete-comment:not(:disabled):hover,
:root[data-theme="midnight"] .comment-btn.delete-reply:not(:disabled):hover,
:root[data-theme="midnight"] .comment-btn.delete-announcement:not(:disabled):hover,
:root[data-theme="midnight"] .comment-btn.delete-announcement-reply:not(:disabled):hover,
:root[data-theme="midnight"] .comment-btn.delete-level-rate:not(:disabled):hover,
:root[data-theme="midnight"] .comment-btn[class*="delete-"]:not(:disabled):hover,
:root[data-theme="midnight"] .comment-btn[class*="obliterate-"]:not(:disabled):hover,
:root[data-theme="midnight"] .danger-btn:not(:disabled):hover {
  color: #ff6f6f !important;
}

:root[data-theme="midnight"] .comment-btn.danger:not(:disabled):hover img,
:root[data-theme="midnight"] .comment-btn.obliterate:not(:disabled):hover img,
:root[data-theme="midnight"] .comment-btn.delete-comment:not(:disabled):hover img,
:root[data-theme="midnight"] .comment-btn.delete-reply:not(:disabled):hover img,
:root[data-theme="midnight"] .comment-btn.delete-announcement:not(:disabled):hover img,
:root[data-theme="midnight"] .comment-btn.delete-announcement-reply:not(:disabled):hover img,
:root[data-theme="midnight"] .comment-btn.delete-level-rate:not(:disabled):hover img,
:root[data-theme="midnight"] .comment-btn[class*="delete-"]:not(:disabled):hover img,
:root[data-theme="midnight"] .comment-btn[class*="obliterate-"]:not(:disabled):hover img,
:root[data-theme="midnight"] .danger-btn:not(:disabled):hover img {
  filter: brightness(0) saturate(100%) invert(61%) sepia(69%) saturate(3027%) hue-rotate(319deg) brightness(102%) contrast(101%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .comment-btn.danger:not(:disabled):hover i,
:root[data-theme="midnight"] .comment-btn.danger:not(:disabled):hover svg,
:root[data-theme="midnight"] .comment-btn.obliterate:not(:disabled):hover i,
:root[data-theme="midnight"] .comment-btn.obliterate:not(:disabled):hover svg,
:root[data-theme="midnight"] .comment-btn[class*="delete-"]:not(:disabled):hover i,
:root[data-theme="midnight"] .comment-btn[class*="delete-"]:not(:disabled):hover svg,
:root[data-theme="midnight"] .comment-btn[class*="obliterate-"]:not(:disabled):hover i,
:root[data-theme="midnight"] .comment-btn[class*="obliterate-"]:not(:disabled):hover svg,
:root[data-theme="midnight"] .danger-btn:not(:disabled):hover i,
:root[data-theme="midnight"] .danger-btn:not(:disabled):hover svg {
  color: #ff6f6f !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

:root[data-theme="midnight"] .notifications-page .notification-btn.danger-btn,
:root[data-theme="midnight"] .notifications-page .notification-text-btn.danger-btn {
  color: #ff8f96 !important;
}

:root[data-theme="midnight"] .notifications-page .notification-btn.danger-btn:not(:disabled):hover,
:root[data-theme="midnight"] .notifications-page .notification-text-btn.danger-btn:not(:disabled):hover,
:root[data-theme="midnight"] .notifications-page .notification-btn.danger-btn:not(:disabled):focus-visible,
:root[data-theme="midnight"] .notifications-page .notification-text-btn.danger-btn:not(:disabled):focus-visible {
  color: #ff6f6f !important;
}

:root[data-theme="midnight"] .comment-btn[class*="report-"]:not(:disabled):hover,
:root[data-theme="midnight"] .comment-btn[class*="warning"]:not(:disabled):hover {
  color: #ffd35f !important;
}

:root[data-theme="midnight"] .comment-btn[class*="report-"]:not(:disabled):hover img,
:root[data-theme="midnight"] .comment-btn[class*="warning"]:not(:disabled):hover img {
  filter: brightness(0) saturate(100%) invert(80%) sepia(98%) saturate(492%) hue-rotate(348deg) brightness(101%) contrast(101%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .comment-btn[class*="report-"]:not(:disabled):hover i,
:root[data-theme="midnight"] .comment-btn[class*="report-"]:not(:disabled):hover svg,
:root[data-theme="midnight"] .comment-btn[class*="warning"]:not(:disabled):hover i,
:root[data-theme="midnight"] .comment-btn[class*="warning"]:not(:disabled):hover svg {
  color: #ffd35f !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

:root[data-theme="midnight"] .comment-btn.active-pin:not(:disabled):hover,
:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment:not(:disabled):hover,
:root[data-theme="midnight"] .comment-btn.censor-level-comment:not(:disabled):hover,
:root[data-theme="midnight"] .comment-btn[class*="pin"]:not(:disabled):hover,
:root[data-theme="midnight"] .comment-btn[class*="censor"]:not(:disabled):hover {
  color: #ffcf5f !important;
}

:root[data-theme="midnight"] .comment-btn.active-pin:not(:disabled):hover img,
:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment:not(:disabled):hover img,
:root[data-theme="midnight"] .comment-btn.censor-level-comment:not(:disabled):hover img,
:root[data-theme="midnight"] .comment-btn[class*="pin"]:not(:disabled):hover img,
:root[data-theme="midnight"] .comment-btn[class*="censor"]:not(:disabled):hover img {
  filter: brightness(0) saturate(100%) invert(82%) sepia(67%) saturate(657%) hue-rotate(348deg) brightness(101%) contrast(101%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .comment-btn.active-pin:not(:disabled):hover i,
:root[data-theme="midnight"] .comment-btn.active-pin:not(:disabled):hover svg,
:root[data-theme="midnight"] .comment-btn[class*="pin"]:not(:disabled):hover i,
:root[data-theme="midnight"] .comment-btn[class*="pin"]:not(:disabled):hover svg,
:root[data-theme="midnight"] .comment-btn[class*="censor"]:not(:disabled):hover i,
:root[data-theme="midnight"] .comment-btn[class*="censor"]:not(:disabled):hover svg {
  color: #ffcf5f !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

:root[data-theme="midnight"] .comment-btn.active-lock:not(:disabled):hover {
  color: #e6edf3 !important;
}

:root[data-theme="midnight"] .comment-btn.active-lock:not(:disabled):hover img {
  filter: brightness(0) saturate(100%) invert(95%) sepia(8%) saturate(213%) hue-rotate(169deg) brightness(97%) contrast(92%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .comment-btn.active-lock:not(:disabled):hover i,
:root[data-theme="midnight"] .comment-btn.active-lock:not(:disabled):hover svg {
  color: #e6edf3 !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

:root[data-theme="midnight"] .locked-badge {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #e6edf3 !important;
  letter-spacing: 0.5px !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .tooltip {
  background: #4a90c2 !important;
  color: #ffffff !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.2) !important;
}

:root[data-theme="midnight"] .tooltip::after {
  border-top-color: #4a90c2 !important;
}

/* Locked comments should mirror the classic theme's plain status label and
   strong neutral outline, while pinned comments keep the gold pin signal. */
:root[data-theme="midnight"] .comment.locked-comment,
:root[data-theme="midnight"] .reply.locked-comment,
:root[data-theme="midnight"] .level-comment.locked-comment,
:root[data-theme="midnight"] .announcement-locked-card {
  border: 2px solid #e6edf3 !important;
  background: var(--midnight-profile-field) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 0 0 1px rgba(230,237,243,0.26),
    0 0 12px rgba(0,0,0,0.26) !important;
}

:root[data-theme="midnight"] .locked-badge,
:root[data-theme="midnight"] .announcement-locked {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #e6edf3 !important;
  box-shadow: none !important;
  letter-spacing: 0.5px !important;
}

:root[data-theme="midnight"] .comment-btn.active-lock img {
  filter: brightness(0) saturate(100%) invert(95%) sepia(8%) saturate(213%) hue-rotate(169deg) brightness(97%) contrast(92%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .comment-btn.active-lock i,
:root[data-theme="midnight"] .comment-btn.active-lock svg {
  color: #e6edf3 !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .pinned-comment .comment-btn.active-pin img,
:root[data-theme="midnight"] .level-comment.pinned-comment .comment-btn.active-pin img {
  filter: brightness(0) saturate(100%) invert(83%) sepia(53%) saturate(484%) hue-rotate(4deg) brightness(95%) contrast(89%) !important;
  opacity: 1 !important;
  transition: opacity 0.15s ease, transform 0.15s ease !important;
}

:root[data-theme="midnight"] .pinned-comment .comment-btn.active-pin i,
:root[data-theme="midnight"] .pinned-comment .comment-btn.active-pin svg,
:root[data-theme="midnight"] .level-comment.pinned-comment .comment-btn.active-pin i,
:root[data-theme="midnight"] .level-comment.pinned-comment .comment-btn.active-pin svg {
  color: #ffd95f !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .comment-btn.active-pin:not(:disabled):hover,
:root[data-theme="midnight"] .comment-btn[class*="pin"]:not(:disabled):hover {
  color: #d99f32 !important;
}

:root[data-theme="midnight"] .comment-btn.active-pin:not(:disabled):hover img,
:root[data-theme="midnight"] .comment-btn[class*="pin"]:not(:disabled):hover img,
:root[data-theme="midnight"] .pinned-comment .comment-btn.active-pin:not(:disabled):hover img,
:root[data-theme="midnight"] .level-comment.pinned-comment .comment-btn.active-pin:not(:disabled):hover img {
  filter: brightness(0) saturate(100%) invert(66%) sepia(79%) saturate(552%) hue-rotate(358deg) brightness(92%) contrast(90%) !important;
  opacity: 1 !important;
  transition: opacity 0.15s ease, transform 0.15s ease !important;
}

:root[data-theme="midnight"] .comment-btn.active-pin:not(:disabled):hover i,
:root[data-theme="midnight"] .comment-btn.active-pin:not(:disabled):hover svg,
:root[data-theme="midnight"] .comment-btn[class*="pin"]:not(:disabled):hover i,
:root[data-theme="midnight"] .comment-btn[class*="pin"]:not(:disabled):hover svg,
:root[data-theme="midnight"] .pinned-comment .comment-btn.active-pin:not(:disabled):hover i,
:root[data-theme="midnight"] .pinned-comment .comment-btn.active-pin:not(:disabled):hover svg,
:root[data-theme="midnight"] .level-comment.pinned-comment .comment-btn.active-pin:not(:disabled):hover i,
:root[data-theme="midnight"] .level-comment.pinned-comment .comment-btn.active-pin:not(:disabled):hover svg {
  color: #d99f32 !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .profile-actions > .action-group > .action-btn,
:root[data-theme="midnight"] .profile-actions > .action-group > .profile-actions-btn,
:root[data-theme="midnight"] .profile-actions > .action-group > .banner-actions-btn {
  color: #ffffff !important;
}

:root[data-theme="midnight"] .profile-actions > .action-group > .action-btn img,
:root[data-theme="midnight"] .profile-actions > .action-group > .profile-actions-btn img,
:root[data-theme="midnight"] .profile-actions > .action-group > .banner-actions-btn img {
  filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(180deg) brightness(104%) contrast(104%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .profile-actions > .action-group > .action-btn i,
:root[data-theme="midnight"] .profile-actions > .action-group > .action-btn svg,
:root[data-theme="midnight"] .profile-actions > .action-group > .profile-actions-btn i,
:root[data-theme="midnight"] .profile-actions > .action-group > .profile-actions-btn svg,
:root[data-theme="midnight"] .profile-actions > .action-group > .banner-actions-btn i,
:root[data-theme="midnight"] .profile-actions > .action-group > .banner-actions-btn svg {
  color: #ffffff !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .profile-legacy-accounts h2,
:root[data-theme="midnight"] .profile-legacy-account-group h3,
:root[data-theme="midnight"] .profile-stats strong,
:root[data-theme="midnight"] .profile-card h2,
:root[data-theme="midnight"] .profile-card h3,
:root[data-theme="midnight"] .profile-comments-section h2,
:root[data-theme="midnight"] .level-section h2,
:root[data-theme="midnight"] .level-section-heading h2,
:root[data-theme="midnight"] .level-section-title,
:root[data-theme="midnight"] .level-source-card h2,
:root[data-theme="midnight"] .level-source-card h3,
:root[data-theme="midnight"] .game-card h2,
:root[data-theme="midnight"] .game-card h3 {
  color: #9fd0ff !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35) !important;
}

:root[data-theme="midnight"] .profile-legacy-accounts h2 a,
:root[data-theme="midnight"] .profile-legacy-account-group h3 a,
:root[data-theme="midnight"] .profile-card h2 a,
:root[data-theme="midnight"] .profile-card h3 a,
:root[data-theme="midnight"] .profile-comments-section h2 a,
:root[data-theme="midnight"] .level-section h2 a,
:root[data-theme="midnight"] .level-section-heading h2 a,
:root[data-theme="midnight"] .level-source-card h2 a,
:root[data-theme="midnight"] .level-source-card h3 a,
:root[data-theme="midnight"] .game-card h2 a,
:root[data-theme="midnight"] .game-card h3 a {
  color: #9fd0ff !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35) !important;
}

/* Let profile.css own the mobile profile layout; midnight only recolors it. */
@media (max-width: 900px) {
  :root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-body,
  :root[data-theme="midnight"] .profile-page .profile-body,
  :root[data-theme="midnight"] .legacy-profile-page .profile-body {
    flex-direction: column !important;
  }

  :root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-main,
  :root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-sidebar,
  :root[data-theme="midnight"] .profile-page .profile-main,
  :root[data-theme="midnight"] .profile-page .profile-sidebar,
  :root[data-theme="midnight"] .legacy-profile-page .profile-main,
  :root[data-theme="midnight"] .legacy-profile-page .profile-sidebar {
    width: 100% !important;
    height: auto !important;
    flex: 0 1 auto !important;
  }

  :root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-main,
  :root[data-theme="midnight"] .profile-page .profile-main,
  :root[data-theme="midnight"] .legacy-profile-page .profile-main {
    display: flex !important;
  }

  :root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-main.has-description-toggle,
  :root[data-theme="midnight"] .profile-page .profile-main.has-description-toggle,
  :root[data-theme="midnight"] .legacy-profile-page .profile-main.has-description-toggle {
    height: auto !important;
  }

  :root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-main.description-expanded,
  :root[data-theme="midnight"] .profile-page .profile-main.description-expanded,
  :root[data-theme="midnight"] .legacy-profile-page .profile-main.description-expanded {
    height: auto !important;
  }

  :root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-main.has-description-toggle .profile-description,
  :root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-main.description-expanded .profile-description,
  :root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-description,
  :root[data-theme="midnight"] .profile-page .profile-main.has-description-toggle .profile-description,
  :root[data-theme="midnight"] .profile-page .profile-main.description-expanded .profile-description,
  :root[data-theme="midnight"] .profile-page .profile-description,
  :root[data-theme="midnight"] .legacy-profile-page .profile-main.has-description-toggle .profile-description,
  :root[data-theme="midnight"] .legacy-profile-page .profile-main.description-expanded .profile-description,
  :root[data-theme="midnight"] .legacy-profile-page .profile-description {
    height: auto !important;
    min-height: 160px !important;
    max-height: none !important;
    overflow: visible !important;
    overscroll-behavior: auto !important;
    touch-action: auto !important;
  }

  :root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-stats,
  :root[data-theme="midnight"] .profile-page .profile-stats,
  :root[data-theme="midnight"] .legacy-profile-page .profile-stats {
    height: auto !important;
  }

  :root[data-theme="midnight"] .profile-description-toggle,
  :root[data-theme="midnight"] .profile-description-collapse {
    display: none !important;
  }
}

@media (max-width: 640px) {
  :root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-main.has-description-toggle .profile-description,
  :root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-main.description-expanded .profile-description,
  :root[data-theme="midnight"] .box-inner.full-width:has(> .profile-card) .profile-description,
  :root[data-theme="midnight"] .profile-page .profile-main.has-description-toggle .profile-description,
  :root[data-theme="midnight"] .profile-page .profile-main.description-expanded .profile-description,
  :root[data-theme="midnight"] .profile-page .profile-description,
  :root[data-theme="midnight"] .legacy-profile-page .profile-main.has-description-toggle .profile-description,
  :root[data-theme="midnight"] .legacy-profile-page .profile-main.description-expanded .profile-description,
  :root[data-theme="midnight"] .legacy-profile-page .profile-description {
    min-height: 0 !important;
  }
}

/* Midnight polish pass: keep shared profile/level affordances consistent. */
:root[data-theme="midnight"] {
  --midnight-profile-heading: #9fd0ff;
  --midnight-content-heading: #f5fbff;
  --midnight-loader-bg: linear-gradient(#1b3448, #122635);
  --midnight-loader-border: #5f86a3;
  --midnight-loader-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 2px 8px rgba(0,0,0,0.24);
}

:root[data-theme="midnight"] .favorite-btn.active,
:root[data-theme="midnight"] .favorite-action .favorite-btn.active {
  color: #ffd95f !important;
}

:root[data-theme="midnight"] .favorite-btn.active img,
:root[data-theme="midnight"] .favorite-action .favorite-btn.active img {
  filter: brightness(0) saturate(100%) invert(83%) sepia(53%) saturate(484%) hue-rotate(4deg) brightness(95%) contrast(89%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .profile-legacy-accounts h2,
:root[data-theme="midnight"] .profile-legacy-account-group h3,
:root[data-theme="midnight"] .profile-stats strong,
:root[data-theme="midnight"] .profile-card h2,
:root[data-theme="midnight"] .profile-card h3 {
  color: var(--midnight-profile-heading) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35) !important;
}

:root[data-theme="midnight"] .profile-comments-section h2,
:root[data-theme="midnight"] .level-comments-section h2,
:root[data-theme="midnight"] .comment-history-heading h1,
:root[data-theme="midnight"] .review-history-heading h1 {
  color: var(--midnight-content-heading) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35) !important;
}

:root[data-theme="midnight"] .profile-legacy-accounts h2 a,
:root[data-theme="midnight"] .profile-legacy-account-group h3 a,
:root[data-theme="midnight"] .profile-card h2 a,
:root[data-theme="midnight"] .profile-card h3 a {
  color: var(--midnight-profile-heading) !important;
}

:root[data-theme="midnight"] .profile-comments-section h2 a,
:root[data-theme="midnight"] .level-comments-section h2 a,
:root[data-theme="midnight"] .comment-history-heading h1 a,
:root[data-theme="midnight"] .review-history-heading h1 a {
  color: var(--midnight-content-heading) !important;
}

:root[data-theme="midnight"] .profile-source-tab,
:root[data-theme="midnight"] .review-source-tab {
  color: #b7d9f5 !important;
}

:root[data-theme="midnight"] .profile-source-tab.active,
:root[data-theme="midnight"] .review-source-tab.active {
  color: var(--midnight-content-heading) !important;
}

:root[data-theme="midnight"] .profile-loading-box,
:root[data-theme="midnight"] .comment-history-loading,
:root[data-theme="midnight"] .review-history-loading,
:root[data-theme="midnight"] .page-loading-message,
:root[data-theme="midnight"] .level-form-loading,
:root[data-theme="midnight"] .game-info-loading,
:root[data-theme="midnight"] .moderation-loading-box {
  background: var(--midnight-loader-bg) !important;
  border: 1px solid var(--midnight-loader-border) !important;
  border-radius: 7px !important;
  color: #f4fbff !important;
  box-shadow: var(--midnight-loader-shadow) !important;
}

:root[data-theme="midnight"] .history-entry-actions .comment-btn img,
:root[data-theme="midnight"] .history-entry-actions .nav-item img,
:root[data-theme="midnight"] .history-original-icon img,
:root[data-theme="midnight"] .censor-history-comment img {
  filter: brightness(0) saturate(100%) invert(84%) sepia(20%) saturate(702%) hue-rotate(164deg) brightness(96%) contrast(92%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .history-entry-actions .comment-btn i,
:root[data-theme="midnight"] .history-entry-actions .comment-btn svg,
:root[data-theme="midnight"] .history-entry-actions .nav-item i,
:root[data-theme="midnight"] .history-entry-actions .nav-item svg,
:root[data-theme="midnight"] .history-original-icon i,
:root[data-theme="midnight"] .history-original-icon svg,
:root[data-theme="midnight"] .censor-history-comment i,
:root[data-theme="midnight"] .censor-history-comment svg {
  color: #bfe5ff !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .comment-history-list .history-entry.deleted-comment,
:root[data-theme="midnight"] .review-history-list .history-entry.deleted-comment {
  border-color: rgba(255, 118, 118, 0.72) !important;
  background:
    linear-gradient(90deg, rgba(255, 94, 94, 0.14), transparent 56%),
    var(--midnight-profile-field) !important;
  box-shadow:
    inset 3px 0 0 rgba(255, 118, 118, 0.86),
    0 0 0 1px rgba(255,118,118,0.18) !important;
}

:root[data-theme="midnight"] .comment-history-list .history-entry.private-comment,
:root[data-theme="midnight"] .review-history-list .history-entry.private-comment {
  background: linear-gradient(#1d3448, #142638) !important;
  border-color: #f5fbff !important;
  box-shadow:
    0 0 0 1px rgba(245,251,255,0.34),
    0 3px 10px rgba(0,0,0,0.2) !important;
}

:root[data-theme="midnight"] .comment-history-list .deleted-comment::before,
:root[data-theme="midnight"] .review-history-list .deleted-comment::before {
  color: #ff8c8c !important;
}

:root[data-theme="midnight"] .comment-history-list .private-comment::before,
:root[data-theme="midnight"] .review-history-list .private-comment::before {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section,
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section .level-detail-thumb {
  overflow: visible !important;
}

:root[data-theme="midnight"] .level-detail-page .level-detail-thumb.no-thumbnail > span:not(.level-thumbnail-fallback),
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section .level-detail-thumb.no-thumbnail > span:not(.level-thumbnail-fallback),
:root[data-theme="midnight"] .level-thumb-placeholder,
:root[data-theme="midnight"] .levels-card-grid .level-thumb-placeholder {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .level-detail-page .level-thumbnail-edit-control {
  z-index: 80 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-thumbnail-edit-control .tooltip {
  right: 0 !important;
  left: auto !important;
  transform: none !important;
  z-index: 100 !important;
  max-width: none !important;
  white-space: nowrap !important;
}

:root[data-theme="midnight"] .level-detail-page .level-thumbnail-edit-control .tooltip::after {
  right: 11px !important;
  left: auto !important;
  transform: none !important;
}

:root[data-theme="midnight"] .level-detail-page .level-left-column .level-rate-section,
:root[data-theme="midnight"] .level-detail-page .level-rate-section {
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .level-detail-page .level-rate-picker {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

:root[data-theme="midnight"] .level-detail-page .level-rate-control {
  gap: 7px !important;
  padding: 0 !important;
  color: #d7e8f5 !important;
  font-weight: 700 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-rate-control select {
  min-width: 64px !important;
  border: 1px solid #5f86a3 !important;
  border-radius: 8px !important;
  background: #081725 !important;
  color: #f4fbff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 2px 6px rgba(0,0,0,0.22) !important;
}

:root[data-theme="midnight"] .level-detail-page .level-rate-control span {
  color: #9fbad0 !important;
}

:root[data-theme="midnight"] .level-row-stat.has-viewer-action,
:root[data-theme="midnight"] .levels-card-grid .level-thumb-stats .level-box-stat.has-viewer-action,
:root[data-theme="midnight"] .level-detail-page .level-side .level-info-line:has(.level-viewer-check) {
  background: rgba(94, 213, 122, 0.28) !important;
  border-radius: 5px !important;
  box-shadow:
    inset 3px 0 0 rgba(116, 230, 141, 0.95),
    0 0 0 1px rgba(116,230,141,0.18) !important;
}

:root[data-theme="midnight"] .level-row-stat.has-viewer-action,
:root[data-theme="midnight"] .level-row-stat.has-viewer-action::after,
:root[data-theme="midnight"] .levels-card-grid .level-thumb-stats .level-box-stat.has-viewer-action,
:root[data-theme="midnight"] .levels-card-grid .level-thumb-stats .level-box-stat.has-viewer-action::after,
:root[data-theme="midnight"] .levels-card-grid .level-thumb-stats .level-box-stat.has-viewer-action b,
:root[data-theme="midnight"] .levels-card-grid .level-thumb-stats .level-box-stat.has-viewer-action strong,
:root[data-theme="midnight"] .level-detail-page .level-side .level-info-line:has(.level-viewer-check) > span,
:root[data-theme="midnight"] .level-detail-page .level-side .level-info-line:has(.level-viewer-check) strong,
:root[data-theme="midnight"] .level-detail-page .level-viewer-check {
  color: #ddffe4 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-viewer-check {
  background: rgba(94, 213, 122, 0.34) !important;
  box-shadow: 0 0 0 1px rgba(116,230,141,0.24) !important;
}

/* Level detail corrections: match the normal theme geometry while using midnight colors. */
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-edit-control .tooltip {
  right: auto !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
  z-index: 1000 !important;
  text-align: center !important;
}

:root[data-theme="midnight"] .level-detail-page .level-thumbnail-edit-control .tooltip::after {
  right: auto !important;
  left: 50% !important;
  transform: translateX(-50%) !important;
}

:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section .level-thumbnail-fallback,
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section .thumbnail-load-failed .level-thumbnail-fallback {
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #f5fbff !important;
  text-shadow: 0 2px 4px rgba(0,0,0,0.55) !important;
}

:root[data-theme="midnight"] .level-detail-page .level-rate-picker {
  min-height: 38px !important;
  border: 1px solid #5f86a3 !important;
  border-radius: 10px !important;
  background: linear-gradient(#102233, #0b1a28) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 2px 6px rgba(0,0,0,0.22) !important;
  overflow: hidden !important;
}

:root[data-theme="midnight"] .level-detail-page .level-rate-control {
  gap: 6px !important;
  padding: 0 10px 0 0 !important;
  color: #d7e8f5 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-rate-control select {
  border: 0 !important;
  border-right: 1px solid rgba(95,134,163,0.45) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .level-row-stat.has-viewer-action,
:root[data-theme="midnight"] .levels-card-grid .level-thumb-stats .level-box-stat.has-viewer-action,
:root[data-theme="midnight"] .level-detail-page .level-side .level-info-line:has(.level-viewer-check) {
  background: rgba(75, 166, 91, 0.24) !important;
  border: 0 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .level-detail-page .level-viewer-check {
  background: transparent !important;
  box-shadow: none !important;
  color: #d7f4df !important;
}

:root[data-theme="midnight"] .level-row-stat.has-viewer-action,
:root[data-theme="midnight"] .level-row-stat.has-viewer-action::after,
:root[data-theme="midnight"] .levels-card-grid .level-thumb-stats .level-box-stat.has-viewer-action,
:root[data-theme="midnight"] .levels-card-grid .level-thumb-stats .level-box-stat.has-viewer-action::after,
:root[data-theme="midnight"] .levels-card-grid .level-thumb-stats .level-box-stat.has-viewer-action b,
:root[data-theme="midnight"] .levels-card-grid .level-thumb-stats .level-box-stat.has-viewer-action strong,
:root[data-theme="midnight"] .level-detail-page .level-side .level-info-line:has(.level-viewer-check) > span,
:root[data-theme="midnight"] .level-detail-page .level-side .level-info-line:has(.level-viewer-check) strong {
  color: #d7f4df !important;
}

:root[data-theme="midnight"] .level-detail-page .level-code-actions button,
:root[data-theme="midnight"] .level-detail-page .level-code-actions a {
  background: linear-gradient(#1c3548, #142838) !important;
  border-color: #5f86a3 !important;
  color: #f4fbff !important;
  box-shadow: 0 2px 6px rgba(0,0,0,0.22) !important;
}

:root[data-theme="midnight"] .level-detail-page .level-code-actions button::before,
:root[data-theme="midnight"] .level-detail-page .level-code-actions a::before {
  display: none !important;
}

:root[data-theme="midnight"] .level-detail-page .level-rate-control select option {
  background: #ffffff !important;
  color: #111111 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-left-column .level-column-panel {
  background: linear-gradient(#1b2a39, #142231) !important;
  border: 1px solid #385269 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.05),
    0 3px 10px rgba(0,0,0,0.24) !important;
}

:root[data-theme="midnight"] .level-detail-page .level-left-column .level-code-section {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .level-detail-page .level-side .level-info-line:has(.level-viewer-check) {
  border-bottom: 1px solid rgba(196, 222, 240, 0.16) !important;
  background-clip: padding-box !important;
}

:root[data-theme="midnight"] .level-detail-page .level-side .level-info-line:has(.level-viewer-check):last-child {
  border-bottom: 0 !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-thumb-stats .level-box-stat.has-viewer-action {
  border-bottom: 1px solid rgba(196, 222, 240, 0.16) !important;
  background-clip: padding-box !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-thumb-stats .level-box-stat.has-viewer-action:last-child {
  border-bottom: 0 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-code-actions button:not(:disabled):hover,
:root[data-theme="midnight"] .level-detail-page .level-code-actions a:hover,
:root[data-theme="midnight"] .level-detail-page .inline-view-button:hover,
:root[data-theme="midnight"] .inline-view-button:hover {
  background: var(--button-hover-bg) !important;
  border-color: var(--button-hover-border) !important;
  color: var(--button-hover-text) !important;
  box-shadow: var(--button-hover-shadow) !important;
  filter: none !important;
}

:root[data-theme="midnight"] .level-detail-page .level-code-actions button:not(:disabled):hover img,
:root[data-theme="midnight"] .level-detail-page .level-code-actions a:hover img,
:root[data-theme="midnight"] .level-detail-page .inline-view-button:hover img,
:root[data-theme="midnight"] .inline-view-button:hover img {
  filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(180deg) brightness(104%) contrast(104%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .level-detail-page .inline-view-button:focus-visible,
:root[data-theme="midnight"] .inline-view-button:focus-visible {
  outline: 2px solid rgba(121,184,224,0.72) !important;
  outline-offset: 2px !important;
}

:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn:not(:disabled):hover,
:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-feature-history-action.is-clickable .comment-btn:not(:disabled):hover {
  color: #ffffff !important;
}

:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn:not(:disabled):hover img,
:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-feature-history-action.is-clickable .comment-btn:not(:disabled):hover img {
  filter: brightness(0) saturate(100%) invert(91%) sepia(22%) saturate(782%) hue-rotate(169deg) brightness(108%) contrast(104%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn.favorite-level:not(:disabled):hover img,
:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn.feature-level:not(:disabled):hover img,
:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-feature-history-action.is-featured .comment-btn:not(:disabled):hover img {
  filter: brightness(0) saturate(100%) invert(91%) sepia(85%) saturate(982%) hue-rotate(356deg) brightness(108%) contrast(105%) !important;
  opacity: 1 !important;
  transition: opacity 0.15s ease, transform 0.15s ease !important;
}

:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn.favorite-level img,
:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn.feature-level img {
  transition: opacity 0.15s ease, transform 0.15s ease !important;
}

:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn.bookmark-level.active img,
:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn.bookmark-level.active:not(:disabled):hover img {
  filter: brightness(0) saturate(100%) invert(78%) sepia(36%) saturate(922%) hue-rotate(166deg) brightness(111%) contrast(104%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn.bookmark-level:not(.active):not(:disabled):hover img {
  filter: brightness(0) saturate(100%) invert(91%) sepia(22%) saturate(782%) hue-rotate(169deg) brightness(108%) contrast(104%) !important;
}

:root[data-theme="midnight"] .level-detail-page .level-title-actions #edit-level-link:not(:disabled):hover img,
:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn.share-level:not(:disabled):hover img {
  filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(180deg) brightness(104%) contrast(104%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn.danger:not(:disabled):hover,
:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn[class*="delete-"]:not(:disabled):hover,
:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn[class*="obliterate-"]:not(:disabled):hover,
:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn.report-level:not(:disabled):hover {
  color: #ff6f6f !important;
}

:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn.danger:not(:disabled):hover img,
:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn[class*="delete-"]:not(:disabled):hover img,
:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn[class*="obliterate-"]:not(:disabled):hover img,
:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn.report-level:not(:disabled):hover img {
  filter: brightness(0) saturate(100%) invert(57%) sepia(60%) saturate(1014%) hue-rotate(314deg) brightness(103%) contrast(101%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .pagination button.active,
:root[data-theme="midnight"] .levels-pagination button.active,
:root[data-theme="midnight"] .staff-pagination .page-button.active,
:root[data-theme="midnight"] .thread-pagination button.active {
  background: linear-gradient(#5a86a8, #3a647f) !important;
  border-color: #a8ddff !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 2px 5px rgba(0,0,0,0.32),
    0 0 0 1px rgba(168,221,255,0.2),
    0 3px 9px rgba(0,0,0,0.32) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .pagination button:not(.active):not(:disabled),
:root[data-theme="midnight"] .levels-pagination button:not(.active):not(:disabled),
:root[data-theme="midnight"] .staff-pagination .page-button:not(.active):not(.disabled),
:root[data-theme="midnight"] .thread-pagination button:not(.active):not(:disabled) {
  background: var(--button-bg) !important;
  border-color: var(--button-border) !important;
  color: var(--button-text) !important;
}

/* Map the normal theme's #2F556E header/label color to midnight blue. */
:root[data-theme="midnight"] {
  --primary-dark: #9fd0ff;
  --midnight-header-text: #9fd0ff;
}

:root[data-theme="midnight"] :is(
  .text,
  .content-page,
  .levels-page,
  .level-detail-page,
  .level-portal-page,
  .games-page,
  .members-page,
  .announcements-page,
  .profile-page,
  .legacy-profile-page,
  .comment-history-page,
  .review-history-page,
  .notifications-page,
  .settings-page,
  .staff-page,
  .report-page,
  .auth
) :is(h1, h2, h3, h4, .page-title, .section-title, .level-section-title, .edit-subtitle) {
  color: var(--midnight-header-text) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35) !important;
}

:root[data-theme="midnight"] .level-detail-page .level-description-heading h2,
:root[data-theme="midnight"] .level-detail-page .level-info-line > span,
:root[data-theme="midnight"] .level-detail-page .level-side .level-info-line > span,
:root[data-theme="midnight"] .level-detail-page .level-info-line-stacked > span,
:root[data-theme="midnight"] .level-source-name h2,
:root[data-theme="midnight"] .level-source-meta b,
:root[data-theme="midnight"] .level-source-meta strong,
:root[data-theme="midnight"] .source-card h2,
:root[data-theme="midnight"] .source-card strong,
:root[data-theme="midnight"] .portal-stat strong,
:root[data-theme="midnight"] .announcement-heading h1,
:root[data-theme="midnight"] .announcement-editor h2,
:root[data-theme="midnight"] .announcement-inline-editor h2,
:root[data-theme="midnight"] .announcement-title,
:root[data-theme="midnight"] .announcement-preview-title,
:root[data-theme="midnight"] .profile-legacy-accounts h2,
:root[data-theme="midnight"] .profile-legacy-account-group h3,
:root[data-theme="midnight"] .profile-stats strong,
:root[data-theme="midnight"] .profile-card h2,
:root[data-theme="midnight"] .profile-card h3 {
  color: var(--midnight-header-text) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35) !important;
}

:root[data-theme="midnight"] :is(
  .text,
  .content-page,
  .levels-page,
  .level-detail-page,
  .level-portal-page,
  .games-page,
  .members-page,
  .announcements-page,
  .profile-page,
  .legacy-profile-page,
  .comment-history-page,
  .review-history-page
) :is(h1, h2, h3, h4, .page-title, .section-title, .level-section-title) a {
  color: var(--midnight-header-text) !important;
}

:root[data-theme="midnight"] .level-form-page :is(
  h1,
  h2,
  h3,
  label,
  .level-field-label,
  .level-form-header h1,
  .level-game-picker-panel h2
) {
  color: var(--midnight-header-text) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35) !important;
}

:root[data-theme="midnight"] .level-form-page .level-thumbnail-section .level-thumbnail-preview:not(.has-thumbnail) {
  width: min(100%, 428px) !important;
  max-width: 428px !important;
  aspect-ratio: 4 / 3 !important;
  background:
    linear-gradient(rgba(255,255,255,0.1), rgba(255,255,255,0)),
    linear-gradient(135deg, #28475b, #163044) !important;
  border-color: #78aeca !important;
  outline: 3px solid rgba(214,235,248,0.58) !important;
  outline-offset: -6px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.18), 0 2px 4px rgba(0,0,0,0.22) !important;
}

:root[data-theme="midnight"] .level-form-page .level-thumbnail-section .level-thumbnail-preview:not(.has-thumbnail) span {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  color: #f5fbff !important;
  font-size: 36px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  text-shadow: none !important;
}

:root[data-theme="midnight"] :is(
  .level-field-help,
  .level-thumbnail-help,
  .level-game-help,
  .level-palace-thumbnail-note,
  .form-help,
  .help-text,
  .settings-help,
  .hint
) a {
  color: #8fd0ff !important;
  text-decoration-color: rgba(143,208,255,0.55) !important;
}

:root[data-theme="midnight"] :is(
  .level-field-help,
  .level-thumbnail-help,
  .level-game-help,
  .level-palace-thumbnail-note,
  .form-help,
  .help-text,
  .settings-help,
  .hint
) a:hover,
:root[data-theme="midnight"] :is(
  .level-field-help,
  .level-thumbnail-help,
  .level-game-help,
  .level-palace-thumbnail-note,
  .form-help,
  .help-text,
  .settings-help,
  .hint
) a:focus-visible {
  color: #ff6f7a !important;
  text-decoration: underline !important;
  text-decoration-color: #ff6f7a !important;
}

:root[data-theme="midnight"] :is(
  .profile-description,
  .text,
  .faq-item,
  .credits-list,
  .special-thanks-list,
  .rngdle-credit,
  .level-field-help,
  .level-thumbnail-help,
  .level-game-help,
  .level-palace-thumbnail-note,
  .form-help,
  .help-text,
  .settings-help,
  .hint
) a:not(
  .levels-button,
  .control-btn,
  .comment-btn,
  .action-btn,
  .level-action,
  .level-browse-thumb,
  .level-browse-title,
  .game-card-link,
  .play-btn,
  .profile-name-link,
  .nav-link,
  .logo-area,
  .logo-link,
  .jump-top-link,
  [style*="--role-color"]
) {
  color: #8fd0ff !important;
  text-decoration-color: rgba(143,208,255,0.55) !important;
}

:root[data-theme="midnight"] :is(
  .profile-description,
  .text,
  .faq-item,
  .credits-list,
  .special-thanks-list,
  .rngdle-credit,
  .level-field-help,
  .level-thumbnail-help,
  .level-game-help,
  .level-palace-thumbnail-note,
  .form-help,
  .help-text,
  .settings-help,
  .hint
) a:not(
  .levels-button,
  .control-btn,
  .comment-btn,
  .action-btn,
  .level-action,
  .level-browse-thumb,
  .level-browse-title,
  .game-card-link,
  .play-btn,
  .profile-name-link,
  .nav-link,
  .logo-area,
  .logo-link,
  .jump-top-link,
  [style*="--role-color"]
):hover,
:root[data-theme="midnight"] :is(
  .profile-description,
  .text,
  .faq-item,
  .credits-list,
  .special-thanks-list,
  .rngdle-credit,
  .level-field-help,
  .level-thumbnail-help,
  .level-game-help,
  .level-palace-thumbnail-note,
  .form-help,
  .help-text,
  .settings-help,
  .hint
) a:not(
  .levels-button,
  .control-btn,
  .comment-btn,
  .action-btn,
  .level-action,
  .level-browse-thumb,
  .level-browse-title,
  .game-card-link,
  .play-btn,
  .profile-name-link,
  .nav-link,
  .logo-area,
  .logo-link,
  .jump-top-link,
  [style*="--role-color"]
):focus-visible {
  color: #ff6f7a !important;
  text-decoration-color: #ff6f7a !important;
}

:root[data-theme="midnight"] .level-form-page .level-radio-group label,
:root[data-theme="midnight"] .level-form-page .level-radio-group span,
:root[data-theme="midnight"] .level-form-page .level-visibility-field label,
:root[data-theme="midnight"] .level-form-page .level-private-access-options label {
  color: #f6fbff !important;
  text-shadow: none !important;
}

:root[data-theme="midnight"] .level-form-page :is(
  .level-char-count,
  .level-required-note,
  .level-field-help,
  .level-game-help,
  .level-palace-thumbnail-note,
  .level-public-post-limit-note
) {
  color: #d2e7f5 !important;
}

:root[data-theme="midnight"] :is(
  .profile-comment-form .char-count,
  .thread-reply-form .thread-char-count,
  .comment-form-actions .char-count,
  .edit-profile-page #char-counter,
  #announcementCharacterCount,
  .announcement-inline-count,
  .announcement-reply-form .thread-char-count,
  .announcement-reply-edit .char-count
) {
  color: #f6fbff !important;
  text-shadow: none !important;
}

:root[data-theme="midnight"] :is(
  .profile-comment-form .char-count.warning,
  .thread-reply-form .thread-char-count.warning,
  .comment-form-actions .char-count.warning,
  .edit-profile-page #char-counter.warning,
  .edit-profile-page #char-counter.danger,
  #announcementCharacterCount.warning,
  .announcement-inline-count.warning,
  .announcement-reply-form .thread-char-count.warning,
  .announcement-reply-edit .char-count.warning
) {
  color: #ff9a8d !important;
  font-weight: bold !important;
}

:root[data-theme="midnight"] .level-form-page .level-invite-summary,
:root[data-theme="midnight"] .level-form-page #level-invite-count,
:root[data-theme="midnight"] .level-form-page .level-invite-results em,
:root[data-theme="midnight"] .level-form-page .level-invite-selected em {
  color: #f6fbff !important;
  text-shadow: none !important;
}

:root[data-theme="midnight"] .level-form-page .level-invites-modal-content,
:root[data-theme="midnight"] .level-form-page .level-invites-modal-content .help-body {
  background: linear-gradient(#1b2d3e, #132231) !important;
  border-color: #547993 !important;
  color: #f6fbff !important;
}

:root[data-theme="midnight"] .level-form-page .level-invites-body input,
:root[data-theme="midnight"] .level-form-page #level-invite-search {
  background: linear-gradient(#0d1823, #101d2a) !important;
  border-color: #79b8e0 !important;
  color: #f7fbff !important;
  box-shadow: inset 0 1px 3px rgba(0,0,0,0.45) !important;
}

:root[data-theme="midnight"] .level-form-page .level-invites-body input::placeholder,
:root[data-theme="midnight"] .level-form-page #level-invite-search::placeholder {
  color: #d2e7f5 !important;
}

:root[data-theme="midnight"] .level-form-page .level-invite-result,
:root[data-theme="midnight"] .level-form-page .level-invite-chip {
  background: linear-gradient(#1f3548, #172839) !important;
  border-color: #5f86a3 !important;
  color: #f6fbff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.08) !important;
}

:root[data-theme="midnight"] .level-form-page .level-invite-result:hover,
:root[data-theme="midnight"] .level-form-page .level-invite-result:focus-visible {
  background: linear-gradient(#25425a, #1a3044) !important;
  border-color: #8fc8ff !important;
  color: #ffffff !important;
}

:root[data-theme="midnight"] .level-form-page .level-invite-selected-wrap {
  border-top-color: rgba(210,226,238,0.2) !important;
  color: var(--midnight-header-text) !important;
}

:root[data-theme="midnight"] .level-form-page .level-invite-chip button {
  background: linear-gradient(#20384d, #172a3c) !important;
  border-color: #79b8e0 !important;
  color: #f6fbff !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .game-card .versions-header,
:root[data-theme="midnight"] .game-card .game-version {
  color: var(--midnight-header-text) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35) !important;
}

:root[data-theme="midnight"] .game-card .play-btn {
  background: var(--button-bg) !important;
  border-color: var(--button-border) !important;
  color: var(--button-text) !important;
  box-shadow: var(--button-shadow) !important;
}

:root[data-theme="midnight"] .game-card .play-btn:hover,
:root[data-theme="midnight"] .game-card .play-btn:focus-visible {
  background: var(--button-hover-bg) !important;
  border-color: var(--button-hover-border) !important;
  color: var(--button-hover-text) !important;
  box-shadow: var(--button-hover-shadow) !important;
}

:root[data-theme="midnight"] .game-card .favorite-btn.active,
:root[data-theme="midnight"] .game-card .favorite-action .favorite-btn.active {
  background: linear-gradient(#1c3446, #102231) !important;
  border-color: #f0a23a !important;
  color: #e9962f !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 2px 6px rgba(0,0,0,0.42) !important;
}

:root[data-theme="midnight"] .game-card .favorite-btn.active img,
:root[data-theme="midnight"] .game-card .favorite-action .favorite-btn.active img {
  filter: brightness(0) saturate(100%) invert(64%) sepia(65%) saturate(1086%) hue-rotate(349deg) brightness(94%) contrast(94%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] :is(
  .level-form-page,
  .levels-page,
  .level-detail-page
) .help-header button[aria-label="Close"] {
  display: inline-grid !important;
  place-items: center !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  padding: 0 !important;
  background-color: rgba(255,255,255,0.16) !important;
  background-image: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23fff'%20stroke-width='3.2'%20stroke-linecap='round'%3E%3Cpath%20d='M6%206l12%2012M18%206L6%2018'/%3E%3C/svg%3E") !important;
  background-position: center center !important;
  background-repeat: no-repeat !important;
  background-size: 17px 17px !important;
  font-size: 0 !important;
  line-height: 0 !important;
  text-indent: 0 !important;
}

:root[data-theme="midnight"] :is(
  .level-form-page,
  .levels-page,
  .level-detail-page
) .help-header button[aria-label="Close"]::before,
:root[data-theme="midnight"] :is(
  .level-form-page,
  .levels-page,
  .level-detail-page
) .help-header button[aria-label="Close"]::after {
  content: none !important;
  display: none !important;
}

/* Final profile color consistency pass. */
:root[data-theme="midnight"] .profile-actions :is(
  a,
  button,
  .action-btn,
  .profile-actions-btn,
  .banner-actions-btn,
  span,
  i,
  svg
),
:root[data-theme="midnight"] .profile-dropdown :is(a, button, span, i, svg),
:root[data-theme="midnight"] .action-dropdown :is(a, button, span, i, svg) {
  color: var(--midnight-header-text) !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

:root[data-theme="midnight"] .profile-actions img,
:root[data-theme="midnight"] .profile-dropdown img,
:root[data-theme="midnight"] .action-dropdown img {
  filter: brightness(0) saturate(100%) invert(75%) sepia(58%) saturate(491%) hue-rotate(177deg) brightness(103%) contrast(101%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .profile-legacy-accounts :is(
  h2,
  h2 a,
  h3,
  h3 a,
  .profile-legacy-account-group h3,
  .profile-legacy-account-group h3 a
) {
  color: var(--midnight-header-text) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35) !important;
}

/* Keep the Level Invites modal on the same close-button layout as other pop-ups. */
.level-form-page .level-invites-modal-content .help-header {
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 14px !important;
  text-align: left !important;
}

.level-form-page .level-invites-modal-content .help-header button[aria-label="Close"] {
  position: relative !important;
  top: auto !important;
  right: auto !important;
  transform: none !important;
  flex: 0 0 32px !important;
  margin-left: auto !important;
}

:root[data-theme="midnight"] :is(
  .level-form-page .level-edit-denied-message,
  .level-form-page .level-login-required-message,
  .level-form-page .level-form-loading,
  .level-form-page .form-message.level-edit-denied-message,
  .level-missing-message,
  .profile-missing-message,
  .report-missing-message,
  .report-empty-message,
  .legacy-empty-message,
  .log-empty-message,
  .user-empty-message,
  .staff-loading-message,
  .games-empty-message,
  #tab-content .games-empty-message,
  .members-empty,
  .staff-empty,
  .levels-empty,
  .levels-loading,
  .level-portal-loading,
  .level-portal-loading-list,
  .game-info-loading,
  .game-base-combobox-empty,
  .notification-empty,
  .credits-empty,
  .credits-loading,
  .page-loading-message
) {
  background: linear-gradient(#1d3042, #122232) !important;
  border: 1px solid #42627c !important;
  color: #edf7ff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.07),
    0 4px 14px rgba(0,0,0,0.32) !important;
}

:root[data-theme="midnight"] :is(
  .level-form-page .level-edit-denied-message,
  .level-form-page .level-login-required-message,
  .level-missing-message,
  .profile-missing-message,
  .report-missing-message,
  .report-empty-message,
  .legacy-empty-message,
  .log-empty-message,
  .user-empty-message,
  .staff-loading-message,
  .games-empty-message,
  #tab-content .games-empty-message,
  .members-empty,
  .staff-empty,
  .levels-empty,
  .notification-empty,
  .credits-empty
) :is(h1, h2, h3, p, span, em, strong) {
  color: #edf7ff !important;
}

:root[data-theme="midnight"] .not-found-actions a {
  background: var(--button-bg) !important;
  border-color: var(--button-border) !important;
  color: var(--button-text) !important;
  box-shadow: var(--button-shadow) !important;
}

:root[data-theme="midnight"] .not-found-actions a:hover,
:root[data-theme="midnight"] .not-found-actions a:focus-visible {
  background: var(--button-hover-bg) !important;
  border-color: var(--button-hover-border) !important;
  color: var(--button-hover-text) !important;
  box-shadow: var(--button-hover-shadow) !important;
}

:root[data-theme="midnight"] .legacy-member-grid .member-role,
:root[data-theme="midnight"] .legacy-member-grid .member-name,
:root[data-theme="midnight"] .member-row .member-role[style*="#414141"],
:root[data-theme="midnight"] .member-row .member-name[style*="#414141"] {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .legacy-member-grid .member-avatar,
:root[data-theme="midnight"] .member-row .member-avatar[style*="--role-color:#414141"],
:root[data-theme="midnight"] .member-row .member-avatar[style*="--role-color: #414141"] {
  --role-color: #f5fbff !important;
}

:root[data-theme="midnight"] .level-detail-page .level-thumbnail-modal-content .level-thumbnail-section {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  padding: 0 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-thumbnail-modal-content .level-thumbnail-field,
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-modal-content .level-thumbnail-preview-panel {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-thumbnail-modal-content .level-thumbnail-help,
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-modal-content .level-field-help {
  color: #d2e7f5 !important;
}

:root[data-theme="midnight"] :is(
  .home-loading-wrapper,
  .level-page-loading-wrapper,
  .profile-page-loading-wrapper,
  .page-loading-wrapper
) .page-loading-panel,
:root[data-theme="midnight"] :is(
  .level-portal-loading-list,
  .levels-page .levels-grid:has(.levels-loading),
  .levels-page .levels-list:has(.levels-loading),
  .announcements-list:has(.announcements-loading)
) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] :is(
  .home-loading-wrapper,
  .level-page-loading-wrapper,
  .profile-page-loading-wrapper,
  .page-loading-wrapper
) .box-inner.single-column {
  padding: 20px 30px 14px !important;
}

:root[data-theme="midnight"] :is(
  .home-loading-wrapper,
  .level-page-loading-wrapper,
  .profile-page-loading-wrapper,
  .page-loading-wrapper
) .box {
  background: linear-gradient(#1c2b3b, #152231) !important;
  border: 1px solid var(--border) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 4px 13px rgba(0,0,0,0.34) !important;
}

:root[data-theme="midnight"] :is(
  .home-loading-wrapper,
  .level-page-loading-wrapper,
  .profile-page-loading-wrapper,
  .page-loading-wrapper
) .box-inner.single-column {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .level-portal-loading-list {
  padding: 0 !important;
}

:root[data-theme="midnight"] .page-loading-panel {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] :is(
  .home-loading-wrapper,
  .level-page-loading-wrapper,
  .profile-page-loading-wrapper,
  .page-loading-wrapper
) .page-loading-message {
  box-shadow: none !important;
  outline: 0 !important;
}

.page-loading-panel,
:root[data-theme="midnight"] .page-loading-panel,
:is(.home-loading-wrapper, .level-page-loading-wrapper, .profile-page-loading-wrapper, .page-loading-wrapper) .page-loading-panel {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

.page-loading-panel::before,
.page-loading-panel::after {
  content: none !important;
  display: none !important;
}

.page-loading-message {
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .auth .user-menu .username[style*="#990099"],
:root[data-theme="midnight"] .auth .user-menu .username[style*="rgb(153, 0, 153)"] {
  color: #f18cff !important;
}

:root[data-theme="midnight"] .auth .user-menu .username[style*="#FF9900"],
:root[data-theme="midnight"] .auth .user-menu .username[style*="#ff9900"] {
  color: #ffd47f !important;
}

:root[data-theme="midnight"] .auth .user-menu .username[style*="#008000"] {
  color: #8cf59d !important;
}

:root[data-theme="midnight"] .auth .user-menu .username[style*="#0066FF"],
:root[data-theme="midnight"] .auth .user-menu .username[style*="#0066ff"] {
  color: #42cfff !important;
}

:root[data-theme="midnight"] .auth .user-menu .username[style*="#c2185b"] {
  color: #ff8db6 !important;
}

:root[data-theme="midnight"] .auth .user-menu .username[style*="#414141"] {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment.active-censor,
:root[data-theme="midnight"] .comment-btn.censor-level-comment.active-censor,
:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment:disabled.active-censor,
:root[data-theme="midnight"] .comment-btn.censor-level-comment:disabled.active-censor,
:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment:not(:disabled):hover,
:root[data-theme="midnight"] .comment-btn.censor-level-comment:not(:disabled):hover,
:root[data-theme="midnight"] .comment-btn[class*="censor"]:not(:disabled):hover {
  color: #ff6f6f !important;
}

:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment.active-censor i,
:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment.active-censor svg,
:root[data-theme="midnight"] .comment-btn.censor-level-comment.active-censor i,
:root[data-theme="midnight"] .comment-btn.censor-level-comment.active-censor svg,
:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment:disabled.active-censor i,
:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment:disabled.active-censor svg,
:root[data-theme="midnight"] .comment-btn.censor-level-comment:disabled.active-censor i,
:root[data-theme="midnight"] .comment-btn.censor-level-comment:disabled.active-censor svg,
:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment:not(:disabled):hover i,
:root[data-theme="midnight"] .comment-btn.censor-legacy-profile-comment:not(:disabled):hover svg,
:root[data-theme="midnight"] .comment-btn.censor-level-comment:not(:disabled):hover i,
:root[data-theme="midnight"] .comment-btn.censor-level-comment:not(:disabled):hover svg,
:root[data-theme="midnight"] .comment-btn[class*="censor"]:not(:disabled):hover i,
:root[data-theme="midnight"] .comment-btn[class*="censor"]:not(:disabled):hover svg {
  color: #ff6f6f !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

:root[data-theme="midnight"] :is(
  .level-form-page,
  .levels-page,
  .level-detail-page
) .help-header button[aria-label="Close"]::before {
  content: none !important;
  display: none !important;
}

:root[data-theme="midnight"] :is(
  .level-form-page,
  .levels-page,
  .level-detail-page
) .help-header button[aria-label="Close"]::after {
  content: none !important;
  display: none !important;
}

/* Final connected-account header color. Keep account names separate. */
:root[data-theme="midnight"] .profile-legacy-accounts > h2,
:root[data-theme="midnight"] .profile-legacy-account-group > h3,
:root[data-theme="midnight"] .profile-legacy-account-group > h3 u,
:root[data-theme="midnight"] .profile-legacy-account-group > h3 a,
:root[data-theme="midnight"] .profile-legacy-account-group > h3 a u {
  color: var(--midnight-header-text) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35) !important;
}

/* Final dashboard role/status correction. Keep after broad midnight link rules. */
:root[data-theme="midnight"] .online-member {
  color: var(--role-color, #f5fbff) !important;
  text-decoration: none !important;
}

/* Commas between online member names: white for readability on the dark surface. */
:root[data-theme="midnight"] .online-member-comma {
  color: #ffffff !important;
}

:root[data-theme="midnight"] .online-member:hover,
:root[data-theme="midnight"] .online-member:focus-visible {
  color: var(--role-color, #f5fbff) !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] :is(.staff-user-link, .staff-inline-user, .staff-card a, .legacy-request-card a, .log-panel a, .online-member)[style*="#990099"],
:root[data-theme="midnight"] .staff-context-link [style*="#990099"] {
  color: #f18cff !important;
}

:root[data-theme="midnight"] :is(.staff-user-link, .staff-inline-user, .staff-card a, .legacy-request-card a, .log-panel a, .online-member)[style*="#FF9900"],
:root[data-theme="midnight"] :is(.staff-user-link, .staff-inline-user, .staff-card a, .legacy-request-card a, .log-panel a, .online-member)[style*="#ff9900"],
:root[data-theme="midnight"] .staff-context-link [style*="#FF9900"],
:root[data-theme="midnight"] .staff-context-link [style*="#ff9900"] {
  color: #ffd47f !important;
}

:root[data-theme="midnight"] :is(.staff-user-link, .staff-inline-user, .staff-card a, .legacy-request-card a, .log-panel a, .online-member)[style*="#008000"],
:root[data-theme="midnight"] .staff-context-link [style*="#008000"] {
  color: #8cf59d !important;
}

:root[data-theme="midnight"] :is(.staff-user-link, .staff-inline-user, .staff-card a, .legacy-request-card a, .log-panel a, .online-member)[style*="#0066FF"],
:root[data-theme="midnight"] :is(.staff-user-link, .staff-inline-user, .staff-card a, .legacy-request-card a, .log-panel a, .online-member)[style*="#0066ff"],
:root[data-theme="midnight"] .staff-context-link [style*="#0066FF"],
:root[data-theme="midnight"] .staff-context-link [style*="#0066ff"] {
  color: #42cfff !important;
}

:root[data-theme="midnight"] :is(.staff-user-link, .staff-inline-user, .staff-card a, .legacy-request-card a, .log-panel a, .online-member)[style*="#c2185b"],
:root[data-theme="midnight"] .staff-context-link [style*="#c2185b"] {
  color: #ff8db6 !important;
}

:root[data-theme="midnight"] :is(.staff-user-link, .staff-inline-user, .staff-card a, .legacy-request-card a, .log-panel a, .online-member)[style*="#414141"],
:root[data-theme="midnight"] :is(.staff-user-link, .staff-inline-user, .staff-card a, .legacy-request-card a, .log-panel a, .online-member)[style*="#111"],
:root[data-theme="midnight"] .staff-context-link [style*="#414141"],
:root[data-theme="midnight"] .staff-context-link [style*="#111"] {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] :is(.staff-user-link, .staff-inline-user, .staff-card a, .legacy-request-card a, .log-panel a, .online-member)[style*="#9aa3ad"],
:root[data-theme="midnight"] .staff-context-link [style*="#9aa3ad"] {
  color: #b9c8d6 !important;
}

:root[data-theme="midnight"] :is(.staff-user-link, .staff-inline-user, .staff-card a, .legacy-request-card a, .log-panel a, .online-member)[style*="#555f68"],
:root[data-theme="midnight"] .staff-context-link [style*="#555f68"] {
  color: #9eafbf !important;
}

:root[data-theme="midnight"] :is(.staff-user-link, .staff-inline-user, .staff-card a, .legacy-request-card a, .log-panel a, .online-member)[style*="#4f7180"],
:root[data-theme="midnight"] .staff-context-link [style*="#4f7180"] {
  color: #7fa6c1 !important;
}

:root[data-theme="midnight"] :is(.staff-user-link, .staff-inline-user, .staff-card a, .legacy-request-card a, .log-panel a, .online-member)[style*="#861717"],
:root[data-theme="midnight"] .staff-context-link [style*="#861717"] {
  color: #ff8f96 !important;
}

:root[data-theme="midnight"] .status-pill,
:root[data-theme="midnight"] .role-pill {
  background: rgba(49, 75, 95, 0.58) !important;
  border-color: rgba(127, 166, 193, 0.46) !important;
  color: #d4e8f5 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .status-pill.open,
:root[data-theme="midnight"] .status-pill.pending {
  background: rgba(80, 155, 222, 0.18) !important;
  border-color: #64b5f6 !important;
  color: #d9efff !important;
}

:root[data-theme="midnight"] .status-pill.closed,
:root[data-theme="midnight"] .status-pill.rejected,
:root[data-theme="midnight"] .status-pill.dismissed {
  background: rgba(231, 86, 96, 0.16) !important;
  border-color: #ff8f99 !important;
  color: #ffd9dd !important;
}

:root[data-theme="midnight"] .status-pill.approved,
:root[data-theme="midnight"] .status-pill.accepted,
:root[data-theme="midnight"] .status-pill.resolved {
  background: rgba(93, 211, 122, 0.16) !important;
  border-color: #71db87 !important;
  color: #d7ffdf !important;
}

:root[data-theme="midnight"] .role-pill {
  background: color-mix(in srgb, var(--role-color, #7fa6c1) 16%, #142638) !important;
  border-color: color-mix(in srgb, var(--role-color, #7fa6c1) 58%, #385269) !important;
  color: color-mix(in srgb, var(--role-color, #7fa6c1) 55%, #ffffff) !important;
}

:root[data-theme="midnight"] .legacy-dashboard-shell .legacy-log-entry .log-title,
:root[data-theme="midnight"] .legacy-dashboard-shell .legacy-log-entry .log-title > span {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .legacy-dashboard-shell .legacy-log-entry .log-title a:not(.staff-user-link),
:root[data-theme="midnight"] .legacy-dashboard-shell .legacy-request-title-link {
  color: #8fd0ff !important;
}

:root[data-theme="midnight"] .legacy-dashboard-shell .legacy-log-entry .log-title a:not(.staff-user-link):hover,
:root[data-theme="midnight"] .legacy-dashboard-shell .legacy-log-entry .log-title a:not(.staff-user-link):focus-visible,
:root[data-theme="midnight"] .legacy-dashboard-shell .legacy-request-title-link:hover,
:root[data-theme="midnight"] .legacy-dashboard-shell .legacy-request-title-link:focus-visible {
  color: #c5eaff !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] .profile-rates-modal-scope .legacy-avatar-list {
  scrollbar-color: #5f86a3 #102032;
}

:root[data-theme="midnight"] .profile-rates-modal-scope .legacy-avatar-option {
  background: linear-gradient(#20384d, #16283a) !important;
  border-color: rgba(127, 166, 193, 0.46) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.07),
    0 2px 8px rgba(0,0,0,0.26) !important;
  color: #d9ecf9 !important;
}

:root[data-theme="midnight"] .profile-rates-modal-scope .legacy-avatar-option.is-current {
  border-color: #d4af37 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 2px rgba(212,175,55,0.25),
    0 2px 8px rgba(0,0,0,0.28) !important;
}

:root[data-theme="midnight"] .profile-rates-modal-scope .legacy-avatar-frame {
  border-color: #7fa6c1 !important;
  background: #24445c !important;
  box-shadow:
    0 4px 12px rgba(0,0,0,0.38),
    0 0 0 1px rgba(223,244,255,0.12) !important;
}

:root[data-theme="midnight"] .profile-rates-modal-scope .legacy-avatar-option.is-current .legacy-avatar-frame {
  border-color: #e0c35d !important;
}

:root[data-theme="midnight"] .profile-rates-modal-scope .legacy-avatar-option figcaption {
  color: #d9ecf9 !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.4) !important;
}

:root[data-theme="midnight"] .profile-rates-modal-scope .legacy-avatar-option.is-current figcaption {
  color: #ffe29a !important;
}

/* Final bold text correction: classic black bold must not leak into midnight. */
:root[data-theme="midnight"] :is(
  .box,
  .text,
  .profile-card,
  .help-modal-content,
  .staff-card,
  .legacy-request-card,
  .comment-body,
  .reply-body,
  .profile-description,
  .profile-rates-modal-scope
) :is(strong, b) {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .profile-rates-modal-scope #legacy-access-modal,
:root[data-theme="midnight"] .profile-rates-modal-scope #legacy-access-modal .form-message,
:root[data-theme="midnight"] .profile-rates-modal-scope #legacy-access-modal .form-message strong,
:root[data-theme="midnight"] .profile-rates-modal-scope #legacy-access-modal .legacy-access-permissions,
:root[data-theme="midnight"] .profile-rates-modal-scope #legacy-access-modal .legacy-access-permissions strong,
:root[data-theme="midnight"] .profile-rates-modal-scope #legacy-access-modal .level-field span {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] a.mention strong {
  color: inherit !important;
}

/* Final modal cleanup: row cards keep their borders, but their list wrappers
   should not draw a second faint frame in midnight mode. */
:root[data-theme="midnight"] .level-detail-page .level-rate-control span {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] :is(
  .level-detail-page .level-rates-modal-content .help-body,
  .level-detail-page .level-feature-modal-content .help-body,
  .level-detail-page .level-feature-history-modal-content .help-body,
  .profile-rates-modal-scope .level-rates-modal-content .help-body
) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] :is(
  .level-detail-page .level-rates-modal-content .rates-list,
  .level-detail-page .level-feature-modal-content .rates-list,
  .level-detail-page .level-feature-history-modal-content .rates-list,
  .level-detail-page #rates-list,
  .level-detail-page #feature-list,
  .profile-rates-modal-scope .level-rates-modal-content .rates-list,
  .profile-rates-modal-scope #profile-plays-list,
  .profile-rates-modal-scope #profile-rates-list
) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .profile-infractions-modal-content {
  background: linear-gradient(#1c2b3b, #152231) !important;
  border-color: var(--border) !important;
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .profile-infraction-list {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  scrollbar-color: #5f86a3 #102032;
}

:root[data-theme="midnight"] .profile-infraction-card {
  background: linear-gradient(#182b3c, #112131) !important;
  border-color: #547993 !important;
  color: #f5fbff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 2px 8px rgba(0,0,0,0.26) !important;
}

:root[data-theme="midnight"] .profile-infraction-card.active-infraction {
  border-color: #e0c35d !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 0 0 2px rgba(224,195,93,0.24),
    0 2px 8px rgba(0,0,0,0.3) !important;
}

:root[data-theme="midnight"] .profile-infraction-card-header h3,
:root[data-theme="midnight"] .profile-infraction-details dt,
:root[data-theme="midnight"] .profile-infraction-issued-staff {
  color: #9fd0ff !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35) !important;
}

:root[data-theme="midnight"] .profile-infraction-details div {
  background: linear-gradient(#142638, #0f1d2b) !important;
  border-color: #385269 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.05) !important;
}

:root[data-theme="midnight"] .profile-infraction-details dd {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .profile-infraction-issued-staff a,
:root[data-theme="midnight"] .profile-infraction-issued-staff-name {
  color: var(--role-color, #9fd0ff) !important;
}

/* Final level metadata pass: dates should read like the other metadata values,
   while status icons keep distinct, readable colors in midnight mode. */
:root[data-theme="midnight"] .level-detail-page .level-posted-date,
:root[data-theme="midnight"] .level-detail-page .level-side .level-posted-date,
:root[data-theme="midnight"] .level-detail-page .level-side .level-info-line strong.level-posted-with-visibility {
  color: #f5fbff !important;
  text-shadow: none !important;
}

:root[data-theme="midnight"] .level-detail-page .level-side .level-info-line.level-posted-line > span,
:root[data-theme="midnight"] .level-detail-page .level-side .level-info-line > span {
  color: #9fd0ff !important;
}

:root[data-theme="midnight"] :is(
  .level-detail-page .rate-entry time,
  .level-detail-page .feature-entry time,
  .level-detail-page .feature-entry-date,
  .profile-rates-modal-scope .rate-entry time,
  .profile-rates-modal-scope .profile-play-entry time,
  .profile-rates-modal-scope .profile-rate-entry time,
  .profile-rates-modal-scope .profile-rate-entry-legacy time
) {
  color: #d7e8f5 !important;
  text-shadow: none !important;
}

:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-visibility-public .comment-btn img {
  filter: brightness(0) saturate(100%) invert(80%) sepia(22%) saturate(841%) hue-rotate(165deg) brightness(103%) contrast(101%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-visibility-private .comment-btn img {
  filter: brightness(0) saturate(100%) invert(93%) sepia(10%) saturate(816%) hue-rotate(174deg) brightness(101%) contrast(98%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility :is(.level-visibility-deleted, .level-visibility-blacklisted) .comment-btn img {
  filter: brightness(0) saturate(100%) invert(72%) sepia(18%) saturate(2257%) hue-rotate(306deg) brightness(104%) contrast(101%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-feature-history-action .comment-btn img {
  filter: brightness(0) saturate(100%) invert(81%) sepia(24%) saturate(795%) hue-rotate(168deg) brightness(102%) contrast(101%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-feature-history-action.is-featured .comment-btn img {
  filter: brightness(0) saturate(100%) invert(91%) sepia(85%) saturate(982%) hue-rotate(356deg) brightness(108%) contrast(105%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-visual-filter-action .comment-btn img {
  filter: brightness(0) saturate(100%) invert(78%) sepia(41%) saturate(672%) hue-rotate(224deg) brightness(104%) contrast(101%) !important;
  opacity: 1 !important;
}

/* Legacy profiles have fewer summary fields than normal profiles. Keep their
   paired summary boxes compact instead of using the normal profile height. */
:root[data-theme="midnight"] .legacy-profile-page .profile-body {
  align-items: stretch !important;
}

:root[data-theme="midnight"] .legacy-profile-page .profile-main,
:root[data-theme="midnight"] .legacy-profile-page .profile-sidebar {
  height: auto !important;
  min-height: 0 !important;
}

:root[data-theme="midnight"] .legacy-profile-page .profile-main {
  display: flex !important;
  align-self: stretch !important;
}

:root[data-theme="midnight"] .legacy-profile-page .profile-sidebar {
  align-self: flex-start !important;
}

:root[data-theme="midnight"] .legacy-profile-page .profile-description,
:root[data-theme="midnight"] .legacy-profile-page .profile-stats {
  min-height: 0 !important;
  max-height: none !important;
}

:root[data-theme="midnight"] .legacy-profile-page .profile-description {
  height: auto !important;
  flex: 1 1 auto !important;
  overflow: auto !important;
}

:root[data-theme="midnight"] .legacy-profile-page .profile-stats {
  height: auto !important;
  gap: 8px !important;
  padding: 14px !important;
}

:root[data-theme="midnight"] .legacy-profile-page .profile-stats div {
  padding-bottom: 4px !important;
  margin-bottom: 0 !important;
}

@media (max-width: 900px) {
  :root[data-theme="midnight"] .legacy-profile-page .profile-main {
    align-self: auto !important;
  }
}

/* Specificity correction for legacy profiles: override the broad
   .box-inner.full-width:has(> .profile-card) summary-height rules above. */
:root[data-theme="midnight"] .legacy-profile-page .box-inner.full-width:has(> .profile-card) .profile-body {
  align-items: stretch !important;
}

:root[data-theme="midnight"] .legacy-profile-page .box-inner.full-width:has(> .profile-card) .profile-main,
:root[data-theme="midnight"] .legacy-profile-page .box-inner.full-width:has(> .profile-card) .profile-sidebar {
  height: auto !important;
  min-height: 0 !important;
}

:root[data-theme="midnight"] .legacy-profile-page .box-inner.full-width:has(> .profile-card) .profile-main {
  align-self: stretch !important;
  display: flex !important;
}

:root[data-theme="midnight"] .legacy-profile-page .box-inner.full-width:has(> .profile-card) .profile-sidebar {
  align-self: flex-start !important;
}

:root[data-theme="midnight"] .legacy-profile-page .box-inner.full-width:has(> .profile-card) .profile-description,
:root[data-theme="midnight"] .legacy-profile-page .box-inner.full-width:has(> .profile-card) .profile-stats {
  min-height: 0 !important;
  max-height: none !important;
}

:root[data-theme="midnight"] .legacy-profile-page .box-inner.full-width:has(> .profile-card) .profile-description {
  height: auto !important;
  flex: 1 1 auto !important;
}

:root[data-theme="midnight"] .legacy-profile-page .box-inner.full-width:has(> .profile-card) .profile-stats {
  height: auto !important;
  gap: 8px !important;
  padding: 14px !important;
}

:root[data-theme="midnight"] .legacy-profile-page .box-inner.full-width:has(> .profile-card) .profile-stats div {
  padding-bottom: 4px !important;
  margin-bottom: 0 !important;
}

@media (max-width: 900px) {
  :root[data-theme="midnight"] .legacy-profile-page .box-inner.full-width:has(> .profile-card) .profile-main,
  :root[data-theme="midnight"] .legacy-profile-page .box-inner.full-width:has(> .profile-card) .profile-sidebar {
    align-self: auto !important;
  }
}

/* Legacy level edit blacklisted visibility helper. */
:root[data-theme="midnight"] .level-form-page .level-radio-group label:has(input[value="blacklisted"]) > span:not(.legacy-blacklisted-info-wrap) {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .level-form-page .legacy-blacklisted-info-button {
  border-color: #7fa6c1 !important;
  background: linear-gradient(#25445c, #172b3e) !important;
  color: #dff4ff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.12),
    0 1px 4px rgba(0,0,0,0.28) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.45) !important;
}

:root[data-theme="midnight"] .level-form-page .legacy-blacklisted-info-button:hover,
:root[data-theme="midnight"] .level-form-page .legacy-blacklisted-info-button:focus-visible {
  border-color: #9fd0ff !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.14),
    0 0 0 2px rgba(127,166,193,0.3),
    0 1px 4px rgba(0,0,0,0.3) !important;
}

:root[data-theme="midnight"] .level-form-page .legacy-blacklisted-floating-notice,
:root[data-theme="midnight"] .legacy-blacklisted-floating-notice {
  border-color: #7fa6c1 !important;
  background: linear-gradient(#20384d, #142638) !important;
  color: #d9ecf9 !important;
  box-shadow: 0 8px 18px rgba(0,0,0,0.38) !important;
}

:root[data-theme="midnight"] .level-form-page .legacy-blacklisted-floating-notice::after,
:root[data-theme="midnight"] .legacy-blacklisted-floating-notice::after {
  border-right-color: #7fa6c1 !important;
  border-bottom-color: #7fa6c1 !important;
  background: #142638 !important;
}

:root[data-theme="midnight"] .level-form-page .legacy-blacklisted-floating-notice strong,
:root[data-theme="midnight"] .legacy-blacklisted-floating-notice strong {
  color: #ffffff !important;
}

/* Front-page dashboard content headings should use the global blue header text. */
:root[data-theme="midnight"] .member-panel-heading h2:has(img[src*="question.svg"]),
:root[data-theme="midnight"] .online-members-panel .member-panel-heading h2,
:root[data-theme="midnight"] .member-panel-heading h2:has(img[src*="book.svg"]) {
  color: var(--midnight-header-text, #9fd0ff) !important;
}

:root[data-theme="midnight"] .member-panel-heading h2:has(img[src*="question.svg"]) img,
:root[data-theme="midnight"] .online-members-panel .member-panel-heading h2 img,
:root[data-theme="midnight"] .member-panel-heading h2:has(img[src*="book.svg"]) img {
  opacity: 1 !important;
  filter: brightness(0) saturate(100%) invert(84%) sepia(28%) saturate(651%) hue-rotate(168deg) brightness(103%) contrast(101%) !important;
}

:root[data-theme="midnight"] .online-members-panel .member-panel-heading .online-count {
  color: var(--midnight-header-text, #9fd0ff) !important;
}

:root[data-theme="midnight"] .member-panel:has(#dashboardTips) .member-panel-heading h2,
:root[data-theme="midnight"] .member-panel:has(#onlineMembersList) .member-panel-heading h2,
:root[data-theme="midnight"] .member-panel:has(#dashboardAnnouncements) .member-panel-heading h2 {
  color: var(--midnight-header-text, #9fd0ff) !important;
}

:root[data-theme="midnight"] .member-panel:has(#dashboardTips) .member-panel-heading h2 img,
:root[data-theme="midnight"] .member-panel:has(#onlineMembersList) .member-panel-heading h2 img,
:root[data-theme="midnight"] .member-panel:has(#dashboardAnnouncements) .member-panel-heading h2 img,
:root[data-theme="midnight"] .member-panel:has(#dashboardTips) .member-panel-actions .comment-btn img,
:root[data-theme="midnight"] .member-panel:has(#dashboardAnnouncements) .member-panel-actions .comment-btn img {
  opacity: 1 !important;
  filter: brightness(0) saturate(100%) invert(84%) sepia(28%) saturate(651%) hue-rotate(168deg) brightness(103%) contrast(101%) !important;
}

/* Front-page tip and announcement item titles use the site-wide dark header blue. */
:root[data-theme="midnight"] #dashboardTips .tip-item strong,
:root[data-theme="midnight"] #dashboardAnnouncements .dashboard-list-item strong {
  color: var(--midnight-header-text, #9fd0ff) !important;
}

/* Front-page welcome panel: match the dashboard card surface. The inner wrapper
   stays transparent (as in classic) so the rounded border stays fully visible. */
:root[data-theme="midnight"] .member-welcome-box {
  background: linear-gradient(#1b2a39, #142231) !important;
  border-color: #385269 !important;
}

:root[data-theme="midnight"] .member-welcome-box .box-inner.single-column {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: var(--text) !important;
}

:root[data-theme="midnight"] .member-welcome-box .box-inner.single-column::before,
:root[data-theme="midnight"] .member-welcome-box .box-inner.single-column::after {
  background: #79b8e0 !important;
}

:root[data-theme="midnight"] .member-welcome-box .single-column .text,
:root[data-theme="midnight"] .member-welcome-box .box-inner.single-column > .text {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Final log text correction: shared dashboard log rows inherit blue from
   staff-dashboard.css, but only links and role-colored usernames should be blue. */
:root[data-theme="midnight"] :is(#staff-panel, #legacy-panel) .log-title,
:root[data-theme="midnight"] :is(#staff-panel, #legacy-panel) .log-title > span {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] :is(#staff-panel, #legacy-panel) .log-title a:not(.staff-user-link):not([style]) {
  color: #8fd0ff !important;
}

:root[data-theme="midnight"] :is(#staff-panel, #legacy-panel) .log-title a:not(.staff-user-link):not([style]):hover,
:root[data-theme="midnight"] :is(#staff-panel, #legacy-panel) .log-title a:not(.staff-user-link):not([style]):focus-visible {
  color: #c5eaff !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

/* Staff user cards: match the filter label styling above the results. */
:root[data-theme="midnight"] #staff-panel .user-fields dt {
  color: var(--soft-text) !important;
}

:root[data-theme="midnight"] #staff-panel .user-fields dd {
  color: #f5fbff !important;
}

/* Native select menus: keep dropdown popups consistent with the dark controls.
   Browsers render option popups separately, so the option colors must be set too. */
:root[data-theme="midnight"] select,
:root[data-theme="midnight"] select option,
:root[data-theme="midnight"] select optgroup,
:root[data-theme="midnight"] .staff-input option,
:root[data-theme="midnight"] .role-select option,
:root[data-theme="midnight"] .background-select-input option,
:root[data-theme="midnight"] .level-detail-page .level-rate-control select option {
  background-color: #08111c !important;
  color: #f5fbff !important;
}

:root[data-theme="midnight"] select option:checked,
:root[data-theme="midnight"] select option:hover,
:root[data-theme="midnight"] select option:focus,
:root[data-theme="midnight"] .staff-input option:checked,
:root[data-theme="midnight"] .role-select option:checked,
:root[data-theme="midnight"] .background-select-input option:checked,
:root[data-theme="midnight"] .level-detail-page .level-rate-control select option:checked {
  background-color: #25435a !important;
  color: #ffffff !important;
}

/* Level code actions should match the shared button treatment used by Rate Level. */
:root[data-theme="midnight"] .level-detail-page .level-code-actions button,
:root[data-theme="midnight"] .level-detail-page .level-code-actions a {
  background: var(--button-bg) !important;
  border-color: var(--button-border) !important;
  color: var(--button-text) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.12),
    inset 0 0 10px rgba(190,205,217,0.12),
    0 2px 5px rgba(0,0,0,0.34) !important;
}

:root[data-theme="midnight"] .level-detail-page .level-code-actions button:not(:disabled):hover,
:root[data-theme="midnight"] .level-detail-page .level-code-actions a:hover {
  background: var(--button-hover-bg) !important;
  border-color: var(--button-hover-border) !important;
  color: var(--button-hover-text) !important;
  box-shadow: var(--button-hover-shadow) !important;
}

:root[data-theme="midnight"] .level-detail-page .level-code-actions button:not(:disabled):active,
:root[data-theme="midnight"] .level-detail-page .level-code-actions a:active {
  background: var(--button-active-bg) !important;
  box-shadow: var(--button-active-shadow) !important;
}

:root[data-theme="midnight"] .level-detail-page .level-code-actions button:focus-visible,
:root[data-theme="midnight"] .level-detail-page .level-code-actions a:focus-visible {
  outline: 2px solid rgba(121,184,224,0.72) !important;
  outline-offset: 2px !important;
}

/* Header account dropdown should match the dark profile action menu. */
:root[data-theme="midnight"] .auth .user-menu .dropdown {
  background: linear-gradient(#21394e, #142638) !important;
  border-color: #5d88a6 !important;
  box-shadow: 0 8px 22px rgba(0,0,0,0.4) !important;
  overflow: hidden !important;
}

:root[data-theme="midnight"] .auth .user-menu .dropdown a {
  background: transparent !important;
  border-top: 0 !important;
  border-bottom: 1px solid rgba(143,208,255,0.18) !important;
  color: #eaf8ff !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .auth .user-menu .dropdown a:last-child {
  border-bottom: 0 !important;
}

:root[data-theme="midnight"] .auth .user-menu .dropdown a:hover,
:root[data-theme="midnight"] .auth .user-menu .dropdown a:focus-visible {
  background: rgba(121,184,224,0.18) !important;
  border-top: 0 !important;
  border-bottom-color: rgba(143,208,255,0.18) !important;
  color: #eaf8ff !important;
  box-shadow: inset 3px 0 0 #79b8e0 !important;
}

:root[data-theme="midnight"] .auth .user-menu .dropdown a:hover + a {
  border-top: 0 !important;
}

:root[data-theme="midnight"] .auth .user-menu .dropdown-divider {
  border-top-color: rgba(143,208,255,0.18) !important;
}

/* Dark tabs should not change color on hover; keep only the active indicator. */
:root[data-theme="midnight"] :is(
  .edit-tab,
  .history-tab,
  .profile-source-tab,
  .music-source-tab,
  .staff-tab,
  .staff-subtab,
  .report-tab,
  .legacy-log-tab,
  .levels-tab,
  .members-tab,
  .notification-status-tab,
  .game-tab,
  .tab-btn,
  .tabs a,
  .tabs button,
  .sub-tabs a,
  .sub-tabs button,
  .profile-tabs a,
  .edit-profile-tabs a,
  .settings-tabs a
),
:root[data-theme="midnight"] :is(
  .edit-tab,
  .history-tab,
  .profile-source-tab,
  .music-source-tab,
  .staff-tab,
  .staff-subtab,
  .report-tab,
  .legacy-log-tab,
  .levels-tab,
  .members-tab,
  .notification-status-tab,
  .game-tab,
  .tab-btn,
  .tabs a,
  .tabs button,
  .sub-tabs a,
  .sub-tabs button,
  .profile-tabs a,
  .edit-profile-tabs a,
  .settings-tabs a
)::after {
  transition: none !important;
}

:root[data-theme="midnight"] :is(
  .edit-tab,
  .history-tab,
  .profile-source-tab,
  .music-source-tab,
  .staff-tab,
  .staff-subtab,
  .report-tab,
  .legacy-log-tab,
  .levels-tab,
  .members-tab,
  .notification-status-tab,
  .game-tab,
  .tab-btn,
  .tabs a,
  .tabs button,
  .sub-tabs a,
  .sub-tabs button,
  .profile-tabs a,
  .edit-profile-tabs a,
  .settings-tabs a
):not(.active):not([aria-selected="true"]) {
  color: var(--midnight-header-text, #9fd0ff) !important;
}

:root[data-theme="midnight"] :is(
  .edit-tab,
  .history-tab,
  .profile-source-tab,
  .music-source-tab,
  .staff-tab,
  .staff-subtab,
  .report-tab,
  .legacy-log-tab,
  .levels-tab,
  .members-tab,
  .notification-status-tab,
  .game-tab,
  .tab-btn,
  .tabs a,
  .tabs button,
  .sub-tabs a,
  .sub-tabs button,
  .profile-tabs a,
  .edit-profile-tabs a,
  .settings-tabs a
):not(.active):not([aria-selected="true"]):hover,
:root[data-theme="midnight"] :is(
  .edit-tab,
  .history-tab,
  .profile-source-tab,
  .music-source-tab,
  .staff-tab,
  .staff-subtab,
  .report-tab,
  .legacy-log-tab,
  .levels-tab,
  .members-tab,
  .notification-status-tab,
  .game-tab,
  .tab-btn,
  .tabs a,
  .tabs button,
  .sub-tabs a,
  .sub-tabs button,
  .profile-tabs a,
  .edit-profile-tabs a,
  .settings-tabs a
):not(.active):not([aria-selected="true"]):focus-visible {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: var(--midnight-header-text, #9fd0ff) !important;
  transform: none !important;
  transition: none !important;
}

/* Final notification pass: status filters keep their sizing, unselected hover uses global buttons, and unread cards get a green accent. */
:root[data-theme="midnight"] .notifications-page .notification-status-tab:not(.active):not([aria-selected="true"]) {
  min-height: 42px !important;
  padding: 10px 14px !important;
  border: 1px solid var(--button-border) !important;
  border-radius: 8px !important;
  background: var(--button-bg) !important;
  color: var(--button-text) !important;
  box-shadow: var(--button-shadow) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-status-tab:not(.active):not([aria-selected="true"]):hover,
:root[data-theme="midnight"] .notifications-page .notification-status-tab:not(.active):not([aria-selected="true"]):focus-visible {
  border-color: var(--button-hover-border) !important;
  background: var(--button-hover-bg) !important;
  color: var(--button-hover-text) !important;
  box-shadow: var(--button-hover-shadow) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-status-tab.active,
:root[data-theme="midnight"] .notifications-page .notification-status-tab[aria-selected="true"],
:root[data-theme="midnight"] .notifications-page .notification-status-tab.active:hover,
:root[data-theme="midnight"] .notifications-page .notification-status-tab[aria-selected="true"]:hover,
:root[data-theme="midnight"] .notifications-page .notification-status-tab.active:focus-visible,
:root[data-theme="midnight"] .notifications-page .notification-status-tab[aria-selected="true"]:focus-visible {
  min-height: 42px !important;
  padding: 10px 14px !important;
  border: 1px solid #8fc8ff !important;
  border-radius: 8px !important;
  background: linear-gradient(#5f9fc8, #3f789d) !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.22),
    inset 0 -1px 0 rgba(0,0,0,0.18),
    0 2px 6px rgba(0,0,0,0.34) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-status-tab::after {
  content: none !important;
}

:root[data-theme="midnight"] .notifications-page .notification-item.unread {
  border-color: #426f58 !important;
  border-left-color: #66c985 !important;
  border-left-width: 2px !important;
  background: linear-gradient(#1d342f, #162c2b) !important;
  box-shadow:
    inset 0 1px 0 rgba(154,255,188,0.08),
    0 2px 7px rgba(0,0,0,0.28) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-item.unread:hover {
  border-color: #5d9a73 !important;
  border-left-color: #84e3a0 !important;
  border-left-width: 2px !important;
  background: linear-gradient(#243f37, #1a3532) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-state.new {
  background: linear-gradient(#1f4a35, #173628) !important;
  border-color: #66c985 !important;
  color: #a7f2bb !important;
  box-shadow: none !important;
}

/* Absolute final username hover rule: role-colored usernames only gain an underline on hover. */
:root[data-theme="midnight"] :is(
  .member-name,
  .member-role,
  .comment-username,
  .reply-username,
  .comment-history-title-link,
  .review-history-title-link,
  .profile-rates-modal-scope .profile-rate-author a,
  .profile-rates-modal-scope .profile-rate-author > span,
  .profile-rates-modal-scope .profile-list-username,
  .level-row-author,
  .level-card-author,
  .level-card-author .level-card-username,
  .level-detail-page .level-author-card .member-name,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention,
  .profile-name,
  .banner-preview-name
)[style*="--role-color"] {
  color: var(--role-color, currentColor) !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] :is(
  .member-name,
  .comment-username,
  .reply-username,
  .comment-history-title-link,
  .review-history-title-link,
  .profile-rates-modal-scope .profile-rate-author a,
  .profile-rates-modal-scope .profile-list-username,
  .level-row-author,
  .level-card-author,
  .level-detail-page .level-author-card .member-name,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention
)[style*="--role-color"]:is(:hover, :focus-visible) {
  color: var(--role-color, currentColor) !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] :is(
  .member-name,
  .comment-username,
  .reply-username,
  .comment-history-title-link,
  .review-history-title-link,
  .profile-rates-modal-scope .profile-rate-author a,
  .profile-rates-modal-scope .profile-list-username,
  .level-row-author,
  .level-card-author,
  .level-detail-page .level-author-card .member-name,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention
)[style]:is(:hover, :focus-visible) {
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] :is(.member-name, .comment-username, .reply-username, .comment-history-title-link, .review-history-title-link, .profile-rates-modal-scope .profile-rate-author a, .profile-rates-modal-scope .profile-list-username, .level-row-author, .level-card-author, .notification-sender, .staff-user-link, .staff-inline-user, .online-member, .mention)[style*="#990099"]:is(:hover, :focus-visible) { color: #f18cff !important; }
:root[data-theme="midnight"] :is(.member-name, .comment-username, .reply-username, .comment-history-title-link, .review-history-title-link, .profile-rates-modal-scope .profile-rate-author a, .profile-rates-modal-scope .profile-list-username, .level-row-author, .level-card-author, .notification-sender, .staff-user-link, .staff-inline-user, .online-member, .mention)[style*="#ff9900"]:is(:hover, :focus-visible),
:root[data-theme="midnight"] :is(.member-name, .comment-username, .reply-username, .comment-history-title-link, .review-history-title-link, .profile-rates-modal-scope .profile-rate-author a, .profile-rates-modal-scope .profile-list-username, .level-row-author, .level-card-author, .notification-sender, .staff-user-link, .staff-inline-user, .online-member, .mention)[style*="#FF9900"]:is(:hover, :focus-visible) { color: #ffd47f !important; }
:root[data-theme="midnight"] :is(.member-name, .comment-username, .reply-username, .comment-history-title-link, .review-history-title-link, .profile-rates-modal-scope .profile-rate-author a, .profile-rates-modal-scope .profile-list-username, .level-row-author, .level-card-author, .notification-sender, .staff-user-link, .staff-inline-user, .online-member, .mention)[style*="#008000"]:is(:hover, :focus-visible) { color: #8cf59d !important; }
:root[data-theme="midnight"] :is(.member-name, .comment-username, .reply-username, .comment-history-title-link, .review-history-title-link, .profile-rates-modal-scope .profile-rate-author a, .profile-rates-modal-scope .profile-list-username, .level-row-author, .level-card-author, .notification-sender, .staff-user-link, .staff-inline-user, .online-member, .mention)[style*="#0066ff"]:is(:hover, :focus-visible),
:root[data-theme="midnight"] :is(.member-name, .comment-username, .reply-username, .comment-history-title-link, .review-history-title-link, .profile-rates-modal-scope .profile-rate-author a, .profile-rates-modal-scope .profile-list-username, .level-row-author, .level-card-author, .notification-sender, .staff-user-link, .staff-inline-user, .online-member, .mention)[style*="#0066FF"]:is(:hover, :focus-visible) { color: #42cfff !important; }
:root[data-theme="midnight"] :is(.member-name, .comment-username, .reply-username, .comment-history-title-link, .review-history-title-link, .profile-rates-modal-scope .profile-rate-author a, .profile-rates-modal-scope .profile-list-username, .level-row-author, .level-card-author, .notification-sender, .staff-user-link, .staff-inline-user, .online-member, .mention)[style*="#c2185b"]:is(:hover, :focus-visible) { color: #ff8db6 !important; }
:root[data-theme="midnight"] :is(.member-name, .comment-username, .reply-username, .comment-history-title-link, .review-history-title-link, .profile-rates-modal-scope .profile-rate-author a, .profile-rates-modal-scope .profile-list-username, .level-row-author, .level-card-author, .notification-sender, .staff-user-link, .staff-inline-user, .online-member, .mention)[style*="#414141"]:is(:hover, :focus-visible) { color: #f5fbff !important; }
:root[data-theme="midnight"] :is(.member-name, .comment-username, .reply-username, .comment-history-title-link, .review-history-title-link, .profile-rates-modal-scope .profile-rate-author a, .profile-rates-modal-scope .profile-list-username, .level-row-author, .level-card-author, .notification-sender, .staff-user-link, .staff-inline-user, .online-member, .mention)[style*="#9aa3ad"]:is(:hover, :focus-visible) { color: #b9c8d6 !important; }
:root[data-theme="midnight"] :is(.member-name, .comment-username, .reply-username, .comment-history-title-link, .review-history-title-link, .profile-rates-modal-scope .profile-rate-author a, .profile-rates-modal-scope .profile-list-username, .level-row-author, .level-card-author, .notification-sender, .staff-user-link, .staff-inline-user, .online-member, .mention)[style*="#555f68"]:is(:hover, :focus-visible) { color: #a3b5c4 !important; }
:root[data-theme="midnight"] :is(.member-name, .comment-username, .reply-username, .comment-history-title-link, .review-history-title-link, .profile-rates-modal-scope .profile-rate-author a, .profile-rates-modal-scope .profile-list-username, .level-row-author, .level-card-author, .notification-sender, .staff-user-link, .staff-inline-user, .online-member, .mention)[style*="#4f7180"]:is(:hover, :focus-visible) { color: #7fa6c1 !important; }
:root[data-theme="midnight"] :is(.member-name, .comment-username, .reply-username, .comment-history-title-link, .review-history-title-link, .profile-rates-modal-scope .profile-rate-author a, .profile-rates-modal-scope .profile-list-username, .level-row-author, .level-card-author, .notification-sender, .staff-user-link, .staff-inline-user, .online-member, .mention)[style*="#861717"]:is(:hover, :focus-visible) { color: #ff8f96 !important; }

/* Final role-link pass: preserve role colors and make hover underlines inherit the same color. */
:root[data-theme="midnight"] :is(
  .member-name,
  .member-role,
  .comment-username,
  .reply-username,
  .comment-history-title-link,
  .review-history-title-link,
  .profile-rates-modal-scope .profile-rate-author a,
  .profile-rates-modal-scope .profile-rate-author > span,
  .profile-rates-modal-scope .profile-list-username,
  .level-row-author,
  .level-card-author,
  .level-card-author .level-card-username,
  .level-detail-page .level-author-card .member-name,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention,
  .profile-name,
  .banner-preview-name
)[style*="--role-color"] {
  color: var(--role-color, currentColor) !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] :is(
  .member-name,
  .comment-username,
  .reply-username,
  .comment-history-title-link,
  .review-history-title-link,
  .profile-rates-modal-scope .profile-rate-author a,
  .profile-rates-modal-scope .profile-list-username,
  .level-row-author,
  .level-card-author,
  .level-detail-page .level-author-card .member-name,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention
)[style*="--role-color"]:is(:hover, :focus-visible) {
  color: var(--role-color, currentColor) !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] :is(
  .level-card-author[style*="--role-color"]:is(:hover, :focus-visible) .level-card-username
) {
  color: var(--role-color, currentColor) !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] :is(
  .member-name,
  .comment-username,
  .reply-username,
  .comment-history-title-link,
  .review-history-title-link,
  .profile-rates-modal-scope .profile-rate-author a,
  .profile-rates-modal-scope .profile-list-username,
  .level-row-author,
  .level-card-author,
  .level-detail-page .level-author-card .member-name,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention
)[style]:is(:hover, :focus-visible) {
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

/* Final level status pass: private uses the same white accent as private profile comments, without icon glow. */
:root[data-theme="midnight"] .levels-grid .level-row:has(.level-status-private),
:root[data-theme="midnight"] .level-row:has(.level-status-private) {
  background: rgba(245,251,255,0.07) !important;
}

:root[data-theme="midnight"] .levels-grid .level-row:has(.level-status-private):hover,
:root[data-theme="midnight"] .level-row:has(.level-status-private):hover {
  background: rgba(245,251,255,0.11) !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-browse-card:has(.level-status-private) {
  border-color: rgba(245,251,255,0.66) !important;
  background: linear-gradient(#1d3041, #142535) !important;
  box-shadow:
    inset 0 1px 0 rgba(245,251,255,0.08),
    0 0 0 1px rgba(245,251,255,0.18),
    0 2px 8px rgba(0,0,0,0.24) !important;
}

:root[data-theme="midnight"] :is(
  .level-status-row-badge.level-status-private,
  .level-status-card-badge.level-status-private
) img {
  filter: brightness(0) saturate(100%) invert(96%) sepia(7%) saturate(616%) hue-rotate(177deg) brightness(103%) contrast(103%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] :is(
  .level-status-row-badge.level-status-deleted,
  .level-status-card-badge.level-status-deleted
) img {
  filter: brightness(0) saturate(100%) invert(74%) sepia(25%) saturate(1516%) hue-rotate(307deg) brightness(102%) contrast(101%) !important;
  opacity: 1 !important;
}

/* Final thumbnail behavior pass: real thumbnails keep only the frame behind short images and center within it. */
:root[data-theme="midnight"] :is(
  .level-browse-thumb.has-thumbnail,
  .levels-card-grid .level-browse-thumb.has-thumbnail,
  .level-detail-page .level-thumbnail-section .level-detail-thumb.has-thumbnail,
  .level-thumbnail-preview.has-thumbnail,
  .level-detail-page .level-thumbnail-modal-content .level-thumbnail-preview.has-thumbnail
) {
  background: transparent !important;
  background-image: none !important;
  outline: none !important;
  outline-offset: 0 !important;
}

:root[data-theme="midnight"] :is(
  .level-browse-thumb.has-thumbnail,
  .level-detail-page .level-thumbnail-section .level-detail-thumb.has-thumbnail,
  .level-thumbnail-preview.has-thumbnail,
  .level-detail-page .level-thumbnail-modal-content .level-thumbnail-preview.has-thumbnail
) {
  align-items: center !important;
  justify-content: center !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-browse-thumb.has-thumbnail .level-thumb-media {
  display: grid !important;
  place-items: center !important;
  background: transparent !important;
}

:root[data-theme="midnight"] :is(
  .level-browse-thumb.has-thumbnail img,
  .levels-card-grid .level-browse-thumb.has-thumbnail img,
  .level-detail-page .level-thumbnail-section .level-detail-thumb.has-thumbnail .level-detail-thumb-image,
  .level-thumbnail-preview.has-thumbnail img,
  .level-detail-page .level-thumbnail-modal-content .level-thumbnail-preview.has-thumbnail img
) {
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  display: block !important;
  object-fit: initial !important;
  object-position: center center !important;
  background: transparent !important;
}

/* Final pinned-comment status pass: history views match profile comment cards. */
:root[data-theme="midnight"] .comment-history-list .history-entry.pinned-comment,
:root[data-theme="midnight"] .review-history-list .history-entry.pinned-comment {
  background: linear-gradient(#1b2f43, #152739) !important;
  border: 2px solid #e0bd4f !important;
  box-shadow:
    0 0 0 1px rgba(224,189,79,0.34),
    0 3px 10px rgba(0,0,0,0.24) !important;
}

:root[data-theme="midnight"] .comment-history-list .pinned-badge,
:root[data-theme="midnight"] .review-history-list .pinned-badge {
  color: #ffd95f !important;
}

/* Final deleted-comment status pass: history views match profile comment cards. */
:root[data-theme="midnight"] .comment-history-list .history-entry.deleted-comment,
:root[data-theme="midnight"] .review-history-list .history-entry.deleted-comment {
  background: linear-gradient(#282638, #1a2332) !important;
  border-color: #d96a74 !important;
  box-shadow:
    0 0 0 1px rgba(217,106,116,0.22),
    0 3px 10px rgba(0,0,0,0.24) !important;
}

:root[data-theme="midnight"] .comment-history-list .deleted-comment::before,
:root[data-theme="midnight"] .review-history-list .deleted-comment::before {
  color: #ff9aa4 !important;
}

/* Final private/locked status pass: dark mode swaps the original status
   treatments exactly. PRIVATE uses the white treatment; LOCKED uses gray. */
:root[data-theme="midnight"] .comment.private-comment,
:root[data-theme="midnight"] .reply.private-comment,
:root[data-theme="midnight"] .level-comment.private-comment,
:root[data-theme="midnight"] .comment-history-list .history-entry.private-comment,
:root[data-theme="midnight"] .review-history-list .history-entry.private-comment {
  border: 2px solid #f5fbff !important;
  box-shadow:
    0 0 0 1px rgba(245,251,255,0.34),
    0 3px 10px rgba(0,0,0,0.2) !important;
}

:root[data-theme="midnight"] .private-comment::before,
:root[data-theme="midnight"] .private-locked-badge,
:root[data-theme="midnight"] .comment-history-list .private-comment::before,
:root[data-theme="midnight"] .comment-history-list .private-locked-badge,
:root[data-theme="midnight"] .review-history-list .private-comment::before {
  color: #f5fbff !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .comment.locked-comment:not(.private-comment),
:root[data-theme="midnight"] .reply.locked-comment:not(.private-comment),
:root[data-theme="midnight"] .level-comment.locked-comment:not(.private-comment),
:root[data-theme="midnight"] .comment-history-list .history-entry.locked-comment:not(.private-comment),
:root[data-theme="midnight"] .review-history-list .history-entry.locked-comment:not(.private-comment) {
  border: 2px solid #b9c8d6 !important;
  background: var(--midnight-profile-field) !important;
  box-shadow:
    inset 0 1px 0 rgba(245,251,255,0.04),
    0 0 0 1px rgba(185,200,214,0.24),
    0 0 10px rgba(0,0,0,0.18) !important;
}

:root[data-theme="midnight"] .locked-badge {
  color: #b9c8d6 !important;
  opacity: 1 !important;
}

/* Final notification correction: status filters use global button CSS, unread accent is a thin line. */
:root[data-theme="midnight"] .notifications-page .notification-status-tab:not(.active):not([aria-selected="true"]) {
  min-height: auto !important;
  padding: 6px 14px !important;
  border: 1px solid var(--button-border) !important;
  border-radius: 10px !important;
  background: var(--button-bg) !important;
  color: var(--button-text) !important;
  box-shadow: var(--button-shadow) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-status-tab:not(.active):not([aria-selected="true"]):hover,
:root[data-theme="midnight"] .notifications-page .notification-status-tab:not(.active):not([aria-selected="true"]):focus-visible {
  border-color: var(--button-hover-border) !important;
  background: var(--button-hover-bg) !important;
  color: var(--button-hover-text) !important;
  box-shadow: var(--button-hover-shadow) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-status-tab.active,
:root[data-theme="midnight"] .notifications-page .notification-status-tab[aria-selected="true"] {
  border-radius: 10px !important;
}

:root[data-theme="midnight"] .notifications-page .notification-item.unread {
  border-left-width: 2px !important;
  box-shadow:
    inset 0 1px 0 rgba(255,236,162,0.08),
    0 2px 7px rgba(0,0,0,0.28) !important;
}

/* Final notification refinement: use standard site button styling and a slimmer unread accent. */
:root[data-theme="midnight"] .notifications-page .notification-status-tab {
  border-color: var(--button-border) !important;
  background: var(--button-bg) !important;
  color: var(--button-text) !important;
  box-shadow: var(--button-shadow) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-status-tab:hover,
:root[data-theme="midnight"] .notifications-page .notification-status-tab:focus-visible {
  border-color: var(--button-hover-border) !important;
  background: var(--button-hover-bg) !important;
  color: var(--button-hover-text) !important;
  box-shadow: var(--button-hover-shadow) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-status-tab.active,
:root[data-theme="midnight"] .notifications-page .notification-status-tab[aria-selected="true"],
:root[data-theme="midnight"] .notifications-page .notification-status-tab.active:hover,
:root[data-theme="midnight"] .notifications-page .notification-status-tab[aria-selected="true"]:hover,
:root[data-theme="midnight"] .notifications-page .notification-status-tab.active:focus-visible,
:root[data-theme="midnight"] .notifications-page .notification-status-tab[aria-selected="true"]:focus-visible {
  border-color: var(--button-hover-border) !important;
  background: var(--button-active-bg) !important;
  color: var(--button-hover-text) !important;
  box-shadow: var(--button-active-shadow) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-item.unread {
  border-left-width: 2px !important;
  box-shadow:
    inset 2px 0 0 rgba(242,201,76,0.58),
    inset 0 1px 0 rgba(255,236,162,0.08),
    0 2px 7px rgba(0,0,0,0.28) !important;
}

/* Final notification pass: status filters remain buttons and unread cards get a gold accent. */
:root[data-theme="midnight"] .notifications-page .notification-status-tab {
  min-height: 42px !important;
  padding: 10px 14px !important;
  border: 1px solid #496f8b !important;
  border-radius: 8px !important;
  background: linear-gradient(#20384d, #172a3c) !important;
  color: #bfe8ff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 2px 5px rgba(0,0,0,0.28) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-status-tab:hover,
:root[data-theme="midnight"] .notifications-page .notification-status-tab:focus-visible {
  border-color: #78abd0 !important;
  background: linear-gradient(#29465f, #1c3449) !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.12),
    0 2px 6px rgba(0,0,0,0.34) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-status-tab.active,
:root[data-theme="midnight"] .notifications-page .notification-status-tab[aria-selected="true"],
:root[data-theme="midnight"] .notifications-page .notification-status-tab.active:hover,
:root[data-theme="midnight"] .notifications-page .notification-status-tab[aria-selected="true"]:hover,
:root[data-theme="midnight"] .notifications-page .notification-status-tab.active:focus-visible,
:root[data-theme="midnight"] .notifications-page .notification-status-tab[aria-selected="true"]:focus-visible {
  border-color: #8fc8ff !important;
  background: linear-gradient(#5f9fc8, #3f789d) !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.22),
    inset 0 -1px 0 rgba(0,0,0,0.18),
    0 2px 6px rgba(0,0,0,0.34) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-status-tab::after {
  content: none !important;
}

:root[data-theme="midnight"] .notifications-page .notification-item.unread {
  border-color: #7d6935 !important;
  border-left-color: #f2c94c !important;
  background: linear-gradient(#1f2f37, #172733) !important;
  box-shadow:
    inset 4px 0 0 rgba(242,201,76,0.55),
    inset 0 1px 0 rgba(255,236,162,0.08),
    0 2px 7px rgba(0,0,0,0.28) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-item.unread:hover {
  border-color: #b9943c !important;
  border-left-color: #ffd866 !important;
  background: linear-gradient(#243944, #1a2f3c) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-state.new {
  background: linear-gradient(#4c3a14, #30250f) !important;
  border-color: #f2c94c !important;
  color: #ffe28a !important;
  box-shadow: none !important;
}

/* Notification filter tabs are button controls, not dashboard-style text tabs. */
:root[data-theme="midnight"] .notifications-page .notification-status-tab {
  min-height: 42px !important;
  padding: 10px 14px !important;
  border: 1px solid #496f8b !important;
  border-radius: 8px !important;
  background: linear-gradient(#20384d, #172a3c) !important;
  color: #bfe8ff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 2px 5px rgba(0,0,0,0.28) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-status-tab:hover,
:root[data-theme="midnight"] .notifications-page .notification-status-tab:focus-visible {
  border-color: #78abd0 !important;
  background: linear-gradient(#29465f, #1c3449) !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.12),
    0 2px 6px rgba(0,0,0,0.34) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-status-tab.active,
:root[data-theme="midnight"] .notifications-page .notification-status-tab[aria-selected="true"] {
  border-color: #8fc8ff !important;
  background: linear-gradient(#5f9fc8, #3f789d) !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.22),
    inset 0 -1px 0 rgba(0,0,0,0.18),
    0 2px 6px rgba(0,0,0,0.34) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-status-tab::after {
  content: none !important;
}

/* Unread notifications get a gold accent in dark mode. */
:root[data-theme="midnight"] .notifications-page .notification-item.unread {
  border-color: #7d6935 !important;
  border-left-color: #f2c94c !important;
  background: linear-gradient(#1f2f37, #172733) !important;
  box-shadow:
    inset 4px 0 0 rgba(242,201,76,0.55),
    inset 0 1px 0 rgba(255,236,162,0.08),
    0 2px 7px rgba(0,0,0,0.28) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-item.unread:hover {
  border-color: #b9943c !important;
  border-left-color: #ffd866 !important;
  background: linear-gradient(#243944, #1a2f3c) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-state.new {
  background: linear-gradient(#4c3a14, #30250f) !important;
  border-color: #f2c94c !important;
  color: #ffe28a !important;
  box-shadow: none !important;
}

/* Banner images are authored inline so saved and previewed banners remain
   visible above the dark-theme fallback panel. */
:root[data-theme="midnight"] .profile-banner-inner[style*="background-image"],
:root[data-theme="midnight"] .banner-preview-inner[style*="background-image"] {
  inset: -2px !important;
  width: auto !important;
  height: auto !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: inherit !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .profile-banner:has(.profile-banner-inner[style*="background-image"]),
:root[data-theme="midnight"] .banner-preview:has(.banner-preview-inner[style*="background-image"]) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  overflow: hidden !important;
}

:root[data-theme="midnight"] .banner-preview-name {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
}

/* Preserve role colors where dark-theme link normalization would otherwise
   flatten usernames back to the standard blue. */
:root[data-theme="midnight"] :is(
  .level-row-author,
  .level-card-author,
  .level-card-author .level-card-username,
  .levels-profile-title-link,
  .credits-list a
) {
  color: var(--role-color, var(--role-accent, #f5fbff)) !important;
}

:root[data-theme="midnight"] :is(
  .level-row-author:hover,
  .level-row-author:focus-visible,
  .level-card-author:hover,
  .level-card-author:focus-visible,
  .level-card-author:hover .level-card-username,
  .level-card-author:focus-visible .level-card-username,
  .levels-profile-title-link:hover,
  .levels-profile-title-link:focus-visible,
  .credits-list a:hover,
  .credits-list a:focus-visible
) {
  color: var(--role-color, var(--role-accent, #ffffff)) !important;
}

:root[data-theme="midnight"] .credits-group .credits-list a {
  color: var(--role-accent, #79b8e0) !important;
}

:root[data-theme="midnight"] .credits-group .credits-list a:hover,
:root[data-theme="midnight"] .credits-group .credits-list a:focus-visible {
  color: color-mix(in srgb, var(--role-accent, #79b8e0) 70%, #ffffff) !important;
}

/* Let expanded profile descriptions grow the summary card in midnight mode. */
:root[data-theme="midnight"] .profile-card .profile-body:has(.profile-main.description-expanded) {
  align-items: flex-start !important;
}

:root[data-theme="midnight"] .profile-card .profile-main.description-expanded {
  height: auto !important;
  min-height: var(--profile-summary-height) !important;
}

:root[data-theme="midnight"] .profile-card .profile-main.description-expanded > .profile-description,
:root[data-theme="midnight"] .profile-card .profile-description.is-expanded {
  height: auto !important;
  min-height: var(--profile-summary-height) !important;
  max-height: none !important;
  overflow: visible !important;
}

/* Keep profile stat labels blue after broad midnight text normalization. */
:root[data-theme="midnight"] .profile-card .profile-stats strong {
  color: #9fd0ff !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.35) !important;
}


:root[data-theme="midnight"] .info-page .single-column .text .credits-group h3 {
  color: var(--role-accent, #79b8e0) !important;
}

:root[data-theme="midnight"] .info-page .special-thanks-list .special-thanks-founder,
:root[data-theme="midnight"] .info-page .special-thanks-list .special-thanks-founder:visited,
:root[data-theme="midnight"] .info-page .special-thanks-list .special-thanks-founder strong {
  color: #f18cff !important;
}

:root[data-theme="midnight"] .info-page .special-thanks-list .special-thanks-admin,
:root[data-theme="midnight"] .info-page .special-thanks-list .special-thanks-admin:visited,
:root[data-theme="midnight"] .info-page .special-thanks-list .special-thanks-admin strong {
  color: #ffd47f !important;
}

:root[data-theme="midnight"] .info-page .special-thanks-list .special-thanks-contributor,
:root[data-theme="midnight"] .info-page .special-thanks-list .special-thanks-contributor:visited,
:root[data-theme="midnight"] .info-page .special-thanks-list .special-thanks-contributor strong {
  color: #42cfff !important;
}

/* Standalone utility pages: RNGdle and Energy. */
:root[data-theme="midnight"] :is(.rngdle-page, .energy-page) :is(.rngdle-panel, .energy-panel) {
  background: var(--midnight-panel-surface) !important;
  border-color: var(--midnight-border) !important;
  color: var(--midnight-text) !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] :is(.rngdle-page, .energy-page) :is(h1, .rngdle-heading h1, .energy-heading h1) {
  color: var(--midnight-header-text) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.4) !important;
}

:root[data-theme="midnight"] .rngdle-kicker,
:root[data-theme="midnight"] .rngdle-heading p:last-child,
:root[data-theme="midnight"] .rngdle-credit,
:root[data-theme="midnight"] .energy-credit {
  color: #e8f5ff !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .rngdle-credit a {
  color: var(--midnight-link-text) !important;
}

:root[data-theme="midnight"] .rngdle-display {
  background: #0b1723 !important;
  border-color: #6a95b4 !important;
  box-shadow:
    inset 0 1px 3px rgba(0,0,0,0.42),
    inset 0 0 0 1px rgba(255,255,255,0.04) !important;
}

:root[data-theme="midnight"] #rngdleNumber {
  color: #9ed0ff !important;
  text-shadow: none !important;
}

:root[data-theme="midnight"] .rngdle-pill {
  background: color-mix(in srgb, var(--rngdle-rarity-color), #0b1723 76%) !important;
  border-color: color-mix(in srgb, var(--rngdle-rarity-color), #dff4ff 34%) !important;
  color: color-mix(in srgb, var(--rngdle-rarity-color), #ffffff 36%) !important;
}

:root[data-theme="midnight"] .rngdle-vibe {
  color: #d8ecfb !important;
}

:root[data-theme="midnight"] .rngdle-toast {
  background: #132638 !important;
  border-color: #7a5aa0 !important;
  color: #f1dfff !important;
  box-shadow: 0 8px 22px rgba(0,0,0,0.38) !important;
}

:root[data-theme="midnight"] .rngdle-toast-ack {
  background: #0b1723 !important;
  border-color: #9f7ac4 !important;
  color: #f1dfff !important;
}

:root[data-theme="midnight"] .energy-image-frame {
  background: transparent !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .energy-image {
  filter: none !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .energy-music-title,
:root[data-theme="midnight"] #energyTime {
  color: #f5fbff !important;
  text-shadow: none !important;
}

:root[data-theme="midnight"] .energy-line {
  color: var(--midnight-header-text) !important;
  text-shadow: 0 1px 0 rgba(0,0,0,0.4) !important;
}

/* Notification destinations that open site content should keep the blue link treatment. */
:root[data-theme="midnight"] .notification-target-level,
:root[data-theme="midnight"] .notification-target-announcement,
:root[data-theme="midnight"] .notification-link:hover .notification-target-level,
:root[data-theme="midnight"] .notification-link:hover .notification-target-announcement,
:root[data-theme="midnight"] .notification-link:focus-visible .notification-target-level,
:root[data-theme="midnight"] .notification-link:focus-visible .notification-target-announcement {
  color: var(--midnight-header-text) !important;
}

:root[data-theme="midnight"] .energy-music-bar {
  background: #0b1723 !important;
  border-color: #6a95b4 !important;
  box-shadow:
    inset 0 1px 3px rgba(0,0,0,0.42),
    inset 0 0 0 1px rgba(255,255,255,0.04) !important;
}

:root[data-theme="midnight"] .energy-music-heading img,
:root[data-theme="midnight"] .energy-audio-player .music-icon-btn img {
  opacity: 1 !important;
}

:root[data-theme="midnight"] #energyProgress {
  background:
    linear-gradient(
      to right,
      #e02b2b 0%,
      #e02b2b var(--progress, 0%),
      #d7e7f2 var(--progress, 0%),
      #d7e7f2 100%
    ) !important;
}

/* Role color tuning: deactivated should sit just below unverified in dark mode. */
:root[data-theme="midnight"] :is(
  .member-name,
  .member-role,
  .comment-username,
  .reply-username,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention
)[style*="#555f68"],
:root[data-theme="midnight"] .staff-context-link [style*="#555f68"] {
  color: #a3b5c4 !important;
}

:root[data-theme="midnight"] [style*="--role-color:#555f68"],
:root[data-theme="midnight"] [style*="--role-color: #555f68"] {
  --role-color: #a3b5c4 !important;
}

/* Final role color normalization: every surface maps each stored role color to
   the same dark-theme color, whether the color is applied directly or via a
   --role-color custom property. */
:root[data-theme="midnight"] :is(
  .member-name,
  .member-role,
  .comment-username,
  .reply-username,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention,
  .profile-name,
  .banner-preview-name,
  .level-row-author,
  .level-card-author,
  .level-card-username
)[style*="#990099"],
:root[data-theme="midnight"] .staff-context-link [style*="#990099"] {
  color: #f18cff !important;
}

:root[data-theme="midnight"] :is(
  .member-name,
  .member-role,
  .comment-username,
  .reply-username,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention,
  .profile-name,
  .banner-preview-name,
  .level-row-author,
  .level-card-author,
  .level-card-username
)[style*="#ff9900"],
:root[data-theme="midnight"] :is(
  .member-name,
  .member-role,
  .comment-username,
  .reply-username,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention,
  .profile-name,
  .banner-preview-name,
  .level-row-author,
  .level-card-author,
  .level-card-username
)[style*="#FF9900"],
:root[data-theme="midnight"] .staff-context-link [style*="#ff9900"],
:root[data-theme="midnight"] .staff-context-link [style*="#FF9900"] {
  color: #ffd47f !important;
}

:root[data-theme="midnight"] :is(
  .member-name,
  .member-role,
  .comment-username,
  .reply-username,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention,
  .profile-name,
  .banner-preview-name,
  .level-row-author,
  .level-card-author,
  .level-card-username
)[style*="#008000"],
:root[data-theme="midnight"] .staff-context-link [style*="#008000"] {
  color: #8cf59d !important;
}

:root[data-theme="midnight"] :is(
  .member-name,
  .member-role,
  .comment-username,
  .reply-username,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention,
  .profile-name,
  .banner-preview-name,
  .level-row-author,
  .level-card-author,
  .level-card-username
)[style*="#0066ff"],
:root[data-theme="midnight"] :is(
  .member-name,
  .member-role,
  .comment-username,
  .reply-username,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention,
  .profile-name,
  .banner-preview-name,
  .level-row-author,
  .level-card-author,
  .level-card-username
)[style*="#0066FF"],
:root[data-theme="midnight"] .staff-context-link [style*="#0066ff"],
:root[data-theme="midnight"] .staff-context-link [style*="#0066FF"] {
  color: #42cfff !important;
}

:root[data-theme="midnight"] :is(
  .member-name,
  .member-role,
  .comment-username,
  .reply-username,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention,
  .profile-name,
  .banner-preview-name,
  .level-row-author,
  .level-card-author,
  .level-card-username
)[style*="#c2185b"],
:root[data-theme="midnight"] .staff-context-link [style*="#c2185b"] {
  color: #ff8db6 !important;
}

:root[data-theme="midnight"] :is(
  .member-name,
  .member-role,
  .comment-username,
  .reply-username,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention,
  .profile-name,
  .banner-preview-name,
  .level-row-author,
  .level-card-author,
  .level-card-username
)[style*="#414141"],
:root[data-theme="midnight"] :is(
  .member-name,
  .member-role,
  .comment-username,
  .reply-username,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention,
  .profile-name,
  .banner-preview-name,
  .level-row-author,
  .level-card-author,
  .level-card-username
)[style*="#111"],
:root[data-theme="midnight"] .staff-context-link [style*="#414141"],
:root[data-theme="midnight"] .staff-context-link [style*="#111"] {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] :is(
  .member-name,
  .member-role,
  .comment-username,
  .reply-username,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention,
  .profile-name,
  .banner-preview-name,
  .level-row-author,
  .level-card-author,
  .level-card-username
)[style*="#9aa3ad"],
:root[data-theme="midnight"] .staff-context-link [style*="#9aa3ad"] {
  color: #b9c8d6 !important;
}

:root[data-theme="midnight"] :is(
  .member-name,
  .member-role,
  .comment-username,
  .reply-username,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention,
  .profile-name,
  .banner-preview-name,
  .level-row-author,
  .level-card-author,
  .level-card-username
)[style*="#555f68"],
:root[data-theme="midnight"] .staff-context-link [style*="#555f68"] {
  color: #a3b5c4 !important;
}

:root[data-theme="midnight"] :is(
  .member-name,
  .member-role,
  .comment-username,
  .reply-username,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention,
  .profile-name,
  .banner-preview-name,
  .level-row-author,
  .level-card-author,
  .level-card-username
)[style*="#4f7180"],
:root[data-theme="midnight"] .staff-context-link [style*="#4f7180"] {
  color: #7fa6c1 !important;
}

:root[data-theme="midnight"] :is(
  .member-name,
  .member-role,
  .comment-username,
  .reply-username,
  .notification-sender,
  .staff-user-link,
  .staff-inline-user,
  .online-member,
  .mention,
  .profile-name,
  .banner-preview-name,
  .level-row-author,
  .level-card-author,
  .level-card-username
)[style*="#861717"],
:root[data-theme="midnight"] .staff-context-link [style*="#861717"] {
  color: #ff8f96 !important;
}

:root[data-theme="midnight"] [style*="--role-color:#990099"],
:root[data-theme="midnight"] [style*="--role-color: #990099"] {
  --role-color: #f18cff !important;
}

:root[data-theme="midnight"] [style*="--role-color:#ff9900"],
:root[data-theme="midnight"] [style*="--role-color: #ff9900"],
:root[data-theme="midnight"] [style*="--role-color:#FF9900"],
:root[data-theme="midnight"] [style*="--role-color: #FF9900"] {
  --role-color: #ffd47f !important;
}

:root[data-theme="midnight"] [style*="--role-color:#008000"],
:root[data-theme="midnight"] [style*="--role-color: #008000"] {
  --role-color: #8cf59d !important;
}

:root[data-theme="midnight"] [style*="--role-color:#0066ff"],
:root[data-theme="midnight"] [style*="--role-color: #0066ff"],
:root[data-theme="midnight"] [style*="--role-color:#0066FF"],
:root[data-theme="midnight"] [style*="--role-color: #0066FF"] {
  --role-color: #42cfff !important;
}

:root[data-theme="midnight"] [style*="--role-color:#c2185b"],
:root[data-theme="midnight"] [style*="--role-color: #c2185b"] {
  --role-color: #ff8db6 !important;
}

:root[data-theme="midnight"] [style*="--role-color:#414141"],
:root[data-theme="midnight"] [style*="--role-color: #414141"],
:root[data-theme="midnight"] [style*="--role-color:#111"],
:root[data-theme="midnight"] [style*="--role-color: #111"] {
  --role-color: #f5fbff !important;
}

:root[data-theme="midnight"] [style*="--role-color:#9aa3ad"],
:root[data-theme="midnight"] [style*="--role-color: #9aa3ad"] {
  --role-color: #b9c8d6 !important;
}

:root[data-theme="midnight"] [style*="--role-color:#4f7180"],
:root[data-theme="midnight"] [style*="--role-color: #4f7180"] {
  --role-color: #7fa6c1 !important;
}

:root[data-theme="midnight"] [style*="--role-color:#861717"],
:root[data-theme="midnight"] [style*="--role-color: #861717"] {
  --role-color: #ff8f96 !important;
}

/* Profile identity fields should match the avatar's role color exactly. */
:root[data-theme="midnight"] .profile-name,
:root[data-theme="midnight"] .profile-role b {
  color: var(--role-color) !important;
}

/* Use the reply action icon color consistently across profile/comment controls. */
:root[data-theme="midnight"] :is(
  .comment-actions,
  .reply-actions,
  .profile-actions,
  .profile-banner-controls
) :is(.comment-btn, .action-btn, .profile-actions-btn, button) {
  color: #bfe8ff !important;
}

:root[data-theme="midnight"] :is(
  .comment-actions,
  .reply-actions,
  .profile-actions,
  .profile-banner-controls
) :is(.comment-btn, .action-btn, .profile-actions-btn, button) :is(i, svg) {
  color: #bfe8ff !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] :is(
  .comment-actions,
  .reply-actions,
  .profile-actions,
  .profile-banner-controls
) :is(.comment-btn, .action-btn, .profile-actions-btn, button) img {
  filter: brightness(0) saturate(100%) invert(84%) sepia(28%) saturate(651%) hue-rotate(168deg) brightness(103%) contrast(101%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .profile-actions > .action-group > .action-btn {
  color: #bfe8ff !important;
}

:root[data-theme="midnight"] .profile-actions > .action-group > .action-btn :is(i, svg, path),
:root[data-theme="midnight"] .profile-actions > .action-group > .action-btn svg *,
:root[data-theme="midnight"] .profile-banner-controls :is(i, svg, path),
:root[data-theme="midnight"] .profile-banner-controls svg * {
  color: #bfe8ff !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .profile-actions > .action-group > .action-btn img,
:root[data-theme="midnight"] .profile-banner-controls img {
  filter: brightness(0) saturate(100%) invert(84%) sepia(28%) saturate(651%) hue-rotate(168deg) brightness(103%) contrast(101%) !important;
  opacity: 1 !important;
}

/* Legacy account management: account names use owner role color, and destructive actions stay red. */
:root[data-theme="midnight"] #legacy-panel .legacy-account-management-title {
  color: var(--legacy-account-role-color-dark, var(--legacy-account-role-color, #f5fbff)) !important;
}

:root[data-theme="midnight"] #legacy-panel .legacy-account-management-title:hover,
:root[data-theme="midnight"] #legacy-panel .legacy-account-management-title:focus-visible {
  color: var(--legacy-account-role-color-dark, var(--legacy-account-role-color, #ffffff)) !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] #legacy-panel .legacy-account-management-row.legacy-account-source-split {
  border-top: 2px solid rgba(210,226,238,0.42) !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] #legacy-panel .legacy-account-modal .form-message,
:root[data-theme="midnight"] #legacy-panel .legacy-account-user-count {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] #legacy-panel .legacy-request-level-name {
  color: var(--midnight-header-text, #9fd0ff) !important;
}

:root[data-theme="midnight"] #legacy-panel .legacy-change-head,
:root[data-theme="midnight"] #legacy-panel .legacy-change-row strong {
  color: var(--midnight-header-text, #9fd0ff) !important;
}

:root[data-theme="midnight"] #legacy-panel .approve-request,
:root[data-theme="midnight"] #legacy-panel .approve-account-request {
  background: linear-gradient(#1f4a2a, #17361f) !important;
  border-color: #57aa68 !important;
  color: #bff5c8 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 2px 6px rgba(0,0,0,0.36) !important;
}

:root[data-theme="midnight"] #legacy-panel .approve-request:not(:disabled):hover,
:root[data-theme="midnight"] #legacy-panel .approve-account-request:not(:disabled):hover,
:root[data-theme="midnight"] #legacy-panel .approve-request:not(:disabled):focus-visible,
:root[data-theme="midnight"] #legacy-panel .approve-account-request:not(:disabled):focus-visible {
  background: linear-gradient(#4b9a57, #2f6c39) !important;
  border-color: #c5f3ca !important;
  color: #f5fff6 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.22),
    inset 0 -1px 0 rgba(155,255,167,0.24),
    0 3px 8px rgba(0,0,0,0.38) !important;
}

:root[data-theme="midnight"] #staff-panel .report-actions .staff-button[data-status="resolved"] {
  background: linear-gradient(#1f4a2a, #17361f) !important;
  border-color: #57aa68 !important;
  color: #bff5c8 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 2px 6px rgba(0,0,0,0.36) !important;
}

:root[data-theme="midnight"] #staff-panel .report-actions .staff-button[data-status="resolved"]:not(:disabled):hover,
:root[data-theme="midnight"] #staff-panel .report-actions .staff-button[data-status="resolved"]:not(:disabled):focus-visible {
  background: linear-gradient(#4b9a57, #2f6c39) !important;
  border-color: #c5f3ca !important;
  color: #f5fff6 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.22),
    inset 0 -1px 0 rgba(155,255,167,0.24),
    0 3px 8px rgba(0,0,0,0.38) !important;
}

:root[data-theme="midnight"] #staff-panel .report-actions .staff-button[data-status="dismissed"] {
  background: linear-gradient(#4a2025, #34171b) !important;
  border-color: #b45a5d !important;
  color: #ffb8b8 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 2px 6px rgba(0,0,0,0.36) !important;
}

:root[data-theme="midnight"] #staff-panel .report-actions .staff-button[data-status="dismissed"]:not(:disabled):hover,
:root[data-theme="midnight"] #staff-panel .report-actions .staff-button[data-status="dismissed"]:not(:disabled):focus-visible {
  background: linear-gradient(#9a474b, #683036) !important;
  border-color: #ffc0c0 !important;
  color: #fff7f7 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.22),
    inset 0 -1px 0 rgba(255,146,146,0.28),
    0 3px 8px rgba(0,0,0,0.38) !important;
}

:root[data-theme="midnight"] #legacy-panel .staff-button.danger,
:root[data-theme="midnight"] #legacy-panel .reject-request,
:root[data-theme="midnight"] #legacy-panel .reject-account-request,
:root[data-theme="midnight"] #legacy-panel .revoke-account-connection {
  background: linear-gradient(#4a2025, #34171b) !important;
  border-color: #b45a5d !important;
  color: #ffb8b8 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.08),
    0 2px 6px rgba(0,0,0,0.36) !important;
}

:root[data-theme="midnight"] #legacy-panel .staff-button.danger:not(:disabled):hover,
:root[data-theme="midnight"] #legacy-panel .reject-request:not(:disabled):hover,
:root[data-theme="midnight"] #legacy-panel .reject-account-request:not(:disabled):hover,
:root[data-theme="midnight"] #legacy-panel .revoke-account-connection:not(:disabled):hover,
:root[data-theme="midnight"] #legacy-panel .staff-button.danger:not(:disabled):focus-visible,
:root[data-theme="midnight"] #legacy-panel .reject-request:not(:disabled):focus-visible,
:root[data-theme="midnight"] #legacy-panel .reject-account-request:not(:disabled):focus-visible,
:root[data-theme="midnight"] #legacy-panel .revoke-account-connection:not(:disabled):focus-visible {
  background: linear-gradient(#9a474b, #683036) !important;
  border-color: #ffc0c0 !important;
  color: #fff7f7 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.22),
    inset 0 -1px 0 rgba(255,146,146,0.28),
    0 3px 8px rgba(0,0,0,0.38) !important;
}

:root[data-theme="midnight"] :is(
  .edit-tab,
  .history-tab,
  .profile-source-tab,
  .music-source-tab,
  .staff-tab,
  .staff-subtab,
  .report-tab,
  .legacy-log-tab,
  .levels-tab,
  .members-tab,
  .notification-status-tab,
  .game-tab,
  .tab-btn,
  .tabs a,
  .tabs button,
  .sub-tabs a,
  .sub-tabs button,
  .profile-tabs a,
  .edit-profile-tabs a,
  .settings-tabs a
).active,
:root[data-theme="midnight"] :is(
  .edit-tab,
  .history-tab,
  .profile-source-tab,
  .music-source-tab,
  .staff-tab,
  .staff-subtab,
  .report-tab,
  .legacy-log-tab,
  .levels-tab,
  .members-tab,
  .notification-status-tab,
  .game-tab,
  .tab-btn,
  .tabs a,
  .tabs button,
  .sub-tabs a,
  .sub-tabs button,
  .profile-tabs a,
  .edit-profile-tabs a,
  .settings-tabs a
).active:hover,
:root[data-theme="midnight"] :is(
  .edit-tab,
  .history-tab,
  .profile-source-tab,
  .music-source-tab,
  .staff-tab,
  .staff-subtab,
  .report-tab,
  .legacy-log-tab,
  .levels-tab,
  .members-tab,
  .notification-status-tab,
  .game-tab,
  .tab-btn,
  .tabs a,
  .tabs button,
  .sub-tabs a,
  .sub-tabs button,
  .profile-tabs a,
  .edit-profile-tabs a,
  .settings-tabs a
)[aria-selected="true"],
:root[data-theme="midnight"] :is(
  .edit-tab,
  .history-tab,
  .profile-source-tab,
  .music-source-tab,
  .staff-tab,
  .staff-subtab,
  .report-tab,
  .legacy-log-tab,
  .levels-tab,
  .members-tab,
  .notification-status-tab,
  .game-tab,
  .tab-btn,
  .tabs a,
  .tabs button,
  .sub-tabs a,
  .sub-tabs button,
  .profile-tabs a,
  .edit-profile-tabs a,
  .settings-tabs a
)[aria-selected="true"]:hover {
  color: #ffffff !important;
  transition: none !important;
}

/* Loading states should only show the loading message box, never a parent panel strip. */
:is(.staff-panel, .edit-panel).staff-panel-loading,
:root[data-theme="midnight"] :is(.staff-panel, .edit-panel).staff-panel-loading {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:is(.staff-panel, .edit-panel).staff-panel-loading::before,
:is(.staff-panel, .edit-panel).staff-panel-loading::after,
:root[data-theme="midnight"] :is(
  .staff-loading-message,
  .legacy-empty-message,
  .report-empty-message,
  .log-empty-message,
  .levels-loading,
  .announcements-loading,
  .reply-loading-box,
  .page-loading-message
)::before,
:root[data-theme="midnight"] :is(
  .staff-loading-message,
  .legacy-empty-message,
  .report-empty-message,
  .log-empty-message,
  .levels-loading,
  .announcements-loading,
  .reply-loading-box,
  .page-loading-message
)::after {
  content: none !important;
  display: none !important;
}

:root[data-theme="midnight"] :is(
  .edit-tab,
  .history-tab,
  .profile-source-tab,
  .music-source-tab,
  .staff-tab,
  .staff-subtab,
  .report-tab,
  .legacy-log-tab,
  .levels-tab,
  .members-tab,
  .notification-status-tab,
  .game-tab,
  .tab-btn,
  .tabs a,
  .tabs button,
  .sub-tabs a,
  .sub-tabs button,
  .profile-tabs a,
  .edit-profile-tabs a,
  .settings-tabs a
).active:hover,
:root[data-theme="midnight"] :is(
  .edit-tab,
  .history-tab,
  .profile-source-tab,
  .music-source-tab,
  .staff-tab,
  .staff-subtab,
  .report-tab,
  .legacy-log-tab,
  .levels-tab,
  .members-tab,
  .notification-status-tab,
  .game-tab,
  .tab-btn,
  .tabs a,
  .tabs button,
  .sub-tabs a,
  .sub-tabs button,
  .profile-tabs a,
  .edit-profile-tabs a,
  .settings-tabs a
).active:focus-visible {
  background: transparent !important;
  box-shadow: none !important;
  color: #ffffff !important;
  transform: none !important;
  transition: none !important;
}

/* Final notification pass: status filters keep their sizing, unselected hover uses global buttons, and unread cards get a green accent. */
:root[data-theme="midnight"] .notifications-page .notification-status-tab:not(.active):not([aria-selected="true"]) {
  min-height: 42px !important;
  padding: 10px 14px !important;
  border: 1px solid var(--button-border) !important;
  border-radius: 8px !important;
  background: var(--button-bg) !important;
  color: var(--button-text) !important;
  box-shadow: var(--button-shadow) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-status-tab:not(.active):not([aria-selected="true"]):hover,
:root[data-theme="midnight"] .notifications-page .notification-status-tab:not(.active):not([aria-selected="true"]):focus-visible {
  border-color: var(--button-hover-border) !important;
  background: var(--button-hover-bg) !important;
  color: var(--button-hover-text) !important;
  box-shadow: var(--button-hover-shadow) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-status-tab.active,
:root[data-theme="midnight"] .notifications-page .notification-status-tab[aria-selected="true"],
:root[data-theme="midnight"] .notifications-page .notification-status-tab.active:hover,
:root[data-theme="midnight"] .notifications-page .notification-status-tab[aria-selected="true"]:hover,
:root[data-theme="midnight"] .notifications-page .notification-status-tab.active:focus-visible,
:root[data-theme="midnight"] .notifications-page .notification-status-tab[aria-selected="true"]:focus-visible {
  min-height: 42px !important;
  padding: 10px 14px !important;
  border: 1px solid #8fc8ff !important;
  border-radius: 8px !important;
  background: linear-gradient(#5f9fc8, #3f789d) !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.22),
    inset 0 -1px 0 rgba(0,0,0,0.18),
    0 2px 6px rgba(0,0,0,0.34) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-status-tab::after {
  content: none !important;
}

:root[data-theme="midnight"] .notifications-page .notification-item.unread {
  border-color: #426f58 !important;
  border-left-color: #66c985 !important;
  border-left-width: 2px !important;
  background: linear-gradient(#1d342f, #162c2b) !important;
  box-shadow:
    inset 0 1px 0 rgba(154,255,188,0.08),
    0 2px 7px rgba(0,0,0,0.28) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-item.unread:hover {
  border-color: #5d9a73 !important;
  border-left-color: #84e3a0 !important;
  border-left-width: 2px !important;
  background: linear-gradient(#243f37, #1a3532) !important;
}

:root[data-theme="midnight"] .notifications-page .notification-state.new {
  background: linear-gradient(#1f4a35, #173628) !important;
  border-color: #66c985 !important;
  color: #a7f2bb !important;
  box-shadow: none !important;
}

/* EOF username hover lock: role-colored usernames keep their color; hover only underlines. */
:root[data-theme="midnight"] :is(.member-name,.member-role,.comment-username,.reply-username,.comment-history-title-link,.review-history-title-link,.profile-rates-modal-scope .profile-rate-author a,.profile-rates-modal-scope .profile-rate-author > span,.profile-rates-modal-scope .profile-list-username,.level-row-author,.level-card-author,.level-card-author .level-card-username,.level-detail-page .level-author-card .member-name,.notification-sender,.staff-user-link,.staff-inline-user,.online-member,.mention,.profile-name,.banner-preview-name)[style*="--role-color"] {
  color: var(--role-color, currentColor) !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] :is(.member-name,.comment-username,.reply-username,.comment-history-title-link,.review-history-title-link,.profile-rates-modal-scope .profile-rate-author a,.profile-rates-modal-scope .profile-list-username,.level-row-author,.level-card-author,.level-detail-page .level-author-card .member-name,.notification-sender,.staff-user-link,.staff-inline-user,.online-member,.mention)[style*="--role-color"]:is(:hover,:focus-visible) {
  color: var(--role-color, currentColor) !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] :is(.member-name,.comment-username,.reply-username,.comment-history-title-link,.review-history-title-link,.profile-rates-modal-scope .profile-rate-author a,.profile-rates-modal-scope .profile-list-username,.level-row-author,.level-card-author,.notification-sender,.staff-user-link,.staff-inline-user,.online-member,.mention)[style]:is(:hover,:focus-visible) {
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] :is(.member-name,.comment-username,.reply-username,.comment-history-title-link,.review-history-title-link,.profile-rates-modal-scope .profile-rate-author a,.profile-rates-modal-scope .profile-list-username,.level-row-author,.level-card-author,.notification-sender,.staff-user-link,.staff-inline-user,.online-member,.mention)[style*="#990099"]:is(:hover,:focus-visible) { color: #f18cff !important; }
:root[data-theme="midnight"] :is(.member-name,.comment-username,.reply-username,.comment-history-title-link,.review-history-title-link,.profile-rates-modal-scope .profile-rate-author a,.profile-rates-modal-scope .profile-list-username,.level-row-author,.level-card-author,.notification-sender,.staff-user-link,.staff-inline-user,.online-member,.mention)[style*="#ff9900"]:is(:hover,:focus-visible),
:root[data-theme="midnight"] :is(.member-name,.comment-username,.reply-username,.comment-history-title-link,.review-history-title-link,.profile-rates-modal-scope .profile-rate-author a,.profile-rates-modal-scope .profile-list-username,.level-row-author,.level-card-author,.notification-sender,.staff-user-link,.staff-inline-user,.online-member,.mention)[style*="#FF9900"]:is(:hover,:focus-visible) { color: #ffd47f !important; }
:root[data-theme="midnight"] :is(.member-name,.comment-username,.reply-username,.comment-history-title-link,.review-history-title-link,.profile-rates-modal-scope .profile-rate-author a,.profile-rates-modal-scope .profile-list-username,.level-row-author,.level-card-author,.notification-sender,.staff-user-link,.staff-inline-user,.online-member,.mention)[style*="#008000"]:is(:hover,:focus-visible) { color: #8cf59d !important; }
:root[data-theme="midnight"] :is(.member-name,.comment-username,.reply-username,.comment-history-title-link,.review-history-title-link,.profile-rates-modal-scope .profile-rate-author a,.profile-rates-modal-scope .profile-list-username,.level-row-author,.level-card-author,.notification-sender,.staff-user-link,.staff-inline-user,.online-member,.mention)[style*="#0066ff"]:is(:hover,:focus-visible),
:root[data-theme="midnight"] :is(.member-name,.comment-username,.reply-username,.comment-history-title-link,.review-history-title-link,.profile-rates-modal-scope .profile-rate-author a,.profile-rates-modal-scope .profile-list-username,.level-row-author,.level-card-author,.notification-sender,.staff-user-link,.staff-inline-user,.online-member,.mention)[style*="#0066FF"]:is(:hover,:focus-visible) { color: #42cfff !important; }
:root[data-theme="midnight"] :is(.member-name,.comment-username,.reply-username,.comment-history-title-link,.review-history-title-link,.profile-rates-modal-scope .profile-rate-author a,.profile-rates-modal-scope .profile-list-username,.level-row-author,.level-card-author,.notification-sender,.staff-user-link,.staff-inline-user,.online-member,.mention)[style*="#c2185b"]:is(:hover,:focus-visible) { color: #ff8db6 !important; }
:root[data-theme="midnight"] :is(.member-name,.comment-username,.reply-username,.comment-history-title-link,.review-history-title-link,.profile-rates-modal-scope .profile-rate-author a,.profile-rates-modal-scope .profile-list-username,.level-row-author,.level-card-author,.notification-sender,.staff-user-link,.staff-inline-user,.online-member,.mention)[style*="#414141"]:is(:hover,:focus-visible) { color: #f5fbff !important; }
:root[data-theme="midnight"] :is(.member-name,.comment-username,.reply-username,.comment-history-title-link,.review-history-title-link,.profile-rates-modal-scope .profile-rate-author a,.profile-rates-modal-scope .profile-list-username,.level-row-author,.level-card-author,.notification-sender,.staff-user-link,.staff-inline-user,.online-member,.mention)[style*="#9aa3ad"]:is(:hover,:focus-visible) { color: #b9c8d6 !important; }
:root[data-theme="midnight"] :is(.member-name,.comment-username,.reply-username,.comment-history-title-link,.review-history-title-link,.profile-rates-modal-scope .profile-rate-author a,.profile-rates-modal-scope .profile-list-username,.level-row-author,.level-card-author,.notification-sender,.staff-user-link,.staff-inline-user,.online-member,.mention)[style*="#555f68"]:is(:hover,:focus-visible) { color: #a3b5c4 !important; }
:root[data-theme="midnight"] :is(.member-name,.comment-username,.reply-username,.comment-history-title-link,.review-history-title-link,.profile-rates-modal-scope .profile-rate-author a,.profile-rates-modal-scope .profile-list-username,.level-row-author,.level-card-author,.notification-sender,.staff-user-link,.staff-inline-user,.online-member,.mention)[style*="#4f7180"]:is(:hover,:focus-visible) { color: #7fa6c1 !important; }
:root[data-theme="midnight"] :is(.member-name,.comment-username,.reply-username,.comment-history-title-link,.review-history-title-link,.profile-rates-modal-scope .profile-rate-author a,.profile-rates-modal-scope .profile-list-username,.level-row-author,.level-card-author,.notification-sender,.staff-user-link,.staff-inline-user,.online-member,.mention)[style*="#861717"]:is(:hover,:focus-visible) { color: #ff8f96 !important; }

/* Front-page navigation-tip action icons match comment/reply hover behavior. */
:root[data-theme="midnight"] .member-panel:has(#dashboardTips) .member-panel-actions .comment-btn:not(:disabled):hover img,
:root[data-theme="midnight"] #tipsModal .dashboard-icon-actions .comment-btn:not(:disabled):hover img {
  filter: brightness(0) saturate(100%) invert(100%) sepia(4%) saturate(723%) hue-rotate(177deg) brightness(104%) contrast(104%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] #tipsModal .tips-modal-item,
:root[data-theme="midnight"] #tipsModal .tips-modal-item-header,
:root[data-theme="midnight"] #tipsModal .dashboard-icon-actions,
:root[data-theme="midnight"] #tipsModal .dashboard-icon-actions .nav-item {
  overflow: visible !important;
}

:root[data-theme="midnight"] #tipsModal .dashboard-icon-actions .tooltip {
  z-index: 100000 !important;
  text-align: center !important;
}

/* Keep UI/navigation links out of the content-link red hover treatment. */
:root[data-theme="midnight"] :is(.footer, .footer-section, .footer-bottom, .profile-connected-accounts, .profile-legacy-accounts) a:hover,
:root[data-theme="midnight"] :is(.footer, .footer-section, .footer-bottom, .profile-connected-accounts, .profile-legacy-accounts) a:focus-visible {
  color: #8fd0ff !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] :is(.header, .jump-bar, .jump-bar .subnav) a:hover,
:root[data-theme="midnight"] :is(.header, .jump-bar, .jump-bar .subnav) a:focus-visible {
  color: #ffffff !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] :is(.header, .footer, .footer-section, .footer-bottom, .jump-bar, .subnav) a:hover,
:root[data-theme="midnight"] :is(.header, .footer, .footer-section, .footer-bottom, .jump-bar, .subnav) a:focus-visible {
  outline-color: #79b8e0 !important;
}

:root[data-theme="midnight"] .profile-stats :is(.profile-levels-link, .profile-plays-link, .profile-rates-link, .profile-reviews-link):is(:hover, :focus-visible),
:root[data-theme="midnight"] .profile-stats :is(.profile-levels-link, .profile-plays-link, .profile-rates-link, .profile-reviews-link):is(:hover, :focus-visible) * {
  color: #f5fbff !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] .profile-rates-modal-scope .profile-rate-level a,
:root[data-theme="midnight"] .profile-rates-modal-scope .profile-rate-level > span {
  color: #9fd0ff !important;
  text-decoration-color: rgba(159,208,255,0.7) !important;
}

:root[data-theme="midnight"] :is(.profile-legacy-account-name, .legacy-account-management-title, .legacy-request-title-link, .legacy-account-user-header h3)[style*="--role-color"]:is(:hover, :focus-visible),
:root[data-theme="midnight"] .profile-legacy-account:is(:hover, :focus-visible) .profile-legacy-account-name[style*="--role-color"],
:root[data-theme="midnight"] :is(.profile-legacy-account-name, .legacy-account-management-title, .legacy-request-title-link, .legacy-account-user-header h3)[style*="--legacy-account-role-color"]:is(:hover, :focus-visible) {
  color: var(--role-color, var(--legacy-account-role-color-dark, var(--legacy-account-role-color, currentColor))) !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] .profile-legacy-account[style*="--role-color"]:is(:hover, :focus-visible) {
  color: var(--role-color, currentColor) !important;
  text-decoration-color: currentColor !important;
  outline-color: var(--role-color, currentColor) !important;
}

/* Notifications should only use the normal outer page frames, not an extra inner panel. */
:root[data-theme="midnight"] .notifications-page .box-inner.single-column > .align-left,
:root[data-theme="midnight"] .notifications-page .box-inner.single-column > .align-left > .text {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Edit profile loading and BBCode guide should not show extra inner black strips. */
:root[data-theme="midnight"] .edit-profile-page .edit-panel:has(> .page-loading-panel:only-child),
:root[data-theme="midnight"] .edit-profile-page .edit-panel:has(> .page-loading-panel:only-child) > .page-loading-panel {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .edit-profile-page .bbcode-option-sample,
:root[data-theme="midnight"] .edit-profile-page .bbcode-option-sample *,
:root[data-theme="midnight"] .edit-profile-page .bbcode-source,
:root[data-theme="midnight"] .edit-profile-page .bbcode-source *,
:root[data-theme="midnight"] .edit-profile-page .bbcode-option :is(pre, code) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .edit-profile-page .bbcode-source {
  color: #d7e9f6 !important;
}

:root[data-theme="midnight"] .edit-profile-page .bbcode-option-sample .bbcode-code {
  display: block !important;
  padding: 8px 10px !important;
  border: 1px solid #4f718b !important;
  border-radius: 6px !important;
  background: #071019 !important;
  background-color: #071019 !important;
  color: #f5fbff !important;
  white-space: pre-wrap !important;
}

:root[data-theme="midnight"] .edit-profile-page .bbcode-option-sample .bbcode-code code {
  background: transparent !important;
  color: inherit !important;
}

:root[data-theme="midnight"] .edit-profile-page .bbcode-option-sample .bbcode-highlight {
  background: rgba(244, 201, 80, 0.88) !important;
  background-color: rgba(244, 201, 80, 0.88) !important;
  color: #0b1720 !important;
  border-radius: 4px !important;
  padding: 2px 4px !important;
  box-shadow: none !important;
}

/* History context text on comments/reviews should match readable date/meta text. */
:root[data-theme="midnight"] :is(.comment-history-list, .review-history-list) .history-entry-context,
:root[data-theme="midnight"] :is(.comment-history-list, .review-history-list) .history-context-label,
:root[data-theme="midnight"] :is(.comment-history-list, .review-history-list) .history-context-byline {
  color: #c4d8e8 !important;
}

:root[data-theme="midnight"] :is(.comment-history-list, .review-history-list) .history-entry-context a:not([style*="--role-color"]):not([style*="color:"]) {
  color: #8fd0ff !important;
}

/* Edit profile music tab should not add an extra dark strip around helper text. */
:root[data-theme="midnight"] .edit-profile-page .music-source-note {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .edit-profile-page .music-placeholder {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .edit-profile-page .music-meta span {
  color: #f5fbff !important;
}

/* 404 copy and buttons should match normal site buttons, without content-link red hover. */
:root[data-theme="midnight"] .text:has(> .not-found-actions) > p {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .not-found-actions a,
:root[data-theme="midnight"] .not-found-actions a:visited,
:root[data-theme="midnight"] .not-found-actions a *,
:root[data-theme="midnight"] .not-found-actions a:visited * {
  color: var(--button-text) !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] .not-found-actions a:hover,
:root[data-theme="midnight"] .not-found-actions a:focus-visible,
:root[data-theme="midnight"] .not-found-actions a:active,
:root[data-theme="midnight"] .not-found-actions a:hover *,
:root[data-theme="midnight"] .not-found-actions a:focus-visible *,
:root[data-theme="midnight"] .not-found-actions a:active * {
  color: var(--button-hover-text) !important;
  text-decoration-color: currentColor !important;
}

/* Keep navigation-tip actions in the card's top-right while tooltips stay centered and unclipped. */
:root[data-theme="midnight"] #tipsModal .tips-modal-list,
:root[data-theme="midnight"] #tipsModal .tips-modal-item,
:root[data-theme="midnight"] #tipsModal .tips-modal-item-header,
:root[data-theme="midnight"] #tipsModal .dashboard-icon-actions,
:root[data-theme="midnight"] #tipsModal .dashboard-icon-actions .nav-item {
  overflow: visible !important;
}

:root[data-theme="midnight"] #tipsModal .dashboard-icon-actions .tooltip,
:root[data-theme="midnight"] #tipsModal .dashboard-icon-actions .delete-dashboard-tip + .tooltip {
  left: 50% !important;
  right: auto !important;
  bottom: 155% !important;
  transform: translateX(-50%) !important;
  z-index: 100000 !important;
  text-align: center !important;
  white-space: nowrap !important;
  max-width: none !important;
}

:root[data-theme="midnight"] #tipsModal .dashboard-icon-actions .tooltip::after,
:root[data-theme="midnight"] #tipsModal .dashboard-icon-actions .delete-dashboard-tip + .tooltip::after {
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
}

#tipsModal .dashboard-icon-actions .delete-dashboard-tip + .tooltip {
  opacity: 0 !important;
  visibility: hidden !important;
}

.dashboard-floating-tooltip {
  position: fixed !important;
  bottom: auto !important;
  left: 0;
  top: 0;
  z-index: 2147483647 !important;
  font-size: 12px !important;
  font-weight: bold !important;
  line-height: normal !important;
  padding: 5px 10px !important;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateX(-50%) !important;
  text-align: center !important;
  white-space: nowrap !important;
}

/* Final guard: dark-mode buttons never use content-link red hover text. */
:root[data-theme="midnight"] :is(
  .main-btn,
  .control-btn,
  .edit-save-btn,
  .staff-button,
  .levels-button,
  .level-action,
  .level-form button,
  .copy-code-btn,
  .help-footer button,
  .level-mode button,
  #fullscreen-btn,
  .notification-btn,
  .play-btn,
  .version-btn,
  .size-buttons button,
  .game-info-editor button,
  .help-btn,
  .cycle-btn,
  .favorite-btn,
  .level-actions button,
  .level-detail-page .level-code-actions button,
  .level-detail-page .level-code-actions a,
  .level-detail-page .level-inline-btn,
  .level-detail-page .level-text-btn,
  .level-detail-page .level-rate-submit,
  .inline-view-button,
  .contact-actions a,
  .reaction-btn,
  .profile-music-controls button,
  #music-youtube-btn,
  .profile-audio-player button,
  .music-icon-btn,
  .member-quick-links a,
  .member-add-level-link,
  #memberMyLevelsLink,
  .levels-toolbar-row > .levels-icon-control > .levels-icon-button,
  .profile-description-toggle,
  .profile-description-collapse,
  .level-thumbnail-edit-button,
  .not-found-actions a
):is(:hover, :focus-visible, :active),
:root[data-theme="midnight"] :is(
  .main-btn,
  .control-btn,
  .edit-save-btn,
  .staff-button,
  .levels-button,
  .level-action,
  .level-form button,
  .copy-code-btn,
  .help-footer button,
  .level-mode button,
  #fullscreen-btn,
  .notification-btn,
  .play-btn,
  .version-btn,
  .size-buttons button,
  .game-info-editor button,
  .help-btn,
  .cycle-btn,
  .favorite-btn,
  .level-actions button,
  .level-detail-page .level-code-actions button,
  .level-detail-page .level-code-actions a,
  .level-detail-page .level-inline-btn,
  .level-detail-page .level-text-btn,
  .level-detail-page .level-rate-submit,
  .inline-view-button,
  .contact-actions a,
  .reaction-btn,
  .profile-music-controls button,
  #music-youtube-btn,
  .profile-audio-player button,
  .music-icon-btn,
  .member-quick-links a,
  .member-add-level-link,
  #memberMyLevelsLink,
  .levels-toolbar-row > .levels-icon-control > .levels-icon-button,
  .profile-description-toggle,
  .profile-description-collapse,
  .level-thumbnail-edit-button,
  .not-found-actions a
):is(:hover, :focus-visible, :active) * {
  color: #ffffff !important;
  text-decoration-color: currentColor !important;
}

/* Game page: selected controls match the notification selected tab and do not change on hover. */
:root[data-theme="midnight"] :is(.size-buttons button.active, .version-btn.active, .cycle-btn.active),
:root[data-theme="midnight"] :is(.size-buttons button.active, .version-btn.active, .cycle-btn.active):is(:hover, :focus-visible, :active) {
  border-color: #8fc8ff !important;
  background: linear-gradient(#5f9fc8, #3f789d) !important;
  color: #ffffff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.22),
    inset 0 -1px 0 rgba(0,0,0,0.18),
    0 2px 6px rgba(0,0,0,0.34) !important;
}

:root[data-theme="midnight"] :is(.size-buttons button.active, .version-btn.active, .cycle-btn.active):is(:hover, :focus-visible, :active) * {
  color: #ffffff !important;
}

:root[data-theme="midnight"] .game-archive-link,
:root[data-theme="midnight"] .game-archive-link span {
  color: #ffffff !important;
}

:root[data-theme="midnight"] .game-archive-link a,
:root[data-theme="midnight"] .game-info .game-author-link,
:root[data-theme="midnight"] .game-info .game-base-link,
:root[data-theme="midnight"] .game-info .game-author-link b,
:root[data-theme="midnight"] .game-info .game-base-link b {
  color: #8fd0ff !important;
}

:root[data-theme="midnight"] :is(.game-card, .game-info) .game-author-link[style*="--role-color"],
:root[data-theme="midnight"] :is(.game-card, .game-info) .game-author-link[style*="--role-color"] b {
  color: var(--role-color, currentColor) !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] .game-archive-link a:hover,
:root[data-theme="midnight"] .game-archive-link a:focus-visible,
:root[data-theme="midnight"] .game-info .game-author-link:hover,
:root[data-theme="midnight"] .game-info .game-author-link:focus-visible,
:root[data-theme="midnight"] .game-info .game-base-link:hover,
:root[data-theme="midnight"] .game-info .game-base-link:focus-visible,
:root[data-theme="midnight"] .game-info .game-author-link:hover b,
:root[data-theme="midnight"] .game-info .game-author-link:focus-visible b,
:root[data-theme="midnight"] .game-info .game-base-link:hover b,
:root[data-theme="midnight"] .game-info .game-base-link:focus-visible b {
  color: #ff6f7a !important;
  text-decoration: underline !important;
}

:root[data-theme="midnight"] .game-card .game-author a.game-author-link:hover,
:root[data-theme="midnight"] .game-card .game-author a.game-author-link:focus-visible,
:root[data-theme="midnight"] .game-card .game-author a.game-author-link:hover b,
:root[data-theme="midnight"] .game-card .game-author a.game-author-link:focus-visible b {
  color: #ff6f7a !important;
  text-decoration: underline !important;
}

:root[data-theme="midnight"] :is(.game-card, .game-info) .game-author-link[style*="--role-color"]:is(:hover, :focus-visible),
:root[data-theme="midnight"] :is(.game-card, .game-info) .game-author-link[style*="--role-color"]:is(:hover, :focus-visible) b {
  color: var(--role-color, currentColor) !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] :is(.filter-grid-header, .filter-label, .filter-mobile-label) {
  color: #ffffff !important;
}

:root[data-theme="midnight"] .filter-modal .filter-epilepsy-warning,
:root[data-theme="midnight"] .game-info .game-content-warning,
:root[data-theme="midnight"] .game-info .game-level-posting-disabled {
  background: linear-gradient(#3a1e24, #24151a) !important;
  border-color: #ff6f7a !important;
  color: #ff9aa3 !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.07),
    0 2px 6px rgba(0,0,0,0.42),
    0 0 0 1px rgba(255,111,122,0.18) !important;
}

:root[data-theme="midnight"] .cycle-warning-modal .cycle-warning-text {
  color: #ff8791 !important;
}

/* Level form: "supports automatic level loading" note gets the same dark
   treatment as the red warning boxes above, but in green. */
:root[data-theme="midnight"] .level-autoload-note {
  background: linear-gradient(#1e3527, #14251b) !important;
  border-color: #66c985 !important;
  border-left-color: #3fae63 !important;
  color: #a7f2bb !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.07),
    0 2px 6px rgba(0,0,0,0.42),
    0 0 0 1px rgba(102, 201, 133, 0.18) !important;
}

:root[data-theme="midnight"] .help-close-btn {
  right: 12px !important;
  top: 12px !important;
  transform: none !important;
}

:root[data-theme="midnight"] .game-info-icon-btn:hover img,
:root[data-theme="midnight"] .game-info-icon-btn:focus-visible img {
  filter: brightness(0) saturate(100%) invert(100%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row-name a:hover,
:root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row-name a:focus-visible {
  color: #8fd0ff !important;
  text-decoration: underline !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-browse-title,
:root[data-theme="midnight"] .levels-grid-boxes .level-browse-title {
  color: #8fd0ff !important;
}

:root[data-theme="midnight"] .levels-card-grid .level-browse-title:hover,
:root[data-theme="midnight"] .levels-card-grid .level-browse-title:focus-visible,
:root[data-theme="midnight"] .levels-grid-boxes .level-browse-title:hover,
:root[data-theme="midnight"] .levels-grid-boxes .level-browse-title:focus-visible {
  color: #8fd0ff !important;
  text-decoration: underline !important;
}

/* Header link icons should brighten with the hovered header link in dark mode. */
:root[data-theme="midnight"] .header-nav a:hover .nav-icon,
:root[data-theme="midnight"] .header-nav a:focus-visible .nav-icon {
  filter: brightness(0) saturate(100%) invert(100%) !important;
  opacity: 1 !important;
}

/* Broken level thumbnails need readable fallback text in dark mode. */
:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section .thumbnail-load-failed .level-thumbnail-fallback {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  inset: 0 !important;
  width: auto !important;
  height: auto !important;
  padding: 12px !important;
  color: #f5fbff !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  line-height: 1.1 !important;
  text-align: center !important;
  text-shadow: 0 2px 3px rgba(0,0,0,0.65) !important;
  background: transparent !important;
  word-break: normal !important;
  overflow-wrap: normal !important;
  white-space: normal !important;
}

:root[data-theme="midnight"] .level-detail-page .level-thumbnail-section .thumbnail-load-failed .level-detail-thumb-image {
  display: none !important;
}

/* Featured levels keep the title action icon gold, matching the posted-field badge. */
:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn.feature-level.active img,
:root[data-theme="midnight"] .level-detail-page .level-title-actions .comment-btn.feature-level.active:not(:disabled):hover img {
  filter: brightness(0) saturate(100%) invert(91%) sepia(85%) saturate(982%) hue-rotate(356deg) brightness(108%) contrast(105%) !important;
  opacity: 1 !important;
}

/* Level-page usernames use their role color on dark mode too. */
:root[data-theme="midnight"] .level-detail-page :is(.comment-username, .mention)[style*="--role-color"] {
  color: var(--role-color, currentColor) !important;
}

/* Archive icons should read as archive/gold in dark-mode legacy content. */
:root[data-theme="midnight"] img[src*="/icons/archive.svg"]:not(.dropdown-icon):not(.nav-icon),
:root[data-theme="midnight"] img[src$="archive.svg"]:not(.dropdown-icon):not(.nav-icon) {
  filter: brightness(0) saturate(100%) invert(82%) sepia(83%) saturate(713%) hue-rotate(356deg) brightness(101%) contrast(103%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .comment-btn.legacy-comment-marker,
:root[data-theme="midnight"] .comment-btn.legacy-comment-marker i,
:root[data-theme="midnight"] .comment-btn.legacy-comment-marker i::before,
:root[data-theme="midnight"] .comment-btn.legacy-comment-marker svg,
:root[data-theme="midnight"] .legacy-comment-marker .fa-box-archive,
:root[data-theme="midnight"] .legacy-comment-marker .fa-box-archive::before {
  color: #f4c950 !important;
  fill: currentColor !important;
  stroke: currentColor !important;
  opacity: 1 !important;
  filter: none !important;
}

/* Final dark-mode button text guard: button-like links should match profile send buttons. */
:root[data-theme="midnight"] :is(
  .not-found-actions a,
  .member-add-level-link,
  #memberMyLevelsLink
),
:root[data-theme="midnight"] :is(
  .not-found-actions a,
  .member-add-level-link,
  #memberMyLevelsLink
) :is(span, strong, b) {
  color: var(--button-text) !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] :is(
  .not-found-actions a,
  .member-add-level-link,
  #memberMyLevelsLink
) img,
:root[data-theme="midnight"] :is(
  .not-found-actions a,
  .member-add-level-link,
  #memberMyLevelsLink
) svg {
  color: var(--button-text) !important;
}

/* Dark-mode cleanup for content links, mobile filter panels, and status cards. */
:root[data-theme="midnight"] :is(
  .text,
  .profile-description,
  .comment-body,
  .reply-body,
  .announcement-body,
  .level-description,
  .bbcode-content,
  .profile-connected-accounts,
  .profile-legacy-accounts,
  .legacy-account-user-card,
  .legacy-card,
  .staff-card,
  .report-card
) a:not(.main-btn):not(.control-btn):not(.edit-save-btn):not(.staff-button):not(.levels-button):not(.level-action):not(.notification-btn):not(.play-btn):not(.version-btn):not(.reaction-btn):not(.contact-actions a):not(.member-quick-links a):not(.profile-description-toggle):not(.profile-description-collapse):not(.not-found-actions a):not(.level-back-link):not(.level-duplicate-banner a):not(.member-name):not(.comment-username):not(.reply-username):not(.level-source-row):not(.level-browse-title):not(.level-row-name a):not(.level-row-author):not(.level-card-author):not(.staff-user-link):not([style*="--role-color"]):not([style*="color:"]):not(#open-game-link) {
  color: #8fd0ff !important;
  text-decoration-color: rgba(143, 208, 255, 0.7) !important;
}

:root[data-theme="midnight"] :is(
  .text,
  .profile-description,
  .comment-body,
  .reply-body,
  .announcement-body,
  .level-description,
  .bbcode-content,
  .profile-connected-accounts,
  .profile-legacy-accounts,
  .legacy-account-user-card,
  .legacy-card,
  .staff-card,
  .report-card
) a:not(.main-btn):not(.control-btn):not(.edit-save-btn):not(.staff-button):not(.levels-button):not(.level-action):not(.notification-btn):not(.play-btn):not(.version-btn):not(.reaction-btn):not(.contact-actions a):not(.member-quick-links a):not(.profile-description-toggle):not(.profile-description-collapse):not(.not-found-actions a):not(.level-back-link):not(.level-duplicate-banner a):not(.member-name):not(.comment-username):not(.reply-username):not(.level-source-row):not(.level-browse-title):not(.level-row-name a):not(.level-row-author):not(.level-card-author):not(.staff-user-link):not([style*="--role-color"]):not([style*="color:"]):not(#open-game-link):is(:hover, :focus-visible) {
  color: #ff6f7a !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] .members-grid .member-date,
:root[data-theme="midnight"] .members-grid .member-user-id,
:root[data-theme="midnight"] .members-grid .member-stat-value,
:root[data-theme="midnight"] .members-grid .member-date::before,
:root[data-theme="midnight"] .members-grid .member-user-id::before,
:root[data-theme="midnight"] .members-grid .member-stat-value::before,
:root[data-theme="midnight"] .members-grid [data-label]::before {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .members-grid .member-date,
:root[data-theme="midnight"] .members-grid .member-user-id,
:root[data-theme="midnight"] .members-grid .member-stat-value {
  border-top-color: rgba(196, 222, 240, 0.18) !important;
}

:root[data-theme="midnight"] :is(
  .report-filters,
  .user-search,
  .log-filters,
  .legacy-log-search,
  .legacy-account-management-filters,
  .members-controls
).mobile-filters-open {
  background: linear-gradient(#1b2d3e, #142332) !important;
  border-color: #4c6f89 !important;
  color: #f5fbff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.07),
    0 3px 10px rgba(0,0,0,0.32) !important;
}

:root[data-theme="midnight"] :is(
  .report-filters,
  .user-search,
  .log-filters,
  .legacy-log-search,
  .legacy-account-management-filters,
  .members-controls
).mobile-filters-open :is(label, span, strong, .staff-filter-note, .staff-search-field > span, .members-control, .members-control span) {
  color: #f5fbff !important;
}

:root[data-theme="midnight"] :is(
  .report-filters,
  .user-search,
  .log-filters,
  .legacy-log-search,
  .legacy-account-management-filters,
  .members-controls
).mobile-filters-open :is(input, select, textarea, .staff-input) {
  background: #09131e !important;
  border-color: #5f86a3 !important;
  color: #f5fbff !important;
}

:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-visibility-public,
:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-visibility-public .comment-btn {
  color: #72c7ff !important;
}

:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-visibility-public .comment-btn img {
  filter: brightness(0) saturate(100%) invert(74%) sepia(52%) saturate(759%) hue-rotate(172deg) brightness(103%) contrast(101%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-visibility-private,
:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-visibility-private .comment-btn {
  color: #92a4b4 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-visibility-private .comment-btn img {
  filter: brightness(0) saturate(100%) invert(67%) sepia(10%) saturate(559%) hue-rotate(166deg) brightness(94%) contrast(88%) !important;
  opacity: 0.9 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-visibility-blacklisted,
:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-visibility-deleted {
  color: #ff7d68 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-visibility-blacklisted .comment-btn img,
:root[data-theme="midnight"] .level-detail-page .level-posted-with-visibility .level-visibility-deleted .comment-btn img {
  filter: brightness(0) saturate(100%) invert(66%) sepia(79%) saturate(3004%) hue-rotate(322deg) brightness(103%) contrast(102%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] :is(.level-status-row-badge, .level-status-card-badge).level-status-blacklisted img {
  filter: brightness(0) saturate(100%) invert(64%) sepia(90%) saturate(2431%) hue-rotate(323deg) brightness(103%) contrast(101%) drop-shadow(0 1px 0 rgba(0,0,0,0.45)) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] :is(.level-status-row-badge, .level-status-card-badge).level-status-duplicate img {
  filter: brightness(0) saturate(100%) invert(78%) sepia(30%) saturate(1107%) hue-rotate(203deg) brightness(104%) contrast(101%) drop-shadow(0 1px 0 rgba(0,0,0,0.45)) !important;
  opacity: 1 !important;
}

/* Final dark polish: menu section divider, portal header-only hover, and level filters. */
:root[data-theme="midnight"] .auth .mobile-actions-dropdown .dropdown-divider {
  margin: 5px 0 !important;
  border-top-color: rgba(159, 208, 255, 0.34) !important;
}

:root[data-theme="midnight"] .auth .mobile-actions-dropdown a:has(+ .dropdown-divider) {
  border-bottom-color: transparent !important;
}

:root[data-theme="midnight"] .auth .mobile-actions-dropdown .dropdown-divider + a,
:root[data-theme="midnight"] .auth .mobile-actions-dropdown a:hover + a,
:root[data-theme="midnight"] .auth .mobile-actions-dropdown a:focus-visible + a {
  border-top-color: transparent !important;
}

:root[data-theme="midnight"] .level-portal-page .level-source-row,
:root[data-theme="midnight"] .level-portal-page .level-source-row:visited,
:root[data-theme="midnight"] .level-portal-page .level-source-row:hover,
:root[data-theme="midnight"] .level-portal-page .level-source-row:focus-visible {
  color: inherit !important;
  text-decoration: none !important;
  outline-color: transparent !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .level-portal-page .level-source-row:hover,
:root[data-theme="midnight"] .level-portal-page .level-source-row:focus-visible {
  background: rgba(121, 184, 224, 0.1) !important;
}

:root[data-theme="midnight"] .level-portal-page .level-source-row .level-source-archive-mark {
  color: #9fd0ff !important;
  text-decoration: none !important;
}

:root[data-theme="midnight"] .level-portal-page .level-source-row .level-source-name h2 {
  color: #9fd0ff !important;
  text-decoration: none !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] .level-portal-page .level-source-row:hover .level-source-name h2,
:root[data-theme="midnight"] .level-portal-page .level-source-row:focus-visible .level-source-name h2 {
  color: #9fd0ff !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] .level-portal-page .level-source-row:focus-visible .level-source-name h2 {
  border-radius: 3px !important;
  outline: 2px solid currentColor !important;
  outline-offset: 3px !important;
}

:root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row-name a:hover,
:root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row-name a:focus-visible,
:root[data-theme="midnight"] .levels-card-grid .level-browse-title:hover,
:root[data-theme="midnight"] .levels-card-grid .level-browse-title:focus-visible,
:root[data-theme="midnight"] .levels-grid-boxes .level-browse-title:hover,
:root[data-theme="midnight"] .levels-grid-boxes .level-browse-title:focus-visible {
  color: #ffffff !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] .levels-filter-body .levels-checkbox-field,
:root[data-theme="midnight"] .levels-filter-body .levels-checkbox-field span,
:root[data-theme="midnight"] .levels-page .levels-filter-body .levels-checkbox-field,
:root[data-theme="midnight"] .levels-page .levels-filter-body .levels-checkbox-field span {
  color: #ffffff !important;
}

:root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row {
  background: transparent !important;
  border-color: rgba(196, 222, 240, 0.24) !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-top: 0 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row:hover {
  background: rgba(121, 184, 224, 0.08) !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row:has(.level-status-featured) {
  background: rgba(244, 201, 80, 0.09) !important;
  border-color: rgba(244, 201, 80, 0.42) !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row:has(.level-status-featured):hover {
  background: rgba(244, 201, 80, 0.13) !important;
}

:root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row:has(.level-status-private) {
  background: rgba(245, 251, 255, 0.06) !important;
}

:root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row:has(.level-status-blacklisted) {
  background: rgba(255, 125, 104, 0.08) !important;
}

:root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row:has(.level-status-duplicate):not(:has(.level-status-blacklisted)) {
  background: rgba(177, 168, 255, 0.08) !important;
}

:root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row-game,
:root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row-difficulty,
:root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row-stat {
  background: transparent !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .level-portal-page .level-source-row,
:root[data-theme="midnight"] .level-portal-page .level-source-row *,
:root[data-theme="midnight"] .level-portal-page .level-source-row:hover,
:root[data-theme="midnight"] .level-portal-page .level-source-row:hover *,
:root[data-theme="midnight"] .level-portal-page .level-source-row:focus-visible,
:root[data-theme="midnight"] .level-portal-page .level-source-row:focus-visible * {
  text-decoration: none !important;
}

:root[data-theme="midnight"] .level-portal-page .level-source-row:hover .level-source-name h2,
:root[data-theme="midnight"] .level-portal-page .level-source-row:focus-visible .level-source-name h2 {
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] .levels-page .text .levels-grid .level-row-name a:hover,
:root[data-theme="midnight"] .levels-page .text .levels-grid .level-row-name a:focus-visible,
:root[data-theme="midnight"] .levels-page .text .levels-card-grid a.level-browse-title:hover,
:root[data-theme="midnight"] .levels-page .text .levels-card-grid a.level-browse-title:focus-visible,
:root[data-theme="midnight"] .levels-page .text .levels-grid-boxes a.level-browse-title:hover,
:root[data-theme="midnight"] .levels-page .text .levels-grid-boxes a.level-browse-title:focus-visible {
  color: #ffffff !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

/* Mobile detailed level rows need a card outline, not boxed stat fields. */
@media (max-width: 900px) {
  :root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row {
    border: 1px solid rgba(143, 190, 220, 0.34) !important;
    border-radius: 7px !important;
    background: rgba(32, 62, 86, 0.72) !important;
    box-shadow: none !important;
  }

  :root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row:hover {
    border-color: rgba(190, 226, 248, 0.46) !important;
    background: rgba(36, 72, 100, 0.82) !important;
    box-shadow: none !important;
  }

  :root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row:has(.level-status-featured) {
    border-color: rgba(244, 201, 80, 0.74) !important;
    background: rgba(244, 201, 80, 0.1) !important;
  }

  :root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row:has(.level-status-blacklisted) {
    border-color: rgba(255, 125, 104, 0.62) !important;
    background: rgba(255, 125, 104, 0.08) !important;
  }

  :root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row:has(.level-status-duplicate):not(:has(.level-status-blacklisted)) {
    border-color: rgba(210, 176, 255, 0.58) !important;
    background: rgba(177, 168, 255, 0.09) !important;
  }

  :root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row-game,
  :root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row-difficulty,
  :root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row-stat {
    margin-top: 0 !important;
    padding: 5px 0 !important;
    border: 0 !important;
    border-top: 1px solid rgba(143, 190, 220, 0.18) !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #f5fbff !important;
  }

  :root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row-game::before,
  :root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row-difficulty::before,
  :root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row-stat::before {
    color: #dff3ff !important;
  }

  :root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row-stat.has-viewer-action {
    grid-template-columns: minmax(0, 1fr) auto auto !important;
    margin: 0 -6px !important;
    padding: 5px 6px !important;
    border: 0 !important;
    border-radius: 4px !important;
    background: rgba(75, 166, 91, 0.3) !important;
    color: #e8ffee !important;
    box-shadow: inset 0 0 0 1px rgba(139, 230, 157, 0.1) !important;
  }

  :root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row-stat.has-viewer-action::before,
  :root[data-theme="midnight"] .levels-grid:not(.levels-grid-boxes) .level-row-stat.has-viewer-action::after {
    color: #d8ffe1 !important;
  }
}

/* Level detail navigation links use their intended midnight hover colors. */
:root[data-theme="midnight"] .level-detail-page .level-back-link:hover,
:root[data-theme="midnight"] .level-detail-page .level-back-link:focus-visible {
  color: #ffffff !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] .level-detail-page .level-duplicate-banner a:hover,
:root[data-theme="midnight"] .level-detail-page .level-duplicate-banner a:focus-visible {
  color: #ffffff !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

:root[data-theme="midnight"] .level-detail-page .level-back-link:hover img,
:root[data-theme="midnight"] .level-detail-page .level-back-link:focus-visible img {
  filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(131deg) brightness(106%) contrast(103%) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] .level-detail-page .level-duplicate-banner img {
  filter: brightness(0) saturate(100%) invert(78%) sepia(33%) saturate(1042%) hue-rotate(202deg) brightness(106%) contrast(101%) drop-shadow(0 1px 0 rgba(0,0,0,0.45)) !important;
  opacity: 1 !important;
}

/* Deleted comments keep their status outline and normal deleted opacity without left slivers. */
:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment {
  opacity: 0.65 !important;
  border: 1px solid #d96a74 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] :is(
  .comment.deleted-comment,
  .reply.deleted-comment,
  .level-comment.deleted-comment,
  .level-detail-page .level-comment.deleted-comment,
  .level-detail-page .reply.deleted-comment
) {
  opacity: 0.65 !important;
  border: 1px solid #d96a74 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] .announcement-thread .announcement-deleted-reply {
  opacity: 0.65 !important;
  border: 1px solid #d96a74 !important;
  box-shadow: none !important;
}

:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment::after {
  content: none !important;
  display: none !important;
}

:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment :is(.comment-username, .reply-username) {
  opacity: 1 !important;
}

:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment :is(.comment-username, .reply-username)[style*="--role-color"] {
  color: var(--role-color, currentColor) !important;
  opacity: 1 !important;
}

:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment :is(.comment-username, .reply-username)[style*="#990099"] { color: #f18cff !important; }
:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment :is(.comment-username, .reply-username)[style*="#ff9900"],
:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment :is(.comment-username, .reply-username)[style*="#FF9900"] { color: #ffd47f !important; }
:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment :is(.comment-username, .reply-username)[style*="#008000"] { color: #8cf59d !important; }
:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment :is(.comment-username, .reply-username)[style*="#0066ff"],
:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment :is(.comment-username, .reply-username)[style*="#0066FF"] { color: #42cfff !important; }
:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment :is(.comment-username, .reply-username)[style*="#c2185b"] { color: #ff8db6 !important; }
:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment :is(.comment-username, .reply-username)[style*="#414141"] { color: #f5fbff !important; }
:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment :is(.comment-username, .reply-username)[style*="#9aa3ad"] { color: #b9c8d6 !important; }
:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment :is(.comment-username, .reply-username)[style*="#4f7180"] { color: #7fa6c1 !important; }
:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment :is(.comment-username, .reply-username)[style*="#555f68"] { color: #a3b5c4 !important; }
:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment :is(.comment-username, .reply-username)[style*="#861717"] { color: #ff8f96 !important; }

:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment :is(.comment-avatar, .reply-avatar) {
  opacity: 1 !important;
  border-color: var(--role-color, #f5fbff) !important;
}

:root[data-theme="midnight"] :is(.comment, .reply, .level-comment).deleted-comment > :is(.comment-header, .reply-header) {
  border-left: 0 !important;
}

/* Linked plain comments/replies/announcements keep the classic gold target ring.
   Status-flair items keep their own locked/private/deleted/pinned outlines. */
:root[data-theme="midnight"] .comment.linked-target:not(.pinned-comment):not(.deleted-comment):not(.private-comment):not(.locked-comment),
:root[data-theme="midnight"] .reply.linked-target:not(.pinned-comment):not(.deleted-comment):not(.private-comment):not(.locked-comment),
:root[data-theme="midnight"] .level-comment.linked-target:not(.pinned-comment):not(.deleted-comment):not(.private-comment):not(.locked-comment),
:root[data-theme="midnight"] .announcement-card.linked-target:not(.announcement-deleted):not(.announcement-locked-card):not(:has(> .announcement-deleted-badge)):not(:has(> .announcement-locked)),
:root[data-theme="midnight"] .announcement-thread .reply.linked-target:not(.announcement-deleted-reply):not(:has(> .announcement-deleted-badge)) {
  border-color: #d49a1f !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,0.06),
    0 0 0 2px rgba(212,154,31,0.2) !important;
}

/* Announcement reply containers are just spacing and a divider, not panels. */
:root[data-theme="midnight"] .announcement-thread {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-top: 1px solid rgba(196, 222, 240, 0.22) !important;
  box-shadow: none !important;
  outline: 0 !important;
}

:root[data-theme="midnight"] .announcement-thread .thread-replies {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

/* Final dark-theme hover locks. */
html[data-theme="midnight"] body.level-detail-page .level-back-row > a.level-back-link:hover,
html[data-theme="midnight"] body.level-detail-page .level-back-row > a.level-back-link:focus-visible,
:root[data-theme="midnight"] body.level-detail-page .level-back-row > a.level-back-link:hover,
:root[data-theme="midnight"] body.level-detail-page .level-back-row > a.level-back-link:focus-visible {
  color: #ffffff !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

html[data-theme="midnight"] body.level-detail-page .level-back-row > a.level-back-link:hover img,
html[data-theme="midnight"] body.level-detail-page .level-back-row > a.level-back-link:focus-visible img,
:root[data-theme="midnight"] body.level-detail-page .level-back-row > a.level-back-link:hover img,
:root[data-theme="midnight"] body.level-detail-page .level-back-row > a.level-back-link:focus-visible img {
  filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(131deg) brightness(106%) contrast(103%) !important;
  opacity: 1 !important;
}

html[data-theme="midnight"] .profile-music-title:hover,
html[data-theme="midnight"] .profile-music-title:focus-visible,
:root[data-theme="midnight"] .profile-music-title:hover,
:root[data-theme="midnight"] .profile-music-title:focus-visible {
  color: #ff6f7a !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

html[data-theme="midnight"] .profile-music-title,
:root[data-theme="midnight"] .profile-music-title {
  transition: none !important;
}

/* Final dark-theme content-page button/text locks. */
html[data-theme="midnight"] body.content-page.info-page .contact-actions a,
:root[data-theme="midnight"] body.content-page.info-page .contact-actions a {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 8px 18px !important;
  border: 1px solid var(--button-border) !important;
  border-radius: 10px !important;
  background: var(--button-bg) !important;
  color: var(--button-text) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  box-shadow: var(--button-shadow) !important;
}

html[data-theme="midnight"] body.content-page.info-page .contact-actions a:hover,
html[data-theme="midnight"] body.content-page.info-page .contact-actions a:focus-visible,
:root[data-theme="midnight"] body.content-page.info-page .contact-actions a:hover,
:root[data-theme="midnight"] body.content-page.info-page .contact-actions a:focus-visible {
  border-color: var(--button-hover-border) !important;
  background: var(--button-hover-bg) !important;
  color: var(--button-hover-text) !important;
  text-decoration: none !important;
  box-shadow: var(--button-hover-shadow) !important;
}

html[data-theme="midnight"] body.content-page.info-page .contact-actions a img,
:root[data-theme="midnight"] body.content-page.info-page .contact-actions a img {
  width: 20px !important;
  height: 20px !important;
  opacity: 0.78 !important;
}

html[data-theme="midnight"] .text.center-text p,
html[data-theme="midnight"] .text.center-text .contact-email,
:root[data-theme="midnight"] .text.center-text p,
:root[data-theme="midnight"] .text.center-text .contact-email {
  color: #f5fbff !important;
}

html[data-theme="midnight"] .text.center-text p b,
html[data-theme="midnight"] .text.center-text .contact-email b,
:root[data-theme="midnight"] .text.center-text p b,
:root[data-theme="midnight"] .text.center-text .contact-email b {
  color: #ffffff !important;
}

html[data-theme="midnight"] .text.center-text p a,
html[data-theme="midnight"] .text.center-text p a b,
:root[data-theme="midnight"] .text.center-text p a,
:root[data-theme="midnight"] .text.center-text p a b {
  color: #8fd0ff !important;
}

html[data-theme="midnight"] .text.center-text p a:hover,
html[data-theme="midnight"] .text.center-text p a:focus-visible,
html[data-theme="midnight"] .text.center-text p a:hover b,
html[data-theme="midnight"] .text.center-text p a:focus-visible b,
:root[data-theme="midnight"] .text.center-text p a:hover,
:root[data-theme="midnight"] .text.center-text p a:focus-visible,
:root[data-theme="midnight"] .text.center-text p a:hover b,
:root[data-theme="midnight"] .text.center-text p a:focus-visible b {
  color: #ff6f7a !important;
}

html[data-theme="midnight"] body.content-page.info-page .text a:not(.contact-actions a),
html[data-theme="midnight"] body.content-page.info-page .text a:not(.contact-actions a) b,
:root[data-theme="midnight"] body.content-page.info-page .text a:not(.contact-actions a),
:root[data-theme="midnight"] body.content-page.info-page .text a:not(.contact-actions a) b {
  color: #8fd0ff !important;
  text-decoration-color: rgba(143, 208, 255, 0.72) !important;
}

html[data-theme="midnight"] body.content-page.info-page .text a:not(.contact-actions a):hover,
html[data-theme="midnight"] body.content-page.info-page .text a:not(.contact-actions a):focus-visible,
html[data-theme="midnight"] body.content-page.info-page .text a:not(.contact-actions a):hover b,
html[data-theme="midnight"] body.content-page.info-page .text a:not(.contact-actions a):focus-visible b,
:root[data-theme="midnight"] body.content-page.info-page .text a:not(.contact-actions a):hover,
:root[data-theme="midnight"] body.content-page.info-page .text a:not(.contact-actions a):focus-visible,
:root[data-theme="midnight"] body.content-page.info-page .text a:not(.contact-actions a):hover b,
:root[data-theme="midnight"] body.content-page.info-page .text a:not(.contact-actions a):focus-visible b {
  color: #ff6f7a !important;
  text-decoration: underline !important;
  text-decoration-color: currentColor !important;
}

/* Notifications keep their dark unread card styling; hover underlines only the message. */
:root[data-theme="midnight"] .notifications-page .notification-message-link,
:root[data-theme="midnight"] .notifications-page .notification-message-link *,
:root[data-theme="midnight"] .notifications-page .notification-message-link:hover,
:root[data-theme="midnight"] .notifications-page .notification-message-link:focus-visible,
:root[data-theme="midnight"] .notifications-page .notification-message-link:hover *,
:root[data-theme="midnight"] .notifications-page .notification-message-link:focus-visible * {
  text-decoration: none !important;
  text-decoration-line: none !important;
  text-decoration-color: transparent !important;
}

:root[data-theme="midnight"] .notifications-page .notification-message-link:hover,
:root[data-theme="midnight"] .notifications-page .notification-message-link:focus-visible {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  color: inherit !important;
  text-decoration: none !important;
  text-decoration-line: none !important;
  text-decoration-color: transparent !important;
}

:root[data-theme="midnight"] .notifications-page .notification-message-link:hover .notification-message,
:root[data-theme="midnight"] .notifications-page .notification-message-link:focus-visible .notification-message {
  text-decoration: none !important;
  text-decoration-line: none !important;
  text-decoration-color: transparent !important;
  background-image: none !important;
  box-shadow: inset 0 -1px 0 #ffffff !important;
}

:root[data-theme="midnight"] .notifications-page .notification-message-link:hover .notification-message *,
:root[data-theme="midnight"] .notifications-page .notification-message-link:focus-visible .notification-message * {
  text-decoration: none !important;
  text-decoration-line: none !important;
  text-decoration-color: transparent !important;
}