:root {
  --theme-page: #f3f6f8;
  --theme-panel: #ffffff;
  --theme-panel-raised: #ffffff;
  --theme-panel-soft: #f7fafb;
  --theme-field: #ffffff;
  --theme-ink: #182026;
  --theme-muted: #62707c;
  --theme-line: #d9e0e7;
  --theme-teal: var(--theme-primary);
  --theme-teal-soft: var(--theme-primary-soft);
  --theme-danger: #d92d20;
  --theme-danger-soft: #fff1ef;
  --theme-warning-soft: #fff7e6;
  --theme-success-soft: #effaf6;
  --theme-info-soft: #eff6ff;
  --theme-purple-soft: #f5f3ff;
  --theme-shadow: 0 14px 32px rgba(24, 32, 38, 0.09);
  --page: var(--theme-page);
  --panel: var(--theme-panel);
  --ink: var(--theme-ink);
  --muted: var(--theme-muted);
  --line: var(--theme-line);
  --teal: var(--theme-teal);
  --accent: var(--theme-danger);
  --shadow: var(--theme-shadow);
  --home-page: var(--theme-page);
  --home-ink: var(--theme-ink);
  --home-muted: var(--theme-muted);
  --home-line: var(--theme-line);
  --home-teal: var(--theme-teal);
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --theme-page: #0e1419;
  --theme-panel: #172129;
  --theme-panel-raised: #1d2a33;
  --theme-panel-soft: #111b22;
  --theme-field: #101920;
  --theme-ink: #edf3f6;
  --theme-muted: #a8b5be;
  --theme-line: #374752;
  --theme-teal: var(--theme-primary);
  --theme-teal-soft: var(--theme-primary-soft);
  --theme-danger: #ff756b;
  --theme-danger-soft: #3b2223;
  --theme-warning-soft: #3a301d;
  --theme-success-soft: #17352e;
  --theme-info-soft: #172c43;
  --theme-purple-soft: #2b2342;
  --theme-shadow: 0 16px 38px rgba(0, 0, 0, 0.38);
  --page: var(--theme-page);
  --panel: var(--theme-panel);
  --ink: var(--theme-ink);
  --muted: var(--theme-muted);
  --line: var(--theme-line);
  --teal: var(--theme-teal);
  --accent: var(--theme-danger);
  --accent-dark: #ff9189;
  --gold: #f6bd60;
  --shadow: var(--theme-shadow);
  --home-page: var(--theme-page);
  --home-ink: var(--theme-ink);
  --home-muted: var(--theme-muted);
  --home-line: var(--theme-line);
  --home-teal: var(--theme-teal);
}

.app-theme-toggle {
  display: inline-grid;
  width: 38px;
  height: 38px;
  flex: 0 0 38px;
  padding: 0;
  border: 1px solid var(--theme-line);
  border-radius: 50%;
  place-items: center;
  background: var(--theme-panel-raised);
  color: var(--theme-teal);
  box-shadow: 0 5px 14px rgba(24, 32, 38, 0.12);
  cursor: pointer;
  transition: background-color 160ms ease, color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

.app-theme-toggle:hover,
.app-theme-toggle:focus-visible {
  background: var(--theme-teal-soft);
  box-shadow: 0 7px 18px rgba(22, 106, 217, 0.2);
  outline: none;
  transform: translateY(-1px);
}

.app-theme-icon {
  width: 19px;
  height: 19px;
}

:root[data-theme="light"] .app-theme-icon-sun,
:root[data-theme="dark"] .app-theme-icon-moon {
  display: none;
}

.app-theme-toggle.is-standalone {
  position: fixed;
  top: max(14px, env(safe-area-inset-top));
  right: 14px;
  z-index: 12500;
}

.app-theme-toggle.is-admin-sidebar {
  align-self: flex-start;
  margin: auto 8px 0;
  border-color: rgba(255, 255, 255, 0.24);
  background: rgba(255, 255, 255, 0.08);
  color: #e7f8f5;
  box-shadow: none;
}

:root[data-theme="dark"] body {
  background: var(--theme-page) !important;
  color: var(--theme-ink) !important;
}

:root[data-theme="dark"] body > header,
:root[data-theme="dark"] .home-header {
  border-color: var(--theme-line) !important;
  background: var(--theme-panel) !important;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24);
}

:root[data-theme="dark"] body > header .nav-actions,
:root[data-theme="dark"] body.nav-actions-fixed > header .nav-actions {
  border-color: var(--theme-line);
  background: var(--theme-panel-raised);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.24);
}

:root[data-theme="dark"] body > header .nav-actions > .nav-link:not(.app-back-link),
:root[data-theme="dark"] body > header .app-nav-group > .app-nav-group-trigger {
  color: var(--theme-primary) !important;
}

:root[data-theme="dark"] body > header .nav-actions > .nav-link:not(.app-back-link):hover,
:root[data-theme="dark"] body > header .nav-actions > .nav-link:not(.app-back-link):focus-visible,
:root[data-theme="dark"] body > header .nav-actions > .nav-link:not(.app-back-link).active {
  background: var(--theme-primary-solid);
  color: #ffffff !important;
}

:root[data-theme="dark"] body > header .app-back-link {
  color: #ff9189 !important;
}

:root[data-theme="dark"] body > header .app-back-link:hover,
:root[data-theme="dark"] body > header .app-back-link:focus-visible {
  background: #b53f3a;
  color: #ffffff !important;
}

:root[data-theme="dark"] body > header .app-nav-logo,
:root[data-theme="dark"] body > header .app-nav-submenu,
:root[data-theme="dark"] .app-user-dropdown,
:root[data-theme="dark"] .app-user-popover,
:root[data-theme="dark"] .owner-quick-links,
:root[data-theme="dark"] .pull-refresh-indicator,
:root[data-theme="dark"] .persistent-upload-panel,
:root[data-theme="dark"] .app-notification-card {
  border-color: var(--theme-line);
  background: var(--theme-panel-raised);
  color: var(--theme-ink);
}

:root[data-theme="dark"] body > header .app-nav-submenu {
  border-color: #3a505c;
  background: #18252e;
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.48);
}

:root[data-theme="dark"] body > header .app-nav-submenu .nav-link {
  color: #dce8ed !important;
}

:root[data-theme="dark"] body > header .app-nav-submenu .nav-link:hover,
:root[data-theme="dark"] body > header .app-nav-submenu .nav-link:focus-visible {
  background: var(--theme-primary-soft);
  color: var(--theme-primary) !important;
}

:root[data-theme="dark"] body > header .app-nav-submenu .nav-link.active {
  border-color: var(--theme-primary);
  background: var(--theme-primary-solid);
  color: #ffffff !important;
}

:root[data-theme="dark"] body > header .app-nav-group.is-active > .app-nav-group-trigger,
:root[data-theme="dark"] body > header .app-nav-group[open] > .app-nav-group-trigger {
  background: var(--theme-primary-solid);
  color: #ffffff !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.3);
}

@media (hover: hover) {
  :root[data-theme="dark"] body > header .app-nav-group:hover > .app-nav-group-trigger {
    background: var(--theme-primary-solid);
    color: #ffffff !important;
  }
}

:root[data-theme="dark"] :is(input, textarea, select, [contenteditable="true"]) {
  border-color: var(--theme-line) !important;
  background: var(--theme-field) !important;
  color: var(--theme-ink) !important;
  caret-color: var(--theme-teal);
}

:root[data-theme="dark"] :is(input, textarea)::placeholder {
  color: #81919c !important;
  opacity: 1;
}

:root[data-theme="dark"] :is(input, textarea, select, [contenteditable="true"]):disabled {
  background: #202a31 !important;
  color: #7f8d96 !important;
  opacity: 1;
}

:root[data-theme="dark"] :is(dialog, .modal, [class$="-dialog"], [class*="-dialog "]) {
  border-color: var(--theme-line) !important;
  background: var(--theme-panel-raised) !important;
  color: var(--theme-ink) !important;
}

:root[data-theme="dark"] dialog::backdrop {
  background: rgba(0, 0, 0, 0.66);
}

:root[data-theme="dark"] :is(table, th, td) {
  border-color: var(--theme-line) !important;
}

:root[data-theme="dark"] :is(th, thead td) {
  background: #203039 !important;
  color: var(--theme-ink) !important;
}

:root[data-theme="dark"] :is(td, tbody th) {
  background-color: var(--theme-panel) !important;
  color: var(--theme-ink);
}

:root[data-theme="dark"] :is(pre, code, .code-block) {
  border-color: var(--theme-line);
  background-color: #0b1115;
  color: #dce8ed;
}

:root[data-theme="dark"] :is(.button, button, a) {
  --focus-ring: rgba(125, 176, 255, 0.28);
}

:root[data-theme="dark"] :is(.status, .summary, .meta, .help, small, .form-hint) {
  color: var(--theme-muted);
}

:root[data-theme="dark"] :is(.admin-main, main) {
  color: var(--theme-ink);
}

:root[data-theme="dark"] .admin-sidebar {
  border-right: 1px solid var(--theme-line);
  background: #11191f;
}

:root[data-theme="dark"] .admin-menu a:hover,
:root[data-theme="dark"] .admin-menu button:hover {
  background: #203039;
}

:root[data-theme="dark"] :is(.error, .login-error, .has-error) {
  border-color: #71403d !important;
}

:root[data-theme="dark"] :is(.success, .is-complete, .completed) {
  border-color: #35685b;
}

:root[data-theme="dark"] :is(.owner-temp-usage, .persistent-upload-complete-message) {
  border-color: #315f55;
  background: var(--theme-success-soft);
  color: #7de2ce;
}

:root[data-theme="dark"] :is(.owner-cache-clear-button, .persistent-upload-cancel-all) {
  border-color: #71403d;
  background: var(--theme-danger-soft);
  color: #ff9a92;
}

:root[data-theme="dark"] .persistent-upload-heading {
  border-color: var(--theme-line);
  background: var(--theme-panel-soft);
}

:root[data-theme="dark"] .persistent-upload-track {
  background: #33424c;
}

:root[data-theme="dark"] .app-user-name,
:root[data-theme="dark"] .persistent-upload-item,
:root[data-theme="dark"] .persistent-upload-heading {
  border-color: var(--theme-line);
}

/* Choose videos uses separate tones for content, notes and task versions. */
:root[data-theme="dark"] .selected-video-form {
  border-color: #354b57;
  background: #16232b;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.28);
}

:root[data-theme="dark"] .selected-video-form label,
:root[data-theme="dark"] .selected-note-editor-label {
  color: #dce7ec;
}

:root[data-theme="dark"] .selected-video-form button,
:root[data-theme="dark"] .selected-social-form-row button,
:root[data-theme="dark"] .selected-note-save,
:root[data-theme="dark"] .selected-detected-links-save {
  border-color: var(--theme-primary);
  background: var(--theme-primary-solid);
  color: #ffffff;
}

:root[data-theme="dark"] .selected-video-form button:hover,
:root[data-theme="dark"] .selected-social-form-row button:hover,
:root[data-theme="dark"] .selected-note-save:hover,
:root[data-theme="dark"] .selected-detected-links-save:hover:not(:disabled) {
  border-color: var(--theme-primary);
  background: var(--theme-primary-solid-hover);
}

:root[data-theme="dark"] .form-message {
  color: var(--theme-primary);
}

:root[data-theme="dark"] .form-message.is-error {
  color: #ff9d96;
}

:root[data-theme="dark"] .selected-videos-summary {
  border-bottom-color: #334752;
  color: #aebdc5;
}

:root[data-theme="dark"] .selected-videos-sort {
  border-color: #3c5b62;
  background: #182730;
  color: var(--theme-primary);
}

:root[data-theme="dark"] .selected-videos-sort:hover {
  border-color: var(--theme-primary);
  background: var(--theme-primary-soft);
}

:root[data-theme="dark"] .selected-videos-sort.is-active {
  border-color: var(--theme-primary);
  background: var(--theme-primary-solid);
  color: #ffffff;
  box-shadow: 0 5px 14px rgba(19, 120, 111, 0.25);
}

:root[data-theme="dark"] .selected-category-filters label {
  border-color: #3b4e59;
  background: #18252e;
  color: #b8c6cd;
}

:root[data-theme="dark"] .selected-category-filters label:hover {
  border-color: #3eb9aa;
  background: #1c3434;
  color: #89e6d8;
}

:root[data-theme="dark"] .selected-category-filters label:has(input:checked) {
  border-color: var(--theme-primary);
  background: var(--theme-primary-soft);
  color: #9aeee1;
  box-shadow: inset 0 0 0 1px rgba(125, 176, 255, 0.12);
}

:root[data-theme="dark"] .selected-video-search input {
  border-color: #3b4e59 !important;
  background: #101920 !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.24);
}

:root[data-theme="dark"] .selected-video-search svg {
  color: #8fa1ab;
}

:root[data-theme="dark"] .selected-video-search:focus-within svg {
  color: #67d9ca;
}

:root[data-theme="dark"] .selected-videos-summary + .video-list .video-card {
  border-color: #354a56;
  background: #17242c;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.3);
}

:root[data-theme="dark"] .selected-videos-summary + .video-list .video-card:hover {
  border-color: #48616e;
}

:root[data-theme="dark"] .selected-videos-summary + .video-list .channel-logo-wrap {
  border-right-color: #344854;
  background: #111b22;
}

:root[data-theme="dark"] .selected-videos-summary + .video-list .channel-logo {
  border-color: #405762;
  background: #0d161c;
}

:root[data-theme="dark"] .selected-videos-summary + .video-list .rank {
  background: #27455b;
  color: #d8ecff;
  box-shadow: inset 0 0 0 1px #3e6480;
}

:root[data-theme="dark"] .selected-videos-summary + .video-list .channel {
  color: var(--theme-primary);
}

:root[data-theme="dark"] .selected-videos-summary + .video-list .video-title a {
  color: #f1f6f8;
}

:root[data-theme="dark"] .selected-videos-summary + .video-list .video-title a:hover {
  color: var(--theme-primary);
}

:root[data-theme="dark"] .selected-videos-summary + .video-list .views {
  color: #f3c768;
}

:root[data-theme="dark"] .selected-video-age {
  color: #74dcca;
}

:root[data-theme="dark"] .selected-saved-at {
  color: #95a7b1;
}

:root[data-theme="dark"] .selected-videos-summary + .video-list .prompt-copy-button {
  border-color: #37b7a8;
  background: #167b72;
  color: #ffffff;
}

:root[data-theme="dark"] .selected-videos-summary + .video-list .prompt-copy-button:hover {
  border-color: #67dccd;
  background: #1e9488;
}

:root[data-theme="dark"] .selected-card-icon-button,
:root[data-theme="dark"] .selected-note-button,
:root[data-theme="dark"] .selected-social-manage-button {
  border-color: #3eb9aa;
  background: #14272b;
  color: var(--theme-primary);
}

:root[data-theme="dark"] .selected-card-icon-button:hover,
:root[data-theme="dark"] .selected-note-button:hover,
:root[data-theme="dark"] .selected-social-manage-button:hover {
  border-color: #79e0d2;
  background: #1c403b;
  color: #b0f2e8;
}

:root[data-theme="dark"] .selected-category-tag {
  border-color: #356c63;
  background: #183a34;
  color: #8be6c8;
}

:root[data-theme="dark"] .selected-note-display {
  border-left-color: #d8a93d;
  background: #312b1c;
  color: #f0e3b4;
}

:root[data-theme="dark"] .selected-task-versions {
  border-left-color: #554d73;
  background: #211f2d;
  color: #ece8fa;
}

:root[data-theme="dark"] .selected-task-versions-count {
  color: #d8cff7;
}

:root[data-theme="dark"] .selected-task-version-list {
  scrollbar-color: #756a99 #171622;
}

:root[data-theme="dark"] .selected-task-version-list::-webkit-scrollbar-track {
  background: #171622;
}

:root[data-theme="dark"] .selected-task-version-list::-webkit-scrollbar-thumb {
  background: #756a99;
}

:root[data-theme="dark"] .selected-task-version {
  border-color: #4b4563;
  background: #292638;
  color: #eeeaf9;
}

:root[data-theme="dark"] .selected-task-version:hover {
  border-color: #8f7fd0;
  background: #332e48;
}

:root[data-theme="dark"] .selected-task-version-user {
  color: #87e4d7;
}

:root[data-theme="dark"] .selected-task-version-status.is-completed {
  background: #1b3c32;
  color: #91e8c2;
}

:root[data-theme="dark"] .selected-task-version-status.is-working {
  background: #44351c;
  color: #f6ce74;
}

:root[data-theme="dark"] .selected-task-version-channel {
  color: #a9c9d3;
}

:root[data-theme="dark"] .selected-task-version-date,
:root[data-theme="dark"] .selected-task-version-empty {
  color: #aaa7bc;
}

:root[data-theme="dark"] .selected-social-links {
  border-top-color: #334752;
  background: #111b22;
}

:root[data-theme="dark"] .selected-social-link {
  border-color: #3b4e59;
  background: #18252e;
  color: var(--theme-primary);
}

:root[data-theme="dark"] .selected-social-links .selected-social-link {
  background: transparent;
}

:root[data-theme="dark"] .selected-social-delete {
  color: #ff8f87;
}

:root[data-theme="dark"] .selected-social-delete:hover {
  background: #422529;
}

:root[data-theme="dark"] .selected-social-icon-fallback {
  background: #24413f;
  color: #8ce8da;
}

:root[data-theme="dark"] .selected-video-delete {
  border-color: #17242c;
  background: #c84740;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
}

:root[data-theme="dark"] .selected-video-delete:hover {
  border-color: #17242c;
  background: #e05a52;
}

:root[data-theme="dark"] .selected-note-dialog {
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.58);
}

:root[data-theme="dark"] .selected-note-dialog-header {
  border-bottom-color: #3a4c57;
}

:root[data-theme="dark"] .selected-note-dialog h2 {
  color: #f2f7f9;
}

:root[data-theme="dark"] .selected-note-dialog-close {
  color: #aebdc5;
}

:root[data-theme="dark"] .selected-note-dialog-close:hover {
  background: #293944;
  color: #ffffff;
}

:root[data-theme="dark"] .selected-note-presets button {
  border-color: #456b65;
  background: #1a3834;
  color: #91e8dc;
}

:root[data-theme="dark"] .selected-note-presets button:hover {
  border-color: #67d9ca;
  background: #245047;
}

:root[data-theme="dark"] .selected-note-toolbar {
  border-color: #3a4d58;
  background: #142029;
}

:root[data-theme="dark"] .selected-note-toolbar select,
:root[data-theme="dark"] .selected-note-toolbar button,
:root[data-theme="dark"] .selected-note-cancel {
  border-color: #40535e;
  background: #1b2a33;
  color: #dce7ec;
}

:root[data-theme="dark"] .selected-note-toolbar button:hover,
:root[data-theme="dark"] .selected-note-cancel:hover {
  border-color: var(--theme-primary);
  background: #203b39;
  color: #8ce8da;
}

:root[data-theme="dark"] .selected-note-editor {
  border-color: #3a4d58;
  background: #101920;
  color: #edf3f6;
}

:root[data-theme="dark"] .selected-category-preview {
  border-color: #3d515c;
  background: #142029;
}

:root[data-theme="dark"] .selected-category-preview img {
  background: #0c1419;
}

:root[data-theme="dark"] .selected-category-dialog.is-required .selected-category-preview {
  border-color: #3d8a7f;
  background: #17352f;
}

:root[data-theme="dark"] .selected-category-dialog.is-required .selected-category-preview span {
  color: #8ce8d9;
}

:root[data-theme="dark"] .selected-category-options label,
:root[data-theme="dark"] .selected-detected-link-row {
  border-color: #3b4e59;
  background: #18252e;
  color: #dce7ec;
}

:root[data-theme="dark"] .selected-category-options label:hover,
:root[data-theme="dark"] .selected-category-options label:has(input:checked),
:root[data-theme="dark"] .selected-detected-link-row:hover {
  border-color: var(--theme-primary);
  background: #1b3b37;
  color: #93eadc;
}

:root[data-theme="dark"] .selected-detected-link-platform {
  color: #a6b5bd;
}

:root[data-theme="dark"] .selected-detected-link-username {
  color: #81e2d4;
}

:root[data-theme="dark"] .selected-social-empty {
  border-color: #465963;
  background: #131e25;
  color: #a6b5bd;
}

@media (max-width: 1100px) {
  :root[data-theme="dark"] .selected-note-display {
    border-top-color: #d8a93d;
  }

  :root[data-theme="dark"] .selected-task-versions {
    border-top-color: #554d73;
  }
}

/* Home uses distinct surfaces and status colors for quick scanning. */
:root[data-theme="dark"] .home-main {
  color: #edf4f7;
}

:root[data-theme="dark"] .home-user-filters {
  border-color: #34505d;
  background: #142129;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.2);
}

:root[data-theme="dark"] .home-user-filters-label {
  color: #c8d7de;
}

:root[data-theme="dark"] .home-user-filter-option {
  border-color: #3c515d;
  background: #1b2a33;
  color: #d5e1e6;
}

:root[data-theme="dark"] .home-user-filter-option:hover {
  border-color: #3eb9aa;
  background: #203a3a;
  color: #8ce8d9;
}

:root[data-theme="dark"] .home-user-filter-option:has(input:checked) {
  border-color: var(--theme-primary);
  background: var(--theme-primary-soft);
  color: #9aeee1;
  box-shadow: inset 0 0 0 1px rgba(125, 176, 255, 0.16);
}

:root[data-theme="dark"] .task-summary-section + .task-summary-section {
  border-top-color: #2d414c;
}

:root[data-theme="dark"] .section-heading h2 {
  color: #f2f7f9;
}

:root[data-theme="dark"] .section-heading p {
  color: #9fb0ba;
}

:root[data-theme="dark"] .section-count {
  border: 1px solid #315f58;
  background: #17352e;
  color: #89e4c7;
}

:root[data-theme="dark"] .completed-section > summary {
  border-radius: 7px;
  transition: background-color 160ms ease, padding 160ms ease;
}

:root[data-theme="dark"] .completed-section > summary:hover,
:root[data-theme="dark"] .completed-section > summary:focus-visible {
  background: #152129;
  outline: none;
}

:root[data-theme="dark"] .completed-section > summary::after {
  color: #79ddd0;
}

:root[data-theme="dark"] .version-item {
  border-color: #344955;
  border-left-color: #5596ef;
  background: #17242c;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.24);
  transition: border-color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

:root[data-theme="dark"] .version-item:hover {
  border-color: #49616e;
  border-left-color: #75adf4;
  background: #1a2a33;
  transform: translateY(-1px);
}

:root[data-theme="dark"] .version-item.capcut_ready {
  border-color: #514774;
  border-left-color: #a78bfa;
  background: #211e30;
}

:root[data-theme="dark"] .version-item.capcut_ready:hover {
  border-color: #6b5c96;
  border-left-color: #c4b5fd;
  background: #28233a;
}

:root[data-theme="dark"] .version-item.completed {
  border-color: #315f55;
  border-left-color: #42c995;
  background: #162923;
}

:root[data-theme="dark"] .version-item.completed:hover {
  border-color: #427568;
  border-left-color: #6ee7b7;
  background: #1a312a;
}

:root[data-theme="dark"] .version-thumbnail {
  border-color: #435864;
  background: #0f181e;
  box-shadow: 0 5px 14px rgba(0, 0, 0, 0.24);
}

:root[data-theme="dark"] .version-thumbnail span {
  color: #91a2ac;
}

:root[data-theme="dark"] .version-name {
  color: #f3f7f9;
}

:root[data-theme="dark"] .version-name:hover {
  color: #8de8da;
}

:root[data-theme="dark"] .priority-mark {
  color: #f6bd60;
  text-shadow: 0 0 12px rgba(246, 189, 96, 0.38);
}

:root[data-theme="dark"] .workflow-badge {
  border-color: #466c9a;
  background: #192f49;
  color: #a8ccff;
}

:root[data-theme="dark"] .workflow-badge.capcut_ready {
  border-color: #66568e;
  background: #30284a;
  color: #d0c3ff;
}

:root[data-theme="dark"] .workflow-badge.completed {
  border-color: #407564;
  background: #1b3c32;
  color: #91e8c2;
}

:root[data-theme="dark"] .version-title {
  color: #d8e3e8;
}

:root[data-theme="dark"] .version-meta {
  color: #a9b8c1;
}

:root[data-theme="dark"] .version-meta strong {
  color: #dce6ea;
}

:root[data-theme="dark"] .version-note {
  border-left-color: #d8a93d;
  color: #eadba9;
}

:root[data-theme="dark"] .version-note span {
  color: #f6c968;
}

:root[data-theme="dark"] .version-actions a {
  border-color: #435864;
  background: #132028;
  color: #d9e5ea;
}

:root[data-theme="dark"] .version-actions .script-version-action {
  border-color: #466c9a;
  background: #192f49;
  color: #afd1ff;
}

:root[data-theme="dark"] .version-actions .capcut-version-action {
  border-color: #66568e;
  background: #30284a;
  color: #d0c3ff;
}

:root[data-theme="dark"] .version-actions .script-version-action:hover {
  border-color: #75a8ef;
  background: #315f9e;
  color: #ffffff;
}

:root[data-theme="dark"] .version-actions .capcut-version-action:hover {
  border-color: #a58af0;
  background: #6548ad;
  color: #ffffff;
}

:root[data-theme="dark"] .version-actions .open-version {
  border-color: #3eb9aa;
  background: #16877c;
  color: #ffffff;
  box-shadow: 0 5px 14px rgba(22, 135, 124, 0.25);
}

:root[data-theme="dark"] .version-actions .open-version:hover {
  border-color: #79e0d2;
  background: #20a092;
  color: #ffffff;
}

:root[data-theme="dark"] :is(.empty-state, .home-error) {
  border-color: #435864;
  background: #131e25;
  color: #a9b8c1;
}

:root[data-theme="dark"] .home-error {
  border-color: #7a4542;
  background: #3b2223;
  color: #ffaaa3;
}

/* Tasks keeps status colors distinct without reusing light surfaces in dark mode. */
:root[data-theme="dark"] .upcoming-publishes {
  border-color: #315f58;
  border-left-color: var(--theme-primary);
  background: #152d29;
  box-shadow: 0 10px 28px rgba(0, 0, 0, 0.24);
}

:root[data-theme="dark"] .upcoming-publish-item {
  border-top-color: #315f58;
  color: var(--theme-ink);
}

:root[data-theme="dark"] .upcoming-publish-channel,
:root[data-theme="dark"] .task-user-filter-option,
:root[data-theme="dark"] .button,
:root[data-theme="dark"] .video-open-button,
:root[data-theme="dark"] .archive-version-button {
  border-color: var(--theme-line);
  background: #18252e;
  color: #dce8ed;
}

:root[data-theme="dark"] .task-user-filters,
:root[data-theme="dark"] .filter-group,
:root[data-theme="dark"] .task-view-controls {
  border-color: #3a4d58;
  background: #142029;
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.2);
}

:root[data-theme="dark"] .task-user-filter-option:hover,
:root[data-theme="dark"] .task-user-filter-option:has(input:checked),
:root[data-theme="dark"] .parent-filter-button.parent-active:not(.active) {
  border-color: #3eb9aa;
  background: #1b3b37;
  color: var(--theme-primary);
}

:root[data-theme="dark"] .filter-button.active,
:root[data-theme="dark"] .page-button.active {
  border-color: var(--theme-primary);
  background: var(--theme-primary-solid);
  color: #ffffff;
}

:root[data-theme="dark"] .button.primary {
  border-color: #d95850;
  background: #bd3f38;
  color: #ffffff;
}

:root[data-theme="dark"] .button.primary:hover:not(:disabled) {
  border-color: #ef6c63;
  background: #d44d45;
}

:root[data-theme="dark"] .button.danger {
  border-color: #b94b4b;
  background: #8f3032;
  color: #ffffff;
}

:root[data-theme="dark"] .button.danger:hover:not(:disabled) {
  border-color: #d06060;
  background: #a83a3d;
}

:root[data-theme="dark"] .put-back-button {
  border-color: var(--theme-primary);
  background: var(--theme-primary-solid);
  color: #ffffff;
}

:root[data-theme="dark"] .put-back-button:hover:not(:disabled) {
  border-color: var(--theme-primary);
  background: var(--theme-primary-solid-hover);
  color: #ffffff;
}

:root[data-theme="dark"] .detail-toggle i {
  border-color: #4b5d68;
  background: #3a4953;
}

:root[data-theme="dark"] .detail-toggle i::after {
  background: #dce8ed;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.38);
}

:root[data-theme="dark"] .detail-toggle input:checked + i {
  border-color: var(--theme-primary);
  background: var(--theme-primary-solid);
}

:root[data-theme="dark"] .task-card {
  border-color: #354752;
  background: #172129;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.28);
}

:root[data-theme="dark"] .task-header-thumbnail,
:root[data-theme="dark"] .versions-table-wrap {
  border-color: #3a4d58;
  background: #101920;
}

:root[data-theme="dark"] .asset-pill,
:root[data-theme="dark"] .script-box {
  border-color: #344751;
  background: #111b22;
  color: var(--theme-muted);
}

:root[data-theme="dark"] .version-row:hover td {
  background: #203b35 !important;
}

:root[data-theme="dark"] .version-row:hover .version-name {
  color: #9be8d9;
}

:root[data-theme="dark"] .version-note-row td {
  background: #282417 !important;
}

:root[data-theme="dark"] .version-note {
  border-left-color: #d7a928;
  background: #352f1c;
  color: #f4d98d;
}

:root[data-theme="dark"] .version-note-label {
  background: #9b7214;
  color: #fff8dd;
}

:root[data-theme="dark"] .script-view-button {
  border-color: #8b6de0;
  background: #30284a;
  color: #c7b7ff;
}

:root[data-theme="dark"] .capcut-view-button,
:root[data-theme="dark"] .video-open-button {
  border-color: #3eb9aa;
  background: #17352f;
  color: var(--theme-primary);
}

:root[data-theme="dark"] .video-understanding-button {
  border-color: #548bdc;
  background: #192f49;
  color: #9fc5ff;
}

:root[data-theme="dark"] .script-view-button:hover {
  border-color: #a58af0;
  background: #6548ad;
  color: #ffffff;
}

:root[data-theme="dark"] .capcut-view-button:hover,
:root[data-theme="dark"] .video-open-button:hover {
  border-color: var(--theme-primary);
  background: var(--theme-primary-solid);
  color: #ffffff;
}

:root[data-theme="dark"] .video-understanding-button:hover {
  border-color: #75a8ef;
  background: #315f9e;
  color: #ffffff;
}

:root[data-theme="dark"] .text-flag.yes,
:root[data-theme="dark"] .status-badge.completed {
  border-color: #35685b;
  background: #17352e;
  color: #82e2bc;
}

:root[data-theme="dark"] .text-flag.no {
  border-color: #74404b;
  background: #3a2228;
  color: #ff9eae;
}

:root[data-theme="dark"] .priority-flag,
:root[data-theme="dark"] .status-badge.script_pending {
  border-color: #725f2d;
  background: #392f1c;
  color: #f2cf72;
}

:root[data-theme="dark"] .status-badge.script_ready {
  border-color: #365d8b;
  background: #172c43;
  color: #9fc5ff;
}

:root[data-theme="dark"] .status-badge.capcut_ready {
  border-color: #5b4c83;
  background: #2b2342;
  color: #c7b7ff;
}

:root[data-theme="dark"] .archive-version-button:not(:disabled):hover {
  border-color: #3eb9aa;
  background: #1b3b37;
  color: var(--theme-primary);
}

@media (max-width: 760px) {
  .app-theme-toggle {
    width: 36px;
    height: 36px;
    flex-basis: 36px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .app-theme-toggle {
    transition: none;
  }
}