html[data-theme="dark"] {
  color-scheme: dark;
}

html[data-theme="light"] {
  color-scheme: light;
}

html[data-theme="dark"] body {
  background: #111418 !important;
  color: #e5e7eb;
}

html[data-theme="dark"] body main,
html[data-theme="dark"] body p,
html[data-theme="dark"] body li,
html[data-theme="dark"] body dd,
html[data-theme="dark"] body dt,
html[data-theme="dark"] body span,
html[data-theme="dark"] body strong,
html[data-theme="dark"] body em,
html[data-theme="dark"] body label,
html[data-theme="dark"] body small,
html[data-theme="dark"] body h1,
html[data-theme="dark"] body h2,
html[data-theme="dark"] body h3,
html[data-theme="dark"] body h4,
html[data-theme="dark"] body h5,
html[data-theme="dark"] body h6,
html[data-theme="dark"] body th,
html[data-theme="dark"] body td,
html[data-theme="dark"] body legend {
  color: inherit;
}

html[data-theme="dark"] body a {
  color: #cfe3ff;
}

html[data-theme="dark"] body a:hover {
  color: #ffffff;
}

html[data-theme="dark"] .dropdown-simsim,
html[data-theme="dark"] .dropdown-pc,
html[data-theme="dark"] .accordion-mobile,
html[data-theme="dark"] .lang-card,
html[data-theme="dark"] #profile-popup,
html[data-theme="dark"] .global-loader__box {
  background: #171b21 !important;
  color: #e5e7eb !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 14px 40px rgba(0, 0, 0, 0.28);
}

html[data-theme="dark"] header,
html[data-theme="dark"] footer,
html[data-theme="dark"] .header-container,
html[data-theme="dark"] .header-top,
html[data-theme="dark"] .header-bottom,
html[data-theme="dark"] .footer-container,
html[data-theme="dark"] .footer-content,
html[data-theme="dark"] .footer-bottom {
  background: #111418 !important;
  color: #e5e7eb !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .header-bottom,
html[data-theme="dark"] .footer-bottom,
html[data-theme="dark"] .shorts-topbar,
html[data-theme="dark"] .shorts-modal-header,
html[data-theme="dark"] .shorts-comment-form {
  border-color: rgba(255, 255, 255, 0.10) !important;
}

html[data-theme="dark"] .nav-link,
html[data-theme="dark"] .fancy-link,
html[data-theme="dark"] .footer-links a,
html[data-theme="dark"] .footer-content,
html[data-theme="dark"] .footer-info,
html[data-theme="dark"] .copyright,
html[data-theme="dark"] .lang-title,
html[data-theme="dark"] .lang-option,
html[data-theme="dark"] .lang-close,
html[data-theme="dark"] .global-loader__title,
html[data-theme="dark"] .global-loader__sub {
  color: #e5e7eb !important;
}

html[data-theme="dark"] .lang-option {
  background: rgba(255, 255, 255, 0.04);
  border-color: rgba(255, 255, 255, 0.14);
}

html[data-theme="dark"] .lang-option:hover,
html[data-theme="dark"] .lang-option:focus-visible {
  background: rgba(255, 255, 255, 0.08);
}

html[data-theme="dark"] .footer-links a,
html[data-theme="dark"] .footer-theme-toggle {
  color: rgba(229, 231, 235, 0.88) !important;
}

html[data-theme="dark"] .footer-links a:hover,
html[data-theme="dark"] .footer-theme-toggle:hover {
  color: #ffffff !important;
}

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea,
html[data-theme="dark"] button:not(.chat-float-button):not(.lang-option):not(.shorts-action):not(.shorts-tab):not(.shorts-brand):not(.shorts-side-link):not(.shorts-more-btn):not(.shorts-comment-submit):not(.footer-theme-toggle) {
  color: #e5e7eb;
}

html[data-theme="dark"] input,
html[data-theme="dark"] select,
html[data-theme="dark"] textarea {
  background: #111418;
  border-color: rgba(255, 255, 255, 0.14);
}

html[data-theme="dark"] table,
html[data-theme="dark"] th,
html[data-theme="dark"] td {
  border-color: rgba(255, 255, 255, 0.10) !important;
}

html[data-theme="dark"] .global-loader {
  background: rgba(6, 8, 12, 0.76);
}

html[data-theme="dark"] .global-loader__spinner {
  border-color: rgba(255, 255, 255, 0.18);
  border-top-color: #8cb8ff;
}

html[data-theme="dark"] .main-ad-banner {
  background: rgba(255, 255, 255, 0.04);
  color: #f3f4f6;
}

html[data-theme="dark"] body.shorts-page {
  --shorts-bg: #0b0c0f;
  --shorts-surface: rgba(255, 255, 255, 0.06);
  --shorts-surface-2: rgba(255, 255, 255, 0.10);
  --shorts-border: rgba(255, 255, 255, 0.12);
  --shorts-text: rgba(255, 255, 255, 0.96);
  --shorts-muted: rgba(255, 255, 255, 0.72);
  --shorts-dim: rgba(255, 255, 255, 0.56);
  --shorts-shadow: 0 14px 40px rgba(0, 0, 0, 0.45);
}

html[data-theme="light"] body.shorts-page {
  --shorts-bg: #f4f7fb;
  --shorts-surface: rgba(255, 255, 255, 0.88);
  --shorts-surface-2: rgba(15, 23, 42, 0.08);
  --shorts-border: rgba(15, 23, 42, 0.12);
  --shorts-text: rgba(17, 24, 39, 0.96);
  --shorts-muted: rgba(17, 24, 39, 0.72);
  --shorts-dim: rgba(17, 24, 39, 0.56);
  --shorts-shadow: 0 14px 40px rgba(15, 23, 42, 0.14);
}

html[data-theme="light"] body.shorts-page .shorts-side,
html[data-theme="light"] body.shorts-page .shorts-rail-card,
html[data-theme="light"] body.shorts-page .shorts-topbar,
html[data-theme="light"] body.shorts-page .shorts-item,
html[data-theme="light"] body.shorts-page .shorts-empty,
html[data-theme="light"] body.shorts-page .shorts-modal-panel,
html[data-theme="light"] body.shorts-page .shorts-comment,
html[data-theme="light"] body.shorts-page .shorts-comment-form {
  background: rgba(255, 255, 255, 0.88) !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
}

html[data-theme="light"] body.shorts-page .shorts-side-foot,
html[data-theme="light"] body.shorts-page .shorts-brand,
html[data-theme="light"] body.shorts-page .shorts-tabs,
html[data-theme="light"] body.shorts-page .shorts-search,
html[data-theme="light"] body.shorts-page .shorts-autoplay,
html[data-theme="light"] body.shorts-page .shorts-more-btn,
html[data-theme="light"] body.shorts-page .shorts-comment-input {
  background: rgba(255, 255, 255, 0.90) !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
}

html[data-theme="light"] body.shorts-page .shorts-search-input::placeholder,
html[data-theme="light"] body.shorts-page .shorts-comment-input::placeholder {
  color: rgba(17, 24, 39, 0.45);
}

html[data-theme="light"] body.shorts-page .shorts-search-btn,
html[data-theme="light"] body.shorts-page .shorts-modal-close,
html[data-theme="light"] body.shorts-page .shorts-title,
html[data-theme="light"] body.shorts-page .shorts-author,
html[data-theme="light"] body.shorts-page .shorts-author a,
html[data-theme="light"] body.shorts-page .shorts-author .shorts-author-link,
html[data-theme="light"] body.shorts-page .shorts-author .shorts-author-name,
html[data-theme="light"] body.shorts-page .shorts-author .shorts-author-guest,
html[data-theme="light"] body.shorts-page .shorts-count,
html[data-theme="light"] body.shorts-page .shorts-comment .c-text,
html[data-theme="light"] body.shorts-page .shorts-loadmore-pill,
html[data-theme="light"] body.shorts-page .shorts-end-pill {
  color: rgba(17, 24, 39, 0.92) !important;
}

html[data-theme="light"] body.shorts-page .shorts-loadmore-pill,
html[data-theme="light"] body.shorts-page .shorts-end-pill,
html[data-theme="light"] body.shorts-page .shorts-center-hint {
  background: rgba(255, 255, 255, 0.92) !important;
  border-color: rgba(15, 23, 42, 0.12) !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.14);
}

html[data-theme="light"] body.shorts-page .shorts-actions .shorts-ico,
html[data-theme="light"] body.shorts-page .shorts-comment .c-avatar {
  background: rgba(255, 255, 255, 0.92) !important;
  border-color: rgba(15, 23, 42, 0.14) !important;
  color: rgba(17, 24, 39, 0.92) !important;
  box-shadow: 0 8px 18px rgba(15, 23, 42, 0.14);
}

html[data-theme="light"] body.shorts-page .shorts-feed::-webkit-scrollbar-thumb {
  background: rgba(15, 23, 42, 0.16);
  border-color: rgba(244, 247, 251, 0.95);
}

html[data-theme="light"] body.shorts-page .shorts-feed::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.05);
}

html[data-theme="light"] body.shorts-page .shorts-overlay::before {
  background: linear-gradient(to top, rgba(255,255,255,0.16), rgba(255,255,255,0));
}

html[data-theme="light"] body.shorts-page .shorts-player {
  background: #dbe2ea;
}

html[data-theme="light"] body.shorts-page .shorts-comment-submit {
  color: #ffffff;
}

.footer-theme-item {
  list-style: none;
}

.footer-theme-toggle {
  appearance: none;
  border: 1px solid rgba(17, 24, 39, 0.12);
  background: transparent;
  color: #4b5563;
  border-radius: 999px;
  padding: 8px 14px;
  font: inherit;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  transition: background-color 160ms ease, color 160ms ease, border-color 160ms ease, transform 160ms ease;
}

.footer-theme-toggle:hover {
  background: rgba(17, 24, 39, 0.06);
  color: #111827;
  transform: translateY(-1px);
}

.footer-theme-toggle:focus-visible {
  outline: 2px solid #60a5fa;
  outline-offset: 2px;
}


/* =========================================================
   Dark mode additions: board list / vote / wiki
   - keeps existing layout and only overrides colors
========================================================= */
html[data-theme="dark"] .post-list-table,
html[data-theme="dark"] .post-list-table tbody,
html[data-theme="dark"] .post-list-table tr,
html[data-theme="dark"] .post-list-table td,
html[data-theme="dark"] .post-list-table th {
  color: #e5e7eb !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] .post-list-table thead tr,
html[data-theme="dark"] .post-list-table thead th {
  background: #171b21 !important;
  color: #e5e7eb !important;
}

html[data-theme="dark"] .post-list-table tbody tr:hover {
  background: rgba(255, 255, 255, 0.03) !important;
}

html[data-theme="dark"] .post-link,
html[data-theme="dark"] .board-title-link,
html[data-theme="dark"] .subtitle-link,
html[data-theme="dark"] .nickname-link,
html[data-theme="dark"] .meta-author,
html[data-theme="dark"] .meta-like,
html[data-theme="dark"] .meta-comment,
html[data-theme="dark"] .meta-view {
  color: #dbe8ff !important;
}

html[data-theme="dark"] .favorite-btn,
html[data-theme="dark"] .pagination a,
html[data-theme="dark"] .list-toolbar select,
html[data-theme="dark"] .list-toolbar input,
html[data-theme="dark"] .list-toolbar button,
html[data-theme="dark"] #btn-write {
  background: #171b21 !important;
  color: #e5e7eb !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .pagination a.active,
html[data-theme="dark"] #btn-write,
html[data-theme="dark"] .vote-btn-primary,
html[data-theme="dark"] .vote-home-action.vote-btn-primary,
html[data-theme="dark"] .vote-page-btn.vote-btn-primary {
  background: #1d4ed8 !important;
  color: #ffffff !important;
  border-color: #1d4ed8 !important;
}

html[data-theme="dark"] .vote-page,
html[data-theme="dark"] .vote-page .vote-title,
html[data-theme="dark"] .vote-page .vote-home-title,
html[data-theme="dark"] .vote-page .vote-home-subtitle,
html[data-theme="dark"] .vote-page .vote-section-title,
html[data-theme="dark"] .vote-page .vote-poll-title,
html[data-theme="dark"] .vote-page .vote-rank-title,
html[data-theme="dark"] .vote-page .hero-winner,
html[data-theme="dark"] .vote-page .vote-embed-title,
html[data-theme="dark"] .vote-page .vote-result-title,
html[data-theme="dark"] .vote-page .promo-label,
html[data-theme="dark"] .vote-page .section-title,
html[data-theme="dark"] .vote-page .poll-card-title,
html[data-theme="dark"] .vote-page .poll-list-title,
html[data-theme="dark"] .vote-page .candidate-name {
  color: #e5e7eb !important;
}

html[data-theme="dark"] .vote-page .vote-sub,
html[data-theme="dark"] .vote-page .vote-meta,
html[data-theme="dark"] .vote-page .vote-home-subtitle,
html[data-theme="dark"] .vote-page .vote-poll-meta,
html[data-theme="dark"] .vote-page .vote-poll-countdown,
html[data-theme="dark"] .vote-page .vote-poll-votes,
html[data-theme="dark"] .vote-page .vote-poll-type,
html[data-theme="dark"] .vote-page .vote-row-meta,
html[data-theme="dark"] .vote-page .poll-card-meta,
html[data-theme="dark"] .vote-page .poll-list-meta,
html[data-theme="dark"] .vote-page .poll-list-right,
html[data-theme="dark"] .vote-page .small,
html[data-theme="dark"] .vote-page .vote-empty,
html[data-theme="dark"] .vote-page .vote-card-sub,
html[data-theme="dark"] .vote-page .vote-home-note,
html[data-theme="dark"] .vote-page .vote-card-meta,
html[data-theme="dark"] .vote-page .vote-result-sub,
html[data-theme="dark"] .vote-page .vote-result-sub *,
html[data-theme="dark"] .vote-page .promo-hint,
html[data-theme="dark"] .vote-page .hero-title,
html[data-theme="dark"] .vote-page .rank,
html[data-theme="dark"] .vote-page .count,
html[data-theme="dark"] .vote-page .muted,
html[data-theme="dark"] .vote-page .form-hint,
html[data-theme="dark"] .vote-page .form-count,
html[data-theme="dark"] .vote-page .vote-hint {
  color: rgba(229, 231, 235, 0.76) !important;
}

html[data-theme="dark"] .vote-home-header,
html[data-theme="dark"] .vote-top-tabs,
html[data-theme="dark"] .vote-hero,
html[data-theme="dark"] .vote-filter-home,
html[data-theme="dark"] .vote-section:not(.vote-section-home),
html[data-theme="dark"] .vote-card,
html[data-theme="dark"] .vote-row,
html[data-theme="dark"] .vote-rank-box,
html[data-theme="dark"] .vote-embed-card,
html[data-theme="dark"] .vote-form,
html[data-theme="dark"] .candidate-card,
html[data-theme="dark"] .result-hero,
html[data-theme="dark"] .result-list,
html[data-theme="dark"] .rank-table,
html[data-theme="dark"] .poll-card,
html[data-theme="dark"] .poll-list-item,
html[data-theme="dark"] .vote-poll-card,
html[data-theme="dark"] .vote-empty,
html[data-theme="dark"] .result-share,
html[data-theme="dark"] .promo-card,
html[data-theme="dark"] .vote-result-page,
html[data-theme="dark"] .vote-result-wrap,
html[data-theme="dark"] .vote-card,
html[data-theme="dark"] .vote-list .vote-row {
  background: #171b21 !important;
  color: #e5e7eb !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .vote-hero {
  background: linear-gradient(135deg, rgba(23, 27, 33, 0.98) 0%, rgba(28, 35, 45, 0.98) 100%) !important;
}

html[data-theme="dark"] .vote-result-page {
  background: linear-gradient(180deg, #111418 0%, #111418 100%) !important;
}

html[data-theme="dark"] .vote-top-tab {
  color: rgba(229, 231, 235, 0.72) !important;
}

html[data-theme="dark"] .vote-top-tab.is-active,
html[data-theme="dark"] .vote-home-action,
html[data-theme="dark"] .vote-section-more,
html[data-theme="dark"] .vote-badge,
html[data-theme="dark"] .vote-rbtn,
html[data-theme="dark"] .meta-chip {
  background: #171b21 !important;
  color: #e5e7eb !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
}

html[data-theme="dark"] .vote-top-tab-indicator {
  background: #8cb8ff !important;
}

html[data-theme="dark"] .vote-input,
html[data-theme="dark"] .form-input,
html[data-theme="dark"] .form-textarea,
html[data-theme="dark"] .toggle-chip span,
html[data-theme="dark"] .candidate-order,
html[data-theme="dark"] .candidate-img-preview,
html[data-theme="dark"] .vote-btn,
html[data-theme="dark"] .btn,
html[data-theme="dark"] .vote-page select,
html[data-theme="dark"] .vote-page input,
html[data-theme="dark"] .vote-page textarea,
html[data-theme="dark"] .vote-page button,
html[data-theme="dark"] .vote-detail-url,
html[data-theme="dark"] .link-input {
  background: #111418 !important;
  color: #e5e7eb !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
}

html[data-theme="dark"] .vote-page .btn:hover,
html[data-theme="dark"] .vote-page .vote-btn:hover,
html[data-theme="dark"] .vote-poll-card:hover,
html[data-theme="dark"] .poll-card:hover,
html[data-theme="dark"] .poll-list-item:hover,
html[data-theme="dark"] .vote-row:hover,
html[data-theme="dark"] .rank-row:hover {
  background: #1b222b !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .vote-private-badge {
  background: rgba(255, 255, 255, 0.10) !important;
  color: rgba(229, 231, 235, 0.86) !important;
}

html[data-theme="dark"] .vote-page .rank-head,
html[data-theme="dark"] .vote-page .result-row,
html[data-theme="dark"] .vote-page .rank-row,
html[data-theme="dark"] .vote-page .vote-embed-head,
html[data-theme="dark"] .vote-page .vote-embed-actions,
html[data-theme="dark"] .vote-page .vote-embed-foot,
html[data-theme="dark"] .vote-page .result-share-head,
html[data-theme="dark"] .vote-page .vote-section-head,
html[data-theme="dark"] .vote-page .wiki-history-table th {
  border-color: rgba(255, 255, 255, 0.10) !important;
}

html[data-theme="dark"] .wiki-page,
html[data-theme="dark"] .wiki-page h1,
html[data-theme="dark"] .wiki-page h2,
html[data-theme="dark"] .wiki-page h3,
html[data-theme="dark"] .wiki-page h4,
html[data-theme="dark"] .wiki-page p,
html[data-theme="dark"] .wiki-page li,
html[data-theme="dark"] .wiki-page label,
html[data-theme="dark"] .wiki-page span,
html[data-theme="dark"] .wiki-page strong,
html[data-theme="dark"] .wiki-page small,
html[data-theme="dark"] .wiki-page time,
html[data-theme="dark"] .wiki-page td,
html[data-theme="dark"] .wiki-page th {
  color: #e5e7eb !important;
}

html[data-theme="dark"] .wiki-body,
html[data-theme="dark"] .wiki-card,
html[data-theme="dark"] .wiki-home-header,
html[data-theme="dark"] .wiki-toolbar--word,
html[data-theme="dark"] .wiki-toolbar--word .rt-group,
html[data-theme="dark"] .wiki-warning,
html[data-theme="dark"] .wiki-home-warning,
html[data-theme="dark"] .wiki-detail-url,
html[data-theme="dark"] .wiki-history-table,
html[data-theme="dark"] .wiki-history-table tr,
html[data-theme="dark"] .wiki-history-table td,
html[data-theme="dark"] .wiki-history-table th,
html[data-theme="dark"] #wiki-detail,
html[data-theme="dark"] #editor,
html[data-theme="dark"] #editModalEditor {
  background: #171b21 !important;
  color: #e5e7eb !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
}

html[data-theme="dark"] .wiki-search-form input[type="text"],
html[data-theme="dark"] .wiki-chip,
html[data-theme="dark"] .wiki-toolbar .rt-btn,
html[data-theme="dark"] .wiki-page .btn,
html[data-theme="dark"] .wiki-page input,
html[data-theme="dark"] .wiki-page textarea,
html[data-theme="dark"] .wiki-page select,
html[data-theme="dark"] #editSummary,
html[data-theme="dark"] #pageUrl {
  background: #111418 !important;
  color: #e5e7eb !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
}

html[data-theme="dark"] .wiki-list-item,
html[data-theme="dark"] .wiki-card-head,
html[data-theme="dark"] .wiki-history-table tr,
html[data-theme="dark"] .wiki-history-table td,
html[data-theme="dark"] .wiki-history-table th {
  border-color: rgba(255, 255, 255, 0.10) !important;
}

html[data-theme="dark"] .wiki-list-link,
html[data-theme="dark"] .wiki-chip,
html[data-theme="dark"] .wiki-link,
html[data-theme="dark"] .wiki-page a {
  color: #dbe8ff !important;
}

html[data-theme="dark"] .wiki-card-meta,
html[data-theme="dark"] .wiki-list-item .when,
html[data-theme="dark"] .wiki-empty,
html[data-theme="dark"] .wiki-warning-text {
  color: rgba(229, 231, 235, 0.72) !important;
}

html[data-theme="dark"] .wiki-home-warning {
  background: rgba(155, 38, 38, 0.14) !important;
  border-color: rgba(248, 113, 113, 0.20) !important;
}

html[data-theme="dark"] .wiki-toolbar--word .rt-btn:hover,
html[data-theme="dark"] .wiki-page .btn:hover,
html[data-theme="dark"] .wiki-chip:hover {
  background: #1b222b !important;
}

/* =========================================================
   Dark mode additions: global comments
   - board/detail comments, vote comments, generic comment lists
========================================================= */
html[data-theme="dark"] .comment-section,
html[data-theme="dark"] .comment-list,
html[data-theme="dark"] .comment-item,
html[data-theme="dark"] .comment-form-wrap,
html[data-theme="dark"] .comment-form,
html[data-theme="dark"] .reply-item,
html[data-theme="dark"] .reply-form,
html[data-theme="dark"] .reply-form-wrap,
html[data-theme="dark"] .vote-comments,
html[data-theme="dark"] .vote-comments-head,
html[data-theme="dark"] .vote-comment-item,
html[data-theme="dark"] .vote-comment-form-wrap,
html[data-theme="dark"] .vote-comment-form,
html[data-theme="dark"] .vote-comment-login-required,
html[data-theme="dark"] .shorts-comment,
html[data-theme="dark"] .shorts-comment-form {
  background: #171b21 !important;
  color: #e5e7eb !important;
  border-color: rgba(255, 255, 255, 0.12) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .comment-item:hover,
html[data-theme="dark"] .vote-comment-item:hover,
html[data-theme="dark"] .reply-item:hover {
  background: #1b222b !important;
}

html[data-theme="dark"] .comment-head,
html[data-theme="dark"] .comment-author,
html[data-theme="dark"] .comment-body,
html[data-theme="dark"] .comment-actions,
html[data-theme="dark"] .comment-actions-right,
html[data-theme="dark"] .comment-author .nickname-link,
html[data-theme="dark"] .guest-badge,
html[data-theme="dark"] .vote-comments-title,
html[data-theme="dark"] .vote-comments-count,
html[data-theme="dark"] .vote-comment-name,
html[data-theme="dark"] .vote-comment-meta,
html[data-theme="dark"] .vote-comment-edited,
html[data-theme="dark"] .vote-comment-like-count,
html[data-theme="dark"] .vote-comment-body,
html[data-theme="dark"] .vote-guest-hint,
html[data-theme="dark"] .vote-comment-login-required,
html[data-theme="dark"] .shorts-comment .c-head,
html[data-theme="dark"] .shorts-comment .c-name,
html[data-theme="dark"] .shorts-comment .c-text,
html[data-theme="dark"] .shorts-comment .c-meta {
  color: #e5e7eb !important;
}

html[data-theme="dark"] .comment-time,
html[data-theme="dark"] .comment-actions,
html[data-theme="dark"] .guest-badge,
html[data-theme="dark"] .vote-comments-count,
html[data-theme="dark"] .vote-comment-meta,
html[data-theme="dark"] .vote-comment-edited,
html[data-theme="dark"] .vote-comment-like-count,
html[data-theme="dark"] .vote-guest-hint,
html[data-theme="dark"] .shorts-comment .c-meta {
  color: rgba(229, 231, 235, 0.72) !important;
}

html[data-theme="dark"] .guest-field label,
html[data-theme="dark"] .comment-form label,
html[data-theme="dark"] .reply-form label {
  color: #d1d5db !important;
}

html[data-theme="dark"] .guest-field input,
html[data-theme="dark"] .comment-form textarea,
html[data-theme="dark"] .comment-form input,
html[data-theme="dark"] .reply-form textarea,
html[data-theme="dark"] .reply-form input,
html[data-theme="dark"] .vote-comment-form textarea,
html[data-theme="dark"] .vote-comment-edit-area textarea,
html[data-theme="dark"] textarea.vote-comment-editarea,
html[data-theme="dark"] .vote-guest-row input,
html[data-theme="dark"] .shorts-comment-input {
  background: #111418 !important;
  color: #e5e7eb !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .guest-field input::placeholder,
html[data-theme="dark"] .comment-form textarea::placeholder,
html[data-theme="dark"] .comment-form input::placeholder,
html[data-theme="dark"] .reply-form textarea::placeholder,
html[data-theme="dark"] .reply-form input::placeholder,
html[data-theme="dark"] .vote-comment-form textarea::placeholder,
html[data-theme="dark"] .vote-comment-edit-area textarea::placeholder,
html[data-theme="dark"] textarea.vote-comment-editarea::placeholder,
html[data-theme="dark"] .vote-guest-row input::placeholder,
html[data-theme="dark"] .shorts-comment-input::placeholder {
  color: rgba(229, 231, 235, 0.46) !important;
}

html[data-theme="dark"] .guest-field input:focus,
html[data-theme="dark"] .comment-form textarea:focus,
html[data-theme="dark"] .comment-form input:focus,
html[data-theme="dark"] .reply-form textarea:focus,
html[data-theme="dark"] .reply-form input:focus,
html[data-theme="dark"] .vote-comment-form textarea:focus,
html[data-theme="dark"] .vote-comment-edit-area textarea:focus,
html[data-theme="dark"] textarea.vote-comment-editarea:focus,
html[data-theme="dark"] .vote-guest-row input:focus,
html[data-theme="dark"] .shorts-comment-input:focus {
  border-color: #3b82f6 !important;
  box-shadow: 0 0 0 2px rgba(59, 130, 246, 0.14) !important;
}

html[data-theme="dark"] .comment-form .btn,
html[data-theme="dark"] .comment-form button,
html[data-theme="dark"] .reply-form .btn,
html[data-theme="dark"] .reply-form button,
html[data-theme="dark"] .vote-comment-action,
html[data-theme="dark"] .vote-comment-more {
  background: #111418 !important;
  color: #e5e7eb !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
  box-shadow: none !important;
}

html[data-theme="dark"] .comment-form .btn:hover,
html[data-theme="dark"] .comment-form button:hover,
html[data-theme="dark"] .reply-form .btn:hover,
html[data-theme="dark"] .reply-form button:hover,
html[data-theme="dark"] .vote-comment-action:hover,
html[data-theme="dark"] .vote-comment-more:hover {
  background: #1b222b !important;
}

html[data-theme="dark"] .vote-comment-like-btn.is-liked {
  background: rgba(59, 130, 246, 0.12) !important;
  border-color: rgba(96, 165, 250, 0.48) !important;
}

html[data-theme="dark"] .vote-comment-delete-btn {
  background: rgba(127, 29, 29, 0.20) !important;
  border-color: rgba(248, 113, 113, 0.28) !important;
  color: #fca5a5 !important;
}

html[data-theme="dark"] .vote-comment-save-btn {
  background: rgba(30, 64, 175, 0.18) !important;
  border-color: rgba(96, 165, 250, 0.34) !important;
}

html[data-theme="dark"] .vote-comment-empty {
  background: rgba(255, 255, 255, 0.02) !important;
  color: rgba(229, 231, 235, 0.72) !important;
  border-color: rgba(255, 255, 255, 0.14) !important;
}

/* =========================================================
   Light mode additions: shorts top area unify
   - keep full original file and only force the top region
========================================================= */
html[data-theme="light"] body.shorts-page,
html[data-theme="light"] body.shorts-page main,
html[data-theme="light"] body.shorts-page .shorts-shell,
html[data-theme="light"] body.shorts-page .shorts-layout,
html[data-theme="light"] body.shorts-page .shorts-main,
html[data-theme="light"] body.shorts-page .shorts-feed {
  background: var(--shorts-bg) !important;
}

html[data-theme="light"] body.shorts-page .shorts-topbar {
  background: var(--shorts-bg) !important;
  border-bottom-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}

/* =========================================================
   Shorts top background unify (light + dark)
   - keep controls/card backgrounds, unify only the area behind them
========================================================= */
html[data-theme="light"] body.shorts-page .shorts-shell,
html[data-theme="light"] body.shorts-page .shorts-layout,
html[data-theme="light"] body.shorts-page .shorts-main,
html[data-theme="light"] body.shorts-page .shorts-feed,
html[data-theme="light"] body.shorts-page .shorts-topbar,
html[data-theme="dark"] body.shorts-page .shorts-shell,
html[data-theme="dark"] body.shorts-page .shorts-layout,
html[data-theme="dark"] body.shorts-page .shorts-main,
html[data-theme="dark"] body.shorts-page .shorts-feed,
html[data-theme="dark"] body.shorts-page .shorts-topbar {
  background: transparent !important;
}

html[data-theme="light"] body.shorts-page .shorts-topbar,
html[data-theme="dark"] body.shorts-page .shorts-topbar {
  border-bottom-color: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
}
